@import url("responsive2.0.css"); 

.auto{ max-width:1400px; width: 96%; margin: auto}
@media(max-width:1024px){
  .auto{width:92%;}
}
.fs18{font-size: 18px;}
.fs20{font-size: 20px;}
.fs24{font-size: 24px;}
.fs26{font-size: 0.26rem;}
.fs32{font-size: 0.32rem;}
.fs36{font-size: 0.36rem;}
.fs40{font-size: 0.40rem;}
.fs42{font-size: 0.42rem;}
.fs52{font-size: 0.52rem;}
.fs56{font-size: 0.56rem;}
.fs58{font-size: 0.58rem;}
.fs60{font-size: 0.60rem;}

@media(max-width:1024px){
body,table td, select, input, textarea { font-size: 14px;}
html{font-size: calc(100vw* 100 / 1400);}
.fs18{font-size: 16px;}
.fs20{font-size: 18px;}
.fs24{font-size: 20px;}

}
@media(max-width:768px){
html{font-size: calc(100vw* 100 / 960);}
.fs20{font-size: 16px;}
.fs24{font-size: 18px;}
}

.top{height: 70px;}
.top .header{position: fixed; left: 0; right: 0; top: 0; max-width: none; background: #fff; z-index: 100; font-size: 16px; transition: padding 0.3s; display: flex; align-items: center; justify-content: space-between;width: 100%; padding-left:2%; padding-right:2%;}

body:not(.index_body) .top .logo img{filter: brightness(0)}
.header .logo img{ max-height: 24px;}
.top menu li span{font-size: 16px;display: block; position: relative;}
.top menu li span a{display: block}
.top menu li.aon span a{color: #000;}
.top .top-right{position: absolute;right: 0; top: 0;height: 100%;}
.top .top-right dl{display: table; height: 100%;}
.top .top-right dl > *{display: table-cell; vertical-align: middle;}

@media(min-width:1025px){

.top menu ul{display: flex; justify-content: space-between; min-width: 630px;}
.top menu li span{line-height:70px;}
.top menu li.aon span{font-weight: bold}
}

@media(max-width:1024px){
.top{height: 50px;}
.top .header{height: 50px;}
.top menu{position: fixed; left: -100%;opacity: 0; top:50px;bottom: 0;overflow: auto;background: #fff; z-index: 99; width: 200px;box-shadow: 0 10px 10px rgba(0,0,0,0.1); padding: 20px 0;transition: 0.5s;}
.menu-show .top menu{left: 0;opacity: 1; }
.top menu li span{display: block;position: relative;line-height: 40px;padding: 0 40px 0 20px; border-bottom: 1px solid rgba(0,0,0,0.05);}
.top .has-sub span .op:before, 
.top .has-sub span .op:after{background: #ccc;}
.top .open-menu{background: #000;display: flex; justify-content: center; align-items: center;width:34px;height: 32px;}
.top .open-menu span{position: relative;display: block; width: 20px; height: 20px; margin: 0 auto;}
.open-menu i{height: 2px;}
.open-menu:not(.on) i:nth-child(1){margin-top:-9px;}
.open-menu:not(.on) i:nth-child(3){margin-top:7px;}

}

.bottom {padding-top: 4%;}
.bottom .auto{display: flex; flex-wrap: wrap; justify-content: space-between;  border-top: solid 1px #000000}

.bottom .contact{display: flex; flex-wrap: wrap; width:calc(100% - 100px)}
.bottom .contact dl{padding-right: 3vw}
.bottom .follow dl{display: flex;flex-wrap: wrap;}
.bottom .follow .icon-wechat{display: none}
.bottom .foot{font-size: 10px; display: flex; flex-wrap: wrap; justify-content: space-between; width: 100%; padding:1.5% 0; color: #999999}
.bottom .foot a:not(:hover){color: #999999}
.bottom .contact,
.bottom .follow{ display: none;}
@media(max-width:1024px){
.bottom .contact dl{padding-right:0; width: 50%}
.bottom .contact dl:not(:last-child){padding-bottom: 2%}
.bottom .contact dl:last-child{width: 100%}
}
@media(max-width:768px){
.bottom .auto{padding-top: 3%}
.bottom .contact{width: 100%; order: 2}
.bottom .foot{order: 3}
.bottom .follow{display: flex; justify-content: center; align-items: center; width: 100%; padding-bottom: 5%}
.bottom .follow dl{width: 160px;}
.bottom .follow dl dt{order: 2; width: 100%; text-align: center;; padding-top: 10px;}
.bottom .follow .social-share{display: block; width: 100%}
.bottom .follow .social-share .social-share-icon{width: 100%; height: auto; margin: 0}
.bottom .follow .social-share .social-share-icon .wechat-qrcode{display: block; position: initial}
.bottom .follow .social-share .social-share-icon:before,
.bottom .follow .social-share .social-share-icon .wechat-qrcode h4,
.bottom .follow .social-share .social-share-icon .wechat-qrcode:after{display: none}
}

.cloumn_font{line-height:1.5;padding-top:6%; padding-bottom: 0.1rem;font-weight: bold;}
.cloumn_font.series{text-align: left}
.cloumn_font.series .cn{font-weight: normal}
.photoPage2 .cloumn_font{ padding-bottom: .35rem;}
.menu_search{text-align: center;  position: relative; padding-top: 4%; padding-bottom:0.8rem}
.top .header .other{ display: inline-flex; gap: 20px; align-items: center; }
.top .header .search{display: flex; position: relative;}
.top .header .search input {height: 30px;border: none;padding: 0px 10px;border-radius: 30px;border: solid 1px #f9f9f9;display: none;position: absolute;top: 0;right: 60%;width: 10px;}
#KeySearch:focus {transition: width 0.5s ease;width: 200px;}
.top .header .search input:not(.focus){color: #d3d2d2; border-color: #fff}
.top .header .search a{width: 40px; height: 30px; background: url(../images/search_icon_@2x.svg) no-repeat center right; background-size: 18px;}
.menu ul{display: flex; flex-wrap: wrap; justify-content: center}
.menu ul li{padding: 0px 25px; position: relative;}
.menu ul li:not(:last-child):after{content:'|';position: absolute; right: -5px; top:3px; color: #999999; font-style: italic; font-size: 14px;}
.menu ul li:not(.aon) a{color: #666666}
.menu ul li.aon{ font-weight: bold}
@media(min-width:1024px){
.menu_search {padding-top: 0}
.menu_search .search{position: absolute; right: 0; bottom: 0}
}
@media(max-width:768px){
.menu ul li{padding: 0px 15px; }
}
.menu_top{padding-top: 2%}
.imgmid figure{padding-bottom: 100%; position: relative; overflow: hidden}
.imgmid figure img{position: absolute; width: 100%; height: 100%; object-fit: cover;-o-object-fit: cover}


.hover_zoom_img figure{ overflow: hidden}
.hover_zoom_img figure img{
-webkit-transition: -webkit-transform 1.2s ease;
transition: -webkit-transform 1.2s ease;
transition: transform 1.2s ease;
transition: transform 1.2s ease,-webkit-transform 1.2s ease;
}
.hover_zoom_img .item:hover figure img{ -webkit-transform:scale(1.2);transform:scale(1.2)}

.article{line-height: 2}


[rel="scrollbar"]::-webkit-scrollbar{width: 8px;}
[rel="scrollbar"]::-webkit-scrollbar{width:5px; height:3px;-webkit-overflow-scrolling : touch; background-color: #fff;}
[rel="scrollbar"]::-webkit-scrollbar-track{ background-color:#fff; border-right: solid 1px #fff}
[rel="scrollbar"]:hover::-webkit-scrollbar-thumb{ background-color: #000000;}
[rel="scrollbar"]::-webkit-scrollbar-button{ height: 0px; background-color: #000000;}

@media(min-width:640px){
.bottom dl dt,
.news_list .item,
.contact_main p,
.contact_main b,
.about_intro .txt p{ font-weight: lighter;}
.news_list .item:hover .txt{font-weight:600}
}
.banner{ min-height: 100vh; display: flex;flex-direction: column; align-items: center; position: relative;margin-top: 70px;}
.banner .info{text-align: center}
.banner .tips{ color: #d1d1d1; padding: 3% 0}
.banner figure {margin-top: 19px;}
.banner .tit {font-size: 2.2rem;
    color: rgb(255, 255, 255, 0.4);
    position: absolute;
    top: 2%;
    right: 35%;
    z-index: -1;
    font-family: 'GenWanMinTW', sans-serif;
    letter-spacing: -3px;}
.about_intro .item{background-color: #e2e2e2; padding: 100px 0 70px;}
.about_intro .txt h4{font-size: 0.3rem;margin:1em 0 2em; line-height: 1.2;}
.about_intro .txt p{line-height: 1.25;font-size: 0.2rem;}
.about_intro .article{padding: 0;font-size: 16px;text-align: justify}

.about_intro .article.en{color: #666;margin-top: 2em;}
@media(min-width:768px){
.about_intro .auto{display: flex; justify-content: space-between; align-items: center;}
.about_intro .pic{width: 37.857143%}
.about_intro .info{width:48%}
.Content_box .about_intro:nth-child(odd) .item .info{order: 2}
}

.about_intro{min-height: 140vh;position: relative;z-index: 4;background-color: #e2e2e2;}

.about_intro_con .item{ min-height: 100vh;}
.about_intro_con .ani-con{  }
@media(min-width:1024px){
.about_intro.fixed .item{position: fixed;left: 0;z-index: 1;width: 100%;top:0;}
}

.honor,
.honor + .bottom{background-color: #e2e2e2; position: relative;z-index: 4;}
.honor{ min-height: 100vh;}
.honor .item{  display: flex; align-items: center; justify-content: center; padding-top: 10vh;}

.about_title{font-size: 0.32rem; margin-bottom: 0.7rem;}

.brand_intro .item{position: relative}
.brand_intro .item:before{content: '”'; position: absolute; right:0; top: 0; line-height: 1; font-size: calc(100vw*140/1920);font-family: fantasy; font-weight: lighter }
.brand_intro .txt{padding:0}
.brand_intro .article{padding: 0; text-align: justify}
.brand_intro .article .en{font-size: .14rem; margin-top: 3%}
.brand_intro  .pic{position: relative;z-index: 1;}
.brand_intro  .play{position: absolute; left: 0;top: 0;width: 100%;height: 100%; z-index: 10; background-color: rgba(0,0,0,0.1); display: flex;align-items: center; justify-content: center; cursor: pointer;}
.brand_intro  .play:before{display: block; content: ''; width: 0.6rem; height: 0.6rem; border-radius: 50%;background: #fff url(../images/play_icon@2x.svg) no-repeat left 55% center; background-size: 30% auto; }
.brand_intro  .honor-video{position: absolute; z-index: 20;background-color: #000;left: 0;top: 0;width: 100%;height: 100%;}
.brand_intro  .honor-vide video{width: 100%;height: 100%; object-fit: contain;display: block;}
@media(min-width:768px){
.brand_intro .info{width: 45%; max-height: 100%; overflow-y: auto; position: absolute; right: 0;top:0;}
.brand_intro .article{width:76%;line-height: 1.6;}
.brand_intro  .pic{width: 50%}
}

.about-body,
.about-body .top .header{background-color: #e2e2e2;}
.about-body .top{position: absolute; left: 0;top: 0;width: 100%;}

.brand_intro .info h1.fs24{font-size: 0.2rem; padding-top: 0.33rem;}
.brand_intro .info h1.fs24 .cn{ font-weight: bold;}
.brand_intro .article .cn{ margin: 2em 0 0;}
.brand_intro .article .en{ color: #999;}

.show_img {
    -moz-animation: clipPathAnimation 1s ease-out forwards;
    animation: clipPathAnimation 1s ease-out forwards;
}
@-webkit-keyframes clipPathAnimation {
    0% {
        -webkit-clip-path: polygon(0 0,100% 0,100% 0,0 0);
        clip-path: polygon(0 0,100% 0,100% 0,0 0)
    }

    to {
        -webkit-clip-path: polygon(0 0,100% 0,100% 100%,0 100%);
        clip-path: polygon(0 0,100% 0,100% 100%,0 100%)
    }
}

@-moz-keyframes clipPathAnimation {
    0% {
        clip-path: polygon(0 0,100% 0,100% 0,0 0)
    }

    to {
        clip-path: polygon(0 0,100% 0,100% 100%,0 100%)
    }
}
@keyframes clipPathAnimation {
    0% {
        -webkit-clip-path: polygon(0 0,100% 0,100% 0,0 0);
        clip-path: polygon(0 0,100% 0,100% 0,0 0)
    }

    to {
        -webkit-clip-path: polygon(0 0,100% 0,100% 100%,0 100%);
        clip-path: polygon(0 0,100% 0,100% 100%,0 100%)
    }
}


.brand_logo{padding: 0; display: flex; flex-wrap: wrap; align-items: center; overflow: hidden;margin:8% 0 2% 0; }
.brand_logo .item{width: 20%;text-align: center; position: relative}

.brand_logo .item img{opacity: 0.3; transition: 0.5s;width: 95px;}
.brand_logo .item a{width: 80%;display: block}
.brand_logo .item a figure {display: flex;flex-direction: column;}
.brand_logo .item a:hover img{opacity:1}
.brand_logo .item.slick-current img {
    opacity: 1;
}
.slider_year .slick-track {
    display: flex;
    align-items: center;
}
@media(max-width:768px){
.brand_logo .item{width:33.333%; }
.brand_logo .item a{width: 60%;}
}

.contact_main{padding-bottom:6%;display: table;margin: 0 auto;}
.contact_main h2 {text-align: center;
    font-size: 1.8rem;
    color: #fff;
    letter-spacing: 0.12rem;
    font-weight: 500;}

.contact_editor p{padding-bottom:1%;line-height: 1;margin: 17px 0;text-align: center;}

.contact_editor dl{padding-bottom: 5%;display: flex;flex-direction: column;align-items: center;}
.contact_editor .txt_fr figure{max-width: 135px; padding-top: 10px}
.contact_editor .txt_fr .txt{padding:8% 0}
.contact_editor .txt_fl dl dd {
    display: flex;
    flex-direction: column;
    align-items: center;
}
.contact_editor .txt_fl img {
    width: 105px;
    height: 105px;
    margin-top: 100px;
}
@media(min-width:768px){
.Content_box{ margin-top: 123px;}
.about-body .Content_box{ margin-top: 0;}

.contact_editor dl:not(:last-child){ padding-bottom:7%;}
.contact_editor .txt_fl{display: flex; justify-content: space-between; padding-left: 0.1rem; padding-right: 0.21rem;}
.contact_editor .txt_fr{max-width: 460px; border-left: solid 1px #e5e5e5; padding-left: 5%}
.contact_editor .txt_fr .txt{padding-bottom: 20%}
}

.loading_list {text-align: center; padding:2% 0}
.loading_list a{display: inline-block;width:40px; height: 40px; background: url(../images/loading_icon.png) no-repeat center center;animation: load 2s linear infinite;}

@keyframes load {
0% {transform: rotate(0)}

100% {transform: rotate(360deg)}
}

.news_list{margin:2% 0}
.news_list .item{position: relative; display: flex; align-items: center; justify-content: space-between;line-height: 40px; padding:2.822% 0; position: relative; border-bottom: solid 1px #000000; }
.news_list .txt{width: 78.57142857142857%;}
.news_list .pic{width: 0; height: 40px; position: relative;}
.news_list .pic figure{ padding-bottom: 0; position: absolute; width: 100%; height: 100%; top: -200%; bottom: 0; margin: auto; transition: 0.5s}
.news_list .pic figure img{position: absolute; width: 100%; height: 100%; object-fit:cover; -o-object-fit:cover}
.news_list .time{width: 12%;}
.news_list .more{width: 40px; height: 40px;border: solid 1px #b4b4b4; transition: 0.5s; border-radius: 100%;}
.news_list .more:before,
.news_list .more:after{content:''; position: absolute; margin: auto; top: 0; bottom: 0; margin: auto;transition: 0.5s;}
.news_list .more:before{width: 36px; height: 1px; right: 20px; background: #000; border-color: #000}
.news_list .more:after{width: 0; height: 0; right: 8px; border: solid 6px transparent; border-left-color: #000}
.news_list .item:hover{z-index: 5}
/* .news_list .item.have_img:hover .txt{width: 50%;} */
/* .news_list .item.have_img:hover .pic{width: 28.57142857142857%} */
/* .news_list .item:hover .pic figure{height: 562.5%;} */
.news_list .item:hover .more{background: #000; border-color: #000}
.news_list .item:hover .more:before{width: 10px; background: #fff}
.news_list .item:hover .more:after{border-left-color: #fff}
@media(max-width:1024px){
.news_list .pic figure{top:-100%}
.news_list .item:hover .pic figure{height: 281.25%;}
}
@media(max-width:768px){
.news_list .more{display: none}
.news_list .time{width: 80px;opacity: 0.8}
}

.news_info{padding-top:6%}
.news_info .title {text-align: left;padding: 0 28%;}
.news_info .title p{color: #999; width: 643.148px; max-width: 100%; margin-left: auto; margin-right: auto; display: flex;flex-direction: column; justify-content: space-between;  align-items: flex-start;}
.news_info .title_w550{ max-width: 550px; width: 100%; margin: 0 auto; padding: 0; text-align: justify;}
.news_info .article{font-size: 15px;padding: 4% 10%; border-top: solid 1px #e5e5e5;border-bottom: solid 1px #e5e5e5}

.prev_next{padding-top: 4%; line-height: 2}
.prev_next a:not(:hover){color: #777}

.photo_list{display: flex; flex-wrap: wrap; justify-content: space-between;}
.photo_list .item{width:49.6%; margin-bottom:2%;}
.photo_list .pic figure {  padding-bottom: 64.798%;}
.photo_list .info{padding: 3% 0}
.photo_list .info .biaoti{font-weight: 500;font-size: 16px;}
.photo_list .info p{color: #666666a6;font-size: 14px;}
/* .photo_list .info p.desc{margin-bottom:2%} */

/*.end_section{}
.end_section .end_box{position: fixed; width: 100%; bottom: 0; z-index: 10; background: #fff;padding-top: 30px;opacity: 0;}
.end_section .end_box.show{opacity: 1;}
*/
.end_section .end_h{display: none}
.about-section{padding-top: 70px;}
.about-section .banner{margin: 0; padding-top: 70px;background: #e2e2e2}
.about-section .ani-con{position: absolute; left: 0;top: 0;width: 100%;height: 100%;display: flex;align-items: center; justify-content: center; }

.photo_detail{padding-top:6%; overflow: hidden!important;min-height: 100vh;}
/*.photoPage2 .photo_detail{  padding-bottom: 3rem;}*/

.imgbox {
  overflow: hidden;
  position: relative;
}

.imgbox span {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all .5s;
  -webkit-transition: all .5s;
}
.photo_detail .title{padding-bottom:0.35rem}
.photo_detail .photo{position: relative;}
.photo_detail .photo .swiper img{width: 100%}
.photo_detail .photo figure{padding-bottom: 55.858%;max-width: 1400px;min-height: 780px;}
.photo_detail .photo figure img{max-width: 1400px;}
.photo_detail .photo .play_video{cursor: pointer; z-index: 10; width:40px; height: 40px; padding:2.88%; position: absolute; margin: auto; left: 0; right: 0; top: 0; bottom: 0}
.photo_detail .photo .play_video:before,
.photo_detail .photo .play_video:after{content: ''; position: absolute; width: 100%; height: 100%;}
.photo_detail .photo .play_video:after{background: #fff; border-radius: 100%; opacity: 0.9}
.photo_detail .photo .play_video:before{ z-index: 5; background: url("../images/play_icon@2x.svg") no-repeat center center; background-size: 18px;}
.photo_detail .photo .video_box video{width: 100%}
.photo_detail .photo video{width: 100%;height: auto;}
.photo_detail .title.fl{float: left;width: 63.5%;padding-bottom: 0;}
.photo_detail .title.fl .introFont{margin-top: 3%;}
.photo_detail .titphoto.fr{float: right;width: 30%;}
.photo_detail .titphoto .imgbox{padding-bottom: 120%;}
.photo_detail .titlebox{display: flex;align-content: flex-end;align-items: flex-end;flex-wrap: nowrap;margin-bottom: 4%;}
.photo_detail .main{padding:6% 0}
.photo_detail .article{margin:0 0 4% 0;text-align: justify;}
.photo_detail .article.en{text-align: justify; color: #999999}
.photo_detail .desc dl:not(:last-child){padding-bottom:3%}
.photo_detail .desc dl dt{color: #999999;padding: 10px 0}
.photo_detail .desc dl dt img{width: 18px; margin-right: 15px;}
.photo_detail .desc dl dd{padding-left: 32px;}
.photo_detail .main .right_par{color: #727171;}
.photo_detail .main .right_par .article:not(:last-child){padding-bottom: 2%}
@media(min-width:768px){
.photo_detail .main{display: flex; justify-content: space-between}
.photo_detail .detail{width: 75%; max-width: 760px;min-height: 290px;}
.photo_detail .desc{width: 23%; padding-left:4%; border-left: solid 1px #e5e5e5}
.photo_detail .desc dl:not(:last-child){padding-bottom: 10%}
}
.photo_detail .pic_box img{ margin-bottom: 6%;}
.other_related .sub_title{text-align: center;padding-bottom: 4%}
.other_related .item{ margin-bottom:1%}

.back_list{text-align: right; float: left;}
.back_list a{position: relative; padding-left: 35px;}
/*.back_list a:not(:hover){ color: #999999}*/
.back_list a:not(:hover) i{opacity: 0.5; left: 0}
.back_list a i{ width: 23px; height: 5px; left: -10px; top: 0; bottom: 0; margin: auto; position:absolute; transition: 0.5s}
.back_list a i:before,
.back_list a i:after{content:''; position: absolute; margin: auto; top: 0; bottom: 0; margin: auto;transition: 0.5s;}
.back_list a i:before{width: 100%; height: 1px; right: 0; background: #000; border-color: #000}
.back_list a i:after{left:-3px; width: 0; height: 0; border: solid 3px transparent; border-right-color: #000}
.next-page{float: right;}
.next-page i{font-family: 宋体;display: inline-block;margin: 0 5px;font-style: normal;font-weight: bold;color: #999}
.next-page a{margin: 0 10px;}
.end_section .end_box .flex_box {padding: 15px 0;}
.end_section .end_box .flex_box.auto_1200{ max-width: 1200px; margin-left: auto; margin-right: auto;}

.next-page a:hover{font-weight: bold;}
.video_files{position: absolute; width: 100%; height: 100%; z-index: 10}
.video_files video{position: absolute; width: 100%; height: 100%; z-index: 2; object-fit: cover}
.video_files .close{position: absolute;right:20px;top: 20px;z-index: 10;width: 30px;height: 30px;border-radius: 50%;background:#9d4016;cursor: pointer;}
.video_files .close::before,
.video_files .close::after{ position:absolute; content:''; width:3px; height:70%; border-radius:3px; background-color:#fff; left:13px; top:5px;}
.video_files .close::before{ transform:rotate(45deg);}
.video_files .close::after{ transform:rotate(-45deg);}

/*index*/
.index_body .top{ height: auto}
.index_body .top .header{background: none}

.index_body .bottom{display: none}
@media(min-width:1024px){
.index_body .top menu li span a{color: #000}
.end_section .end_box .flex_box.auto_1200 .bottom .auto{ width: 100%;}
}

.index_floor{position: absolute; width: 100%;height: 100vh}
.index_floor .link{position: absolute; width: 100%; height: 100%; z-index: 10}
.index_floor .wap{display: none}
.index_floor .pic{height: 100vh}
.index_floor .txt{z-index: 10; color: #00367a91; text-align: center; position: absolute; bottom:10%; left: 50%; transform: translateX(-50%);font-size: 15px;}
.index_floor .txt p{transition: 0.5s}
.index_floor .txt p.t2{transition-delay:0.5s;}
.index_floor .txt .tips{opacity: 0.4; display: block; padding-top: 50px;transition: 0.5s}
.index_floor .swiper-slide:not(.swiper-slide-active) .txt p{opacity: 0}
.index_floor .swiper-slide:not(.swiper-slide-active) .txt p.t1{transform: translateX(-50px) }
.index_floor .swiper-slide:not(.swiper-slide-active) .txt p.t2{transform: translateX(-100px); }
.index_floor .swiper-slide img{width:100%;height:auto;min-height:100%;transition:1s linear 2s;/*transform:scale(1.1,1.1);*/ object-fit: cover;  -o-object-fit: cover;}
/* .index_floor .swiper-slide-active img,
.index_floor .swiper-slide-duplicate-active img{transition:6s linear;transform:scale(1,1);} */

@media(max-width:1024px){
.index_floor .wap{display:block}
.index_floor .pc{display: none}
}
/*index end*/

/* 2024.05.08 */
.info .txt {
    font-size: 0.26rem;
    /* padding-bottom: 2%; */
    
}

.txt_fl dt {
    font-size: 0.3rem;
    line-height: 1;
    height: 1em; overflow: hidden;
    font-weight: 500;width: 100%;
    text-align: justify;
}
.txt_fl dt:after{display: inline-block; content: '';width: 100%; height: 1px; }
.txt_fl dd b {
    font-weight: 500;
    background: #000;
    color: #fff;
    padding: 0.05rem 0.1rem;
    border-radius: 0.08rem;
}

.pagination-images {
    display: flex;
    position: absolute;
    z-index: 99;
    justify-content: center;
}
.pagination-image {
    width: 50px;
    height: 50px;
}

.swiper-button-prev {
    width: 20px;
    height: 20px;
    top: 54%;
    left: 3%;
    background-image: url("../images/prev.png") !important;
    background-repeat: no-repeat;
    background-position: center;
}


.swiper-button-next {
    width: 20px;
    height: 20px;
    top: 54%;
    right: 3%;
    background-image: url("../images/next.png") !important;
    background-repeat: no-repeat;
    background-position: center;
}
.swiper-button-next::after,
.swiper-button-prev::after{ display: none;}
/* 2024.06.12 */

.banner_details {
    display: flex;
    align-items: center;
}

.banner_details .left {
    display: flex;
    flex-direction: column;
    width: 40%;
    padding: 75px;
}

.banner_details .left img {
    width: 70px;
    height: 40px;
}

.banner_details .left .title {
    font-size: 0.4rem;
	font-weight: 600;
	color: #231815;
}

.banner_details .left .number {
    display: flex;
    align-items: center;
    margin-top: 90px;
}

.banner_details .left .number .num {
    display: flex;
    margin-right: 20px;
}
.banner_details .left .number .num .num1 {
    border: 1px solid #231815;
    border-radius: 12px;
    font-size: 0.5rem;
    height: 50px;
    line-height: 24px;
    padding: 10px;
    color: #000000;
}

.banner_details .left .number .num .tit {
    font-size: 0.15rem;
	color: #231815;
    margin-left: 15px;
}

.banner_details .left .ctit {
    font-size: 0.15rem;
    color: #231815;
    margin-top: 50px;
    line-height: 1.2;
}

.banner_details .left p {
    font-size: 0.15rem;
    color: #231815;
    line-height: 1.2;
}

.banner_details .left .ul {
    margin-top: 40px;
}

.banner_details .left .ul li {
    font-size: 0.12rem;
	color: #231815;
}

.banner_details .left .scale {
    font-size: 0.12rem;
	color: #231815;
}

.banner_details .right {
    width: 60%;
}
@media(max-width:1680px) {
    .banner_details .left {
        width: 50%;
    }
    .banner_details .right {
        width: 50%;
    }
}
@media(max-width:1440px) {
    .banner_details .left {
        padding: 50px;
    }
}
@media(max-width:1025px) {
    .banner_details .left {
        width: 100%;
    }
    .banner_details .right {
        width: 100%;
    }
}
@media(max-width:780px) {
    .banner_details {
        flex-direction: column;
    }
    .banner_details .left {
        width: 100%;
        padding: 20px;
    }
    .banner_details .right {
        width: 100%;
    }
}
.swiper-pagination {
    position: relative; 
    text-align: center;
    margin-top: 10px;
}

.swiper-pagination-bullet {
    width: 12px;
    height: 12px;
    background-color: #888;
    opacity: 0.8;
    border-radius: 10px;
    margin: 0 8px;
    cursor: pointer;
    transition: opacity 0.15s ease;
    font-size: 13px;
    color: #000000ab;
    font-weight: 100;
    padding-bottom: 3px;
}

.swiper-pagination-bullet-active {
    background-color: #333;
}


.intro {
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 1s ease-in-out;
    position: fixed;
    z-index: 9999;
    background: #efefef;
    width: 100%;
}

.intro video {
    width: calc(900/1920 *100%)
}

.slide-up {
    transform: translateY(-100%);
}

.main-content {
    opacity: 0;
    transform: scale(0.5);
    transition: opacity 1s ease-in-out, transform 1s ease-in-out;
}
.main-content.show {
    opacity: 1;
    transform: scale(1);
}
.main-content .txt{display: none}
.main-content .swiper-pagination{display: flex; justify-content: center; align-items: flex-end; bottom: 30px!important; margin: 0px 10px}
.main-content .swiper-pagination .swiper-pagination-bullet{width: .6rem; height: 30px; background:none; position: relative;position: relative; opacity: 1}
.main-content .swiper-pagination .swiper-pagination-bullet:after{content: '';left: 0; position: absolute; bottom: 0; width: 100%; height: 4px; background: #fff; transition: 0.5s}
.main-content .swiper-pagination .swiper-pagination-bullet-active{width: auto;border-radius: 0; color: #999;}
.main-content .swiper-pagination .swiper-pagination-bullet-active:after{ background: #000}
/*
 .Banner002187 为demo编号
 */
 .Banner002187 .swiper-slide span {
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    height: 6rem;
    display: block;
}
 .Banner002187 .swiper-slide p{display: none; color: #fff}
 .Banner002187 .swiper-pagination-bullet{color: #ffffff;background: #fff; transition: 0.5s}
.Banner002187 img {
    display: none;
}

@media (max-width: 1000px) {
    .Banner002187 span {
        height: auto;
        background: none;
        height: auto;
    }

    .Banner002187 img {
        display: block;
    }
}

.edit-7{text-align: center; }
.edit-7 .title{font-size: 0.32rem; line-height: 2.5; }
.edit-7 .con{line-height: 2;  font-size: 0.22rem;}
.edit-7 .fs56{ font-size: .28rem;}
.edit-7 .swiper-fade .swiper-wrapper{align-items: center;}
.edit-7 .swiper-fade .title{transform: translateY(0.2rem); opacity: 0; transition: 0.5s 0.3s;}
.edit-7 .swiper-fade .con p{transform: translateY(0.1rem); opacity: 0;transition: 0.5s 0.3s;}
.edit-7 .swiper-fade .con p:nth-child(2){transition-delay: 0.5s;}
.edit-7 .swiper-fade .con p:nth-child(3){transition-delay: 0.8s;}
.edit-7 .swiper-slide{display: flex;align-items: center; justify-content: center; width: 100%!important;}
.edit-7 .swiper-slide-active .con p,
.edit-7 .swiper-slide-active .title{transform: translateY(0); opacity: 1;}
.edit-7 .con p {
    margin-top: 0;
    margin-bottom: 0;
}
.txt_fl dt {
    text-align: center;
    letter-spacing: 0.05rem;
}


html {
    -webkit-text-size-adjust: 100%;
    font-size: 100px;
    overflow-x: hidden;
}

html {
    font-size: 5.2083334vw;
}

@media (max-width:1024px) {
    html {
        font-size: 9.765625vw
    }
}

@media (max-width:480px) {
    html {
        font-size: 14vw
    }
}

@media screen and (min-width:768px){
    
    .main .right_par{
        width: 36.5%;
        font-size: max(0.16rem, 16px);

    }
	.main .right_par b{font-size: max(0.18rem, 16px);}
	
    .photo_detail .detail{
        width: 46.5%;
        color: #595757;
        font-size: max(0.18rem, 16px);
    }
	.photo_detail .article.en{font-size: max(0.14rem, 14px);}
    .other_related2 .photo_list .item {
        width: 49.6%;
        margin-bottom: 2%;
    }
    .photo_detail .title .mp{
        /* font-size: 0.88rem; */
        line-height: 1.5;
    }
    .photo_detail .title .en {
        font-weight: 300;
        line-height: 1;
        /* font-size: 0.48rem; */
        margin-top: 0.36rem;
    }
    /* .other_related2 .photo_list .info {
        padding: 0;
    } */
    .other_related2 .photo_detail .main{
        font-size: max(0.18rem, 14px);
    }
    /* .other_related2 .photo_detail .main ,
    .other_related2 .photo_list .info p{
        font-size: max(0.18rem, 14px);
    } */
    /* .other_related2 .photo_list .info .biaoti {
        font-size: max(0.27rem, 16px);
        line-height: 1;
        margin-top: 0.12rem;
        margin-bottom: 0.08rem;
    } */

    .photo_detail .article p{
        margin-top: 0;
    }
 
}
.introFont{
    font-size: max(0.36rem,16px);
    font-weight: 300;
	line-height: 1.3;
}
.about-body .honor .otherWidth{ max-width: 1165px; margin: 0 auto;}
.about-body .honor .about_title{padding-top: 1.5rem;  margin-bottom: .4rem;}
@media(min-width:1024px){
.about-body .top .header{background: none}
.about-body .banner .info{padding-top: 70px;}
/* .about-body .about-section .ani-con{height: 40%} */
.about-body .about-section{min-height: 100vh; padding-top: 0}
.about-body .groupbox:nth-child(1){min-height: 100vh;}
.about-body .groupbox{position: relative; }
.about-body .groupbox .item{top:0; width: 100%;transition: 0.5s}
.about-body .groupbox.fixed .item{position: fixed;transition: 0.5s}
.about-body .groupbox:nth-child(even) .info{order: 2}
.about-body .groupbox:nth-child(even) .item{background: #e7e7e7}
}
@media(max-width:1024px){
.about-body .banner,
.about-body .banner figure,
.about-body  .ani-con p,
.about-body .about_intro,
.about-body .honor{opacity: 1!important}
.about-body .pin-spacer{padding: 0!important; height: auto!important}
.about-body .about-section{position: relative!important; height:auto!important;max-height:inherit!important;transform:none!important}
.about-body .banner{min-height: inherit}
.about-body .ani-con{position: relative; height: auto; padding-top: 4%}
.about-body .ani-con p{transform:none!important}
.about-body .about_intro{min-height: inherit}
.about-body .about_intro .item{padding: 6% 0}
.about-body .about_intro .txt h4{margin: 2% 0}
.about-body .about_intro .article{padding: 2% 0}
}

.txt_ani {
    will-change: opacity, transform;
}

.pro_Category{ display: flex; align-items: center; padding: 5% 12%; }
.pro_Category dt{ flex-shrink: 0; margin-right: 15%; font-weight: 100;}
.pro_Category dt li{ margin: .15rem 0;}
.pro_Category dt li.on{ font-weight: bold;}
.pro_Category dd{ flex: 1;}
.pro_Category dd .item{ display: none; font-weight: 100; line-height: 2;}
.pro_Category dd .item .ani{ opacity: 0; transform: translateY(.2rem); transition: all 0.5s ease-in-out;}
.pro_Category dd .item.on{ display: block;  }
.pro_Category dd .item.on .ani{ opacity: 1; transform: translateY(0); transition-delay: 2s;}
.Category_list{ position: relative;}
.Category_list::before{ content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 3rem;background: linear-gradient(to bottom, #fff, rgba(255,255,255,0)); z-index: 3; }
.Category_list .photo_list{ display: none;}
.Category_list .photo_list.on{ display: flex;}
.Category_list .photo_list .item{width: 100%}
.Category_list .photo_list .pic figure{ padding-bottom: 31%;}
.pro_detail .title{ display: flex; justify-content: space-between; align-items: center; padding-bottom: .6rem;}
.pro_detail .title_photo .title{width: 90.5%; margin: auto;}
.pro_detail .photo{position: relative;/* margin-top: 40px; */ overflow: hidden;}
.pro_detail .photo .swiper{ width: 100%; margin: 0 auto; }
.pro_detail .photo figure{/*padding-bottom:35.7335%;*/padding-bottom: 48.871%}
.pro_detail .photo figure img{ width: 100%;object-position:top}
.pro_detail .photo .img_box img{width: 100%}
.pro_detail .photo .play_video{cursor: pointer; z-index: 10; width:.65rem; height: .65rem; /* padding:2.88%; */ position: absolute; margin: auto; left: 50%;top: 50%;/* right: 0;  bottom: 0;*/transform: translate(-50%, -50%);}
.pro_detail .photo .play_video:before,
.pro_detail .photo .play_video:after{content: ''; position: absolute; width: 100%; height: 100%;}
.pro_detail .photo .play_video:after{background: #fff; border-radius: 100%; opacity: 0.9}
.pro_detail .photo .play_video:before{ z-index: 5; background: url("../images/play_icon@2x.svg") no-repeat center center; background-size: 18px;}
.pro_detail .photo .video_box video{width: 100%}
.pro_detail .photo video{width: 100%;height: auto;}
.pro_detail .video_files{ left: 0; top: 0;}

.CarouselImg{ margin: 3% 0; }
.CarouselImg .auto{ max-width: 1024px;}
.CarouselImg .title{ justify-content: center; margin-bottom: .4rem; color: #000;}
.CarouselImg .mySwiper{width: 95%; margin: auto}
.CarouselImg .box{ position: relative; overflow: hidden;/* border-radius: .8rem;*/ }
.CarouselImg .box figure{ position: relative; padding-top: calc( 680 / 1200 * 100% );}
.CarouselImg .box img{ width: 100%; height: 100%; position: absolute; left: 0; top: 0; object-fit: cover; -webkit-object-fit: cover; transition: all 0.5s;}
.CarouselImg .box:hover img{ transform: scale(1.05);}
.CarouselImg .box .txt{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; max-height: 100%; overflow: auto; color: #000000; padding: .75rem .5rem;}
.CarouselImg .page_btn{ position: relative; margin: .55rem 0 0; display: flex; align-items: center; justify-content: space-between; width: 100%;}
.CarouselImg .page_btn .swiper-button,
.CarouselImg .page_btn .swiper-pagination{ position: relative; top: auto; background-color: #e2e2e5;  margin: auto 0; bottom: auto;left: auto; right: auto; }
.CarouselImg .page_btn .swiper-pagination{ width: auto; padding: 0 .3rem; border-radius: .25rem; display: inline-flex; align-items: center; justify-content: center; height: .25rem; }
.CarouselImg .page_btn .swiper-button{ width: .42rem; height: .42rem; background: url(../images/prev2.png) no-repeat center !important; background-size: contain!important; opacity: 0.35;}
.CarouselImg .page_btn .swiper-button-next{ background-image: url(../images/next2.png)!important; }
.CarouselImg .swiper-pagination-bullet{ background-color: #636365; width: .08rem; height: .08rem; margin: 0 .05rem!important; opacity: 0.3; border-radius: .5rem; }
.CarouselImg .swiper-pagination-bullet-active{ width: .5rem;opacity: 1;}
.CarouselImg .page_btn .swiper-button:hover{opacity: 1;}

.ContentIntro_pro{ line-height: calc( 40 / 20); color: #727171; display: flex; align-items: center; padding-bottom: calc( 100 / 1920 * 100vw); }
.ContentIntro_pro .pic{ width: calc( 1032 / 1920 * 100%); text-align: right; overflow: hidden; padding-bottom: calc( 680 / 1920 * 100vw);position: relative;z-index: 2;}
.ContentIntro_pro .pic img{position: absolute;top: 0;left: 0;height: 100%;width: 100%;object-fit: contain;transition: all .5s;}
.ContentIntro_pro .textwarp{ width: calc( 100% -  1032 / 1920 * 100%);}
.ContentIntro_pro .textwarp .box{ max-width: 760px; padding:.2rem .8rem; text-align: justify; }
.ContentIntro_pro .textwarp .box .title2{ color: #000;}

.Carousel_other{ padding: 0 0 1.4rem; overflow: hidden;}
.Carousel_other .page_btn{ position: relative; margin: .55rem 0 0; display: flex; align-items: center; justify-content: center; width: 100%; gap: .35rem;}
.Carousel_other .page_btn .swiper-button,
.Carousel_other .page_btn .swiper-pagination{ position: relative; top: auto; background-color: #e2e2e5;  margin: auto 0; bottom: auto;left: auto; right: auto; }
.Carousel_other .page_btn .swiper-pagination{ width: auto; padding: 0 .3rem; border-radius: .25rem; display: inline-flex; align-items: center; justify-content: center; height: .25rem; }
.Carousel_other .page_btn .swiper-button{ width: .42rem; height: .42rem; background: url(../images/prev2.png) no-repeat center !important; background-size: contain!important;opacity: 0.35;}
.Carousel_other .page_btn .swiper-button-next{ background-image: url(../images/next2.png)!important; }
.Carousel_other .swiper-pagination-bullet{ background-color: #636365; width: .08rem; height: .08rem; margin: 0 .08rem!important; opacity: 0.3; border-radius: .5rem; }
.Carousel_other .swiper-pagination-bullet-active{ width: .5rem;opacity: 1;}
.Carousel_other .page_btn .swiper-button:hover{opacity: 1;}
.Carousel_other figure img{ width: 100%;}
@media(max-width:1024px){
    .pro_detail .fs60{ font-size: .5rem;}
    .pro_detail .photo{ margin-bottom: .8rem;}
    .pro_detail .photo .swiper{ border-radius: .25rem;}
    .ContentIntro_pro{ flex-wrap: wrap; padding: .8rem 0;}
    .ContentIntro_pro .textwarp,
    .ContentIntro_pro .pic{ width: 100%;}
    .ContentIntro_pro .pic{ text-align: center; margin-bottom: .5rem;}
    .pro_detail .photo figure{ height: 100vh;}
}

.project_section{background: #fff; position: relative; z-index: 10}

.project_banner{position: fixed;}
.project_banner img{width: 100vw;height: 100vh; object-fit: cover; -o-object-fit: cover;}
.project_banner .item{position: relative}
.project_banner .txt{position: absolute; text-align: center; width: 100%; top: 50%; transform: translateY(-50%); color: #fff;}
.project_banner .txt span{display: inline-block;line-height: 2}
.project_banner .txt h2 span{border-top: solid 2px #fff}

.project_group {padding-top: 5%; padding-bottom: 3%; max-width: 1200px; margin: auto}
.project_group_pro{ padding: 0; max-width: 100%;}
.project_group .group{margin: 3% 0;}
.project_group .video_item video{width: 100%; display: block}
.project_group .photo_item img{width: 100%}
.project_group .article{margin: 3% 0; font-size: .18rem; color: #727171; text-align: justify}
.project_group .photo_item{padding: 1% 0;}
.project_group .en{color: #999999; font-size: .14rem;}
.project_group .Arrows_Dots{position: relative; max-width: 620px; min-height: 42px; margin: auto; display: flex; justify-content: center; padding: 3% 0}
.project_group .slick-arrow{min-width:42px; min-height:42px; background: #e2e2e5}
.project_group .slick-arrow:after{content: '';position: absolute;left: 0; top: 0; width: 100%; height: 100%; background: no-repeat center center; background-size: contain}
.project_group .slick-arrow.slick-prev:after{background-image: url(../images/prev2.png)}
.project_group .slick-arrow.slick-next:after{background-image: url(../images/next2.png)}
.project_group .slick-arrow:not(:hover) {opacity: 0.35}
.project_group .slick-dots{background: #e2e2e5; border-radius: 20px;width: auto; padding: 1px 10px; transition: 0.5s}
.project_group .slick-dots li{box-shadow: none}
.project_group .slick-dots li button{background: #5c5c5e; width: 7px; height: 7px; transition: 0.5s; border-radius: 5px;border: none;}
.project_group .slick-dots li.slick-active{box-shadow: none;width: 40px;}
.project_group .slick-dots li.slick-active button {width: 40px;}
.contact_box{ padding:3% 2% 0; font-size: 14px; position: relative; z-index: 1; }
.contact_box .main{max-width: 1840px; margin: 0 auto; display: flex; justify-content: space-between; flex-wrap: wrap; }
.contact_box .cloumn_font{ padding-top: 0; font-size: calc( 140 / 1920 * 100vw); line-height: 1; font-weight: normal; margin-bottom: calc( 90 / 1920 * 100vw);}
.contact_box .left{ width: 40%; flex-shrink: 0; margin-right: 2%; position: relative; padding-bottom: 100px;}
.contact_box .right{ flex: 1;}
.contact_box .content .ul{ display: flex; max-width: 340px; flex-wrap: wrap; margin-bottom: 20px;}
.contact_box .content .ul li{ width: 50%; margin-bottom: 20px;}
.contact_box .content .ul li p{ margin: 0; color: #898989;}
.contact_box .ewmbox{ display: flex; flex-wrap: wrap; text-align: center; gap: 25px;}
.contact_box .ewmbox figure{ width: 60px;}
.contact_box .ewmbox figure img{ width: 100%; margin-bottom: 5px; display: block; }
.contact_box .ewmbox figure p{ margin: 0; color: #727171; }
.contact_box .share{ position: absolute; left: 0; bottom: 6%; width: 100%; display: flex; flex-wrap: wrap; gap: 20px;}
.contact_box .share a{ display: inline-flex; width: 25px; height: 25px; align-items: center; justify-content: center;}
.contact_box .share img{ max-height: 100%;}
.contact_box .right{ position: relative; z-index: 1;}
.contact_box .right .img{ width: 91%; max-width: 900px;}
.contact_box .right .en{ position: absolute; right: 3.5%; top: 0;}
.contact_box .right .en span{ writing-mode: vertical-rl; font-size: 20px; color: #000000; padding-left: 30px; line-height: 1.4; position: relative;}
.contact_box .right .en span::before,
.contact_box .right .en span::after{ content: ''; position: absolute; left: 0; top: 0; background-color: #000; width: 2px;}
.contact_box .right .en span::before{ height: 84%;}
.contact_box .right .en span::after{ height: 97%; left: 10px; opacity: .5; }
.contact_box::before{ content: ''; position: absolute; right: 0; bottom: 6.5%; width: 65%; height: 50%; background-color: #dcdddd; z-index: -1;  }
@media(max-width:750px){
    .contact_box .left{ width: 100%;}
    .contact_box .right{ width: 100%; flex: auto;}
    .contact_box::before{ height: 25%; width: 100%;}
    .contact_box .right .en span{ font-size: .75em;}
}