/* 
 *	 CSS LAYOUT AREA 
 */

body {
    font-family: "微软雅黑","微軟正黑體", Arial, sans-serif;
    color: #000;
    font-size: 16px;
    background-color: #fff;
	line-height:1.6;
}
/*body.zhcn {
    
}
body.zhtw {
    font-family: "微軟正黑體","微软雅黑", Arial, sans-serif;
}*/
.fw{color:#fff;}
.fw:hover{color:#000}
.display-none {
    display: none;
}

.visibility-none {
    visibility: hidden;
}
.owl-carousel{
    z-index: unset;
}

i { padding-left:4px;padding-right:8px; color:#407ae5; }

a {   color: #407ae5;    text-decoration: none;}
a:hover, a:focus {    color: #407ae5;    text-decoration: underline;}

img {max-width:100%;}

.row-block:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.row-block.inline {display:inline-block;}
.row-block.work-photo-area{
    width: 100%;
    column-count:1;
    overflow: hidden;



}
.row-block.work-photo-area .img-box{
    position: relative;
    break-inside: avoid-column;
    break-inside: avoid;
    word-wrap: keep-all;
    -webkit-column-break-inside: avoid; /* Chrome, Safari */
    page-break-inside: avoid;           /* Theoretically FF 20+ */
    break-inside: avoid-column;         /* IE 11 */


}

.vcode-aree{
    margin-top: 10px;
}


.modal-dialog{
    top:50px;
}
@media screen and (min-width: 540px){
    .row-block.work-photo-area{
        column-count: 2;
        column-gap: 10px;
    }
}
@media screen and (min-width: 768px){
    .row-block.work-photo-area{
        column-count: 3;
        column-gap: 10px;
    }
    .vcode-aree{
        margin-top: 0px;
    }
}
@media screen and (min-width: 992px){
    .row-block.work-photo-area{
        column-count: 2;
        column-gap: 10px;
    }
}
.fileUpload {
    position: relative;
    overflow: hidden;
    margin: 5px 0px;
}
.fileUpload input.upload {
    position: absolute;
    top: 0;
    right: 0;
    margin: 0;
    padding: 0;
    font-size: 20px;
    cursor: pointer;
    opacity: 0;
    filter: alpha(opacity=0);
}

span.inline {display:inline-block;}

#page-container,#main-container,#page-content + footer {    min-width: 320px;}
#page-container {
    width: 100%;padding: 0;margin: 0 auto;overflow-x: hidden;
    -webkit-transition: background-color 0.2s ease-out, opacity 0.3s ease-out;
    transition: background-color 0.2s ease-out, opacity 0.3s ease-out;
}
#sidebar {position: fixed;    width: 0;    overflow: hidden;	right: 0;	background-color: #394263;}
#sidebar,#main-container { -webkit-transition: all 0.2s ease-out;    transition: all 0.2s ease-out;}
#page-content { padding: 10px 5px 1px;    background-color: #eaedf1;}

/*.site-logo-box {
    position: relative;
    z-index: 1;
    min-width:248px;
	background: url('../img/layout/logo-box-bg.png') no-repeat 100% 50% #ffffff; 
	padding-top:6px; padding-bottom:6px; padding-left:8px}
.menu-bar { background: url('../img/layout/menu-bar-bg.png') repeat-y 50% 50%; border-bottom:1px solid #5979b4;    z-index: 10;}

*/
/* Site Nav */
/*nav ul {    list-style: none;}
.site-nav { overflow-y: visible;    border:0px solid #000000;   margin: 0px;      margin-right: 0;    position: relative; height: 79px;}
.site-nav:after {
    content: '';
    display: block;
    clear: both;
}
.site-nav-xs { margin-right:-15px; height: auto;}
.site-nav.site-nav-xs a{padding: 15px 18px 14px; font-size:18px;}
.site-nav li {	float: right;	padding: 0;	margin-left: 0px;	position: relative; height: 100%;}
.site-nav li:after{
    content: '';
    display: none;
    width: 100%;
    position: absolute;
    height: 5px;
    bottom:0;
    background:rgba(0,0,0,0.3)
}
.site-nav.site-nav-xs > li {
    background: url('../img/layout/hesder-bg_2x.png') left repeat-y;
    background-size: 62px auto;
}
.site-nav.site-nav-xs > li.lang{
    display: none;
    background: #5979B4;
    position: relative;
}
.site-nav.site-nav-xs > li.lang:after{
    content:'';
    display: block;
    width: 1px;
    right: 0;
    top: 13px;
    height: 33px;
    background: rgba(255,255,255,0.15);
}
.site-nav.site-nav-xs > li.lang a{
    font-size: 17px;
    color: #cbeaf7;
    padding:15px 22px 14px;

}


.site-nav a {		margin: 0;	color: #fff;	padding:27px 14px 25px; font-size:17px;	display:block;}
.site-nav i { color: #fff;	}
.site-nav > li a:hover,.site-nav > li a:focus {	color: #fff;text-decoration: none;}
.site-nav li.spec-area{
    min-width: 40px;
}
.site-nav li.spec-area:hover:after,.site-nav li.lang-area:hover:after { display: none;	} 
.site-nav li .spec-area {
    background: url('../img/layout/login_bg.png') left no-repeat;
    background-size: auto 79px;
    padding: 27px 40px 26px;
    text-align: center;
    color: #cbeaf7;
    height: 100%;

}
.site-nav li .spec-area a {		margin: 0;		padding:0px; 
    color: #cbeaf7;	display:inline;}
.site-nav li .spec-area a:hover {	text-decoration: none;	border-left:0px solid rgba(0,0,0,0.1);	}
.site-nav li.lang-area{
    background: url('../img/layout/lag_bg.png') left no-repeat;
    z-index: 1;
    float: none;
    position: absolute;
    right: -85px;
    width: 140px;
    padding-left: 40px;

}
.site-nav li.lang-area a{
    padding: 27px 0 25px;
    color:  #fff;
    width: 40px;
}


.site-nav a.active,.site-nav li.active > a {	color: #fff;}
.site-nav li:hover > ul {display: block; }
.site-nav li.active > a {	border-radius: 3px;}
.site-nav i.site-nav-arrow {margin: 0 -20px 0 0;}
.site-nav ul {    display: none;    position: absolute;    padding: 3px 0;    margin-top: 1px;    min-width: 160px;    background-color: #ffffff;    -webkit-box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2);    box-shadow: 0 0px 2px rgba(0, 0, 0, 0.2);    z-index: 10;}
.site-nav ul:after{
    top: -1px;
    content: '';
    display: block;
    position: absolute;
    width: 100%;
    height:2px;
    background: transparent;
}
.site-nav ul li {	float: none;	margin: 0;	padding: 1px 3px;}
.site-nav ul a {	color: #333333;	background:#ffffff;	border-left: 0px solid rgba(0,0,0,0.1);	padding-top:7px;	padding-bottom:7px;}
.site-nav ul a:hover {	background-color: #eeeeee; color:#333333;}
.site-nav ul a.active,.site-nav ul a.active:hover {	background-color: #454545;}

*/

	.home-news-bg {padding-bottom: 30px;}
.news-list .news-item {padding-top:14px; padding-bottom:14px; }
.news-list>.news-item+.news-item {border-top:1px dashed #c5c5c5;}
.news-list .news-item .date-box {color:#407ae5; padding-bottom:3px;padding-right:10px;padding-left:5px;}
.news-list .news-item .item-icon {display:inline-block; padding-left:10px;}
.news-list a {   color: #5c6873;    text-decoration: none;}
.news-list a:hover,.news-list a:focus {    color: #5c6873;    text-decoration: underline;}
.news-detail  .date-box {color:#407ae5; margin-top:15px;margin-bottom:20px; }
.news-detail  h1 {font-size:28px; color:#000;}
.more-box-r {text-align:right;}
.more-box-c {text-align:center;}
.more-box-l {text-align:left;}

.more-box-spec-r {    text-align: right;
    margin-top: -27px;
   bottom: 1px;
    right: 0px;
    position: absolute;}
.more-box-spec-r a {    display: inline-block;
    background: url('../img/layout/more-bg-01.png') repeat-y 100% 50%;
    padding-left: 35px;
    padding-right: 5px;}
	
.more-box-spec2-r {    text-align: right;
    margin-top: -27px;
   bottom: 1px;
    right: 0px;
    position: absolute;}
.more-box-spec2-r a {display: inline-block;
    background: url('../img/layout/more-bg-01.png') repeat-y 50% 50%;
    padding-left: 25px; padding-bottom:5px;
    padding-right: 5px;}

.detail-more-content{ position: relative;}
	
	
.breadcrumbs {font-size:13px;color: #5c6873; padding-top:10px; padding-bottom:15px;}
.breadcrumbs a {display:inline-block; padding-right:5px;padding-left:5px; color: #5c6873;text-decoration: none;}
.breadcrumbs a:hover,.breadcrumbs  a:focus {color: #407ae5;text-decoration: underline;}
.breadcrumbs .path-alert {color:#407ae5;display:inline-block; padding-right:5px;padding-left:5px;}

.content-box-01{ padding-top:20px; padding-bottom:20px;}
.content-box-02{ padding-top:10px; padding-bottom:10px;}

.img-box{ border:1px solid #5979b4; padding:7px; border-radius: 8px; text-align:center;margin-bottom:8px;}
.img-box  img{ border-radius:8px;}
.inline-box {display:inline-block;}

.img-box.contestants-user{ padding:7px 15px;  text-align:left;}
.user-box-03 .contestants-user p { text-align:left;}
.user-box-03 .contestants-user p.slogan {height:52px;}
.user-box-03.contestants-user p { text-align:left;}
.user-box-03.contestants-user p.slogan {height:52px;}
.user-box-03.contestants-user a {color:#000000;}

.contact-box { border:1px solid #afc2e6;  border-radius: 8px;  padding:5px; text-align:center;margin-bottom:8px;}

#main-content .container .contact-box img {max-width:36%;}
#main-content .container .contact-box img.logo {max-width:60%;}
.contact-unit {font-size:20px;  line-height: 1.3;  color:#000000; margin-top:8px; margin-bottom:10px;}
.contact-title {color:#407ae5; }
.contact-box a:hover,.contact-box  a:focus{    text-decoration: none;}
.contact-box:hover { border:1px solid #5979b4; }
.contact-detail span {padding-right:20px;}
.user-box-01 {  text-align:center;/* display:inline-block;padding-left:3%; padding-right:3%;*/ padding-top:20px; padding-bottom:20px;}
.user-box-01.small-padding {padding-left:1.5%; padding-right:1.5%;}
.user-box-01 .img-box{ border-color:#5979b4; display:inline-block;}
.user-box-01:hover .img-box { border:1px solid #afc2e6; }
.user-box-01 .user-name {font-size:21px;  line-height: 1.3;  color:#000000;}
.user-box-01 .user-title {font-size:14px;    margin-top: 5px; }

.user-box-02 { margin-bottom:30px; position: relative;}
.user-box-02 .img-box{border-color:#afc2e6;}
.user-box-02:hover .img-box { border:1px solid #5979b4; }
.user-box-02 p{padding:0px;margin:0px; margin-bottom:5px;}
.user-box-02 .user-title {color:#407ae5; }
.user-box-02 .user-name {font-size:26px; line-height: 1.3; padding-top:6px; color:#000000;}

.user-box-03 { margin-bottom:30px;}
.user-box-03 .img-box{border-color:#afc2e6;}
.user-box-03:hover .img-box { border:1px solid #5979b4; }
.user-box-03 p{padding:0px;margin:0px; margin-bottom:2px; text-align:center;}
.user-box-03 .user-title {color:#407ae5; }
.user-box-03 .user-name {font-size:18px; line-height: 1.3; padding-top:6px;color:#000000;}

.product-box-01 { margin-bottom:30px;}
.product-box-01 .img-box{border-color:#afc2e6;}
.product-box-01:hover .img-box { border:1px solid #5979b4; }
.product-box-01 p{padding:0px;margin:0px; margin-bottom:2px;}
.product-box-01 .product-title { font-size:14px;color: #5c6873;height:90px; overflow:hidden;  }
.product-box-01 .product-name {padding-top:6px;color:#000000;height:57px ; overflow:hidden;}
table.tech_doc_list {
width:100%;
border-collapse: separate;
border-spacing: 1px;
background-color:#cccccc;
line-height:1.7;
}
 table.tech_doc_list  ul {margin:0px; padding:0 0 0 20px;}
 table.tech_doc_list th {background-color: #eeeeee; color: #525252;}
 table.tech_doc_list td {padding:5px 5px;background: #ffffff;vertical-align: top;}
 table.tech_doc_list th {padding:5px 5px;}

 table.tech_doc_list tbody.coreboard_type_1 td {background: #e7fcff;}
 table.tech_doc_list tbody.coreboard_type_2 td {background: #dff9f0;}
 table.tech_doc_list tbody.coreboard_type_3 td {background: #fbf3dd;}
 table.tech_doc_list tbody.coreboard_type_4 td {background: #fbeaee;}   
 
 .little-title h3 {font-size:18px; color:#000;}

.media-box-01 { margin-bottom:30px;}
.media-box-01 .video-box{border:1px solid #afc2e6; padding:7px; border-radius: 8px; text-align:center;margin-bottom:8px; }
.media-box-01:hover .media-box { border:1px solid #5979b4; }
.media-box-01 p{padding:0px;margin:0px; margin-bottom:2px; text-align:center;}
.media-box-01 .media-date {color:#407ae5; }
.media-box-01 .media-name {font-size:18px; line-height: 1.3; padding-top:6px;color:#000000;}

.works-box-01 { margin-bottom:30px;}
.works-box-01 .img-box{border-color:#afc2e6;}
.works-box-01 .img-box:hover { border:1px solid #5979b4; }
.works-box-01 p{padding:0px;margin:0px; margin-bottom:2px; }
.works-box-01 .user-title {color:#407ae5; }
.works-box-01 .user-name {font-size:18px; line-height: 1.3; padding-top:6px;color:#000000;}



.brand-row {margin-bottom:40px;}
.brand-row i {color:#5c6873;}
.brand-box-01 { margin-bottom:30px;}
.brand-box-01 .img-box{border-color:#afc2e6;}
.brand-box-01:hover .img-box { border:1px solid #5979b4; }
.brand-box-01 p{padding:0px;margin:0px; margin-bottom:8px;}
.brand-box-01 .brand-title span{display:inline-block; margin-right:8px;}
.brand-box-01 .brand-name {font-size:26px; line-height: 1.3; padding-top:0px;  color:#000000;}
.brand-box-01 .img-box {margin-top:5px;}


.pic-box-01 { margin-top:5px;border:1px solid #5979b4; background:#fff; text-align:center; padding:7px; border-radius: 8px;}
.pic-box-02 { margin-top:5px;border:1px solid #5979b4; background:#fff; text-align:left; padding:7px; border-radius: 8px;}
.pic-box-02 img {margin-left:4px;margin-right:4px;    margin: 5px;}
.pic-box-02 a:hover {text-decoration: none;}
.pic-box-03 { margin-top:5px;border:1px solid #5979b4; background:#fff; text-align:left; padding:7px; border-radius: 8px;}
.pic-box-03 a:hover {text-decoration: none;}
.pic-box-03 img {margin:4px;}
.a-center { text-align: center;}

.slider-area{margin:0px auto; text-align:center;background:url('../img/layout/unit-banner-bg-01.png') repeat 0% 0%; border-top:1px solid #fff; border-bottom:1px solid #d3d3d3; }
#homeImageShowCase {max-width:1140px;margin:20px auto; border:5px solid #fff;box-shadow:0px 0px 8px rgba(20%,20%,20%,0.4);}
#homeImageShowCase div img {}

/* home area */
.home-area .container{   padding-top:32px; padding-bottom:36px; }
.home-area-01 {background:#fff; border-bottom:1px solid #e0e0e0;}
.home-area-01 a {   color: #5c6873;    text-decoration: none;}
.home-area-01 a:hover,.home-area-01 a:focus {    color: #5c6873;    text-decoration: underline;}
.home-area-02 {background:#f7f7f7; border-bottom:1px solid #e0e0e0; }
.home-area .container.home-area-bg-02 {}

.home-title-01 {text-align:center;margin-top:12px;margin-bottom:30px;}
.home-title-01 h3 {display:inline-block;margin:0px;}
.home-title-01 h3.title {font-size:24px;}
.home-title-01 h3.title-en {font-size:18px;vertical-align:2px; line-height:24px;color:#407ae5;  padding-left:3px; padding-right:8px;  font-family: Arial, sans-serif;background:url('../img/layout/home-title-01-bg.png') no-repeat 100% 100%;     }


.home-title-02 {font-size:18px; text-align:center;margin-top:-4px;margin-bottom:20px; background:url('../img/layout/home-title-02-bg.png') no-repeat 50% 50%; }
.home-title-02 span{display:inline-block;background:#dadada; padding-left:5px;padding-right:5px;}
.home-intro-title {padding-top:20px;text-align:right;}
.home-intro-title .more-box-r  {margin-top: -15px;}
.home-intro-content {padding-top:20px;line-height:1.7;position: relative;}
.home-awards p{ padding-top: 15px;    padding-bottom: 0px; margin:0px;    text-align: center;}
.home-awards p.title {font-size:24px; color:#79A2ED;}
.home-awards p.title span{display:inline-block;background:#5979B4; font-size:15px; color:#fff; padding:5px 8px; margin-left:8px; line-height:1;border-radius: 5px;}
.home-awards p img {    margin-left: 0px;    margin-top: -11px;}
.home-org p {padding:0px; margin:0px;}
.home-awards .img-box img {width:120px;height:120px;}


/* spec area */

#main-content .container img {max-width:100%; height:auto;}
.unit-banner-01 {height:206px; border-bottom:1px solid #e8e8e8; background:url('../img/layout/unit-banner-bg-01.png') repeat;}

.unit-menu-nav-01.nav-tabs {border-bottom: 1px solid #407ae5;}
.nav-tabs-xs{
    position: relative;
    display: block;
}


.nav-tabs-xs{
    margin-top: 15px;
    width: 100%;
    margin-bottom: 15px;
}

.nav-tabs-xs ul{
    width: 100%;
    display: table;
    padding: 0;
    border: 1px solid #407ae5;
    border-radius: 5px;
    overflow: hidden;
}
.nav-tabs-xs ul:after {
    content: '';
    display: block;
    clear: both;
}
.nav-tabs-xs ul li{
    display: table-cell;
    text-align:center;
}
.nav-tabs-xs ul li + li{
    border-left:1px solid #407ae5;
}


.nav-tabs-xs ul li.active{
    background: #407ae5;
}
.nav-tabs-xs ul li.active a{
    color: #FFF;
}
.nav-tabs-xs ul li a{
    padding: 3px 0;
    display: block;
    color: #5c6873;
    font-size: 14px;
}
.nav-tabs-xs ul li a:hover,.nav-tabs-xs ul li a:active{
    text-decoration: none;
}


.unit-menu-nav-01.nav-tabs>li.active>a, .unit-menu-nav-01.nav-tabs>li.active>a:hover, .unit-menu-nav-01.nav-tabs>li.active>a:focus {	border: 1px solid #407ae5; border-bottom-color: transparent; margin-right:5px;    color: #407ae5;}
.unit-menu-nav-01.nav-tabs>li>a:hover {border-color: #eee #eee #afc2e6;}
.unit-menu-nav-01.nav>li>a:hover, .unit-menu-nav-01.nav>li>a:focus {text-decoration: none;background-color: #fff;}
.unit-menu-nav-01 .nav-end {text-align:right; margin: 0px; width:10px;}
.unit-menu-nav-01 .nav-end img {margin-bottom:-57px; text-align:right;}
.unit-title-01 {font-size: 24px;}
.unit-title-01-en {font-size: 18px;font-family: Arial, sans-serif;color:#407ae5; margin: 0px;margin-top: 8px;padding: 2px 0px 0px 5px;}

.unit-menu-nav-01 a {color: #9c9ea2;text-decoration: none;} 
.unit-menu-nav-01 a:hover,.unit-title-01 a:focus {color: #407ae5;}

.unit-menu-nav-02.nav-tabs {border-bottom: 2px solid #20C1AC; margin-bottom:15px;}
.unit-menu-nav-02.nav-tabs>li {width:50%;text-align:center;}
.unit-menu-nav-02.nav-tabs>li.active>a, .unit-menu-nav-02.nav-tabs>li.active>a:hover, .unit-menu-nav-02.nav-tabs>li.active>a:focus {	border: 1px solid #20C1AC;  background:#20C1AC; border-bottom-color: transparent; color: #ffffff;}
.unit-menu-nav-02.nav-tabs>li>a {border-color: #eee #eee #20C1AC;    margin: 0px 2px;}
.unit-menu-nav-02.nav-tabs>li>a:hover {border-color: #eee #eee #20C1AC;}
.unit-menu-nav-02.nav>li>a:hover, .unit-menu-nav-02.nav>li>a:focus {text-decoration: none;background-color: #fff;}
.unit-menu-nav-02 .nav-end {text-align:right; margin: 0px; width:10px;}
.unit-menu-nav-02 .nav-end img {margin-bottom:-57px; text-align:right;}
.unit-menu-nav-02 a {color: #9c9ea2;text-decoration: none;} 
.unit-menu-nav-02 a:hover,.unit-title-01 a:focus {color: #20C1AC;}

.unit-menu-sel-01 {width:100%;border-top-color: transparent; padding:5px;}

.unit-content-01 {padding:30px 0px;}
.unit-content-01.user-list{
    padding-top:  0;
}
.unit-content-title-01{background:url('../images/unit-content-title-01-bg.png') no-repeat 0% 50%;padding-left:20px;margin:15px 0px 30px;}
.unit-content-title-01 span{display:inline-block;padding:0px 5px 8px;font-size:21px;color:#000; background:none;}
.unit-content-title-01 span.spec01 {display:inline-block;padding:0px 5px;color:#000000;font-size:19px;background:#fff; margin-left:-8px;}
.video-area {width:100%;}
.media-area {padding-bottom:10px;}
.media-area .media-title-01 {padding-top:5px; padding-bottom:5px;}
.media-area .media-title-01 i {    padding-bottom:10px;    padding-top: 6px; float:left;}
.media-area .video-area {width:100%;  padding:3px; border:1px solid  #c3c3c3; background:#fff;}
.media-area .video-area embed {width:100%; height:250px;}

.media-area .media-desc-01 {padding-left:27px; font-size:15px; color:#9C9C9C;    padding-right: 10px;}
.media-desc-02 {padding: 0px;    font-size: 15px;    height: 72px;    color: #9C9C9C;    overflow: hidden;}
.media-box-01 .media-desc-01 {text-align:left;}
.media-row {padding-top: 0px;
    margin-top: 0px;
    background: transparent;}
.media-desc {font-size:14px; color:#df323b; text-align:center;}	
	
.media-row .media-desc {font-size:14px; color:#df323b; text-align:center;}
.content-center-area {display:inline-block;margin:0px auto; background: #fff;    color: #525252;    border: 1px solid #afc2e6;    padding: 10px 20px 10px 20px;    margin-top: 22px;    border-radius: 15px; text-align:left;}
.content-center-area span.title {font-size:18px; color:#779fea;}

.footer-link-area-01 .footer-sitemap>div>a {color:#5979b4; display:block;margin-bottom:15px;}
.footer-sitemap ul {    list-style: none; padding-left:0px;}
.footer-sitemap ul  li {padding:5px 0px;}
.footer-sitemap>div {border-left:1px dashed #c1c1c1;}

.footer-link-area-01 {background:#E8E8E8; padding-top:35px; padding-bottom:35px;}
.footer-link-area-01.dark-bg {background:#dadada; }
.footer-link-area-01 a { color: #5c6873;    text-decoration: none;}
.footer-link-area-01 a:hover, .footer-link-area-01 a:focus {    color: #5c6873;    text-decoration: underline;} 
.footer-link-area-02 {background:#505050;  color: #b8b8b8;padding-top:35px; padding-bottom:35px; text-align:center;}
.footer-link-area-02 a {   color: #dadada;  text-decoration: none;}
.footer-link-area-02 a:hover,.footer-link-area-02 a:focus {    color: #dadada;    text-decoration: underline;} 
  

.qrcode-box img {max-width:40%;  border-radius: 5px;margin-top:8px;}
.qrcode-box p {line-height:1.4;font-size:15px; margin:0px; margin-top:6px; height:42px;}
.qrcode-box p.small {font-size:13px;}
.qrcode-box div.col-md-2 {border-left: 1px dashed transparent;}
.qrcode-box div.col-md-2+div.col-md-2{border-left: 1px dashed #eeeeee;}
.qrcode-box .col-md-2 {padding:0px;}

.link-img-box img {max-width:80%;  border-radius: 5px;margin-top:0px;}
.link-img-box p {line-height:1.4;font-size:15px; margin:0px; margin-top:6px; height:32px;}
.link-img-box div.col-md-3+div.col-md-3{border-left: 1px solid #eeeeee;}
.link-img-box .col-md-3 {padding:0px;}

.label-light.alert-red{ color:#ff0000;}
/*
.label-light {white-space: nowrap;}*/
.label-light span{display:inline-block;padding-left: 20px;}
.first-group {margin-top:10px;}
.board-01 {padding:0px;list-style:none; margin-top:10px;line-height:1.7;}

.board-01 a {   color: #5c6873;    text-decoration: none;}
.board-01 a:hover,.board-01 a:focus {    color: #5c6873;    text-decoration: underline;}

.contentDetail {margin-bottom:8px;}
.countdownnum {font-size:18px; padding:10px; color:#d9434c;}

/*  CSS LAYOUT AREA END -------------------------------------------------------------------------*/


/* component */
.tooltip {font-size:16px;}

.label-light {    font-weight: normal; margin:5px 0px;}
label.control-label{  margin:5px 0px;}
.form-control {height: 41px;    padding: 9px 12px;}
.btn {padding: 9px 18px;    font-size: 16px;    margin-top: 2px;}
.btn-primary {
  color: #fff;
  background-color: #3ba881;
  border-color: #37a27c;
}
.btn-primary:focus,
.btn-primary.focus {
  color: #fff;
  background-color: #288f6a;
  border-color: #258a66;
}
.btn-primary:hover {
  color: #fff;
  background-color: #288f6a;
  border-color: #258a66;
}
.btn-primary:active,
.btn-primary.active,
.open > .dropdown-toggle.btn-primary {
  color: #fff;
  background-color: #288f6a;
  border-color: #258a66;
}
.btn-primary:active:hover,
.btn-primary.active:hover,
.open > .dropdown-toggle.btn-primary:hover,
.btn-primary:active:focus,
.btn-primary.active:focus,
.open > .dropdown-toggle.btn-primary:focus,
.btn-primary:active.focus,
.btn-primary.active.focus,
.open > .dropdown-toggle.btn-primary.focus {
  color: #fff;
  background-color: #258a66;
  border-color: #258a66;
}
.btn-primary:active,
.btn-primary.active,
.open > .dropdown-toggle.btn-primary {
  background-image: none;
}
.btn-primary.disabled:hover,
.btn-primary[disabled]:hover,
fieldset[disabled] .btn-primary:hover,
.btn-primary.disabled:focus,
.btn-primary[disabled]:focus,
fieldset[disabled] .btn-primary:focus,
.btn-primary.disabled.focus,
.btn-primary[disabled].focus,
fieldset[disabled] .btn-primary.focus {
  background-color: #3ba881;
  border-color: #37a27c;
}
.btn-primary .badge {
  color: #3ba881;
  background-color: #fff;
}
.btn-primary i{
    color:#FFF;
}

/*  time counter */
.time-counter{background:#fff;  color:#525252;  border:2px solid #5979b4; margin-top:22px;     border-radius: 15px;}
.counter-title {text-align:center; 	background:#5979b4;color:#f3b8ed; 
	-webkit-border-top-left-radius: 12px;
	-webkit-border-top-right-radius: 12px;
	-moz-border-radius-topleft: 12px;
	-moz-border-radius-topright: 12px;
	border-top-left-radius: 12px;
	border-top-right-radius: 12px;
	padding-top:15px;    padding-top: 6px;    padding-bottom: 6px;}
.counter-title span{display:inline-block;font-size:21px;}
.counter-title .title-box{ color:#fff;}
.counter-title .date-box{ color:#afc8f8;}
.counter-number {font-size:42px;  color:#779fea;  font-family:  Arial, sans-serif; text-align:center; line-height:1.2;}
.counter-number span {font-size:12px;  color:#5979b4;  font-family:  Arial, sans-serif; text-align:center; line-height:1.5; display:block;}
.counter-number .sec-count{color:#2dd5af; }
.counter-number .sec-count span { color:#09a582;}
.counter-number:after{
    display: block;
    content: '';
    clear: both;
}
/* Sidebar */
/*.sidebar-visible-xs #sidebar {width: 200px;}
.sidebar-visible-xs #main-container {margin-right: 200px; margin-left: -200px;}
*/
/* Sidebar Content */
/*.sidebar-content {width: 200px;color: #ffffff;}

.sidebar-section {padding: 10px;}
.sidebar-title {
    height: 50px;line-height: 50px;padding: 0 10px;
    margin: 0;font-weight: 300;font-size: 18px;display: block;color: #ffffff;
    background: url('../img/layout/ie8_opacity_dark_15.png') repeat;
    background: rgba(0, 0, 0, 0.15);
}

a.sidebar-title:hover,
a.sidebar-title:focus {
    background-color: #1bbae1;
    color: #ffffff;
    text-decoration: none;
}

.sidebar-title i {
    font-size: 14px;
    display: inline-block;
    width: 18px;
    text-align: center;
    margin-right: 10px;
    opacity: 0.5;
    filter: alpha(opacity=50);
}

.sidebar-title i.pull-left {
    margin: 20px 10px 0 0;
}

.sidebar-title i.pull-right {
    margin: 20px 0 0 10px;
}*/

/* Sidebar Navigation */
/*.sidebar-nav {list-style: none;margin: 0;padding: 0px 0 0;}

.sidebar-nav .sidebar-header:first-child {margin-top: 0;}

.sidebar-nav a {
    display: block;
    color: #fff;
    padding: 11px 10px 11px 13px;
    min-height: 35px;
    line-height: 34px;
}
.sidebar-nav li + li{
    border-top: 1px solid #404D7B;

}

.sidebar-nav a:hover,
.sidebar-nav a:focus,
.sidebar-nav a.open,
.sidebar-nav li.active > a {
    color: #ffffff;
    text-decoration: none;
    background: url('../img/layout/ie8_opacity_dark_15.png') repeat;
    background: rgba(0, 0, 0, 0.15);
}

.sidebar-nav a.active {
    padding-left: 5px;
    border-left: 5px solid #1bbae1;
    background: url('../img/layout/ie8_opacity_dark_30.png') repeat;
    background: rgba(0, 0, 0, 0.3);
}

.sidebar-nav a > .sidebar-nav-icon {
    margin-right: 10px;
}

.sidebar-nav a > .sidebar-nav-indicator {
    float: right;
    line-height: inherit;
    margin-left: 4px;
    -webkit-transition: all 0.15s ease-out;
    transition: all 0.15s ease-out;
}

.sidebar-nav a > .sidebar-nav-icon,
.sidebar-nav a > .sidebar-nav-indicator {
    display: inline-block;
    opacity: 0.5;
    filter: alpha(opacity=50);
    width: 18px;
    font-size: 14px;
    text-align: center;
}

.sidebar-nav a:hover,
.sidebar-nav a:hover > .sidebar-nav-icon,
.sidebar-nav a:hover > .sidebar-nav-indicator,
.sidebar-nav a.active,
.sidebar-nav a.active > .sidebar-nav-icon,
.sidebar-nav a.active > .sidebar-nav-indicator,
.sidebar-nav a.open,
.sidebar-nav a.open > .sidebar-nav-icon,
.sidebar-nav a.open > .sidebar-nav-indicator,
.sidebar-nav li.active > a,
.sidebar-nav li.active > a > .sidebar-nav-icon,
.sidebar-nav li.active > a > .sidebar-nav-indicator {
    opacity: 1;
    filter: alpha(opacity=100);
}

.sidebar-nav a.active > .sidebar-nav-indicator,
.sidebar-nav a.open > .sidebar-nav-indicator,
.sidebar-nav li.active > a > .sidebar-nav-indicator {
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
}

.sidebar-nav ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: none;
    background: url('../img/layout/ie8_opacity_dark_30.png') repeat;
    background: rgba(0, 0, 0, 0.3);
}*/

/* lang */
/*.sidebar-nav li.lang-area{
    padding: 10px;
}
.sidebar-nav li.lang-area a{
    padding: 0;
    background: transparent;
}
.sidebar-nav li.lang-area .lang-box{
    width: 100%;
    overflow: hidden;
    border: 1px solid #5979b4;
    border-radius: 8px;

}
.sidebar-nav li.lang-area .lang-box:after{
    content: '';
    display: block;
    clear: both;

}
.sidebar-nav li.lang-area .lang-box .lang-btn{
    display: inline-block;
    width: 50%;
    float: left;
    text-align: center;
    color: #cbeaf7;
    font-size: 14px;
}
.sidebar-nav li.lang-area .lang-box .lang-btn.on{
    background: #5979b4;
    color: #FFF;
    pointer-events: none;
    cursor: default;


}
.sidebar-nav li.active > ul {
    display: block;
}

.sidebar-nav ul a {
margin: 0;
    font-size: 12px;
    padding: 5px 5px 10px 15px;
    min-height: 32px;
    line-height: 32px;
    border-bottom-color: #353B56;
}

.sidebar-nav ul a.active,
.sidebar-nav ul a.active:hover {
    border-left: 5px solid #1bbae1;
    padding-left: 10px;
}

.sidebar-nav ul ul {
    background: url('../img/layout/ie8_opacity_dark_40.png') repeat;
    background: rgba(0, 0, 0, 0.4);
}

.sidebar-nav ul ul a { padding-left: 25px;}

.sidebar-nav ul ul a.active,
.sidebar-nav ul ul a.active:hover { padding-left: 20px;}
*/
/* Sidebar Header */
/*.sidebar-header {
    margin: 10px 0 0;
    padding: 10px;
    line-height: 12px;
}

.sidebar-header + .sidebar-section {
    padding-top: 0px;
    padding-bottom: 0px;
}

.sidebar-header .sidebar-header-title {
    color: #ffffff;
    font-size: 11px;
    text-transform: uppercase;
    opacity: 0.5;
    filter: alpha(opacity=50);
}

.sidebar-header-options {
    float: right;
    display: inline-block;
}

.sidebar-header-options > a,
.sidebar-nav .sidebar-header-options a {
    float: right;
    margin: 0;
    padding: 0;
    min-height: 0;
    line-height: inherit;
    display: block;
    min-width: 18px;
    text-align: center;
    color: #ffffff;
    opacity: 0.3;
    filter: alpha(opacity=30);
}

.sidebar-header-options a.active,
.sidebar-header-options a:hover,
.sidebar-header-options a:focus,
.sidebar-nav .sidebar-header-options a.active,
.sidebar-nav .sidebar-header-options a:hover,
.sidebar-nav .sidebar-header-options a:focus {
    background: none;
    color: #ffffff;
    opacity: 1;
    filter: alpha(opacity=100);
}

.sidebar-header-options a > i {
    font-size: 14px;
}*/




/* Scroll to top link */
#acart-to-top {
    display: none;
    position: fixed;
    bottom: 55px;
    right: 5px;
   border-radius: 3px;
    padding: 4px 12px;
    font-size: 15px;
    text-align: center;
    color: #ffffff;
    background-color: #000000;
    opacity: 0.2;
    filter: alpha(opacity=20);
}
#acart-to-top span{display:block;}
#acart-to-top i {
    color: #ffffff;
	    font-size:21px;
}

#acart-to-top:hover {
    color: #ffffff;
    background-color: #5979b4;
    text-decoration: none;
    opacity: 1;
    filter: alpha(opacity=100);
}
	.owl-theme .owl-controls {
    display:none;}

	
.brand-spec-p {color:#000000;}	
	
.flow-area .col-sm-6{
    text-align: center;
}	

.style-tuned-box{
    margin-top:10px;
    width: 100%;
}


.step-box{
    text-align: center;
}

.counter-number {font-size:42px;  color:#779fea;  font-family:  Arial, sans-serif; text-align:center; line-height:1.2;}
.counter-number span {font-size:12px;  color:#5979b4;  font-family:  Arial, sans-serif; text-align:center; line-height:1.5; display:block;}
	#main-content .container img.contestants-user-img {max-height:280px;}

@media screen and (min-width: 480px) {
.counter-number {font-size:50px; }
.counter-number span {font-size:13px; }
/*.pic-box-01 {display:inline-block; }*/
.link-img-box img {max-width:70%;}
/*.user-box-01 {   width:auto;}*/
.home-area-bg-01 {background:url('../img/layout/dada-m-01.png') no-repeat 15px -77px #fff;}
.gold-class{padding:20px;}
}

@media screen and (min-width: 450px) {
    .sidebar-nav li.lang-area{
        display: none;
    }
    .site-nav.site-nav-xs > li.lang{
        display: list-item;
    }
}
/* Small devices, Tablets (>767px) */
@media screen and (min-width: 768px) {
	.unit-title-01 {font-size: 24px;line-height: 10px;border-bottom-color: #fff;margin: 0px;margin-top: 18px;padding: 2px 5px 0px 0px; background:none;}
	.unit-title-01-en {font-size: 18px;font-family: Arial, sans-serif;line-height: 1.2; color:#666;margin: 0px;margin-top: 20px;padding: 2px 0px 0px 5px;}
	/*.user-box-01 {      padding-left: 2.4%;    padding-right: 2.4%;}*/
	.brand-box-01 .img-box {padding: 38px 5px;}
    .brand-box-01 .img-box.history {padding: 5px 5px;}
	.form-horizontal .control-label	{text-align:left;}
	.media-desc-01 {min-height:52px;}	
	#main-content .container img.contestants-user-img {height:259px;}
	
#main-content .container .brand-box-01 .img-box  img {
    max-height: 70px; 
}
#main-content .container .brand-box-01 .img-box.history  img {
    max-height: 100%; 
}   
    .flow-area .col-sm-6 img{
        margin: 0 8px;
    }
    .flow-area .col-sm-6:nth-child(2n+1) img{
        float: right;
    }
   
    .flow-area .col-sm-6:nth-child(2n) img{
        float: left;

        margin-top:50px;
    }
    .media-row,.user-row{
        display: flex;
        flex-wrap: wrap;
    }
    
    .nav-tabs-xs{
        display: none;
    }
    .unit-content-01.user-list{
        padding-top: 30px;
        padding-bottom: 30px;
    }



}

/* Medium devices, Desktops (>991px) */
@media screen and (min-width: 992px) {
.brand-spec-p {margin-top:-50px; margin-bottom:25px;}
.home-area .container.home-area-bg-02 {background:url('../img/layout/dada-m-02.png') no-repeat 100% 100% #fff;  }
.home-intro-content {height:155px; overflow:hidden; }
/*.user-box-01 {  padding-left:3.2%; padding-right:3.2%;}*/
/*.user-box-01.small-padding {  padding-left:2.2%; padding-right:2.2%;}*/
    .site-nav{
        padding-right: 15px;  
    }
.link-img-box img {max-width:60%;}
	.site-logo-box {    padding-top: 17px;
    padding-bottom: 17px;
    padding-left: 15px;}
    .site-nav.site-nav-xs a{padding:25px 25px 27px; font-size:18px;}	
    /* Sidebar Animations */
    .sidebar-no-animations #sidebar {
        -webkit-transition: opacity 0.5s linear, background-color 0.2s ease-out;
        transition: opacity 0.5s linear, background-color 0.2s ease-out;
    }

    .sidebar-no-animations #main-container {
        -webkit-transition: none;
        transition: none;
    }

    /* Reset sidebar classes used only on small screens */
    .sidebar-visible-xs #sidebar{
        width: 0;
    }

    .sidebar-visible-xs #main-container {
        margin-left: 0;
        margin-right: 0;
    }
	
   /* Both Sidebars */
    #sidebar,
    .sidebar-partial #sidebar {width: 0;}

    .sidebar-visible-lg #sidebar,
    .sidebar-visible-lg.sidebar-partial #sidebar {
        width: 200px;
        opacity: 1;
        filter: alpha(opacity=100);
        margin-right: 0px;
    }
	
    /* Main Sidebar */
    .sidebar-partial #main-container {
        margin-right: 0px;		
    }

    .sidebar-visible-lg #main-container {
        margin-right: 200px;
		margin-left:-200px;
    }
	.counter-title {
	-webkit-border-top-left-radius: 12px;
	-webkit-border-bottom-left-radius: 12px;
	-webkit-border-top-right-radius: 0px;	
	-moz-border-radius-topleft: 12px;
	-moz-border-radius-bottomleft: 12px;
	-moz-border-radius-bottomright: 0px;	
	border-top-left-radius: 12px;
	border-bottom-left-radius: 12px;
	border-bottom-right-radius: 0px;	    padding-top: 14px;
    padding-bottom: 13px;}

	.counter-title span{display:inline-block;font-size:18px;}
	.counter-title .title-box{ color:#fff;}
	.counter-title .date-box{font-size:18px; color:#afc8f8;}
	.unit-content-01 {padding:50px 10px;}
	.unit-content-01.register {background:url('../img/layout/dada-b-01.png') no-repeat 100% 100%;min-height:280px;}
	.unit-content-01.news {background:url('../img/layout/dada-b-02.png') no-repeat 100% 100%;min-height:280px;}	
	.unit-content-01.news .news-list{width:80%;}
	.user-box-02 .img-box{ float:left;}
	.brand-row {margin-bottom:50px;}
	
	.news-list .news-item .date-box { float:left;}	
	.home-news-area {background: url('../img/layout/home-news-bg-01.png') no-repeat 100% 100%; min-height:215px;}
	.home-news-bg {background: url('../img/layout/home-news-bg-02.png') no-repeat 0% 100%; min-height:215px;}
	.home-area .container.home-news-bg {padding-bottom:0px;}
	.home-news-area  .news-list{width:80%; margin:0px auto;}
	.home-area .container.home-news-bg .news-list {min-height:180px;}
	.home-area .container.home-news-bg .more-box-c {margin-bottom:26px;}	
	/*.home-news-bg .more-box-c {    position: absolute;    bottom: 0; left:48%;}*/

	.media-row {padding-top:0px;      margin-top: 0px;  margin-bottom:15px;   }

    .media-desc {    
        font-size: 14px;
        color: #df323b;
        text-align: center;
        padding-bottom: 10px;
        
    }
    .home-area-01 .media-desc {
        padding-bottom: 20px;
        text-align: right;
        padding-top: 25px;  padding-right: 15px;

    }
    .media-desc.zhtw {background: url('../img/layout/dada-s-02_zhtw.png') no-repeat 15px 0%;}
    .media-desc.zhcn {background: url('../img/layout/dada-s-02_zhcn.png') no-repeat 15px 0%;}
	.brand-box-01 .img-box {padding: 28px 5px;}
	.contentDetail-li-title{float:left;}
	.contentDetail-li-body{padding-left:100px;}
	.contentDetail-li-body.spec01{padding-left:130px;}
	.contentDetail-li-body.spec02{padding-left:138px;}		
	img.judges-img  {width:136px;}
	#main-content .container img.contestants-user-img {height:135px;}
	.owl-theme .owl-controls {
    margin-top: -25px;
    text-align: center;
    -webkit-tap-highlight-color: transparent;
    z-index: 100;
    position: relative; display:block;
    }
    #acart-sticky-header .container{
        width: 100%;
    }
    .site-nav a{
        padding: 27px 10px 25px;
        font-size: 16px;

    }
    .site-nav > li:hover:after {        display: block;} 
    .home-awards .step-box{
        width: 20%;
    }
    .time-counter{
        display: table;
        width: 100%;
    }
    .time-counter .counter-title{
        display: table-cell;
        width: 25%;
        word-break: break-all;
    }
    .time-counter .counter-time{
        display: table-cell;
        vertical-align: middle;
    }
}
@media screen and (min-width: 1100px) {
    .site-nav{
        padding-right: 30px;  
    }
    .site-nav a{
        font-size: 17px;

        padding: 27px 14px 25px;

    }
    .site-nav li.lang-area{
        right: -70px;
    }
}
@media screen and (min-width: 1200px) {
    #acart-sticky-header .container{
        width: 1170px;
    }
	/*	.home-area-bg-02 .user-row {
	width: 90%;
		margin: 0px auto;
		text-align: left;	
		}
	.user-box-01 {  padding-left:2.9%; padding-right:2.9%;}
	.news-item {margin-left:30px;}*/
.qrcode-box img {max-width:50%;  border-radius: 5px;margin-top:8px;}
	/*.user-box-01 {  padding-left:4%; padding-right:4%;}*/
	.news-list .news-item .date-box  {    padding-left: 50px;    padding-right: 50px;}	
	.counter-title { padding-top: 6px;    padding-bottom: 6px;}	
	.counter-title span{display:inline-block;font-size:21px;}
	.counter-title .title-box{ color:#fff;display:inline;}
	.counter-title .date-box{font-size:24px; color:#afc8f8;}	
	.counter-number {font-size:52px; line-height:1.2;}	
	.home-title-02 {margin-bottom:28px;}
	.slider-area{min-height:352px; }
		.unit-menu-nav-01 li.submenu {min-width:125px; text-align:center;}
	#main-content .container img.contestants-user-img {height:175px;}		
}


/*header*/


/* flow-box-css */
.flow-box-area{
    max-width: 100%;

}
.flow-box-start,.flow-box-end{
    display: none;
}
.flow-box{
    text-align: right;
    height: auto;
    width: 100%;
    border-width: 0 0 0 5px;
    border-style: solid;
    margin-bottom: 2px;
    position: relative;
    
    padding-bottom: 15px;
}
.flow-box:before{
    content: '';
    display: block;
    width: 10px;
    height: 20px;
    left: -1px;
    position: absolute;
    top:41px;

    border-radius:0 10px 10px 0px;
}
.flow-box:after{
    content: '';
    display: block;
    clear: both;
}
.flow-box .img-box{
    border-color: transparent;
    height: 102px;
    width: 102px;
    border-radius: 50%;
    display: inline-block;
}
.flow-box .img-box:before{
    content: '';
    display: block;
    width: 100%;
    height: 2px;
    left: 0;
    position: absolute;
    top:50px;
    background: #000;
    z-index: -1;
}

.flow-box .info-box{
    display: block;
}
.flow-box .info-box .date{
    display: block;
    font-size: 22px;
    font-family: Arial;
    color:#407ae5;

}
.flow-box .info-box .info{
    display: block;
    font-size: 16px;

    
}
.flow-box.register{
    border-color: #EC9F4E;
}
.flow-box.register:after,.flow-box.register .img-box:before,.flow-box.register .img-box{
    background: #EC9F4E;
}
.flow-box.register .img-box{
    background: #EC9F4E url('../img/layout/icon2_flow_step01_2x.png') center no-repeat;
    background-size: 102px auto;
}


.flow-box.announce{
    border-color: #F27078;
}
.flow-box.announce:after,.flow-box.announce .img-box:before,.flow-box.announce .img-box{
    background: #F27078;
}
.flow-box.announce .img-box{
    background: #F27078 url('../img/layout/icon2_flow_step02_2x.png') center no-repeat;
    background-size: 102px auto;
}


.flow-box.items{
    border-color: #47ADB9;
}
.flow-box.items:after,.flow-box.items .img-box:before,.flow-box.items .img-box{
    background: #47ADB9;
}
.flow-box.items .img-box{
    background: #47ADB9 url('../img/layout/icon2_flow_step03_2x.png') center no-repeat;
    background-size: 102px auto;
}

.flow-box.workshop{
    border-color: #A2B973;
}
.flow-box.workshop:after,.flow-box.workshop .img-box:before,.flow-box.workshop .img-box{
    background: #A2B973;
}
.flow-box.workshop .img-box{
    background: #A2B973 url('../img/layout/icon2_flow_step04_2x.png') center no-repeat;
    background-size: 102px auto;
}

.flow-box.online-talking{
    border-color: #D26F8E;
}
.flow-box.online-talking:after,.flow-box.online-talking .img-box:before,.flow-box.online-talking .img-box{
    background: #D26F8E;
}
.flow-box.online-talking .img-box{
    background: #D26F8E url('../img/layout/icon2_flow_step05_2x.png') center no-repeat;
    background-size: 102px auto;
}
.flow-box.finals-submit{
    border-color: #65A5D1;
}
.flow-box.finals-submit:after,.flow-box.finals-submit .img-box:before,.flow-box.finals-submit .img-box{
    background: #65A5D1;
}
.flow-box.finals-submit .img-box{
    background: #65A5D1 url('../img/layout/icon2_flow_step06_2x.png') center no-repeat;
    background-size: 102px auto;
}
.flow-box.finals-contest{
    border-color: #D1A07F;
}
.flow-box.finals-contest:after,.flow-box.finals-contest .img-box:before,.flow-box.finals-contest .img-box{
    background: #D1A07F;
}
.flow-box.finals-contest .img-box{
    background: #D1A07F url('../img/layout/icon2_flow_step07_2x.png') center no-repeat;
    background-size: 102px auto;
}
.flow-box.play-off{
    border-color: #9C76A5;
}
.flow-box.play-off:after,.flow-box.play-off .img-box:before,.flow-box.play-off .img-box{
    background: #9C76A5;
}
.flow-box.play-off .img-box{
    background: #9C76A5 url('../img/layout/icon2_flow_step08_2x.png') center no-repeat;
    background-size: 102px auto;
}

@media screen and (min-width: 768px){
    .flow-box{
        margin-left: auto;
        margin-right: auto;
        border: none;
        width: 5px; 
        height: 100px;
    }
    .flow-box .img-box,.flow-box .info-box{
        position: absolute;
    }
    .flow-box.register{
        background-color: #EC9F4E;
    }
    .flow-box.announce{
        background-color: #F27078;
    }
    .flow-box.items{
        background-color: #47ADB9;
    }
    .flow-box.workshop{
        background-color: #A2B973;
    }
    .flow-box.online-talking{
        background-color: #D26F8E;
    }
    .flow-box.finals-submit{
        background-color: #65A5D1;
    }
    .flow-box.finals-contest{
        background-color: #D1A07F;
    }
    .flow-box.play-off{
        background-color: #9C76A5;
    }
    .flow-box:nth-child(2n) .img-box{
        right: 125px;
    }
    .flow-box:nth-child(2n):after {
        right: 4px;
        left: auto;
        border-radius:10px 0px 0 10px;

    }
    .flow-box:nth-child(2n + 1) .img-box{
        left: 120px;
        
    }
    .flow-box:nth-child(2n + 1):after {
        left: 4px;
    }
    

}





.chipsbg{background:url(../images/navbg.png) repeat-x; height:20px; width:100%; clear:both;}
.chipsbg2{background:url(../images/navbg2.png) repeat-x; height:20px; width:100%; clear:both;}
.chipsbanner{clear:both;}
.chipsbanner img{width:100%;}

header {
  position: relative;
}
header .container{
    width: 100%;
}
header a:hover{
    text-decoration: none;
}
header div.md-title {
  position: relative;
  width: 100%;
  border-bottom: 1px solid #5979b4;
}

header div.md-title div.md-title-box {
  position: relative;
  display: block;
}
header div.md-title div.md-title-box:after {
  content: '';
  display: block;
  clear: both;
}
header div.md-title .title-logo {
  height: 38px;
  width: auto;
  margin-top: 7px;
}
header div.md-title .title-logo2 {
  margin-left: 10px;
  margin-top: 5px;
}
header div.md-title .lg {
  display: none;
}
@media screen and (min-width: 1200px) {
  header div.md-title .lg {
    display: inline-block;
  }
}
header div.md-title .md {
  display: none;
}
@media screen and (min-width: 992px) {
  header div.md-title .md {
    display: inline-block;
  }
}
@media screen and (min-width: 1200px) {
  header div.md-title .md {
    display: none;
  }
}
header div.md-title .container {
  width: 100%;
}
@media screen and (min-width: 992px) {
  header div.md-title .container {
    width: 100%;
  }
}
@media screen and (min-width: 1200px) {
  header div.md-title .container {
    width: 1170px;
    padding-left: 20px;
  }
}
header .title-menu-area {
  height: 100%;
}
header .title-menu-area img {
  margin-left: 15px;
}
header div.xs-title {
  height: 50px;
  z-index: 5000;
  background: #FFF;
  width: 100% !important;
  position: absolute;
  left: 0;
  border-bottom: 1px solid #5979b4;

}
header div.xs-title .logo-img {
  width: 119px;
  height: auto;
  margin-top: 10px;
  margin-left: 7px;
}
header div.xs-title .logo-img-ec {
  width: auto;
  height: 40px;
  margin-top: 4px;
  margin-left: 10px;
}
header div.xs-title .button-area {
  float: right;
  padding: 0px;
  display: inline-block;
  width: 50px;
  height: 50px;
  text-align: center;
  background: #505050;
}
header div.xs-title .login-btn {
  float: right;
  display: inline-block;
  width: 50px;
  height: 50px;
  line-height: 50px;
  font-size: 18px;
  background: url(../img/layout/icon_member_before_2x.png) center no-repeat #5979b4;
  background-size: 17px auto;
  font-size: 12px;
  font-family: Arial;
  color: #595656;
  text-align: center;
  padding-right: 6px;
}
header div.xs-title .login-btn.login {
    background: url(../img/layout/icon_member_after_2x.png) center no-repeat #5979b4;
  background-size: 17px auto;  
}
.login-btn:hover ~ .xs-user-dropdown {
  display: block;
}

header div.xs-title div.xs-menu {
  display: inline-block;
  vertical-align: top;
  margin: 0px;
  line-height: 0px;
  color: #FFF;
  font-size: 12px;
}
header div.xs-title div.xs-menu .icon-wrapper {
  margin: 16.5px auto;
  width: 26px;
  height: 18px;
  position: relative;
  -webkit-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: 400ms ease-in-out;
  transition: 400ms ease-in-out;
  cursor: pointer;
}
header div.xs-title div.xs-menu .icon-wrapper span {
  display: block;
  position: absolute;
  height: 3px;
  width: 100%;
  background: #FFF;
  opacity: 1;
  left: 0;
  -webkit-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: 400ms ease-in-out;
  transition: 400ms ease-in-out;
}
header div.xs-title div.xs-menu .icon-wrapper span:nth-child(1) {
  top: 0px;
}
header div.xs-title div.xs-menu .icon-wrapper span:nth-child(2) {
  top: 7px;
}
header div.xs-title div.xs-menu .icon-wrapper span:nth-child(3) {
  top: 7px;
}
header div.xs-title div.xs-menu .icon-wrapper span:nth-child(4) {
  top: 14px;
}
header div.xs-title div.xs-menu.active span:nth-child(1) {
  top: 7px;
  width: 0%;
  left: 50%;
}
header div.xs-title div.xs-menu.active span:nth-child(2) {
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}
header div.xs-title div.xs-menu.active span:nth-child(3) {
  -webkit-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
header div.xs-title div.xs-menu.active span:nth-child(4) {
  top: 14px;
  width: 0%;
  left: 50%;
}
header div.xs-title.sidebar-on {
  box-shadow: 0px -5px 14px 0px #404040;
}

header .menu-top-area {
  padding-top: 5px;
  height: 60px;
  padding-right: 100px;
}
header .menu-top-area .head-search-area {
  display: inline-block;
  float: right;
  margin-top: 10px;
}
header .menu-top-area .head-search-area .input-group {
  float: left;
  position: relative;
  width: 216px;
}
@media screen and (min-width: 1200px) {
  header .menu-top-area .head-search-area .input-group {
    width: 295px;
  }
}
header .menu-top-area .head-search-area .input-group .search-input {
  width: 100%;
  height: 33px;
  padding: 0 34px 0 10px;
  border: 1px solid #9d9999;
  font-size: 14px;
  color: #555;
}
header .menu-top-area .head-search-area .input-group .search-btn {
  border: none;
  position: absolute;
  right: 0;
  height: 33px;
  width: 33px;
  background: #595656;
  text-align: center;
  cursor: pointer;
  color: #fff;
  top: 0px;
  padding-top: 2px;
  font-size: 20px;
}
header .menu-top-area .head-search-area .hot-keywords-area {
  margin-left: 10px;
  display: inline-block;
  float: left;
  height: 33px;
  line-height: 30px;
  font-size: 14px;
  width: 300px;
  overflow: hidden;
  position: relative;
}
header .menu-top-area .head-search-area .hot-keywords-area:after {
  content: '';
  display: block;
  position: absolute;
  right: 0;
  top: 5px;
  width: 50px;
  height: 18px;
  background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0), #fff);
  background: -o-linear-gradient(left, rgba(255, 255, 255, 0), #fff);
  background: -moz-linear-gradient(left, rgba(255, 255, 255, 0), #fff);
  background: linear-gradient(left, rgba(255, 255, 255, 0), #fff);
}
header .menu-top-area .head-search-area .hot-keywords-area .title {
  color: #595656;
}
header .menu-top-area .head-search-area .hot-keywords-area .keywords {
  margin-right: 7px;
  color: #888888;
}
header .menu-top-area .head-search-area .hot-keywords-area .keywords.hot {
  color: #ff6b00;
}
@media screen and (min-width: 1200px) {
  header .menu-top-area .head-search-area .hot-keywords-area {
    width: 340px;
  }
}
header .menu-top-area:after {
  content: '';
  display: block;
  clear: both;
}
header .menu-down-area .head-btn-area {
  padding-right: 34px;
  display: inline-block;
  float: right;
}
header .menu-down-area .head-btn-area .register-now-btn {
    display: inline-block;
    height: 31px;
    border-radius: 20px;
    border:2px solid #5979b4;
    padding:  0 7px 0 5px;
    color: #456cb5; 
}

header .menu-down-area .head-btn-area.login {
  padding-right: 29px;
}
header .menu-down-area .head-btn-area .account-area {
  display: inline-block;
  position: relative;
}
header .menu-down-area .head-btn-area .account-area:after {
  content: '';
  display: block;
  position: absolute;
  top: 31px;
  width: 100%;
  height: 9px;
  background: transparent;
}
header .menu-down-area .head-btn-area .account-area .dropdown-area {
  top: 40px;
  right: -7px;
  border: 1px solid #d7d7d7;
  background: #FFF;
  position: absolute;
  z-index: 3;
  width: 100px;
  text-align: center;
  color:#5c6873;
  display: none;
  box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.1);
}
header .menu-down-area .head-btn-area .account-area .dropdown-area a {
  font-size: 14px;
  width: 100%;
  display: block;
  padding: 8px 10px;
  position: relative;
  color: #5c6873;
  z-index: 1;
}
header .menu-down-area .head-btn-area .account-area .dropdown-area a:hover {
  background: #505050;
  color: #FFF;
}
header .menu-down-area .head-btn-area .account-area .dropdown-area a:nth-child(1):hover:after {
  content: '';
  display: block;
  position: absolute;
  right: 15px;
  top: -10px;
  border-width: 6px 6px 6px 6px;
  border-style: solid;
  border-color: transparent transparent #505050 transparent;
}
header .menu-down-area .head-btn-area .account-area .dropdown-area:before {
  content: '';
  display: block;
  position: absolute;
  right: 15px;
  top: -12px;
  border-width: 6px 6px 6px 6px;
  border-style: solid;
  border-color: transparent transparent #d7d7d7 transparent;
}
header .menu-down-area .head-btn-area .account-area .dropdown-area:after {
  content: '';
  display: block;
  position: absolute;
  right: 15px;
  top: -11px;
  border-width: 6px 6px 6px 6px;
  border-style: solid;
  border-color: transparent transparent #FFF transparent;
}
header .menu-down-area .head-btn-area .account-area:hover .dropdown-area {
  display: block;
}
header .menu-down-area .head-btn-area .head-btn {
  display: inline-block;
  vertical-align: middle;
  margin-left: 5px;
}
@media screen and (min-width: 1200px) {
  header .menu-down-area .head-btn-area .head-btn {
    margin-left: 15px;
  }
}
header .menu-down-area .head-btn-area .head-btn.dollar {
  margin-top: 3px;
  width: 70px;
  height: 30px;
  border-radius: 3px;
  padding-left: 10px;
  font-size: 13px;
  color: #888888;
  border: 1px solid #9d9999;
  font-family: Arial;
}
header .menu-down-area .head-btn-area .head-btn.cart {
  width: 40px;
  height: 33px;
  background: url(../img/layout/icon_cart.png) 0 0 no-repeat;
  background-size: 40px auto;
  font-size: 12px;
  font-family: Arial;
  color: #595656;
  line-height: 33px;
  text-align: center;
  padding-right: 6px;
}
header .menu-down-area .head-btn-area .head-btn.account {
  width: 100px;
  height: 40px;
  border-radius: 5px;
  background: #c00;
  background-size: 17px auto;
  margin-left: 15px;
  text-align:center; line-height:35px;
}
header .menu-down-area .head-btn-area .head-btn.account:hover{background:#ffe8ee; border:#c00 solid 1px; border-radius:5px; color:#c00; line-height:35px;}
header .menu-down-area .head-btn-area .head-btn.account.login {
  margin-right: 5px;
  background: #5979b4 url(../img/layout/icon_member_after.png) center 4px no-repeat;
  background-size: 17px auto;
}
header .menu-down-area:after {
  content: '';
  display: block;
  clear: both;
}
header .menu-down-area ul.header-nav {
  position: relative;
  list-style: none;
  margin-bottom: 0px;
  float: left;
  padding: 0;
}
header .menu-down-area ul.header-nav:after {
  content: '';
  display: block;
  clear: both;
}
header .menu-down-area ul.header-nav > li {
  position: relative;
  float: left;
  width: auto;
  padding: 0px;
  text-align: left;
}
header .menu-down-area ul.header-nav > li + li {
  margin-left: 15px;
}
header .menu-down-area ul.header-nav > li + li:after {
  content: '';
  display: block;
  position: absolute;
  width: 9px;
  height: 17px;
  background: url(../img/layout/menu_dash.png) center no-repeat;
  background-size: 9px auto;
  top: 11px;
  left: -12px;
}
@media screen and (min-width: 1200px) {
  header .menu-down-area ul.header-nav > li + li {
    margin-left: 20px;
  }
  header .menu-down-area ul.header-nav > li + li:after {
    top: 12px;
    left: -14px;
  }
}
header .menu-down-area ul.header-nav > li > a {
  position: relative;
  display: block;
  font-size: 17px;
  color: #5c6873;
  padding: 8px 9px 10px 9px;
}
header .menu-down-area ul.header-nav > li > a:after {
  content: '';
  display: block;
  position: absolute;
  bottom: 0;
  width: 100%;
  left: 0;
  border-top: 4px solid #456cb5;
  -webkit-transform: scale3d(0, 1, 1);
  transform: scale3d(0, 1, 1);
  -webkit-transition: -webkit-transform 0.1s;
  transition: transform 0.1s;
}
@media screen and (min-width: 1200px) {
  header .menu-down-area ul.header-nav > li > a {
    font-size: 18px;
  }
}
header .menu-down-area ul.header-nav > li ul.header-nav2 {
  display: none;
  position: absolute;
  z-index: 100;
  list-style: none;
  padding: 0;
  min-width: 180px;
  left: -0%;
  background: #edf0f5;
  box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1);
}
header .menu-down-area ul.header-nav > li ul.header-nav2 li a {
  text-align: left;
  border: none;
  padding: 7px 40px;
  display: block;
  color: #727272;
  width: 100%;
  font-size: 15px;
  padding: 15px 20px;
  text-align: left;
}
header .menu-down-area ul.header-nav > li ul.header-nav2 li a:hover {
  background: #505050;
  color: #FFF;
}
header .menu-down-area ul.header-nav > li:hover ul.header-nav2 {
  display: block;
}
header .menu-down-area ul.header-nav > li:hover > a {
  color: #456cb5;
}
header .menu-down-area ul.header-nav > li:hover > a:after {
  -webkit-transform: scale3d(1, 1, 1);
  transform: scale3d(1, 1, 1);
  -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
}
header .menu-down-area ul.header-nav > li.active:after {
  content: '';
  display: block;
  position: absolute;
  top: 3px;
  left: 0;
  width: 25px;
  height: 2px;
  background: #b0d799;
}
@media screen and (min-width: 1200px) {
  header .menu-down-area ul.header-nav > li.active:after {
    width: 35px;
  }
}
header .menu-down-area.en ul.header-nav {
  margin-left: -20px;
}
@media screen and (min-width: 1200px) {
  header .menu-down-area.en ul.header-nav {
    margin-left: 0;
  }
}
header .menu-down-area.en ul.header-nav > li a {
  font-size: 17px;
}
header .menu-down-area.en ul.header-nav > li + li {
  margin-left: 4px;
}
header .menu-down-area.en ul.header-nav > li + li:after {
  left: -6px;
}
@media screen and (min-width: 1200px) {
  header .menu-down-area.en ul.header-nav > li + li {
    margin-left: 4px;
  }
}
header .btn-translate-area {
  position: absolute;
  right: 0;
  top: -0;
  z-index: 1;
  width: 100px;
}
header .btn-translate-area:hover .drop-down-area {
  top: 0;
  opacity: 1;
}
header .btn-translate-area .btn-translate {
  display: inline-block;
  text-align: center;
  font-size: 17px;
  color: #FFF;
  line-height: 50px;
  width: 100px;
  height: 50px;
  position: relative;
}
header .btn-translate-area .drop-down-area .btn-translate {
  background: #505050;
}
header .btn-translate-area .drop-down-area .btn-translate:last-child {
  background: #505050;
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
}
header .btn-translate-area .btn-translate.current {
  line-height: 30px;
  position: absolute;
  top: 0;
  padding-top: 5px;
}
header .btn-translate-area .btn-translate.current:before {
  content: '';
  display: block;
  width: 0;
  height: 0;
  position: absolute;
  top: 0;
  right: 0;
  border-style: solid;
  border-width: 50px 50px 0px 50px;
  border-color: #456cb5 transparent transparent transparent;
  z-index: 0;
}
header .btn-translate-area .btn-translate.current > span {
  position: relative;
}
header .btn-translate-area .drop-down-area {
  position: absolute;
  top: -135px;
  opacity: 0;
  transition: all 0.5s;
  z-index: 20;
  box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.1);
}
header .btn-translate-area .drop-down-area .btn-translate + .btn-translate:after {
  content: '';
  display: block;
  position: absolute;
  top: -1px;
  width: 90px;
  left: 5px;
  height: 1px;
  background: #727272;
}
header .btn-translate-area .drop-down-area .btn-translate:hover {
  background: #656565;
}


img.title-logo2{max-height:45px;}


/*sidebar*/
#show-mb-sidebar {
  cursor: pointer;
}

div#mb-sidebar {
  position: fixed;
  width: 100%;
  top: -110vh;
  z-index: 4999;
  background: #505050;
  height: 100%;
  overflow: hidden;
}
div#mb-sidebar.hidden-sidebar {
  top: -100%;
  -webkit-animation-name: hiddensidebar;
  -webkit-animation-timing-function: ease-in;
  -webkit-animation-duration: 0.5s;
  animation-name: hiddensidebar;
  animation-timing-function: ease-in;
  animation-duration: 0.5s;
  overflow: hidden;
}
div#mb-sidebar.show-sidebar {
  top: 49px;
  -webkit-animation-name: showsidebar;
  -webkit-animation-timing-function: ease-in;
  -webkit-animation-duration: 0.5s;
  animation-name: showsidebar;
  animation-timing-function: ease-in;
  animation-duration: 0.5s;
  overflow: auto;
}
div#mb-sidebar.show-sidebar::-webkit-scrollbar {
display: none;
}
@media screen and (min-width: 992px) {
  div#mb-sidebar {
    display: none;
  }
}

/* Chrome, Safari, Opera */
@-webkit-keyframes hiddensidebar {
  0% {
    top: 49px;
  }
  100% {
    top: -100%;
  }
}
/* Standard syntax */
@keyframes hiddensidebar {
  0% {
    top: 49px;
  }
  100% {
    top: -100%;
  }
}
/* Chrome, Safari, Opera */
@-webkit-keyframes showsidebar {
  0% {
    top: -100%;
  }
  100% {
    top: 49px;
  }
}
/* Standard syntax */
@keyframes showsidebar {
  0% {
    top: -100%;
  }
  100% {
    top: 49px;
  }
}
div.sidebar-content {
  padding-bottom: 49px;
}

.sidebar-nav {
  list-style: none;
  margin: 0;
  padding: 0px 0 0;
}
.sidebar-nav .sidebar-header:first-child {
  margin-top: 0;
}
.sidebar-nav .sidebar-ul-split {
  padding: 9px 10px;
  color: #262626;
  background: #4C4C4C;
  position: relative;
}
.sidebar-nav .sidebar-ul-split:after {
  position: absolute;
  content: " ";
  width: 0;
  height: 0;
  border: solid transparent;
  right: 12px;
  bottom: -12px;
  border-width: 6px;
  border-top-color: #ff7878;
}
.sidebar-nav select {
  margin: 10px 0 10px 15px;
  padding-left: 5px;
  background: #5979b4;
  color: #FFFFFF;
  border: 1px solid #FFFFFF;
  border-radius: 5px;
  height: 32px;
}
.sidebar-nav select:focus {
  outline: none;
}
.sidebar-nav select.lang {
  width: 100px;
}
.sidebar-nav select.dollar {
  width: 60px;
}
.sidebar-nav a {
  position: relative;
  display: block;
  color: #eaedf1;
  font-size: 17px;
  padding: 10px 15px 10px 20px;
  min-height: 35px;
  line-height: 35px;
  text-decoration: none;
  margin-bottom: 1px;
}
.sidebar-nav a i.icon {
  margin-right: 15px;
}
.sidebar-nav a.open, .sidebar-nav a.active, .sidebar-nav a:hover {
  color: #ffffff;
  background: #414141;
}
.sidebar-nav a.open .sidebar-nav-icon, .sidebar-nav a.open .sidebar-nav-indicator, .sidebar-nav a.active .sidebar-nav-icon, .sidebar-nav a.active .sidebar-nav-indicator {
  -webkit-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  transform: rotate(-90deg);
}
.sidebar-nav a .sidebar-nav-icon {
  -webkit-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  transform: rotate(90deg);
}
.sidebar-nav a .sidebar-nav-indicator {
  float: right;
  line-height: inherit;
  margin-left: 4px;
  -webkit-transition: all 0.15s ease-out;
  transition: all 0.15s ease-out;
}
.sidebar-nav a .sidebar-nav-icon, .sidebar-nav a .sidebar-nav-indicator {
  display: inline-block;
  width: 18px;
  font-size: 14px;
  text-align: center;
  color:#FFF;
}
.sidebar-nav li {
  border-bottom: 1px solid #707070;
}
.sidebar-nav li:nth-last-child(1) {
  border: none;
}
.sidebar-nav li.dropdown-area {
  background: #5979b4;
}
.sidebar-nav li.search-area {
  padding: 11px 15px 11px 15px;
  border-bottom: none;
}
.sidebar-nav li.search-area .input-group {
  position: relative;
  width: 100%;
}
.sidebar-nav li.search-area .input-group ::-webkit-input-placeholder {
  /* Chrome/Opera/Safari */
  color: #FFF;
}
.sidebar-nav li.search-area .input-group ::-moz-placeholder {
  /* Firefox 19+ */
  color: #FFF;
}
.sidebar-nav li.search-area .input-group :-ms-input-placeholder {
  /* IE 10+ */
  color: #FFF;
}
.sidebar-nav li.search-area .input-group :-moz-placeholder {
  /* Firefox 18- */
  color: #FFF;
}
.sidebar-nav li.search-area .input-group .search-input {
  width: 100%;
  height: 33px;
  padding: 0 34px 0 10px;
  border: 1px solid #9d9999;
  font-size: 14px;
  color: #FFF !important;
  background: #707070;
}
.sidebar-nav li.search-area .input-group .search-btn {
  padding: 0;
  display: block;
  border: none;
  position: absolute;
  right: 0;
  height: 33px;
  width: 33px;
  min-height: 33px;
  color: #FFF !important;
  top: 0;
  color: #9d9999;
  text-align: center;
  cursor: pointer;
  line-height: 33px;
}
.sidebar-nav li.search-area .input-group .search-btn:hover {
  background: none;
}
.sidebar-nav li ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: none;
  background: rgba(0, 0, 0, 0.3);
}
.sidebar-nav li ul a {
  margin: 0;
  font-size: 15px;
  min-height: 32px;
  line-height: 32px;
  padding: 9px 35px;
  margin-bottom: 1px;
  color: #FFF;
}
.sidebar-nav li ul a.open, .sidebar-nav li ul a.active, .sidebar-nav li ul a:hover {
  color: #ffffff;
  background: rgba(0, 0, 0, 0.3);
}
.sidebar-nav li ul a i.sidebar-nav-icon, .sidebar-nav li ul a i.sidebar-nav-indicator {
  color: #222222;
}
.sidebar-nav li ul a.open .sidebar-nav-icon, .sidebar-nav li ul a.open .sidebar-nav-indicator, .sidebar-nav li ul a.active .sidebar-nav-icon, .sidebar-nav li ul a.active .sidebar-nav-indicator {
  -webkit-transform: rotate(360deg);
  -ms-transform: rotate(360deg);
  transform: rotate(360deg);
}
.sidebar-nav li.active ul {
  display: block;
}
.sidebar-nav li span.icon {
  display: inline-block;
  height: 28px;
  width: 28px;
  border-radius: 50%;
  line-height: 0;
  margin-top: 5px;
  margin-right: 10px;
  padding: 6px 0 0 0px;
  text-align: center;
  float: left;
}
.sidebar-nav li span.icon i {
  color: #222222;
  font-size: 16px;
}
.sidebar-nav li span.icon.mail {
  background: #f3c47b;
}
.sidebar-nav li span.icon.facebook {
  background: #6b87c1;
  padding: 7px 0 0 0px;
}
.sidebar-nav li span.icon.sitemap {
  background: #FC5170;
  padding: 6px 0px 0 0px;
}

.is-sticky #a-cart-sticky-header {
  background: #ffffff;
  left: 0;
  margin-left: 0;
  opacity: 1;
  padding: 0px 15px;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 1100;
  display: block;
  /* transition: all 0.1s ease-in 0s; */
}

.questions_l{float:left; width:47%; margin-bottom:50px;}
.questions_r{float:right; width:47%; margin-bottom:50px;}
.ques{margin-bottom:15px; clear:both;}
.ques img{width:100%; border-radius:10px;}

.prize_bg{background:url(../images/prize_bg.png) no-repeat; height:72px;}

.main-area{background:none;}


/*footer */
footer {
  position: relative;
  background:url(../images/bottombg.jpg) no-repeat;
  padding-bottom: 30px;
  margin-top: 200px;
  background-position:bottom;
}
footer:after {
  content: '';
  display: block;
  position: absolute;
  top: -169px;
  height: 170px;
  width: 100%;
  background-size: 3000px auto;
  z-index: 0;
}
@media screen and (min-width: 992px) {
  footer:after {
    background-size: 3000px auto;
  }
}
footer:before {
  content: '';
  display: block;
  position: absolute;
  top: -170px;
  height: 270px;
  width: 100%;
  background: url(../images/footer_bg_blue.png) right top no-repeat;
  background-size: 3000px auto;
  z-index: 0;
}
@media screen and (min-width: 992px) {
  footer:before {
    background-size: 3000px auto;
  }
}
footer .footer-area {
  margin-top: 0px;
  position: relative;
  z-index: 1;
}
footer .footer-area .link-area {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 10px;
}
footer .footer-area .link-area .link-block {
  padding-right: 15px;
  display: inline-block;
  float: left;
  width: 49.9%;
}
footer .footer-area .link-area .link-block h3 {
  margin: 0;
  margin-bottom: 5px;
  font-size: 20px;
  line-height: 1.6;
  color: #000;
}
@media screen and (min-width: 768px) {
  footer .footer-area .link-area .link-block h3 {
    margin-bottom: 13px;
  }
  
}
@media screen and (max-width: 768px) {
	 header .menu-down-area ul.header-nav > li > a {
    font-size: 14px;}
	header .menu-down-area ul.header-nav > li > a {
  position: relative;
  display: block;
  font-size: 14px;
  color: #333;
  padding: 8px 5px 10px 5px;
}
	header .menu-down-area ul.header-nav > li + li {
  margin-left: 5px;}
  .main-area{background:none;}

}
footer .footer-area .link-area .link-block ul {
  padding: 0;
  margin-bottom: 20px;
}
footer .footer-area .link-area .link-block ul li {
  list-style-type: none;
  padding-bottom: 7px;
}
footer .footer-area .link-area .link-block ul li a {
  color: #333;
  font-size: 15px;
}
footer .footer-area .qrcode-area {
  display: inline-block;
  position: relative;
  padding: 10px;
  background-color: #fff;
  margin-bottom: 20px;
}
footer .footer-area .qrcode-area .text-area {
  text-align: center;
  padding-top: 5px;
  color: #bfbfbf;
  font-size: 15px;
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
}
footer .footer-area .info-area {
  margin-top: 30px;
  display: block;
  color: #fff;
  font-size: 15px;
}
footer .footer-area .info-area .title {
  padding-left: 0;
  font-size: 20px;
  color: #f68425;
  display: block;
}
@media screen and (min-width: 675px) {
  footer .footer-area .qrcode-area {
    float: left;
  }
  footer .footer-area .info-area {
    margin-top: 0px;
    float: left;
    margin-left: 50px;
  }
  footer .footer-area .info-area .title {
    display: inline-block;
  }
}
@media screen and (min-width: 768px) {
  footer .footer-area {
    margin-top: 0px;
  }
  footer .footer-area .link-area {
    width: 100%;
    float: left;
  }
  footer .footer-area .link-area .link-block {
    float: left;
    width: 16.66%;
  }
}
@media screen and (min-width: 992px) {
  footer .footer-area {
    margin-top: -40px;
  }
  footer .footer-area .qrcode-area {
    float: right;
  }
  footer .footer-area .info-area {
    margin-left: 0;
  }
}
@media screen and (min-width: 1200px) {
  footer .footer-area {
    margin-top: 25px;
  }
}
footer .footer-area:after {
  content: '';
  display: block;
  clear: both;
}
footer .copyright-area {
  display: block;
  text-align: left;
  color: #333;
  font-size: 15px;
  margin-top: 30px;
}
footer .copyright-area:after {
  content: '';
  display: block;
  clear: both;
}
footer .copyright-area span {
  margin-bottom: 5px;
  color: #333;
  display: block;
}
@media screen and (min-width: 992px) {
  footer .copyright-area {
    top: 0;
    padding-left: 0;
    margin-top: 7px;
  }
  footer .copyright-area span {
    display: inline-block;
    float: left;
  }
  footer .copyright-area span.id-number {
    float: right;
  }
}

#members_update_form.member-info .control-label{
    white-space: nowrap;
}

@media screen and (max-width: 400px){
    .unit-title-01 {
        font-size: 20px;
    }
    .unit-title-01-en {
        font-size: 16px;
        margin-top: 5px;
    }
}

.xs-user-dropdown {
  display: none;
  top: 50px;
  right: 25px;
  border: 1px solid #d7d7d7;
  background: #fff;
  position: absolute;
  z-index: 3;
  width: 100px;
  text-align: center;
  display: none;
  box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.1);
}
.xs-user-dropdown a {
  font-size: 14px;
  width: 100%;
  display: block;
  padding: 8px 10px;
  position: relative;
  z-index: 1;
  color: #5c6873;
}
.xs-user-dropdown a:hover {
  background: #505050;
  color: #fff;
}
.xs-user-dropdown a:nth-child(1):hover:after {
  content: '';
  display: block;
  position: absolute;
  right: 42px;
  top: -10px;
  border-width: 6px 6px 6px 6px;
  border-style: solid;
  border-color: transparent transparent #505050 transparent;
}
.xs-user-dropdown:before {
  content: '';
  display: block;
  position: absolute;
  right: 42px;
  top: -12px;
  border-width: 6px 6px 6px 6px;
  border-style: solid;
  border-color: transparent transparent #d7d7d7 transparent;
}
.xs-user-dropdown:after {
  content: '';
  display: block;
  position: absolute;
  right: 42px;
  top: -11px;
  border-width: 6px 6px 6px 6px;
  border-style: solid;
  border-color: transparent transparent #fff transparent;
}
.xs-user-dropdown:hover {
  display: block;
}


img.award-title{
    width: 118px;
    height: auto;
}
img.award-money{
    height: 28px;
    width: auto;
}


.news-detail .announce-list-area{
    display: table;
    table-layout: fixed;
    width:100%;
    max-width: 1120px;
    border:1px solid #5979b4;
}
.news-detail .announce-list-area .box-area{
    display: inline-block;
    width:100%;
    float: left;
}
.news-detail .announce-list-area .list-box{
    display: inline-block;
    width:100%;
    float: left;
}
.news-detail .announce-list-area .list-box .list:first-child{
    background:#5979b4;
}
.news-detail .announce-list-area .list-box .list:first-child .no,.news-detail .announce-list-area .list-box .list:first-child .title{
    color: #FFF ;
}
.news-detail .announce-list-area .list-box .list{
    display: table;
    table-layout: fixed;
    width:100%;
}
.news-detail .announce-list-area .list-box .list .no{
    padding:3px 5px 3px 10px;
    display: table-cell;
    vertical-align: middle;
    width:50px;
    color: #779FEA;
}   
.news-detail .announce-list-area .list-box .list .title{
    padding:3px 0;

    width:100%;
    text-align: left;
    vertical-align: middle;
    display: table-cell;
    color: #5979B4;

}
@media screen and (min-width: 640px){
    .news-detail .announce-list-area .box-area{
        width:50%;
    }

}
@media screen and (min-width: 992px){
    .news-detail .announce-list-area .list-box{
        width:50%;
    }
    .news-detail .announce-list-area .box-area + .box-area{
        border-left:1px solid #5979b4;

    }
    .news-detail .announce-list-area .list-box + .list-box{
        border-left:1px solid #5979b4;
    }
    .news-detail .announce-list-area .list-box .list + .list{
        border-top: 1px solid #5979b4;
    }
    .news-detail .announce-list-area .list-box .list:first-child + .list{
        border-left: 1px solid #FFF;
    }
    

}

.news-detail .announce-list-area.column-3 .list-box{
    display: table-cell;
    float: none;
        width:33.333%;
}




.popup-modal{

    display: none;
    font-family: Microsoft JhengHei;

    position: fixed;
    top: 0;
    left: 0;
    z-index: 8000;
    width: 100%;
    height: 100vh;
    background: rgba(0, 0, 0, 0.7);
    padding:  10px 10px;
    overflow-y: auto;

}
.popup-modal i{
    color:transparent;
}
.popup-modal .close{
    opacity: 1;
    width: 37px;
    height: 37px;
    background: url('../img/page/popup/close_icon_2x.png') center no-repeat;
    -webkit-background-size: 37px;
    background-size: 37px;
    z-index: 2;
    position: relative;
}
.modal-container-box{
    display: table;
    height: 100vh;
    left: 0;
    top: 0;

    position: absolute;
    width:100vw;
}
.modal-container{
    margin: auto;
    position:relative;
    /*transform-style: preserve-3d;*/
    display: table-cell;
    vertical-align: middle;
    padding:10px;
}

.competition-tw-box{
    position: relative;
    border:1px solid #FFF;
    padding:14px;
    background: #fce5cf url('../img/page/popup/dialog_bg.png') center no-repeat ; 
    overflow: hidden;
    max-width:480px;
    width: 100%;
    margin: 50px auto;
}   
.competition-tw-box:after{
    z-index: 0;
    content: '';
    display: block;
    width:508px;
    height: 280px;
    background: url('../img/page/popup/dialog_bg_left.png') left bottom  no-repeat;
    position: absolute;
    left: 0;
    opacity: 0.3;
    bottom: 0;
}

.competition-tw-box:before{
    z-index: 0;
    content: '';
    display: block;
    width:66px;
    height: 25px;
    background:url('../img/page/popup/cloud.png') center  no-repeat;
    position: absolute;
    right: -33px; 
    top:5px;
    opacity: 0.8;
}

.competition-tw-box *{
    z-index: 1;
    position: relative;
}
.competition-tw-box .btn-area{
    margin-top:10px;
}

.competition-tw-box .title,.competition-tw-box .sub-title{
    text-align: center;

}
.competition-tw-box .title{
    padding:  0 15px;
}
.competition-tw-box .sub-title{
    margin: 5px 0 8px;
    padding: 0 30px 0 20px;
    line-height: 1;
}



.competition-tw-box  .btn-area .row{
    margin-left:-7px;
    margin-right:-7px;
}
.competition-tw-box  .btn-area .row [class*="col-"]{
    padding-left: 7px;
    padding-right: 7px;
}
.competition-tw-box .exhibition-btn{
    width:100%;
    height: 44px;
    display: block;
    background: #5979B4;
    color:#FFF;
    text-decoration: none;
    text-align: center;
    font-size: 18px;
    padding: 7px 5px;
    margin-top:10px;
    border-radius: 10px;
    position: relative;
    overflow: hidden;
}
.competition-tw-box .exhibition-btn .text{
    position: relative;
    z-index: 1;

}
.competition-tw-box .exhibition-btn:after{
    content: '';
    display: block;
    width:150%;
    height: 100%;
    position: absolute;
    top:0;
    right:55%;
    background: rgba(0,0,0,0.1);
    transform: skew(20deg);
    transition: all .3s;
}
.competition-tw-box .exhibition-btn:hover:after{
    right:-10%;
    
}

.competition-tw-box .exhibition-btn .focus-text{
    font-style: italic;
    color:#fff600;
    margin-left:3px;
}



.competition-tw-box .exhibition-area{
    border:1px solid #5979B4;
}

.competition-tw-box .exhibition-area .area-title{
    background: #5979B4;
    padding: 10px;
    text-align: center;
    color: #FFF;
}
.competition-tw-box .exhibition-area .img-area{
    height: 240px;
    background: url('../img/page/popup/floor_plan_2x(320).png') center  no-repeat;
    background-size: auto 240px;
    position: relative;
}





.competition-tw-box .location{
    text-align: center;
    display: inline-block;
    padding-left: 40px;
    position: absolute;
    color:#000;
    font-size: 15px;
    left: 50%;
    top:50%;
    line-height: 1.4;
}

.competition-tw-box .location:before{
    content: '';
    display: block;
    position: absolute;
    width:32px;
    height: 32px;
    left: 0;
    top:50%;
    margin-top: -16px;
}

.competition-tw-box .location.no-1:before{
    background: url('../img/page/popup/icon_01_2x.png') center  no-repeat;
    -webkit-background-size: 32px;
    background-size: 32px;
}
.competition-tw-box .location.no-2:before{
    background: url('../img/page/popup/icon_02_2x.png') center  no-repeat;
    -webkit-background-size: 32px;
    background-size: 32px;
}

.competition-tw-box .location.no-3:before{
    background: url('../img/page/popup/icon_03_2x.png') center  no-repeat;
    -webkit-background-size: 32px;
    position: relative;

    margin: 0 auto;
    background-size: 32px;

}

.competition-tw-box .location.no-4:before{
    background: url('../img/page/popup/icon_04_2x.png') center  no-repeat;
    -webkit-background-size: 32px;
    background-size: 32px;
}
.competition-tw-box .location.no-1{
    transform: translate(calc(-170% + 20px),-445%);
}
.competition-tw-box .location.no-2{
    transform: translate(calc(-145% + 20px),-48%);

}

.competition-tw-box .location.no-3{
    padding: 0;
    transform: translate(calc(160% - 30px),-60%);

}

.competition-tw-box .location.no-4{
    transform: translate(calc(-144% + 20px),140%);

}
@media screen and (min-width: 400px){
    .competition-tw-box .exhibition-area .img-area{
        background: url('../img/page/popup/floor_plan_2x.png') center  no-repeat;
        background-size: auto 240px;
    }


    .competition-tw-box .location.no-1{
        transform: translate(-170%,-445%);
    }
    .competition-tw-box .location.no-2{
        transform: translate(-145%,-48%);

    }

    .competition-tw-box .location.no-3{
        padding: 0;
        transform: translate(160%,-60%);

    }

    .competition-tw-box .location.no-4{
        transform: translate(-145%,140%);

    }
}


@media screen and (min-width: 700px){
    .competition-tw-box .sub-title{
        margin:5px 0 15px;
    }
    .competition-tw-box{
        max-width: 700px;
    }
    .competition-tw-box .exhibition-area .img-area{
        height: 360px;
        background: url('../img/page/popup/floor_plan.png') center  no-repeat;
        background-size: auto 360px;
        position: relative;
    }
    .competition-tw-box .location{
        font-size: 18px;
    } 
    .competition-tw-box .location.no-1{
        transform: translate(calc(-170% - 50px),-540%);
    }
    .competition-tw-box .location.no-2{
        transform: translate(calc(-145% - 50px),-48%);

    }

    .competition-tw-box .location.no-3{
        padding: 0;
        transform: translate(calc(160% + 10px),-60%);

    }

    .competition-tw-box .location.no-4{
        transform: translate(calc(-145% - 50px),192%);

    }

    .competition-tw-box .col-xs-6{
        width:25%;
    }
}
@media screen and (min-width: 992px){
    
    .competition-tw-box .location.no-1:before{
        background: url('../img/page/popup/icon_01.png') center  no-repeat;
    }
    .competition-tw-box .location.no-2:before{
        background: url('../img/page/popup/icon_02.png') center  no-repeat;
    }

    .competition-tw-box .location.no-3:before{
        background: url('../img/page/popup/icon_03.png') center  no-repeat;

    }

    .competition-tw-box .location.no-4:before{
        background: url('../img/page/popup/icon_04.png') center  no-repeat;
    }
    .popup-modal .close{
        background: url('../img/page/popup/close_icon_2x.png') center no-repeat;
        -webkit-background-size: 37px;
        background-size: 37px;
    }
   
    .modal-container-box{
        width:100%;
    }
    .popup-modal{
        padding: 15px;
    }
}

.competition-content .alert-text{
    color:#c12484;
}
.competition-content .competition-img-xs{
    display: block;
    max-width: 345px !important;
    margin : 0 auto;
    width:100%;
}
.competition-content .competition-img{
    display: none;
}

@media screen and (min-width:992px){
    .competition-content .competition-img-xs{
        display: none;
    }
    .competition-content .competition-img{
        display: block;
    }
}
.competition-content .area-intro { 
    list-style: none;
    margin-top:20px;
}
.competition-content .area-intro > li{
    position: relative;  
}
.competition-content .area-intro > li:before{
    content:'';
    display: inline-block;
    position: absolute;
    width:26px;
    height: 26px;
    top: 0;
    left:-40px;

}

.competition-content h3,.competition-content h4{
    position: relative;
    padding-left:19px;
    font-size: 18px;
    color:#5979b4;
}

.competition-content h4{
    margin-top: 20px;
}

.competition-content h3:before,.competition-content h4:before{
    content: '';
    display: block;
    width:14px;
    height: 17px;
    position: absolute;
    left: 0;
    top:1px;
}
.competition-content h3:before{ 
    background: url('../img/page/competition/h3_title_icon_2x.png') center no-repeat;
    -webkit-background-size: 14px auto;
    background-size: 14px auto;
}
.competition-content h4:before{ 
    background: url('../img/page/competition/h4_title_icon_2x.png') center no-repeat;
    -webkit-background-size: 14px auto;
    background-size: 14px auto;
}



.competition-content .area-intro > li:nth-child(1):before{
    background: url('../img/page/competition/area_icon01_2x.png') center no-repeat;
    -webkit-background-size: 26px;
    background-size: 26px;
}
.competition-content .area-intro > li:nth-child(2):before{
    background: url('../img/page/competition/area_icon02_2x.png') center no-repeat;
    -webkit-background-size: 26px;
    background-size: 26px;
}
.competition-content .area-intro > li:nth-child(3):before{
    background: url('../img/page/competition/area_icon03_2x.png') center no-repeat;
    -webkit-background-size: 26px;
    background-size: 26px;
}
.competition-content .area-intro > li:nth-child(4):before{
    background: url('../img/page/competition/area_icon04_2x.png') center no-repeat;
    -webkit-background-size: 26px;
    background-size: 26px;
}

.competition-content .area-intro > li:nth-child(1) .title{
    color:#3e9e9e;
}
.competition-content .area-intro > li:nth-child(2) .title{
    color:#dc707e;
}
.competition-content .area-intro > li:nth-child(3) .title{
    color:#3ba2d7;
}
.competition-content .area-intro > li:nth-child(4) .title{
    color:#7175b4;
}
.competition-content .area-intro > li .title{
    display: block;
}
.competition-content .area-intro > li + li{
    margin-top:10px;
}
.competition-content .area-block{
    border-bottom:1px solid #DEE1E3;
    padding-bottom:25px;
}
.competition-content .area-block:last-child{
    border:none;
}

.competition-content .area-block.exhibition{
    margin-top:15px;
}
.competition-content .schedule-table{
    border-collapse: collapse;
    width:100%;
    border: 1px solid #5979B4;

}
.competition-content .schedule-table .title div{
    display: inline-block;
}
.competition-content .schedule-table tr ,.competition-content .schedule-table td{
    border: 1px solid #5979B4;
}
.competition-content .schedule-table th,.competition-content .schedule-table td{
    padding:10px 8px;
}
.competition-content .schedule-table th{
    background: #5979B4;
    color:#FFF;
    font-weight: normal;
}
.competition-content .schedule-table th + th{
    border-left: 1px solid #4668A8;

}

.competition-content .schedule-table td.time{
    font-family: Arial;
    color:#c74493;
    font-size: 15px;
    min-width: 94px;
    padding: 10px 6px;
}
.competition-content .schedule-table td .notice{
    color:#c74493;
}



.competition-content .gift-intro{ 
    list-style: none;
    margin-top:20px;
}
.competition-content .gift-intro >li{
    position: relative;  
}
.competition-content .gift-intro >li:before{
    content:'';
    display: inline-block;
    position: absolute;
    width:26px;
    height: 26px;
    top: 0;
    left:-40px;
}

.competition-content .gift-intro >li:nth-child(1):before{
    background: url('../img/page/competition/gift_icon01_2x.png') center no-repeat;
    -webkit-background-size: 26px;
    background-size: 26px;
}
.competition-content .gift-intro >li:nth-child(2):before{
    background: url('../img/page/competition/gift_icon02_2x.png') center no-repeat;
    -webkit-background-size: 26px;
    background-size: 26px;
}
.competition-content .gift-intro >li:nth-child(3):before{
    background: url('../img/page/competition/gift_icon03_2x.png') center no-repeat;
    -webkit-background-size: 26px;
    background-size: 26px;
}
.competition-content .gift-intro >li:nth-child(4):before{
    background: url('../img/page/competition/gift_icon04_2x.png') center no-repeat;
    -webkit-background-size: 26px;
    background-size: 26px;
}

.competition-content .title{
    color: #5979b4;
}
.competition-content .gift-intro >li + li{
    margin-top:10px;
}
.competition-content .gift-intro .num{
    font-weight: bold;
    font-family: Arial;
    font-size: 18px;
}

.competition-content .intro-list{
    margin-top: 3px;
    padding-left: 15px;
    list-style:none;
}
.competition-content .intro-list > li{
    position: relative;  
}
.competition-content .intro-list > li + li{
    margin-top:2px;
}
.competition-content .intro-list > li:before{

    content:'';
    display: inline-block;
    position: absolute;
    width:10px;
    height: 10px;
    top: 7px;
    left:-15px;
    background: url('../img/page/competition/li_icon_2x.png') center no-repeat;
    -webkit-background-size: 10px;
    background-size: 10px;
}
.competition-content .intro-list .img-area{
    margin-top:7px;
}
.competition-content .intro-list .img-area:after{
    content: '';
    display: block;
    clear: both;
}

.competition-content .intro-list .img-area img{
    margin-right: 3px;
    margin-bottom: 3px;
    float: left;
}
.competition-content .intro-list .img-area img:last-child{
    margin-right: 0;
}


.competition-content .video-area{
    width:100%;
    max-width: 600px;
    /*margin: 0 auto;*/
    margin-bottom: 10px;
}
.competition-content .video-area .iframe-area{
    position: relative;
    width:100%;
    padding-bottom: 56.25%;
}
.competition-content .video-area .iframe-area iframe{
    width:100%;
    height: 100%;
    position: absolute;
    top:0;
    left:0;
}

.competition-content ol{
    padding-left:37px;
    margin-bottom: 15px;
}

.competition-content ol >li + li{
    margin-top: 3px;
}
@media screen and (min-width: 992px){
    .competition-content .area-block.exhibition {
        display: table;
    }
    .competition-content .area-block.exhibition .img-area ,.competition-content .area-block.exhibition .text-area{
        display: table-cell;
        vertical-align: top;
    }
    .competition-content .area-block.exhibition .text-area{
        padding-left:20px;
        
    }
    .competition-content .area-block.exhibition .img-area{
        width:500px;        
    }
    .competition-content .area-block.exhibition .area-intro{
        margin-top: 0;
    }
    .competition-content .area-intro > li:nth-child(1):before{
        background: url('../img/page/competition/area_icon01.png') center no-repeat;
    }
    .competition-content .area-intro > li:nth-child(2):before{
        background: url('../img/page/competition/area_icon02.png') center no-repeat;
    }
    .competition-content .area-intro > li:nth-child(3):before{
        background: url('../img/page/competition/area_icon03.png') center no-repeat;
    }
    .competition-content .area-intro > li:nth-child(4):before{
        background: url('../img/page/competition/area_icon04.png') center no-repeat;
    }
    .competition-content .gift-intro >li:nth-child(1):before{
        background: url('../img/page/competition/gift_icon01.png') center no-repeat;
    }
    .competition-content .gift-intro >li:nth-child(2):before{
        background: url('../img/page/competition/gift_icon02.png') center no-repeat;
    }
    .competition-content .gift-intro >li:nth-child(3):before{
        background: url('../img/page/competition/gift_icon03.png') center no-repeat;
    }
    .competition-content .gift-intro >li:nth-child(4):before{
        background: url('../img/page/competition/gift_icon04.png') center no-repeat;
    }

    .competition-content .intro-list > li:before{
        background: url('../img/page/competition/li_icon.png') center no-repeat;
    }

    .competition-content h3:before{ 
        background: url('../img/page/competition/h3_title_icon.png') center no-repeat;
    }
    .competition-content h4:before{ 
        background: url('../img/page/competition/h4_title_icon.png') center no-repeat;
    }




}


.fixed-btn-area {
     z-index: 4998;
     position: fixed;
     right: 20px;
     bottom: 30px;
     height: 60px;
}
 @media screen and (min-height: 300px) {
     .fixed-btn-area {
         bottom: 15px;
    }
}
 @media screen and (min-width: 1170px) {
     .fixed-btn-area {
         right: initial;
         left: 50%;
         margin-left: 485px;
    }
}
@media screen and (min-width: 1200px) {
     .fixed-btn-area {
         left: initial;
         right: 30px;
    }
}
@media screen and (min-width: 1323px){
    .fixed-btn-area {
        right: initial;
        left: 50%;
        margin-left: 585px;
    }
}

 .fixed-btn-area .fixed-btn {
     display: block;
     width: 40px;
     height: 40px;
     line-height: 34px;
     position: relative;
     cursor: pointer;
     margin-bottom: 5px;
     text-align: center;
     background: #fff;
     font-size: 13px;
     font-weight: bold;
     color: #595656;
     border: 2px solid #9f9f9f;
     overflow: hidden;
     transition: color 0.3s;
}
 .fixed-btn-area .fixed-btn:before {
     content: '';
     display: block;
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     background: #456cb5 ;
     z-index: -1;
     transform: scale(0);
     -ms-transform: scale(0);
     -webkit-transform: scale(0);
     transition: all 0.3s;
}
 .fixed-btn-area .fixed-btn.top {
     background: #fff url(../img/page/go_top_2x.png) no-repeat;
     background-position: 4px 4px;
     background-size: auto 28px;
}
 .fixed-btn-area .fixed-btn.top:hover {
     background: #fff url(../img/page/go_top_hover_2x.png) no-repeat;
     background-size: auto 28px;
}
 .fixed-btn-area .fixed-btn:hover.top {
     background-color: transparent;
     border: none;
     line-height: 38px;
     background-position: 6px 6px;
     color: #fff;
}
 .fixed-btn-area .fixed-btn:hover.top:before {
     transform: scale(1);
     -ms-transform: scale(1);
     -webkit-transform: scale(1);
}
 @media screen and (min-width: 768px) {
     .fixed-btn-area .fixed-btn {
         width: 48px;
         height: 48px;
    }
     .fixed-btn-area .fixed-btn.top {
         background-position: 8px 8px !important;
    }
     .fixed-btn-area .fixed-btn.top:hover {
         line-height: 48px;
         background-position: 10px 10px !important;
    }
}
 @media screen and (min-width: 768px) and (min-width: 992px) {
     .fixed-btn-area .fixed-btn.top {
         background: #fff url(../img/page/go_top.png) no-repeat;
         background-position: 8px 8px;
    }
     .fixed-btn-area .fixed-btn.top:hover {
         background: url(../img/page/go_top_hover.png) no-repeat;
    }
}