
/*S-= banner*/
.banner-box{ position: relative; transition:all ease .5s;}
.banner-box .pic {position: relative;overflow: hidden;}
.banner-box .pic span {padding-top: 31.25%;display: block;}
.banner-box .pic img{display: block;width: 100%;position: absolute;}
.banner-block{ position: absolute;top: 0; left: 0; width: 100%; height: 100%;}
.banner-height{ height: 100%;}
.banner-text{ width: 98%; display: inline-block; vertical-align: middle;}
.banner-text h2{font-family: 'AkkuratProBold';font-size: 72px;line-height:1.3;color: #ffffff;font-weight: normal;}
.banner-text p.meet{ font-family: 'AkkuratProRegular'; font-size: 38px; line-height:1.3; color: #ffffff; padding-top: 2px;}
.banner-text p.address{ font-family: 'AkkuratProLight'; font-size: 26px; line-height: 1.3; color: #ffffff; padding-top: 6px;}
a.banner-btn{ font-size: 18px; height: 50px; line-height: 50px; color: #fff; display: inline-block; padding:0 69px; background-color: #e50000; margin-top: 26px; outline: none;}
a.banner-btn:hover{ background: #b70000;}
.verticalmiddle{ height: 100%; vertical-align:middle; display: inline-block;width: 1px;}
.inside-page-box .btn { text-align: center;}

.banner-text span{ display: block; }
.banner-text span img{ width: 100%; max-width: 184px; margin-bottom: 30px; }
@media(max-width: 1600px){
    .banner-text h2{font-size: 60px;}
    .banner-text p.meet{ font-size: 22px;}
    .banner-text p.address{ font-size:18px; }
    a.banner-btn{margin-top: 25px;padding:0 31px;height: 34px;line-height: 34px;}
}
@media(max-width: 980px){
    .banner-text h2{ font-size: 40px;}
    .banner-text p.meet{ font-size: 30px; padding-top: 8px;}
    .banner-text p.address{ padding-top: 8px;}
    a.banner-btn{ margin-top: 15px;}
    .banner-text span img{ display: none; }
}
@media(max-width: 768px){
    .banner-box:before{ content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.1); display: inline-block;}
    .banner-box .pic span{ padding-top: 42.94%;}
    a.banner-btn{ padding:0 26px; font-size: 14px; margin-top: 5px;}
    .banner-text h2{ font-size: 30px;}
    .banner-text p.meet{ font-size: 24px; }
}
@media(max-width: 480px){
    .banner-text h2{font-size: 24px;}
    .banner-text p.meet{ font-size: 14px; padding-top: 4px;}
    .banner-text p.address{ font-size: 12px; padding-top: 2px;}
}
@media(max-width: 340px){
    .banner-text h2{ font-size: 12px;}
    .banner-text p.meet{ font-size: 12px;}
    a.banner-btn{ padding:2px 26px;}
}
/*E-= banner*/


.h2-title{margin-bottom: 40px;  text-align:center; font-size:40px; font-weight: normal; line-height:1.2;}
@media (max-width: 1680px) {
    .h2-title{ font-size:34px;  margin-bottom: 30px; }
}
@media (max-width: 1024px) {
    .h2-title{ margin-bottom: 25px; font-size:28px; background-size:48px; }
}
@media (max-width: 480px) {
    .h2-title{ margin-bottom: 20px; font-size:26px;}
}


/*S-= introduction*/
.introduction{ min-height: 422px; }
.introduction .introduction-l{ float: left; width: 69%; padding-right: 6%; }
.introduction .introduction-l p{ font-size: 20px; line-height: 1.6; color: #666; padding-bottom: 30px; }
.introduction .introduction-r{ float: left; width: 31%; padding-right: 40px; }
.introduction .introduction-r img{ width: 100%; max-width: 474px;}
.introduction .introduction-r a.video-b{background-color: #ff5d4a;padding:30px 28px 32px;display: block;margin: -24% -30px 0 23%;z-index: 2;position: relative;}
.introduction .introduction-r a.video-b p{ font-size: 16px; line-height: 1.5; color: #fff;}
.introduction .introduction-r a.video-b span{ font-size: 20px; font-weight: bold; line-height: 28px; color: #fff; text-transform: uppercase; letter-spacing: 1px; position: relative; padding-left: 47px; display: block; margin-top: 18px; }
.introduction .introduction-r a.video-b i{ font-size: 34px; color: #fff; position: absolute; top: 0; left: 0; }
.introduction .introduction-r a.video-b:hover{margin-top: -30%;}

@media(max-width: 1600px){
    .introduction{ min-height: 340px; }
    .introduction .introduction-l p{ font-size: 16px; }
    .introduction .introduction-r a.video-b{ padding:25px 23px; margin:-57% -30px 0 23%; }
    .introduction .introduction-r a.video-b:hover{ margin-top: -60%; }
    .introduction .introduction-r a.video-b p{ font-size: 14px; }
    .introduction .introduction-r a.video-b span{ font-size: 18px; }
}
@media(max-width: 1240px){
    .introduction .introduction-l p{ padding-bottom: 18px; }
}
@media(max-width: 768px){
    .introduction .introduction-l,.introduction .introduction-r{ float: none; width: 100%; }
    .introduction .introduction-l{ padding-right: 0; }
}
/*E-= introduction*/


/*S-= reasons*/
.reasons{ background: url(../images/reasons-bg.jpg) right top no-repeat!important; background-size: cover; }
.reasons .h2-title{ color: #fff;}
.reasons .h2-title p.account{ font-size: 18px; line-height: 1.333; color: #fff; text-align: center; max-width: 783px; margin: 0 auto; }
.reasons ul{ margin-left: -10px; margin-right: -10px; }
.reasons ul li{ padding:0 10px; float: left; width: 33.333%; }
.reasons ul li .libox{ border: 1px solid #dddeeb; background: rgba(255,255,255,0.1); padding:40px 40px 44px; text-align: center;}
.reasons ul li .libox h4{ font-size: 22px; line-height: 1.3; color: #fff; padding:28px 0 14px; }
.reasons ul li .libox p{ font-size: 16px; line-height: 1.25; color: #fff; }
.reasons ul li .libox img{ max-width: 111px; width: 100%; }
@media(max-width: 1600px){
    .reasons ul li .libox img{ max-width: 88px; }
}
@media(max-width: 1240px){
    .reasons ul li .libox h4{ font-size: 18px; padding:18px 0 6px; }
}
@media(max-width: 480px){
    .reasons ul li{ float: none; width: 100%; padding-bottom: 10px; }
    .reasons ul li .libox{ padding:30px 20px; }
    .reasons ul li .libox img{ max-width: 60px; }
}


/*E-= reasons*/


/*S-= solution3*/
.solution3 .row{ margin-left: -10px; margin-right: -10px; }
.solution3 .col4{ width: 33.333%; float: left; padding:0 10px; }
.solution3 .col3{ width: 25%; float: left; padding:0 10px; }
.solution3 .container{margin-bottom:-20px}
.solution3-t{position:relative;overflow:hidden}
.solution3-t img{display:block;width:100%;transition:1s transform;transform:scale(1,1);-webkit-transform:scale(1,1);-moz-transform:scale(1,1)}
.solution3-t i{position:absolute;left:20px;bottom:20px;font-size:44px;color:#fff}
.solution3-b h4{font-size:20px;line-height:26px;font-weight:400;padding:15px 0 10px}
.solution3-b p{font-size:14px;line-height:22px;color:#666}
.solution3-block{margin-bottom:20px;}
.solution3-block:hover .solution3-t img{transform:scale(1.1,1.1);-webkit-transform:scale(1.1,1.1);-moz-transform:scale(1.1,1.1)}
@media (max-width:1024px){.solution3-block:hover .solution3-t img{transform:scale(1,1);-webkit-transform:scale(1,1);-moz-transform:scale(1,1)}
    .solution3-block:active .active-dask{display:block}
    .solution3 .container{margin-bottom:0}
}
@media (max-width:768px){.solution3-b,.solution3-t{width:100%}
    .solution3-t img{max-width:100%}
    .solution3-b{padding-left:0}
    .solution3 .col4{ width: 50%; }
    .solution3 .col3{ width: 50%;}
}
@media (max-width:480px){.solution3-b h4{font-size:16px;line-height:24px;padding:10px 0 5px}
    .solution3-t i{left:10px;bottom:10px;font-size:24px}
    .solution3 .container{margin-bottom:-15px}
    .solution3-b p{font-size:12px}
}
/*E-= solution3*/


@media(max-width: 1600px){
    .map2 iframe{ height: 260px; }
}
@media(max-width: 1240px){
    .map2 iframe{ height: 200px; }
}

/*S-=solution1 1个视频*/
.col-lg-4{ width: 33.3333%; float: left; }
.col-lg-8{ width: 66.6667%;  float: left;}
.solution1{position:relative;overflow:hidden;}
.solution1-block{position:relative;display:block;}
.solution1-position{position:absolute;top:0;left:0;z-index:0;width:100%;}
.solution1 .h2-title{position:relative;color:#fff;}
.solution1-l-con{position:relative;display:block;overflow:hidden;}
.solution1-l img{display:block;width:100%;max-width:460px;transition:1s transform;-webkit-transform:scale(1,1);-moz-transform:scale(1,1);transform:scale(1,1);}
.solution1-l i{position:absolute;bottom:20px;left:20px;color:#fff;font-size:44px;}
.solution1-r{padding-left:30px;}
.solution1-r h4{padding:20px 0 25px;color:#fff;font-weight:400;font-size:24px;line-height:26px;}
.solution1-r p{padding-bottom:30px;color:#fff;font-size:18px;line-height:1.6;}
.solution1-r a{display:inline-block;margin-top:15px;padding:9px 32px;border-radius:2px;background:#fff;color:#2196f3;font-size:14px;line-height:22px;}
.solution1-r a:hover{background:#2196f3;color:#fff;}
.solution1-block .solution1-l:hover img{-webkit-transform:scale(1.1,1.1);-moz-transform:scale(1.1,1.1);transform:scale(1.1,1.1);}
@media (max-width:1024px){
    .solution1-r{padding-left:10px;}
    .solution1-r a:hover{background:#fff;color:#2196f3;}
    .solution1-r a:active{background:#2196f3;color:#fff;-webkit-transition:0s;transition:0s;}
    .solution1-block .solution1-l:hover img{-webkit-transform:scale(1,1);-moz-transform:scale(1,1);transform:scale(1,1);}
    .solution1-block .solution1-l:active .active-dask{display:block;}
}
@media (max-width:768px){
    .solution1-l,.solution1-r{width:100%;}
    .solution1-r p{ padding-top: 30px; padding-bottom: 20px; }
}
@media (max-width:480px){.solution1-r h4{padding:15px 0 5px;color:#fff;font-weight:400;font-size:20px;line-height:26px;}
    .solution1-l i{bottom:10px;left:10px;font-size:24px;}
    .solution1-r a{margin-top:5px;padding:4px 16px;font-size:14px;line-height:22px;}
    .solution1-r p{font-size:12px;}
    .solution1-r a{margin-bottom:5px;}
}
/*E-=solution1 1个视频*/

