@charset "utf-8";

.aArea { height: 694px; background: url("../jpg/brand.webp") no-repeat center top; }
.range { padding: 97px 0 0; }
.range .hd { position: relative; margin-bottom:50px;  text-align: center;  /*animation: 1s linear 0s normal none 1 running bounceIn;*/ }
.range .hd:before { position: absolute; content: ""; top:-38px; left: 0; width: 100%; height:150px;  background: url("../png/tit_line_1.webp") no-repeat center top; }


.range .hd h2 { font-weight: normal; color: #1670af; font-size: 26px; text-transform: uppercase; }
.range .hd .tit { padding-top: 10px; }
.range .hd em { padding: 2px 34px; border: 1px solid #9c9b99; font-size: 19px; color: #414141; }
.range .bd { padding-top: 90px; }

.rangeul {}
.rangeul li { float: left; margin-right: 78px; text-align: center; }
.rangeul li .quan { width: 124px; height: 124px; margin-bottom: 40px; border-radius: 50%; border: 4px solid #b4b4b4; }
.rangeul li .name { height: 26px; font-size: 15px; }
.rangeul li .q1 { background: url("../png/b_icon_1.webp") no-repeat center; }
.rangeul li .q2 { background: url("../png/b_icon_2.webp") no-repeat center; }
.rangeul li .q3 { background: url("../png/b_icon_3.webp") no-repeat center; }
.rangeul li .q4 { background: url("../png/b_icon_4.webp") no-repeat center; }
.rangeul li .q5 { background: url("../png/b_icon_5.webp") no-repeat center; }
.rangeul li .q6 { background: url("../png/b_icon_6.webp") no-repeat center; }



.rangeul li:hover .q1 { background: url("../png/b_icon_01.webp") no-repeat center; }
.rangeul li:hover .q2 { background: url("../png/b_icon_02.webp") no-repeat center; }
.rangeul li:hover .q3 { background: url("../png/b_icon_03.webp") no-repeat center; }
.rangeul li:hover .q4 { background: url("../png/b_icon_04.webp") no-repeat center; }
.rangeul li:hover .q5 { background: url("../png/b_icon_05.webp") no-repeat center; }
.rangeul li:hover .q6 { background: url("../png/b_icon_06.webp") no-repeat center; }
.rangeul li:hover .name { font-weight: bold; color: #1e83c9; }
.rangeul li:hover .quan { -webkit-animation: circle 1s linear 1; animation: circle 1s linear 1; }
@-webkit-keyframes circle{
    0%{
        border-top:4px solid #1e83c9;
        -webkit-transform: rotate(45deg);
    }
    50%{
        border-top:4px solid #1e83c9;
        -webkit-transform: rotate(225deg);
    }
    100%{
        border-top:4px solid #1e83c9;
        -webkit-transform: rotate(360deg);
    }
}


.bArea { position: relative; height: 930px; background: url("../jpg/adv.webp") no-repeat center top; }
.advert { padding: 74px 0 0; }
.advert .hd { position: relative; margin-bottom:50px;  text-align: center;  /*animation: 1s linear 0s normal none 1 running bounceIn;*/  }
/*#bArea1{ position: relative; margin-bottom:50px;  text-align: center;  animation: 1s linear 0s normal none 1 running bounceIn;  }*/
.advert .hd:before { position: absolute; content: ""; top:-35px; left: 0; width: 100%; height:150px;  background: url("../png/tit_line_2.webp") no-repeat center top; }

.bArea .taika { position: absolute; left: 0; width: 100%; bottom: 130px; text-align: center; }
.bArea .taika .pic { padding-right: 35px;}

.advert .hd h2 { font-weight: normal; color: #1670af; font-size: 26px; text-transform: uppercase; }
.advert .hd .tit { padding-top: 10px; }
.advert .hd em { padding: 2px 34px; border: 1px solid #fff; font-size: 19px; color: #fff; }
.advert .bd { padding-top: 180px; }
.advert .advcon { width: 798px; margin: 0 auto; text-align: center;   }
.advert .advcon ul li { position: relative;  width: 60px; height: 60px; margin: 0 auto; }
.advert .advcon ul .li1 { margin: 25px 0 0 240px;  /*animation: 2s linear 0s normal none 1 running fadeInDownBig;*/ }
.advert .advcon ul .li2 { float: left; margin: 65px 0 0 85px; /*animation: 1.5s linear 0s normal none 1 running fadeInDownBig; */ }
.advert .advcon ul .li3 { float: right; margin: 65px 85px 0 0; /*animation: 3s linear 0s normal none 1 running fadeInDownBig;*/ }
.advert .advcon ul .li4 { float: left; margin: 140px 0 0 25px; clear: both; /*animation: 1s linear 0s normal none 1 running fadeInDownBig; */}
.advert .advcon ul .li5 { float: right; margin: 140px 16px 0 0; /*animation: 3.5s linear 0s normal none 1 running fadeInDownBig; */ }
.advert .advcon ul .adli1 { float: right; margin: -60px 240px 0 0; /* animation: 2.5s linear 0s normal none 1 running fadeInDownBig; */ }

.advert .advcon ul .adli1 .txt { position: absolute;  text-align: left; top: -73px; right: -160px; width: 165px;  color: #fff; font-size: 12px; }
.advert .advcon ul .adli1 .txt h2 { font-size: 23px; height: 40px; font-weight: normal; }

.advert .advcon ul .li4 .txt { position: absolute;  text-align: left; top: -10px; left: -166px; width: 135px; color: #fff; font-size: 12px;   }
.advert .advcon ul .li4 .txt h2 { font-size: 23px; height: 40px; font-weight: normal; }

.advert .advcon ul .li2 .txt { position: absolute;  text-align: left; top: -18px; left: -166px; width: 135px; color: #fff; font-size: 12px; }
.advert .advcon ul .li2 .txt h2 { font-size: 23px; height: 40px; font-weight: normal; }

.advert .advcon ul .li1 .txt { position: absolute;  text-align: center; top: -73px; left:-110px; /*width: 320px;*/ color: #fff; font-size: 12px; }
.advert .advcon ul .li1 .txt h2 { font-size: 23px; height: 30px; font-weight: normal; }

.advert .advcon ul .li3 .txt { position: absolute;  text-align: left; top: -18px; right: -196px; width: 145px; color: #fff; font-size: 12px; }
.advert .advcon ul .li3 .txt h2 { font-size: 23px; height: 40px; font-weight: normal; }

.advert .advcon ul .li5 .txt { position: absolute;  text-align: left; top: -18px; right: -196px; width: 165px; color: #fff; font-size: 12px; }
.advert .advcon ul .li5 .txt h2 { font-size: 23px; height: 40px; font-weight: normal; }

.cArea { height: 749px; background: url("../jpg/carea.webp") no-repeat center top; }
.major { padding-top: 90px; }
.major .hd { position: relative; margin-bottom:50px;  text-align: center;  /*animation: 1s linear 0s normal none 1 running bounceIn; */ }
.major .hd:before { position: absolute; content: ""; top:-35px; left: 0; width: 100%; height:150px;  background: url("../png/tit_line_1.webp") no-repeat center top; }


.major .hd h2 { font-weight: normal; color: #1670af; font-size: 26px; text-transform: uppercase; }
.major .hd .tit { padding-top: 10px; }
.major .hd em { padding: 2px 34px; border: 1px solid #9c9b99; font-size: 19px; color: #414141;}
.major .bd { padding-top: 90px; }
.major .majorcon { width: 890px; margin: 0 auto; padding-bottom: 85px; }
.major .majorcon .majorul {}
.major .majorcon .majorul li { position: relative; float: left; width: 150px; height: 150px; margin: 0 70px; border: 1px solid #b8bdbf;  }
.major .majorcon .majorul li:before { position: absolute; content: ""; width: 150px; height: 150px;  border: 1px solid #b8bdbf; transform:rotate(-45deg); pointer-events: none;   }
.major .majorcon .majorul li i {  width: 100%; height: 75px; text-align: center; display: block; }
.major .majorcon .majorul li .i1 { background: url("../png/m_icon_1.webp") no-repeat center bottom; }
.major .majorcon .majorul li .i2 { background: url("../png/m_icon_2.webp") no-repeat center bottom; }
.major .majorcon .majorul li .i3 { background: url("../png/m_icon_3.webp") no-repeat center bottom; }
.major .majorcon .majorul li a .name { color: #3a3a3a; font-size: 12px; text-align: center; height: 30px; line-height: 30px; }

.major .majorcon .majorul li:hover { border: 1px solid #88b5d4;}
.major .majorcon .majorul li:hover:before { border: 1px solid #88b5d4; animation: 1s linear 0s normal none 1 running rotateIn; }
.major .majorcon .majorul li:hover a .name { color: #217ab9; }
.major .majorcon .majorul li:hover .i1 { background: url("../png/m_icon_01.webp") no-repeat center bottom; animation: 1s linear 0s normal none 1 running zoomIn; }
.major .majorcon .majorul li:hover .i2 { background: url("../png/m_icon_02.webp") no-repeat center bottom; animation: 1s linear 0s normal none 1 running zoomIn; }
.major .majorcon .majorul li:hover .i3 { background: url("../png/m_icon_03.webp") no-repeat center bottom; animation: 1s linear 0s normal none 1 running zoomIn; }

.major .btn { width: 316px; height: 36px; margin: 0 auto; text-align: center; line-height: 36px; }
.major .btn a { display: block; height: 36px; font-size: 14px; color: #fff; background: url("../png/majbtn.webp") no-repeat; }
.major .btn a:hover {  animation: 1s linear 0s normal none 1 running pudding; }

.dArea { height: 863px; background: url("../jpg/darea.webp") no-repeat center top; }
.advser { padding: 120px 0 0; }
.advser .hd { position: relative; margin-bottom:50px;  text-align: center;  /*animation: 1s linear 0s normal none 1 running bounceIn;*/  }
.advser .hd:before { position: absolute; content: ""; top:-35px; left: 0; width: 100%; height:150px;  background: url("../png/tit_line_2.webp") no-repeat center top; }

.advser .hd h2 { font-weight: normal; color: #1670af; font-size: 26px; text-transform: uppercase; }
.advser .hd .tit { padding-top: 10px; }
.advser .hd em { padding: 2px 34px; border: 1px solid #fff; font-size: 19px; color: #fff; }
.advser .bd { padding-top: 90px; }


.advul { padding-left: 7px; }
.advul li { position: relative; float: left; width: 221px; height: 358px; margin: 0 8px; }
.advul li .list-pic { position: relative; width: 221px; height: 358px; }
/*.advul li .list-pic .hide1 { position: absolute; top: 0; left: 0; opacity: 0; width: 221px; height: 358px;  }*/
.advul li .over { position: absolute; bottom: 0; height: 358px; width: 100%; text-align: center; background: rgba(0,0,0,0.4); }
.advul li .over a { position:absolute; bottom:0; width: 221px; height: 50px; padding:6px 0 4px 0; background: rgba(255,255,255,0.4);  font-size: 16px; color: #fff; display:table-cell; vertical-align: middle; }
.advul li .over a em { display: block; font-size: 12px; text-transform: uppercase; }
.advul li:hover .over { height: 60px; background: rgba(255,255,255,0.6);    }
.advul li:hover .over a,.advul li:hover .over a em {color:#1165a1;}

.hcase { width: 1201px; margin: 0 auto; padding:90px 0 105px; }

.hcase .hd { position: relative; margin-bottom:50px;  text-align: center;  /*animation: 1s linear 0s normal none 1 running bounceIn;*/  }
.hcase .hd:before { position: absolute; content: ""; top:-35px; left: 0; width: 100%; height:150px;  background: url("../png/tit_line_1.webp") no-repeat center top; }
.hcase .hd h2 { font-weight: normal; color: #1670af; font-size: 26px; text-transform: uppercase; }
.hcase .hd .tit { padding-top: 10px; }
.hcase .hd em { padding: 2px 57px; border: 1px solid #9c9b99; font-size: 19px; color: #414141; }
.hcase .bd { position: relative; padding-top: 80px; }
.hcase .caseul { border: 1px solid #e6e6e6; border-right: none; }
.hcase .caseul li { float: left; width: 299px; height: 105px; border-bottom: 1px solid #e6e6e6; border-right: 1px solid #e6e6e6; }

.hcase .bd .prev,.hcase .bd .next { position: absolute; top:43%; opacity:0; width:200px; height:200px; cursor: pointer; }
.hcase .bd .prev { left: -122px; text-align:left; }
.hcase .bd .next { right: -122px; text-align:right; }

.hcase .bd .prev:hover,.hcase .bd .next:hover { opacity:1; transition: all 0.6s ease-in-out 0s; } 

.hcase .quan { text-align: center; padding-top: 45px; }
.hcase .quan li { display: inline-block; margin: 0 12px; width: 14px; height: 14px; border-radius: 14px; background: #c1c1c1; cursor: pointer; text-indent: 999em; }
.hcase .quan li:hover,.hcase .quan li.on { background: #1f6ea6; }

#adver_2{position: relative;}