.icon i{color: #d2b356;font-size: 1.5rem;}

#VIP-service{border: 1px solid #d2b356; font-size:1rem; width: 95%;left: 0;padding: 0.5rem;margin-top:0.8rem;margin-bottom:1.3rem;}

div.slideBox{ position:relative; width:100%; height:100%; overflow:hidden;}
div.slideBox ul.items{ position:absolute; float:left; background:none; list-style:none; padding:0px; margin:0px;}
div.slideBox ul.items li{ float:left; background:none; list-style:none; padding:0px; margin:0px;}
div.slideBox ul.items li a{ float:left; line-height:normal !important; padding:0px !important; border:none/*For IE.ADD.JENA.201206300844*/;}
div.slideBox ul.items li a img{ width:100%;margin:0px !important; padding:0px !important; display:block; border:none/*For IE.ADD.JENA.201206300844*/;}
div.slideBox div.tips{ position:absolute; bottom:0px; width:100%; height:50px; background-color:#000; overflow:hidden;}
div.slideBox div.tips div.title{ position:absolute; left:0px; top:0px; height:100%;}
div.slideBox div.tips div.title a{ color:#FFF; font-size:18px; line-height:50px; margin-left:10px; text-decoration:none;}
div.slideBox div.tips div.title a:hover{ text-decoration:underline !important;}
div.slideBox div.tips div.nums{ position:absolute; right:0px; top:0px; height:100%;}
div.slideBox div.tips div.nums a{ display:inline-block; >float:left/*For IE.ADD.JENA.201206300844*/; width:20px; height:20px; background-color:#FFF; text-indent:-99999px; margin:15px 10px 0px 0px;}
div.slideBox div.tips div.nums a.active{ background-color:#093;}

/*20220620荣奕成--手机端底部布局*/
#bottomMenu{
	display: block;
	position: fixed;
	bottom: 0;
	width: 100%;
	z-index:5;
}


/*20190816董旭--手机端布局样式*/
#mobile-bottom-menu {
            display: block;
            position: fixed;
            bottom: 0;
            width: 100%;
            /*height: 70px;*/
            color: #474747;
            padding-top: 10px;
            border-top: 1px solid #eee;
            background-color: #fff;
        }

        .subMenu {
			padding-left:18px;
            width: 20%;
            float: left;
            cursor: pointer;
        }

        .menu_name {
			font-size: 90%;
			margin-top: 5px;
			magin:0 auto;
            height: 48px;
            width: 48px;
            line-height: 20px;
        }

        img.menu_img {
            height: 24px;
            width: 24px;
        }

        img {
            vertical-align: middle;
            border: 0;
        }

        .active {
            color: #FFA129;
        }

        .text-center {
            text-align: center
        }
		  
		.side{position:fixed;width:54px;height:275px;right:0;top:214px;z-index:100;}
		.side ul li{width:54px;height:54px;float:left;position:relative;border-bottom:1px solid #444;}
		.side ul li .sidebox{position:absolute;width:54px;height:54px;top:0;right:0;transition:all 0.3s;background:#000;opacity:0.8;filter:Alpha(opacity=80);color:#fff;font:14px/54px "微软雅黑";overflow:hidden;}
		.side ul li .sidetop{width:54px;height:54px;line-height:54px;display:inline-block;background:#000;opacity:0.8;filter:Alpha(opacity=80);transition:all 0.3s;}
		.side ul li .sidetop:hover{background:#ae1c1c;opacity:1;filter:Alpha(opacity=100);}
		.side ul li img{float:left;}





#menu{width: 88px;height: auto; position: fixed;top: 50%;right: 15px;margin-top: -135px;z-index: 1000000;}
#menu ul{display: block;list-style: none}
#menu ul li a{width: 88px; height: 54px; line-height: 54px; text-align: center;background-color: #fff;color: #32c96a;display: block}
#menu ul li a:hover,#menu ul li a.cur{background-color: #32c92a;color: #fff;}
.mobile-container{
	width:90%;margin: 0 auto;
	font-size: 80%;
}
.mobile-card-100{
	width:100%;border-radius: 0.5rem; background: #fffaf0; text-align: left;padding: 10px; margin-top: 10px; margin-bottom: 10px;
}
.mobile-title-100{
	background: #7a161c;
	text-align: left;
	padding-left:10px; color: #fff;height:30px;line-height:30px;
}
.mobile-pic-100 img{
	width:100%;
}
.mobile-card-25{
	width:25%;float: left;
}
.mobile-card-25 img{
	width:100%;
}
.mobile-card-33{
	width:30%;padding: 10px;float: left;margin:5px;
}
.mobile-card-50{
	width:50%;float: left; padding:10px;
}


/*1)流动布局*/
/*页面中各个区块的位置都是浮动的，不是固定不变的，如果宽度太小，放不下两个元素，后面的元素会自动滚动到前面元素的下方，不会在水平方向overflow（溢出），避免了水平滚动条的出现*/
/*.left{ width:30%; float:left}
.right{ width:70%; float:right;}*/

/*html {font-size:62.5%;} */
/*字体大小是页面默认大小的100%，即12像素。字体不要使用绝对大小"PX"，要使用相对大小“REM”*/
body {font:normal 100% Arial,sans-serif;font-size:18px;/*background-color:#f7f7f7*/margin:0 auto;padding:0;color:#333;overflow-x: hidden;-webkit-font-smoothing: antialiased; }

/*给图片指定的最大宽度为百分比。假如图片超过了，就缩小。假如图片小了，就原尺寸输出。*/
/*windows平台缩放图片时，可能出现图像失真现象。这时，可以尝试使用IE的专有命令*/
/*img { width:100%; -ms-interpolation-mode: bicubic;}*/


div {
/*removing the space between your inline divs*/
  box-sizing: border-box;
  /*background-color: #000000;*/
  /*border: 1px solid black;*/
}

/*div :hover{filter:drop-shadow(0 0 0 black);}*/

section {
	/*removing the space between your inline divs
  box-sizing: border-box;
  /*Only vertical (top and bottom) margins!*/
  float: left;
  width: 100%;
  text-align:center;
  margin:0;
  padding:0;

}

/*从列表中去掉圆点和外边距*/
ul{
  list-style-type:none;
  margin:0;
  padding:0;
}

h2{
	/*font-size:1.25rem;*/
	/*text-align: left;*/
	margin-top:10px;
  margin-bottom:10px;
}

h3{
  margin-top:10px;
  margin-bottom:10px;
  /*font-size: 100%;*/
  font-weight: normal;
}


p{
  margin-top:10px;
  margin-bottom:10px;
}

a{
  text-decoration:none;
  color:black;
}
/*===========================手机端电脑端显示=========================*/

/*手机端不显示*/

@media only screen and (max-width: 600px) {
  .mobile-hide{
  display: none;
}
}

/*只有手机端显示*/
.mobile-show{
  display: none;
}

@media only screen and (max-width: 600px) {
  .mobile-show{
  display: inline;
}
}

/*pc端手机端都显示*/
@media only screen and (max-width: 600px) {
  .both-show{
  display: inline;
}
}

/*===========================所有通用部分=========================*/
/*点击显示图片-classname*/
.clickshow-classname{display:none;} 
@media only screen and (max-width: 600px) {
  .clickshow-classname{display:none;} 
}

/*第一个section距离navbar底部的距离*/
.first-section{
  margin-top:100px;
}

@media only screen and (max-width: 600px) {
  .first-section{
  margin-top:6%;
}
}


/*===================================主页======================================*/
/*手机端滚动新闻*/
#rolling-news{
    overflow: hidden;
    height: 21px;
    padding-left: 10px;
    text-align:left;
/*    background-color: yellow;*/
  }

/*#rolling-news > a > div{display: inline}*/
#rolling-news > a > div:hover{background-color: orange;}

@media only screen and (max-width: 600px) {
#rolling-news{
    overflow: hidden;
    height: 19px;
    text-align:center;
    /*background-color: yellow;*/
  }

#rolling-news > a > div{display: block}
#rolling-news > a > div:hover{background-color: transparent;}

}


/*===================================主页======================================*/


/*顶部链接*/
.top-links > a:hover{
  background-color: orange;
  color:white;
}

/*div中的div水平垂直居中*/

.center-outter-container{
  width: 100%;
  margin:0 auto;
  display:table;
}

.center-inner-container{
  text-align:center;
  display:table-cell;
  vertical-align:middle;
}
/*div{
  字超出div外框
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}*/
/*鼠标悬停效果*/

.nav-top-aline a:hover {background-color: #7a161c;color:#ffffff;}


/*窄的段落间距*/
.p-narrow{
margin-top:4px;
margin-bottom:4px;	

}

/*div字在中间*/
.center {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  border: none;
}

.center-twoside-nospace {
  position: absolute;
  left: 10%;
  /*right: 10%;*/
  top: 50%;
  transform: translate(0%, -50%);
  border: none;
  text-align: center;
  align-content: center;
}

/*div字在右边*/
.right {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border: none;

}

/*查看更多*/

.seemore{
	position: absolute;
	bottom:0;
	right: 0;
	font-size:65%;
  border: 1px solid #7a161c;
  border-radius:1em;
}

.seemore a{
  color:#7a161c;
}

.seemore:hover {background-color: #7a161c;}

.seemore a:hover {color:#ffffff;}

.seemore-center{
  /*position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);*/
  border: 4px solid orange;
  border-radius:1em;
  display: inline-block;
  font-size:120%
}

.seemore-center a{
  color:orange;
}

.seemore-center:hover {background-color: orange;}

.seemore-center a:hover {color:#ffffff;}

.textoverflow {
  overflow: hidden; 
  text-overflow: ellipsis; 
  word-wrap: break-word;
  /*显示几行*/
  display: -webkit-box;
  -webkit-box-orient: 
  vertical;-webkit-line-clamp: 2;
}
/*------------模板用-----------------*/

/*div 和section一样功能的div-----*/

.section-line {
float: left;
width: 100%;
margin: 0 auto;
background-color: #ffffff;

}

/*顶部*/
.header-line {
font-size: 75%;
text-align:right;
background-color: #ffffff;
} 

/*顶部广告*/
.header-adv {
height: 60px;
text-align:center;
/*垂直居中*/
color: #ffffff;
background-color: #7a161c;

} 

.header-adv span {
  display: inline-block;
  vertical-align: middle;
  line-height: normal;

}

.bottom-line {
font-size: 75%;
text-align:center;
} 


/*====================导航栏=========================*/

#navbar-top {
  position:fixed;top:0;
  border-bottom: 1px solid lightgray;
  /*float: left;*/
  width: 100%;
  margin: 0 auto;
  background-color: #ffffff;
  margin-bottom: 50px;
}

.dropbtn {
  /*background-color: #4CAF50;*/
  /*color: white;*/
  /*padding: 16px;*/
  /*border: none;*/
}

/*--下拉菜单--*/
.dropdown {
  position: relative;
  display: inline-block;
  background-color: #ffffff;
}

.dropdown a{
  text-decoration: none;
  font-weight: 800;
  line-height: 200%;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #ffffff;
  /*min-width: 160px;*/
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
  font-size: 90%;
}

.dropdown-content a {
  /*color: black;*/
  /*padding: 12px 16px;*/
  text-decoration: none;
  display: block;
}

.dropdown-content a:hover {background-color: #7a161c;color:#ffffff;}

.dropdown:hover .dropdown-content {display: block;}

.dropdown:hover .dropbtn {background-color: #7a161c;color:#ffffff;}



/*--下拉菜单结束--*/

.nav-top-aline{
margin:0 auto;
float: right;
font-size: 100%;
display: inline-block;
}


/*导航栏每个菜单栏*/
.nav-top li{
float:left;
background-color: #ffffff;
}

.nav-top a{
    /*font-size: 155%;*/
    font-size: 18px;
    display: inline-block;
    /*width: 150px;*/
    width: 100%;
    /* width: 107px; */
    border: 1px solid #ffffff;
    padding: 4px;
    text-align: center;
}

/*所在路径整体*/
.path-line{
float: left;
width: 100%;
} 

/*--------------------正文用---------------------*/


/*宽度层*/
.container-topwidth{
	/*max-width: 1300px;*/
  width: 1270px;
	margin: 0 auto;
  vertical-align:middle;
  position: relative;
  /*display: inline-block;*/
}

@media only screen and (max-width: 600px) {
  .container-topwidth{
  width: 96%;
  margin-left: 2%;
  margin-right: 2%;
  margin-top: 1%;
}
}

.container-pagewidth-narrow{
  padding-top: 1%;
  padding-bottom: 1%;
	width: 1200px;
	margin: 0 auto;
  vertical-align:middle;
  position: relative;
  /*使外面的div高度fit with 里面的*/
  display: inline-block;
}

@media only screen and (max-width: 600px) {
  .container-pagewidth-narrow{
  width: 94%;
  margin-left: 3%;
  margin-right: 3%;
}
}

.container-pagewidth-narrow-nospace{
/*  padding-top: 1em;
  padding-bottom: 1em;*/
  width: 1100px;
  margin: 0 auto;
  vertical-align:middle;
  position: relative;
  /*使外面的div高度fit with 里面的*/
  display: inline-block;
}

@media only screen and (max-width: 600px) {
  .container-pagewidth-narrow-nospace{
  width: 100%;
}
}

.container-center-w20{
  padding-top: 1em;
  padding-bottom: 1em;
  width: 20%;
  margin: 0 auto;
  vertical-align:middle;
  position: relative;
  /*使外面的div高度fit with 里面的*/
  display: inline-block;
}

@media only screen and (max-width: 600px) {
  .container-center-w20{
  width: 40%;
}
}

.container-center-w40{
  padding-top: 1em;
  padding-bottom: 1em;
  width: 40%;
  margin: 0 auto;
  vertical-align:middle;
  position: relative;
  /*使外面的div高度fit with 里面的*/
  display: inline-block;
}

@media only screen and (max-width: 600px) {
  .container-center-w40{
  width: 80%;
}
}

/*绝对层*/

.container-abs-centerbase{
position: absolute; 
display: table;
transform: translate(-50%, -50%);  
}

.container-abs-borderbase{
position: absolute; 
display: table; 
}

.container-abs-verticalcenter{
position: absolute; 
display: table;
transform: translate(-50%, -50%);
top: 50%;
}

/*字垂直居中*/
.container-abs-verticalcenter span{
  display: table-cell;
  vertical-align: middle;
}

.container-abs-horizoncenter{
position: absolute; 
display: table;
transform: translate(-50%, -50%); 
left: 50%;
}

/*标题*/

/*用h2*/
.first-title{
color:#7a161c;font-size:200%;
padding-top:2%;
padding-bottom:2%;
}

/*居中标题*/

/*用div*/
.second-title{
position: absolute; 
display: table;
transform: translate(-50%, -50%); 
left: 50%;
top: 0%;
font-size:150%;display:block;color:#ffffff;border:5px solid #7a161c;text-align:center;background-color:#7a161c;border-radius:20px;align-items: center;font-weight: bold;
}

.third-title{
position: absolute; 
display: table;
transform: translate(-50%, -50%); 
left: 50%;
width: 80%;
top: 0%;
font-size:150%;display:block;color:#ffffff;border:5px solid #7a161c;text-align:center;background-color:#7a161c;border-radius:20px;align-items: center;font-weight: bold;
}

/*装饰*/

/*相对层*/
.container-relate-w10{
  width: 10%;
  float: left;
  position: relative;
  margin:0 auto;
} 

@media only screen and (max-width: 600px) {
  .container-relate-w10{
  width: 100%;
}
}

.container-relate-w15{
  width: calc(1/6*100%);
  float: left;
  position: relative;
  margin:0 auto;
} 

@media only screen and (max-width: 600px) {
  .container-relate-w15{
  width: 100%;
}
}

.container-relate-w17-5{
  width: 17.5%;
  float: left;
  position: relative;
  margin:0 auto;
} 

@media only screen and (max-width: 600px) {
  .container-relate-w17-5{
  width: 100%;
}
}

.container-relate-w20{
  width: calc(1/5*100%);
  float: left;
  position: relative;
  margin:0 auto;
} 

@media only screen and (max-width: 600px) {
  .container-relate-w20{
  width: 100%;
}
}

.container-relate-w22{
  width: 22%;
  float: left;
  position: relative;
  margin:0 auto;
} 

@media only screen and (max-width: 600px) {
  .container-relate-w22{
  width: 100%;
}
}


.container-relate-w25{
  width: calc(1/4*100%);
  float: left;
  position: relative;
  margin:0 auto;
} 

@media only screen and (max-width: 600px) {
  .container-relate-w25{
  width: 100%;
}
}

.container-relate-w30{
  width: 30%;
  float: left;
  position: relative;
  margin:0 auto;
}

@media only screen and (max-width: 600px) {
  .container-relate-w30{
  width: 100%;
}
}

.container-relate-w33{
  width: calc(1/3*100%);
  float: left;
  position: relative;
  margin:0 auto;
} 

@media only screen and (max-width: 600px) {
  .container-relate-w33{
  width: 100%;
}
  .container-relate-w100 .container-relate-w33 {
  width: 33%;
}
}

.container-relate-w35{
  width: 35%;
  float: left;
  position: relative;
  margin:0 auto;
} 

@media only screen and (max-width: 600px) {
  .container-relate-w35{
  width: 100%;
}
}

.container-relate-w40{
  width: 40%;
  float: left;
  position: relative;
  margin:0 auto;
} 

@media only screen and (max-width: 600px) {
  .container-relate-w40{
  width: 100%;
}
}

.container-relate-w45{
  width: 45%;
  float: left;
  position: relative;
  margin:0 auto;
} 

@media only screen and (max-width: 600px) {
  .container-relate-w45{
  width: 100%;
}
}


.container-relate-w50{
  width: calc(1/2*100%);
  float: left;
  position: relative;
  margin:0 auto;
}

@media only screen and (max-width: 600px) {
  .container-relate-w50{
  width: 100%;
}
}

.container-relate-w60{
  width: 60%;
  float: left;
  position: relative;
  margin:0 auto;
} 

@media only screen and (max-width: 600px) {
  .container-relate-w60{
  width: 100%;
}
}

.container-relate-w66{
  width: calc(2/3*100%);
  float: left;
  position: relative;
  margin:0 auto;
} 

@media only screen and (max-width: 600px) {
  .container-relate-w66{
  width: 100%;
}
}

.container-relate-w69-5{
  width:69.5%;
  float: left;
  position: relative;
  margin:0 auto;
} 

@media only screen and (max-width: 600px) {
  .container-relate-w69-5{
  width: 100%;
}
}

.container-relate-w70{
  width: 70%;
  float: left;
  position: relative;
  margin:0 auto;
} 

@media only screen and (max-width: 600px) {
  .container-relate-w70{
  width: 100%;
}
}

.container-relate-w75{
  width: 75%;
  float: left;
  position: relative;
  margin:0 auto;
} 

@media only screen and (max-width: 600px) {
  .container-relate-w75{
  width: 100%;
}
}

@media only screen and (max-width: 600px) {
  .fix-width-w75{
  width: 75%;
}
}

.container-relate-w80{
  width: 80%;
  float: left;
  position: relative;
  margin:0 auto;
} 

@media only screen and (max-width: 600px) {
  .container-relate-w80{
  width: 100%;
}
}

.container-relate-w100{
  width: 100%;
  float: left;
  position: relative;
  margin:0 auto;
} 


/*栏顶部图片*/
.container-relate-top-squareimg{
  float: left;
  position:relative;
  margin:0 auto;
  width:100%;
  height:0;
  padding:50%;
  overflow:hidden;
}

.container-relate-top-squareimg>img{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
    }

.container-relate-top-squareimg>img:hover 
{
  transform: scale(1.1); 
  /*box-shadow: inset 0 8px 16px rgba(0, 0, 0, 0.6);*/
}
/*栏顶部图片中间的文字style*/
/*.center,.container-relate-top-text{
font-size:100%;
color:#000000
    }
*/
/*栏顶部标题*/
.container-relate-top-title{
  padding:100%;
  float:left;
  width: 75%;
  position: relative;
  margin:0 auto;
}

/*----带图片的标题的样式----*/
/*图片*/

.container-relate-article-squareimg{
  float: left;
  position:relative;
  margin:0 auto;
  width:10%;
  height:0;
  padding:10%;
  margin-right: 2%;
}

/*.container-relate-article-squareimg:nth-child(2n){background: #ccc}*/

.container-relate-article-squareimg>img{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
    }


/*栏样式*/
.container-relate-article-column{
  width: 100%;
  float: left;
  position: relative;
  margin:0 auto;
  border-top:1px solid lightgray;
  /*border-bottom:1px solid lightgray; */
  padding:3%
}

.container-relate-article-column:hover {background-color: #e5e5e5; }

.container-relate-article-column-last{
  width: 100%;
  float: left;
  position: relative;
  margin:0 auto;
  border-top:1px solid lightgray;
  border-bottom:1px solid lightgray; 
  padding:3%
}

.container-relate-article-column-last:hover {background-color: #e5e5e5;}

.container-relate-article-column-class{
  width: 100%;
  float: left;
  position: relative;
  margin:0 auto;
  padding:5%;
  /*background-color:#ffffff;*/
}

/*.container-relate-article-column-class:hover {color: orange;}*/


/*标题外框*/
.container-relate-article-title{
  padding:10%;
  float:left;
  width: 78%;
  position: relative;
  margin:0 auto;

}

.container-relate-article-title-class{
  padding:5%;
  float:left;
  width: 100%;
  position: relative;
  margin:0 auto;
}

/*标题字*/
.container-relate-article-text{
  /*center-twoside-nospace*/
  position: absolute;
  left: 0%;
  top: 50%;
  transform: translate(0%, -50%);
  border: none;
  margin:0 auto;
  padding:0;

  /*textoverflow*/
  overflow: hidden; 
  text-overflow: ellipsis; 
  word-wrap: break-word;
  /*显示几行*/
  display: -webkit-box;
  -webkit-box-orient: 
  vertical;-webkit-line-clamp: 2;

  font-size:85%;
}

/*标题字--3行*/
.container-relate-article-text-class{
  /*center-twoside-nospace*/
  /*position: absolute;*/
  left: 0%;
  /*top: 50%;*/
  /*transform: translate(0%, -50%);*/
  border: none;
  margin:0 auto;
  padding:0;

  /*textoverflow*/
  overflow: hidden; 
  text-overflow: ellipsis; 
  word-wrap: break-word;
  /*显示几行*/
  display: -webkit-box;
  -webkit-box-orient: 
  vertical;-webkit-line-clamp: 3;

  font-size:90%;
}

/*图片上的标题标题字*/
.container-relate-article-text-onimage{
  position: absolute;
  left: 0%;
  top: 50%;
  transform: translate(0%, -50%);
  border: none;
  margin:0 auto;
  padding:5%;

  font-size:140%;
  font-weight: bold;
  color:#ffffff;
  width:100%;
}

/*图片上的标题标题字*/
.container-relate-article-text-onimage-small{
  position: absolute;
  left: 0%;
  top: 50%;
  transform: translate(0%, -50%);
  border: none;
  margin:0 auto;
  padding:5%;

  font-size:100%;
  font-weight: bold;
  color:#ffffff;
  width:100%;
}

/*右边角落字*/
.container-relate-article-text-right-bottom{
  /*center-twoside-nospace*/
  position: absolute;
  right: 5%;
  bottom: 5%;
  /*transform: translate(0%, -50%);*/
  border: none;
  margin:0 auto;
  padding:0;

  /*textoverflow*/
  overflow: hidden; 
  text-overflow: ellipsis; 
  word-wrap: break-word;
  /*显示几行*/
  display: -webkit-box;
  -webkit-box-orient: 
  vertical;-webkit-line-clamp: 2;

  font-size:90%;
  color:#ffffff;
}


/*摘要字*/
.container-relate-article-text-intro{
  /*center-twoside-nospace*/
  position: absolute;
  left: 0%;
  top: 50%;
  transform: translate(0%, -50%);
  border: none;
  margin:0 auto;
  padding:0;

  /*textoverflow*/
  overflow: hidden; 
  text-overflow: ellipsis; 
  word-wrap: break-word;
  /*显示几行*/
  display: -webkit-box;
  -webkit-box-orient: 
  vertical;-webkit-line-clamp: 5;

  font-size:80%;

  color:gray;
}
/*------------------------*/


/*图片滑动效果*/
/*图片上下移动前*/
.img-before-down-up {
  /*box-shadow: 1em 1em 2em .25em rgba(0,0,0,.2);*/
  opacity: 0;
  -webkit-transform: translate(0%, calc(-20% + 0.5em));
          transform: translate(0%, calc(-20% + 0.5em));
  -webkit-transition: opacity .3s .25s ease-out,
              -webkit-transform 4s .25s cubic-bezier(0,1,.3,1);
  transition: opacity .3s .25s ease-out,
              -webkit-transform 4s .25s cubic-bezier(0,1,.3,1);
  transition: transform 4s .25s cubic-bezier(0,1,.3,1),
              opacity .3s .25s ease-out;
  transition: transform 4s .25s cubic-bezier(0,1,.3,1),
              opacity .3s .25s ease-out,
              -webkit-transform 4s .25s cubic-bezier(0,1,.3,1);
  /*increase the responsiveness of a page by doing potentially expensive work before they are actually required*/
  will-change: transform, opacity;
}

/*上下移动*/
.img-before-down-up.scrollmove {
  opacity: 1;
  /*-webkit-transform: rotateZ(-2deg);
          transform: rotateZ(-2deg);*/
  -webkit-transform: translate(0%, calc(0%));
          transform: translate(0%, calc(0%));
}

/*图片左右移动前*/
.img-before-left-right {
  /*box-shadow: 1em 1em 2em .25em rgba(0,0,0,.2);*/
  opacity: 0;
  /*这是起始位置*/
  -webkit-transform: translate(calc(-50% + 0.5em),0%);
          transform: translate(calc(-50% + 0.5em),0% );
  -webkit-transition: opacity .3s .25s ease-out,
              -webkit-transform 4s .25s cubic-bezier(0,1,.3,1);
  transition: opacity .3s .25s ease-out,
              -webkit-transform 4s .25s cubic-bezier(0,1,.3,1);
  transition: transform 4s .25s cubic-bezier(0,1,.3,1),
              opacity .3s .25s ease-out;
  transition: transform 4s .25s cubic-bezier(0,1,.3,1),
              opacity .3s .25s ease-out,
              -webkit-transform 4s .25s cubic-bezier(0,1,.3,1);
  /*increase the responsiveness of a page by doing potentially expensive work before they are actually required*/
  will-change: transform, opacity;
}

/*左右移动*/
.img-before-left-right.scrollmove {
  opacity: 1;
  /*-webkit-transform: rotateZ(-2deg);
          transform: rotateZ(-2deg);*/
  /*这是最终位置*/
  -webkit-transform: translate(calc(0%),0%);
          transform: translate(calc(0%),0%);
}

/*悬停闪亮效果*/
.shine {
  overflow: hidden;
  /*宽度和字相同*/
  /*display: inline-block;*/
  position: relative;
}

.shine:after {
  content: "";
  position: absolute;
  top: -110%;
  left: -210%;
  width: 200%;
  height: 400%;
  opacity: 0;
  transform: rotate(45deg);
  background: rgba(255, 255, 255, 0.13);
  background: linear-gradient(
    to right, 
    rgba(255, 255, 255, 0.13) 0%,
    rgba(255, 255, 255, 0.13) 50%,
    rgba(255, 255, 255, 0.5) 65%,
    rgba(255, 255, 255, 0.0) 100%
  );
}

/* Hover state - trigger effect */
.shine:hover:after {
  opacity: 1;
  top: -30%;
  left: -30%;
  transition-property: left, top, opacity;
  transition-duration: 0.7s, 0.7s, 0.15s;
  transition-timing-function: ease;
}

/* Active state */
.shine:active:after {
  opacity: 0;
}
/*--------------------*/

/*滚动画廊*/

#galleryrolling-container
{
    float: left;
    /*width: 1100px;*/
    width: 100%;
    height: 300px;
    padding: 10px;
    /*overflow-x: hidden;*/
    background: #e1e1e1;
}

@media only screen and (max-width: 600px) {
  #galleryrolling-container{
  width: 100%;
}
}

#galleryrolling-container > div 
{
    height: 100%;
    white-space: nowrap;
    /*animation: slide infinite 3s alternate;*/
    /*animation: slide infinite 3s;*/
    animation: slide 20s infinite 0s ;
    background-color: orange;
    margin: 0 auto;
}

#galleryrolling-container:hover > div
{
    animation-play-state: paused;

}

#galleryrolling-container > div > a
{
  text-decoration:none;
  color:black;
  display: inline-block;
  height: 100%;
}


#galleryrolling-container > div > a >div
{
    display: inline-block;
    width: 300px;
    height: 100%;

    white-space: normal;
    word-break:break-all;
    overflow: hidden; 
    text-overflow: ellipsis;

}

/*title*/
#galleryrolling-container > div > a > div >div
{
    display: block;
    height: 20%;
    background-color: #eb6100;
    color: #ffffff;
    font-weight: bold;
    
    line-height:170%; 
}

#galleryrolling-container > div > a > div >img
{
    display: block;
    height: 80%;
    background-color: orange;
}

#galleryrolling-container > div > a > div >img:hover 
{
  transform: scale(1.1); 
  /*box-shadow: inset 0 8px 16px rgba(0, 0, 0, 0.6);*/
}

@keyframes slide {
  0% {
    margin-left: 0px;
  }
  50% {
    margin-left: -650px;
  }
  100% {
    margin-left: -1350px;
  }
}
/*-------------*/

.class-column{
  border-radius:3%;
  border: 1px solid lightgray;
  background-color: #ffffff;
  
}

.class-column > div:hover{box-shadow: 0px 0px 15px 5px rgba(0,0,0,0.2);}

.class-article-title-text{
  font-size:90%;
  margin-top:5%;
  margin-bottom:10%;

  overflow: hidden; 
  text-overflow: ellipsis; 
  word-wrap: break-word;
  /*显示几行*/
  display: -webkit-box;
  -webkit-box-orient: 
  vertical;-webkit-line-clamp: 2;
}


.class-article-text-intro{
  font-size:80%;
  margin-bottom:5%;
  color:gray;

  overflow: hidden; 
  text-overflow: ellipsis; 
  word-wrap: break-word;
  /*显示几行*/
  display: -webkit-box;
  -webkit-box-orient: 
  vertical;-webkit-line-clamp: 2;

}


/*class 方形背景色的上面加圆*/
.add-white-circle{
  overflow:hidden;
}

.add-white-circle::after {
  content: "";
  position: absolute;
  z-index: 1;
  left: 25%;
  bottom: -5%;
  width: 190%;
  height: 190%;
  /*background-color: rgba(0, 0, 0, 0.7);*/
  box-shadow: inset 0px 0px 30px 10vw rgba(255, 255, 255, 0.2);
  border-radius: 100%;
  overflow:hidden;
}

/*class 方形背景色的上面加圆*/
.add-white-circle-small{
  overflow:hidden;
}

.add-white-circle-small::after {
  content: "";
  position: absolute;
  z-index: 1;
  left: 55%;
  bottom: 15%;
  width: 160%;
  height: 180%;
  /*background-color: rgba(0, 0, 0, 0.7);*/
  box-shadow: inset 0px 0px 30px 10vw rgba(255, 255, 255, 0.2);
  border-radius: 100%;
  overflow:hidden;
}

/*增加透明圆，防止别人复制文字*/
.add-transparent--circle{
  overflow:hidden;
}

.add-transparent-circle::after {
  content: "";
  position: absolute;
  z-index: 1;
  left: 25%;
  bottom: -5%;
  width: 190%;
  height: 190%;
  /*background-color: rgba(0, 0, 0, 0.7);*/
  box-shadow: inset 0px 0px 30px 10vw rgba(255, 255, 255, 0.2);
  border-radius: 100%;
  overflow:hidden;
}

/*是否隐藏*/
@media only screen and (max-width: 600px) {
  .hide-mobile{
  display: none;
}
}

/*选校圆圈样式*/

.circle-style{
  height:100px;width:100px;border-radius:100%;border:1px solid lightgray;background-color:orange;color:#ffffff;font-weight:bold
}


/*=================只有主页上有================*/
.school-list a{
  display: block;
  color:#ffffff;"
}
.school-list a:hover{
  background-color: #f1f1f1;
}

.hover-color :hover{
  background-color: #f1f1f1;
}

.hover-darkblue :hover{
 background-color: #4b4d9e;
}