@charset "utf-8";
@media screen and (min-width:960px){
.ab-ban{ display:block; background:url(../images/about.jpg) center no-repeat;}
.ab-bancon{ height:605px; }
}
@media screen and (max-width:960px){
.ab-ban{ display:block; background:url(../images/mv2.png) center no-repeat;}
.ab-bancon{ height:520px; }
}

.ab-bancon{width:100%; position:relative;}
.ab-bancon img{ display:block; margin:0 auto; max-width:80%;}
.ab-bancon p{ padding-bottom:30px; margin-bottom:30px; position:relative;}
.ab-bancon p:before{ width:30%; height:1px; background:#fff; content:""; position:absolute; left:50%; bottom:0; transform: translateX(-50%);}
.ab-bancon ul{ width:100%; max-width:580px; position:absolute; top:50%; left:0; transform: translateY(-50%);}
.ab-bancon li{ margin:0 10px 10px 10px; text-align:center;}
.ab-bancon li a{ display:block; border:1px #fff solid; border-radius:15px; color:#fff;}
@media screen and (min-width:760px){
.ab-bancon li{ float:left; width: calc(33.33% - 20px);}
.ab-bancon li a{ line-height:75px; font-size:16px;}
}
@media screen and (max-width:760px){
.ab-bancon li a{ line-height:55px; font-size:16px; display:block; max-width:60%;}
}

.info-story{ padding:3% 0;}
.info-story em{ display:block; text-align:center; font-size:36px; font-weight:700; line-height:100px;}
.info-story img{ width:100%; border-radius:10px;}
@media screen and (min-width:560px){
.info-story{ font-size:16px; line-height:27px;}
.info-story img{ float:right; max-width:480px; margin:0 0 25px 30px;}
}
@media screen and (max-width:560px){
.info-story{ font-size:14px; line-height:23px;}
.info-story img{ display:block; margin-bottom:20px;}
}

.info-story ul{ margin-top:10px;}
.info-story li{ margin-bottom:20px; float:left; color:#fff;}
@media screen and (min-width:960px){
.info-story li{ width: calc(50% - 10px); margin-right:20px;}
.info-story li:nth-child(2n){ margin-right:0;}
.info-story li span{ margin:70px 20px 0;}
.info-story li i{ font-size:36px; line-height:55px; margin:5px 20px;}
.info-story li p{ margin:0 20px; font-size:15px; line-height:25px;}
}
@media screen and (max-width:960px){
.info-story li span{ margin:10px 15px 0;}
.info-story li i{ font-size:24px; line-height:35px; margin:5px 15px;}
.info-story li p{ margin:0 15px; font-size:13px; line-height:22px;}
}
.info-story li img{ float:right; max-width:50%;}
.info-story li.bg1{ background:#00a0ff;}
.info-story li.bg2{ background:#3d9be9;}
.info-story li.bg3{ background:#0057e1;}
.info-story li.bg4{ background:#003a96;}
.info-story li span{ display:block; font-style:italic; font-size:16px;}
.info-story li i{ font-weight:700; display:block; position:relative;}
.info-story li i:before{ width:30%; height:1px; background:#fff; content:""; position:absolute; left:0; bottom:0;}

@media screen and (min-width:960px){
.info-value{ background:url(../images/infobg.jpg) #00a0ff center bottom no-repeat; padding:6% 0 12%;}
.info-value em{ font-size:36px; line-height:85px;}
.info-value p{ font-size:16px; line-height:27px;}
}
@media screen and (max-width:960px){
.info-value{ background:url(../images/infobgs.jpg) #00a0ff center bottom no-repeat; background-size:100%; padding:6% 0 40%;}
.info-value em{ font-size:24px; line-height:45px;}
.info-value p{ font-size:14px; line-height:23px;}
}
.info-value{ text-align:right; color:#fff;}
.info-value em{ font-weight:700; display:block; position:relative; margin-bottom:20px;}
.info-value em:before{ width:30%; max-width:140px; height:1px; background:#fff; content:""; position:absolute; right:0; bottom:0;}
.info-value p{ max-width:590px; margin-bottom:20px; float:right;}

.info-mission{ padding:2% 0; color:#111;}
.info-mission em{ font-size:36px; font-weight:700; line-height:85px; display:block; position:relative; margin-bottom:20px;}
.info-mission em:before{ width:30%; max-width:140px; height:1px; background:#111; content:""; position:absolute; left:0; bottom:0;}
.info-mission li{box-sizing: border-box; padding:20px 25px; color:#fff; border-top-left-radius:30px; border-bottom-right-radius:30px;}
.info-mission li i{ font-weight:700;}
@media screen and (min-width:760px){
.info-mission li{ width: calc(50% - 10px); margin-right:20px; float:left; margin-bottom:20px;}
.info-mission li:nth-child(2n){ margin-right:0;}
.info-mission li i{ font-size:19px; line-height:42px;}
.info-mission li .whycon{ font-size:15px; line-height:24px; height:48px; overflow:hidden;}
}
@media screen and (max-width:760px){
.info-mission li{ margin-bottom:15px;}
.info-mission li i{ font-size:16px; line-height:35px;}
.info-mission li .whycon{ font-size:13px; line-height:21px;}
}
.info-mission li:nth-child(1){ background:#00a0ff; }
.info-mission li:nth-child(2){ background:#008deb; }
.info-mission li:nth-child(3){ background:#0070ce; }
.info-mission li:nth-child(4){ background:#005bb8; }
.info-mission li:nth-child(5){ background:#0045a1; }
.info-mission li:nth-child(6){ background:#003a96; }


.pro-title{ text-align:center; padding:3% 0;}
.pro-title em{ font-size:36px; font-weight:700;}
.pro-title p{ max-width:650px; margin:30px auto; font-size:16px; line-height:25px;}
@media screen and (max-width:960px){
.pro-title{ padding:30px;}
}
.pro-list{ display:block; margin-bottom:50px;}
@media screen and (min-width:1080px){
.pro-list li{ width: calc(33.33% - 20px); margin:20px 10px; float:left;}
}
@media screen and (max-width:1080px) and (min-width:760px){
.pro-list li{ width: calc(50% - 20px); margin:20px 10px; float:left;}
}
@media screen and (max-width:760px){
.pro-list li{ margin:10px;}
}
.pro-list li em{ display:block; font-size:16px; font-weight:700;}
.pro-list li span{ font-size:12px;}
.pro-list li p{ font-size:16px; line-height:25px; margin:10px 0; color:#666; height:75px; overflow:hidden;}
.pro-list li .pimg{ height:330px; overflow:hidden; position:relative;}
.pro-list li .pimg i{ width:280px; height:280px; position:absolute; top:30px; left:50%; transform: translateX(-50%); border-radius:50%; opacity:0; transition:.5s;}
.pro-list li .pimg i.bg1{ background:#cac895;}
.pro-list li .pimg i.bg2{ background:#7adee1;}
.pro-list li .pimg i.bg3{ background:#b4b6b6;}
.pro-list li .pimg i.bg4{ background:#9765eb;}
.pro-list li .pimg i.bg5{ background:#008600;}
.pro-list li .pimg i.bg6{ background:#48968b;}
.pro-list li .pimg i.bg7{ background:#bada55;}
.pro-list li .pimg i.bg8{ background:#001d4b;}
.pro-list li .pimg i.bg9{ background:#ffde5f;}
.pro-list li .pimg img { display: block; margin:0 auto; height:95%; transform: scale(1); transition: all 0.5s ease-out; position:relative; z-index:10;}
.pro-list li:hover .pimg img{ transform: scale(1.15); }
.pro-list li:hover .pimg i{ opacity:1;}

.case-list{ display:block; margin-bottom:50px;}
@media screen and (min-width:1080px){
.case-list li{ width: calc(33.33% - 20px); margin:20px 10px; float:left;}
}
@media screen and (max-width:1080px) and (min-width:760px){
.case-list li{ width: calc(50% - 20px); margin:20px 10px; float:left;}
}
@media screen and (max-width:760px){
.case-list li{ margin:10px;}
}
.case-list li em{ display:block; font-size:16px; font-weight:700; line-height:45px; text-align:center;}
.case-list li .pimg{ overflow:hidden; position:relative; border:1px #ddd solid; padding:10px;}
.case-list li .pimg img { display: block; margin:0 auto; width:100%; transform: scale(1); transition: all 0.5s ease-out; position:relative; z-index:10;}

.view-pro{ padding:6% 0;}
@media screen and (min-width:960px){
.view-pro-img{ float:left; width:50%;}
.view-pro-con{ float:right; width:45%;}
}
.view-pro-img img{ display:block; margin:0 auto; max-width:100%; max-height:100%; display:block;}
.view-pro .in-pro-con{ padding-top:50px;}
.view-pro-con{ color:#111; padding-top:35px;}
.view-pro-con em{ font-size:36px; display:block; line-height:60px;}
.view-pro-con div{ font-size:15px; line-height:22px; margin-top:30px;}
.view-pro-con p{ margin:10px 0;}
.view-pro-con p span{ width:66px; height:66px; float:left; background:#00a0ff; color:#fff; border-radius:50%; font-size:20px; font-family:Arial, Helvetica, sans-serif; font-weight:700; display:inline-block;}
.view-pro-con p span b{ width:60px; height:60px; line-height:58px; text-align:center; border-radius:50%; border:2px #fff solid; margin:3px; display:block; box-sizing: border-box;}
.view-pro-con p img{ position:relative; height:66px; float:left;}
.view-pro-con p i{ background:#80d0ff; display:inline-block; height:66px; margin:0 10px; width:2px; float:left;}
.view-pro a{ background:#e89c48; color:#fff; border:1px #e89c48 solid;}
.view-pro a:hover{ border:1px #333 solid; color:#333; background:#fff;}

.view-body{ padding:4% 0; color:#fff; line-height:28px; font-size:16px;}
.bodybgg01{ background:url(../images/bgg01.jpg) center no-repeat; background-attachment:fixed;}
.bodybgg02{ background:url(../images/bgg02.jpg) center no-repeat; background-attachment:fixed;}
@media screen and (min-width:960px){
.view-bodyv{ width:40%; float:left;}
.view-bodys{ width: calc(60% - 40px); float:right;}
}
@media screen and (max-width:960px){
}

.view-bodys h2{ line-height:25px; display:block; position:relative; padding-bottom:20px; margin-bottom:25px;}
.view-bodys h2:before{ content:""; width:60px; height:3px; background:#fff; position:absolute; left:0; bottom:0;}
.view-bodys table{ border-left:1px #fff solid; border-top:1px #fff solid; margin-top:25px;}
.view-bodys table tr td{ border-right:1px #fff solid; border-bottom:1px #fff solid; padding:0 15px; box-sizing: border-box;}
.view-body li{ margin:10px; background-color:rgba(20,170,0,0.6); box-sizing: border-box; padding:25px 15px;}
@media screen and (min-width:640px){
.view-body li{ width: calc(20% - 20px); float:left;}
}
.view-body li img{ display:block; margin:0 auto 15px; max-width:80%;}
.view-body li p{ font-size:16px; line-height:20px; min-height:160px; overflow:hidden; color:#fff; position:relative; padding-top:20px;}
.view-body li p:before{ width:70%; height:1px; background:#fff; content:""; position:absolute; left:50%; top:0; transform: translateX(-50%);}

.view-use{ background:#2f2e2e; padding:4% 0; color:#fff;}
.view-use em{ display:block; font-size:36px; display:block; line-height:60px; text-align:center; font-weight:700; margin-bottom:20px;}
.view-use li{ margin:20px 10px; box-sizing: border-box;}
@media screen and (min-width:640px){
.view-use li{ width: calc(33.33% - 20px); float:left;}
}
.view-use li img{ display:block; margin:0 auto 5px; max-width:80%;}
.view-use li i{ font-size:21px; font-weight:700;}
.view-use li .usep{ font-size:16px; line-height:20px; height:60px; overflow:hidden; position:relative; padding-top:10px;}

.view-more{ background:#fff; padding:4% 0;}
.view-more em{ display:block; font-size:36px; display:block; line-height:60px; text-align:center;}
.mySwiperm{ overflow:hidden; position:relative; margin-top:25px;}

.swiper-button-next, .swiper-button-prev{ color:#fff !important; text-shadow:0px 0px 10px #333;}

.ly-list{ padding:3% 0;}
@media screen and (min-width:760px){
.ly-list-img{ float:right; width:55%;}
.ly-list-con{ float:left; width:45%;}
}
.ly-list-img img{ width:100%; max-width:600%;}
.ly-list-con p{ font-size:20px; font-weight:700; line-height:30px; margin-bottom:20px;}
.ly-list-con li{ margin-bottom:8px;}
.ly-list-con li span{ display:block; line-height:22px; color:#005ddf; padding-left:10px;}
.mytxt1{ width:100%; height:55px; border:1px #005ddf solid; border-radius:8px; padding:0 10px; box-sizing: border-box; box-shadow:0px 0px 6px #999;}
.mytxts1{ width:100%; height:180px; border:1px #005ddf solid; border-radius:8px; padding:10px; box-sizing: border-box; box-shadow:0px 0px 6px #999;}
.mysub1{ background:#00a0ff; color:#fff; width:150px; height:50px; border-radius:8px; border:0; display:block; margin:20px auto; box-shadow:0px 0px 6px #999; font-size:16px; font-weight:700;}
.mysub1:hover{ background:#18509e;}

.mySwiper { width:100%; box-sizing: border-box; padding: 10px 0; }
.mySwiper .swiper-slide {  width: 25%; height: 100%; border:1px #aaa solid;}
.mySwiper .swiper-slide-thumb-active { border:1px #00a0ff solid; }

.mySwiperm li{ display:block; border:1px #ddd solid; padding:10px; box-sizing: border-box;}

.Homexz_tit{ text-align:center; height:auto;}
.Homexz_tit span{ font-size:15px; font-family:"Arial"; float:left; padding:0 15px; margin-right:10px; height:45px; line-height:45px; cursor: pointer; background-color:rgba(255,255,255,0.85); color:#000;}
.Homexz_tit span{ border-radius:5px; margin-bottom:15px;}
.Homexz_tit span.hover { height:45px; background:#00a0ff; cursor: hand; color:#fff;}
.Homexz_con { ZOOM: 1; color:#fff; padding-top:10px; line-height:25px;}

.bofang{cursor: pointer;}
.vidbox { width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: 9999; display: none; background-color:rgba(0,0,0,0.3); }
.laypop { display: none; background:#fff; box-shadow:0px 0px 8px #888; }
@media screen and (min-width:960px){
.laypop{ width: 60%; height:70%; position:absolute; left:20%; top:50%; transform: translateY(-50%);}
}
@media screen and (max-width:960px){
.laypop{ width:90%; height:66%; margin:25% auto 0 auto;}
}
.laypop p { height: 45px; font-size: 16px; color: #333; line-height: 45px; text-align: left; padding: 0 20px; }
.laypop p i { float: right; font-style: normal; cursor: pointer; font-size: 16px; color: #333; }
.laypop video { object-fit: fill; width:auto; height:85%; display:block; margin:0 auto; }