.delimiter {height:30px;}

/*compoent1*/
.comp-headline1-main{
	position:relative;
	max-height:1.5em; margin-bottom:5px;
	font-size:4rem; line-height:1.5em; font-weight:600; text-align:center;
	overflow:hidden;
}
.comp-headline1-main:before{
	content:'';
	position:absolute; left:0; top:50%; bottom:0; z-index:-1;
	width:100%; height:2px;
	background:#cc3333;
}
.comp-headline1-main > a {
	padding:0 10px;
	color:#333;
	background:white;
}
.comp-headline1-sub{
	max-height:1.5em;
	color:#404040; text-align:center; line-height:1.5em;
	overflow:hidden;
}
.comp-headline1-sub > a {margin-right:4px;}
.comp-headline1 a:hover {color:#cc3333;}
@media (max-width: 767px) {
	.comp-headline1-main{
		max-height:3em;
		font-size:2rem;
	}
	.comp-headline1-main:before{display:none;}
}
/*component1 end*/

/*compoent2*/
.comp-headline2{
	padding-bottom:10px;
	border-bottom:1px solid #e0e0e0;
}
.comp-headline2-main{
	position:relative;
	max-height:1.5em; margin-bottom:5px;
	font-size:2.5rem; line-height:1.5em; font-weight:600; text-align:center;
	overflow:hidden;
}
.comp-headline2-main > a {
	padding:0 10px;
	color:#333;
	background:white;
}
.comp-headline2-sub{
	max-height:1.5em;
	color:#404040; text-align:center; line-height:1.5em;
	overflow:hidden;
}
.comp-headline2-sub > a {margin-right:4px;}
.comp-headline2 a:hover {color:#cc3333;}
@media (max-width: 767px) {
	.comp-headline2-main{
		max-height:3em;
		font-size:2rem;
	}
}
/*compoent2 end*/

/*component3*/
.slider{
	max-width:700px; height:350px;
	background:#404040;
	overflow:hidden;
}
.slider .swiper-slide{position:relative;}
.slider .swiper-slide p{overflow:hidden;}
.slider .swiper-slide a{color:white;}
.slider .swiper-slide a:hover{color:#cc3333;}
.slider-img{width:100%; height:100%;}
.slider-txt{
	position:absolute; left:0; bottom:0; right:0;
	width:100%; height:4.5em; padding:0 10px;
	vertical-align:middle; text-align:center; font-size:1.8rem; font-weight:600; line-height:4.5em; color:white;
	background-image:-webkit-linear-gradient(bottom, rgba(0,0,0, .8) 0%, rgba(0,0,0,0) 100%);
    background-image:-o-linear-gradient(bottom, rgba(0,0,0, .8) 0%, rgba(0,0,0,0) 100%);
    background-image:linear-gradient(to top, rgba(0,0,0, .8) 0%, rgba(0,0,0,0) 100%);
}
.slider img {
	transition: all 2s ease-in-out 0s;
	-webkit-transition: all 2s ease-in-out 0s;
	-o-transition: all 2s ease-in-out 0s;
}
.swiper-container .swiper-pagination{
	width:100%; left:0;
}
@media (max-width: 767px) {
	.slider-txt{
		height:2em;
		line-height:2em;
	}
}
/*component3 end*/

/*component4*/
.pic-box1 {
	position:relative;
	width:100%; height:330px;
}
.pic-box1-img,
.pic-box1-txt{
	position:absolute; top:0;
	height:100%;
	overflow:hidden;
}
.pic-box1-img{
	left:0;
	width:66.67%;
}
.pic-box1-txt{
	right:0;
	width:33.33%; padding:1em;
	background:#f5f5f5;
}
.pic-box1-txt a{
	display:block;
	max-height:6em; margin-bottom:.5em;
	color:#404040; font-size:2rem; font-weight:600; line-height:2em;
	overflow:hidden;
}
.pic-box1-txt a:hover{color:#cc3333;}
.pic-box1-txt p{
	max-height:10em;
	color:#808080; line-height:2em;
	overflow:hidden;
}
.pic-box1-txt:before{
	content:'';
	position:absolute; top:0; left:0; right:0;
	height:1px;
	background:#cc3333;
}
@media (max-width: 767px) {
	.pic-box1-txt a {
		max-height:10.5em;
		font-size:1.5rem; line-height:1.5em;
	}
}
/*component4 end*/

/*component5*/
.pic-box2 a{display:block;}
.pic-box2 > div > a{overflow:hidden;}
.pic-box2-txt{
	padding:.5em;
	border-bottom:1px solid #cc3333; background:#f5f5f5;
}
.pic-box2-txt > a{
	height:3em;
	font-size:16px; color:#404040; line-height:1.5em;
	overflow:hidden;
}
.pic-box2-txt > a:hover{color:#cc3333;}
/*component5 end*/

/*component6*/
.db-list {}
.db-list li {
	position:relative;
	height:2em; padding-left:10px; margin-bottom:.5em;
	line-height:2em;
	overflow:hidden;
}
.db-list li:before {
	content:'';
	position:absolute; left:0; top:0; bottom:0;
	width:5px; height:5px; margin:auto;
	background:#e0e0e0;
}
.db-list a {color:#404040;}
.db-list a:hover {color:#cc3333;}
/*component6 end*/

/*component7*/
.pic-box3 > li{
	padding:15px 0;
	border-bottom:1px solid #dbdbdb;
}
.pic-box3 > li > a,
.pic-box3-txt{float:left;}
.pic-box3 > li > a{
	width:33.33%;
	overflow:hidden;
}
.pic-box3-txt{
	width:66.67%; padding-left:15px;
}
.pic-box3-txt > a,
.pic-box3-desc,
.pic-box3-info{
	display:block;
	max-height:3em; margin-bottom:15px;
	line-height:1.5em;
	overflow:hidden;
}
.pic-box3-txt > a{
	color:#404040; font-size:2rem; font-weight:600;
}
.pic-box3-txt > a:hover{color:#cc3333;}
.pic-box3-desc{color:#808080;}
.pic-box3-info{
	max-height:3em; margin-bottom:0;
	color:#b2b2b2;
}
.pic-box3-info span{margin-right:10px;}
@media (min-width: 992px) {}
@media (max-width: 991px) {}
@media (max-width: 767px) {
	.pic-box3-txt > a{font-size:1.8rem;}
}
/*component7 end*/

/*component8*/
.list-style1 li{
	padding:15px 0;
	border-bottom:1px solid #dbdbdb;
}
.list-style1 li:first-child{border-top:2px solid #cc3333;}
.list-style1 li > a,
.list-style1-desc,
.list-style1-info{
	display:block;
	max-height:3em;
	line-height:1.5em;
	overflow:hidden;
}
.list-style1 li > a{
	margin-bottom:15px;
	color:#404040; font-size:2rem; font-weight:600;
}
.list-style1 li > a:hover{color:#cc3333;}
.list-style1-desc{
	margin-bottom:15px;
	color:#808080; font-size:1.5rem;
}
.list-style1-info{
	color:#b2b2b2; font-size:1.5rem;
}
.list-style1-info span{margin-right:10px;}
/*component8 end*/

/*component9 */
.pic-box4 > li{
	padding:15px 0;
	border-bottom:1px solid #dbdbdb;
}
.pic-box4 > li > a,
.pic-box4-txt{float:left;}
.pic-box4 > li > a{
	width:25%;
	overflow:hidden;
}
.pic-box4-txt{
	width:75%; padding-left:15px;
}
.pic-box4-txt > a,
.pic-box4-info{
	display:block;
	max-height:3em; margin-bottom:15px;
	line-height:1.5em;
	overflow:hidden;
}
.pic-box4-txt > a{
	color:#404040; font-size:2rem; font-weight:600;
}
.pic-box4-txt > a:hover{color:#cc3333;}
.pic-box4-info{
	max-height:1.5em; margin-bottom:0;
	color:#b2b2b2;
}
.pic-box4-info span{margin-right:10px;}
@media (max-width: 767px) {
	.pic-box4-txt > a{font-size:1.8rem;}
}
/*component9 end*/

/*component10 */
.pic-box5 a{display:block;}
.pic-box5 > div > a {overflow:hidden;}
.pic-box5-txt{padding:.5em;}
.pic-box5-txt > a{
	max-height:1.5em;
	font-size:1.6rem; color:#404040; line-height:1.5em; font-weight:600;
	overflow:hidden;
}
.pic-box5-txt > a:hover{color:#cc3333;}
.pic-box5-info{
	height:1.5em; margin-top:10px;
	font-size:1.2rem; color:#b2b2b2; line-height:1.5em;
	overflow:hidden;
}
/*component10 end */

/*component11 */
.trans-rank {}
.trans-rank-channel{
	position:absolute; 
	width:100%; top:-1em;
	text-align:center;
}
.trans-rank-channel > span{
	padding:0 10px;
	color:#cc3333; font-weight:600; font-size:2rem; 
	background:white;
}
.trans-rank-channel a {color:#cc3333;}
.trans-rank > ul{
	padding:30px 15px 0;
	border:1px solid #e0e0e0;
}
.trans-rank li{
	position:relative;
	padding-bottom:30px;
}
.trans-rank li:after{
	content:'';
	position:absolute; bottom:20px; left:3em;
	width:20%; height:1px;
	background:#e0e0e0;
}
.trans-rank li a{
	display:block;
	overflow:hidden;
}
.trans-rank li > a{
	display:none;
	margin-bottom:5px;
}
.trans-rank-txt{
	position:relative;
}
.trans-rank-txt > a{
	height:4em; padding-left:3em;
	line-height:2em;
}
.trans-rank-txt > span {
	position:absolute; top:0; left:0;
	font-size:3rem; color:#e0e0e0; font-weight:600;
}
.trans-rank li.checked > a{display:block;}
.trans-rank li.checked .trans-rank-txt > a{
	color:#333; font-weight:600;
}
.trans-rank li.checked .trans-rank-txt > span{color:#cc3333;}
@media (max-width: 767px) {}
/*component11 end */

/*component12 */
.trans-tab {}
.trans-tab-header {margin-bottom:10px;}
.trans-tab-nav {
	float:left; position:relative;
	width:50%; height:40px;
	line-height:40px; text-align:center;
	background:#f5f5f5;
	cursor:pointer;
}
.trans-tab-nav.checked {background:#cc3333;}
.trans-tab-nav.checked:after {
	content:'';
	position:absolute; top:35px; left:0; right:0;
	width:1px; height:1px; margin:auto;
	border:10px solid transparent; border-top-color:#cc3333;
}
.trans-tab-nav > a {
	display:block;
	width:100%; height:100%;
	color:#333;
}
.trans-tab-nav.checked > a {color:white;}
.trans-tab-ul {
	display:none;
	border:1px solid #e0e0e0;
}
.trans-tab-ul.checked {display:block;}
.trans-tab-up {position:relative;}
.trans-tab-up > a {
	display:block;
	overflow:hidden;
}
.trans-tab-up > a:last-child {
	position:absolute; left:0; bottom:0; right:0;
	height:3em; padding:0 15px;
	line-height:3em; font-size:1.6rem; color:white;
	background-image:-webkit-linear-gradient(bottom, rgba(0,0,0, .8) 0%, rgba(0,0,0,0) 100%);
    background-image:-o-linear-gradient(bottom, rgba(0,0,0, .8) 0%, rgba(0,0,0,0) 100%);
    background-image:linear-gradient(to top, rgba(0,0,0, .8) 0%, rgba(0,0,0,0) 100%);
}
.trans-tab li {
	position:relative;
	height:3em; padding-left:10px; margin:0 15px;
	line-height:3em;
	border-bottom:1px solid #e0e0e0;
	overflow:hidden;
}
.trans-tab li:before {
	content:'';
	position:absolute; left:0; top:0; bottom:0;
	width:4px; height:4px; margin:auto;
	background:#e0e0e0;
}
.trans-tab li:last-child {
	margin-bottom:.5em;
	border:none;
}
@media (max-width: 767px) {}
/*component12 end */

/*component13 */
.no-pic {position:relative;}
.no-pic-channel{
	position:absolute; 
	width:100%; top:-1em;
	text-align:center;
}
.no-pic-channel > span{
	padding:0 10px;
	color:#cc3333; font-weight:600; font-size:2rem; 
	background:white;
}
.no-pic-channel a {color:#cc3333;}
.no-pic > ul{
	padding:30px 15px 0;
	border:1px solid #e0e0e0;
}
.no-pic li {
	position:relative;
	height:3em; padding-left:12px;
	line-height:3em;
	border-bottom:1px solid #e0e0e0;
	overflow:hidden;
}
.no-pic li:before {
	content:'';
	position:absolute; left:0; top:0; bottom:0;
	width:4px; height:4px; margin:auto;
	background:#e0e0e0;
}
.no-pic li:last-child {
	margin-bottom:.5em;
	border:none;
}
/*component13 end */

/*component14 */
.has-pic {position:relative;}
.has-pic-channel{
	position:absolute; 
	width:100%; top:-1em;
	text-align:center;
}
.has-pic-channel > span{
	padding:0 10px;
	color:#cc3333; font-weight:600; font-size:2rem; 
	background:white;
}
.has-pic-channel a {color:#cc3333;}
.has-pic > ul{
	padding:30px 15px 0;
	border:1px solid #e0e0e0;
}
.has-pic li {
	position:relative;
	padding-left:100px; margin-bottom:15px;
}
.has-pic li a {
	display:block;
	overflow:hidden;
}
.has-pic li a:first-child {
	position:absolute; left:0; top:0;
	width:90px; height:90px;
}
.has-pic li a:last-child {
	height:90px;
	line-height:30px;
}
/*component14 end */

/*component15 */
.trans-pic {position:relative;}
.trans-pic-channel{
	position:relative; top:0;
	width:100%; padding-bottom:10px;
	text-align:center;
	border-bottom:2px solid #cc3333;
}
.trans-pic-channel > span{
	padding:0 10px;
	color:#cc3333; font-weight:600; font-size:2rem; 
	background:white;
}
.trans-pic-channel a {color:#cc3333;}
.trans-pic li {
	position:relative;
	padding-left:15px;
	border-bottom:1px solid #e0e0e0;
}
.trans-pic li:last-child {border:none;}
.trans-pic li a {
	display:block;
	overflow:hidden;
}
.trans-pic li a:first-child {
	display:none; position:absolute; left:15px; top:15px;
	width:90px; height:90px;
}
.trans-pic li a:last-child {
	position:relative;
	height:3em; padding-left:12px;
	line-height:3em;
}
.trans-pic li a:last-child:before {
	content:'';
	position:absolute; left:0; top:0; bottom:0;
	width:4px; height:4px; margin:auto;
	background:#e0e0e0;
}
.trans-pic li.checked {
	padding:15px; padding-left:115px;
	border:1px solid #e0e0e0; border-top:none;
	background:#f5f5f5;
}
.trans-pic li.checked > a:first-child {display:block;}
.trans-pic li.checked > a:last-child {
	height:90px; padding-left:0;
	line-height:30px;
}
.trans-pic li.checked > a:last-child:before {display:none;}
/*component15 end */

/*component16 */
.right-pic{position:relative;}
.right-pic-channel{
	position:absolute; 
	width:100%; top:-1em;
	text-align:center;
}
.right-pic-channel > span{
	padding:0 10px;
	color:#cc3333; font-weight:600; font-size:2rem; 
	background:white;
}
.right-pic-channel a {color:#cc3333;}
.right-pic > ul{
	padding:30px 15px 0;
	border:1px solid #e0e0e0;
}
.right-pic li{
	position:relative;
	margin-bottom:30px;
}
.right-pic li:after{
	content:'';
	position:absolute; top:105%; left:0;
	width:20%; height:1px;
	background:#e0e0e0;
}
.right-pic li a{
	display:block;
	overflow:hidden;
}
.right-pic li a:last-child{
	height:1.5em; margin-top:.5em;
	line-height:1.5em; color:#808080;
}
/*component16 end */

/*component17 */
.right-vid{position:relative;}
.right-vid-channel{
	position:absolute; 
	width:100%; top:-1em;
	text-align:center;
}
.right-vid-channel > span{
	padding:0 10px;
	color:#cc3333; font-weight:600; font-size:2rem; 
	background:white;
}
.right-vid-channel a {color:#cc3333;}
.right-vid > ul{
	padding:30px 15px 0;
	border:1px solid #e0e0e0;
}
.right-vid li{
	position:relative;
	margin-bottom:30px;
}
.right-vid li:after{
	content:'';
	position:absolute; top:105%; left:0;
	width:20%; height:1px;
	background:#e0e0e0;
}
.right-vid li a{
	display:block;
	overflow:hidden;
}
.right-vid li a:last-child{
	height:1.5em; margin-top:.5em;
	line-height:1.5em; color:#808080;
}
.right-vid li a:first-child:after {
	content:'';
	position:absolute; left:0; right:0; bottom:0; top:0;
	width:40px; height:40px; margin:auto;
	background:url('../img/v8_index_20181010_play-video.png');
	background-size:100% 100%;
	transition: all 0.1s ease-in-out 0s;
	-webkit-transition: all 0.1s ease-in-out 0s;
	-o-transition: all 0.1s ease-in-out 0s;
}
.right-vid li a:first-child:hover:after{
	width:45px; height:45px;
}
/*component17 end */