@media screen and (min-width:768px){
/*pc端 css*/

/*新闻公告*/
.main{width:1200px;margin:0 auto;overflow: hidden;}
.video_sp {overflow: hidden;margin-top:15px;}
.video_sp h1{font-size: 22px;font-weight: bold;color:#000;}
.video_sp img{width:100%;}
.video_sp span{margin-right:20px;}
.video_sp .video_le{width:72%;float:left;}
.video_sp .video_ri{width:25.5%;float:right;padding-top:0px;height: 462px; background: #fafeff; padding: 10px; margin-top: 10px; border-radius: 10px; border:1px solid #e8f6f8;}
.video_sp .video_ri ul{float:left;}
.video_sp .video_ri ul li{line-height: 33px;color:#575757;font-size:15px;}
.video_sp .video_ri ul li img{vertical-align: middle;width: 20px;display: inline-block;padding-bottom: 5px;}
.video_lesp{width:860px; height: 484px;margin:10px 0;border-radius: 10px;overflow: hidden;}

/* === 为播放器元素添加 height: 100% === */
#my-video { width:100%; height: 100%; }

.videodetails_main{margin:10px 0;overflow: hidden;border:1px solid #dddccc;padding:10px;border-radius: 10px;}
.videodetails_main p{display: inline; font-size: 15px; line-height: 1.6; color: #333; white-space: pre-wrap;}
.videodetails_main a {display: inline;line-height: 36px;font-size:16px;}

.videodetails_table h1 { text-align: left; font-size:18px; font-weight: normal; margin:20px 0px 5px 0px; color: #000000; font-weight: bold; }
.videodetails_table h1 img { vertical-align: middle; margin-top:-3px; margin-right:5px; }
.videodetails_table h1 span a { font-size: 14px; color: black; }
.videodetails_table h1 span { font-size: 14px; color: #959595; }
.videodetails_table i { display: inline-block; font-style: normal; color: #474747; }
.videodetails_table { margin-top:10px; margin-bottom:30px; width: 100%; overflow: hidden; }
.videodetails_table table { width:100%; border-collapse:collapse; }
.videodetails_table table th { color: #3e3e3e; font-size: 14px; line-height:36px; height:36px; border:1px #dfdfdf solid; text-align: center; }
.videodetails_table table th.hsth { background-color: #FFFCFA; }
.videodetails_table table th.lsth { background-color: #FAFDFF; }
.videodetails_table table.hstable th { border:1px #FFCBB7 solid; }
.videodetails_table table.hstable td { border:1px #FFCBB7 solid; }
.videodetails_table table.lstable th { border:1px #C6DFFF solid; }
.videodetails_table table.lstable td { border:1px #C6DFFF solid; }
.hsa a { color:#FF7100; }
.lsa a { color:#0077FF; }
.videodetails_table table td { height:55px; border:1px #dfdfdf solid; text-align: center; font-size:14px; color:#5e5e5e; }
/* --- 修改点 1：将 width 从 570px 改为 586px --- */
.videodetails_table .video_tab_l { width:586px; float:left; }
.videodetails_table .video_tab_l i { height:60px; background: #FFFCFA; margin: 15px 0; padding: 10px; border-radius: 5px; border: 1px dashed #FF9A2A; }
/* --- 修改点 2：将 width 从 570px 改为 586px --- */
.videodetails_table .video_tab_r { width:586px; float:left; margin-right:28px; }
.videodetails_table .video_tab_r i { height:60px; background: #FAFDFF; margin: 15px 0; padding: 10px; border-radius: 5px; border: 1px dashed #2A9CFF; }
.videodetails_table .video_tab_t { width:100%; overflow: hidden; }

.commentbox{border:1px solid #dfdfdf;padding:10px 10px 0px 10px;overflow: hidden;margin:10px 0;border-radius: 10px;}
.commentbox textarea{width:60%;height:235px;float:left;font-size: 16px;border: 1px solid #ccc;padding:10px;}
.commentbox_input{width:32%;float:left;margin-left:20px;}
.commentbox_input p{margin-bottom:13px;font-size: 16px;}
.commentbox_input input{border:1px solid #ccc;padding:10px;border-radius: 5px;font-size: 16px;}
.commentbox_input select {border:1px solid #ccc;padding:10px;border-radius: 5px;font-size: 16px;}
.commentbox_input button{margin-left: 65px;width:100px;height:36px;text-align: center;line-height:36px;background: #2c88d3;font-size:14px;color: #fff;border: none;border-radius:5px;}
.videodetails_table table td.tdcen{text-align: left;padding:0 10px;}
/* 视频播放器倍速菜单 */
.video-js .vjs-playback-rate .vjs-menu { text-align: center; }
.video-js .vjs-playback-rate .vjs-menu .vjs-menu-item { display: inline-block; width: 100%; }
}


/*iphone x */
@media screen and (max-width:767px){
.main{width:100%;margin:0 auto;overflow: hidden;}
.video_sp {overflow: hidden;margin-top:18px;}
.video_sp h1{line-height:30px;font-size:0.8rem;color:#000;margin:5px 20px;font-weight: bold;overflow: hidden;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 1;}
.video_sp img{width:100%;}
.video_sp span{margin-left:20px;}
.video_sp .video_le{width:100%;}
.video_sp .video_ri{margin:0 20px;}
.video_sp .video_ri ul{float:left;}
.video_sp .video_ri ul li{line-height:26px;color:#575757;font-size: 0.8rem;overflow: hidden;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 1;}
.video_sp .video_ri ul li img{vertical-align: middle;width: 0.7rem;display: inline-block;padding-bottom: 5px;}
.video_lesp{width:100%;border-radius: 10px;overflow: hidden;}
/* === 为手机端的播放器元素也添加 height: 100% === */
#my-video { width:92%; height: 100%; }
.videodetails_main{margin:5px 20px;overflow: hidden;}
.videodetails_main h3{text-align: left;font-size:1.2rem;font-weight: normal;margin:10px 0px 10px 0px;color:#000;}
.videodetails_main p{display: inline;color:#575757;line-height: 25px;font-size: 0.8rem;white-space: pre-wrap;}
.videodetails_main a {display: inline;line-height: 25px;font-size: 0.8rem;}

.videodetails_table h1 { text-align: left; font-size:1rem; font-weight: normal; margin:20px 0px 0px 0px; color:#000; font-weight: bold; }
.videodetails_table h1 img { vertical-align: middle; margin-top:-3px; margin-right:5px; width:16px; }
.videodetails_table h1 span a { font-size: 0.8rem; color:#000; }
.videodetails_table h1 span { font-size: 0.8rem; color:#959595; }
.videodetails_table i { margin:5px 0px 20px 0px; display: inline-block; font-style: normal; color:#000; font-size: 0.8rem; line-height: 20px; }

.videodetails_table .video_tab_l i { background: #FFFCFA; margin: 15px 0; padding: 10px; border-radius: 5px; border: 1px dashed #FF9A2A; min-height: 40px; box-sizing: border-box; }
.videodetails_table .video_tab_r i { background: #FAFDFF; margin: 15px 0; padding: 10px; border-radius: 5px; border: 1px dashed #2A9CFF; min-height: 40px; box-sizing: border-box; }

.videodetails_table { margin:10px 5px 30px 5px; overflow: hidden; }
.videodetails_table table { width:100%; border-collapse:collapse; }
.videodetails_table table th { color: #3e3e3e; font-size: 0.8rem; border:1px #dfdfdf solid; text-align: center; padding:2px; height: 28px; }
.videodetails_table table th.hsth { background-color: #FFFCFA; }
.videodetails_table table th.lsth { background-color: #FAFDFF; }
.videodetails_table table.hstable th { border:1px #FFCBB7 solid; }
.videodetails_table table.hstable td { border:1px #FFCBB7 solid; }
.videodetails_table table.lstable th { border:1px #C6DFFF solid; }
.videodetails_table table.lstable td { border:1px #C6DFFF solid; }
.hsa a { color:#FF7100; }
.lsa a { color:#0077FF; }
.videodetails_table table td { border:1px #dfdfdf solid; text-align: center; font-size: 0.8rem; color:#5e5e5e; padding:2px; height: 28px; }

.commentbox{border:1px solid #dfdfdf;padding:10px;overflow: hidden;margin:10px 0;border-radius: 5px;}
.commentbox textarea{width:93%;height:100px;font-size: 0.8rem;border: 1px solid #ccc;margin-bottom:20px;padding: 10px;}
.commentbox_input{width:100%;}
.commentbox_input p{margin-bottom:10px;font-size: 0.8rem;}
.commentbox_input input{border:1px solid #ccc;padding: 7px 5px;border-radius: 5px;font-size: 0.9rem;width: 80%;}
.commentbox_input button{margin-left: 45px;width:100px;height:36px;text-align: center;line-height:36px;background: #2c88d3;font-size: 0.8rem;color: #fff;border: none;border-radius:5px;}
.commentbox_input button.btn{width:100px;height:36px;text-align: center;line-height:36px;background: #2c88d3;font-size:0.7rem;color: #fff;border: none;border-radius:5px;}
.videodetails_table table td.tdcen{text-align: left;}
/* 视频播放器倍速菜单 */
.video-js{width:92%;height: 202px;margin:0 auto;}
.video-js .vjs-control-bar .vjs-playback-rate .vjs-menu { width: 6em !important; left: 50% !important; transform: translateX(-50%) !important; right: auto !important; }
.video-js .vjs-playback-rate .vjs-menu .vjs-menu-item { width: 100% !important; text-align: center !important; text-indent: -1.3em !important; }
}