﻿#header .container{width:92%; max-width: 1520px; margin:0 auto;}

.swiper-container-h {
    width: 100%;
    height: 100vh;
    overflow: hidden;
}
.swiper-container-h .swiper-pagination-h{
    margin-left:20px;
}
.swiper-container-h .swiper-pagination-h .swiper-pagination-bullet {
    width: 10px;
    height: 10px;
    background: #dbae73;
    border-radius: 50%;
    opacity: 1;
    position: relative;
    margin-bottom: 53px !important;
    margin-top: 0;
}

.swiper-container-h .swiper-pagination-h .swiper-pagination-bullet-active:before {
    position: absolute;
    border: 1px solid #dbae73;
    border-radius: 50%;
    content: "";
    display: block;
    width: 22px;
    height: 22px;
    top: 50%;
    left: 50%;
    margin-top: -12px;
    margin-left: -12px;
}

.swiper-container-h .swiper-pagination-h .swiper-pagination-bullet:after {
    width: 1px;
    height: 53px;
    background: rgba(255, 255, 255, 0.5);
    display: block;
    content: "";
    position: absolute;
    left: 50%;
    top: 10px;
}

.swiper-container-h .swiper-pagination-h .swiper-pagination-bullet:last-child {
    margin-bottom: 0 !important;
}

.swiper-container-h .swiper-pagination-h .swiper-pagination-bullet:last-child:after {
    display: none;
}

.swiper-container-h>.swiper-wrappper>.swiper-slide {
    width: 100%;
    height: 100vh;
    min-width: 1200px;
    min-height: 800px;
}
.swiper-container-vertical>.swiper-pagination-bullets{
    left:10px;
}
.swiper-container-h.swiper-container-vertical>.swiper-pagination-bullets{
    width: 50px;
}
@media only screen and (min-width: 100px) and (max-width: 768px) {
    .swiper-container-vertical>.swiper-pagination-bullets{
        display:none;
    }
}


/*第一屏*/
.index_box .screen1 .wrap {
    width: 100%;
    height: 100vh;
    position: relative;
}
.index_box .screen1 .wrap .swiper-pagination {
    bottom: 40px;
    text-align: center;
    width: 100%;
}

.index_box .screen1 .wrap .img_box {
    width: 100%;
    height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.index_box .screen1 .wrap .img_box img {
    height: 100%;
    max-width: none;
    width: 100%;
}


/*第二屏*/
.index_box .screen2 {
    position: relative;
    overflow: hidden;
    background: url(../images/aboutimg.jpg) no-repeat right center;
    display: flex;
}

.index_box .container{width:92%; max-width:1520px; margin:0 auto; height: 100%; position: relative;}
.index_box .screen2 .aboutbox{
    display: inline-block;
    position: absolute;
    left:0px;
    width:50%;
    max-width:840px;
    top: 50%;
    transform: translateY(-50%);
}
.index_box .screen2 .aboutbox .toptit{font-size: 14px; font-weight: bold;}
.index_box .screen2 .aboutbox .toptit span{color:#dbae73;}
.index_box .screen2 .aboutbox h2{font-weight: 100; font-size: 42px; margin: 64px 0px 48px;}
.index_box .screen2 .aboutbox h2 span{padding-right: 12px;}
.index_box .screen2 .aboutbox .aboutintro{font-size: 14px; line-height:24px;}
.index_box .screen2 .aboutbox .aboutintro p{text-indent: 2em;}
.index_box .screen2 .aboutbox .ad{width:100%; margin:48px 0px 64px;}
.index_box .screen2 .aboutbox .ad .adnum{float:left; margin-right: 48px;}
.index_box .screen2 .aboutbox .ad .adnum .num{color:#dbae73; font-size:56px; font-weight: bold; float:left; height:56px; line-height: 56px;}
.index_box .screen2 .aboutbox .ad .adnum .numintro{float:left; margin-left: 12px;}
.index_box .screen2 .aboutbox .ad .adnum .numintro h4{font-size: 16px; color:#4c4c4c; margin-top: 10px; font-weight: 200;}
.index_box .screen2 .aboutbox .ad .adnum .numintro em{font-size: 10px; color:#c3c3c3; font-style: inherit;}
.index_box .screen2 .aboutbox a{display: block; background: #1c1c1c; height:48px; line-height: 48px; width:160px; text-align: center; color:#fff; border-radius:22px;}

@media (max-width: 1440px) {
    .index_box .screen2 .aboutbox .ad .adnum{margin-right: 12px;}
}


/*第三屏*/
.index_box .screen3{overflow: hidden;}
.index_box .screen3 .container ul{height:100%}
.index_box .screen3 .container ul li{float:left; width:20%; border-right: 1px solid #f5f5f5; text-align: center; height: 100%; position: relative;}
.index_box .screen3 .container ul li:first-child{border-left:1px solid #f5f5f5;}
.index_box .screen3 .container ul li .catebox{display: inline-block;
    position: absolute;
    left:10%;
    width:80%;
    top: 50%;
    transform: translateY(-50%); text-align: center; z-index: 2;}
.index_box .screen3 .container ul li .catebox .img{width:90px; height: 90px; margin:0 auto;}
.index_box .screen3 .container ul li .catebox h3{font-weight:normal; font-size: 18px; margin:32px 0 24px;}
.index_box .screen3 .container ul li .catebox .more{font-size: 14px; text-transform:capitalize; width:100px; height:36px; border-radius: 18px; margin:0 auto; border:1px solid #dbae73; line-height: 36px;}
.index_box .screen3 .container ul li:nth-child(1) .catebox .img{background:url(../images/icon-a.png) no-repeat;}
.index_box .screen3 .container ul li:nth-child(2) .catebox .img{background:url(../images/icon-b.png) no-repeat;}  
.index_box .screen3 .container ul li:nth-child(3) .catebox .img{background:url(../images/icon-c.png) no-repeat;}  
.index_box .screen3 .container ul li:nth-child(4) .catebox .img{background:url(../images/icon-d.png) no-repeat;}  
.index_box .screen3 .container ul li:nth-child(5) .catebox .img{background:url(../images/icon-e.png) no-repeat;}
/*.index_box .screen3 .container ul li:nth-child(1):hover{background:url(../images/icon-abg.jpg) no-repeat center center; background-size: cover;}*/
.index_box .screen3 .container ul li:nth-child(1):hover .catebox .img{background:url(../images/icon-ah.png) no-repeat;}
.index_box .screen3 .container ul li:nth-child(2):hover .catebox .img{background:url(../images/icon-bh.png) no-repeat;}  
.index_box .screen3 .container ul li:nth-child(3):hover .catebox .img{background:url(../images/icon-ch.png) no-repeat;}  
.index_box .screen3 .container ul li:nth-child(4):hover .catebox .img{background:url(../images/icon-dh.png) no-repeat;}  
.index_box .screen3 .container ul li:nth-child(5):hover .catebox .img{background:url(../images/icon-eh.png) no-repeat;}
.index_box .screen3 .container ul li:hover .catebox .img{margin-top: 100%; transition: all 0.8s ease;}
.index_box .screen3 .container ul li:hover .catebox h3{color:#fff; transition: all 0.8s ease;}
.index_box .screen3 .container ul li:hover .catebox .more{color:#fff; transition: all 0.8s ease;}

.cateboxmask{width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1; transform: translateY(-201%);transition: all 0.8s ease;}
.cateboxmask img{max-width: 100%;}
.index_box .screen3 .container ul li:hover .cateboxmask{transform: translateY(0); opacity:1;}


/*第四屏*/
.screen4bg{width:100%; height:50%; background:url(../images/screen4bg.jpg) bottom center; background-size: cover;}
.screen4 .container{height:50%; position: relative;}
.screen4con{display: inline-block;
    position: absolute;
    left:10%;
    width:80%;
    top: 50%;
    transform: translateY(-50%); text-align:left; z-index: 2;}
.screen4conleft{float:left; width:80%;}
.screen4conleft .screen4box{display: none; width:760px;}
.screen4conleft .screen4box.active{display: block;}
.screen4conleft .screen4box h4{font-weight:100; font-size: 18px; color:#dbae73;}
.screen4conleft .screen4box h2{font-weight: 100; font-size:36px; color:#2c2c2c; margin:20px 0px 32px;}
.screen4conleft .screen4box span{font-size: 12px; font-weight: 100; letter-spacing: 5px;}
.screen4conleft .screen4box p{height:120px; font-size:14px; line-height: 24px;}
.screen4conright{float:right; width:20%; text-align: right}
.screen4conright a{display: block; color:#727272; line-height:56px;}
.screen4conright a.active{color:#dbae73;}


.screen5{width:100%; height:100%; background:url(../images/screen5bg.jpg) bottom center; background-size: cover;}
.screen5 .container{position: relative;}
.screen5 .screen5box{display: inline-block;
    position: absolute;
    width:100%;
    top: 50%;
    transform: translateY(-45%); text-align:left; z-index: 2; display: table;
}

.screen5con{width:94%;  border:1px solid #dbae73; padding: 10px; box-sizing: border-box; display: table-cell;}
.screen5conkuang{width:100%; border:1px solid #dbae73; padding: 60px;}
.screen5conbox{display:none;}
.screen5conbox.active{display: block;}
.screen5conbox h2{font-size:42px; color:#dbae73; margin-bottom: 32px;}
.screen5conbox .wz{width:100%;}
.screen5conbox .wz .wzl{width:36%; float:left; color:#dbae73;}
.screen5conbox .wz .wzl p{line-height: 32px; margin-bottom: 32px;}
.screen5conbox .wz .wzl .tel{width:272px; height: 40px; border:2px solid #dbae73; text-align: center; line-height:40px; color:#dbae73; border-radius: 20px; margin-top: 40px;}
.screen5conbox .wz .wzr{width:60%; float:right;}
.screen5conbox .wz .wzr p{line-height: 32px; color:#fff;}

.screen5titbox{width:6%; text-align: right; position: absolute; right:2%; height: 100%; display: table-cell;}
.screen5tit{display: inline-block; position: absolute; width:100%; top: 50%; transform: translateY(-50%); text-align:left; z-index: 2;}
.screen5tit a{display: block; line-height: 72px}
.screen5tit a.active{color:#dbae73;}

@media (max-width: 1440px) {
    .screen5conkuang{padding:24px;}
    .screen5conbox h2{font-size: 32px; margin-bottom: 20px;}
    .screen5conbox .wz .wzl p{margin-bottom: 20px;}
}



/*第六屏*/
.screen6{width:100%; height:100%; background:url(../images/screen6bg.jpg) bottom center; background-size: cover;}
.screen6 .container{position: relative;}
.screen6 .screen6box{display: inline-block;
    position: absolute;
    width:100%;
    top: 50%;
    transform: translateY(-50%); text-align:center; z-index: 2; display: table;
}
.screen6box em{font-style: inherit; font-size: 16px; color:#dbae73; text-align: center;}
.screen6box h2{font-size: 48px; margin: 16px 0px 56px; height: 48px; line-height: 48px;}
.screen6box .contactbox{width:100%;}
.screen6box .contactbox .contactinfo{width:50%; float:left;}
.screen6box .contactbox .contactmap{width:50%; float:right; text-align: right;}
.screen6box .contactbox .contactmap img{max-width: 100%;}
.contactinfoc{float:left; width:44%; text-align:left}
.screen6box .contactbox .contactinfo .contactinfoc{height:50px; margin:39px 0px;}
.screen6box .contactbox .contactinfo .contactinfoc .icon{width:50px; height:50px; float:left; margin-right: 10px;}
.screen6box .contactbox .contactinfo .contactinfoc:nth-child(1) .icon{background:url(../images/icon-email.png) no-repeat; background-size: 50px 50px;}
.screen6box .contactbox .contactinfo .contactinfoc:nth-child(2) .icon{background:url(../images/icon-tel.png) no-repeat; background-size: 50px 50px;}
.screen6box .contactbox .contactinfo .contactinfoc:nth-child(3) .icon{background:url(../images/icon-phone.png) no-repeat; background-size: 50px 50px;}
.screen6box .contactbox .contactinfo .contactinfoc:nth-child(4) .icon{background:url(../images/icon-address.png) no-repeat; background-size: 50px 50px;}
.screen6box .contactbox .contactinfo .contactinfoc .intro h4{font-size:16px; color:#494949;}
.screen6box .contactbox .contactinfo .contactinfoc .intro em{font-size: 20px; color:#494949;}
.screen6box .contactbox .contactinfo .contactinfoc:nth-child(4) {width:56%;}
.copyright{position:absolute; bottom: 0px; height:40px; background:#1a1a1a; color:#fff; text-align: center; width:100%; line-height: 40px;}
.footlink{position:absolute; bottom: 40px; height:40px; background:#1a1a1a; color:#fff; text-align: center; width:100%; line-height: 40px;}



@media (max-width: 768px) {
    .index_box .screen1 .wrap .img_box{height: auto;}
    .index_box .screen1 .wrap{height: auto;}
    .screen1.swiper-slide{ height: auto;}
   
    .screen3.swiper-slide{ height: auto;}

    .screen4.swiper-slide{height:auto;}
    
    .index_box .screen3 .container ul li{width:100%; height: 240px;}
    .cateboxmask{display: none;}
    .index_box .screen3 .container ul li:hover .cateboxmask{display: none;}

    .index_box .screen3 .container ul li:nth-child(1):hover .catebox .img{background:url(../images/icon-a.png) no-repeat;}
.index_box .screen3 .container ul li:nth-child(2):hover .catebox .img{background:url(../images/icon-b.png) no-repeat;}  
.index_box .screen3 .container ul li:nth-child(3):hover .catebox .img{background:url(../images/icon-c.png) no-repeat;}  
.index_box .screen3 .container ul li:nth-child(4):hover .catebox .img{background:url(../images/icon-d.png) no-repeat;}  
.index_box .screen3 .container ul li:nth-child(5):hover .catebox .img{background:url(../images/icon-e.png) no-repeat;}

.index_box .screen3 .container ul li .catebox .img{width:90px; height: 90px; margin:0 auto;}
.index_box .screen3 .container ul li .catebox h3{font-weight:normal; font-size: 18px; margin:16px 0 24px;}
.index_box .screen3 .container ul li .catebox .more{font-size: 14px; text-transform:capitalize; width:100px; height:36px; border-radius: 18px; margin:0 auto; border:1px solid #dbae73; line-height: 36px;}
.index_box .screen3 .container ul li:hover .catebox .img{margin-top:0; transition: all 0.8s ease;}
.index_box .screen3 .container ul li:hover .catebox h3{color:#666; transition: all 0.8s ease;}
.index_box .screen3 .container ul li:hover .catebox .more{color:#666; transition: all 0.8s ease;}
.index_box .screen2 .aboutbox{width:100%;}
.index_box .screen2{background:url();}
.index_box .screen2 .aboutbox .ad{margin: 24px 0px 32px;}
.index_box .screen2 .aboutbox h2{margin:32px 0px 24px;}

.screen4 .container{height:auto; position:inherit;}
.screen4conleft{float:none; width:100%;}
.screen4conright{float:none; width:100%;}
.screen5{display: none;}
}



.news-box{width:90%; height:100%; margin:0 auto;}
.news-box ul{height:100%;}
.news-box li{width:25%; position: relative; height:100%; float:left;}
.news-box li:hover{background:#f2f2f2; cursor:pointer}
.wk{position:relative; width:100%; height: 100%;}
.news-info-box{position:relative; top:50%; height: 360px; border:0px solid #ccc; width:80%; margin-left: 10%; margin-top: -180px;}
.news-info-box .time{display:block; font-size:16px; color:#000; font-family: fantasy;}
.news-info-box .line{display:block; width:25px; height:1px; background: #f00; margin-top: 10px;}
.news-info-box h2{font-size:14px; font-weight:600; color:#000; line-height: 28px;}
.news-info-box img{display:block; margin:10px auto 20px; max-width: 100%}
.news-info-box p{font-size:12px; color:#666; overflow:hidden; line-height:24px; height:96px;}
