/* appel */
.content{}
.appel{ 
	background-color: #fff; 
	padding: 0px;
    border-radius: 5px;
    margin: 5px;
}	
	.appel-heading{ position: relative;	height: 32px; line-height: 32px; }
	.appel-more{ float: right; color: #999; } 
	.appel-more > span > a + a{ margin-left: 20px; }  
	.appel-more > span > a{ color: #999; }  
	.appel-more > span > a:hover{ color: #c061ff; }  
	.appel-title > small { color: #666; margin-left: 7px; font-weight: 400; }
	.appel-title{ 
		position: relative;
		float: left; 
		/*margin-left: -20px;*/
		padding-left: 20px;
		font-size: 20px; 
		font-weight: 700;
	}  
		.appel-title:after {
			content: "";
			position: absolute;
			top: 50%;
			left: 0;
			width: 3px;
			height: 20px;
			margin-top: -10px;
			left: 5px;
			background-color: #c061ff;
		}
		
	/* appel-tabs */
	.appel-tabs{ }
	.appel-tabs > a + a{ margin-left: 10px;}
	.appel-tabs > a{
		float: left;
    	padding: 0 25px;
    	color: #666;
    	background-color: #f9f9f9;
    	border-radius: 100px;
    	transition: .15s ease-in-out;
	}
		.appel-tabs > a:hover,
		.appel-tabs > a.active{ color: #fff; background-color: #c061ff; }	
		


/* role-relation */
.role-relation{ margin-top: 10px; }
.role-relation table{ width: 100%; font-size: 12px; border: 1px solid #ededed; }
.role-relation table th{background-color: #fcfcfc; white-space: nowrap;}
.role-relation table th,
.role-relation table td{padding: 10px 13px; vertical-align: middle; border: 1px solid #eee; }
.role-relation table > tbody > tr:nth-child(2n+1) td{ background-color: #fcfcfc; }
.role-relation table:first-child > tbody > tr:nth-child(1) td{ white-space: nowrap; background-color: #f5f5f5; font-weight: 700;}
.role-relation table > tbody > tr > td:nth-child(-n+2){ text-align: center; min-width: 80px; }
.role-relation table td p{ min-width: 200px; }



#wznr{width:100%;}
#wznr .nrtitle{text-align: center;clear:both;color:#333333;margin:10px auto;line-height: 25px;}
#wznr .nrtitle h1{text-align: center;font-size:16px;clear:both;color:#333333;margin:10px auto;}
#wznr .ttnr{width:98%; line-height:30px;padding-left:10px;padding-bottom:20px;clear:both;color:#333333;}
#wznr .ttnr em{width:98%;font-style:normal; line-height:30px;padding-left:10px;clear:both;color:#333333;}
#wznr .ttnr img{display:block;margin: 5px auto; float: center;max-width:90%; width:expression(document.body.clientWidth>800? "800px";"auto"); overflow:hidden; }
#ddav{width: 900px; margin: 5px auto; text-align: center; display: block;}
#ddav img{width: 100%;height: 60px; }

#ddab{width: 100%;height: 20px; margin: 5px auto; line-height: 20px; text-align: center; border-radius: 3px; display: block;}
#ddab .seach form{height:20px}
#ddab .seach{width:100%;float:center;height:20px}
#ddab .seach input{display:block;width:70%;float:left;border:1px solid #c061ff;padding-top:8px;padding-bottom:8px;text-indent:0.2em;border-radius: 4px;}
#ddab .seach button{border:none; background:#c061ff;color:#fff;display:block;width:28%;float:right;padding-top:1px;border-radius:4px;cursor:pointer;height:38px}

@media screen and (max-width:800px) {
.header{ background-color: #ffffff; width: 100%; margin: auto;box-shadow: 0 1px 3px rgba(0,0,0,.08); }
#ddav{width: 90%; margin: 5px auto; text-align: center; display: block;}
#ddav img{width: 100%;height: 60px; }
	.area{margin:0 auto;width:97%;margin:0 auto;overflow:hidden;}
	.youmu-app dl{padding:6px 0;}
	.youmu-app dt{width:20%;line-height:45px;font-size:16px;font-weight:bold;}
	.youmu-app dd{width:20%;line-height:25px;font-size:14px;}
	.youmu-app dt:after {margin:13px 3.6% 0;}
	.youmu-app .first{border-top:0;}
	
    .content{ padding-top: auto; }
	.container{ width: auto; }
   
	.footer{ padding: 10px; font-size: 12px; line-height: 1.5; margin-top: 10px;}
	.backtop{ bottom: 30px; }
	.backtop .iconfont{ width: 32px; height: 32px; line-height: 32px; font-size: 18px; background-color: #c061ff; }
	.container > .appel:first-child{ margin-top: 0; }
	.appel{ margin-top: 10px; padding: 5px; }
	.appel-main{ width: auto; float: none; }
	.appel-aside{ width: auto; float: none; border-top: 1px solid #f0f0f0;  margin-top: 10px; padding-top: 3px; }
	.appel-title{ font-size: 16px; margin-left: 5px; padding-left: 10px; }  
	.appel-more{ font-size: 12px; }  
	.thumbnail-group{ margin: 0; }
	.thumbnail-group > li{ float: left; width: 25%; margin: 0; padding: 5px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; }
	.thumbnail-group > li > .thumbnail .video-grade{ padding: 20px 5px 0 0; }
	.thumbnail-group > li > .thumbnail,
	.thumbnail-group > li > .thumbnail img{ width: 100%; height: 115px; }	
	.thumbnail-group-small > li > .video-info { padding-top: 5px; } 	
	.thumbnail-group-small > li > .video-info > h4{ font-size: 12px; } 
	.thumbnail-group-small > li > .thumbnail,
	.thumbnail-group-small > li > .thumbnail img{ height: 70px; } 	
	.thumbnail-group-special > li{ float: none; width: auto; }
	.thumbnail-group-special > li > .thumbnail,
	.thumbnail-group-special > li > .thumbnail img{ width: 100%; height: auto; }	
	.appel-main .thumbnail-group > li:nth-child(n+10){ display: none; }
	.rank-group{ padding: 5px; margin-top: 0; }	
	.rank-group > li:nth-child(n+11){ display: none; }
	.rank-group > li{ line-height: 30px; float: left; width: 50%; }
	.rank-group > li .rank-title{ right: 10px; left: 20px; }
	.rank-group > li .rank-grade{ display: none;}
	.filter{ }
	.filter-primary{ padding: 0; line-height: 35px; font-size: 14px; }
	.filter-primary dd{ width: 25%; text-align: center; padding: 5px; }
	.filter-primary dd > a{ display: block; background-color: #f5f5f5; line-height: 30px; font-size: 14px; border-radius: 2px; }
	.category{ margin-top: 10px; padding: 10px 0; line-height: 26px; }
	.category dt{ padding: 0 5px; }
	.category dd{ overflow: inherit; white-space: nowrap; margin-bottom: 7px; }
	.category dd a{ font-size: 12px; height: 26px; line-height: 26px; padding: 0 10px; background-color: transparent; }
	.category dd a:hover,.category dd a:active{ color: #c061ff; background-color: transparent; }
	.category dd a.active,
	.category dd a.active:hover,
	.category dd a.active:active{ color: #fff; background-color: #c061ff; }
	.detail{ padding: 0 5px; }
	.appel .breadcrumbs{ padding: auto; }
    .detail-info .detail-header{ margin-bottom: 0; }
	.detail-poster{ width: 300px; }
	.detail-poster > a img{ min-height: 180px; } 
	.detail-info{ float: none; width: auto; padding-left: 15px; }
	.detail-info h2{ font-size: 18px; line-height: 1; margin-bottom: 5px;}
	.detail-info h2 small{ display: block; margin: 5px 0 0 0; font-size: 12px; }	
	.detail-info h3{ font-size: 14px; margin-bottom: 5px; }
	.detail-info .detail-actor > li{ padding: 0; line-height: 30px; white-space: normal; font-size: 14px; }
	.detail-info .detail-actor > li a{ margin-right: 5px; display: inline-block; }
	.detail-info .detail-actor > li a:after{  display: none; }
	.detail-info .detail-actor > li p{ width: auto; }
	.detail-source{ float: none; width: 100%; padding: 10px 0; clear: both; }
	.detail-tab{ margin-bottom: 5px; white-space: nowrap; font-size: 0; overflow-x: auto; overflow-y: hidden;}
	.detail-tab > li{ 		
		float: none; 
		margin: 0;
		display: inline-block; 
		vertical-align: bottom; 
		font-size: 14px; 
		border: 0 none;
		background-color: #fff;
	}
	.detail-tab > li > a{ padding: 10px 15px;  }
	.detail-tab > li.active > a,
	.detail-tab > li.active > a a:hover{ border-bottom: 2px solid #c061ff; padding-bottom: 8px; }	
	.detail-play-list li{ width: 25%; }	
	.detail-play-list li > a{ line-height: 30px; font-size: 13px; }	
	
	.play{padding: 2px 0 0 0; }
	.play h2{ margin-bottom: 10px; padding: 0 10px; font-size: 16px; }
	.play .player{ height: 200px; box-shadow: none;}
	.play-source{ padding-left: 10px; padding-right: 10px; margin-top: 0; }
	.play-source .detail-play-list li{ width: 25%; }
	.play-interaction{ height: 48px; box-shadow: none; padding: 0 10px; }
	.play-interaction > .play-btn{ margin-top: 8px; }
	.play-interaction > .play-btn > a{ padding: 0 13px; }
	.play-summary{ display: none; }
	.play-intro{ padding: 10px 5px 0 5px; }
	.play-intro span{ margin: 0; display: block; margin-bottom: 5px; }
	.play-intro a{ margin-right: 5px; color: #666; }	
	.news-main,.news-aside{ width: auto; float: none; }
	.news-group{ margin: 0 0 0 18px;  }
	.news-group > li > .rank-title{ left: 0; right: 20px; }
	.news-listing{ margin: 0; }
	.news-listing > li{ padding: 10px; }
	.news-listing .news-thumbnail{ width: 125px; height: 80px; }
	.news-listing .news-info{ padding-left: 10px; }
	.news-listing .news-info h5{ margin-bottom: 0; height: 80px; line-height: 26px; font-size: 16px; white-space: normal;}
	.news-listing .news-info p{ display: none; }
	.tags-group{ margin: 5px; }
	.news-appel{ padding: 20px 10px; }
	.news-appel .breadcrumbs{ display: none; }		
	.news-appel .news-preview{ display: none;}
	.news-appel .news-caption > h2{ font-size: 20px; line-height: 1.2; }	
	.news-appel .news-caption > p{ font-size: 12px; }	
	.news-appel .news-caption > p > span{ margin-right: 10px; }	
	.news-appel .news-content{ font-size: 15px; }
	.news-appel .news-more{ margin-bottom: 0; }
	.special-intro-pic{ float: none; width: 100%; }
	.special-intro-text{ padding: 0; }
	.special-intro-text h2{ font-size: 18px; margin: 5px 0; }
	.special-intro-text p { font-size: 14px; line-height: 1.5; max-height: none;}
	.special-intro-text .special-share{ position: static; }
	.actor-appel .actor-avatar{ width: 30%; margin-bottom: 0; }
	.actor-appel .actor-intro{ overflow: hidden; padding-left: 10px; margin-bottom: 0;}
	.actor-appel .actor-intro h2{ font-size: 18px; font-weight: 700; margin-bottom: 10px; }
	.actor-appel .actor-intro .info{ clear: both; margin-bottom: 10px; }
	.actor-appel .actor-intro .info li{ float: none; width: auto; padding: 2px 0 2px 80px; line-height: 20px; }
	.actor-appel .actor-intro .info .title{margin-left: -80px; }
    
    .latest-primary .latest-tabs{ margin: 0px; }
    .latest-primary .latest-tabs > li{ height: 28px; line-height: 28px; font-size: 12px; }
    .latest-primary .thumbnail-group > li:nth-child(n+7){ display: none; }
    .latest-primary .list-group{ margin: 5px 5px 0 5px; padding-top: 10px; }
    .latest-primary .list-group > li{ width: 50%; line-height: 22px; padding-right: 0; font-size: 12px;}
    .latest-primary .list-group-50{ padding-top: 0; }
    .latest-primary .list-group-50 > li{ width: 100%; }    
    .latest-listing .thumbnail-group > li:nth-child(n+13){ display: none; }
    .tab-content.pt15{ padding-top: 0!important;}
    .four-zero-four{ padding: 30px;}
    .four-zero-four h2{ font-size: 64px; }
    .four-zero-four h3{ font-size: 24px; }
    .four-zero-four p{ font-size: 16px; }
    .role-relation{ display: none;}
    .detail-download .table .code .h5{ display: none;}
}

@media (max-width: 600px) {
#ddav{width: 98%; margin: 5px auto; text-align: center; display: block;}
#ddav img{width: 100%;height: 50px; }
	.area{margin:0 auto;width:97%;margin:0 auto;overflow:hidden;}
	.youmu-app dl{padding:6px 0;}
	.youmu-app dt{width:20%;line-height:40px;font-size:14px;font-weight:bold;}
	.youmu-app dd{width:20%;line-height:23px;font-size:14px;}
	.youmu-app dt:after {margin:13px 2.6% 0;}
	.youmu-app .first{border-top:0;}
	
    .content{ padding-top: auto; }
	.container{ width: auto; }

	.footer{ padding: 10px; font-size: 12px; line-height: 1.5; margin-top: 10px;}
	.backtop{ bottom: 30px; }
	.backtop .iconfont{ width: 32px; height: 32px; line-height: 32px; font-size: 18px; background-color: #c061ff; }
	.container > .appel:first-child{ margin-top: 0; }
	.appel{padding: 0px; border-radius: 5px; margin: 5px;}
	.appel-main{ width: auto; float: none; }
	.appel-aside{ width: auto; float: none; border-top: 1px solid #f0f0f0;  margin-top: 10px; padding-top: 3px; }
	.appel-title{ font-size: 16px; margin-left: 5px; padding-left: 10px; }  
	.appel-more{ font-size: 12px; }  
	.thumbnail-group{ margin: 0; }
	.thumbnail-group > li{ float: left; width: 50%; margin: 0; padding: 5px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; }
	.thumbnail-group > li > .thumbnail .video-grade{ padding: 20px 5px 0 0; }
	.thumbnail-group > li > .thumbnail,
	.thumbnail-group > li > .thumbnail img{ width: 100%; height: 125px;border-radius: 5px; }	
	.thumbnail-group-small > li > .video-info { padding-top: 5px; } 	
	.thumbnail-group-small > li > .video-info > h4{ font-size: 12px; } 
	.thumbnail-group-small > li > .thumbnail,
	.thumbnail-group-small > li > .thumbnail img{ height: 70px; } 	
	.thumbnail-group-special > li{ float: none; width: auto; }
	.thumbnail-group-special > li > .thumbnail,
	.thumbnail-group-special > li > .thumbnail img{ width: 100%; height: auto; }	

	.rank-group{ padding: 5px; margin-top: 0; }	
	.rank-group > li:nth-child(n+11){ display: none; }
	.rank-group > li{ line-height: 30px; float: left; width: 50%; }
	.rank-group > li .rank-title{ right: 10px; left: 20px; }
	.rank-group > li .rank-grade{ display: none;}
	.filter{ }
	.filter-primary{ padding: 0; line-height: 35px; font-size: 14px; }
	.filter-primary dd{ width: 25%; text-align: center; padding: 5px; }
	.filter-primary dd > a{ display: block; background-color: #f5f5f5; line-height: 30px; font-size: 14px; border-radius: 2px; }
	.category{ margin-top: 10px; padding: 10px 0; line-height: 26px; }
	.category dt{ padding: 0 5px; }
	.category dd{ overflow: inherit; white-space: nowrap; margin-bottom: 7px; }
	.category dd a{ font-size: 12px; height: 26px; line-height: 26px; padding: 0 10px; background-color: transparent; }
	.category dd a:hover,.category dd a:active{ color: #c061ff; background-color: transparent; }
	.category dd a.active,
	.category dd a.active:hover,
	.category dd a.active:active{ color: #fff; background-color: #c061ff; }
	.detail{ padding: 0 5px; }
	.appel .breadcrumbs{ padding: 5px 5px 10px 5px; }
    .detail-info .detail-header{ margin-bottom: 0; }
	.detail-poster{ width: 190px; }
	.detail-poster > a img{ min-height: 110px; } 
	.detail-info{ float: none; width: auto; padding-left: 15px; }
	.detail-info h2{ font-size: 18px; line-height: 1; margin-bottom: 5px;}
	.detail-info h2 small{ display: block; margin: 5px 0 0 0; font-size: 12px; }	
	.detail-info h3{ font-size: 14px; margin-bottom: 5px; }
	.detail-info .detail-actor > li{ padding: 0; line-height: 25px; white-space: normal; font-size: 12px; }
	.detail-info .detail-actor > li a{ margin-right: 5px; display: inline-block; }
	.detail-info .detail-actor > li a:after{  display: none; }
	.detail-info .detail-actor > li p{ width: auto; }
	.detail-source{ float: none; width: 100%; padding: 10px 0; clear: both; }
	.detail-tab{ margin-bottom: 5px; white-space: nowrap; font-size: 0; overflow-x: auto; overflow-y: hidden;}
	.detail-tab > li{ 		
		float: none; 
		margin: 0;
		display: inline-block; 
		vertical-align: bottom; 
		font-size: 14px; 
		border: 0 none;
		background-color: #fff;
	}
	.detail-tab > li > a{ padding: 10px 15px;  }
	.detail-tab > li.active > a,
	.detail-tab > li.active > a a:hover{ border-bottom: 2px solid #c061ff; padding-bottom: 8px; }	
	.detail-play-list li{ width: 25%; }	
	.detail-play-list li > a{ line-height: 30px; font-size: 13px; }	

	.play{padding: 2px 0 0 0; }
	.play h2{ margin-bottom: 10px; padding: 0 10px; font-size: 16px; }
	.play .player{ height: 200px; box-shadow: none;}
	.play-source{ padding-left: 10px; padding-right: 10px; margin-top: 0; }
	.play-source .detail-play-list li{ width: 25%; }
	.play-interaction{ height: 48px; box-shadow: none; padding: 0 10px; }
	.play-interaction > .play-btn{ margin-top: 8px; }
	.play-interaction > .play-btn > a{ padding: 0 13px; }
	.play-summary{ display: none; }
	.play-intro{ padding: 10px 5px 0 5px; }
	.play-intro span{ margin: 0; display: block; margin-bottom: 5px; }
	.play-intro a{ margin-right: 5px; color: #666; }	
	.news-main,.news-aside{ width: auto; float: none; }
	.news-group{ margin: 0 0 0 18px;  }
	.news-group > li > .rank-title{ left: 0; right: 20px; }
	.news-listing{ margin: 0; }
	.news-listing > li{ padding: 10px; }
	.news-listing .news-thumbnail{ width: 125px; height: 80px; }
	.news-listing .news-info{ padding-left: 10px; }
	.news-listing .news-info h5{ margin-bottom: 0; height: 80px; line-height: 26px; font-size: 16px; white-space: normal;}
	.news-listing .news-info p{ display: none; }
	.tags-group{ margin: 5px; }
	.news-appel{ padding: 20px 10px; }
	.news-appel .breadcrumbs{ display: none; }		
	.news-appel .news-preview{ display: none;}
	.news-appel .news-caption > h2{ font-size: 20px; line-height: 1.2; }	
	.news-appel .news-caption > p{ font-size: 12px; }	
	.news-appel .news-caption > p > span{ margin-right: 10px; }	
	.news-appel .news-content{ font-size: 15px; }
	.news-appel .news-more{ margin-bottom: 0; }
	.special-intro-pic{ float: none; width: 100%; }
	.special-intro-text{ padding: 0; }
	.special-intro-text h2{ font-size: 18px; margin: 5px 0; }
	.special-intro-text p { font-size: 14px; line-height: 1.5; max-height: none;}
	.special-intro-text .special-share{ position: static; }
	.actor-appel .actor-avatar{ width: 30%; margin-bottom: 0; }
	.actor-appel .actor-intro{ overflow: hidden; padding-left: 10px; margin-bottom: 0;}
	.actor-appel .actor-intro h2{ font-size: 18px; font-weight: 700; margin-bottom: 10px; }
	.actor-appel .actor-intro .info{ clear: both; margin-bottom: 10px; }
	.actor-appel .actor-intro .info li{ float: none; width: auto; padding: 2px 0 2px 80px; line-height: 20px; }
	.actor-appel .actor-intro .info .title{margin-left: -80px; }
    
    .latest-primary .latest-tabs{ margin: 0px; }
    .latest-primary .latest-tabs > li{ height: 28px; line-height: 28px; font-size: 12px; }

    .latest-primary .list-group{ margin: 5px 5px 0 5px; padding-top: 10px; }
    .latest-primary .list-group > li{ width: 50%; line-height: 22px; padding-right: 0; font-size: 12px;}
    .latest-primary .list-group-50{ padding-top: 0; }
    .latest-primary .list-group-50 > li{ width: 100%; }    
    .latest-listing .thumbnail-group > li:nth-child(n+13){ display: none; }
    .tab-content.pt15{ padding-top: 0!important;}
    .four-zero-four{ padding: 30px;}
    .four-zero-four h2{ font-size: 64px; }
    .four-zero-four h3{ font-size: 24px; }
    .four-zero-four p{ font-size: 16px; }
    .role-relation{ display: none;}
    .detail-download .table .code .h5{ display: none;}
}

@media screen and (max-width: 375px){
	.youmu-app dd{width:20%;line-height:23px;font-size:12px;}
	.youmu-app dt{width:20%;line-height:45px;font-size:12px;font-weight:bold;}
	.youmu-app dd{width:20%;line-height:23px;font-size:12px;}
	.youmu-app dt:after {margin:13px 1.6% 0;}

}
@media screen and (max-width: 320px){
	.thumbnail-group > li{ padding: 5px; }
	.thumbnail-group > li > h5{ font-size: 12px; }
	.thumbnail-group > li > .thumbnail,
	.thumbnail-group > li > .thumbnail img{ height: 90px; }
	.thumbnail-group-small > li > .thumbnail,
	.thumbnail-group-small > li > .thumbnail img{ height: 60px; } 	
	.thumbnail-group-special > li > .thumbnail,
	.thumbnail-group-special > li > .thumbnail img{ height: auto; }	
	.rank-group > li{ font-size: 12px; line-height: 28px; }
	.filter-primary dd{ padding: 2px; }
	.filter-primary dd > a{ font-size: 12px; margin: 2px; }
	.detail-play-list li{ width: 25%; font-size: 12px; }
	.detail-play-list li > a{ line-height: 30px; }
	.news-listing .news-thumbnail{ width: 100px; height: 70px; }
	.news-listing .news-info h5{height: 70px; line-height: 23px; font-size: 15px; }
    .play-interaction > .play-btn > a{ padding: 0 10px; }
    .play-soshm{ padding-top: 10px; }
    .soshm-item + .soshm-item { margin-left: 5px; }
    .soshm-item-icon{ width: 28px; height: 28px; }
}.banyundog.com{
	height: 432px;
}