@charset "gb2312";
@import "iconfont.css";

*{ margin:0px; padding:0px; border:0; }
body { -webkit-text-size-adjust: 100%; }
html, body { width:100%;  margin:0px; padding:0; -webkit-font-smoothing:antialiased;   font-family:Microsoft YaHei, arial, sans-serif !important;  font-size:16px;  background:#fff; }
div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,blockquote,img,button {border:0;  padding:0; margin:0; font-weight:normal; } 
h1,h2,h3,h4,h5,h6,p,em,i,b,span,strong { margin:0; padding:0; font-weight:normal; font-style:normal;}
table,td,tr,th{font-size:12px;}
li{list-style-type:none;list-style:none;}
img{vertical-align:top;border:0;}
ol,ul {list-style:none;}
address,cite,code,th {font-weight:normal;font-style:normal;}
img:hover { opacity:1; filter: alpha(opacity=100); }
code, kbd, pre, samp { font-family: courier new, courier, monospace; }
small { font-size: 12px; }
legend { color: #000; }
fieldset, img { border: 0; }
button, input, select, textarea { font-size: 100%; }
.fl { float:left; }
.fr { float:right; }
a { color: #333; text-decoration: none; transition:all ease-out .3s 0s;-webkit-transition:all ease-out .3s 0s;}
a:hover{ color:#098144; text-decoration:none; }
div,ul,li,h1,h2,h3,h4,h5,h6,dl,dd,dt,p,i,em,b,span,td,tr,a,strong,input,textarea,blockquote,img,button,font { box-sizing:border-box; -webkit-box-sizing:border-box; }


.fadeInUp {-webkit-animation-name: fadeInUp; animation-name: fadeInUp; }
@-webkit-keyframes fadeInUp {
from { opacity: 0;-webkit-transform: translate3d(0, 100%, 0);transform: translate3d(0, 100%, 0);}
to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
}

@keyframes fadeInUp {
from { opacity: 0;-webkit-transform: translate3d(0, 100%, 0);transform: translate3d(0, 100%, 0);}
to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
}

.fadeInDown {-webkit-animation-name: fadeInDown; animation-name: fadeInDown; }
@-webkit-keyframes fadeInDown {
from { opacity: 0;-webkit-transform: translate3d(0, -100%, 0);transform: translate3d(0, -100%, 0);}
to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
}

@keyframes fadeInDown {
from { opacity: 0;-webkit-transform: translate3d(0, -100%, 0);transform: translate3d(0, -100%, 0);}
to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
}

.fadeInLeft {-webkit-animation-name: fadeInLeft; animation-name: fadeInLeft; }
@-webkit-keyframes fadeInLeft {
from { opacity: 0;-webkit-transform: translate3d(-100%, 0, 0);transform: translate3d(-100%, 0, 0);}
to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
}

@keyframes fadeInLeft {
from { opacity: 0;-webkit-transform: translate3d(-100%, 0, 0);transform: translate3d(-100%, 0, 0);}
to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
}

.fadeInRight {-webkit-animation-name: fadeInRight; animation-name: fadeInRight; }
@-webkit-keyframes fadeInRight {
from { opacity: 0;-webkit-transform: translate3d(100%, 0, 0);transform: translate3d(100%, 0, 0);}
to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
}

@keyframes fadeInRight {
from { opacity: 0;-webkit-transform: translate3d(100%, 0, 0);transform: translate3d(100%, 0, 0);}
to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
}
.animated { animation-duration: 1s; animation-fill-mode: both;}



/*input字体*/
:-moz-placeholder { color: #999999;}
::-moz-placeholder { color: #999999;}
input:-ms-input-placeholder,textarea:-ms-input-placeholder { color: #999999;}
input::-webkit-input-placeholder,textarea::-webkit-input-placeholder { color: #999999;}

select {
/*Chrome和Firefox里面的边框是不一样的，所以复写了一下*/
border: solid 1px #d9d9d9; text-indent: 1em;
/*很关键：将默认的select选择框样式清除*/ 
appearance: none; color: #999999;  -moz-appearance: none;  -webkit-appearance: none;
/*在选择框的最右侧中间显示小箭头图片*/
background: url(http://www.motus.com.cn/cn/images/selectarr.png) no-repeat scroll 95% center transparent;
/*为下拉小箭头留出一点位置，避免被文字覆盖*/
padding-right: 14px;
}
/*清除ie的默认选择框样式清除，隐藏下拉箭头*/
select::-ms-expand { display: none;}

.amn3 { transition:all ease-out .3s 0s; -webkit-transition:all ease-out .3s 0s; }
.amn4 { transition:all ease-out .4s 0s; -webkit-transition:all ease-out .4s 0s; }
.amn5 { transition:all ease-out .5s 0s; -webkit-transition:all ease-out .5s 0s; }

.amn { transition:all ease-out .3s 0s; -webkit-transition:all ease-out .3s 0s;}
.amn img { transition:all ease-out .3s 0s; -webkit-transition:all ease-out .3s 0s; }
.amn:hover img { transform:scale(1.05); -webkit-transform:scale(1.05); }

.amn2 { transition:all ease-out .3s 0s; -webkit-transition:all ease-out .3s 0s;}
.amn2 img { transition:all ease-out .3s 0s; -webkit-transition:all ease-out .3s 0s; }
.amn2:hover img { transform:scale(1.1); -webkit-transform:scale(1.1); }



/*AI游园应答*/
#id1 { position: fixed; z-index:9999; top:115px; right:30px; height:calc( 100vh - 130px); }
#chat-icon { cursor: pointer; transition: transform 0.5s ease;  z-index:888;  }

#info-container { max-width: 600px; margin:40px auto; padding:20px; background: #fff; border-radius:8px; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); display: none; }
#info-container h2 {color: #333;  margin-bottom: 20px; }
#info-container p {  margin: 10px 0; font-size: 16px;  color: #555; }
#info-container span {  color: #4f8cff;  font-weight: bold; }

.header_all { width:100%; position:fixed; top:0; z-index:666; height:150px;}
.header_all .nav-logo { position:absolute; left: 50%; margin-left: -600px;  display:flex; align-items:center; justify-content: center;  width: 150px; height: 150px; background: #fff; border-radius:0 0 20px 20px; box-shadow: 0px 0px 4px rgba(0,0,0,.1); }
.header_all .nav-logo img { max-width: 106px; }

.header1 { width:100%; float: left; background:rgba(245,245,245,.9); height: 50px; box-shadow: 0px 0px 4px rgba(0,0,0,.1);height: 50px; }
.header1 .name { position:absolute; z-index:5; left:50%; margin-left: -420px;}
.header1 .name font { float: left;  height: 50px;  display:flex; align-items:center; margin-right: 15px; }

.header2 { width:100%; float: left;background:linear-gradient(90deg, rgba(0,153,68,1), rgba(0,140,214,1)); /*background:linear-gradient(to right, rgba(9,129,68,1), rgba(14,127,113,1));*/height: 50px; box-shadow: 0px 0px 4px rgba(0,0,0,.1);}
.header2 #nav { position:absolute; z-index:5; left:50%; margin-left: -420px; }
.header2 #nav li { float: left;  margin-right:36px; padding:0 0 18px 0; cursor: pointer;}
.header2 #nav li font { color:#fff; line-height:49px; font-size:16px; padding:0 0 0 0; display:inline-block; }
.header2 #nav li span { height:3px; opacity:0; width:1%; background:#fff100; overflow:hidden; display:block; transition:all ease-out .3s 0s;-webkit-transition:all ease-out .3s 0s; margin-top: -2px;}
.header2 #nav li:hover font { color:#fff; }
.header2 #nav li:hover span { opacity:1; width: 100%;}
.header2 #nav li.navon font { color:#fff;}  /*菜单经过停留效果*/
.header2 #nav li.navon span { opacity:1; width: 100%;} /*菜单经过停留效果*/

.header2 #nav li .subnav { overflow:hidden; display:none; width:140px; position:absolute; top:50px; padding:12px 16px 16px;  background:#fff;border-radius:0 0 20px 20px;  box-shadow: 0px 0px 4px rgba(0,0,0,.1);  }
.header2 #nav li .subnav dl { width: 100%; float: left; margin:5px 0;  }
.header2 #nav li .subnav dl dt { width: 100%; float: left; line-height:30px; font-size:16px;font-weight: 600; text-align: left; }
.header2 #nav li .subnav dl dt a {color:#0e7f71;  padding:0 16px; }
.header2 #nav li .subnav dl dt a:hover {color:#0e7f71; text-decoration: underline; }
.header2 #nav li .subnav dl dd { width: 100%; float: left; line-height:22px;  font-size:15px; text-align: left;  }
.header2 #nav li .subnav dl dd a {  width: 100%; float:left; color:#444;  margin: 2px 0; padding:8px 16px;  transition:all ease-out .4s 0s; -webkit-transition:all ease-out .4s 0s;  }
.header2 #nav li .subnav dl dd a:hover { background:rgba(0,0,0,.05);  border-radius:5px; }


.header2 .version { position:absolute; height: 50px; right: 50%; margin-right: -600px; text-align: right; }
.header2 .version ul li { float: left; color:#000; line-height:32px; font-size:14px; margin-left: 10px; margin-top: 9px; }
.header2 .version ul li img { height: 120px; margin-top: -48px; margin-left: 5px; }
.header2 .version ul li a { background:linear-gradient(to right, rgba(255,255,255,.3), rgba(255,255,255,0.1));  border-radius:40px; display: inline-block; padding:0 14px 0 18px; color: rgba(255,255,255,1); transition:all ease-out .3s 0s;-webkit-transition:all ease-out .3s 0s; }
.header2 .version ul li a i { margin-left: 2px;color: rgba(255,255,255,1);  transition:all ease-out .3s 0s;-webkit-transition:all ease-out .3s 0s;}
.header2 .version ul li a:hover { color: #fff; background:linear-gradient(to right, rgba(245,164,35,1), rgba(236,102,82,1));  }
.header2 .version ul li a:hover i { color: #fff;  }

.model_btn .toggleMenu { display:none;}
.model_menu { display:none;}
.mobnav { display: none;}	

.nav-dots { position: fixed; right: 15px; top:calc(50% + 48px); transform: translateY(-50%); z-index: 100; display: flex; flex-direction: column; gap: 16px; }      
.dot { width: 12px;  height: 12px;  background-color: rgba(0,0,0,.8); border-radius: 50%; cursor: pointer; transition: all 0.4s ease; 
display: flex; align-items: center; justify-content: center; }      
.dot.active { background-color: #e77817;  transform: scale(1);/*  box-shadow: 0 0 10px rgba(0,0,0,0.8); */}      
.dot:hover { transform: scale(1); background-color:linear-gradient(to right, rgba(245,164,35,1), rgba(236,102,82,1)); }    
.dot-number { font-size: 0; opacity: 0;  transition: all 0.3s ease;}
.dot:hover .dot-number {  font-size: 10px; opacity: 1; color:#333; }

.progress-bar { position: fixed;  bottom: 0;  left: 0; height: 0px;  
background: linear-gradient(to right, #ff8a00, #da1b60);  z-index: 100; transition: width 0.3s ease; }

.scroll-hint {  position: fixed;  bottom: 30px;  left: 50%;  transform: translateX(-50%); color: white;  font-size: 1.2rem;  opacity: 0.8; 
animation: bounce 2s infinite;  z-index: 100;  display: flex; flex-direction: column; align-items: center; gap: 10px; }    
 @keyframes bounce {
0%, 20%, 50%, 80%, 100% {transform: translateY(0) translateX(-50%);}
40% {transform: translateY(-20px) translateX(-50%);}
60% {transform: translateY(-10px) translateX(-50%);}
}


.containerA { height: 100vh; overflow-y: scroll;  scroll-snap-type: y mandatory;  scroll-behavior: smooth; }
        
.screen { height: 100vh; scroll-snap-align: start;  flex-direction: column;  display: flex; align-items: center;  justify-content: center;
position: relative;  transition: background 1.2s ease;  overflow: hidden; }
        
.wrapper { width:1200px; margin: 0 auto; overflow: hidden;  }
.warp { width:1200px; margin: 0 auto; }


.model_btn .toggleMenu { display:none;}
.model_menu { display:none;}
.mobnav { display: none;}	


.content { width:1200px; float: left; position:relative; display: flex; align-items: center; margin-top: 96px;  }

/* 各屏背景色 */
#screen1 { }
.haibao { width: 100%; float: left;  }
.haibao .swiper-container1 { width:100%; margin:0 auto; position:relative; overflow:hidden; list-style:none; padding:0; z-index:1; height:100vh;  }
.haibao .swiper-wrapper {  position: relative; width:100%;  height:100%;  z-index:1; display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:flex;}
.haibao .swiper-slide { width:100%; height:100%; position:relative; -webkit-flex-shrink:0; -ms-flex-negative:0; flex-shrink:0; }
.haibao .swiper-slide li { width:100%; height:100%; overflow:hidden; background-repeat:no-repeat; background-position:center top; background-size: cover;  position: absolute; }
.haibao .swiper-slide li video { width: 100%; height: 100%; object-fit: fill;}
.haibao .swiper-slide li b { position:absolute; width:100%; height:100%; display:block; background:rgba(9,129,68,.2);z-index: 5; }
.haibao .swiper-slide li font { position:absolute; width:1200px; left:50%; top:25vh; z-index:9; margin-left:-550px;/*height:100%; display:flex; align-items:center;*/  }
.haibao .swiper-slide li span { position:absolute; width:1200px; left:50%; top:22vh; z-index:9; margin-left:-600px; text-align: center;/*height:100%; display:flex; align-items:center;*/  }

.haibao .np { position:absolute; width:1200px; left:0; height: 60px;  bottom:0; left:50%;margin-left:-600px;  }
.haibao .swiper-button-prev1,.haibao .swiper-button-next1 { width:65px; height:36px; bottom:40px; cursor:pointer; position:absolute; z-index:99; text-align:center; line-height:36px; font-size: 30px; background:rgba(255,255,255,.8); color:rgba(0,0,0,.8); transition:all ease-out .4s 0s; -webkit-transition:all ease-out .4s 0s; }
.haibao .swiper-button-prev1 { left:0px;}
.haibao .swiper-button-next1 { left:66px; color:rgba(255,255,255,.8); background:rgba(0,0,0,.8);}
.haibao .swiper-button-prev1:hover,.haibao .swiper-button-next1:hover { }

.haibao .swiper-pagination1 { position:absolute; text-align:center;  z-index:10; bottom:0; padding:50px 0 40px 0;  left:0; width:100%; background:-webkit-gradient(linear,0 0,0 100%,from(rgba(0,0,0,0)),to(rgba(0,0,0,.7)));  display: none;}
.haibao .swiper-pagination-bullet { width:13px; height:13px; display:inline-block; border-radius:100%; opacity:1; bottom:50px; background:#fff; border-radius:50px; cursor:pointer; margin:0 8px; transition:all ease-out .5s 0s; -webkit-transition:all ease-out .5s 0s; border:0px solid #fff;  }
.haibao .swiper-pagination-bullet-active{ opacity:1; background:none; border:2px solid #fff; width:15px; height:15px; }



.home_lm { width:100%;float:left; transform: translateY(-50px); opacity: 0;  transition: transform 0.8s ease 0.3s, opacity 0.8s ease 0.3s;  }
.screen.active .home_lm { transform: translateY(0);  opacity: 1;  }
.home_lm h2 { width:100%; float:left;  display:flex; align-items:center;  }
.home_lm h2 font { float:left; font-size:42px; line-height:1.3em; color: #333; font-weight:600; /*background: linear-gradient(90deg, #ff8a00, #e52e71, #5a00cc);
-webkit-background-clip: text;  background-clip:text; -webkit-text-fill-color: transparent; background-size: 200% auto; animation: gradientMove 3s ease-in-out infinite;*/} /*文字渐变动画效果*/
.home_lm h2 b { float:left; width: 40px; height: 2px; background: #e77817; display: inline-block; margin-left:20px; margin-top: 5px; }
.home_lm h3 {  width:100%;float:left;  float: left; font-size:26px; color: #333; line-height:1.3em; margin-top: .2em; }
@keyframes gradientMove {
 0% { background-position: 0% center; }
 50% { background-position: 100% center; }
 100% { background-position: 0% center; }
 }


/*印象园博*/
#screen2 { background:url(../images/bj01.jpg) center top repeat; background-attachment:fixed; }
.sy01 { position: absolute; left:0;  top:0; z-index: 1; transform: translateY(-50px);  opacity: 0; display: none; transition: transform 0.8s ease .9s, opacity 0.8s ease .9s;}
.screen.active .sy01 { transform: translateY(0); opacity: .2;  }

.yxyb_left { width: 50%; float: left;  position: absolute; z-index: 5;}
.yxyb_left .wzjs { width: 100%; float: left; margin-top: 5vh; 
transform: translateY(50px);  opacity: 0; transition: transform 0.8s ease 0.9s, opacity 0.8s ease 0.9s;} 
.screen.active .yxyb_left .wzjs {  transform: translateY(0); opacity: 1; }
.yxyb_left .wzjs p { width: 100%; float: left; margin-bottom: 6%; font-size:16px; line-height:1.8em;color: #333; text-indent: 2em; }  

.yxyb_left .more { float: left; transform: translateY(-100%); opacity: 0;  transition: transform 0.8s ease 1.2s, opacity 0.8s ease 1.2s; }
.screen.active .yxyb_left .more { transform: translateX(0); opacity: 1; }
.yxyb_left .more b { float: left;  background: #e77817;  line-height: 66px;  font-size:16px; color: #fff; font-weight: 600; padding:0 1.9vw 0 3.1vw;  transition:all ease-out .3s 0s; -webkit-transition:all ease-out .3s 0s;}
.yxyb_left .more b i { margin-left: 20px; transition:all ease-out .3s 0s; -webkit-transition:all ease-out .3s 0s; }
.yxyb_left .more em { content: ''; width: 0; height: 0; border:33px solid transparent; border-left: 1.2vw solid #e77817; border-right: none; float: right;  transition:all ease-out .3s 0s; -webkit-transition:all ease-out .3s 0s;}
.yxyb_left .more:hover b { background:linear-gradient(to right, rgba(9,129,68,.9), rgba(14,127,113,.9)); color: #fff; }
.yxyb_left .more:hover b i { color: #fff;}
.yxyb_left .more:hover em { border-left: 1.2vw solid rgba(14,127,113,.9); }


.yxyb_right { width: 62%; height:63vh; position: absolute; right:0; background:rgba(255,255,255,.5); transform: translateX(50%); opacity: 0;  transition: transform 0.8s ease 0.5s, opacity 0.8s ease 0.5s;  }
.screen.active .yxyb_right { transform: translateX(0); opacity: 1; }
.yxyb_right .pic { width: 70%; height: 100%; background:url(../images/yxyb01.jpg) center center no-repeat; background-size: cover;float: right; position: relative; }



/*名园巡礼*/
#screen3 { background:url(../images/bj02.jpg) center top repeat; background-attachment:fixed;}
.myxl_left { width:28%; float: left;  position: absolute; z-index: 5;}
.soon { float: left; width:100%; margin-top:40px; transform: translateY(100px); opacity: 0;  transition: transform 0.8s ease 1.2s, opacity 0.8s ease 1.2s; }
.screen.active .myxl_left .soon{ transform: translateX(0); opacity: 1; }

.soon ul li { width: 100%; float: left; padding:18px 25px; /* background: #e77817;*/ background: #fff;  display: inline-block; margin:7px 0;  transition:all ease-out .3s 0s; -webkit-transition:all ease-out .3s 0s; }
.soon ul li h3 { float: left;  width: 60px; height: 60px; line-height:60px; border-radius:60px; text-align: center; background:linear-gradient(to right, rgba(245,164,35,1), rgba(236,102,82,1)); margin-top: 10px; }
.soon ul li h3 i { font-size:35px; color: #fff;  transition:all ease-out .3s 0s; -webkit-transition:all ease-out .3s 0s;  vertical-align: bottom; }
.soon ul li h3 i.f2 { font-size:30px;}
.soon ul li h4 { width: calc( 100% - 80px); float: right; }
.soon ul li h4 span {width: 100%; float: left;  display: inline-block; color: #333; line-height:1.5em; font-size:20px; font-weight: 600; transition:all ease-out .3s 0s; -webkit-transition:all ease-out .3s 0s;  }
.soon ul li h4 p { width: 100%; float: left;  display: inline-block; color: #666; line-height:1.5em; font-size:15px; margin-top: 5px;  transition:all ease-out .3s 0s; -webkit-transition:all ease-out .3s 0s; }
.soon ul li:hover { background:linear-gradient(to right, rgba(245,164,35,1), rgba(236,102,82,1));-webkit-transform: translateY(-10px);-transform:translateY(-10px); /*background:linear-gradient(90deg, rgba(0,153,68,1), rgba(0,140,214,1));  */}
.soon ul li:hover h3 { background: #fff; }
.soon ul li:hover i {  background: linear-gradient(90deg, rgba(245,164,35,1), rgba(236,102,82,1)); -webkit-background-clip: text; background-clip: text;-webkit-text-fill-color: transparent;}
.soon ul li:hover h4 span { color: #fff;}
.soon ul li:hover h4 p { color: #fff;}


.myxl_right { width: 72%; height:63vh; overflow: hidden; position: absolute; right:0; background:rgba(255,255,255,.5); transform: translateX(50%); opacity: 0;  transition: transform 0.8s ease 0.5s, opacity 0.8s ease 0.5s;  }
.screen.active .myxl_right { transform: translateX(0); opacity: 1; }
.map {width: 100%; background: url("../images/mapb.jpg") no-repeat right; background-size: cover;  height:100%;  position: relative; overflow: hidden;}
.maplist { position: absolute; bottom: 0; left: 0; width: 100%; }
.maplist ul { width: 90%; margin-left: 5%;}
.maplist li { background: rgba(255,255,255,.5); border-radius: 25px; box-shadow: rgba(0,0,0,.1) 0 0 10px; width: 20%; margin: 0 2% 2em; padding:8px .5%; transform: translateY(5px);transition: all 0.3s ease;}
.maplist li h5 { font-size: 24px; font-weight: 600; padding:.5em 0; text-align: center;}
.maplist li p { font-size: 18px; color: #666; padding:0 1em 1em;}
.maplist li:hover { background: rgba(255,255,255,1); box-shadow: rgba(0,0,0,.2) 0 0 10px;}

.showup {width: 38%; position: absolute; top:0px; left:0;  z-index: 8; background: linear-gradient(to bottom,rgba(255,255,255,1) 20%,rgba(255,255,255,.7) 90%,rgba(255,255,255,.1));}
.showup li { display: none; padding:30px 30px 35px 30px; float: left; }
.showup li:first-child { display: list-item; }
.showup h2 { width: 85%; float: left; font-size: 22px; font-weight: 600;line-height: 1.5em; display: inline-block; background: linear-gradient(90deg, #008cd6, #009944); -webkit-background-clip: text; background-clip: text;-webkit-text-fill-color: transparent; background-size: 100% auto; margin-bottom: 15px; }
.showup h2 em { padding:0 5px;}
.showup h3 { width: 100%; float: left; font-size: 16px; color:#999; margin-bottom: 2rem; display: none; }
.showup h4 { width: 100%; float: left; font-size: 16px; line-height: 1.8em; color:#666; margin-bottom: 20px; display:-webkit-box; text-overflow:ellipsis;  -webkit-box-orient:vertical;  -webkit-line-clamp: 4; overflow:hidden;}
.showup h5 { width: 100%; float: left;  height:16vh;}
.showup h5 img { width: 100%; height:100%;}
.showup h6 { width: 100%; float: left;  margin-top: 12px; font-size: 16px; line-height:30px; color: #222; font-weight: 600; vertical-align: middle;/*padding-left:30px;background: url("../images/location.png") no-repeat center left; background-size: 8%;*/}
.showup h6 i { float: left; font-size: 24px; line-height:30px; margin-right: 8px;  }

.closeshow { background: url("../images/close.png") no-repeat center; background-size: contain; opacity: .8; position: absolute; right: 22px; top: 22px; width: 32px; height: 32px;transition: all 0.3s ease;}
.closeshow:hover { opacity: 1; cursor: pointer;}


.mapclick { width: 100%; height: 100%; position: absolute;}
.clickdot { background:rgba(66,149,78,.7); border-radius: 1em; width: 2em; height: 2em; display: block; text-indent: -999px; overflow: hidden; cursor: pointer; position: absolute;}
.clickdot small { background:rgba(255,139,218,.8); border-radius: 1em; width: 1.6em; height: 1.6em; display: block; position: absolute; left: 50%; top: 50%; margin-left: -.8em; margin-top: -.8em;}
.clickdot i { background:rgba(255,180,235,1); border-radius: 1em; width: 1em; height: 1em; display: block; position: absolute; left: 50%; top: 50%; margin-left: -.5em; margin-top: -.5em;}
.clickdot_act { background:rgba(235,173,76,.7);}
.clickdot_act small { background:rgba(255,167,95,.8);}
.clickdot_act i { background:rgba(255,204,154,1);}

.clickdot01 { top: 20%; right: 35%;}
.clickdot02 { top: 15%; right: 21%;}
.clickdot03 { top: 32%; right: 23%;}
.clickdot04 { top: 42%; right: 34%;}

.clickdot05 { top: 28%; right: 38%;}
.clickdot06 { top: 75%; right: 56%;}
.clickdot07 { top: 36%; right: 46%;}
.clickdot08 { top: 50%; right: 37%;}

.w820 { width:820px; float:left; /*order:1;*/ }  /*order 表示不影响文档流的逻辑顺序，仅改变视觉呈现顺序*/



/*园博嘉年华*/
#screen4 { background:url(../images/bj01.jpg) center top repeat-y; background-attachment:fixed; }
.ybjnh { width: 100%; float: left; margin-top: 6vh; }
/*.ybjnh ul { display:flex; flex-wrap:wrap; }*/
.ybjnh ul li.dh1 { transform: translateY(50px);  opacity: 0; transition: transform 0.5s ease .7s, opacity 0.5s ease .7s;}
.screen.active .ybjnh ul li.dh1 {  transform: translateY(0); opacity: 1; }
.ybjnh ul li.dh2 { transform: translateY(50px);  opacity: 0; transition: transform 0.5s ease 1s, opacity 0.5s ease 1s;}
.screen.active .ybjnh ul li.dh2 {  transform: translateY(0); opacity: 1; }
.ybjnh ul li.dh3 { transform: translateY(50px);  opacity: 0; transition: transform 0.5s ease 1.3s, opacity 0.5s ease 1.3s;}
.screen.active .ybjnh ul li.dh3 {  transform: translateY(0); opacity: 1; }

.ybjnh ul li { width:31.5%; float: left; flex-shrink: 0; margin-right:2.75%; padding:2.2% 3% 4% 3%; background: linear-gradient(to bottom,rgba(255,255,255,1) 20%,rgba(255,255,255,.7) 90%,rgba(255,255,255,.1));  transition:all ease-out .3s 0s; -webkit-transition:all ease-out .3s 0s; border-radius:0;/*box-shadow: 0px 0px 8px rgba(0,0,0,.1); */}
.ybjnh ul li h4 { width: 100%; float: left; color: #333; font-size:16px; line-height:1.5em;  margin-bottom: 15px;  }
.ybjnh ul li h4 i { margin-right: 7px;  font-size:18px; line-height:1.5em; vertical-align: bottom; } 
.ybjnh ul li h2 { width: 100%; float: left;  }
.ybjnh ul li h2 span {  width: 100%; float: left; display:-webkit-box; text-overflow:ellipsis;  -webkit-box-orient:vertical;  -webkit-line-clamp: 2; overflow:hidden; line-height:1.5em; font-size:18px; color:#333;  font-weight: 600; margin-top: 20px; transition:all ease-out .3s 0s; -webkit-transition:all ease-out .3s 0s;}
.ybjnh ul li:hover h2 span { background: linear-gradient(90deg, #008cd6, #009944); -webkit-background-clip: text; background-clip: text;-webkit-text-fill-color: transparent;}
 .ybjnh ul li h2 p { width: 100%; float: left; line-height:1.6em; font-size:15px; color:#888; margin-top: 15px; display:-webkit-box; text-overflow:ellipsis;  -webkit-box-orient:vertical;  -webkit-line-clamp: 3; overflow:hidden; }
.ybjnh ul li h3 { width: 100%; float: left; height:180px; overflow: hidden;  border-radius:0px;}
.ybjnh ul li h3 img { width:100%; height:100%;  }
.ybjnh ul li:hover { -webkit-transform: translateY(-15px);-transform:translateY(-15px);}
.ybjnh ul li:nth-child(3n) { margin-right:0; margin-top:0px;}
.ybjnh ul li:nth-child(2n) { margin-top:0px; }

.sy04{  position: absolute; right:calc(50vw - 660px);  top:90px; z-index: 1; transform: translateY(-50px);  opacity: 0; transition: transform 0.8s ease .9s, opacity 0.8s ease .9s;}
.screen.active .sy04 {  transform: translateY(0); opacity: 1; }



/*乐游园博*/
#screen5 { background:url(../images/map.jpg) center center no-repeat; background-size: cover; background-attachment:fixed; }
.content5 { float: left;  }
.lyyb { margin-left:calc(50vw - 608px);  position:relative; z-index:5;; }
.lyyb_left { width: 22%; float: left; }

.zaiyao { width: 100%; float: left; margin-top: 5vh;
 transform: translateY(50px);  opacity: 0; transition: transform 0.8s ease .7s, opacity 0.8s ease .7s;}
.screen.active .zaiyao {  transform: translateY(0); opacity: 1; }
.zaiyao p { width:90%; float: left; color:#454545; font-size:16px; line-height:1.8em; margin-bottom: 30px; }
.zaiyao p.w2 { width:70%; }


.mpyy { float: left; transform: translateY(-100%); opacity: 0; transition: transform 0.8s ease 1.2s, opacity 0.8s ease 1.2s; margin-top:5vh;  }
.screen.active .mpyy { transform: translateX(0); opacity: 1; }
.mpyy b { float: left;  background: #e77817; line-height: 7.2vh; font-size:20px; font-weight: 600; color: #fff; padding:0 1.9vw 0 2.5vw;  transition:all ease-out .3s 0s; -webkit-transition:all ease-out .3s 0s;}
.mpyy b i { margin-right: 16px; transition:all ease-out .3s 0s; -webkit-transition:all ease-out .3s 0s; font-size:28px; vertical-align: bottom; }
.mpyy em { content: ''; width: 0; height: 0; border: 3.7vh solid transparent; border-left: 1.2vw solid #e77817; border-right: none; float: right;  transition:all ease-out .3s 0s; -webkit-transition:all ease-out .3s 0s;}
.mpyy:hover b {  background:linear-gradient(to right, rgba(9,129,68,.9), rgba(14,127,113,.9));}
.mpyy:hover em  { border-left: 1.2vw solid rgba(14,127,113,.9); }


.lyyb_right { width: 78%; float: right;  transform: translateX(50%);  opacity: 0; transition: transform 0.8s ease 1.1s, opacity 0.8s ease 1.1s;}
.screen.active .lyyb_right {  transform: translateX(0); opacity: 1; }
.lyyb_right ul li { width: 23.8%; float: left;  margin-left: 1.2%; position: relative; z-index: 1; }
.lyyb_right ul li h3 { width:100%; position:absolute; top:26px; padding:0 10%; z-index: 1 }
.lyyb_right ul li h3 span { width: 100%; float: left; font-size:26px; line-height:1.5em; color:rgba(255,255,255,1); font-weight: 600;  }
.lyyb_right ul li h3 p { width: 100%; float: left; font-size:18px; line-height:1.5em; color:rgba(255,255,255,1);}
.lyyb_right ul li h4 { width:48%; height: 40px; position:absolute;  top: 50%; left: 26%; text-align: center;  margin-top: -20px;  z-index: 1;transition:all ease-out .3s 0s; -webkit-transition:all ease-out .3s 0s;  }
.lyyb_right ul li h4 a {width: 100%; background: #fff; color:#333; font-size:16px; line-height:40px; display: inline-block; border-radius:50px;transition:all ease-out .3s 0s; -webkit-transition:all ease-out .3s 0s; }
.lyyb_right ul li h4 a:hover { background:linear-gradient(to right, rgba(245,164,35,1), rgba(236,102,82,1)); color: #fff; }


.lyyb_right ul li h5 { width:100%; position:absolute;  bottom:14px; padding:0 5%; text-align: right; font-size:20px; line-height:1.5em; font-weight: 600;  color:rgba(255,255,255,.3); text-transform: uppercase;  z-index: 1}

.lyyb_right ul li h6 { width: 100%; float: left;  overflow: hidden; height: 40vh;background-repeat: no-repeat; background-position: center center; background-size: cover; }




/*加入园博*/
.content6 { width:100%; float: left; position:relative; display: flex; align-items: center; margin-top: 110px;  }
.sy02{ position: absolute; left:-2%; bottom:0px; z-index:0; transform: translateY(-50px);  opacity: 0; transition: transform 0.8s ease .9s, opacity 0.8s ease .9s;}
.screen.active .sy02 {  transform: translateY(0); opacity:1; }


.footer { width:100%; float:left; margin-top:50px; }
.copy { width:100%; float:left;  text-align: center; transform: translateY(50px);  opacity: 0; transition: transform 0.8s ease 1.8s, opacity 0.8s ease 1.8s;}
.screen.active .copy {  transform: translateY(0); opacity: 1; }
.copy h2 { width:100%; float:left;  margin-bottom: 10px;}
.copy h2 font { font-size: 16px; line-height: 2em; color:#333; padding:0 10px 0 0; display: inline-block; font-weight: 600;  }
.copy h2 font strong { font-weight: 600;  }

.copy h3 { width:100%; float:left;}
.copy h3 span { font-size: 16px; line-height:2em; color:#666;  padding:0 10px 0 0;  }
.copy h3 span i { margin-right:8px; font-size: 16px; line-height:2em;  color:#666; }
.copy h3 b  {font-size: 16px; line-height:2em; color:#666;  padding:0 10px 0 0;  transition:all ease-out .3s 0s; -webkit-transition:all ease-out .3s 0s;}
.copy h3 b i { margin-right:8px; font-size: 16px; line-height:2em;  color:#666; }
.copy h3 b a i { color:#fff;  }
.copy h3 b a {  background:linear-gradient(to right, rgba(245,164,35,1), rgba(236,102,82,1)); color: #fff; font-size: 15px; padding:3px 18px; border-radius:50px; display: inline-block; }
.copy h3 b:hover a { background:linear-gradient(120deg, rgba(0,153,68,1), rgba(0,140,214,1)); }

.copy h4 { width:100%; float:left;}
.copy h4 b { font-size: 16px; line-height: 1.8em; color:#666; margin-right: 10px; }
.copy h4 font a {color:#666;}

/*媒体矩阵*/
.icoall {width: 100%; float: left;  margin-top:20px; text-align: center;  
 transform: translateY(50px);  opacity: 0; transition: transform 0.8s ease 1.8s, opacity 0.8s ease 1.8s;}
.screen.active .icoall {  transform: translateY(0); opacity: 1; }
.icoall ul li { width: 40px;  margin:0 6px; position: relative; display:inline-block; cursor: pointer; }
.icoall ul li h6 b { display: inline-block; width: 40px; height:40px; border-radius: 60px; background:rgba(0,0,0,.3);  transition:all ease-out .4s 0s; -webkit-transition:all ease-out .4s 0s;  display:flex; align-items:center; justify-content:center; }
.icoall ul li h6 b img { width: 30px; height: auto; }
.icoall ul li h6:hover  b {  background:rgba(0,0,0,.9); color: #fff; }
.icoall ul li h6 .ewm { width:100%; position: absolute; left:-30px; top:-130px; text-align: center; opacity:0; display: none; transition:all ease-out .4s 0s; -webkit-transition:all ease-out .4s 0s;  }
.icoall ul li h6 .ewm img { width:120px; height:auto; }
.icoall ul li h6:hover .ewm { opacity:1; display:block;}


.footer2 { width:100%; float:left;  background:url(../images/bj01.jpg) center top repeat-y; padding:50px 0; }
.copy2 { width:100%; float:left;  text-align: center; }
.copy2 h2 { width:100%; float:left;  margin-bottom: 10px;}
.copy2 h2 font { font-size: 16px; line-height: 2em; color:#333; padding:0 10px 0 0; display: inline-block; font-weight: 600;  }
.copy2 h2 font strong { font-weight: 600;  }

.copy2 h3 { width:100%; float:left;}
.copy2 h3 span { font-size: 16px; line-height:2em; color:#666;  padding:0 10px 0 0;   }
.copy2 h3 span i { margin-right:8px; font-size: 16px; line-height:2em;  color:#666; }

.copy2 h3 b { font-size: 16px; line-height:2em; color:#666;  padding:0 10px 0 0;  transition:all ease-out .3s 0s; -webkit-transition:all ease-out .3s 0s;  }
.copy2 h3 b i { margin-right:8px; font-size: 16px; line-height:2em;  color:#666; }
.copy2 h3 b a i { color:#fff;  }
.copy2 h3 b a {  background:linear-gradient(to right, rgba(245,164,35,1), rgba(236,102,82,1));color: #fff; font-size: 15px; padding:3px 18px; border-radius:50px; display: inline-block; }
.copy2 h3 b:hover a { background:linear-gradient(120deg, rgba(0,153,68,1), rgba(0,140,214,1)); }

.copy2 h4 { width:100%; float:left;}
.copy2 h4 b { font-size: 16px; line-height: 1.8em; color:#666; margin-right: 10px; }
.copy2 h4 font a {color:#666;}

/*媒体矩阵*/
.icoall2 {width: 100%; float: left;  margin-top:20px; text-align: center; }
.icoall2 ul li { width: 40px;  margin:0 6px; position: relative; display:inline-block; cursor: pointer; }
.icoall2 ul li h6 b { display: inline-block; width: 40px; height:40px; border-radius: 60px; background:rgba(0,0,0,.3);  transition:all ease-out .4s 0s; -webkit-transition:all ease-out .4s 0s;  display:flex; align-items:center; justify-content:center; }
.icoall2 ul li h6 b img { width: 30px; height: auto; }
.icoall2 ul li h6:hover  b {  background:rgba(0,0,0,.9); color: #fff; }
.icoall2 ul li h6 .ewm { width:100%; position: absolute; left:-30px; top:-130px; text-align: center; opacity:0; display: none; transition:all ease-out .4s 0s; -webkit-transition:all ease-out .4s 0s;  }
.icoall2 ul li h6 .ewm img { width:120px; height:auto; }
.icoall2 ul li h6:hover .ewm { opacity:1; display:block;}



#aiby {width: 100%;  height:calc( 100vh - 96px); background:url(../images/hwbj05.jpg) center center no-repeat; background-attachment:fixed; background-size: cover;  display: flex; align-items: center; margin-top: 96px; }

.ai { width: 1200px; height: 65vh;  margin:0 auto;  overflow: hidden; }
.ai img { width: 100%; height:606px;}

/*---------------------------------------------------------------二级页面-----------------------------------------------------*/
.banner { position: relative; width: 100%; height:480px; overflow: hidden; top:0; z-index:5;  display:flex; align-items:center; background-size:cover;background-repeat: no-repeat; background-image: url(../images/banner.jpg); background-position: center center;  }
.banner b { position:absolute; width:100%; height:100%; display:block;  background:rgba(6,73,39,.3);/* background:rgba(9,129,68,.5);*/ z-index: 7;display: none; }
.banner h2 { width:100%; float:left;  text-align: center;position:absolute;z-index: 9; margin-top:50px; display: none; }
.banner h2 span {width:100%; float:left; font-size:70px; color: #fff;  line-height:2em; letter-spacing:8px; text-shadow:0 0px 5px rgba(27,27,27,.1);}
.banner h2 p { width:100%; float:left; font-size:28px; color:rgba(255,255,255,1); line-height:2em;}


.add { width: 100%; float: left;  background:rgba(107,179,143,.1);  padding:12px 0; line-height:30px; font-size:15px; color:#666; margin-bottom: 60px; }
.add a { color:#666; }
.add a:hover { color: #098144; }
.add i { padding:0 10px; }


.bj09 { width:100%; float: left; padding:60px 0;  background:rgba(107,179,143,.1); }

.nbest { width: 1200px; margin: 0 auto; overflow: hidden; margin-bottom: 60px;}
.tabBar2 { width:28%;  float:left; }
.tabBar2 ul li {width:100%; float:left;  padding:5% 9%; border:1px solid rgba(107,179,143,.1); border-radius:20px ; margin-bottom: 10px; }
.tabBar2 ul li span { width:100%; float:left;  font-size: 16px; color: #333; line-height: 1.5em; }
.tabBar2 ul li p { width:100%; float:left; font-size: 14px; color: #888; line-height: 1.5em; margin-top: 5px; }
.tabBar2 ul li b { float: left; padding:0 20px;  margin-top: 10px; font-size: 14px; color: rgba(255,255,255,.8); line-height: 30px; border-radius:50px; border: 1px solid rgba(255,255,255,.8); display: none; }
.tabBar2 ul li.current {/* background:linear-gradient(to right, rgba(9,129,68,1), rgba(14,127,113,1)); */ background:linear-gradient(90deg, rgba(0,153,68,1), rgba(0,140,214,1));color:#fff; }
.tabBar2 ul li.current span { color: #fff;  }
.tabBar2 ul li.current p { color: rgba(255,255,255,.8);  }
.tabBar2 ul li.current b { display: block; }

.tabCon2 { width:70%; height:510px; float:right; overflow: hidden;  border-radius:20px ; }
.tabCon2 img { width:100%;height:100%; }


/*图文列表*/
.twlist { width:100%; float:left;  }
.twlist ul { display:flex; flex-wrap:wrap; }
.twlist ul li { width:100%; float:left;  box-shadow: 0px 0px 4px rgba(107,179,143,.2); /*border: 1px solid rgba(107,179,143,.1); */ padding:30px 32px; border-radius:20px ; margin-bottom: 30px; }
.twlist ul li h3 { width:30%; float:left; height: 220px; overflow: hidden;  border-radius:18px ;}
.twlist ul li h3 img { width:100%; height: 100%; }
.twlist ul li h4 { width:68%; float:left; text-overflow:ellipsis;  -webkit-box-orient:vertical;  -webkit-line-clamp: 2; overflow:hidden; -webkit-transition:all .3s ease-in-out;transition:all .3s ease-in-out; padding:1% 2% 0% 4%;  }
.twlist ul li h4 font { line-height:1.5em; font-size:24px; color:#333;  font-weight: 600; display:-webkit-box; text-overflow:ellipsis;  -webkit-box-orient:vertical;  -webkit-line-clamp: 2; overflow:hidden;}
.twlist ul li h4 span { width:100%; float:left; line-height:1.8em; font-size:16px; color:#333; margin-top: 20px; display:-webkit-box; text-overflow:ellipsis;  -webkit-box-orient:vertical;  -webkit-line-clamp: 3; overflow:hidden; }
.twlist ul li h4 p { width:100%; float:left; line-height:1.8em; font-size:16px; color:#888; margin-top: 20px; }
.twlist ul li:hover h4 font { background: linear-gradient(90deg, #008cd6, #009944); -webkit-background-clip: text; background-clip: text;-webkit-text-fill-color: transparent; background-size: 100% auto;}
.twlist ul li:nth-child(2n) h3 {  float:right; }
.twlist ul li:nth-child(2n) h4 {  float:left; padding:1% 3% 0% 2%;  }

.twlist2 { width:100%; float:left;  }
.twlist2 ul { display:flex; flex-wrap:wrap; }
.twlist2 ul li { width:32%; float:left;  margin-right: 2%;  border-right: 5px solid rgba(107,179,143,.1); border-bottom: 5px solid rgba(107,179,143,.1); margin-bottom: 30px;}
.twlist2 ul li h3 { width:100%; float:left; height: 220px; overflow: hidden; }
.twlist2 ul li h3 img { width:100%; height: 100%; }
.twlist2 ul li h4 { width:62%; float:left;  display:-webkit-box; text-overflow:ellipsis;  -webkit-box-orient:vertical;  -webkit-line-clamp: 2; overflow:hidden; -webkit-transition:all .3s ease-in-out;transition:all .3s ease-in-out; padding:7%;  }
.twlist2 ul li h4 font { line-height:1.5em; font-size:18px; color:#333;  font-weight: 600; }
.twlist2 ul li h4 span { width:100%; float:left; line-height:1.5em; font-size:14px; color:#333; margin-top: 20px; display:-webkit-box; text-overflow:ellipsis;  -webkit-box-orient:vertical;  -webkit-line-clamp: 2; overflow:hidden; }
.twlist2 ul li h4 p { width:100%; float:left; line-height:1.5em; font-size:14px; color:#888; margin-top: 20px; }
.twlist2 ul li:hover h4 font { background: linear-gradient(90deg, #008cd6, #009944); -webkit-background-clip: text; background-clip: text;-webkit-text-fill-color: transparent; background-size: 100% auto;}
.twlist2 ul li:nth-child(3n) { margin-right:0; }



/*文字列表*/
.titlist { width: 100%; float: left;  }
.titlist ul { display:flex; flex-wrap:wrap; }
.titlist ul li { width:31.3%; float:left;  margin-right: 3.05%; border-right: 5px solid rgba(107,179,143,.1); border-bottom: 5px solid rgba(107,179,143,.1); margin-bottom: 30px; background: #fff;  -webkit-transition:all .3s ease-in-out;transition:all .3s ease-in-out;}

/*.titlist ul li::after { content:''; width:0; height:0; position:absolute; right:0; top:0; border-left:20px solid transparent; border-top:20px solid #098144; }*/
.titlist ul li h2 { width:100%; float: left;   padding:0 7% 7% 0; }
.titlist ul li h2 font { width:100%; float: left;  color: #666; font-size:14px; line-height:1.5em;  padding:10px 0;}
.titlist ul li h2 font i { font-size:16px; margin-right: 5px; }
.titlist ul li h2 span { width: 100%; float: left;line-height:1.5em; font-size:18px; color:#000;  font-weight: 600;  display:-webkit-box; text-overflow:ellipsis; -webkit-box-orient:vertical; -webkit-line-clamp:2;  transition:all ease-out .3s 0s; -webkit-transition:all ease-out .3s 0s; }
.titlist ul li h2 p { width: 100%; float: left; line-height:1.5em; font-size:14px; color:#888; margin-top: 20px; display:-webkit-box; text-overflow:ellipsis;  -webkit-box-orient:vertical;  -webkit-line-clamp: 2; overflow:hidden;}
.titlist ul li:hover h2 span { color: #098144; }
.titlist ul li:nth-child(3n) { margin-right:0; }
.titlist ul li:hover { -webkit-transform: translateY(-15px);-transform:translateY(-15px);}

/*视频列表*/
.splist { width:100%; float:left;  }
.splist ul { display:flex; flex-wrap:wrap; }
.splist ul li { width:31.5%; float:left; margin-right:2%; margin-bottom:2%; background:#f6f6f6; /*box-shadow: 0px 0px 4px rgba(107,179,143,.2);*/ /* box-shadow: 0px 0px 20px rgba(0,0,0,.05);*/ /*padding:20px 22px;  background: #fff;*/  }
.splist ul li h3 { width:100%;float:left; height:240px; overflow: hidden;  position: relative; }
.splist ul li h3 img {width:100%; height:100%; }
.splist ul li h3 em { position:absolute;z-index:6;  width:44px; height:44px; top:50%; left:50%; display:inline-block;  margin-left:-22px; margin-top:-22px;  background:url(../images/player.png) center center no-repeat; background-size: cover; border-radius:50px; }
.splist ul li h2 { width:100%; float:left;  padding:15px 22px;  }
.splist ul li h2 font { width:100%; float:left; font-size:18px;  line-height:1.6em; color:#333; overflow:hidden; display:-webkit-box; text-overflow:ellipsis; -webkit-box-orient:vertical; -webkit-line-clamp:2;  transition:all ease-out .3s 0s; -webkit-transition:all ease-out .3s 0s; }
.splist ul li:hover h2 font { color: #098144; }
.splist ul li:nth-child(3n) { margin-right:0; }

/*专题列表*/
.ztlist { width:100%; float:left;  }
.ztlist ul { display:flex; flex-wrap:wrap; }
.ztlist ul li { width:31.5%; float:left; margin-right:2%; margin-bottom:2%; background:#f6f6f6;  }
.ztlist ul li h3 { width:100%;float:left; height:240px; overflow: hidden;background-repeat: no-repeat; background-position: center center; background-size: cover;  }

.ztlist ul li h2 { width:100%; float:left;  padding:15px 22px;  }
.ztlist ul li h2 font { width:100%; float:left; font-size:18px;  line-height:1.6em; text-align: center; color:#333; overflow:hidden; display:-webkit-box; text-overflow:ellipsis; -webkit-box-orient:vertical; -webkit-line-clamp:2;  transition:all ease-out .3s 0s; -webkit-transition:all ease-out .3s 0s; }
.ztlist ul li:hover h2 font { color: #098144; }
.ztlist ul li:nth-child(3n) { margin-right:0; }

/*本地静态样式*/
/*.page { width:100%; float:left; margin:35px 0 65px 0; font-size:18px; overflow:hidden; text-align:center; color:#555; }
.page a { color:#333; background:rgba(0,0,0,.1); margin:0 10px; padding:0 15px; line-height:40px; display: inline-table; border-radius:2px;  transition:0.5s; -webkit-transition:0.5s; }
.page a:hover { background:#cbac6d; color:#fff; border-radius:2px;}
.page a:active {  background:#098144; color:#fff; border-radius:2px;}
.page span.current { background:#098144; color:#fff; display:inline-table; border-radius:2px; line-height:40px; padding:0 15px; margin:0 5px;}
.page span.disabled { padding:0 5px; }
*/
/*北方网默认可调样式*/
.page { width:100%; float:left; margin:35px 0 65px 0;  }
.page a { color:#333; background:rgba(0,0,0,.1); margin:0 4px; transition:0.5s; -webkit-transition:0.5s; }
.page a:hover { background:rgba(255,255,255,1); }
.page span { color:#333; }
#jumppageId { margin-left:2px; margin-right:2px;}

.page input { border:1px solid #bbb; background:#fff; color:#666; font-size:16px;  border-radius:5px;  text-align: center;  }
.page input#fujian { text-indent:0rem; border:0; }

.about { width:100%;  float: left;  display:flex; align-items:center; justify-content:center; text-align: center; margin-top: 90px;  height:calc(100vh - 360px); font-size:80px; color:#000; line-height:1.2em;  font-weight: 600 ; background: linear-gradient(90deg, #008cd6, #009944); -webkit-background-clip: text; background-clip: text;-webkit-text-fill-color: transparent; background-size: 100% auto;}


/*---------------------------------------------------------------正文页-----------------------------------------------------*/



.con { width:100%; float:left; padding:60px 0px; margin-top: 100px;}
.article_tit { width:100%; float:left; font-size:32px; color:#000; line-height:1.5em; font-weight: 600; text-align:center; margin-top: 10px;  }

.article_info { width:100%; float:left;font-size:16px; line-height:1.5em; text-align:center;  border-bottom:1px double rgba(0,0,0,.05); margin-bottom: 20px; padding:15px 0 30px 0; }
.article_info span { padding:0 6px; color:#777; }

.article_player { width:100%; float:left; text-align: center; margin-top:30px; }
#player { width:80%; height:500px; margin:0 auto; }

.article { width:100%; float:left; font-size:19px; line-height:2em; color:#333;  }
.article img { max-width:80%; height:auto; }
.article center { padding-top:30px; }
.article p { padding-top:30px; }
.article p strong {font-size: 23px;   font-weight: 600; }

.article_txt { width:100%; float:left; font-size:16px; line-height:32px;  color:#009a44; text-align:right; margin-top: 30px;  }
.article_txt b { padding:0 12px; font-size:12px; color:rgba(9,129,68,.4); vertical-align:top; line-height:30px;  }
.article_txt em i  { padding:0 12px; font-size:12px; color:rgba(9,129,68,.4); vertical-align:top; line-height:30px;  }


.tabBar { text-align: center; float: left; width: 100%;  margin-bottom: 50px; }
.tabBar span { display: inline-block; line-height: 56px; padding:0 40px;  border:1px solid rgba(107,179,143,.3); border-radius:50px ; font-size:18px;  color: rgba(107,179,143,1); margin: 0 10px;  cursor: pointer; -webkit-transition:all .3s ease-in-out;transition:all .3s ease-in-out; }
.tabBar span.current { background:linear-gradient(90deg, rgba(0,153,68,1), rgba(0,140,214,1)); color:#fff; font-weight: 600; }

.tabCon { width:100%; float:left;  margin-bottom: 60px; }


.intro { width:100%; float:left; font-size:19px; line-height:2em; color:#333;  }
.intro img { max-width:80%; height:auto; }
.intro center { padding-bottom:30px; }
.intro p {width:100%; float:left;  padding-bottom:30px; text-indent: 2em; }
.intro p strong {font-size: 23px;  font-weight: 600; }
.intro font {width:100%; float:left;font-size: 22px;  font-weight: 600;padding-bottom: 20px; }
.intro b { float:left; text-align: justify; font-size:24px; line-height:1.5em;color:#111; font-weight: 600; margin-bottom: 15px; }


.intro2 { width:100%; float:left;  color:#333; column-count:3; colunm-width:30.5%; column-gap:4.25%; margin-top: 40px; }
.intro2 img { max-width:100%; height:auto; }
.intro2 center { padding-bottom:30px; }
.intro2 font { width:100%; float:left;  font-size:20px; line-height:2em;  background: linear-gradient(90deg, #008cd6, #009944); -webkit-background-clip: text; background-clip: text;-webkit-text-fill-color: transparent;font-weight: 600; padding:10px 0;  } 
.intro2 p {width:100%; float:left; padding-bottom:30px;  font-size:18px; line-height:2em; text-indent: 2em;}
.intro2 p strong {font-size: 24px;  font-weight: 600; }


.tw { width:100%; float:left; background: #f8f8f8; margin-top: 10px; }
.tw ul li { width:100%; float:left; }
.tw ul li h1 { width:50%; height:390px; float:left; background-position:center center; background-size:cover; display: block; }
.tw ul li h2 { width:50%; float:right; padding:35px 4.5%; }
.tw ul li h2 font { width: 100%;float:left; font-size:24px; line-height:1.5em;color:#111;  padding-bottom:8px;  font-weight: 600;text-transform:uppercase; }
.tw ul li h2 p {width: 100%;float:left; font-size:18px; line-height:2em; color:#555;  padding-top:8px; text-align: justify; }
.tw ul li:nth-child(2n) h1{ float:right; }
.tw ul li:nth-child(2n) h2{ float:left; }

.quest2 { width:100%;float:left;  column-count:2; colunm-width:47.5%; column-gap:5%; margin-top: 10px; }
.quest2 font { width:100%; float:left;  font-size:20px; line-height:2em;  background: linear-gradient(90deg, #008cd6, #009944); -webkit-background-clip: text; background-clip: text;-webkit-text-fill-color: transparent;font-weight: 600; padding:15px 0;  } 
.quest2 p { width:100%; float:left; padding-bottom:20px; color:#555;  font-size:18px; line-height:2em; text-indent: 2em;  } 
.quest2 img { width: 100%; height:auto;}

.zzjg { width:100%; float:left;}
.zzjg ul { display:flex; flex-wrap:wrap; }
.zzjg ul li { width:23.5%; float:left;  background: #f8f8f8; margin-right: 2%; padding:2% 2% 2% 2%;  }
.zzjg ul li i { width:100%; float:left;  color: #098144; font-size: 40px; line-height:56px; text-align: center; }
.zzjg ul li font {width:100%; float:left; font-size: 24px; line-height: 1.8em;  font-weight: 600; padding-bottom:20px; text-align: center;  color: #333;  }
.zzjg ul li p {width:100%; float:left; padding-bottom:10px; font-size: 16px;line-height: 1.5em; color: #333; text-align: center;  }
.zzjg ul li:nth-child(4n) { margin-right:0;  }