/*--------------------------------------------------------------
@author yzl and data.2020.5.6
--------------------------------------------------------------*/
body{font-size:100%;}
body,main,header,div,nav,section,ul,li,span,a,em,i,p,footer,dl,dd,h1,h2,h3,h4,article,menu{ padding:0; margin:0}
ul,ol,li{list-style:none;}
i,em{font-style:normal;}
a{text-decoration:none;color:#555;}
h3{ margin-bottom:.7em;}
h3 a{ color:#666;}
.sj_footer{ display:none;}
.bg{ background-color:#FFF;}
.bgf5859e{background-color: #f5859e;}
.clam { display: -webkit-box; overflow: hidden; text-overflow: ellipsis; word-wrap: break-word;  white-space: normal; -webkit-box-orient: vertical;}
.clam1 { -webkit-line-clamp: 1;}
.clam2 { -webkit-line-clamp: 2;}
.clam3 { -webkit-line-clamp: 3;}
.container{ min-width:320px; max-width:1200px; margin:0 auto;}

.header{ display: flex;padding: 1.5em 0;}
.header .logo-img,.search{ flex:1}
.search{box-shadow: 0 1px 3px rgba(0,0,0,.03);transition: all 0.25s; padding-top: .5em;}
.search .form-group{margin: 0 auto;border: 2px solid #f5859e; position: relative; height: 3em; line-height: 3em; z-index: 3;}
.search .form input {width: 80%; color: #222;top: 1px; left: 0px; outline: none;border: none; padding: 1.2em 0 0 1em;}
.search .form .btn { border: none; background-color: #f5859e; color: #fff; font-size: 18px; height: 2.75em;overflow: hidden;position: absolute; right: 0; text-align: center; top: 0; width: 5em; cursor: pointer;}
.search .form .btn i {font-weight: 800; font-size: 18px; margin-right: 6px;}

.top-menu{background-color: #f5859e;margin-bottom: 1em;}
.top-menu .menu{ display:flex;align-items:center; line-height: 3em; height: 3em;}
.top-menu .menu li{text-align:center; width: 20%;}
.top-menu .menu li:not(:last-child){ border-right: 1px solid #f76485;}
.top-menu .menu li:hover{ background-color: #e65677;}
.top-menu .menu li a{ color:#FFF;}
.top-menu .m_menu{ display:none;}

.main_visual {overflow: hidden; position: relative; margin-bottom:.5em;}
.main_image {  overflow: hidden; position: relative; height:21em;}
.main_image ul { width: 9999px;  overflow: hidden;  position: absolute; top: 0; left: 0}
.main_image li { float: left; width: 100%;}
.main_image li a { display: block; width: 100%;}
.main_image li img { width: 100%;}
div.flicking_con {position: absolute; top: 21em; left: 47%;  z-index: 10; width: 300px;  height: 21px;  margin: -1.5em 0 0 0;}
div.flicking_con a { float: left; width: 21px;  height: 21px; margin-right: .2em;  margin: 0;  padding: 0;  background:url(../image/btn_main_img.png) 0 0 no-repeat;  display: block; text-indent: -1000px}
div.flicking_con a.on { background-position: 0 -21px}
#btn_prev,#btn_next{width: 60px !important; height: 90px;margin: -60px 0 0;display: block; background: url(../image/ad_ctr.png) no-repeat 0 0; position: absolute; top: 50%;z-index: 10;cursor: pointer;text-indent: -9999px;filter: alpha(opacity=20); opacity: 0.2;}
#btn_prev{ left: 0;}
#btn_next{ right: 0;}

/**瀑布流 begin**/
.sec02 { padding:2em 0 3em 0;}
.sec02-nav { height: 20px;  border-bottom: 1px solid #ddd; position: relative; text-align: center;}
.sec02-nav li { display: inline-block; padding: 0 5%;border:#ddd 1px solid; color: #333;  height: 38px; line-height: 38px; overflow: hidden;  text-align: center;background-color: #fff;}
.sec02-nav li:not(:last-child){ margin-right:1em;}
.sec02-nav li:hover{background-color: #f5859e;border: 1px solid #f5859e;}
.sec02-nav li:hover a{color: #ffffff;}
.active{background-color: #f5859e !important;border: 1px solid #f5859e !important;}
.active a{color: #ffffff;}
.display{ display: flex !important;}
.wall{ display: none; flex-wrap: wrap; position: relative;}
.wall-column{display: block;position: relative; width: 25%;box-sizing: border-box;}
.wall-column:not(:last-child){ padding-right:.5em;}
.article { display: block; margin-bottom:.5em;padding: 12px; background-color: white;  border-radius: 3px; box-shadow: 0px 2px 5px 1px rgba(0, 0, 0, 0.1);transition: all 220ms;}
.article:hover { box-shadow: 0px 2px 3px 1px rgba(245, 133, 158, 0.5); transform: translateY(-5px); transition: all 220ms;}
.article img { display: block; width: 100%;margin: 0 0 24px 0;}
.article h2 { font-weight:normal;color: #272727;font-size:1em;text-transform: uppercase; margin-bottom: .5em;}
.article p{color: #9D9D9D;}
.article p,.article time{ font-size: .9em; margin-bottom: .5em;}
/**瀑布流 end**/

.position{ padding:1em .5em; font-size:.9em; border-bottom: 1px solid #eeeeee;}
.position a:last-child { color: #f5859e;}
.pagesize {text-align:center;padding: 1em 0;}
.pagesize li { border: 1px solid #e5e5e5; margin-right: .2em; padding: .5em 1em;text-align: center;display: inline-block;  color: #333;}
.pagesize li:hover{background-color: #f5859e; color: #fff;}
.pagesize li a:hover { display: block;  color: #FFF;}
.pagesize li.thisclass { background-color: #f5859e; color: #fff; border-color: #f5859e;}

.main{ display:flex;}
.main .left{ width: 72%;margin-right: 2%;}
.content .article-title{ text-align:center;font-size:1.5em; padding:.7em 0 .2em; font-weight:normal; color: #555;}
.content .article-meta{ text-align:center;font-size: .9em; color: #7d7d7d; margin:.5em 0;}
.content .article-meta span{ padding-right:.7em;}
.content .article-content{color:#636161;font-size: .95em; line-height:1.7em; text-align:justify; padding: .7em 1em; word-break: break-all; word-wrap: break-word; position: relative;}
.content .article-content img{ display:block; margin:0 auto;max-width: 95% !important; min-width: auto !important;  height: auto !important;}
.content .article-content p{ margin-bottom:.5em; color: #545454;}
.content .article-content h2,.content .article-content h3{margin: .5em 0;font-size: 1.4em;}
.content .article-tips{ border:1px dashed #ccc; padding:1em; margin:1em 0;}
.content .article-tips p:last-child{ margin-bottom:0;}
.s-top-b{padding-top:1.2em;padding-bottom:1.2em;border-top: 3px solid #e8e8e8;/* text-align:center; */}
.s-top-b p{display:flex;justify-content: space-between;}
.s-top-b span{ width:49%;}
.titl_h2{padding: .5em;font-size: 1.2em;background-color: #f5f5f5; font-weight: normal;}
.likearticle{ display: flex; flex-wrap: wrap; margin-top: 1em;}
.likearticle li{ width: 48.5%;border: 1px #e2e0e0 dashed; margin-bottom: 2%;display: flex; transition: all 1s;}
.likearticle li:hover{border: 1px #f5859e dashed;}
.likearticle li:not(:nth-child(2n)){margin-right: 2%;}
.likearticle li>a{ width: 30%; display: block;height: 9em;overflow: hidden}
.likearticle li>a img{ width: 100%; padding: 5%;}
.likearticle li .hos{ width: 68%; margin-left: 2%;padding: .5em; box-sizing: border-box;}
.likearticle li .hos h4{font-size: 1.05em;font-weight:normal;}
.likearticle li .hos p{ font-size: .9em;margin-top: .8em;}
.likearticle li .hos p span{line-height: 1.4em;margin: .5em 0;color: #918e8e;}
.likearticle li .hos p time{ color:#ccc;}


.main .right{ width:26%;background: #fff; }
.main .right .newList{padding-left:1em;padding-right:1em;box-shadow: 0 8px 16px 0 rgba(7,17,27,.1); border-radius: 4px;}
.main .right .newList .title{border-bottom: 1px solid #eaeaea; padding:.67em .3em; margin-bottom: .7em; font-weight:normal; font-size:1.1em; color:#f5859e;}
.main .right .newList ul{ padding:0 .5em;}
.main .right .newList ul li{ display:flex; padding:.5em 0;}
.main .right .newList ul li:not(:last-child){border-bottom: 1px dashed #eaeaea;}
.newList ul li .articleSpecileImg{ flex:2; height:6.2em; overflow:hidden;}
.newList ul li .articleSpecileImg img{ width:100%;}
.newList ul li .articleSpecileContent{ flex:3; padding-left:.9em;}
.newList ul li .articleSpecileContent p:first-child{ line-height: 1.4em; font-size:.9em; text-align:justify;}
.newList ul li .articleSpecileContent p:last-child{ line-height: 1.5em;text-align: justify; padding-top:.5em; font-size:.77em;color: #868686;}

#footer {margin:2em 0 0 0; background-color: #f5f5f5; padding-bottom: .5em;}
#footer nav{ display:flex;}
.footer-logo {width:300px;margin-top: 3em;}
.footer-logo p {height:64px;margin:0 auto;background:url(../image/logo.png) 20px 0 no-repeat;background-size: 70%;}
.footer-logo p a {display:block;width:100%;height:100%;}
.footer-copyright-con { margin:2em 0 2em 2em;color: #333;}
.footer-copyright-con p{font-size: .9em; margin-bottom: .2em;}
.footer-copyright-con p a{color: #333;padding: 0 1%;}
/**#DIALOG_CENTER_SHADE,#DIALOG_CENTER,#DIALOG_TOP,#DIALOG_BOTTOM,#MessageMeiErBeiCenter,#MessageMeiErBeiShadow,#MessageMeiErBeiBottom{display:none !important;}*/
#MessageMeiErBeiBottomS,#footer_f{ display:none;}
@media(max-width:1200px) {
  .container{ padding-left:.5em; padding-right:.5em; box-sizing: border-box;}
}
@media(max-width:1152px) {
	div.flicking_con{ top:20em;}
}
@media(max-width:1024px) {
	body{ font-size:95%;}
	.main_image{height: 18.8em;}
	div.flicking_con{ top:18.5em;}
	.search .form .btn{ height: 2.5em;}
}
@media(max-width:800px) {
	.main_image{height: 14.7em;}
	div.flicking_con{ top:14.5em;}
	
	.wall-column{ width: 33.3333%;}
}
@media (max-width: 768px){
	body{font-size:90%;}
	.main{ display:block;}
	.menu { z-index:1;}
	.logo-img img{ width: 45%;}
}
@media(max-width:600px) {
	body{ background-color: #FFFFFF;}
  /****/
  .header{ padding: 1em .5em;}
  .search .form-group{ width: 95%;}
  
  .top-menu{ background-color:inherit; position: absolute;top: 0; right: 0; margin-bottom: 0;}
  .top-menu .menu{height: auto; z-index: 100; background-color:#333; position:absolute;flex-direction: column; line-height: 4em; right:0; top:6em; padding:0 1em;}
  .top-menu .menu li{ width: 100%; border-bottom:1px solid #999; padding:0 .5em;}
  .top-menu .menu a{ color:#FFF;}
  .top-menu .menu{ display:none;}
  .top-menu .m_menu{ display:block;font-size:4em;color: #f5859e;padding-top: .1em;}
  
	.main_image{height: 11.6em;}
	div.flicking_con{ top:11.4em;}
	#btn_prev, #btn_next{ display: none;}
	
	.position{ border-top: 1px solid #eeeeee;}
	
	
	.main .left{ width: 100%;}
	.main .right{ width: 100%;padding-left:0;}
	.s-top-b{border-top: 1px solid #e8e8e8; border-bottom: 3px solid #e8e8e8;}
	.s-top-b p{ flex-wrap:wrap;}
	.s-top-b span{ width:100%;}
  
  .search,#footer .container{ display:none;}
  .sj_footer{ display:block; margin-bottom:5.5em;}
	#footer{ background-color:#FFF; padding:.5em 0; margin-top:.5em;}
  #footer p:nth-child(1){color: #ccc;}
	#footer p{padding: 6px 0;color: #666; text-align:center;}
	#footer p a{padding: 0 10px;}
	
	#MessageMeiErBeiBottomS {display: flex;  width:100%; min-width: 320px; max-width: 600px; margin:0 auto;  bottom: -.5em;  position: fixed; z-index: 9999;}
	#MessageMeiErBeiBottomS a{ display: block; width:50%;background-color:#f5859e; box-sizing: border-box;}
	#MessageMeiErBeiBottomS a:not(:last-child){border-right: 1px solid #fff;}
	#MessageMeiErBeiBottomS a img{ width:100%;}
	
	
	#footer_f{ font-size:1em;width: 100%;min-width: 320px; max-width: 640px; margin: 0 auto;bottom: 0;position: fixed;height: 3.3em;z-index: 9999; display: flex;}
	#footer_f_l,#footer_f_r{ display: block;width: 50%;height: 3.3em; line-height: 3.3em; text-align: center; color: #fff;}
	#footer_f_l i,#footer_f_r i{vertical-align: -webkit-baseline-middle;padding: .5em .8em;margin-right: .3em;}
	#footer_f_l {background-color:#fd5877; border-right: 2px solid #fff;}
	#footer_f_l i{background: url(../image/b_ico_l.png) no-repeat; background-size: 100%;}
	#footer_f_r {background-color:#58a6fd; position: relative;}
	#footer_f_r i{background: url(../image/b_ico_r.png) no-repeat;background-size: 100%;}
	#footer_f_r .sp3{ font-size:.9em;position: absolute;background-color: #f31919;height: 1.2em;padding: 0 .3em;border-radius: 1em;color: #fff;line-height: 1em;font-style: normal;top: .3em;}
}
@media screen and (min-width: 435px) and (max-width: 550px){	
	.main_image{height: 9.2em;}
	div.flicking_con{ top:9em;}
}
@media screen and (max-width: 550px){
.wall-column{ width: 50%;}
}
@media screen and (max-width: 480px)
{
	.logo-img img{ width: 45%;}
	.top-menu .m_menu{ font-size: 3.5em;}
  .likearticle li{ width: 100%; margin-right: 0;}
	.sec02-nav li:not(:last-child){ margin-right: .2em;}
}
@media screen and (max-width:414px) {
  div.flicking_con{top:7.9em;}
  .main_image{height: 7.7em;}
  .logo-img img{ width: 50%;}
  .top-menu .m_menu{ font-size: 3em;padding-top: .2em;}
  .search .form .btn { height: 2.6em;}
  .sec02-nav li{ padding: 0 1%;}
}
@media screen and (max-width:375px){
  div.flicking_con{top:7.3em;}
  .main_image{height:7.1em;}
	.top-menu .logo-img img{ width: 57%;}
}
@media screen and (max-width:360px) {
  div.flicking_con{top:6.8em;}
  .main_image{height:6.6em;}
	.top-menu .logo-img img{ width: 40%;}
}

@media screen and (max-width: 320px){
	div.flicking_con { top:6.4em; left: ;}
	.main_image{height:6.2em;}
	.logo-img img{ width: 60%;}

}