.page_ban{background: url(../images/page_ban.jpg);height: 21vw;background-size: cover;width: 94.8%;margin-left: 3.3%;}
.page_ban img.page-s{position: absolute;width: 3.75vw;right: 0;}

.ResTitle_a1{color: #007eb5;font-size: 2vw;padding-left: 4.4vw;background: url(../images/titcon.png) no-repeat left center;white-space: nowrap;
display: inline-block;background-size: auto 2vw;line-height: 1.5;}
.ResTitle_a1 em{display: none;}
.title .sologan{float: right;font-size: 20px;color: #007eb5;padding-top: 16px;}
.title{margin-bottom: 2.6vw;}

.PosList_a1{box-sizing: border-box;color: #999999;width: 100%;padding: 0 18.75%;text-align: left;font-size: 12px;color: #888888;font-size: 16px;
text-transform: uppercase;margin: 2.6vw auto 3.5vw auto;}
.PosList_a1 b{font-weight: normal;}
.PosList_a1 span{background: url(../images/loc.png) left center no-repeat;padding-left: 20px;}

.NavList_a1,.ClassList_b3{text-align: left;background: #dbf6ff;box-sizing: border-box;padding: 1.4vw 6.8%;width: 94.8%;margin-left: 3.3%;}
.NavList_a1 li,.ClassList_b3 li{display: block;float: left;margin-right: 1.5%;width: auto;}
.NavList_a1 li a,.ClassList_b3 li a{line-height: 1.5;font-size: 20px;color: #007eb5;background: #fff; display: block;padding: 0.7vw 1.5vw;position: relative;z-index: 3;}
.NavList_a1 li a:before,.ClassList_b3 li a:before{content: "";display: block;height: 100%;width: 0;position: absolute;left: 0;bottom: 0;background: #007eb5;
    transition:.4s all ease;-ms-transition:.4s all ease;-webkit-transition:.4s all ease;z-index: -1;}
.NavList_a1 li .on,.ClassList_b3 .on a{background: #007eb5;color: #fff;}

.content{width: 78%;margin: 6.9vw auto 0 auto;font-size: 16px;color: #000000;line-height: 1.8;text-align: justify;}
.content img{max-width: 100%;}
.about{color: #666;}
.about .mb{margin-bottom: 1.5vw;}
/*.content p:has(+ img){color:red;text-indent: 0;}*/
.about h3{font-size: 28px;color: #007eb5;}
.about .icon-about li{display: block;float: left;}
.about .top .fl{width: 30.1%;}
.about .top .fl strong{font-size: 5.2vw;color: #ddeefb;text-align: right;display: block;line-height: 1.3;}
.about .top .fr{width: 65%;}
.about p{text-indent: 2em;}
.about .top .fr p img{display: block;width: auto;height: auto !important;max-width: 100%;}
.about .mid{margin: 2.86vw auto;padding: 1.5vw 7%;box-sizing: border-box;
    background: -webkit-linear-gradient(#dbf6ff , #fff 80%);background: -ms-linear-gradient(#dbf6ff , #fff 80%);background: linear-gradient(#dbf6ff , #fff 80%);}
.about .mid .fl{padding-top: 1.5vw;}
.about .mid .fr{width: 84.6%;}
.about .mid li{width: 6.18%;float: left;display: block;margin-right: 7.2%;}
.about .mid li img{display: block;width: 100%;margin-bottom: 16px;}
.about .mid li p{line-height: 1.0;font-size: 20px;color: #666666;text-align: center;text-indent: 0;}
.about .mid li:nth-last-child(1){margin-right: 0;}
.about .bottom .fl{width: 31.5%;padding-left: 1vw;padding-top: 5px;}
.about .bottom .fr{width: 63.9%;}

.sales .bottom{position: relative;}
.sales .top{margin-top: 2vw;position: relative;}
.sales .img{width: 50%;}
.sales .img img{display: block;width: 100%;}
.sales .txt{width: 43%;margin-left: 2.59%;padding-top: 10.4vw;overflow: hidden;position: absolute;height: 100%;left: 0;    box-sizing: border-box;}
.sales .bottom .txt{right: 0;left: auto;}
.sales .txt .strong{font-family: Arial;font-size: 13.38vw;color: #c6e0ed;line-height: 0.8;position: absolute;right: 4%;bottom: -1.5vw;font-weight: bold;}
.sales .top .txt b{bottom: -2.5vw;}
.sales .topbox{padding: 1em;background: #dbf6ff;color: #333;}

.join-flow {font-size: 0;}
.join-flow li{vertical-align: top;width: 46.4%;display: inline-block; margin: 0 1.8% 2.6vw 1.8%;background: url(../images/flowbg.png) right bottom no-repeat;background-size: auto 5.2vw;
padding: 1.4vw 0 1.4vw 2.6vw ;position: relative;box-sizing: border-box;color: #007eb5;font-size: 1.2vw;}
.join-flow li p strong{position: absolute;left: 0;color: #e7f9ff;font-size: 7vw;font-weight: bold;top: 0;line-height: 0.7;z-index: -1;font-family: Arial;}

.join-ys p{text-indent: 2em;}
.join-ys .imgbox{margin-top: 20px;margin-bottom: 3.85vw;}
.join-ys .top,.join-ys .bottom{min-height: 14vw;}
.join-ys .fl,.join-ys .fr{width: 47.5%;margin: 0 5% 0 0;}
.join-ys .fr{margin-right: 0;}
.join-ys .word-list{margin: 3vw auto;}
.join-ys .word-list li{width: 12.7%;margin: 0 4.13% 0 0;display: block;float: left;color: #007eb5;font-size: 20px;padding: 1vw 0;text-align: center;background: #dbf6ff;
box-sizing:border-box;background: -webkit-linear-gradient(#fff, #dbf6ff);
    background: -ms-linear-gradient (#fff, #dbf6ff);background: linear-gradient (#fff, #dbf6ff);}
.join-ys .word-list li p{text-indent: 0;line-height: 1.5;}
.join-ys .word-list li:nth-child(6){margin-right: 0;}
.join-ys h2{font-size: 28px;color: #007eb5;}
.join-ys .jimg{position: relative;}
.join-ys .jimg:after{background: url(../images/jbg.png) left center no-repeat;background-size: auto 100%;content: "";display: block;width: 100%;height: 100%;
position: absolute;left: 0;top: 0;z-index: 2;transition:.8s all ease;-ms-transition:.8s all ease;-webkit-transition:.8s all ease;}
.join-ys .jimg img{display: block;width: 100%;}
.join-ys .fl h2,.join-ys .fr h2{display: block;margin-bottom: 1.5vw;}

.page{text-align: center;padding-top: 40px;}
.page a,.page span{display: inline-block;padding: 5px 10px;border: 1px solid #cccccc;margin: 5px;color: #999999;line-height: 1.5;border-radius: 3px;}
.page .on, .page .cur{border-color: #007eb5;color: #fff;background: #007eb5;}
.pageinfo{display: none;}
.content .page{display: block;}
.content #load_more_button{display: none;width: 140px;margin: 20px auto 0 auto;padding: 11px 25px;
    text-align: center;border: 1px solid #007eb5;color: #007eb5;}

.contact{width: 100%;}
.contact .title{width: 78%;margin: 0 auto 3.6vw auto;}
.contact .top{padding: 36px 9.9%;box-sizing:border-box;background: -webkit-linear-gradient(to right, #dbf6ff 60%, #fff);
    background: -ms-linear-gradient(to right, #dbf6ff 60%, #fff);
    background: linear-gradient(to right, #dbf6ff 60%, #fff);}
.contact .bottom{height: 25.4vw;}
.contact h3{color: #007eb5;font-size: 24px;}
.contact .fl{padding-top: 2.6vw;padding-left: 10px;width: 510px;}
.contact .fr{width: calc(100% - 546px);border-radius: 8px;background: #fff;color: #333333;padding: 1.5vw 2.6vw;box-sizing:border-box;box-shadow: 9px 9px 20px 2px rgba(146, 165, 173, 0.2);}
.contact .fr ul{margin-top: 0.8vw;}
.contact .fr ul li{float: left;width: 50%;display: block;margin-bottom: 0.7vw;padding-left: 24px;box-sizing:border-box;line-height: 1.5;
background: url(../images/ci1.png) no-repeat center left;}
.contact .fr ul li:nth-of-type(2){background-image: url(../images/ci2.png);}
.contact .fr ul li:nth-of-type(3){width: 100%;background-image: url(../images/ci3.png);}
.contact .fr ul li img{float: left;display: inline-block;}
.contact .top h6{font-size: 20px;color: #007eb5;}
.map-btn{display: none;padding: 3.2vw;width: 40vw;margin: 6vw auto 0 auto;text-align: center;background-color: #007eb5;color: #fff;line-height: 1.0;border-radius: 5px;}

.detail {width: 100%;padding: 0 9.3%;box-sizing:border-box;/*background: url(../images/pbg.jpg) no-repeat;*/background-position: left  22.6vw;background-size: 100% auto;}
.detail .pimg {margin: 0 auto 3.8vw auto;width: 60%;text-align: center;}
.detail .pimg img{width: auto;display: inline-block;height: auto;max-height: 100%;max-width: 100%;box-shadow: 9px 9px 20px 2px rgba(13,162,225,0.2);border-radius: 5px;}
.detail .tit{font-size: 2vw;color: #007eb5;display: inline-block;}
.detail .til1{font-size: 22px;padding-left: 2vw;padding: 17px 1.5vw;color: #fff;line-height: 1.5;margin-top: 2vw;
background: -webkit-linear-gradient(to right,#438cc5 , #1869a3);background: -ms-linear-gradient(to right,#438cc5 , #1869a3);background: linear-gradient(to right,#438cc5 , #1869a3);}
.con{padding: 2.6vw;width: 100%;box-sizing:border-box;color: #000000;}

.detail table{width: 100%;line-height: 1.5;border-collapse: collapse;
    border: 1px solid #cccccc;}
.detail table tr:nth-child(1) {background: #e5e5e5;font-weight: bold;}
.detail table td{border: 1px solid #cccccc;padding: 10px;}

/*case-detail,pro-detail*/
.case-detail {border-radius: 6px; box-sizing: border-box;}
.case-detail .T { font-size: 0; }
.case-detail .T>.L, .pro-detail .T>.L .T { width: 53%;  box-sizing: border-box; text-align: center; }
.pro-detail .T>.L .T { width: 100%; overflow: hidden; }
.case-detail .T>.R { width: 43%; margin-left: 4%; }
.case-detail .T>div { display: inline-block; vertical-align: top; }
.case-detail .T h3 { text-align: left; margin-top: 1.3vw; font-size: 16px; color: #333; font-weight: normal; }
.case-detail .T h3:first-child{font-size: 20px;color: #007eb5;}
.case-detail .T li:first-child, .case-detail .T>.R>ul li:first-child, .pro-detail .T>.L>ul li:first-child { margin-top: 0; margin-left: 0; }
.case-detail .T>.R>ul, .pro-detail .T>.L>ul { text-align: left; border-top: 1px solid #e6e6e6; padding: 5.5% 0; border-bottom: 1px solid #e6e6e6; margin-top: 4%; }
.pro-detail .T>.L>ul { padding: 0; }
.case-detail .T>.R>ul li, .pro-detail .T>.L>ul li { margin-top: 2%; font-size: 0.9vw; color: #666; line-height: 1.6; }
.pro-detail .T>.L>ul li { font-size: 0; width: 40%; display: inline-block; vertical-align: top; margin-top: 0; }
.pro-detail .T>.L>ul li>* { display: inline-block; vertical-align: middle; font-size: 0.9vw; }
.case-detail .T>.R>a { display: block; margin: 8% 0 0; }
.case-detail .T>.R>a:hover { color: #fff; }
.case-detail .B { margin-top: 6.5%; overflow: hidden; }
.detail-title { padding: 15px 0 15px 50px; background: #c31c2f; font-size: 0; }
.detail-title i { display: inline-block; width: 37px; vertical-align: middle; }
.detail-title span { font-size: 26px; display: inline-block; vertical-align: middle; color: #fff; margin-left: 20px; }
.img-box { position: relative; max-width: 100%; max-height: 100%;height: 26.5vw;background-color: #edfbff;box-sizing: border-box;border-radius: 4px;}
.img-box img{ position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);max-width: 80%; max-height: 90%;background-color: #edfbff;border-radius: 4px;}
.pro-detail .T>.L .T>div { vertical-align: middle; width: 100%; max-height: 100%; }
.pro-choose dd { overflow: hidden; }
.pro-choose .ddL { font-size: 0.84vw; color: #666; margin-top: 0.4vw; text-transform: capitalize; }
.pro-choose .ddR { font-size: 0.72vw; color: #999; box-sizing: border-box; padding: 0.5vw 0.7vw; border: 1px solid #e6e6e6; border-radius: 0.86vw; }
.pro-choose:nth-of-type(1) { border: none; padding-top: 0; }
.pro-choose { padding-top: 1.5%; border-top: 1px solid #e6e6e6;}
.pro-choose dt{border: 1px solid #ccc;box-sizing: border-box;}
.pro-choose dt, .pro-choose li{ margin-top: 1.5%; display: inline-block; vertical-align: top;  margin-bottom: 0; float: none; }
.pro-choose dt:hover{border-color: #4089c2;}
.pro-choose dt:hover p{color: #4089c2;}
.pro-choose dt{position: relative;}
.pro-choose dt a{display: block;position: relative;}

#wind dt{width: 22.5%;margin-right: 3.3%;border-radius: 4px;overflow: hidden;}
#wind dt a{display: block;height: 2.6vw;}
#wind dt:nth-of-type(4n){margin-right: 0;}
#wind dt p{font-size: 14px;display: block;text-align: center;line-height: 1.8;}
#wind dt img{height: 100%;width: 100%;object-fit:cover;display: block;}
#glass li{height: 5.5vw;background-color: #fff;position: relative;border-radius: 5px;box-sizing: border-box;border: 1px solid #e6e6e6;margin-right: 1.5%; width: 18.5%;margin-top: 2%;}
#glass li img{position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);max-width: 95%;max-height: 95%;}
#glass li:nth-of-type(5n){margin-right: 0;}

#wind.pro-choose dt:after, #glass.pro-choose a:after { border-radius: 4px; transition: 0.3s ease 0s; width: 100%; border: 2px solid transparent; height: 100%; position: absolute; top: 0; left: 0; content: ''; box-sizing: border-box; z-index: 1; }
#wind.pro-choose dt:hover, #glass.pro-choose a:hover { atransition-timing-function: cubic-bezier(0.6, 4, 0.3, 0.8); animation: beat 0.5s 1; }
#wind.pro-choose dt:hover:after, #glass.pro-choose li:hover a:after{border-color: #4089c2;}

.caseback{position: relative; font-size: 16px;color: #fff;display: block;width: 8em;padding: 12px 30px 12px 15px;margin: 3vw auto 0 auto ;border: 1px solid #4089c2;text-align: right;background: #4089c2;}
.caseback:after {content: "";width: 8px;height: 8px;display: block;position: absolute;left: 15px;top: 50%;border-right: 1px solid #fff;border-bottom: 1px solid #fff;-webkit-transform: rotate(135deg);-ms-transform: rotate(135deg);transform: rotate(135deg);top: calc(50% - 4px);}
@media screen and (min-width: 1024px) {
    .NavList_a1 li a:hover:before,.ClassList_b3 li:hover a:before{width: 100%;}
    .NavList_a1 li:hover,.ClassList_b3 li:hover a:before{color: #fff;}
    .NavList_a1 li:hover a,.ClassList_b3 li:hover a{color: #fff;}
    .culture li:hover{background: #fecb09;}

    .join-ys .jimg:hover:after{width: 0;}
}
@media screen and (max-width: 1450px) {
    .content{width: 86%;}
    .contact,.contact .top,.detail{width: 100%;}
    .detail{padding: 0 7%;}
    .contact .top{padding: 36px 7%;}
    .contact .title{width: 86%;}
    .NavList_a1 li a{font-size: 18px;}
    .NavList_a1{padding: 1.4vw 3.8vw;}
}
@media screen and (max-width: 1260px) {
    .about .mid .fr{width: 78%;}
    .contact .fr{width: 550px;}
    .contact .fl{width: calc(100% - 580px);}
    .contact h3{font-size: 2vw;}

    .join-ys h2{font-size: 1.6vw;}
    .join-ys .word-list li p{font-size: 1.3vw;}

    .about .mid li p{font-size: 16px;}
}
@media screen and (max-width: 1024px) {
    .page_ban{height: 23vw;width: 100%;margin-left: 0;}
    .page_ban img.page-s{display: none;}
    .ResTitle_a1{font-size: 3vw;background-size: 5vw;padding-left: 7vw;}
    .title .sologan{padding-top: 0;}
    .content{width: 94%;height: auto;margin-top: 30px;min-height: 650px;}
    .detail .tit{font-size: 3vw;}
    .detail{width: 100%;padding: 0 3%;}
    .detail .pimg{width: 50%;}
    .NavList_a1{padding: 2vw 2%;}
    .NavList_a1, .ClassList_b3{width: 100%;margin-left: 0;}

    .contact .title{width: 100%;}
    .contact .top{padding: 36px 3%;}
    .contact .fr{float: none;width: 100%;}
    .contact .fl{float: none;width: 100%;margin-bottom: 3vw;box-sizing: border-box;}
    .contact h3{font-size: 3vw;}
    .contact .bottom{height: 40vw !important;}

    .about h3{font-size: 2.6vw;}
    .about .mid li img{width: 60%;margin: 0 auto 10px auto;}
    .about .mid li{width: 20%;margin: 0 2.5% 3vw 2.5%; }
    .about .mid li p{font-size: 16px;}
    .about .bottom .fl{padding: 0;width: 46%;}
    .about .bottom .fr{width: 49%;}

    .join-ys h2{font-size: 3vw;}
    .join-ys .word-list {margin: 4vw auto 5vw auto;}
    .join-ys .word-list li{width: 31.3%;margin-right: 3.05%;margin-bottom: 15px;}
    .join-ys .word-list li:nth-child(3n){margin-right: 0;}
    .join-ys .word-list li p{font-size: 18px;}

    .join-flow li{font-size: 18px;}

    .img-box{height: 39vw;}
    .case-detail .T h3{margin-top: 0;}
    .case-detail .T>.L, .pro-detail .T>.L .T{width: 45%;}
    .case-detail .T>.R{width: 50%;}
    #wind{margin-bottom: 6vw;}
    .pro-choose dt, .pro-choose li{margin-top: 3.5%;}
    .pro-choose .ddL{font-size: 16px;}
    #wind dt,#wind dt:nth-of-type(4n){width: 31.3%;margin-right: 3.05%;}
    #wind dt:nth-of-type(3n){margin-right: 0;}
    #wind dt a{height: 3.6vw;}
    #glass li,#glass li:nth-of-type(5n){width: 31.3%;margin-right: 3.05%;}
    #glass li:nth-of-type(3n){margin-right: 0;}
}
@media screen and (max-width: 768px){
    .about .top .fl{display: none;}
    .about .top .fr{float: none;width: 100%;}
}
@media screen and (max-width: 640px){
    .page_ban img.page-s{display: none;}
    .page_ban {width: 100%;margin-left: 0;height: 30vw;}
    .content{min-height: 200px;margin: 8vw auto 12vw auto;font-size: 3.8vw;}
    .content #load_more_button{padding: 2vw 0;width: 50%;line-height: 1.5;font-size: 4.2vw;display: block;}
    .content .page{display: none !important;}

    .title{margin-bottom: 6vw;}
    .title .sologan{float: none;text-align: right;font-size: 4.5vw;padding-top: 1vw;}
    .ResTitle_a1{font-size: 5.8vw;background-size: auto 5vw;padding-left: 12vw;}

    .NavList_a1,.ClassList_b3{padding: 1.5vw 1.5%;}
    .NavList_a1 li,.ClassList_b3 li{margin: 0 1.5% 0 0;width: auto;}
    .NavList_a1 li a,.ClassList_b3 li a{text-align: center;font-size: 3.8vw;line-height: 1.6;padding: 1vw 3vw;}

    .about h3{font-size: 4.5vw;}
    .about .fl,.about .fr{float: none;width: 100%;}
    .about .bottom .fl,.about .bottom .fr{width: 100%;}
    .about .mid{padding: 3vw 0;margin: 5vw auto;}
    .about .mid .fl{text-align: center;margin-bottom: 4vw;}
    .about .mid .fr{width: 100%;text-align: center;}
    .about .mid li{float: none;display: inline-block;width: 22%;margin: 0 0 4% 0;}
    .about .mid li img{margin: 0 auto 1.5vw auto;width: 70%;}
    .about .mid li p{font-size: 3.8vw;}

    .sales .txt{padding-top: 2vw;margin-left: 2vw;}
    .sales .txt .strong{bottom: 0;}

    .detail .title{margin-bottom: 2vw;}
    .detail .tit{font-size: 5vw;}
    .detail .pimg{width: 100%;}
    .detail .til1{font-size: 18px;padding: 10px 3.5vw;line-height: 1.5;}
    .detail .sologan{display: none;}

    .contact h3{font-size: 4.2vw;}
    .contact .top h6{font-size: 4vw;}
    .contact .top {padding: 6vw 3% 11vw 3%;}
    .contact .fl{margin-bottom: 6vw;padding: 0 2.6vw;}
    .contact .fr ul li{float: none;width: 100%;margin-bottom: 3vw;background-size: 1em auto;padding-left: 1.6em;}
    .contact .bottom{display: none;}
    .map-btn{display: block;}

    .join-ys h2{font-size: 4.5vw;}
    .join-ys .word-list li p{font-size: 4.2vw;}
    .join-ys .word-list li {padding: 3vw 0;margin-bottom: 3vw;}
    .join-ys .fl, .join-ys .fr{width: 100%;margin-right: 0;min-height: 0;margin-bottom: 3vw;}
    .join-ys .jimg:after{display: none;}
    .join-ys .imgbox{margin-top: 0;}

    .join-flow li{width: 100%;font-size: 4.2vw;background-size: auto 12.4vw;margin: 0 auto 3vw auto;padding: 3.4vw 0 3.4vw 8vw;}
    .join-flow li p strong{font-size: 19vw;}

    .case-detail .T>.L, .pro-detail .T>.L .T{width: 100%;}
    .img-box{height: 55vw;}
    .case-detail .T>.R{width: 100%;margin-left: 0;margin-top: 3vw;}
    #wind dt a{height: 10vw;}
    #glass li{height: 27vw;}

    .caseback{font-size: 3.8vw;}
}