/*!
 * Copyright 2016-2018 http://v.shoutu.cn
 * Email 726662013@qq.com
 */
@charset "utf-8";email

/* all */
body, html{width:100%; height:100%;}
body{ margin:0; font-family:"Microsoft YaHei", "微软雅黑", "STHeiti", "WenQuanYi Micro Hei", SimSun, sans-serif; font-size:14px; line-height:140%; color:#757575; background:#FFF;}
ul,ol,li,p,h1,h2,h3,h4,h5,h6,form,fieldset,table,td,img,tr{margin:0;padding:0; border:0; font-weight:normal}
input,select{font-size:12px;vertical-align:middle; border:none;}
ul,li{list-style-type:none;}
a{ transition:0.2s;}
img{border:0 none;}
.wap{ display:none}
.pc{ display:block}
::-webkit-scrollbar{ width:10px; background-color:#f0f0f0;}
::-webkit-scrollbar-thumb{background-color:#ed0242;}
/* container */
*{-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box}
:after,:before{-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box}
.container{ width:100%; position:relative; height:fit-content; margin:auto; padding:0 100px 0 300px;}

/* more */
h1{ font-size:22px; line-height:28px;}
h3{ font-size:18px; line-height:24px;}
h4{ font-size:16px; line-height:22px;}
h5{ font-size:14px; line-height:20px;}
h6{ font-size:12px; line-height:18px;}
a,button{ text-decoration:none; color:#AAA; outline:none; -webkit-tap-highlight-color:rgba(0,0,0,0)}
button:hover{ cursor:pointer;}
.icon{ font-size:16px; vertical-align:-1px;}
.font-16{ font-size:16px;}
.font-14{ font-size:14px;}
.font-12{ font-size:12px;}
.text-red{ color:#ed0242;}
.text-center{ text-align:center;}
.text-left{ text-align:left;}
.text-right{ text-align:right;}
.pull-right{ float:right !important;}
.mg10{ margin:10px 0;}
.cb{ clear:both; width:100%;}
.hide{ display:none !important; }
.text-overflow{ width:100%; overflow:hidden; text-overflow:ellipsis; -o-text-overflow:ellipsis; white-space:nowrap;}
.pic-tag{ position:absolute; top:0; right:0; z-index:99; padding:2px 8px; font-size:12px; border-radius:0 0 0 8px; background-color:#FF9900; color:#FFFFFF;}
.play-bg{ position:fixed; z-index:0; bottom:0; left:0; width:100%; height:150px;background:url(../img/play_bg.png) center no-repeat;}
.stui-foot{ margin-bottom:20px;}
/* form */
input,textarea{outline:medium none; outline:none; -webkit-tap-highlight-color:rgba(0, 0, 0, 0);}
input.form-control,input.btn{ outline:0px; -webkit-appearance:none;}
input[type="checkbox"]{ vertical-align:-2px;}
textarea{ height:auto;}
/* embed */
.embed-responsive{position:relative;display:block;overflow:hidden;padding:0;height:0}
.embed-responsive .embed-responsive-item,.embed-responsive embed,.embed-responsive iframe,.embed-responsive object,.embed-responsive video{position:absolute;top:0;bottom:0;left:0;width:100%;height:100%;border:0}
.embed-responsive-16by9{padding-bottom:56.25%}
.embed-responsive-4by3{padding-bottom:75%}



/****************css****************/
.header{ width:180px; height:100%; background:#ed0242; position:fixed; left:0; z-index:50;}
/* logo */
.header_logo{ display:block; height:200px; background:#ed0242 url(../img/logo.png) center center no-repeat; overflow:hidden;}
.header_logo h1{ position:absolute; top:-500px;}

/* 快捷按钮 */
.header_open{ display:none; width:100%; height:50px; margin:auto; background:#FAFAFA; overflow:hidden; padding:0 20% 10px;}
.header_menu_open,.header_search_open{ display:block; width:50%; height:40px; line-height:38px; font-size:16px; font-weight:900; text-align:center; color:#FFF; float:right; background:#444;}
.header_menu_open{ border-radius:0 20px 20px 0;}
.header_search_open{ border-radius:20px 0 0  20px;}
.header_menu_open:hover,.header_search_open:hover{ background:#ed0242; color:#FFF;}

/* 弹出菜单 */
.header_menu{ display:none; width:300px; height:auto; border-radius:20px; overflow:hidden; position:fixed; top:20%; left:50%; margin-left:-150px; background:#FFF; z-index:100; border:10px solid #999; box-shadow:0px 0px 0px 2000px rgba(0,0,0,0.6); -webkit-box-shadow:0px 0px 0px 2000px rgba(0,0,0,0.6); -moz-box-shadow:0px 0px 0px 2000px rgba(0,0,0,0.6);}
.header_menu h5{ line-height:50px; width:100%; background:#FFF; text-align:center; color:#222; border-bottom:1px solid #eee;}
.header_menu div{ overflow-y:scroll; height:300px; padding-bottom:10px;}
.header_menu div::-webkit-scrollbar{ width:5px; background-color:#FFF;}
.header_menu div::-webkit-scrollbar-thumb{ background-color:#222;}
.header_menu div a{ display:block; width:calc(100% - 15px); line-height:40px; background:#FFF; color:#000; background:#F0F0F0; margin:10px 5px 0 10px; text-align:center; border-radius:5px;}
.header_menu div a:hover{ background:#333; color:#FFF;}
.header_menu p{ width:50px; height:50px; line-height:48px; color:#222; font-size:30px; font-weight:900; text-align:center; position:absolute; top:0; right:0; cursor:pointer;}
.header_menu p:hover{ color:#ed0242}
/* search */
.header_search{ display:none; overflow:hidden; width:100%; padding:0 10%;}
.header_search #search{ position:relative;  border-radius:18px; overflow:hidden;}
.header_search #search .form-control{ display:block; width:100%; height:36px; padding:0 10px; font-size:12px; background-color:#FFF; color:#000;}
.header_search #search .form-control:hover{ background-color:#FAFAFA;}
.header_search #search .submit{ color:#000; font-weight:900; display:block; position:absolute; top:0; right:0; height:36px; line-height:36px; width:36px; background:#fff; text-align:left; border:0; cursor:pointer;}


.my_search{ margin-bottom:20px;}
.my_search .item{ float:none; position:relative; overflow:hidden; margin:10px auto; width:33.330%; border-radius:23px;}
.my_search .item form{ color:#FFF; font-size:14px; height:46px; background-color:#333;}
.my_search .item form .form-control{ width:100%; height:46px; width:calc(100% - 50px); line-height:46px; padding-left:20px; background-color:#333; color:#FFF; float:left;}
.my_search .item form:hover{ background-color:#444;}
.my_search .item .submit{height:46px;font-size:18px;line-height:38px;color:#FFF;font-weight:900; background-color:#333; width:50px; text-align:left;border:0;cursor:pointer; background:#333;}
.my_search .item .submit:hover{ color:#FFF;}

.my_search_key{ position:relative;}
.my_search_key .my_search_key_open{ position:absolute; top:-55px; left:0; background:#FFF; cursor:pointer; width:100px; height:36px; line-height:33px; text-align:center; color:#000; border-radius:6px; border:2px solid #222;}
.my_search_key .my_search_key_open:hover{ background:#F0F0F0;}
.my_search_key ul a{ display:block; padding:4px 8px; background:#FAFAFA; float:left; border-radius:6px; margin:3px; color:#000; font-size:13px; transition:0.2s; border:1px solid #ed0242;}
.my_search_key ul a:hover{ border-color:#555; background:#ed0242; color:#FFF;}



/* 导航 */
.menu{ margin:auto; height:60%; margin:auto; overflow:scroll; overflow-x:hidden; padding:10px 0; border-top:20px solid #ed0242; border-right:5px solid #ce023a;box-shadow: 4px -1px 42px -10px rgba(0,0,0,0.62) inset;-webkit-box-shadow: 4px -1px 42px -10px rgba(0,0,0,0.62) inset;-moz-box-shadow: 4px -1px 42px -10px rgba(0,0,0,0.62) inset;}
.menu::-webkit-scrollbar{ background:#dd023e; width:6px; border-top:8px solid #d0023a; border-bottom:8px solid #d0023a;}
.menu::-webkit-scrollbar-thumb{background-color:#FFF;}
.menu a{ display:block; cursor:pointer; width:80%; font-size:12px; border-radius:15px; margin:auto; color:#FFF; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; text-align:center;}
.menu :hover{ background:#ac1d2e !important;}
.menu .active{ background:#222 !important;}
.menu a h2{ font-weight:normal; margin-bottom:0; margin-top:0;}
.menu a,.menu a h2{ height:30px; line-height:30px;}
.menu_f{ background:#fc2660;}

/* APP */
.connect_info{ line-height:40px;}
.my_top_app{ padding:15px 0;}
.my_top_app a{ float:left; color:#000; border-radius:6px; width:90px; text-align:center; cursor:pointer; padding:5px 0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.my_top_app a img{ display:block; width:70px; height:70px; border-radius:12%; clear:both; margin:0 auto 6px;}
.my_top_app a:hover{ color:#ed0242; background:#F0F0F0;}

/* 友链 */
.my_top_link a{ float:left; border:2PX solid #000; padding:8px 10px; background:#ed0343; color:#FFF; font-size:13px; border-radius:6px; margin:2px; text-align:center; cursor:pointer; transition:0.2s; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.my_top_link a:hover{ background-color:#ed0242; color:#FFF;}
.my_link a{ padding:8px 10px; border:2PX solid #000; float:left; color:#000; cursor:pointer; transition:0.2s; background:#FAFAFA; margin:2px; border-radius:6px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; text-align:center; }
.my_link a:hover{ background-color:#ed0242; color:#FFF; border-color:#000;}


/* 横幅 */
.my_top_banner{ padding-bottom:10px;}
.my_top_banner a{ float:left; width:50%; cursor:pointer; display:inline-block;}
.my_top_banner a img{width:100%; height:90px;}


/* 列表分类 */
.class_list a{ display:inline-block; height:40px; line-height:40px; color:#555; padding:0 10px; font-size:14px; margin-bottom:4px; text-align:center; position:relative; overflow:hidden;}
.class_list a h2{ font-weight:normal; font-size:14px; width:120px; z-index:1; background:#ed0242; position:absolute; left:0; top:0; z-index:1; border-left:10px solid #222;}
.class_list a:first-child{ width:166px; color:#FFF;}
.class_list a:first-child span{display:inline-block;background:#ed0242;width:80px;height:80px;position:absolute;right:10px;top:13px;transform:rotate(45deg);-ms-transform:rotate(45deg);-moz-transform:rotate(45deg);-webkit-transform:rotate(45deg);-o-transform:rotate(45deg);}
.class_list a:hover{ background:#F0F0F0; color:#ed0242;}
.class_list a:first-child:hover{ background:inherit; color:#FFF;}
.my_active{ background:#ed0242 !important; color:#FFF !important;}

/* 视频单元 */
.index_class{ display:block; width:100%; max-width:120px; height:36px; line-height:32px; font-size:16px; font-weight:900; text-align:center; border:2px solid #222; margin-top:10px; background:#F0F0F0; color:#222; border-radius:6px;}
.vodlist{ margin:0 -5px;}
.vodlist li{ float:left; margin:0px; width:calc(16.66666666666667% - 10px); margin:5px; overflow:hidden; transition:0.2s;}
.vodlist li a:hover .vod_title h4{ color:#ed0242;}
.vodlist li a:hover .play{ background-image:url(../img/play.png)}
.vodlist li a:hover .vod_img{ opacity:0.9;}
.vod_box{ background:#FFF;}
.vod_img{ position:relative; padding-top:60%; background:url(../img/load.gif) no-repeat; background-position:50% 30%; background-size:cover;}
.vod_img .play{ position:absolute; top:0; z-index:1; width:100%; height:100%; background-repeat:no-repeat; background-position:center center;}
.vod_img .vod_class{ position:absolute; top:0; left:0; background:#ed0242; color:#FFF; padding:4px 8px; font-size:12px;}
.vod_title{ padding:6px 12px; height:70px;}
.vod_title h4{ font-size:14px; line-height:30px; color:#555; font-weight:500;}
.vod_title .vod_tab{ width:100%; color:#999; font-size:12px; text-align:right; display:inline-block;}
.vod_title .vod_tab font{ color:#ed0242;}



/* 分页 */
.page{ padding:20px 0 20px;}
.page a{ display:inline-block; padding:8px; color:#000; transition:0.2s; border:2px solid #444; margin:2px;}
.page a.active,.page a:hover{ background-color:#ed0242; color:#FFF !important;}

/* player */
.player{ position:relative; z-index:2; overflow:hidden; margin-bottom:20px; background:#333;}
.player .player_title{ height:50px; line-height:40px; clear:both; background:#FFF; border-bottom:10px solid #FFF;}
.player .player_title a{ padding:0 16px; line-height:36px; text-align:center; float:left; color:#000; background:#F0F0F0; border:2px solid #222;}
.player .player_title a:hover{ background:#ed0242; color:#FFF;}
.player .player_title h1{ float:left; width:calc(100% - 100px); font-weight:900; line-height:36px; margin-top:0; margin-bottom:0; color:#222; padding-left:20px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}

.player_video{ background-color:#000;}
.player_left{ position:relative; float:left; width:66.6666666666%; overflow:hidden;}
.player_side{ display:none; position:relative; float:left; width:33.3333333333%; padding-left:10px; overflow:hidden;}
.player_side li{ float:left; display:inline-block; width:100%; height:48.5px; line-height:48px; font-size:12px; text-align:center; margin-bottom:5px; margin-bottom:1px; background:#333; cursor:pointer;}
.player_side li:hover{ background:#222;}



.vodlist_more{ display:block; text-align:center; width:30%; height:36px; line-height:36px; border-radius:20px; color:#FFF; background:#444; margin:20px auto;}
.vodlist_more:hover{ background:#ed0242;}

/* 向上 */
.my_top{ width:50px; height:50px; background:#555 url(../img/top.png) center center no-repeat; position:fixed; right:30px; bottom:100px; z-index:10; cursor:pointer; border-radius:8px;}
.my_top:hover{ background-color:#ed0242;}
.email{ padding:20px 0 20px 260px; background-color:#F0F0F0;}
.email li{ line-height:30px; text-align:left; color:#ed0242; text-indent:20px; font-weight:900; }


.pc1{ display:block !important;}
.page .num{ display:none;}


.Play_imgAD,.Play_appAD,.bottomAD,.dingAD,.sideAD_left,.sideAD_right{ display:none;}

.Play_imgAD{ width:100%; height:auto; overflow:hidden;}
.Play_imgAD img{ width:100%;}

.Play_appAD{ padding-bottom:15PX;}
.Play_appAD a{ float:left; color:#000; border-radius:6px; width:25%; text-align:center; font-weight:900; cursor:pointer; padding:5px 0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:16px;}
.Play_appAD a img{ display:block; width:56px; height:56px; border-radius:12%; clear:both; margin:0 auto 6px;}
.Play_appAD a:hover{ color:#ed0242; background:#F0F0F0;}

.bottomAD{ position:fixed; width:100%; height:auto; bottom:0;left:0; z-index:9999;}
.bottomAD span{ display:block; float:left; width:20px; height:20px; line-height:20px; text-align:center; background:#F00; color:#FFF; clear:both;}
.bottomAD a{ display:block; width:100%; height:auto;}
.bottomAD a img{ width:100%; height:70px;}

.dingAD{ position:fixed; width:100%; height:auto; top:0;left:0; z-index:9999;}
.dingAD span{ display:block; float:left; width:20px; height:20px; line-height:20px; text-align:center; background:#F00; color:#FFF; clear:both;position:absolute; top:0;}
.dingAD a{ display:block; width:100%; height:auto;}
.dingAD a img{ width:100%; height:70px;}

.sideAD_left,.sideAD_right{ width:70px; height:90px; position:fixed; bottom:40%; z-index:9999;}
.sideAD_left{left:0;}.sideAD_right{right:0;}
.sideAD_left a,.sideAD_right a{ display:block; width:70px; height:70px; overflow:hidden;}
.sideAD_right a img,.sideAD_left a img{ width:70px; height:70px;}
.sideAD_left span,.sideAD_right span{ display:block; width:70px; height:20px; line-height:20px; text-align:center; color:#222; clear:both; font-size:aaa; background:#F0F0F0;}

/****************css****************/
@media (max-width:1900px){
	.container{ padding:0 20px 0 220px;}
	.header{ width:200px;}
	.vodlist li{ width:calc(20% - 10px);}
	.player_side li{ height:40.2px; line-height:40px;}
	.email{ padding-left:200px}
}
@media (max-width:1600px){
	.vodlist li{ width:calc(25% - 10px);}
	.player_side li{ height:40.2px; line-height:40px;}
}
@media (max-width:1300px){
	.container{ padding:0 20px 0 180px;}
	.header{ width:160px;}
	.menu a,.menu a h2{ height:36px; line-height:36px;}
	.player_side{ height:472.48px;}
	.player_side li{ height:40.2px; line-height:40px;}
	.email{ padding-left:160px}
}
@media (max-width:1000px){
	.my_top_banner a{ width:100%;}
	.my_top_banner a img{ height:80px;}
	.vodlist li{ width:calc(33.333333333333% - 10px);}
	.main_search #search{ width:40%;}
	.player_left{ width:100%;}
	.player_side{ padding-top:10px; height:95px; width:calc(100% + 2px); padding-left:0;}
	.player_side li{ float:left; width:20%; height:36px; line-height:36px; border-right:1px solid #FFF;}
}
@media (max-width:800px){
	.vodlist{ margin:0 -2px;}
	.vodlist li{ width:calc(50% - 4px); margin:2px;}
}
@media (max-width:650px){
	.Play_imgAD,.Play_appAD,.bottomAD,.dingAD{ display:block; width:100%; overflow:hidden:}
	.sideAD_left,.sideAD_right{ display:block;}
	
	.vod_title{ padding:4px 0;}
	.class_list .class_more{ display:none;}
	.wap1{ display:block !important;}
	.page .num{ display:inline-block;}
	.container{ padding:0 3%;}
	.header{ height:50px; width:100%; background:#222;}
	.header_logo{ width:140px; height:50px; float:left; background-image:url(../img/logo2.png); background-color:#222;}
	.header_open{ display:block; width:120px; margin:inherit; float:right; margin:5px; padding:0; background:#222; height:40px;}
	.header_menu_open,.header_search_open{ background:#ed0242;}
	.main_search,.menu,.header_info{ display:none;}
	.header_search{ padding:20% 5% 200%; background:rgb(0,0,0,0.5)}
	.c_padding{ padding-top:60px;}
	.my_top_banner a img{ height:70px;}
	.my_top_app a{ width:14.28%;}
	.my_link a{ width:calc(20% - 4px);}
	.class_list a{ padding:10px 0; width:100% !important; background:#ed0242; text-align:center; border-radius:6px;}
	.my_top_link a{ padding:6px 10px;}
	.my_link a{ padding:2px 0;}
	.my_top{ right:10px;}
	.my_search .item,.my_search_key .my_search_key_open,.connect_info,.page .hidden-xs{ display:none;}
	.email{ padding-left:0; padding-bottom:150px;}
}
@media (max-width:550px){
	.my_top_banner a img{ height:60px;}
	.my_top_app a{ width:20%;}
}
@media (max-width:414px){
	.class_list a,.my_link a{ width:calc(25% - 4px);}
	.my_top_app a img{ width:60px; height:60px;}
	.player_side{ height:170px;}
	.player_side li{ width:33.3333333333333%;}
}
@media (max-width:374px){
	.vodlist{ margin:0;}
	.vodlist li{ width:100%; margin:0;}
}