/* --- 公用样式 --- */

.container{max-width:1140px; margin:0 auto;}

/* --- banner --- */
.page-banner{height:310px; display:flex; align-items:center; margin-bottom:80px;}
.page-banner .box{background-color:rgba(6,57,146,0.35); width:480px; height:200px; margin:0 auto; display:flex; align-items:center; justify-content:center; transition:all .3s; }
.page-banner .box .text{text-align:center;}
.page-banner .box .text h2{font-size:48px; color:#fff; text-transform:uppercase; margin-bottom:10px; font-weight:lighter;}
.page-banner .box .text p{color:#fff; font-size:44px;}
/* news */
.banner-news{background:url(../images/news/banner-news.jpg) no-repeat center top; background-size:cover; }
/* contact */
.banner-contact{background:url(../images/contact/banner-contact.jpg) no-repeat center top; margin-bottom:0; background-size:cover; }



/* --- news list --- */
.news-list .item{background:#F7F9FA; padding:34px 24px; display:flex; align-items:center; margin-bottom:25px; position:relative; transition:all .3s;}
.news-list .item:after{content:""; width:14px; background:#07AF96; position:absolute; right:0; top:0; height:0%; transition:all .3s;}
/* pic */
.news-list .item .pic{ width:240px; margin-right:40px; transition:all .3s;}
.news-list .item .pic img{ width:100%;}
/* text */
.news-list .item .text{ width:90%;}
.news-list .item .text h3{font-size:22px; margin-bottom:10px; font-weight:bolder;}
.news-list .item .text h3 a:hover{color:#07AF96;text-decoration: none; }
.news-list .item .text .date{ font-size:14px; color:#999;margin-bottom:12px; display: block;}
.news-list .item .text .dep{line-height:180%; font-size:14px; width:90%;display: block;}
.news-list .item .text .dep p{line-height:180%; color:#666;}
@media (max-width:835px) {
    .news-list .item .pic{ margin-right: 20px; }
    .news-list .item .text h3{ font-size:18px; height:20px; overflow:hidden; }
    .news-list .item .text .dep { height:20px; overflow:hidden; }
}
/* item:hover */
.news-list .item:hover {background:#fff; box-shadow: 0px 5px 5px #efefef;}
.news-list .item:hover:after{ height:100%;}
/* --- 分页 --- */
.newpage{margin-top:50px; margin-bottom:80px; text-align:center; width:100%; }
.newpage a{ display: inline-block; color:#7c7c7c; width:40px; height:40px; line-height: 40px; border:1px solid #E3E4E6; border-radius:4px; margin:5px; align-items:center; } 
.newpage .active{background:#07AF96; display: inline-block; color:#fff; width:40px; height:40px; line-height: 40px; border:1px solid #E3E4E6; border-radius:4px; margin-left:5px; margin-right:5px; align-items:center; } 
.newpage a:hover{background:#07AF96; text-decoration:none; color:#fff; border:1px solid #07AF96; border-radius:4px;} 



/* --- news content --- */
.news-content{margin-bottom:50px;}
/* title */
.news-content .title{text-align:center;  border-bottom:1px solid #efefef; padding-bottom:30px; margin-bottom:30px;}
.news-content .title h1{font-size:28px;font-weight:bolder; margin-bottom:20px; line-height:38px;}
.news-content .title .text{text-align:right; color:#999; font-size:14px;display:block; margin-right:10px;}
/* content */
.news-content .content { padding:5px 10px; }
.news-content .content p{line-height:200%; margin-bottom:10px;}
.news-content .content span{display:inline-block;}



/* --- contact --- */
.contact-box{position:relative; overflow:hidden;}

/* map */
.contact-map{height:800px;}
.contact-map .my-map { margin: 0 auto; width: 100%; height: 100%; }
.contact-map .amap-container{height: 100%;}

/* info */
.contact-info{background:#002932; background-color:rgba(0,41,50,0.83); position:absolute; right:0; top:0; width:100%; height:100%; z-index:200; transition:all 1s;}
.contact-info.close{right:-100%;}

/* logo */
.contact-info .logo{text-align:center; position:relative; margin-top:140px; margin-bottom:70px;}
.contact-info .logo:before{content:""; height:2px; background:#07AF96; left:0; top:45%; position:absolute; width:45%;}
.contact-info .logo:after{content:""; height:2px; background:#07AF96; right:0; top:45%; position:absolute; width:45%;}

/* info */
.contact-info .info{display:flex; color:#fff; justify-content:space-between;}
.contact-info .info .cn{width:65%;}
.contact-info .info .en{width:75%; margin-left:9%;}
.contact-info .info em{color:#4ef9cb; font-style:normal}
.contact-info .info p{line-height:250%; font-size:16px;}
.contact-info .info p .kongge{margin-right:52px; }
.contact-info .info p .kongge2{margin-right:50px; }

/* icon */
.contact-info .map-show {display:flex; justify-content:center; cursor:pointer; margin-top:5%; margin-right:20%;}
.contact-info .map-show .text p{color:#00c3a6; font-size:12px; line-height:125%; width:80px; margin-bottom:10px; font-weight:bolder;}
.contact-info .map-show .pic img{width:70%;}


/* show */
.contact-show{position:absolute; right:-100%; top:0; width:165px; background:#002932; background-color:rgba(0,41,50,0.83); height:100%; z-index:200; text-align:center; transition:all 1s; cursor:pointer;}
.contact-show.open{ right:0%;}

/* logo */
.contact-show .logo{height:200px; display:flex; align-items:center; justify-content:center;}

/* title */
.contact-show .title{font-size:28px; color:#fff; margin-bottom:10px;}

/* back */
.contact-show .back{border-top:2px solid #07AF96; margin-left:15px; text-align:left; color:#00C3A6; padding-top:10px; font-size:14px; background:url(../images/contact/back.svg) no-repeat 0 73%; padding-left:20px; background-size:14px;}
/* icon */
.contact-show .map-show{margin-top:300px;}
.contact-show .map-show .text p{color:#00c3a6; font-size:14px; line-height:125%;  text-align:left; width:90px; margin-left:20px;margin-bottom:5px;}
.contact-show .map-show .pic img{width:53%;}




@media (max-width:640px) { 
           
    /* --- banner --- */
    .page-banner{display:flex; align-items:center; }
    .page-banner .box{width: auto; height: auto;background-color:rgba(6,57,146,0.35); margin:0 auto; padding: 2rem 3rem; display:flex; align-items:center; justify-content:center; transition:all .3s; box-shadow: 0px 10px 20px rgba(6,57,146,0.3); border-radius:.5rem;}
    .page-banner .box .text{text-align:center;font-weight:bold}
    .page-banner .box .text h2{font-size:1.8rem; color:#fff; text-transform:uppercase; }
    .page-banner .box .text p{color:#fff; font-size:1.8rem;font-weight:lighter;}
    
    /* news */
    .banner-news{background:url(../images/news/banner-news.jpg) no-repeat center top; margin-bottom:0; background-size:cover; }
    /* contact */
    .banner-contact{background:url(../images/contact/banner-contact.jpg) no-repeat center top; margin-bottom:0; background-size:cover; }
    
        
    /* --- news list --- */
    .news-list{margin-top:1rem;}
    .news-list .item{background:#F7F9FA; display:block; padding:1.5rem; box-shadow: 0px 2px 3px #efefef; margin-bottom:1.5rem;}
    .news-list .item:after{content:""; width:0px; background:none; }
    /* item:hover */
    .news-list .item:hover {background:#F7F9FA; box-shadow: 0px 2px 3px #efefef; }
    /* pic */
    .news-list .item .pic{width:100%; margin-right: 0px; margin-bottom:1rem; }
    .news-list .item .pic img{width:100%;}
    /* text */
    .news-list .item .text{width:100%;}
    .news-list .item .text h3{width:100%;height:100%;font-size:1.0rem; margin-bottom:0.5rem; font-weight:bolder; line-height:150%;}
    .news-list .item .text h3 a{color:#07AF96;}
    .news-list .item .text .date{margin-bottom:0.4rem; font-size:0.8rem; color:#bdbcbc;}
    .news-list .item .text .dep{width:100%;height: 100%;line-height:180%; font-size:0.8rem;overflow:initial; }
    .news-list .item .text .dep p{line-height:180%; color:#666;}


    /* --- news content --- */
    .news-content {margin-top:60px;}


    /* --- contact --- */
    .contact-box{position:relative; overflow:hidden;}

    /* map */
    .contact-map{height:44rem;}

    /* info */
    .contact-info{background:#002932; background-color:rgba(0,41,50,0.83);  z-index:200; transition:all 1s; padding:2.5rem 1.5rem; position:absolute; left:0; top:0; width:100%; height:100%;}
    .contact-info.close{top:-100%;}

    /* logo */
    .contact-info .logo{text-align:center; position:relative; margin-top:0rem; margin-bottom:2.5rem;}
    .contact-info .logo img{margin:0 auto;}
    .contact-info .logo:before{content:""; height:1px; background:#07AF96; left:0; top:45%; position:absolute; width:30%;}
    .contact-info .logo:after{content:""; height:1px; background:#07AF96; right:0; top:45%; position:absolute; width:30%;}

    /* info */
    .contact-info .info{color:#fff; font-size:17px;display: block;}
    .contact-info .info .cn{ width:100%; margin-bottom:2rem; padding-bottom:2rem; border-bottom: 1px solid #1E3439; }    
    .contact-info .info .en{width:100%; margin-left:0%;}
    .contact-info .info em{color:#4ef9cb;font-style:normal;}
    .contact-info .info p{line-height:200%; font-size:0.8rem;color:#fff; }
    .contact-info .info p .kongge{margin-right:44px; }
    .contact-info .info p .kongge2{margin-right:44px; }
    

    /* icon */
    .contact-info .map-show { text-align:center; margin-top:5rem; margin-bottom:5rem;}
    .contact-info .map-show .text {margin-bottom:1.5rem;}
    .contact-info .map-show .text p{color:#00c3a6; font-size:0.8rem; text-align:left; line-height:125%;  margin-bottom:0.2rem; font-weight:bolder;}
    .contact-info .map-show .pic{}
    .contact-info .map-show .pic img{max-width:7rem; margin:0 auto;}

    /* roll */
    .contact-show.roll{position:fixed; left:0; top:0; width:100%; z-index:300; box-shadow: 0px 2px 5px #f5f5f5; }
    
    /* show */
    .contact-show{position:absolute; right:0; top:-100%; width:100%; background:#002932; background-color:rgba(0,41,50,0.83); height:5rem; z-index:200; text-align:center; transition:all 1s; cursor:pointer; display:flex; align-items:center; padding:0 1.5rem; justify-content:space-between;}
    .contact-show.open{ top:0%;}

    /* logo */
    .contact-show .logo{}
    .contact-show .logo img{width:6rem;}

    /* title */
    .contact-show .title{ display:none; }

    /* back */
    .contact-show .back{ display:none; }

    /* icon */
    .contact-show .map-show{ display:flex; align-items:center;margin-top:0px;}
    .contact-show .map-show .text p{color:#00c3a6; width: 100%; font-size:0.8rem;  margin-right:0.5rem;}
    .contact-show .map-show .pic img{width:3rem;}
}
