﻿@charset "utf-8";

/* CSS Document  */

@media screen and (max-width: 2600px) {

}



@media screen and (max-width: 1920px) {

}



@media screen and (max-width: 1800px) {

	

}



/* 1680 */

@media screen and (max-width: 1680px) {

    .about .infobox .conbox .lbox{padding-right:80px;}
    .conbox .lbox .textbx{font-size:14px;}

    .contact .conbox .lbox{padding-right:80px;width: 40%;}
    .contact .conbox .rbox{width: 60%;}
}



/* 1440 */

@media screen and (max-width: 1440px) {
.conbox .lbox{padding-right:40px;padding-left: 40px;width: 300px}
.mrtlg{margin-top:40px;}

.about .infobox .conbox .lbox{ width:60%;padding-left: 40px;}
.about .infobox .imgbx{padding-top: 130px;}
.about .storycs{font-size: 14px;}
/*.contact .qrbx{flex-flow: column;}*/
.contact .qrbx .textbx{padding-left:0;text-align:center;}
.contact .addrbx p{font-size:14px;}

    .contact .conbox .lbox{padding:0 40px;width:55%;}
    .contact .conbox .rbox{width:45%;}
    .gongyi .imgbx, .service .imgbx,.question .imgbx{width: 80%;}
    .footer .container{padding-left: 40px;}
    .conbox .rbox{width: calc(100% - 300px);}
    .lmenu{left: 80px;}

}

/* 1366 */

@media screen and (max-width: 1366px) { 

}



/* 1280 */

@media screen and (max-width: 1280px) {

	


}



/* 1152 */

@media screen and (max-width: 1152px) {

}



/* 1024 */

@media screen and (max-width: 1024px) {

}



/* 860 */

@media screen and (max-width: 860px) {
	
body,html{/*隐藏滚动条，当IE下溢出，仍然可以滚动*/-ms-overflow-style:none;/*火狐下隐藏滚动条*/ scrollbar-width: none;/*解决ios上滑动不流畅*/-webkit-overflow-scrolling: touch;}
::-webkit-scrollbar{display: none; }/*Chrome下隐藏滚动条，溢出可以透明滚动*/


img{ max-width:100%;}
.mrtbx{margin-top:40px;}
.mrbbx{margin-bottom:40px;}
.mrtdf{ margin-top:10px;}
.mrtlg{ margin-top:20px;}


.fssm{ font-size:12px;}
.fsdf{ font-size:14px;}
.fslg{ font-size:20px;}
.fsxl{ font-size:50px;}

.navbox{ width:100%;background:rgb(255,255,255,0.9); border-right:none;}
.navbox .menu{width:100%;padding:0 7%;z-index:9999; border-bottom:1px solid rgb(0,0,0,0.1);}
.navbox .menu .content{ height:50px; width:100%; flex-flow: nowrap; padding:0;}
.navbox .menu .logo{ padding-top:0;}
.navbox .menu .logo img{width:100%;height: auto}
.navbox .menu .share a img{left:100%; bottom:-3vh;}
.navbox .menu .nav-trigger i{ font-size:24px;}
.navbox .menu .share{ display:none !important;}

.navbox .menu_nav{ width:100%; left:100%; padding-left:0; border-right:none; background-color:#717171;}
.navbox .menu_nav li a{color:#fff; }
.navbox .menu_nav .content{ align-items: center;justify-content:center; text-align:center;}



.navbtn { margin:0;flex-grow:initial;}
.nav_trigger{padding:5px;height:30px;width:30px;}
.nav_trigger span{width:20px;height:2px;margin:0;}
.nav_trigger span:nth-child(2){margin-top:5px;width:20px;}
.nav_trigger span:nth-child(3){margin-top:5px;}
.nav_trigger:hover span:nth-child(2){width:20px;}

.nav_open .nav_trigger span{margin:0;position:absolute; height:1px;background-color:#fff;}
.nav_open .nav_trigger span:nth-child(1){-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);-o-transform:rotate(45deg);transform:rotate(45deg);}
.nav_open .nav_trigger span:nth-child(2){opacity:0;}
.nav_open .nav_trigger span:nth-child(3){-webkit-transform:rotate(-45deg);-ms-transform:rotate(-45deg);-o-transform:rotate(-45deg);transform:rotate(-45deg);}
.nav_open .nav_trigger span{ margin:0;}
.nav_open .menu .logo i{color:#fff;}
 

.navbox .menu_nav .share { padding:40px 0;}
.navbox .menu_nav .share a{ margin:0 10px;margin-bottom:0;}
    
.navbox .menu_nav .share a i{ font-size:24px;}
.navbox .menu_nav .share a img{left:50%; bottom:30px;margin-left:-50px;-webkit-transform: translateX(300%); -ms-transform: translateX(300%); transform: translateX(300%);}
.navbox .menu_nav .share a:hover img{opacity:1;-webkit-transform: translateX(0%); -ms-transform: translateX(0%); transform: translateX(0%); }

.navbox .menu_nav .logo a{width:109px; height:43px;}
.navbox .menu_nav ul{ padding-bottom:30px; margin-bottom:30px;padding-top:40%;}
.navbox .menu_nav li{ margin:5px auto;}
.navbox .menu_nav li:last-child:after{width:40px; left:50%; margin-left:-20px; bottom:-40px;}
.navbox .menu_nav li a{ font-size:18px;line-height:46px;font-weight:bold;}
.nav_open .menu_nav{left:0;}
.menu_nav .logo{ display:none !important;}
.nav_open .menu .logo{ opacity:1;}

.nav_trigger:hover span{ background-color:#9a9a9a !important;}
.index .nav_trigger:hover span,
.index .nav_open .nav_trigger span,
.nav_open .nav_trigger:hover span{ background-color:#fff !important;}
.nav_open .menu{border-bottom:1px solid rgb(255,255,255,0.1);}
    
    

/*.index .nav_open .menu .logo i{ color:#666;}*/

/*---菜单end---*/
.container{ width:100%;}
.conbox { padding-bottom:0;width:100vw; padding-top:70px;flex-flow: column;}
.conbox .lbox{ width:100%;padding-left:20px; padding-right:20px; padding-bottom:20px; display:flex;}
.conbox .rbox{ width:100%;}

.conbox .lbox .tabhd a,
.conbox .lbox .tabhd a span{ line-height:1em;}
.conbox .lbox .tabhd a{ margin-bottom:12px;}



.titlebox h3{font-size:20px; line-height:1.2;}
.titlebox p{ font-size:20px;padding-top:5px;line-height:1.2;}

.footer .container{padding-left:0;}
.footer .conbx{ padding:15px 0 0 0;flex-flow:column;}
.footer .conbx .areabx{width:100%; padding:0 20px;}
.footer .linkbx{ padding-left:10px; margin-left:0px;}
.footer .copybx{padding:10px 20px;text-align:left;}
.rolling-top {display: none!important;}
/*.tabhd{ display:flex; overflow-y:scroll;}
.tabhd>div{ margin-right:20px;}*/


.index-banner .pic span{ background-size:auto 100%;}
.index-banner .text {width:26%;margin-left:0;top:170px;padding:0 8%;}
.index-banner .text .line{margin-top:20px;margin-bottom:20px;width:60px;}
.index-banner .text .fssm{ font-size:14px;}
.index-banner .text .fsdf{ font-size:16px;}
.index-banner .text .fslg{ font-size:20px;}
.index-banner .text .fsxl{ font-size:30px;}

.index-banner .text.left {left:0; margin-left:0;}
.index-banner .text.right{right:0;}
.index-banner .text.tcbox h6{ position:relative; bottom:auto;}
.index-banner .text.tcbox h6 p{ margin-right:10px;}
.index-banner .text.tcbox h6 p span{margin-bottom:10px;}
.index-banner .swiper-pagination {bottom:4vh;padding-right:0;text-align: center;}

	

.topbx{ padding-top:50px;} 

.index .conbox{}
.index .conbox .lbox{ width:35%; }
.index .conbox .rbox{ width:65%;}


 .story .conbox{}

.businessbx .conbox{flex-flow:column;}
.businessbx .conbox .lbox,
.businessbx .conbox .rbox{ width:100%;}
.businessbx .conbox .lbox .titlebox{ width:35%; }
.businessbx .conbox .lbox .infobx{ width:75%; overflow:hidden;}
.businessbx .tablist{ margin-top:20px;}
.businessbx .tablist ul{gap:10px;}

.businessbx .tablist li .textbx font.titlebox{ font-size:20px;}


.about .infobox .imgbx{width:100%;padding-top: 0}
.about .infobox .conbox .lbox{ width:100%;padding:20px;flex-flow: column; margin-bottom:20px;}
.about .infobox .conbox .lbox .titlebox{ width:100%; margin-bottom:20px;}
.about .infobox .conbox .rbox{ width:100%;}

    
.story .tabhd.mrtlg{margin-top:30px;display: flex;flex-wrap: wrap;}
.story .tabhd.mrtlg div{width: 50%;}
    
.contact{ padding-bottom:100px;}

.contact .conbox .lbox{flex-flow: column; padding-right:20px;}
.contact .conbox .lbox,
.contact .conbox .rbox{ width:100%;}

.contact .conbox .lbox .titlebox,
.contact .conbox .lbox .infobx{ width:100%;}

.contact .addrbx,
.contact .qrbx{flex-flow:nowrap; }
.contact .addrbx h3{ font-size:16px; margin-bottom:5px; font-weight:bold;}
.contact .addrbx p{ font-size:12px;}
.contact .qrbx .textbx{padding-left:20px;text-align:left}


.indexbx .businessbx .conbox .lbox{display:block;padding:0 3% 8% 3%;}
.indexbx .businessbx .conbox {padding-top: 50px;}
.businessbx .conbox .lbox .titlebox {padding-bottom:10%;}
.indexbx .businessbx .conbox .lbox .infobx{width: 100%;}
.indexbx .businessbx .conbox .lbox .mrtlg{display: flex;    flex-wrap: wrap;}
.indexbx .businessbx .conbox .lbox .mrtlg div{width: 50%;}
.indexbx .businessbx .tablist li{}
.indexbx .businessbx .tablist li:first-child{}
.indexbx .mrtbx{margin-bottom: 0}
.indexbx .mrtbx{padding-bottom: 0}

.nav_open .menu .logo i {color: #fff!important;}
.about .infobox .conbox .lbox {padding:0 3% 10% 3%;}


.contact .conbox .lbox {padding:0 3% 8% 3%;}
.businessbx .tablist li .textbx {opacity:1;background:none;left: 5%; bottom: 10%;height: auto; text-align: left;width:90%;justify-content: left;align-items: normal;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;}
.businessbx .tablist li .textbx font.fssm {display:none;}
.businessbx .tablist li .textbx font.titlebox {font-size:14px}
.businessbx .tablist li {}

.index-banner .text .line {margin-top:-100px; margin-bottom: 7px;}


.fontb1 {font-size:30px;}
.fontl1 {font-size: 20px;}
.fontlb2 {font-size: 20px;}
.fontlb2 strong{font-size: 20px;}
.footer .linkbx:before {display:none;}
.footer .copybx span {display: inline-block;padding-left: 0px;margin-left: 10px}

.navList li .lang_en {opacity:1;}
.navList li.active .lang_en {opacity:0;}
.navList li a:hover .lang_cn {opacity:0;}

    .logowz{left:16%;top:0;font-size:18px;text-align: left;margin-top:3px;}
    .logowz h3{font-size: 14px;}
    
    .banner span.swiper-pagination-bullet{width: 20px;margin: 0 10px;}
    .indexvideo .conbox .rbox{width: 100%;}
    .indexvideo .more{margin-top: -40px;padding-right:2%;}
     .indexvideo .videolist li{width: calc(33% - 1.0vw);}
    .indexvideo .videolist li:last-child{display: none}
    .question .conbox .lbox,.gongyi .conbox .lbox{width: 100%;padding: 0 3% 10% 3%;}
    .question .imgbx,.gongyi .imgbx{width: 100%;}
    .questionbx,.gongyibx{padding: 50px 3% 10% 3%;}
    .gongyibx ul{display: block}
    .gongyibx ul li{width: 100%;}
    
    .story .conbox .lbox,.story .conbox .rbox,.storyshow .conbox .lbox,.storyshow .conbox .rbox{width: 100%;}
    .storyshow .conbox .rbox img{width: 100%;height: auto;}
    .lmenu{left: 3%;position:relative;top:0;width: 100%;}
    .storybox{padding-bottom: 80px;}
    /*.storybox .tablist li:first-child{height: 70vw}*/
    .storybox .tablist li{/*height:32.5vw*/}
    .storybox .tablist li .textbx font.fssm{display: none}
    .about .mrtlg{margin-top: 0}
        
    .sharing .conbox .rbox{width: 100%;}
    .sharing .videolist li{width: calc(50% - 1.0vw);}
    .shareshow .lmenu{top:120px;}
    .shareshow .conbox .rbox{width: 100%;text-align: center;}
 
    .index-banner .fontlb2{right:34%;top:190px;display: none}
    .index-banner .fontb1{display: none}
    .storybox .tablist li .textbx font.titlebox{font-size: 20px;}
    
}

 





/* iphone5 */

@media only screen and (min-device-width : 320px) and (max-device-width : 568px) {

.index-banner .text {width:30%;margin-left:0;top:150px;padding:0 8%;}
.index-banner .fontlb2{right:37%;top:170px;}
.logowz{left:20%;top:0;font-size:18px;text-align: left;margin-top:3px;}

}



/* phone 678 */

@media only screen and (device-width : 375px) and (device-height : 667px) and (-webkit-device-pixel-ratio : 2) {

	

}



/* phone 678 plus*/

@media only screen and (device-width : 414px) and (device-height : 736px) and (-webkit-device-pixel-ratio : 3) {

	

}





/* phone x 和 微信内高*/

@media only screen and (device-width : 375px) and (device-height : 812px) {

	

}





/* phone x */

@media screen and (max-width : 736px) and (orientation: landscape) {

}





/* all iPad */

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px)  {





}



/* iPad x */

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {









}



/* iPad y */

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {









}





/* all iPad pro */

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (-webkit-min-device-pixel-ratio: 2) {



}



/* x iPad pro */

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) and (-webkit-min-device-pixel-ratio: 2) {





}



/* y iPad pro */

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) and (-webkit-min-device-pixel-ratio: 2) {



}



/*兼容IE11*/

@media screen and(-ms-high-contrast:active),(-ms-high-contrast:none){



}











