/* ========== */
/* = SITE-BANNER = */
/* ========== */
.ny-banner{ width: 100%; height:580px; text-align: center;}
.ny-banner .text{ display: none; padding-top: 250px; color: #FFFFFF; }
.ny-banner .text p{ font-size: 52px; font-weight: bold; letter-spacing:5px; text-shadow:0 0 10px rgba(0,0,0,.6);}
.ny-banner .text span{ margin-top: 10px; display: inline-block; line-height: 44px; min-width: 420px; padding: 0 35px; letter-spacing:4px; background: #0077b4; font-size:26px;}

@media (max-height:800px){
	.ny-banner{ height: 480px;}
	.ny-banner .text{ padding-top:200px;}
}


/* ========== */
/* = NY-SUB = */
/* ========== */
.ny-sub{ background: #333333; border-bottom: 1px solid rgba(255,255,255,.1); position: relative;}
.ny-sub .sub{ background: #333333;float: right; max-width: 73%; border-left: 1px solid rgba(255,255,255,.1); }
.ny-sub .sub a{ float: left; width: 200px;  border-right: 1px solid rgba(255,255,255,.1); display: block; line-height: 80px; text-align: center; font-size: 17px; letter-spacing: 2px; color: #bbbbbb;}
.ny-sub .sub a.active{ background: #0077b4; color: #FFFFFF; font-weight: bold; }
.ny-sub .sub a:hover{ color: #FFFFFF;}
.ny-sub .sub5 a{ width: 130px; }
.ny-sub .bread{ float: left; padding-left:25px; line-height: 80px; color: #999999;}
.ny-sub .bread a{ margin: 0 6px; display: inline-block; color: #999999;}
.ny-sub .bread a:hover{ color: #c9c9c9;}
#anchor-point{ position: absolute; left:0; top:-100px;}


.submenu a{ margin-top:6px; margin-right: 15px; float: left; width: 140px; height: 40px; line-height: 38px; text-align: center; border:1px solid #b2b2b2;}
.submenu a.active{ background: #0077b4; border: 1px solid #0077b4; color: #FFFFFF; font-weight: bold;}


/* ========== */
/* = FILTER = */
/* ========== */
.filter{ padding-top: 45px; background: #333333;}
.filter .item{ margin-top: 5px; position: relative; padding-left:72px;}
.filter .item span{ position: absolute; top:10px; left:0; font-size: 18px; color: #ffffff; font-weight: bold; letter-spacing: 3px;}
.filter .item a{ margin-top: 10px; line-height: 30px; display: inline-block; padding: 0 3px; min-width: 90px; text-align: center; margin-right:30px; color: #bbbbbb;}
.filter .item a.active{ background: #0077b4; color:#FFFFFF;}
.filter .item a:hover{ color:#fff;}
.filter .box{ margin-top: 30px; line-height: 38px; padding:30px 0; border-top: 1px solid rgba(255,255,255,.1)}
.filter .box .text{ float: left; color: #bbbbbb; letter-spacing: 1px;} 
.filter .box .search-box{ float: right; width: 100%; max-width: 350px; height: 38px; padding-right: 78px; position: relative;} 
.filter .box .search-box .in{ float: left; width: 100%; line-height: 24px; height: 38px; padding:7px 18px; background: #FFFFFF; border: none; font-size: 12px; border-radius: 0;}
.filter .box .search-box .button{ position: absolute; top:0; right:0; height: 38px; line-height: 38px; width: 77px; border-radius: 0;}


.filter-selected{ position: relative;line-height: 0.7rem; min-height: 0.7rem; padding-left: 1.7rem; font-size: 0.3rem;  color: #b2b2b2;}
.filter-selected span{ position: absolute; top:0; left:0; font-weight: bold;}
.filter-selected i{ margin-right: 0.2rem; font-style: normal;}

.filter-mobile{ margin-bottom:0.4rem; position: relative; z-index: 9;}
.filter-mobile .tab{ border-top: 1px solid rgba(255,255,255,.2); border-bottom: 1px solid rgba(255,255,255,.2); font-size: 0.3rem; }
.filter-mobile .tab div{ float: left; width:25%; height: 37px; line-height:37px; color: #bbbbbb; padding:0 0.32rem; position: relative;}
.filter-mobile .tab div.active{ color: #FFFFFF;}
.filter-mobile .tab div.active:after{ border-color:#FFFFFF transparent transparent transparent ;}
.filter-mobile .tab div:after{ position: absolute; top:18px; right:0.3rem; content:""; width: 0px; height: 0px; border-style: solid dashed dashed dashed;  border-color: rgba(255,255,255,.3) transparent transparent transparent ; border-width:4px;}
.filter-mobile .tab div:before{ position: absolute; top:50%; left:0; margin-top: -9px; content: ""; height: 18px; width: 1px; background: rgba(255,255,255,.1);}
.filter-mobile .tab div:first-child:before{ display: none;}
.filter-mobile .con{ display: none; position: absolute; top:39px; left:0; width: 100%; text-align: center; padding:0.53333333rem 0.26666666rem; background: rgba(0,0,0,.9);}
.filter-mobile .con a{ float: left; display: inline-block; line-height:32px; height: 32px; margin:1%; font-size: 0.3rem; border: 1px solid rgba(255,255,255,.3); padding:0 0.5rem; color: #CCCCCC; border-radius:3px;}
.filter-mobile .con a.active{ background: rgba(255,255,255,.3);}


/* ========== */
/* = PAGE = */
/* ========== */
.page{ text-align: center; line-height:38px; font-size: 0;}
.page a,
.page span{display: inline-block; margin: 0 5px; font-style: normal; height:38px; min-width: 38px; background: #d5d5d5; padding: 0 5px; font-size: 12px;}
.page a:hover,
.page span:hover,
.page a.current,
.page span.current{ background: #0077b4; font-weight: bold; color: #FFFFFF;}
.page .abt{ padding: 0 22px;}


/* ========== */
/* = FLIP = */
/* ========== */
.flip{ padding:30px 0; border-top: 1px solid #f5f5f5;  border-bottom: 1px solid #f5f5f5;}
.flip a{ max-width:48%; display: inline-block; position: relative; line-height:50px; color:#333333; font-size:18px;}
.flip a:before{ content: ""; width:10px; height: 18px; position: absolute; top:50%; margin-top: -9px;}
.flip .prev{ float: left; padding-left:44px;}
.flip .prev:before{ left:0; background-size: cover;}
.flip .next{ float: right; padding-right:44px;}
.flip .next:before{ right:0;  background-size: cover;}
.flip a:hover{ color: #0077b4;}

.ny-button{ display: block; width: 195px; height: 60px; line-height: 60px; color: #FFFFFF; background: #0077b4; font-size: 14px; text-align: center; cursor: pointer;}
.theme-tit{ text-align: center; font-size: 36px; color: #333333;}
.theme-des{ margin: 5px auto 0; max-width:680px; letter-spacing: 2px; text-align: center; font-size: 18px; line-height: 28px; color: #b1b1b1;}


@media (max-width:999px) {
	/* ========== */
	/* = SITE-BANNER = */
	/* ========== */
	.ny-banner{ display: none;}
	
	
	/* ========== */
	/* = NY-SUB = */
	/* ========== */
	.ny-sub{ height:0; border-bottom:none;}
	.ny-sub .w1200{ padding: 0;}
	.ny-sub .sub{ max-width: 100%; border-left: none; position:fixed; top:1.12rem; right:0; width: 100%; z-index: 99; border-bottom: 1px solid #4d4d4d;}
	.ny-sub .sub a{ width: 25%; height: 1.3rem; line-height: 1.3rem; font-size: 0.3rem; letter-spacing:0;}
	.ny-sub .sub2 a{ width: 50%;}
	.ny-sub .sub3 a{ width: 33.333333%;  }
	/*.ny-sub .sub5 a{ width: 20%; font-size: 0.24rem; }*/
	#anchor-point{ top:-2.42rem;}
	
	.submenu a{ font-size:0.28rem; width:32.3%; margin-right:1.5%;}
	.submenu a:nth-child(3n){ margin-right: 0;}
	.submenu4 a{ width:23.5%;margin-right: 2%;}
	.submenu4 a:nth-child(3n){ margin-right: 2%;}
	.submenu4 a:nth-child(4n){ margin-right: 0;}
	
	
	/* ========== */
	/* = FILTER = */
	/* ========== */
	.filter{ padding-top: 0.8rem; font-size: 0.3rem;}
	.filter .box{ margin-top: 0.4rem; padding:0.3rem 0 0.6rem;}
	.filter .box .search-box{ width: 100%; max-width: 100%;} 
	
	
	/* ========== */
	/* = PAGE = */
	/* ========== */
	.page{ line-height: 32px;}
	.page a,
	.page span{ margin:2px; height:34px; min-width:34px; }
	.page .abt{ padding: 0 8px;}
	
	/* ========== */
	/* = FLIP = */
	/* ========== */
	.flip{ padding:30px 0;}
	.flip a{ max-width:48%; font-size:13px;}
	.flip .prev{ padding-left:20px;}
	.flip .next{ padding-right:20px;}
	
	.ny-button{ width:3rem; height:1rem; line-height:1rem; font-size:0.28rem;}
	.theme-tit{ font-size: 0.48rem; font-weight: bold;}
	.theme-des{ font-size:0.32rem; line-height: 0.5rem;}
}




/* ========== */
/* = CASE = */
/* ========== */
.case{ padding: 50px 0 80px;}
.case-list{ margin-bottom: 25px;}
.case-list li{ float: left; margin-bottom: 25px; width: 49%; margin-right:2%;}
.case-list li:nth-child(2n){ margin-right: 0;}
.case-list li:nth-child(2n+1){ clear: both;}
.case-item{ display: block; border: 1px solid #c1c1c1;}
.case-item .img{ position: relative;overflow: hidden;}
.case-item .img img{ width: 100%;}
.case-item .img:after{ display: none; content: ""; position: absolute; top:2.2%; left:2%; width: 96%; height:94.4%; border:1px solid rgba(202,171,110,.7);}
.case-item .img div{ display: none; position: absolute; top:50%; margin-top: -15px; left:0; width: 100%; height: 30px; line-height: 30px; text-align: center;}
.case-item .img div span{ font-size: 24px; font-weight: bold; letter-spacing:5px; position:relative;}
.case-item .img div span:after,
.case-item .img div span:before{ content: ""; position: absolute; margin-top: -2px; top:50%; width: 32px; height: 3px; background: #caab6e;}
.case-item .img div span:after{ right:-60px;}
.case-item .img div span:before{ left:-60px;}
.case-item .text{ padding: 0 33px;}
.case-item .tit{ padding: 25px 0 15px; }
.case-item .tit p{ font-size: 22px; color: #333333; line-height:30px;}
.case-item .tip{ margin-top: 10px;  position: relative;line-height: 24px;  }
.case-item .tip span{ float: left; display: block; width: 31%; position: relative;}
.case-item .tip span:after{ content: ""; position: absolute; top:50%; right:0; background: #d6d6d6; height: 12px; width: 1px; margin-top: -6px;}
.case-item .tip span:nth-child(2){ text-align: center; width: 42%;}
.case-item .tip span:nth-child(3){ text-align: right; width: 26%;}
.case-item .tip span:nth-child(3):after{ display:none; }
.case-item .tip i{ line-height: 24px; display: inline-block; padding-left: 22px;  font-style: normal;}
.case-item .erweima{ padding: 17px 0; border-top: 1px solid #dadada; line-height: 50px;  position: relative;}
.case-item .erweima span{ float: left;  padding-left:25px;}
.case-item .erweima div{ float: right; display:none;}
.case-item:hover { background: #0077b4;color: #FFFFFF;}
.case-item:hover .img img{ transform: scale(1.1); -webkit-transform: scale(1.1);}
.case-item:hover .tit p{ color: #FFFFFF;}
.case-item:hover .tip span:after{ background: rgba(255,255,255,.2);}
.case-item:hover .erweima{  border-top: 1px solid rgba(255,255,255,.2);}
.case-item:hover .erweima div{ display: block;}


.ny-left{ float: left; width:78.5%;}
.ny-right{ float: right; width:20%;}
.ny-right .item{ margin-bottom: 15px; position: relative;}
.ny-right .item img{ width: 100%;}
.ny-right .item .text{ position:absolute; top:0; left:0; width: 100%; height: 100%; color:#FFFFFF;}
.ny-right .item .con{ display: inline-block; width: 100%; vertical-align: middle; text-align: center;}
.ny-right .item .con+i{ display: inline-block; vertical-align: middle; height: 100%;}
.ny-right .item h2{ font-size:30px; font-weight: bold;}
.ny-right .item em{ margin: 10px 0; display: inline-block; width: 10px; height: 10px; border: 2px solid #0077b4; border-radius: 100%; position: relative;}
.ny-right .item em:before,
.ny-right .item em:after{ content: ""; position: absolute; top:50%; width: 40px; height: 1px; background: rgba(255,255,255,.2);}
.ny-right .item em:before{ left:-42px;}
.ny-right .item em:after{ right:-42px;}
.ny-right .item p{ font-size: 15px; line-height: 24px;}
.ny-right .item span{ position: relative; margin: 25px auto 0; display: block; max-width:60%; width: 160px; height: 44px; line-height: 44px; text-align: center; background: #0077b4; color: #FFFFFF; font-size: 13px;}
.ny-right .item:hover span{ background: #00689e;}




.case-form{ clear: both; background: #333333;}
.case-form .tit{ line-height:80px; font-size: 26px; color: #FFFFFF; text-align: center; border-bottom: 1px solid rgba(255,255,255,.15);}
.case-form .con{ padding: 28px 22px;}
.case-form .con .in{ margin-bottom: 15px; position: relative; width: 100%; padding: 0 20px; background: #eeeeee; font-size: 12px;}
.case-form .con .in>span{ position: absolute; top:8px; left:0px; width: 16px; text-align: right; font-weight: bold; color: #ff0000;}
.case-form .con .in input{ border: none; background: none; width: 100%; height:36px; line-height:16px; padding:5px 0; }
.case-form .con .bt input{ width: 100%; height: 36px; line-height: 36px; background: #0077b4; color: #FFFFFF;}
.case-form .con .select-div{ padding:0;}
.case-form .con .dropdown .selected,
.case-form .con .dropdown li{ padding:0 0 0 20px; height: 36px; line-height: 36px;}
.case-form .con .dropdown .carat{ right:12px;}
.case-form .con .tip{ margin-top: 12px; color: #FFFFFF; font-size: 12px;}
.case-form .con .num{ margin-top: 25px; background: #0077b4; color:#FFFFFF; padding:10px 5px; text-align: center;  display: block;}
.case-form .text{ margin-top: 15px; font-size: 12px; height: 96px; text-align: center;}
.case-form .text .swiper-slide{ line-height: 24px; color: rgba(255,255,255,.6);}
.case-form .text .swiper-slide span{ width: 30%; display: inline-block; text-align: center; }




/* ========== */
/* = CASE-DETAIL = */
/* ========== */
.case-detail-imgbox{ background: #303030; color:#FFFFFF; text-align:center}
.case-detail-imgbox .swiper-slide{ background: #303030;}
.case-detail-imgbox .img{ position: relative; padding-bottom: 55%;}
.case-detail-imgbox .space-img{ padding-bottom: 31.25%;}
.case-detail-imgbox .img img{ position: absolute;  top: 0;  left: 0; right: 0; bottom: 0; margin: auto; max-height: 100%; max-width: 100%;}
.case-detail-imgbox .img p{ position: absolute; left:0; bottom:60px; width: 100%; text-align: center;}
.case-detail-imgbox .img i{ margin-left: 15px; display: inline-block; vertical-align: middle; position: relative; padding-left: 15px; border-left: 3px solid #0077b4; line-height: 26px; font-style: normal;}
.case-detail-imgbox .img span{ display: inline-block; vertical-align: middle; font-size: 30px; }
.case-detail-area{ padding: 40px 0; background: #333333; text-align: center;}
.case-detail-area span{ margin: 0 8px; display:inline-block; padding: 0 10px; min-width: 120px; line-height: 42px; height: 44px; border: 1px solid #757575; color:#FFFFFF; cursor: pointer;}
.case-detail-area span.active{  background: #FFFFFF; border: 1px solid #FFFFFF; color: #333333;}



.case-detail{ padding: 60px 0;}
.case-detail .content{ position: relative; min-height: 480px; padding-right: 250px;}
.case-detail .top{ position: relative; padding-right: 200px;}
.case-detail .title{ position: relative; padding-top:40px; font-size:36px; line-height:44px; color: #222222;}
.case-detail .title:before{ content: ""; position: absolute; top:0; left:0; width: 55px; height: 6px; background: #0077b4;}
.case-detail .des{ margin-top: 20px; line-height:28px; color: #a8a8a8; }
.case-detail .des em{ font-style: normal; margin: 0 25px; }
.case-detail .erweima{ position: absolute; top:50px; right:0; width: 200px; text-align:center;}
.case-detail .erweima p{ margin-top: 10px; color: #c4c4c4; font-size: 12px;}
.case-detail .text{ margin-top: 20px; border-top: 1px solid #f4f4f4; padding-top: 35px; line-height: 24px;}
.case-detail .text h3{ margin-bottom: 12px; font-size: 24px; line-height: 32px; color: #0077b4;}
.case-detail .text h2{ margin-bottom: : 25px; font-size: 16px; color: #222222;}
.case-detail .text div{   color: #9a9a9a;  min-height: 96px; text-align: justify;}
.case-detail .ny-button{ margin-top:45px;}
.case-detail .desinger-box{ position: absolute; top:0; right:0; width: 240px; padding-left: 44px;  border-left: 1px solid #f4f4f4;  text-align: center;}
.case-detail .desinger-box .box img{ width: 100%;}
.case-detail .desinger-box .box span{ margin-top: 20px; display: block; font-size: 18px; color: #222222;}
.case-detail .desinger-box .box p{ margin-top: 5px; color: #222222;}
.case-detail .desinger-box .bt{ margin-top: 22px; display:inline-block; width: 100%; max-width: 158px; height: 40px; line-height: 40px; background: #0077b4; color: #FFFFFF; text-align: center;}
.case-detail .desinger-box .bt2{ margin-top: 15px; background: #333333;}

.space-detail .content{ padding-right: 0; padding-left: 250px;}
.space-detail .desinger-box{ right:auto; left:0; padding-left: 0;  padding-right:44px; border-left:none; border-right: 1px solid #f4f4f4;}


.relevant-case{ padding: 45px 0 80px; background: #333333;}
.relevant-case .theme-tit{ color: #FFFFFF;}
.relevant-case ul{ margin-top: 50px;}
.relevant-case li{ margin-bottom: 30px; float: left; width: 32.33333%; margin-right:1.5%;}
.relevant-case li:nth-child(3n){ margin-right: 0;}
.relevant-case li:nth-child(3n+1){ clear: both;}
.relevant-case .case-item{ background: #424242; border: 1px solid #424242; color:rgba(255,255,255,.8);}
.relevant-case .case-item .tit p{ color: #FFFFFF;}
.relevant-case .case-item .tip span:after{ background: rgba(255,255,255,.1);}
.relevant-case .case-item .erweima{ border-top: 1px solid rgba(255,255,255,.1);}
.relevant-case .case-item:hover{ background: #0077b4;}

.relevant-case .case-item .tip { font-size: 13px; }
.relevant-case .case-item .tip span{ width: 35%; }
.relevant-case .case-item .tip span:nth-child(2){ width:41%; }
.relevant-case .case-item .tip span:nth-child(3){ width: 24%; }

.relevant-case .slick{ margin:30px -15px;}
.relevant-case .slick .item{ float: left; width: 33.3333333%; padding:15px;}
.relevant-case .slick-prev{ left:-60px;}
.relevant-case .slick-next{ right:-60px;}

.relevant-case .case-item .text{ padding: 0 25px; }



/* ========== */
/* = threeD = */
/* ========== */
.threeD{ padding: 50px 0 80px;}
.threeD ul{ margin-bottom: 50px;}
.threed-item{ margin-bottom: 40px; padding:35px 25px; border: 1px solid #c1c1c1; display: flex; flex-flow: wrap; align-items: center; justify-content: space-between; position:relative;}
.threed-item .img{ width: 51%; padding-bottom: 35%; background: #000000; position: relative; overflow: hidden;}
.threed-item .img:after{ content: ""; position: absolute; top:50%; left:50%; margin-top: -35px; margin-left: -40px; width: 70px; height: 70px; background-size: cover; background-color: #FFFFFF; border-radius: 50%; }
.threed-item .img iframe{ position: absolute; top:0; left:0; width: 100%; height: 100%; border: none; background: none;}
.threed-item .right{ width: 49%; padding:0 3% 0 6%; position: relative;}
.threed-item .tit{ display: block; font-size:22px; color:#333333;}
.threed-item .tip{ margin-top: 15px; color: #999999;}
.threed-item .tip span{ display: inline-block; margin:0 15px;}
.threed-item .box{ position: relative; margin-top: 22px; padding-top: 25px; border-top: 1px solid rgb(160,160,160,.1);}
.threed-item .box:after{ content: ""; position: absolute; top:30px; right:0; width: 30px; height: 30px;}
.threed-item .box .head-img{ display: inline-block; vertical-align: middle; width: 40px; height: 40px; border-radius:100%; overflow: hidden;}
.threed-item .box span{  margin-left:15px; color: #0077b4; display: inline-block; vertical-align:middle; line-height: 40px;} 
.threed-item .con{ margin: 25px 0 30px; padding-bottom:30px; border-bottom: 1px solid rgb(160,160,160,.1);}
.threed-item .con p{color: #999999; line-height: 20px; font-size: 12px; overflow: hidden;}
.threed-item .bt{ position: relative; display:inline-block; margin-right: 20px; background: #0077b4; color: #FFFFFF; width: 155px; height:46px; line-height: 46px; text-align: center; font-size: 12px;}
.threed-item .bt.mb-block{ display: none; }
.threed-item:hover{ background: #333333; color: #FFFFFF;}
.threed-item:hover .img:after{ display:none;}
.threed-item:hover .tit{ color: #FFFFFF;}
.threed-item:hover .tip{ color: #FFFFFF;}
.threed-item:hover .box{ color: rgba(255,255,255,.8);}


@media (max-width:999px) {
	
	/* ========== */
	/* = CASE = */
	/* ========== */
	.case-list li{ width: 100%; margin-right: 0;}
	.case-item{ font-size: 12px;}
	.case-item .tit p{ font-size:0.44rem; font-weight: bold;}
	.case-item .text{ padding: 0 18px;}
	.case-item .erweima{ display: none;}
	.case-form .tit{ font-size:0.5rem; font-weight: bold;}
	.case-item:hover { background: #FFFFFF; color: #666;}
	.case-item:hover .img img{ transform:none; -webkit-transform:none;}
	.case-item:hover .tit p{ color: #333;}
	.case-item:hover .tip span:after{ background:#d6d6d6;}
	
	.ny-left{ width: 100%;}
	.ny-right{ width: 100%; padding-top: 40px;}
	.ny-right .item{ float: left; width: 49%; margin-left:2%;}
	.ny-right .item:first-child{ margin-left: 0;}
	.ny-right .item h2{ font-size:0.5rem;}
	.ny-right .item p{ font-size: 0.3rem; line-height: 0.54rem;}
	.ny-right .item span{ margin-top: 0.25rem; font-size: 0.24rem; height: 0.9rem; line-height: 0.9rem;}
	.ny-right .item span:after{ display: none;}
	
	
	/* ========== */
	/* = CASE-DETAIL = */
	/* ========== */
	.relevant-case li{ width: 100%;}
	.relevant-case .case-item:hover{ background: #424242; border: 1px solid #424242; color:rgba(255,255,255,.8);}
	.relevant-case .case-item:hover .tit p{ color: #FFFFFF;}
	.relevant-case .case-item:hover .tip span:after{ background: rgba(255,255,255,.1);}
	.relevant-case .case-item:hover .erweima{ border-top: 1px solid rgba(255,255,255,.1);}

	
	/* ========== */
	/* = THREED = */
	/* ========== */
	.threeD{ padding-top: 50px; padding-bottom: 50px; }
	.threeD ul{ margin-bottom: 50px;}
	.threed-item{ padding: 20px;}
	.threed-item .box:after{ display: none; }
	.threed-item .img{ width: 100%; padding-bottom: 60%;}
	.threed-item .img:after{ width: 50px; height:50px; margin-top: -25px; margin-left: -25px;}
	.threed-item .right{ width: 100%; padding: 0; margin-top: 25px;}
	.threed-item .tit{ font-size: 18px; position: relative; padding-right: 120px;}
	.threed-item .tip{  font-size: 0.26rem; }
	.threed-item .tip span{ margin:0 0.15rem; }
	.threed-item .bt{ margin:0; position: absolute; top:-8px; right:0; width: 100px; line-height: 36px; height: 36px; }
	.threed-item .bt.mb-block{ display: block; top:25px; }
	.threed-item .bt.pc-block{ display: none; }
	.threed-item .con{ border-bottom: none; padding-bottom: 0; margin-bottom: 0; }
	.threed-item:hover{ background: #FFFFFF; color: #666666;}
	.threed-item:hover .tit{ color: #333333;}
	.threed-item:hover .tip{ color: #999999; font-size: 0.26rem; }
	.threed-item:hover .box{ color: #666666;}
	

}



/* ========== */
/* = DESINGER = */
/* ========== */
.desinger{ padding: 50px 0 80px;}
.desinger ul{ margin-bottom: 15px;}
.desinger-ul li{ float: left; width: 49.4%; margin-right:1.2%;}
.desinger-ul li:nth-child(2n){ margin-right: 0;}
.desinger-item{ margin-bottom: 35px; display: block; position: relative; display: flex; flex-flow: wrap; align-items: center; justify-content: space-between; border: 1px solid #afafaf; color: #333333;}
.desinger-item .img{ width: 44%; overflow: hidden;}
.desinger-item .img img{ width: 100%;}
.desinger-item .text{ width: 56%; padding: 10px 38px;}
.desinger-item .text .tit{ padding-bottom: 20px; line-height: 24px; padding-right: 75px; position: relative; font-size: 20px;  color: #333333; letter-spacing:1px;}
.desinger-item .text .tit:after{ content: ""; position: absolute; bottom:0; left:0; width: 44px; height: 6px; background: #0071b1;}
.desinger-item .text .tit i{ margin-left: 10px; color: #cecece; font-size: 14px; font-style: normal;}
.desinger-item .text .tit .heart{ position: absolute; top:0; right: 0; line-height: 24px; font-size: 12px; display: inline-block; padding-left: 18px;}
.desinger-item .text .des p{ margin-top: 15px; font-size: 12px; padding-left: 24px; background-repeat: no-repeat; background-position: left center;}
.desinger-item .text .des p:nth-child(1){ margin-top: 25px;}
.desinger-item .text .tip{ margin-top: 14%; font-size:12px;}
.desinger-item .text .tip em{ margin-left: 10px; font-style: normal; display: inline-block; vertical-align:bottom; line-height: 22px; font-style: normal; } 
.desinger-item .text .appoint-button{ display: inline-block; vertical-align: bottom; text-align: center; width:50%; max-width: 128px; height: 26px; line-height:22px; font-size: 14px; border:2px solid #0071b1; background: #0071b1; color: #FFFFFF; cursor: pointer;}
.desinger-item .text .dimg{ margin-top:10%;}
.desinger-item .text .dimg a{  float: left; width: 48%; margin-right:4%;}
.desinger-item .text .dimg a:nth-child(2n){ margin-right:0;}
.desinger-item:hover{ background: #0071b1; color: #FFFFFF;}
.desinger-item:hover .img img{ transform: scale(1.1); -webkit-transform: scale(1.1);}
.desinger-item:hover .tit{ color: #FFFFFF;}
.desinger-item:hover .tit i{ color: #FFFFFF;}
.desinger-item:hover .des{ color: #FFFFFF;}
.desinger-item:hover .text .appoint-button{ border: 2px solid #FFFFFF;}




/* ========== */
/* = DESINGER = */
/* ========== */
.desinger-detail{ padding: 50px 0;}
.desinger-detail .left{ float: left; width:30%;}
.desinger-detail .left img{ width: 100%;}
.desinger-detail .right{ float: right; width: 70%; color: #333333;}
.desinger-detail .tit{ line-height:66px; padding-left:40px; position: relative;}
.desinger-detail .tit h2{ display: inline-block; font-size: 28px; font-weight: bold; position: relative; }
.desinger-detail .tit h2:before{ content: ""; position: absolute; left:0; bottom:-5px; width: 58px; height:6px; background: #0077b4;}
.desinger-detail .tit i{ margin-left: 12px; font-style: normal; font-size: 18px; color: #8a8a8a;}
.desinger-detail .con{ margin-top:30px; border-top: 1px solid #e8e8e8; padding:0 40px; font-size:0;}
.desinger-detail .tip span{ margin: 25px 5px 0;  display: inline-block; font-size: 20px; border: 1px solid #0077b4; line-height: 40px; padding: 0 20px; min-width: 110px; text-align: center;}
.desinger-detail .des p{ position: relative; padding-left:130px; margin-top: 35px; font-size: 14px; line-height: 24px; min-height: 24px;}
.desinger-detail .des p .ico{ position: absolute; top:0; left:0;}
.desinger-detail .des p span{ margin-right: 30px;}
.desinger-detail .ico{ font-size: 18px; font-weight: bold; line-height: 24px; font-style:normal; padding-left:35px; background-position: left center; background-repeat: no-repeat;}
.desinger-detail .appoint-button{ margin-top: 35px;}

.relevant-desinger{ padding: 50px 0 45px;}
.relevant-desinger .theme-tit{ margin-bottom: 50px;}

@media (max-width:999px) {
	/* ========== */
	/* = DESINGER = */
	/* ========== */
	.desinger-ul li{ width: 100%; margin-right: 0;}
}

@media (max-width:640px) {
	/* ========== */
	/* = DESINGER = */
	/* ========== */
	.desinger-item .text{ padding:10px 15px;}
	.desinger-item .text .tit{ padding-bottom: 0; padding-right: 0; font-size:0.5rem; font-weight:bold; letter-spacing: 0;}
	.desinger-item .text .tit:after{ display: none;}
	.desinger-item .text .tit i{ font-size: 12px;}
	.desinger-item .text .tit .heart{ display: none;}
	.desinger-item .text .des p{ margin-top:10px;}
	.desinger-item .text .des p:first-child{ margin-top: 15px;}
	.desinger-item .text .dimg{ display:none;}
	.desinger-item .text .tip em{ display: none;}
	.desinger-item .text .tip .appoint-button{ width: 130px; }
	.desinger-item:hover{ background: #FFFFFF; color: #666;}
	.desinger-item:hover .img img{ transform:none; -webkit-transform:none;}
	.desinger-item:hover .tit{ color: #333333;}
	.desinger-item:hover .tit i{ color: #cecece;}
	.desinger-item:hover .des{ color: #666;}
	.desinger-item:hover .text .appoint-button{ border: 2px solid #0071b1;}

}



/* ========== */
/* = VISION = */
/* ========== */
.desinge-view{ padding: 50px 0;}
.desinge-view .content{ margin-top: 50px; position: relative;}
.desinge-view .slick-next{ width: 50px; height: 50px; margin-top: -25px; right:-70px; }
.desinge-view .slick-prev{ width: 50px; height: 50px; margin-top: -25px; left:-70px; }
.desinge-view .slick-slide{ padding:1px 16px;}
.desinge-view .box{ border:1px solid #c1c1c1; cursor: pointer;}
.desinge-view .box .img{ width: 100%; overflow: hidden; position: relative;}
.desinge-view .box .img img{ width: 100%;}
.desinge-view .box .img span{ display: block; position: absolute; top:50%; left:50%; margin-top: -30px; margin-left: -30px; width: 60px; height: 60px; background-size:cover;}
.desinge-view .box .text{ padding: 30px 80px 30px 20px; line-height: 30px; color: #333333; font-size: 20px; position: relative;}
.desinge-view .box .text i{ position: absolute; top:30px; right:20px; padding-left: 18px; font-style:normal; font-size: 12px;} 
.desinge-view .box:hover{ background: #0077b4;}
.desinge-view .box:hover .img img{ transform: scale(1.1); -webkit-transform: scale(1.1);}
.desinge-view .box:hover .text{ color: #FFFFFF;}


.cup-box{ background: #333333; position: relative;}
.cup-box .item{ display: block; width: 100%; height: 575px; background: #333333; color: #FFFFFF; position: relative;}
.cup-box .item .img{ position: absolute; z-index:0; top:0; right:50%; height: 100%; width: 950px;}
.cup-box .item .left{ float: left; width: 50%; padding-top: 442px; position: relative;z-index: 1;}
.cup-box .item .left p{ width: 100%; height: 84px; line-height: 84px; padding: 0 25px; font-size: 22px; color: #333333; background: #FFFFFF;}
.cup-box .item .left span{ font-size: 16px; margin-right: 50px; position: relative;}
.cup-box .item .left span:after{ content: ""; position: absolute; top:50%; right:-20px; width: 6px; height:6px;  margin-top:-3px; background: #0077b4; border-radius:50%;}
.cup-box .item .right{ float: right; width: 50%;}
.cup-box .item .right .theme{ text-align: right; padding: 50px 0 30px 0; position: relative;}
.cup-box .item .right .theme:after{ content: ""; position: absolute; bottom: 0; right:0; width: 56px; height: 6px; background: #0077b4;}
.cup-box .item .right .theme span{ display: block; font-size:28px; line-height:32px; font-weight: bold; color:#505050; text-transform: uppercase;}
.cup-box .item .right .theme p{ margin-top: 10px; font-size: 36px;}
.cup-box .item .right .con{ margin-top: 50px; background: #0a699a; padding: 60px 55px;}
.cup-box .item .right .con span{ display:block; height: 50px; line-height: 50px; font-size: 24px;}
.cup-box .item .right .con p{ margin-top: 15px; line-height: 30px; height: 90px; color: rgba(255,255,255,.9); overflow: hidden;}
.cup-box .button{ position: absolute; top:295px; right:0; width: 100%; height: 55px; text-align: right;}
.cup-box .swiper-button-next{ position: relative; top:auto; margin: 0; right:auto; display: inline-block; width: 110px; height: 55px;}


.mb-cup-box{ padding: 50px 0; background: #333333; }
.mb-cup-box .theme-tit{ color: #FFFFFF;}
.mb-cup-box .slick{ padding: 50px 0; }
.mb-cup-box .slick-dots li button{ background: #FFFFFF;}
.mb-cup-box .slick-dots li.slick-active button{ background: #0077b4;}
.mb-cup-box .slick-slide{ background:#FFFFFF;}
.mb-cup-box .slick-slide .text{ padding:0.6rem 0.53333333rem;}
.mb-cup-box .slick-slide .text h2{ font-size: 0.5rem; font-weight: bold; color: #333333;}
.mb-cup-box .slick-slide .text span{  margin-top: 0.3rem; display: block; font-size: 0.4rem; color: #333; font-weight: bold;}
.mb-cup-box .slick-slide .text p{ margin-top: 0.4rem; font-size: 0.36rem; line-height: 0.6rem; height: 1.8rem; overflow: hidden;}

.exhibition{ padding: 50px 0 80px;}
.exhibition .more{ margin: 0 auto;}


@media (max-width:1480px) {
	.desinge-view .slick{ padding-bottom: 1rem;}
	.desinge-view .slick-next{ right:-60px;}
	.desinge-view .slick-prev{ left:-60px;}
}

@media (max-width:999px) {
	.desinge-view .swiper-container{ padding-bottom: 40px;}
	.desinge-view .swiper-pagination{ display: block;}
	.desinge-view .swiper-button-next,
	.desinge-view .swiper-button-prev{ display: none;}
	.desinge-view .box .text{ font-size: 14px; padding:15px 80px 15px 15px;}
	.desinge-view .box .text i{ top:15px;}
	
}




/* ========== */
/* = SITE = */
/* ========== */
.site{ padding: 15px 0 80px;}
.site ul{ margin-bottom: 50px;}
.site-item{ margin-top: 35px; position:relative; display: block; padding: 25px 60px 25px 22px; border: 1px solid #c1c1c1;}
.site-item .img{ float: left; width: 27.5%; position:relative; overflow:hidden;}
.site-item .img img{ width: 100%;}
.site-item .text{ float: right; width: 68%; padding-top: 10px; position: relative;}
.site-item .title{ padding-right: 160px; font-size: 26px; line-height: 32px; color: #333333;}
.site-item .des{ margin-top: 12px; padding-bottom: 15px; font-size: 12px; line-height:24px; border-bottom: 1px solid #f0f0f0; }
.site-item .des em{ font-style: normal; margin: 0 25px;}
.site-item .des .view{ padding-left: 22px;}
.site-item .more{ position: absolute; display: block; top:10px; right:0; width: 147px; height: 40px; line-height: 40px; text-align: center; background: #0077b4; color: #FFFFFF; font-size: 12px; }
.site-item .process{ margin: 35px -35px 0;}
.site-item .process div{ float: left; width: 20%; display: block; text-align: center; position: relative; padding: 0 35px;} 
.site-item .process div:after{ content: ""; position: absolute; top:15px; right:-15px; width: 30px; height: 20px; background-size: cover;}
.site-item .process div:last-child{ margin-right: 0;}
.site-item .process div:last-child:after{ display:none;}
.site-item .process div span{ display:inline-block; width: 40px; height: 40px; background-size: cover;}
.site-item .process div p{ margin-top:10px; font-size: 12px; color: #999999;}
.site-item .process div.active p{ color: #0077b4;}
.site-item:hover{ background: #333333;}
.site-item:hover .img img{ transform: scale(1.1); -webkit-transform: scale(1.1);}
.site-item:hover .title{ color:#FFFFFF;}
.site-item:hover .des{ color:#FFFFFF; border-bottom: 1px solid rgba(255,255,255,.2);}
.site-item:hover .process div.active p{ color:#FFFFFF;}


/* ========== */
/* = SITE—DETAIL = */
/* ========== */
.site-detail{ padding:50px 0;}
.site-detail-top{ max-width: 940px; padding-right: 220px; position: relative; border-bottom: 1px solid #f0f0f0; padding-bottom: 32px; }
.site-detail-top .title{ padding-top: 35px; position: relative; font-size: 38px; line-height:44px; color: #222222;}
.site-detail-top .title:before{ content: ""; position: absolute; top:0; left:0; width: 55px; height: 6px; background: #0077b4;}
.site-detail-top .des{ margin-top: 25px; line-height:28px; color: #333333; }
.site-detail-top .des .view{ margin-left: 50px; padding-left: 22px;}
.site-detail-top .des em{ font-style: normal; margin: 0 25px; }
.site-detail-top .more{ position: absolute; top:78px; right:0; display: block; width: 188px; height: 50px; line-height: 50px; text-align: center; background: #0077b4; color: #FFFFFF;}


.site-detail-info .tit{ margin-top: 50px; position: relative; line-height: 30px; padding-left:45px; }
.site-detail-info .tit i{ position: absolute; top:0; left:0; display: inline-block; line-height:30px; padding: 0 5px; font-style:normal; font-weight: bold; background: #0077b4; color:#FFFFFF;}
.site-detail-info .tit span{ font-size: 24px; color: #222222;}
.site-detail-info .img{ margin-top: 40px;}
.site-detail-info .img div{ float: left; width: 32%; margin-right:2%; margin-bottom:20px;}
.site-detail-info .img div:nth-child(3n){ margin-right: 0;}
.site-detail-info .img div:nth-child(3n+1){ clear: both;}
.site-detail-info .des{ padding-left: 45px; margin-top: 10px; color: #333333;}
.site-detail .ny-right{ padding-top: 124px;}


/* ========== */
/* = site-form = */
/* ========== */
.site-form{ padding: 50px 0 80px; background: #333333; color: #FFFFFF;}
.site-form .tit{ padding-bottom: 15px; font-size: 38px; color: #FFFFFF; letter-spacing:4px;}
.site-form .content{ max-width: 1040px;}
.site-form .in{ margin-top: 15px; float: left; width: 49%; margin-right:2%; display: block;  height: 60px;  position: relative; background: #f2f2f2; letter-spacing: 1px;}
.site-form .in:nth-child(2n){ margin-right: 0;}
.site-form .in i{ position: absolute; top:20px; font-style: normal; left:15px; color: #ff0000;}
.site-form .in input{ width: 100%; height: 60px; border: none; background: none; padding:18px 30px; line-height: 24px; border-radius: 0;}
.site-form .dropdown .selected,
.site-form .dropdown li{ padding:0 30px ;}
.site-form .dropdown .selected{ height: 60px; line-height: 60px;}
.site-form .bt { margin-top: 27px;}
.site-form .bt input{ display:inline-block; vertical-align:bottom; width: 240px; height: 62px; line-height: 62px; background: #0077b4; color: #FFFFFF; font-size: 18px; font-weight: bold; border-radius: 0;}
.site-form .bt span{ margin-left: 28px; letter-spacing: 2px; display: inline-block; vertical-align:bottom; color: #cccccc; line-height: 26px;}
.site-form .bt span i{ color: #0077b4; font-style: normal;}



/* ========== */
/* = HOTCASE = */
/* ========== */
.hotcase{ padding: 20px 0 80px;}
.hotcase-list{ margin-bottom: 50px;}
.hotcase-list li{ float: left; width: 32%; margin-right:2%;}
.hotcase-list li:nth-child(3n){ margin-right: 0;}
.hotcase-list li:nth-child(3n+1){ clear: both;}
.hotcase-item{ margin-top:32px; display: block; border: 1px solid #c1c1c1; font-size:12px; }
.hotcase-item .img{ width: 100%; overflow:hidden;}
.hotcase-item .img img{ width: 100%;}
.hotcase-item .text{ padding: 30px 30px 0;}
.hotcase-item .tit{ position: relative; line-height: 36px; padding-right: 80px; }
.hotcase-item .tit span{ display: block;font-size: 22px; color: #333333;}
.hotcase-item .tit i{ position: absolute; right:0; top:0; line-height: 36px; padding-left: 30px; font-style: normal;}
.hotcase-item .des{ margin-top: 5px; line-height: 26px; height: 52px; overflow: hidden;}
.hotcase-item .tip{ margin-top: 25px; border-top: 1px solid #c1c1c1; padding: 28px 0;  letter-spacing: 1px;}
.hotcase-item .tip span:first-child{ margin-right:30px;}
.hotcase-item .tip i{ font-style: normal; font-size: 18px; color: #0077b4;}
.hotcase-item:hover{ background: #0077b4; color: #FFFFFF;}
.hotcase-item:hover .img img{ transform: scale(1.1); -webkit-transform: scale(1.1);}
.hotcase-item:hover .tit span{ color:#FFFFFF;}
.hotcase-item:hover .tip{ border-top: 1px solid rgba(255,255,255,.2);}
.hotcase-item:hover .tip i{ color: #FFFFFF;}


/* ========== */
/* = HOTCASE-DETAIL = */
/* ========== */
.hotcase-detail{  display: flex; flex-flow: wrap; align-items: center; justify-content: space-between;  position:relative; background: #333333; color:#e0e0e0;}
.hotcase-detail .img{ width:52%;}
.hotcase-detail .img img{ width: 100%;}
.hotcase-detail .right{ width: 48%; padding: 30px 6% 30px 6%;}
.hotcase-detail .text{ max-width: 458px;}
.hotcase-detail .title{ font-size: 36px;}
.hotcase-detail .des{ color: #6e6e6e; padding: 20px 0;}
.hotcase-detail .des em{ margin: 0 25px;}
.hotcase-detail .con{ line-height: 30px; min-height:180px; padding: 30px 0;  border-top: 1px solid rgba(255,255,255,.2); border-bottom: 1px solid rgba(255,255,255,.2); overflow: hidden;}
.hotcase-detail .tip{ margin-top: 30px;}
.hotcase-detail .tip span{ margin-right: 30px;}
.hotcase-detail .tip i{ font-style: normal; color: #0077b4; font-size: 22px;}
.hotcase-detail .ny-button{ margin-top: 50px;}


.layout-list{ padding:50px 0 80px;}
.layout-list li{ margin-top: 40px; float: left; width: 32%; margin-right:2%;}
.layout-list li:nth-child(3n){ margin-right: 0;}
.layout-list li:nth-child(3n+1){ clear: both;}
.layout-list li a{ display: block;}
.layout-list li .img{ width: 100%; overflow: hidden;}
.layout-list li .img img{ width: 100%;}
.layout-list li .text{ padding:20px 50px; border: 1px solid #c1c1c1; border-top:none; position: relative; font-size: 18px; text-align: center;}
.layout-list li .text span{ display: block;}
.layout-list li .text i{ position:absolute; right:20px; top:50%; margin-top: -10px; width: 20px; height: 20px;  background-size: cover;}
.layout-list li a:hover .img img{ transform: scale(1.1); -webkit-transform: scale(1.1);}
.layout-list li a:hover .text{ background: #0077b4; border-color: #0077b4; color:#FFFFFF;}



/* ========== */
/* = HOTCASE_LAYOUT = */
/* ========== */
.layout-img{ padding: 0 60px;}
.layout-img .swiper-pagination{ display: none;}

.layout-info{ padding: 50px 0; background: #2e2e2e; color: #eeeeee;}
.layout-info .tit{ max-width: 1070px; padding-right: 250px; position: relative;}
.layout-info .tit .button{ position: absolute; top:0; right:0; background: #0077b4; color: #FFFFFF; padding: 20px 25px; display:inline-block;}
.layout-info .title{ margin-right:20px; display: inline-block; font-size: 36px; color: #FFFFFF;}
.layout-info .tip{ display: inline-block; color: #888888;}
.layout-info .tip em{ margin: 0 25px;}
.layout-info .des{ margin-top: 30px;  line-height: 24px;}
.layout-info .text div{ margin-top: 30px; float:left; width:25%; padding-right: 15px; line-height: 24px; padding-left: 25px;  position: relative;}
.layout-info .text div:nth-child(4n+1){ clear: both;}
.layout-info .text div span{ display: block; margin-bottom: 10px;}
.layout-info .text div i{ position: absolute; display: block; width: 14px; height: 14px; border-radius: 100%; top:5px; left:0; padding:3px; border: 1px solid #0077b4;}
.layout-info .text div em{ display: block; width: 6px; height: 6px; border-radius: 100%; background:#0077b4;}



/* ========== */
/* = QUESTION = */
/* ========== */
.question{ padding: 50px 0 80px;}
.question ul{ margin-bottom: 50px;}
.question li{ margin-top: 50px;}
.question-item{ display: block; padding:50px 40px; border: 1px solid #c1c1c1;}
.question-item .ico{ float: left; width: 220px;}
.question-item .ico span{ display: block; width: 100px; height: 100px; background-size: cover;}
.question-item .text{ margin-left: 220px; border-left: 1px solid #c1c1c1; padding-left: 12%;}
.question-item .text .tit{ font-size: 24px; color: #333333;}
.question-item .text .con{ margin-top: 10px; color: #999999; line-height: 30px; height: 60px; text-align: justify; overflow: hidden;}
.question-item .text .ny-button{ margin-top:30px; }
.question-item:hover{ background: #333333;}
.question-item:hover .text{ border-color: #717171;}
.question-item:hover .tit{ color: #FFFFFF;}
.question-item:hover .con{ color:#FFFFFF;}


/* ========== */
/* = PROCESS = */
/* ========== */
.process-content{ padding: 50px 0 80px;}
.process-content ul{ margin-top: 50px; position: relative; }
.process-content ul:before{ content: ""; z-index: 0; position: absolute; height: 100%; top:10px; left:50%; width: 2px; height:98%; background: #0077b4;}
.process-content li{ position: relative; z-index: 1; }
.process-content li .ico{ position: absolute; top:0; left:50%; margin-left: -37px;}
.process-content li .img{ float: left; width:44%; text-align: right; padding-top: 40px;}
.process-content li .img img{ margin: 0; display: inline-block;}
.process-content li .text{ float: right; width: 46%; padding: 10px 2% 25px 2%; overflow:hidden; }
.process-content li .tit{ font-size:30px; line-height: 54px;} 
.process-content li .des p{ clear: both; display: inline-block; margin-top: 20px; border: 1px dotted #0077b4; line-height:30px; font-size: 18px; padding: 0 10px 0 45px; border-radius:2px; position: relative; max-width: 500px;}
.process-content li .des span{ position: absolute; top:0; left:12px; color: #0077b4; font-weight: bold; display: block;}
.process-content li .box{ margin-top: 50px; position: relative; padding-left:50px; font-size: 18px; line-height: 28px; color: #0077b4;}
.process-content li .box:before{ content:""; position: absolute; top:50%; margin-top: -60px; left:-30px; width:70px; height: 120px; background: #FFFFFF; z-index: 1;}
.process-content li .box span{ position: absolute; z-index: 3; display:block; top:50%; width: 66px; height: 66px; margin-top: -33px; left:13px; background: #0077b4; line-height: 66px; color: #FFFFFF; border-radius: 100%; text-align: center;}
.process-content li .box i{ position: absolute; display: block; z-index: 2; top:50%; margin-top: -46px; left:0; width: 92px; height: 92px; background: #e9e9e9; border-radius: 100%; -webkit-animation: cricle 1.5s linear infinite 0s; animation: cricle 1.5s linear infinite 0s;}
.process-content li .box p{ position: relative; z-index:0; padding: 12px 20px 12px 55px; -o-box-shadow:0 0 10px rgba(0,0,0,.15); -ms-box-shadow:0 0 10px rgba(0,0,0,.15); -moz-box-shadow:0 0 10px rgba(0,0,0,.15);  -webkit-box-shadow:0 0 10px rgba(0,0,0,.15); box-shadow:0 0 10px rgba(0,0,0,.15); }
.process-content li:nth-child(2n){ text-align: right;}
.process-content li:nth-child(2n) .img{ float: right; text-align:left;}
.process-content li:nth-child(2n) .text{ float: left; padding: 10px 2% 25px 2%; }
.process-content li:nth-child(2n) .box{ padding-left: 0; padding-right: 50px;}
.process-content li:nth-child(2n) .box:before{ right:-30px; left:auto;}
.process-content li:nth-child(2n) .box i{ left:auto; right:0;}
.process-content li:nth-child(2n) .box span{ left:auto; right:13px;}
.process-content li:nth-child(2n) .box p{ padding: 12px 55px 12px 10px;}

@-webkit-keyframes cricle {
	0% {
		-webkit-transform: scale(1);
		transform: scale(1);
	}
	50% {
		-webkit-transform: scale(1.1);
		transform: scale(1.1);
	}
	100% {
		-webkit-transform: scale(1);
		transform: scale(1);
	}
}
@keyframes cricle {
	0% {
		transform: scale(1);
	}
	50% {
		transform: scale(1.1);
	}
	100% {
		transform: scale(1);
	}
}

@media (max-width:999px) {
	
	/* ========== */
	/* = SITE = */
	/* ========== */
	.site-item{ padding: 20px;}
	.site-item .img{ width: 100%;}
	.site-item .text{ margin-top: 0.4rem; width: 100%;}
	.site-item .title{  padding-right: 0; font-size: 0.46rem; line-height: 0.6rem; font-weight: bold;}	
	.site-item .des span{ float: left; display: block; width: 50%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
	.site-item .des em{ display: none;}
	.site-item .more{ display: none;}
	.site-item .process{ margin:0.5rem 0 0;}
	.site-item .process div{ padding: 0;}
	.site-item .process div:after{ right:-0.2rem; width: 0.4rem; height: 0.26666666rem;}
	.site-item .process div span{  width: 0.8rem; height: 0.8rem;}
	.site-item .process div p{ font-size: 0.26666666rem;}
	
	.site-item:hover{ background: #FFFFFF;}
	.site-item:hover .img img{ transform: none; -webkit-transform: none;}
	.site-item:hover .title{ color:#333;}
	.site-item:hover .des{ color:#666; border-bottom: 1px solid #f0f0f0;}
	.site-item:hover .process div.active p{ color:#0077b4;}
	
	
	/* ========== */
	/* = SITE—DETAIL = */
	/* ========== */
	.site-detail-top{ padding-right: 0; }
	.site-detail-top .title{ font-size: 0.6rem; font-weight:bold; line-height: 0.8rem;}
	.site-detail-top .des span{ float: left; width: 50%; font-size: 12px;}
	.site-detail-top .des span:nth-child(5){ clear: both; }
	.site-detail-top .des em{ display: none;}
	.site-detail-top .des .view{ margin-left: 0;}
	.site-detail-top .more{ margin-top: 0.4rem; width: 147px; position: relative; top:auto;}
	.site-detail-info .tit span{ font-size:0.5rem; font-weight: bold;}
	.site-detail .ny-right{ padding-top:40px;}
	
	/* ========== */
	/* = site-form = */
	/* ========== */
	.site-form .tit{ font-size: 0.6rem; font-weight: bold; letter-spacing: 0.02666666rem;}
	.site-form .in{ width: 100%; margin-right: 0;}
	.site-form .bt input{ width:55%; font-size: 0.44rem;}
	.site-form .bt span{ margin-left: 10px; text-align: center; font-size: 12px; letter-spacing: 0; }	
	
	
	/* ========== */
	/* = HOTCASE = */
	/* ========== */
	.hotcase-list li,
	.hotcase-list li:nth-child(3n){ width: 49%; margin-right:2%;}
	.hotcase-list li:nth-child(2n){ margin-right: 0;}
	.hotcase-list li:nth-child(3n+1){ clear: initial;}
	.hotcase-list li:nth-child(2n+1){ clear:both;}
	.hotcase-item .tit span{ font-size: 0.46rem; font-weight: bold;}
	.hotcase-item:hover{ background: #fff; color: #666;}
	.hotcase-item:hover .img img{ transform:none; -webkit-transform: none;}
	.hotcase-item:hover .tit span{ color:#666;}
	.hotcase-item:hover .tip{ border-top: 1px solid #c1c1c1;}
	.hotcase-item:hover .tip i{ color: #0077b4;}
	
		
	/* ========== */
	/* = HOTCASE-DETAIL = */
	/* ========== */
	.hotcase-detail{ font-size: 0.32rem;}
	.hotcase-detail .img{ width:100%;}
	.hotcase-detail .right{width:100%; padding:1.2rem 0.4rem;}
	.hotcase-detail .text{ max-width: 100%;}
	.hotcase-detail .title{ font-size:0.46rem;}
	.hotcase-detail .tip span{ margin-right:0.4rem;}
	.hotcase-detail .tip i{ font-size: 0.6rem;} 
	

	.layout-list li,
	.layout-list li:nth-child(3n){ width: 48%; margin-right:4%;}
	.layout-list li:nth-child(2n){ margin-right: 0;}
	.layout-list li:nth-child(3n+1){ clear: initial;}
	.layout-list li:nth-child(2n+1){ clear:both;}
	.layout-list li .text{ padding:10px 30px; font-size:0.36rem;}
	.layout-list li .text i{ right: 10px;}
	.layout-list li a:hover .img img{ transform: none; -webkit-transform:none;}
	.layout-list li a:hover .text{ background: #FFFFFF; border-color: #c1c1c1; color:#666;}
	
		
	/* ========== */
	/* = LAYOUT-DETAIL = */
	/* ========== */
	.layout-img-w1200{ padding: 0;}
	.layout-img{ padding: 0;}
	.layout-img .swiper-button-next,
	.layout-img .swiper-button-prev{ display: none;}
	.layout-img .swiper-pagination{ bottom:0.4rem; display: block;}
		
	
	.layout-info{ font-size: 0.32rem;}
	.layout-info .tit{ padding-right:0;}
	.layout-info .tit .button{ position: relative; top:auto; right:auto;}
	.layout-info .title{ font-size:0.5rem; margin-right: 0;}
	.layout-info .tip{ margin:20px 0; display: block;}
	.layout-info .tip em{ margin: 0 0.3rem;}
	.layout-info .des{ line-height: 0.5rem;}
	.layout-info .text div{ width: 100%; padding-right: 0;}
	
	
	/* ========== */
	/* = QUESTION = */
	/* ========== */
	.question-item{ padding: 20px;}
	.question-item .ico{ width:1.4rem;}
	.question-item .ico span{ width:1rem; height:1rem;}
	.question-item .text{ margin-left: 1.4rem; padding-left: 0.6rem;}
	.question-item .text .tit{ font-size: 0.44rem; font-weight: bold;}
	.question-item .text .con{ font-size: 12px; line-height: 20px; height: 40px;}
	.question-item .text .ny-button{  display: none;}
	.question-item:hover{ background: #FFFFFF;}
	.question-item:hover .text{ border-color: #c1c1c1;}
	.question-item:hover .tit{ color: #333;}
	.question-item:hover .con{ color:#999999;}

	
	/* ========== */
	/* = PROCESS = */
	/* ========== */
	.process-content li .text{ width: 50%; margin-right: -4%; }
	.process-content li:nth-child(2n) .text{ margin-right: 0; margin-left: -4%; }
	.process-content ul:before{  width: 1px;}
	.process-content li .ico{ width: 1rem; margin-left:-0.5rem; }
	.process-content li .tit{ padding-left: 0.3rem; font-size: 0.29333333rem; font-weight: bold; line-height: 0.53333333rem;}
	.process-content li .des{ margin-top: 0.26666666rem;}
	.process-content li .des p{ margin-top: 0; padding: 0 0 0 0.7rem; font-size: 0.24rem; line-height: 0.42rem; border: none;}
	.process-content li .box{ margin-top: 0.4rem; padding-left: 0.8rem;}
	.process-content li .box:before{ left:-0.2rem; height:1.6rem; margin-top: -0.8rem; width:0.8rem;}
	.process-content li .box p{ font-size: 0.2rem; line-height: 0.29333333rem; padding: 0.13333333rem 0.1rem 0.13333333rem 0.5rem;}
	.process-content li .box i{ left:0;  width: 1.2rem; height: 1.2rem; margin-top:-0.6rem; }
	.process-content li .box span{ left:0.13333333rem; width: 0.93333333rem; height: 0.93333333rem; margin-top:-0.46666666rem; font-size: 0.24rem; line-height: 0.93333333rem;}
	
	.process-content li:nth-child(2n) .box{ padding-left:0; padding-right: 0.8rem;}
	.process-content li:nth-child(2n) .box:before{ right:-0.2rem;}
	.process-content li:nth-child(2n) .box span{ left:auto; right:0.13333333rem; }
	.process-content li:nth-child(2n) .box p{ padding: 0.13333333rem 0.5rem 0.13333333rem 0.1rem;}
}



@media (max-width:640px) {
	/* ========== */
	/* = HOTCASE = */
	/* ========== */
	.hotcase-list li,
	.hotcase-list li:nth-child(3n){ width:100%; margin-right:0;}
	
}



/* ========== */
/* = PRAISE = */
/* ========== */
.praise{ padding-bottom: 80px;}
.praise-hot{ padding: 35px 0; background: #3e3e3e; color: #FFFFFF; line-height: 36px; }
.praise-hot .content{ padding-left:115px; padding-right:280px; min-height: 48px; position: relative;}
.praise-hot .content span{ position: absolute; top:8px; left:0; font-size: 20px; font-weight: bold; letter-spacing: 2px;}
.praise-hot .content div a{ float: left; margin-top:8px; min-width: 15.5%; line-height: 36px; margin-right:1%; display: inline-block; vertical-align: top; background: #0077b4; color: #FFFFFF; padding: 0 10px; text-align: center; position: relative;}
.praise-hot .content div .hot:after{ content: ""; position: absolute; top:0; right:0; width: 40px; height: 30px; background-size: cover;} 
.praise-hot .content .button{ position: absolute; display:block; top:0; right:0; width:275px; height: 46px; line-height: 46px; background: #FFFFFF; text-align: center;}
.praise-hot .content .button i{ display: inline-block; padding-left: 50px; font-size: 14px; color: #333333; font-style:normal; font-weight: bold;}

.praise-list{ margin-bottom: 50px;}
.praise-list li{ padding: 50px 0;}
.praise-list li:nth-child(2n){ background: #eeeeee;}
.praise-item .box{ position: relative;}
.praise-item .img{ float: left; border-radius:50%; width: 72px; height: 72px; overflow: hidden;}
.praise-item .con{ float: left; margin-left: 18px; }
.praise-item .tit{ padding-top:8px;}
.praise-item .tit h4{ margin-right: 30px; letter-spacing:1px; display:inline-block; vertical-align: middle; font-size:20px; color:#333333; font-weight:bold;}
.praise-item .tit .star{ display:inline-block; vertical-align: middle;}
.praise-item .tit .star i{display:inline-block; vertical-align: middle; width:15px; height:15px; margin-right:6px;}
.praise-item .tit .star span{display:inline-block; vertical-align: middle; margin-left: 5px; color: #0077b4;}
.praise-item .tip{  margin-top: 10px; display: inline-block; position: relative; line-height:26px; color: #333333;}
.praise-item .bt{ margin:30px 0 0 50px; float: left; display: inline-block; color: #0077b4;  border: 1px solid #0077b4; padding:0 15px 0 35px; line-height: 30px;}
.praise-item .mb-bt{position: absolute; top:0.26666666rem; right:0; width: 2.6rem; height: 0.74666666rem; line-height: 0.74666666rem; font-size: 0.24rem; color: #FFFFFF; background: #0077b4; text-align: center;}
.praise-item .text{ margin-top: 40px; line-height:30px; color: #333333;}
.praise-item .text a{ color: #333333;}
.praise-item .dimg span{  margin-top: 35px; float: left; max-width: 20%; padding-right:20px; display: block;}

@media (max-width:999px) {
	/* ========== */
	/* = PRAISE = */
	/* ========== */
	.praise-hot .content{ padding:0;}
	.praise-hot .content span{ position: relative; top:auto; margin-bottom: 20px;}
	.praise-hot .content div a{ min-width:32.3%;}
	.praise-hot .content div .hot:after{ width: 27px; height: 20px;}
	.praise-hot .content .button{ margin-top: 20px; position: relative; top:auto; right:auto; width: 100%; }
	
	.praise-item .box{ padding-right:0;}
	.praise-item .con{ margin-left: 10px; }
	.praise-item .tit .star{ display: block;}
	.praise-item .tit h4{ font-size: 0.4rem; letter-spacing: 0; }
	.praise-item .tip{ padding-right: 0; font-size: 0.34rem; line-height: 0.5rem; letter-spacing: 0;}
	.praise-item .bt{ display: none; float: right; margin:20px 0 0; }
	.praise-item .text{ margin-top: 20px; padding-left:0;}
	.praise-item .dimg span{ margin-top: 20px; max-width: 31.333%; margin-right:3%; padding-right: 0; }
	.praise-item .dimg span:nth-child(3n){ margin-right: 0;}
}



/* ========== */
/* = CONTACT = */
/* ========== */
.contact{ padding: 50px 0 80px;}
.contact ul{ margin-top: 10px;}
.contact li{ margin-top: 40px; float: left; width: 31.5%; margin-right:2.75%;}
.contact li:nth-child(3n){ margin-right: 0;}
.contact li .img{ width: 100%; overflow: hidden;  display: block; }
.contact li img{ width: 100%; -webkit-transition: all ease .6s;
	   -moz-transition: all ease .6s;
	    -ms-transition: all ease .6s;
	     -o-transition: all ease .6s;
	        transition: all ease .6s;}
.contact li .text{ border: 1px solid #eeeeee; padding: 30px 20px;}
.contact li .text .tit{ font-size: 20px; color:#333333;}
.contact li .des{ position: relative; padding-right: 100px;}
.contact li .des a{ display: block; position: absolute; top:5px; right:0; width: 86px; height: 24px; line-height: 24px; border-radius: 3px; background: #0077b4; color: #FFFFFF; text-align: center;}
.contact li .des p{ margin-top:15px; padding-left: 28px; line-height: 20px;}
.contact li:hover .img img{ transform: scale(1.1); -webkit-transform: scale(1.1);}


.join{ padding: 50px 0 80px; }
.join-list li{ margin-top: 15px;background: #FFFFFF; border: 1px solid #a3a3a3; }
.join-list li:first-child{ margin-top: 40px; border: none; }
.join-list li .tit{ cursor: pointer; font-size: 0; padding-right:2%;}
.join-list li .tit span{ padding: 15px 2px; width: 15%; text-align: center; font-size: 14px; line-height: 24px; display:inline-block; vertical-align: middle;}
.join-list li .tit .span-1{ width: 40%; text-align: left; padding:0 40px;}
.join-list li .tit .span-6{ padding: 0;}
.join-list li .tit .span-6 i{ display:inline-block; width: 44px; height:44px; background-size: cover;}
.join-list li .top-tit{ cursor:auto; border: none; background:#0077b4; }
.join-list li .top-tit span{  padding: 20px 2px; font-size: 16px; color: #FFFFFF; letter-spacing: 1px;}
.join-list li .con{ display: none; border-top: 1px solid #a3a3a3; padding: 0 40px 40px;}
.join-list li .text{ margin-top: 30px; float: left; width: 50%; line-height: 30px; padding-right:20px;}
.join-list li .text h2{ margin-bottom: 10px; font-size: 18px; color: #333333;}
.join-list li .tip{ margin-top: 25px; color: #333333; line-height: 32px; font-size: 16px;}
.join-list li .tip  span{ margin-right: 50px;}
.join-list li .tip i{ font-weight: bold; color: #0077b4; font-style: normal;}
.join-list li.active .tit span{ font-size: 16px; color: #333; }
.join-list li.active .top-tit{ border: none;}
.join-list li.active .top-tit span{ color: #FFFFFF; }


@media (max-width:999px) {
	
	/* ========== */
	/* = CONTACT = */
	/* ========== */
	.contact li{ width: 100%;}
	
	.join-list li{ padding-right: 0;}
	.join-list li .tit{ padding-right: 0;}	
	.join-list li .tit span{ width:30%; padding:12px 2px; font-size: 12px; line-height:20px;}
	.join-list li .tit .span-1{ width:40%; padding:12px 5px; text-align: center;}
	.join-list li .tit .span-6 i{ width:30px; height:30px;}
	.join-list li .tit .span-2,
	.join-list li .tit .span-3{ display: none;}
	.join-list li .text{ float: none; width: 100%; padding-right: 0; font-size: 12px; line-height: 24px;}
	.join-list li .tip{ font-size: 14px;}
	.join-list li .tip  span{ display: block; margin-right:0;}
	.join-list li .text h2{ font-size: 14px;}
	.join-list li.active .tit span{ font-size: 12px;}
	
}




/* ========== */
/* = NEWS = */
/* ========== */
.news{ padding: 50px 0 80px;}
.news-list{ margin:50px 0;}
.news-item{ display: block; width: 100%; padding:50px 40px; display: flex; flex-flow: wrap; align-items: center; justify-content: space-between;  position:relative;}
.news-item .img{  width: 50%; overflow: hidden; margin-left: -40px;}
.news-item .img img{ width: 100%;}
.news-item .text{ width: 50%; padding-left:6%;}
.news-item .date{ font-size: 24px; color: #0077b4;}
.news-item .tit{ margin-top: 15px; font-size: 22px; color: #333333;}
.news-item .con{ margin-top: 30px; color: #999999; line-height: 30px; height: 60px; overflow: hidden; }
.news-item .ny-button{  margin-top:35px;}
.news-item:hover{ background: #333333;}
.news-item:hover .date{ color: #FFFFFF;}
.news-item:hover .tit{ color: #FFFFFF;}
.news-item:hover .con{ color: #FFFFFF;}
.news-item:hover .img{ margin-left:0;}
.news-item:hover .img img{ transform: scale(1.1); -webkit-transform: scale(1.1);}

/* ========== */
/* = NEWS-DETAIL = */
/* ========== */
.news-detail{ padding: 50px 0 80px;}
.news-detail ..ny-left{ padding-right: 20px; }
.news-detail .title{ font-size: 28px; line-height:44px; color: #333333; letter-spacing: 2px; text-align: center;}
.article-come{ padding-bottom: 20px; line-height:26px; margin-top:15px; text-align: center;}
.article-come span{ margin: 0 20px; display: inline-block; vertical-align: middle; position: relative;}
.article-come em{ font-style: normal; display: inline-block; vertical-align: middle; margin:0 25px;}
.news-artcile{ padding:65px 0; line-height: 30px; letter-spacing:1px; border-top: 1px solid #f5f5f5; text-align: justify;font-size: 16px;}

@media (max-width:999px) {
	/* ========== */
	/* = NEWS = */
	/* ========== */
	.news-item{ margin-bottom: 40px; padding:0; border: 1px solid #b2b2b2;}
	.news-item .img{  width:100%; overflow: hidden; margin-left: 0;}
	.news-item .text{ width:100%; padding:0.4rem;}
	.news-item .date{ font-size:0.42rem; font-weight: bold;}
	.news-item .tit{ font-size:0.44rem; font-weight: bold;}
	.news-item .con{ margin-top: 0.4rem; font-size: 0.36rem; line-height:0.6rem; height: 1.2rem;}
	.news-item .ny-button{  margin-top:0.4rem;}
	.news-item:hover{ background: #FFFFFF;}
	.news-item:hover .date{ color: #0077b4;}
	.news-item:hover .tit{ color: #333;}
	.news-item:hover .con{ color: #999999;}
	.news-item:hover .img img{ transform:none; -webkit-transform:none;}
	
	/* ========== */
	/* = NEWS-DETAIL = */
	/* ========== */
	.news-detail{ padding: 50px 0;}
	.news-detail ..ny-left{ padding-right: 0; }
	.news-detail .title{ font-size: 0.44rem; line-height: 0.7rem; font-weight:bold;}
	.news-artcile{ padding: 30px 0;}
}




/* ========== */
/* = SEIKO = */
/* ========== */
.seiko{ padding: 50px 0 30px;}
.seiko-theme{ padding-bottom: 20px; text-align: center; position: relative; text-align: center;}
.seiko-theme:after{ content: ""; position: absolute; margin-left: -45px; bottom: 0; left:50%; width: 90px; height: 4px; background: #666666;}
.seiko-theme p{ position: absolute; bottom:20px; left:0; width: 100%; font-size: 36px; font-weight: bold; color: #333333; line-height: 70px;}
.seiko-theme span{  display:block; line-height: 80px; font-size:80px; color: #f0f0f0; text-transform: uppercase;}
.seiko-top{ margin-top: 45px; text-align: center;}
.seiko-top .tit{ font-size: 26px; color: #333333;}
.seiko-top .tab{ margin-top: 30px; padding-top: 30px; border-top: 1px dashed #0077b4;}
.seiko-top .tab a{ margin: 0 2%; width:25%; display: inline-block; cursor: pointer; border: 1px solid #a3a3a3; font-size: 24px; padding: 14px 0; position: relative;}
.seiko-top .tab a i{ position: absolute; left:50%; margin-left:-10px; top:-40px; width: 20px; height: 20px; background: #b2d6e8; border-radius: 100%; padding:5px;}
.seiko-top .tab a i em{ display: block; width: 10px; height: 10px; border-radius: 100%; background: #0077b4;}
.seiko-top .tab a.active{ background: #0077b4; border: 1px solid #0077b4; color: #FFFFFF;}

.sekio-tit{ margin: 45px 0; text-align:center;}
.sekio-tit span{ font-size: 32px; color: #333333; position: relative;}
.sekio-tit span:before,
.sekio-tit span:after{ content: ""; position: absolute; top:50%; width: 70px; height: 1px; background: #000000;}
.sekio-tit span:before{ left:-75px;}
.sekio-tit span:after{ right:-75px;}

.sekio-box{ display: flex; flex-flow: wrap; align-items: center; justify-content: space-between; background: #fbfbfb;}
.sekio-box .text{ width: 46%; padding: 15px 4% 20px 3%; font-size: 16px; line-height: 32px; text-align: justify;}
.sekio-box .text p{ position: relative; padding-top:25px;}
.sekio-box .text p:before{ content: ""; position: absolute; top:0; left:0; width: 75px; height: 7px; background:#0077b4;}
.sekio-box .img{ width: 54%}

.sekio-content{ margin-top: 60px; border: 1px solid #0077b4;  font-size: 16px; line-height: 32px; text-align: justify; position: relative;}
.sekio-content .tit{ position: absolute; left:-10px; top:-10px; background: #0077b4; color: #FFFFFF; font-size: 24px; line-height: 32px; font-weight: bold; padding: 20px 35px; text-align: center;}
.sekio-development{ margin-left: 10px; padding:40px 15px 15px;}
.sekio-development .left{ float: left; width: 55%; padding-top: 90px;}
.sekio-development .right{ float: right; width:42%;}
.sekio-development .right b{ color:#333333;}
.sekio-development .right ul{ padding: 10px 40px 0;}
.sekio-development .right li{ padding: 3px 0 3px 20px; position: relative; border-bottom: 1px solid #b2b2b2;}
.sekio-development .right li:before{ content: ""; position: absolute; top:18px; left:0; width: 6px; height: 6px; background: #0077b4; border-radius: 100%;}
.sekio-legend{ margin-right: 10px; padding: 20px 15px 30px;}
.sekio-legend .tit{ left:auto; right:-10px;}
.sekio-legend .left{ float: left; width: 58%;}
.sekio-legend .right{ float: right; width: 42%; padding: 15% 3% 0;}
.sekio-legend .des{ padding: 30px 20px 20px; color: #333333; font-size: 20px;}
.sekio-legend .img{ float:right; width: 63%;}
.sekio-legend .text{ float: left; width: 35%; padding: 0 20px;}
.sekio-legend .text p{padding: 3px 0; position: relative; border-bottom: 1px solid #b2b2b2; }
.sekio-site{ margin-bottom: 120px; margin-left: 10px; padding: 30px;}
.sekio-site .img{ margin-bottom: -15px; float: right; width: 46%;}
.sekio-site .text{ float: left; width: 48%; padding-top:15%;}

.sekio-patent{ margin-bottom: 110px; margin-left: 10px; padding:20px 20px 0;}
.sekio-patent .left{ margin-bottom: -20px; float: left; width: 44%; padding-top:100px;}
.sekio-patent .right{ float: right; width:54%;}
.sekio-patent .right img{  margin: 30px 0 -100px;}

.sekio-standard{ margin-right: 10px; padding:40px 40px 10px;}
.sekio-standard .tit{ left:auto; right:-10px;}
.sekio-standard .img{ margin-top: 40px; float: right; width:65%; margin-right: -10%; }
.sekio-standard .text{ float: left; width: 45%; font-size: 18px; color: #333333;}
.sekio-standard .text p{ margin-bottom: 10px;}

.sekio-achievements{ padding: 40px 30px;}
.sekio-achievements .text{ float: left; text-align: justify; width:40%; padding-top: 100px;}
.sekio-achievements .text b{ color:#333333;}
.sekio-achievements li span{ margin-bottom: 20px; display: inline-block; width: 44%; font-size: 20px; color: #333333; position: relative; padding-left: 20px;}
.sekio-achievements li span:before{ content: ""; position: absolute; top:50%; left:0; margin-top: -4px; width: 8px; height: 8px; background: #0077b4; border-radius: 100%;}
.sekio-achievements .img{ float: right; width: 56%;}
.sekio-achievements .img img{ width: 100%;}


.sekio-question{ margin-top: 50px; padding: 0 15px; font-size: 18px; line-height: 30px;}
.sekio-question .ques{ position: relative; border:1px solid #0077b4; padding:10px 10px 10px 70px;}
.sekio-question .ans{ margin-top: 45px; position: relative; border:1px solid #0077b4; min-height: 46px; padding: 30px 70px;}
.sekio-question .square{ position: absolute; top:-5px; left:-5px; background: #0077b4; color:#FFFFFF; width: 46px; line-height: 46px; height:46px; text-align: center; font-size: 28px;}
.sekio-question li{ margin-top: 30px; float: left; width: 48%; margin-right:4%;  font-size: 16px;}
.sekio-question li:nth-child(2n){ margin-right: 0;}
.sekio-question li span{ display: inline-block; border-radius: 100%; width: 38px; height: 38px; line-height: 38px; text-align: center; color: #FFFFFF; background: #0077b4; font-size: 24px;}
.sekio-question li img{ margin-top: 25px; width: 100%;}
.sekio-question li div{ margin-top: 10px; line-height: 26px; color:#333333;}
.sekio-question li p{ margin-top: 15px; text-align: center;}


.sekio-flip{ margin-top: 50px;}
.sekio-flip a{ max-width: 45%; position: relative; line-height: 34px; font-size: 24px;}
.sekio-flip a:before{ content: ""; position: absolute; top:0; width: 34px; height: 34px; background-size: cover;}
.sekio-flip a:hover{ color: #0077b4;}
.sekio-flip .prev{ float: left; padding-left: 55px;}
.sekio-flip .next{ float: right; padding-right: 55px;}

.seiko-bottom-box{ padding: 50px 0 80px; border-top: 1px solid #c1c1c1;}
.seiko-bottom-box .w1200{ display: flex; flex-flow: wrap; align-items: center; justify-content: space-between;}
.seiko-bottom-box .text{ width: 50%; padding-right:2%;}
.seiko-bottom-box .text .des{ padding-top: 30px; font-size: 16px; line-height: 26px; position: relative;}
.seiko-bottom-box .text .des:before{ content: ""; position: absolute; top:0; left:0; width: 70px; height: 6px; background: #0077b4;}
.seiko-bottom-box .text span{ margin-top: 20px; display: block; color: #333333; font-size: 20px;}
.seiko-bottom-box .text a{ margin-top: 20px; display: inline-block; padding: 0 30px 0 15px; height: 48px; line-height: 48px; background: #0077b4; color: #FFFFFF; text-align: center; font-size: 16px; position: relative;}
.seiko-bottom-box .img{ width: 50%;}

@media (max-width:999px) {
	/* ========== */
	/* = SEIKO = */
	/* ========== */
	.seiko-theme p{ font-size:0.46rem;}
	.seiko-theme span{ font-size:1.3rem;}
	.seiko-top .tit{ font-size: 0.44rem;}
	.seiko-top .tab a{ float: left; width:32.3333%; margin:0 0.5%; font-size: 0.28rem;}
	
	.sekio-tit span{ font-size:0.46rem; font-weight: bold;}
	.sekio-tit span:before,
	.sekio-tit span:after{ display: none;}

	.sekio-box .text{ width: 100%; padding:0.8rem 0.53333333rem; font-size:0.34rem; line-height: 0.66666666rem;}
	.sekio-box .img{ width: 100%;}
	.sekio-box .img img{ width: 100%;}
	.sekio-content { margin-top: 45px; font-size: 0.34rem; line-height:0.7rem;}
	.sekio-content .tit{ position: relative; top:auto; left:auto; font-size: 0.4rem; padding:0.4rem 0.26666666rem;}
	.sekio-development{ margin-left: 0; padding:0.4rem;}
	.sekio-development .left{ width: 100%; padding:0.4rem 0;}
	.sekio-development .right{ width: 100%;}
	.sekio-development .right ul{ padding:0.4rem 0 0;}
	.sekio-development .right li{ padding: 5px 0;}
	.sekio-development .right li:before{ display: none;}
	.sekio-legend .tit{ right:auto;}
	.sekio-legend .left{ width: 100%;}
	.sekio-legend .right{ width: 100%; padding: 0.4rem;}
	.sekio-legend .img{ width: 100%;}
	.sekio-legend .text{ width: 100%; padding: 0.4rem 0 0;}
	.sekio-legend .des{ font-size:0.38rem; line-height:0.6rem;}
	.sekio-site{ margin-bottom: 0; margin-left: 0; padding: 0.4rem;}
	.sekio-site .img{ margin:0; width: 100%;}
	.sekio-site .text{ width: 100%; padding-top: 0.4rem;}
	
	.sekio-patent{ margin-left: 0; margin-bottom: 0; padding: 0.53333333rem;}
	.sekio-patent .left{ margin: 0; width: 100%; padding-top:0.4rem;}
	.sekio-patent .right{ width: 100%; margin-top: 0.4rem;}
	.sekio-patent .right img{ margin: 0.4rem 0 0;}
	
	.sekio-standard{ margin-right: 0; padding:0.53333333rem;}
	.sekio-standard .tit{ left:auto; right:auto;}
	.sekio-standard .img{ margin: 0.4rem 0; width: 100%;}
	.sekio-standard .text{ width: 100%; font-size: 0.3rem;}
	
	.sekio-achievements{ padding: 0.53333333rem;}
	.sekio-achievements .text{ width: 100%;padding: 0;}
	.sekio-achievements li span{ font-size:0.42rem;}
	.sekio-achievements .img{ width: 100%; margin: 0.4rem 0;}
	
	.sekio-question{  font-size: 0.36rem; line-height: 0.6rem; }
	.sekio-question .ques{ padding:30px 25px;}
	.sekio-question .ans{ padding:30px 25px;}
	.sekio-question .square{ width: 30px; height: 30px; font-size:16px; line-height: 30px;}
	.sekio-question li{ width: 100%; font-size: 0.32rem; line-height: 0.58rem;}
	
	.sekio-flip a{ line-height: 28px; font-size: 0.32rem;}
	.sekio-flip a:before{ width: 28px; height: 28px;}
	.sekio-flip .prev{ padding-left: 35px;}
	.sekio-flip .next{padding-right: 35px;}
	
	.seiko-bottom-box .text{  width: 100%;}
	.seiko-bottom-box .img{ margin-top:1rem; width: 100%;}
	.seiko-bottom-box .text span{ font-size:0.44rem;}
	.seiko-bottom-box .text a{ font-size:0.32rem;}
}



/* ========== */
/* = construction = */
/* ========== */
.construction{ padding-bottom: 180px;}
.construction li{ margin-top: 50px; float: left; width: 32%; margin-right:2%;}
.construction li:nth-child(3n){ margin-right: 0;}
.construction .item{ display: block;}
.construction .item .img{ position: relative;}
.construction .item .img:after{ display: none; content: ""; position: absolute; top:0; left:0; width: 100%; height: 100%; background: #0077b4; opacity: .8;}
.construction .item .img img{ width: 100%;}
.construction .item .img span{ display: none; position: absolute; z-index: 1; margin-top: -40px; top:50%; left:0; width: 100%; text-align: center; color: #FFFFFF; font-size: 16px;}
.construction .item .img span i{ display:block; margin: 0 auto 15px; width: 40px; height: 40px;}
.construction .item .text span{ margin-top: 10px; display: block; line-height: 44px; font-size: 20px; color: #333333; border-bottom:1px solid #b2b2b2; } 
.construction .item .text p{ margin-top: 10px; line-height: 24px; font-size:16px;}
.construction .item .text p i{ color: #0077b4; font-style: normal;}
.construction .item:hover .img:after{ display: block;}
.construction .item:hover .img span{ display: block;}
.construction .item:hover .text span{ color: #0077b4; }


/* ========== */
/* = HYDROPOWER = */
/* ========== */
.hydropower-choice{ padding: 50px 0;}
.hydropower-choice .content{ margin-top: 50px; display: flex; flex-flow: wrap; align-items: center; justify-content: space-between;}
.hydropower-choice .img{ width: 57.5%;}
.hydropower-choice .text{ width: 42.5%; padding:0 20px 0 35px; line-height: 30px;}
.hydropower-choice .text .blue{ font-size:16px; color: #0077b4;}

.hydropower-process{ padding:50px 0; background: #333333; color: #bbbbbb;}
.hydropower-process .theme-tit{ color: #FFFFFF;}
.hydropower-process li{ margin-top: 50px; float: left; width: 32%; margin-right:2%;}
.hydropower-process li:nth-child(3n){ margin-right: 0;}
.hydropower-process li span{ display: block; font-size: 18px; margin: 25px 0; color: #0077b4;}
.hydropower-process li p{line-height: 24px;}
.hydropower-point{ padding: 50px 0;}
.hydropower-point .theme-des{ margin: 15px auto 0; line-height: 26px; max-width: 580px; text-align: center; font-size: 14px; line-height:24px;}
.hydropower-point .content{ margin-top: 50px;}
.hydropower-point .box{ padding:50px 130px 45px;}
.hydropower-point .box:nth-child(2n){ background: #f5f3f3;}
.hydropower-point .box .tit{ font-size:20px; color: #0077b4; text-align: center;}
.hydropower-point .box .slick{ margin:25px -20px 0;}
.hydropower-point .box .slick-prev,
.hydropower-point .box .slick-next{ margin-top: 0; top:86px;}
.hydropower-point .box .slick-prev{ left:-40px;}
.hydropower-point .box .slick-next{ right:-40px;}
.hydropower-point .box .slick-slide{ padding: 0 20px;}
.hydropower-point .box .slick-slide img{ width: 100%;}
.hydropower-point .box .des{ margin-top: 30px; line-height: 26px;}
.hydropower-point .box .des span{ float: left; width: 50%; text-align: center;} 
.hydropower-point .box .img{ margin: 25px auto 0;}
.hydropower-point .box .con{ display: flex; flex-flow: wrap; align-items: center; justify-content: space-between;}
.hydropower-point .box .con .img{ width: 62%;}
.hydropower-point .box .con .text{ width: 38%; padding-left:2%; line-height: 26px;}

.hydropower-adv{ padding:50px 0; background: #333333;}
.hydropower-adv .theme-tit{ color: #FFFFFF;}
.hydropower-adv .content{ margin-top: 50px; display: flex; flex-flow: wrap; align-items: center; justify-content: space-between;}
.hydropower-adv .img{ width: 62%; padding:0 4%;}
.hydropower-adv .img img{ width: 100%;}
.hydropower-adv .text{ width: 38%; font-size: 18px;  line-height:36px; color: #FFFFFF;}
.hydropower-adv .text p{ margin: 22px 0; }
.hydropower-adv .text p span{ margin-right: 15px;}
.hydropower-site{ padding:50px 0; color: #333333;}
.hydropower-site .w1200{ display: flex; flex-flow: wrap; align-items: center; justify-content: space-between;}
.hydropower-site .img{ width: 60%;}
.hydropower-site .text{ width:40%; text-align: center; padding: 0 3%;}
.hydropower-site .text p{ font-size: 24px;}
.hydropower-site .text div{ margin-top: 40px; line-height: 30px; text-align: justify;}
.hydropower-site .text span{ margin-top:30px; display: inline-block; height:50px; line-height:50px; color: #0077b4; padding-left:60px; font-size: 18px; }
.hydropower-site-black{ background: #333333; color: #FFFFFF;}
.hydropower-site-black .text span{ color: #FFFFFF;}


/* ========== */
/* = MUDWOOD = */
/* ========== */
.mudwood-key{ padding:50px 0; background: #333333; color: #bbbbbb;}
.mudwood-key .theme-tit{ color: #FFFFFF;}
.mudwood-key .content{ margin-top: 50px;}
.mudwood-key .img{ float: left; width: 57%;}
.mudwood-key .text{ float: right; width: 40%; color: #bbbbbb; line-height: 26px;}
.mudwood-key .text .con span{ margin-bottom: 10px; float: left; width: 50%;}
.mudwood-link{ padding: 50px 0; background: #333333; color: #FFFFFF; text-align: center;}
.mudwood-link .theme-tit{ color: #FFFFFF;}
.mudwood-link .slick{ margin-top: 50px; padding: 0 50px;}
.mudwood-link .slick-slide{ padding: 0 10px;}
.mudwood-link .slick-slide p{ margin-top:15px; font-size: 20px;}
.mudwood-link .slick-dots li button{ background: #FFFFFF;}
.mudwood-link .slick-dots li.slick-active button { background: #0077b4;}
.mudwood-champion{ padding: 50px 0; }
.mudwood-champion li{ margin-top: 50px; float: left; width: 48.5%; margin-right:3%;}
.mudwood-champion li:nth-child(2n){ margin-right: 0;}
.mudwood-champion li p{ margin-top: 20px; line-height: 26px;}
.mudwood-heart-ul { margin-top: 50px;}
.mudwood-heart-ul li{ padding: 45px 130px;}
.mudwood-heart-ul li:nth-child(2n){ background: #f5f3f3;}
.mudwood-heart-ul li .item{ float: left; width: 48%; margin-right:4%;}
.mudwood-heart-ul li .item:nth-child(2n){  margin-right: 0;}
.mudwood-heart-ul li .item span{ display: block; font-size: 20px; color: #0077b4;}
.mudwood-heart-ul li .item img{ margin-top: 20px; width: 100%;}
.mudwood-heart-ul li .item .des{ margin-top: 15px; line-height: 26px;}


/* ========== */
/* = TECHNOLOGY = */
/* ========== */
.technology{ padding: 50px 0 80px;}
.technology-tab{ margin-bottom: 50px;}
.technology-tab a{float: left; width: 15%; margin-right: 2%; display: block; border: 1px solid #a3a3a3; text-align: center; line-height: 50px; font-size: 16px;}
.technology-tab a:last-child{ margin-right: 0;}
.technology-tab a.active{ background: #0077b4; border: 1px solid #0077b4; color: #FFFFFF; font-weight: bold;}
.technology li{ margin-bottom:35px; float: left; width: 23.5%; margin-right:2%;}
.technology li:nth-child(4n){ margin-right: 0;}
.technology li:nth-child(4n+1){ clear: both;}
.technology .item .img{ position: relative; overflow: hidden;}
.technology .item .img img{ width: 100%;}
.technology .item .img span{ position: absolute; top:0; right:0; display: block; width: 75px; height: 75px;  background-size: cover; font-size: 0;}
.technology .video-button{ cursor: pointer;}
.technology .video-button .img:after{ content: ""; position: absolute; top:50%; left:50%; width:50px; height:50px; margin-top: -25px; margin-left: -25px; background-size:cover;}
.technology .item .text{ padding-right: 30px;}
.technology .item .text span{ display: block; padding: 20px 0 15px; font-size: 18px; color: #333333; }
.technology .item .text p{ display: none;}
.technology .item:hover .img img{ transform: scale(1.05); -webkit-transform: scale(1.05);}
.technology .item:hover .text span{ color:#0077b4;}


/* ========== */
/* = QUALITY = */
/* ========== */
.quality{ padding: 50px 0 80px;}
.quality .tit-des{ margin: 20px auto 0; max-width: 1020px; text-align: center; line-height: 26px; font-size: 16px;}
.quality-ul li{ margin-top: 50px; float: left; width: 49%; margin-right:2%;}
.quality-ul li:nth-child(2n){ margin-right: 0;}
.quality-ul li span{ display: block; line-height: 60px; color: #333333; font-weight: bold; font-size: 18px;}
.quality-ul li p{ max-width: 470px; text-align:justify; line-height: 22px;}
.quality .blue-tit{ margin-top: 45px; padding: 12px; background: #0077b4; font-size: 24px; font-weight: bold; color:#fff;}
.quality-box{ margin-top: 40px;}
.quality-box .tit{ position: relative; }
.quality-box .tit:after{ content: ""; position: absolute; top:50%; left:0; width: 100%;height: 1px; background: #666666;}
.quality-box .tit span{ position: relative; z-index: 1; display: inline-block; padding-right: 20px; font-size: 22px; color: #0077b4; font-weight: bold; background: #FFFFFF;}
.quality-box .con{ margin-top: 20px; display: flex; flex-flow: wrap; align-items: center; justify-content: space-between;}
.quality-box .con .text{ width:38%; text-align: justify; padding-right:3%; line-height: 24px;}
.quality-box .con .text .p1{ font-size: 16px;}
.quality-box .con .text .p2{ margin-top: 10px; color: #999999;}
.quality-box .con .img{ width: 62%;}
.quality-box .con .img img{ float: left; width: 32.3333%; margin-right: 1.5%;}
.quality-box .con .img img:nth-child(3n){ margin-right: 0;}


/* ========== */
/* = MATERIAL = */
/* ========== */
.material-system{ padding: 50px 0;}
.material-system ul{ margin-top: 45px;}
.material-system li{ float: left; width: 33.333333%; position: relative;}
.material-system li .text{ width: 100%; position: relative; z-index: 1; padding:10px 35px; height: 212px; background: #333333; color:#FFFFFF;  text-align: center;}
.material-system li .text:after{content: ""; position: absolute; bottom:-20px; left:30px; display: block; width: 0px; height: 0px; border-style:solid dashed dashed dashed; border-color:#333333 transparent transparent  transparent; border-width:10px 12px 10px 12px;}
.material-system li .con{ display:inline-block; vertical-align: middle; text-align: left;}
.material-system li .con+i{ display: inline-block; height: 100%; vertical-align: middle;}
.material-system li .con img{ float: left;}
.material-system li .con div{ margin-left: 88px;}
.material-system li .con div span{ display: block; font-weight: bold; font-size: 22px;}
.material-system li .con div p{ margin-top: 15px; font-size: 12px; line-height: 20px; color: #c8c8c8;}
.material-system li .img{ width: 100%; position: relative;  height: 212px; }
.material-system li .img img{ width: 100%;}
.material-system li:nth-child(2) .text{ position: absolute; top:212px; left:0;}
.material-system li:nth-child(2) .text:after{ top:-20px; bottom: auto; border-style:solid dashed dashed dashed; border-color:transparent transparent #333333 transparent; border-width:10px 12px 10px 12px;}


.material-auxiliary{  padding: 50px 0;}
.material-auxiliary .theme-tit{ color:#FFFFFF;}
.material-auxiliary .point{ text-align: center;}
.material-auxiliary .point .item{ margin-top: 40px; padding: 0 20px; display: inline-block;}
.material-auxiliary .point .item img{ float: left;}
.material-auxiliary .point .item div{ margin-left: 70px; padding-left: 20px; border-left: 1px solid rgba(255,255,255,.2); text-align: left; color:#FFFFFF;}
.material-auxiliary .point .item div span{ display: block; font-size: 22px; font-weight: bold;}
.material-auxiliary .point .item div p{ margin-top: 5px; font-size: 12px; color: #999999; text-transform: uppercase;}
.material-auxiliary ul{ margin-top: 25px;}
.material-auxiliary ul li{ float: left; width: 16.66666666%; padding: 5px;}

.material-main{ padding: 50px 0;}
.material-main .content{ margin-top: 50px;}
.material-main .img{ float: left; width: 14%;}
.material-main .img img{ width: 100%;}
.material-main ul{ float: right; width: 86%;}
.material-main li{ float: left; width: 10%; border-top: 1px solid #eeeeee; border-left:  1px solid #eeeeee;}
.material-main li:nth-child(1),
.material-main li:nth-child(2),
.material-main li:nth-child(3),
.material-main li:nth-child(4),
.material-main li:nth-child(5),
.material-main li:nth-child(6),
.material-main li:nth-child(7),
.material-main li:nth-child(8),
.material-main li:nth-child(9),
.material-main li:nth-child(10){ border-top: none;}

.material-add{ padding: 50px 0;  text-align: center; color:#FFFFFF; }
.material-add .p1{ font-size: 18px; letter-spacing:30px; text-transform: uppercase; color: #0077b4; opacity: .5;}
.material-add .p2{ font-size: 28px; margin-top: 10px;}
.material-add .ny-button{ margin:30px auto 0;}
.material-delivery{ padding: 50px 0;}
.material-delivery .con{ margin-top: 40px;}
.material-delivery .ny-button{ margin:50px auto 0;}


@media (max-width:999px) {
	
	
	/* ========== */
	/* = construction = */
	/* ========== */
	.construction{ padding-bottom: 80px;}
	.construction li{ width: 100%; margin-right: 0;}
	.construction .item .text span{ font-size:0.42rem; font-weight: bold;}
	.construction .item .text p{ font-size:0.34rem; line-height: 0.6rem;}
	.construction .item:hover .img:after{ display: none;}
	.construction .item:hover .img span{ display: none;}
	.construction .item:hover .text span{ color: #333; }
		
	/* ========== */
	/* = HYDROPOWER = */
	/* ========== */
	.hydropower-choice .img{ width: 100%;}
	.hydropower-choice .text{ width: 100%; padding:30px 0 0;}
	.hydropower-process li{ width: 100%;}
	.hydropower-point .box{ padding:40px 20px;}
	.hydropower-point .box .tit{ font-size: 0.4rem;}
	.hydropower-point .box .slick{ padding-bottom: 40px;}
	.hydropower-point .box .slick-prev,
	.hydropower-point .box .slick-next{ margin-top: 0; top:86px;}
	.hydropower-point .box .slick-prev{ left:-40px;}
	.hydropower-point .box .slick-next{ right:-40px;}
	.hydropower-point .box .slick-slide{ padding: 0 20px;}
	.hydropower-point .box .slick-slide img{ width: 100%;}
	.hydropower-point .box .des{ margin-top: 30px; line-height: 26px;}
	.hydropower-point .box .con .img{ width: 100%;}
	.hydropower-point .box .con .text{ margin-top: 30px; width: 100%; padding: 0;}
	.hydropower-adv .img{ width: 100%; padding: 0;}
	.hydropower-adv .text{ width: 100%; font-size:14px; line-height:26px;}
	.hydropower-site .img{ margin-top: 40px; width: 100%;}
	.hydropower-site .text{ width: 100%;}
	

	/* ========== */
	/* = MUDWOOD = */
	/* ========== */
	.mudwood-key .img{  width: 100%;}
	.mudwood-key .text{  margin-top: 30px; width: 100%;}
	.mudwood-link .slick{ padding: 0 0 50px;}
	.mudwood-link .slick-slide{ padding: 0;}
	.mudwood-link .slick-slide p{ font-size: 16px;}
	.mudwood-champion li{ width: 100%; margin-right:0;}
	.mudwood-heart-ul li{ padding:40px 20px;}
	.mudwood-heart-ul li .item{ margin-bottom: 30px; width: 100%; margin-right: 0;}
	.mudwood-heart-ul li .item:last-child{ margin-bottom:0;}
	.mudwood-heart-ul li .item span{ font-size: 16px;}
	
	
	/* ========== */
	/* = TECHNOLOGY = */
	/* ========== */
	.technology-tab { margin-bottom: 0.53333333rem;}
	.technology-tab a{ margin-bottom: 0.2rem; line-height:0.8rem;  line-height: 0.8rem; font-size: 0.3rem; width: 32%;}
	.technology-tab a:nth-child(3n){ margin-right: 0;}
	.technology li{ margin-bottom: 0.3rem; width:48%; margin-right:4%;}
	.technology li:nth-child(2n){ margin-right: 0;}
	.technology li:nth-child(2n+1){ clear: both;}
	.technology .video-button .img:after{ width: 30px; height: 30px; margin-left: -15px; margin-top: -15px;}
	.technology .item .img span{ width:40px; height: 40px;}
	.technology .item .text{ padding-right: 0;}
	.technology .item .text span{ font-size: 0.34rem; padding: 0.26666666rem 0;}
	.technology .item .text p{ font-size: 12px; line-height: 20px;}
	
	
	/* ========== */
	/* = QUALITY = */
	/* ========== */
	.quality-ul li{ width: 100%; margin-right: 0;}
	.quality .blue-tit{ font-size: 0.42rem;}
	.quality .tit-des{ font-size:0.37333333rem; line-height:0.69333333rem;}
	.quality-box .tit span{ font-size: 0.4rem;}
	.quality-box .con .text{ width:100%; padding-right: 0;}
	.quality-box .con .text .p1{ font-size: 14px;}
	.quality-box .con .img{ margin-top:0.5rem; width:100%;}
	
	
	/* ========== */
	/* = MATERIAL = */
	/* ========== */
	.material-system ul{ margin-top: 0;}
	.material-system li{ margin-top:0.2rem; width: 100%; display: flex; flex-flow: wrap; align-items: center; justify-content: space-between; position:relative;     background: #333333;}
	.material-system li .con img{ display: none;}
	.material-system li .con div{ width: 100%; margin-left: 0;}
	.material-system li .con div span{ font-size: 0.3rem;}
	.material-system li .con div p{ margin-top: 0.2rem; font-size:0.22rem; line-height: 0.42rem;}
	.material-system li:nth-child(2) .text{ position: relative; top:auto; left:auto;}
	.material-system li .text{ width: 50%; height: auto; padding:0.26666666rem;}
	.material-system li .text:after{ display: none;}
	.material-system li .img{ width:50%;height: auto; }


	.material-auxiliary .point .item{ padding: 0 0.2rem; }
	.material-auxiliary .point .item img{ width: 0.6rem; }
	.material-auxiliary .point .item div{ margin-left:0.7rem; padding-left: 0.26666666rem; }
	.material-auxiliary .point .item div span{ line-height: 0.7rem; font-size: 0.3rem;}
	.material-auxiliary .point .item div p{display: none;}
	.material-auxiliary ul li{ width: 33.3333333%;}
	
	.material-main .img{ display:none}
	.material-main ul{ width: 100%; border-bottom: 1px solid #eeeeee; border-right: 1px solid #eeeeee; }
	.material-main li{  width: 20%; }
	.material-main li:nth-child(1),
	.material-main li:nth-child(2),
	.material-main li:nth-child(3),
	.material-main li:nth-child(4),
	.material-main li:nth-child(5),
	.material-main li:nth-child(6),
	.material-main li:nth-child(7),
	.material-main li:nth-child(8),
	.material-main li:nth-child(9),
	.material-main li:nth-child(10){border-top: 1px solid #eeeeee; }
	
	.material-add .p1{ font-size:0.3rem; letter-spacing: 0.02666666rem;}
	.material-add .p2{  font-size: 0.42rem;}
}




/* ========== */
/* = PLAN = */
/* ========== */
.plan{ padding: 60px 10px 75px;}
.plan .bg{ max-width: 1040px; margin: 0 auto; -o-box-shadow:0 0 40px rgba(0,0,0,.2); -ms-box-shadow:0 0 40px rgba(0,0,.2); -moz-box-shadow:0 0 40px rgba(0,0,0,.2);  -webkit-box-shadow:0 0 40px rgba(0,0,0,.2); 
box-shadow:0 0 40px rgba(0,0,0,.2); }
.plan .pd90{padding: 55px 90px 80px;}
.plan-banner{ position: relative; text-align: center; padding: 35px 0;}
.plan-banner .close{ position: absolute; z-index: 1; top:13px; right:22px; width:50px; height: 50px;  background-size:cover; cursor: pointer;}
.plan-banner .con{ display: inline-block; background: rgba(255,255,255,.7); padding: 20px; position: relative;}
.plan-banner .con span{ display:inline-block; font-size: 36px; font-weight: bold; background: #0077b4; color: #FFFFFF; line-height: 52px; padding: 0 12px;}
.plan-banner .con p{ margin-top: -26px; padding:30px 25px 10px; font-size: 20px; color: #0077b4; border:4px solid #0077b4;}

.plan-process{ text-align: center; color: #0077b4;}
.plan-process .tit{ font-size: 20px;}
.plan-process ul{ margin-top: 30px; border: 1px solid #0077b4; padding: 20px 10px;}
.plan-process li{ float: left; width: 14.2857%; font-size: 16px;}
.plan-process li p{ margin-top: 10px;}

.plan-tit{ font-size:28px; color: #0077b4; text-align: center;}
.plan-border{ position: absolute; left: 10%; top:0; border: 2px solid #0077b4; width: 80%; height: 80%;}
.plan-button{  position: absolute; top:-62px; right:-62px; display: block; width: 125px; height: 125px; line-height:22px; padding-top: 38px; text-align: center; color: #FFFFFF; font-size:16px;  background-size: cover;}
.plan-button .ico-hand{ bottom: 10px; right:5px;}
.plan-button2{ line-height: 125px; padding-top: 0;}

.plan-case{ margin-top:50px;}
.plan-case .content{ margin-top: 45px; padding: 30px 35px 0; position: relative;}
.plan-case .text{ position: relative;z-index: 1; padding-left: 45px; font-size: 18px; background: #FFFFFF; color: #333333; display: inline-block;}
.plan-case ul{ position: relative; z-index: 1;}
.plan-case li{ float: left; width: 50%; padding: 0 15px;}
.plan-case .item{ margin-top: 20px; display: block; position: relative;}
.plan-case .item img{ width: 100%;}
.plan-case .item div{ position: absolute; bottom: 0; left:0; background: rgba(0,0,0,.8); color: #FFFFFF; padding: 8px 120px 8px 20px; width: 100%;}
.plan-case .item div span{ display: inline-block; margin-right:20px;}
.plan-case .item div i{ position: absolute; display: block; top:8px; right:15px; width: 90px; height: 20px; line-height: 20px; font-style:normal; text-align: center; background: #0077b4; color: #FFFFFF; font-size: 12px;}

.plan-praise{margin-top:50px;}
.plan-praise .content{ margin-top: 50px; position: relative;}
.plan-praise .plan-border{ top:20px; left:5%; width: 90%; height: 105%;}
.plan-praise .plan-button{ top:auto; bottom:-62px; right:-42px;}
.plan-praise .text{ float: right; width: 25%; padding:7% 7% 0 0; font-size: 22px; line-height: 34px; color: #333333;}
.plan-praise ul{ float: left; width: 73%; position: relative; z-index: 1;}
.plan-praise li{ float: left; width: 50%; padding: 0 10px;}
.plan-praise .item{ display: block; position: relative; background: #FFFFFF; padding: 30px 15px; position:relative;}
.plan-praise .item:before{ content: ""; position: absolute; top:-12px; left:50%; margin-left: -15px; width: 30px; height: 30px; } 
.plan-praise .item .head{ float: left; width: 60px; border-radius: 100%; overflow: hidden;}
.plan-praise .item .des{ margin-left: 70px;}
.plan-praise .item .des span{ color: #0077b4; display:block;}
.plan-praise .item .des p{ margin-top: 10px; font-size: 12px; line-height: 20px; height: 60px; overflow: hidden;}
.plan-praise .item .des p.active{ height: auto;}
.plan-praise .item .des i{  margin-top: 5px; font-style: normal; text-align: right; display: block; color: #0077b4; font-size: 12px; cursor: pointer;}


.plan-style{margin-top:80px;}
.plan-style .content{ margin-top: 50px; position: relative; min-height:200px;}
.plan-style .plan-border{ top:20px; left:3%; width: 90%; height: 105%;}
.plan-style .plan-button{ bottom: -62px; left:-42px; top:auto; right:auto;}
.plan-style .text{ float: left; width: 25%; padding: 7% 0 0 7%; font-size: 22px; line-height: 34px; color: #333333;}
.plan-style ul{ float: right; width: 73%; position: relative; z-index: 1;}
.plan-style li{ float: left; width: 50%; padding: 0 10px;}
.plan-style .item{ display: block; position: relative;}
.plan-style .item img{ width: 100%;}
.plan-style .item div{ position: absolute; bottom: 0; left:0; background: rgba(0,0,0,.8); color: #FFFFFF; padding: 8px 120px 8px 20px; width: 100%;}
.plan-style .item div span{ display: inline-block; margin-right:20px;}
.plan-style .item div i{ position: absolute; display: block; top:8px; right:15px; width: 90px; height: 20px; line-height: 20px; font-style:normal; text-align: center; background: #0077b4; color: #FFFFFF; font-size: 12px;}

.plan-quality{margin-top:75px;}
.plan-quality .text{ padding-left: 110px; background: none;}
.plan-connect{ margin-top: 60px; text-align: center; font-size: 20px; } 
.plan-connect .text{ margin-top: 10px; color: #333333;}
.plan-connect a{ margin-top: 20px; display: inline-block; padding: 14px 25px; position: relative; background: #0077b4; color: #FFFFFF;font-weight: bold;}
.plan-connect a:before{ content: ""; position: absolute; left:-50px; margin-top: -35px; top:50%; width: 70px; height: 60px; }


@media (max-width:999px) {
	/* ========== */
	/* = PLAN = */
	/* ========== */
	.plan{ padding: 0;}
	.plan .pd90{ padding:1rem 0.8rem 1.5rem;}
	.plan-banner .close{ width: 30px; height: 30px;}
	.plan-banner .con span{ font-size:0.40rem;}
	.plan-banner .con p{font-size: 0.36rem;}
	
	.plan-process .tit{ font-size:0.34rem;}
	.plan-process ul{ padding: 0 0 20px;}
	.plan-process li{ margin-top: 20px; width:25%; font-size: 0.26666666rem;}
	.plan-process li p{ margin-top: 10px;}
	
	.plan-tit{ font-size: 0.44rem; font-weight: bold;}
	.plan-border{ width: 100%; height: 100%; left:0; top:0;}
	.plan-button{ width:2rem; height: 2rem; top:-1rem; right:-0.7rem; font-size: 0.28rem; line-height: 0.4rem; padding-top: 0.6rem;}
	.plan-button2{ line-height:2rem; padding-top: 0;}
	.plan-button .ico-hand{ bottom: 0.1rem; width: 0.6rem; height: 0.6rem;}
	
	.plan-case .content{ padding:1rem 0 0.8rem; }
	.plan-case .text{ padding:0 0.53333333rem; text-align: center; background: none; font-size:0.36rem;}
	.plan-case li{ width:100%;}
	.plan-case .item{ width:100%; margin:20px auto 0;}
	
	.plan-praise .content{ padding:0.8rem 0 1.2rem; }
	.plan-praise .plan-border{ top:0; left:0; width:100%; height: 100%;}
	.plan-praise .plan-button{ top:auto; bottom:-1rem; right:-0.7rem;}
	.plan-praise .text{ float: none; width: 100%; padding:0 0.53333333rem; text-align: center; background: none; font-size:0.36rem;}
	.plan-praise ul{ width: 100%;}
	.plan-praise li{ width: 100%; padding: 0 15px; }
	.plan-praise .item{ width:100%; margin:20px auto 0;}
	
	.plan-style .content{ padding:0.8rem 0 1.2rem;}
	.plan-style .plan-border{ top:0; left:0; width: 100%; height: 100%;}
	.plan-style .plan-button{ bottom:-1rem; left:-0.7rem;}
	.plan-style .text{width: 100%; padding:0 0.53333333rem; text-align: center; background: none; font-size:0.36rem;}
	.plan-style ul{ width: 100%;}
	.plan-style li{ width: 100%; padding: 0 15px;}
	.plan-style .item{ width:100%; margin:20px auto 0;}
	
	.plan-quality{margin-top:75px; }
	.plan-quality .text{ padding: 0; text-align: center; width: 100%; font-size: 0.4rem;}
	.plan-connect{ font-size: 0.4rem;} 
}




/* ========== */
/* = ABOUT = */
/* ========== */
.about-banner{ height: 645px; padding-top: 272px; color: #FFFFFF; text-shadow:0 0 10px rgba(0,0,0,.6);}
.about-banner h2{ font-size: 72px; font-weight: bold;  letter-spacing: 3px; text-shadow:0 0 20px rgba(0,0,0,.8);}
.about-banner span{ margin-top: 15px; display: inline-block; padding: 10px 20px; font-size: 26px; letter-spacing:3px; font-family: "宋体"; background: rgba(0,119,180,.7);}
.about-banner p{ margin-top: 15px; font-size: 20px; font-weight: bold; text-transform:uppercase;}

.about-box{ padding: 50px 0;}
.about-box .text{ float: left; width: 48%;}
.about-box .text h1{ margin-bottom: 40px; padding-bottom: 25px; font-size: 36px; color: #333333; position: relative;}
.about-box .text h1:after{ content: ""; position: absolute; bottom: 0; left:0; width: 130px; height: 6px; background: #0077b4;} 
.about-box .text p{ font-size: 18px; line-height: 34px; text-indent: 2em;}
.about-box .img{ margin-top: 15px; float: right; width: 48%; position: relative; cursor: pointer;}
.about-box .img video{ width: 100%;}


.about-point{ padding: 30px 0;background-image: url(about_point_bg.jpg);}
.about-point li{ padding: 30px 15px; float: left; width: 20%; text-align: center; color: #FFFFFF; position: relative;}
.about-point li:after{ content: ""; position: absolute; margin-top: -22px; top:50%; right:0; width:1px; height: 60px; background: rgba(255,255,255,.1);}
.about-point li:nth-child(5n):after{ display: none;}
.about-point li:nth-child(5n+1){ clear: both;}
.about-point li span{ display: inline-block; font-size:30px; position: relative;}
.about-point li span i,
.about-point li span em{ position: absolute; top:0; left:100%; padding-left:5px; line-height:25px; font-size: 25px; font-style: normal;}
.about-point li span em{ font-size: 15px;}
.about-point li img{ margin-top: 5px;}
.about-point li p{ margin-top:5px; font-size: 17px;}


.about-tit{ padding-bottom: 20px; position: relative; line-height: 50px; text-align: center;}
.about-tit:after{ content: ""; position: absolute; margin-left: -33px; bottom: 0; left:50%; width: 66px; height: 2px; background: #b3b3b3;}
.about-tit span{ position: absolute; top:0; left:0; width: 100%; display: block; font-size: 36px; color: #333333;}
.about-tit p{ font-size:46px; font-weight: bold; color: #f1f1f1; text-transform: uppercase;}


.history{ padding: 50px 0;}
.history .content{ margin:65px auto 0; max-width: 1410px; height: 520px; position: relative;}
.history ul:before{ content: ""; position: absolute; left:50%; width: 1px !important; height: 100%; background: #999999;}
.history ul{  padding: 20px; position: relative;}
.history li{ margin-bottom: 30px; float:left; width: 50%; padding-right:75px; position: relative; min-height: 140px;}
.history li .cricle{ position: absolute; top:26px; right:-16px; display: inline-block;  font-size:0; padding: 9px; background: #FFFFFF; border:1px solid #999999; border-radius: 50%; }
.history li .cricle i{ display: inline-block; width: 12px; height: 12px; background: #999999; border-radius: 50%;}
.history li .item{ text-align: right; background: #FFFFFF; padding:15px 22px; position:relative; border-radius:10px; -webkit-box-shadow:0 0 20px rgba(0,0,0,.24); box-shadow:0 0 20px rgba(0,0,0,.24);}
.history li .item:before{ position: absolute; top:0; right:-40px; content: ""; width: 40px; height: 120px;}
.history li .item .img{ float: right; width: 46%;}
.history li .item .img img{ width: 100%;}
.history li .item .con{ float: left; width: 48%;}
.history li .item .year{ font-size: 12px; color: #0077b4; text-transform: uppercase;}
.history li .item .tit{ border-bottom: 1px dotted #e5e5e5; margin-top: 8px; padding-bottom: 15px; position: relative; padding-right: 85px; font-size: 20px; color: #333333; line-height: 32px;}
.history li .item .tit i{ position: absolute; top:0; right:0; font-size: 24px; font-style: normal;}
.history li .item .tit i:before{ content: ""; position: absolute; top:13px; right:67px; width: 8px; height: 8px; border-radius: 50%; background: #0077b4;}
.history li .item .text{ margin-top:12px; font-size:12px; line-height: 20px; height: 40px; overflow: hidden; text-align: justify;}
.history li .item .bt{ clear: both; cursor: pointer; margin-top: 10px; display:inline-block; padding-right: 20px; font-size: 12px; }
.history li .item .bt2{ display: none; }
.history li .item .bt.active{ display: none;}
.history li .item .bt2.active{ display: inline-block;}
.history li.active .item .text{ height: auto;}
.history li:nth-child(2n){ margin-top:45px; float: right; padding-left:75px; padding-right: 0;}
.history li:nth-child(2n+1){  clear: both;}
.history li:nth-child(2n) .cricle{ left:-16px; right:auto;}
.history li:nth-child(2n) .item{text-align: left;}
.history li:nth-child(2n) .item:before{ left:-40px; right:auto;}
.history li:nth-child(2n) .item .img{ float: left;}
.history li:nth-child(2n) .item .con{ float: right;}
.history li:nth-child(2n) .item .tit{ padding-right:0; padding-left: 85px;}
.history li:nth-child(2n) .item .tit i{ left:0; right:auto;}
.history li:nth-child(2n) .item .tit i:before{ left:67px; right:auto;}


.culture{ padding: 50px 0;}
.culture .about-tit span{ color: #333;}
.culture .about-tit p{  color: rgba(255,255,255,.2);}
.culture .about-tit:after{ background:rgba(255,255,255,.3) ;}
.culture ul{ margin-top: 35px; background: rgba(0,0,0,.7); padding: 10px 0;}
.culture li{ float: left; width: 25%; padding: 25px 10px; text-align: center; border-bottom: 1px solid rgba(245,255,255,.2); border-left: 1px solid rgba(255,255,255,.2); text-align: center; }
.culture li:nth-child(5),
.culture li:nth-child(6),
.culture li:nth-child(7),
.culture li:nth-child(8){ border-bottom: none;}
.culture li span{ margin-top: 15px; display: block; color: #FFFFFF; font-size: 24px;}
.culture li p{ margin: 15px auto 0; max-width: 200px; color: #bbbbbb; font-size: 16px; line-height: 22px; min-height: 44px;}


.honor{ padding: 50px 0;}
.honor .tab{ margin-top: 50px; text-align: center;}
.honor .tab span{ display: inline-block; margin: 0 35px; width:155px;  border: 1px solid #0077b4; color: #0077b4; line-height:36px; font-size: 18px; cursor: pointer;}
.honor .tab span.active{ background: #0077b4; color: #FFFFFF;}
.honor .js-tab-box{ margin-top: 50px; padding: 25px;}
.honor .js-tab-con{ height: 0; overflow: hidden;}
.honor .js-tab-con.active{ height: auto;}
.honor .content{ display: flex; flex-flow: wrap; align-items: center; justify-content: space-between; position:relative;}
.honor .content .img{ width: 45%;}
.honor .content .right{ width:52%;} 
.honor .content .right .content_3{ width: 100%; height: 300px;}
.honor .content .right .list{ padding:8px 0;  height: 62px;  width: 100%;  padding-right: 30px;}
.honor .content .right .item{ position: relative; line-height: 46px; height: 46px; padding:0 8px;  font-size: 16px;}
.honor .content .right .item span{ float:left; margin-top:4px; margin-right: 13px; width:80px; color: #cccccc; text-align:center; font-size:20px; height: 38px; line-height: 38px; border-right: 1px solid #b2b2b2;}
.honor .content .right .item:hover{ background: #0077b4; color:#FFFFFF;}
.honor .content .right .item:hover span{ color: #FFFFFF; border-right: 1px solid #FFFFFF;}
.myscroll { width: 100%; height: 300px; overflow: hidden;}



 
.mobile-honor{ padding:50px 15px;}
.mobile-honor .tab{ text-align: center;}
.mobile-honor .tab span{ float: left; width:23.5%; margin-right:2%; display:block; border: 1px solid #0077b4; color: #0077b4; line-height:36px;}
.mobile-honor .tab span:nth-child(4n){ margin-right: 0;}
.mobile-honor .tab span.active{ background: #0077b4; color: #FFFFFF;}
.mobile-honor .js-tab-box{ margin-top: 0.53333333rem;}
.mobile-honor .js-tab-con{ display: none;}
.mobile-honor .js-tab-con.active{ display: block;}
.mobile-honor .js-tab-con p{ margin-top:0.4rem; display: block; position: relative; padding-left: 1.33333333rem;  font-size: 0.3rem; line-height: 0.58rem;}
.mobile-honor .js-tab-con p span{ position: absolute; top:0; left:0; color: #0077b4; font-weight:bold; display: block; font-size: 0.4rem;}


.charity{ padding:50px 0;}
.charity .about-tit span{ color: #FFFFFF;}
.charity .about-tit p{  color: rgba(255,255,255,.2);}
.charity .about-tit:after{ background:rgba(255,255,255,.3) ;}
.charity .content{ margin: 50px -5px 0;}
.charity .left{ float: left;  width:49.1%; padding: 5px;}
.charity .right{ float: right; width: 50.9%;}
.charity .right .col{ float: left; width:50%; padding:5px;}
.charity .box{ display: block; position: relative;}
.charity .box img{ width: 100%;}
.charity .box div{ position: absolute; bottom: 0; left:0; width: 100%; padding: 10px 20px; background: rgba(0,119,180,.8); padding: 20px 170px 20px 20px; font-size: 20px; }
.charity .box div p{ line-height: 32px; color: #FFFFFF;}
.charity .box div span{ position: absolute; top:20px; right:10px; font-size: 16px; background: #FFFFFF; color: #0077b4; width: 158px; height: 32px; line-height: 32px; text-align: center;}
.charity .right .box div{ display: none; padding:10px 110px 10px 20px; font-size: 16px;}
.charity .right .box div span{ top:10px; width:90px; font-size: 13px;}
.charity .right .box:hover div{ display: block;}

@media (max-width:999px) {
	.about-box .text{ width: 100%;}
	.about-box .text h1{  font-size: 0.5rem; font-weight: bold;}
	.about-box .text p{ font-size:0.36rem; line-height:0.66666666rem;}
	.about-box .img{ margin-top: 0.7rem; width: 100%;}
	
	.about-point li{ padding: 0.4rem 0.2rem; width:25%;}
	.about-point li:nth-child(5n):after{ display: block;}
	.about-point li:nth-child(4n):after{ display: none;}
	.about-point li:nth-child(5n+1){ clear: initial;}
	.about-point li:nth-child(4n+1){ clear: both;}
	.about-point li span{ font-size: 0.42rem;}
	.about-point li img{ width: 0.8rem;}
	.about-point li span i,
	.about-point li span em{ font-size: 0.3rem;}
	.about-point li span em{ font-size: 0.24rem;}
	.about-point li p{ margin-top: 0.2rem; font-size: 0.24rem;}
	
	.about-tit{ line-height: 0.7rem;}
	.about-tit span{ font-size: 0.6rem;}
	.about-tit p{ font-size:0.7rem;}

	
	.history .content{ margin-top:40px; height:375px;}
	.history ul:before{ display: none;}
	.history ul{ padding:15px 10px;}
	.history li{ margin-bottom:20px; width: 100%; padding-right: 0;}
	.history li .cricle{ display: none;}
	.history li .item{ text-align: left; padding: 10px;  -webkit-box-shadow:0 0 10px rgba(0,0,0,.2); box-shadow:0 0 10px rgba(0,0,0,.2);}
	.history li .item:before{display: none; }
	.history li .item .img{ display: none;}
	.history li .item .con{ width: 100%;}
	.history li .item .tit{ padding-right: 0; padding-bottom: 5px; font-size: 14px; font-weight:bold ; }
	.history li .item .tit i{ position: relative; top:auto; right:auto; font-size:16px; margin-right: 10px;}
	.history li .item .tit i:before{ display: none;}
	.history li:nth-child(2n){ margin-top:0; padding-left: 0; }
	.history li:nth-child(2n) .item .tit{ padding-left: 0;}
	.history li:nth-child(2n) .item .tit i{ left:0; right:auto;}
	
	
	.culture li{ width:50%;}
	.culture li:nth-child(5),
	.culture li:nth-child(6){border-bottom: 1px solid rgba(245,255,255,.2);}
	.culture li img{ width: 0.8rem;}
	.culture li span{ font-size: 0.4rem; }
	.culture li p{ font-size: 0.32rem; line-height: 0.5rem; min-height: 1rem;}
	
	
	.charity .left{ width: 100%; }
	.charity .right{ width: 100%; }
	.charity .box div{ padding:10px 110px 10px 20px; font-size: 13px;}
	.charity .box div span{ top:10px; width:90px; font-size: 12px;}
	.charity .right .box div{ display: block; padding:0 10px; font-size: 12px;}
	.charity .right .box div span{ display:none;}
}	



.order{ padding: 50px 0 90px;}
.order .theme-des{ font-size: 16px;}
.order .content{ margin-top: 50px; padding: 55px 0;}
.order .content .left{ float: left; width: 63%; padding: 0 50px; border-right: 1px solid #c1c1c1;}
.order .content .row{ margin-bottom: 15px;}
.order .content .row span{ float: left; width: 48%; margin-right:4%;}
.order .content .row span:nth-child(2n){ margin-right: 0;}
.order .content .row input{ width: 100%; border:1px solid #c1c1c1; line-height: 22px; padding: 10px 15px; color:#333333;}
.order .content .row textarea{ color:#333333;}
.order .content .textarea{ padding:10px 10px 10px 40px; border:1px solid #c1c1c1; }
.order .content .textarea textarea{ width: 100%; height: 75px; background: none; border: none;}
.order .content .bt{ width: 100%;}
.order .content .bt input{ width: 100%; height: 46px; line-height: 46px; background: #0077b4; color: #FFFFFF; font-weight: bold;}
.order .content .right{float: right; width: 37%; padding: 15px 50px 0; color: #999999; font-size: 16px;}
.order .content .right h2{ margin-top: 15px; font-weight: bold; color: #666666; font-size: 32px;}
.order .content .right .link{ margin-top: 45px;}
.order .content .right .link a{ margin-top: 25px; text-align: center; float: left; width: 48%; display: block; margin-right:4%; border:1px solid #c1c1c1;  color: #999999;}
.order .content .right .link a:nth-child(2n){ margin-right: 0;}
.order .content .right .link a i{ display: inline-block; line-height: 44px; background-position: left center; background-repeat: no-repeat; padding-left: 40px; padding-right: 15px; font-style: normal;}

.order .content .right .link a:hover{ background:#0077b4; border: 1px solid #0077b4; color: #FFFFFF;}

.order input::-webkit-input-placeholder, 
.order textarea::-webkit-input-placeholder { color: #999;}
.order input:-moz-placeholder, 
.order textarea:-moz-placeholder { color: #999;}
.order input::-moz-placeholder, 
.order textarea::-moz-placeholder { color: #999;}
.order input:-ms-input-placeholder, 
.order textarea:-ms-input-placeholder { color: #999;}


@media (max-width:999px) {
	.order .theme-des{ margin-top: 0.26666666rem; font-size:0.32rem; line-height: 0.5rem; letter-spacing:0.01333333rem;}
	.order .content .left{ width: 100%; padding:0 20px; border: none;}
	.order .content .right{ margin-top: 30px; padding-top: 0; width: 100%; padding: 0 20px; font-size: 0.34666666rem;}
	.order .content .right h2{ font-size: 0.6rem;}
}

/*分页*/
.pagination {}
.pagination li {display: inline-block;margin:0 5px;padding: 5px;border: 0px solid #337ab7;min-width: 30px;text-align: center;}
.pagination li.active {background: #337ab7;color: #fff;border: 1px solid #337ab7;}
.pagination li a {display: block;text-align: center;}

.reserve{
      float: right;
      width: 200px;
      height: 50px;
      line-height: 50px;
      background: #0077b4;
      margin: 25px auto;
      border-radius: 25px;
}
.reserve span{
      color: #FFF;
      font-size: 17px;
      padding: 0px 33px;
      letter-spacing: 5px;
}