﻿@charset "utf-8";

/* ------------------------------------------------------------------------------------------------------------- */
/* mp3_text */
[mc*="text:"] {
	cursor: pointer;
}

/*[mc*="text:"].captionOn,
[mc*="text:"].captionOn span {
	color: #04ada9 !important;
}*/


[mc*="text:"].captionOn,
[mc*="text:"].captionOn span {
	color: #08977D !important;
}

[mc*="text:"].canHover:hover,
[mc*="text:"].canHover:hover span {
	color: #08977D !important;
}

[mc*="text:"].noHover.canHover:hover,
[mc*="text:"].noHover.canHover:hover span {
	color: #333 !important;
}

[mc*="text:"].noHover.canHover:hover .answer_txt {
	color: #fb261f !important;
}

/* ------------------------------------------------------------------------------------------------------------- */
/* caption */
.caption.inline {
	display: inline;
}

.caption .tEng {
	display: inline;
}

.caption.captionOn .tEng,
.caption.captionOn .tEng .answer_txt,
.caption.captionOn .tEng span {
	color: #08977D !important;
}

.caption .tEng.canHover:hover,
.caption .tEng.canHover:hover span,
.caption .tEng.canHover:hover .answer_txt {
	color: #08977D !important;
}

.caption .tEng.noHover.canHover:hover,
.caption .tEng.noHover.canHover:hover span {
	color: #333 !important;
}

.caption .tEng.noHover.canHover:hover .answer_txt {
	color: #fb261f !important;
}

.caption .tKor {
	font-family: NotoSans;
}

/* ------------------------------------------------------------------------------------------------------------- */
.audioContainer {
	display: none;
}

.audioControls {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	width: 240px;
}

.audioControls>div {
	margin-right: 12px;
}

.audioControls .btnPlay {
	width: 35px;
	height: 35px;
	background: url('../images/media/audio_player/audioPlay.png') no-repeat;
}
.audioControls .btnPlay:hover{
	background: url('../images/media/audio_player/audioPlay_hover.png') no-repeat;
}

.audioControls .btnPause {
	width: 35px;
	height: 35px;
	background: url('../images/media/audio_player/audioPause.png') no-repeat;
}
.audioControls .btnPause:hover{
	background: url('../images/media/audio_player/audioPause_hover.png') no-repeat;
}

.audioControls .btnStop {
	width: 35px;
	height: 35px;
	margin-right:12px;
	background: url('../images/media/audio_player/audioStop.png') no-repeat;
}
.audioControls .btnStop:hover{background: url('../images/media/audio_player/audioStop_hover.png') no-repeat;}
.audioControls .mvTime {
	position: relative;
	width: 100px;
	height: 3px;
	border-radius: 3px;
	background-color: #E3E3E3;
	margin-right: 0;
}

.audioControls .mvTime .back {}

.audioControls .mvTime .current {
	position: absolute;
	left: 0;
	top: 0;
	width: 50px;
	height: 3px;
	background-color: #D17F02;
}

.audioControls .mvTime .marker {
	position: absolute;
	width: 19px;
	height: 19px;
	top: -8px;
	left: 0;
	border-radius: 50%;
	border: solid 2px #ec840a;
	box-sizing: border-box;
	box-shadow: 2px 2px 1px rgba(0, 0, 0, 0.1);
	cursor: pointer;
	background-color: #ffb800;
	margin-left:-10px;
}


.audioControls .mvTime:hover .marker{
	border: solid 5px #ec840a;
}
/*.audioControls .mvTime .marker:hover{border: solid 5px #ec840a;}*/
.audioControls .toucharea {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	cursor: pointer;
}

.audioControls .playbackratePannel {
	display: flex;
	width: 194px;
	font-size: 16px;
	color: #fff;
	font-family:'PretendardSB';
	/*border: solid 1px #5c63b1;*/
	border: none;
	box-sizing: border-box;
	border-radius: 20px;
	text-align: center;
	margin-top: 20px;
	margin-right: 0;
}

.audioControls .playbackratePannel>div {
	flex: 1;
	padding: 5px 0;
	cursor: pointer;
	background-color: #C6C0B1;
	margin-right: 1px;
}

.audioControls .playbackratePannel>div:hover {	background-color: #A19987; }

.audioControls .playbackratePannel>div:first-child{ border-radius: 20px 0 0 20px;}

.audioControls .playbackratePannel>div:last-child {
	border-right: 0;
	margin-right: 0;
	border-radius: 0 20px 20px 0;
}

.audioControls .playbackratePannel>div.on {
	background-color: #EC840A;
}

.audioControls .tabs { position: absolute; top: -45px; left: 19px; display: flex; align-items: center; z-index: 9999}
.audioControls .tabs .tab { font-size: 16px; color: #EC840A; font-family:'PretendardSB'; padding: 10px 12px; border: 2px solid #E87206; background-color: #fff; border-radius: 8px 8px 0 0}
.audioControls .tabs .tab:hover { color: #fff; background-color: #EC840A;}
.audioControls .tabs .tab.on,
.audioControls .tabs .tab.on:hover { color: #fff; background-color: #EC840A;}

/* ------------------------------------------------------------------------------------------------------------- */
/* 롤플레이 */
.role_player {
	position: absolute;
	display: inline-block;
	top: 8px;
	left: 510px;
	width: 276px;
	height: 48px;
	padding: 6px 20px;
	background: #fff;
	border: 1px solid #c8c8c8;
	border-radius: 8px;
}

.role_player .audioControls {
	display: block;
	width: auto;
}

.role_player [class*="btnRoleplay"] {
	position: relative;
	float: left;
	width: 80px;
	height: 34px;
	font-size: 0;
	text-indent: -9999px;
}

.role_player .btnRoleplay1 {
	background: url('../images/media/audio_player/role_tab_a.png') no-repeat
}

.role_player .btnRoleplay1.on {
	background: url('../images/media/audio_player/role_tab_a.png') 0 -46px no-repeat
}

.role_player .btnRoleplay2 {
	background: url('../images/media/audio_player/role_tab_b.png') no-repeat
}

.role_player .btnRoleplay2.on {
	background: url('../images/media/audio_player/role_tab_b.png') 0 -46px no-repeat
}

.role_player .btnRoleplay1.on .toolTip {
	position: absolute;
	display: none;
	top: 50px;
	left: -310px;
	width: 372px;
	height: 241px;
	background: url('../images/media/audio_player/role_tooltip_a.png') no-repeat;
	z-index: 20
}

.role_player .btnRoleplay2.on .toolTip {
	position: absolute;
	display: none;
	top: 50px;
	left: 25px;
	width: 372px;
	height: 241px;
	background: url('../images/media/audio_player/role_tooltip_b.png') no-repeat;
	z-index: 20
}

.role_player .btnPlay,
.role_player .btnPause,
.role_player .btnStop {
	position: absolute;
	top: 12px;
	width: 22px;
	height: 22px;
	background: url('../images/media/audio_player/role_play_btn.png') 0 0 no-repeat;
	cursor: pointer;
}

.role_player .btnPlay {
	background-position: 2px 0;
	left: 194px
}

.role_player .btnPause {
	background-position: -34px 0;
	left: 190px
}

.role_player .btnStop {
	background-position: -69px 0;
	left: 230px;
}

/* ------------------------------------------------------------------------------------------------------------- */
/* video */
.videoWrap {
	position: relative;
	display: inline-block;
}

.videoWrap video {
	width: 1280px;
	height: 750px;
}

/*.videoWrap .videoContainer {
	background: #000;
}*/

.videoWrap .btnCover {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	font-size: 0;
	z-index: 100;
}

.videoWrap .btnCover,
.videoWrap .btnCover.play {
	background: url('../images/media/video_player/new_btn_play_video.png') no-repeat;
	background-position: center center;
}
.videoWrap .btnCover:hover,
.videoWrap .btnCover.play:hover {
	background: url('../images/media/video_player/new_btn_play_video_hover.png') no-repeat;
	background-position: center center;
}

.videoWrap .btnCover.pause {
	background: url('../images/media/video_player/video_pause.png') no-repeat;
	background-position: center center;
}
.media_comn.full .videoWrap .poster{ left: 88px;}
.videoWrap .poster {
	position: absolute;
	display: inline-block;
	top: 0;
	left: 0;
	width: 1264px !important;
	height: 711px !important;
	background-position: center;
	background-size: 100%;
	background-repeat: no-repeat;
	/*border-bottom: 3px solid #fff;
    border-top: 3px solid #fff;*/
}
.readVideo .videoWrap .poster { width: 1320px !important;; height: 742px !important;}

.videoWrap .videoControls {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 93px;
	padding: 0;
	box-sizing: border-box;
}

.videoWrap .videoControls [class*="btn"] {
	height: 46px;
	line-height: 46px;
	box-sizing: border-box;
	cursor: pointer;
	border-radius: 8px;
	border:1px solid #D6D6D6;

}

.videoWrap .videoControls .btn.disabled {
	pointer-events: none;
	cursor: none;
}

.videoWrap .roleplayPannel {
	display: flex;
	justify-content: center;
	align-items: center;
}

.videoWrap [class*="btnRoleplay"],
.videoWrap [class*="btnFontsize"],
.videoWrap .btnSectionRepeat {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 18px;
	color: #666666;
	font-family: NotoSans;
	border: solid 1px #999999;
	background-color: #ffffff;
}

.videoWrap .btnSectionRepeat {
	position: relative;
	margin-right: 10px;
}

.videoWrap .btnSectionRepeat:after {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	text-align: center;
	content: '구간 반복'
}

.videoWrap .playbackratePannel {
	display: flex;
	align-items: center;
	width: 162px;
	height: 46px;
	font-size: 18px;
	color: #898989;
	font-family: PretendardB;
	border: solid 1px #D6D6D6;
	border-radius:8px;
	margin-right: 20px;
	box-sizing: border-box;
	cursor: pointer;
	background-color: #fff;

}

.videoWrap .playbackratePannel .on{
	font-family: PretendardEB;
}

.videoWrap .playbackratePannel  [class*="btn"] {
	display: flex;
	height: 100%;
	justify-content: center;
	align-items: center;
	border: none;


}

.videoWrap .playbackratePannel  [class*="btn"].on {
	color: #FF6700;
}

.videoWrap .playbackratePannel .btnSpeed {
	display: flex;
	height: 100%;
	justify-content: center;
	align-items: center;
}

.videoWrap .playbackratePannel .btnSpeed.on {
	color: #ee9522;
}

.videoWrap .playbackratePannel .btnSlow {
	flex: 1;
}

.videoWrap .playbackratePannel .btnNormal {
	flex: 1;
	border-right: solid 1px #D6D6D6;
	border-left: solid 1px #D6D6D6;
	box-sizing: border-box;
	border-radius: 0;
}

.videoWrap .playbackratePannel .btnFast {
	flex: 1;
}

.videoWrap [class*="btnRoleplay"].disabled,
.videoWrap [class*="btnFontsize"].disabled,
.videoWrap .btnSectionRepeat.disabled {
	color: #cccccc;
	border: solid 1px #cccccc;
}

.videoWrap [class*="btnRoleplay"].on,
.videoWrap [class*="btnFontsize"].on,
.videoWrap .btnSectionRepeat.on {
	color: #ffffff;
	background-color: #ee9522;
}

.videoWrap .btnRoleplayAll {
	width: 51px;
	border-radius: 100px !important;
	margin-right: 4px;
}

.videoWrap .btnRoleplay1,
.videoWrap .btnRoleplay2 {
	width: 46px;
	border-radius: 100px !important;
	margin-right: 4px;
}


.videoWrap .btnRoleplay2 {
	margin-right: 20px;
}

.videoWrap .btnRoleplayAll:after,
.videoWrap .btnRoleplay1:after,
.videoWrap .btnRoleplay2:after{
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	line-height: 46px;
	text-align: center;
	color: #898989;
	font-size: 18px;
	font-family:'PretendardEB';
}
.videoWrap .btnRoleplayAll.on:after,
.videoWrap .btnRoleplay1.on:after,
.videoWrap .btnRoleplay2.on:after{
	color: #fff;
}



.videoWrap .btnRoleplayAll:after {
	content: 'A-B'
}

.videoWrap .btnRoleplay1:after {
	content: 'A'
}

.videoWrap .btnRoleplay2:after {
	content: 'B'
}

.videoControls .controlPannel {
	display: flex;
	margin-right: 10px;
}

.videoWrap .btnPlay {
	width: 56px;
	background:rgba(255,255,255,1) url('../images/media/video_player/new_btnPlay.png') no-repeat;
	background-position: center;
	margin-right: 20px;

}
.videoWrap .btnPlay:hover{
	background:rgba(255,222,201,1) url('../images/media/video_player/new_btnPlay.png') no-repeat;
	background-position: center;}

.videoWrap .btnPause {
	width: 56px;
	background: rgba(255,255,255,1) url('../images/media/video_player/btnPause.png') no-repeat;
	background-position: center;
	margin-right: 20px;
}
.videoWrap .btnPause:hover{
	background: rgba(214,214,214,1) url('../images/media/video_player/btnPause.png') no-repeat;
	background-position: center;
}

.videoWrap .btnStop {
	width: 56px;
	background: rgba(255,255,255,1) url('../images/media/video_player/btnStop.png') no-repeat;
	background-position: center;
}
.videoWrap .btnStop:hover{
	background: rgba(214,214,214,1) url('../images/media/video_player/btnStop.png') no-repeat;
	background-position: center;
}

.videoWrap .btnStop.on {
	width: 56px;
	background: rgba(255,255,255,1) url('../images/media/video_player/btnStop.png') no-repeat;
	background-position: center;
}

.videoWrap .mvTime {
	display: flex;
	justify-content: space-between;
	align-items: center;
	position: relative;
	height: 40px;
	margin-left: 24px;
	margin-right: 20px;
/*	background: #fff;*/
}

.videoWrap .mvTime .back {
	width: 333px;
	height: 7px;
	border-radius: 6px;
	background-color: #D6D6D6;
}

.media_comn.full .videoWrap .mvTime .back { width: 278px;}

.videoWrap .mvTime .back .marker {
	position: absolute;
	display: flex;
	justify-content: center;
	align-items: center;
	top: 5px;
	left: 200px;
	width: 30px;
	height: 30px;
	margin-left: -12px;
	border-radius: 50%;
	/*border: solid 2px #faa61a;*/
	box-sizing: border-box;
	box-shadow: 0 2px 2px 2px rgba(0, 0, 0, 0.15);
	cursor: pointer;
	background-color: #FF6700;
	z-index: 10;
}

.videoWrap .mvTime .back .marker::after {
	content: "";
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background-color: #FFDC4A;
}

.videoControls .back .current {
	width: 100px;
	height: 6px;
	border-radius: 3px;
	background: #FF6700
}

.videoWrap .mvTime .label {
	width: 115px;
	font-size: 18px;
	/*font-family: Roboto;*/
	font-family:'PretendardM';
	color: #898989;
	text-align: center;
	margin-left: 24px;
}
.videoWrap .mvTime .label span {
	color: #FF6700;
}

.videoWrap .mvTime .roleplay0,
.videoWrap .mvTime .roleplay1,
.videoWrap .mvTime .roleplay2,
.videoWrap .mvTime .roleplay3,
.videoWrap .mvTime .roleplay4 {
	position: absolute;
	top: -12px;
	width: 20px;
	height: 24px;
	color: #ffffff;
	font-size: 12px;
	font-family:'PretendardM';
	text-align: center;
	cursor: pointer;
	background-image: url("../images/media/video_player/new_anchor_on.png");
	margin-left: 1px;
}

.videoWrap .mvTime .roleplay0::after,
.videoWrap .mvTime .roleplay1::after,
.videoWrap .mvTime .roleplay2::after,
.videoWrap .mvTime .roleplay3::after,
.videoWrap .mvTime .roleplay4::after{
	line-height: 20px;
}

.videoWrap .mvTime .roleplay1::after {
	content: "A";
}

/*
.videoWrap .mvTime .roleplay1:hover {
	background-image: url("../images/media/video_player/anchor_on.png");
}
*/

.videoWrap .mvTime .roleplay2::after {
	content: "B";
}

/*
.videoWrap .mvTime .roleplay2:hover {
	background-image: url("../images/media/video_player/anchor_on.png");
}
*/

.videoWrap .mvTime .roleplay3::after {
	content: "C";
}

/*.videoWrap .mvTime .roleplay3:hover {
	background-image: url("../images/media/video_player/anchor_on.png");
}*/

.videoWrap .mvTime .roleplay4::after {
	content: "D";
}

/*
.videoWrap .mvTime .roleplay4:hover {
	background-image: url("../images/media/video_player/anchor_on.png");
}
*/

.videoWrap .mvTime .repeat {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 11px;
	height: 11px;
	cursor: pointer;
	background-image: url("../images/media/video_player/repeatAnchor.png");
	margin-left: 0px;
}

.videoControls .toucharea {
	position: absolute;
	top: 10px;
	left: 0;
	width: 333px;
	height: 20px;
}

.media_comn.full .videoControls .toucharea { width: 278px;}

.videoControls .btnRepeatStart,
.videoControls .btnRepeatEnd {
	display: flex;
	justify-content: center;
	align-items: center;
	border: solid 1px #D6D6D6;
	background-color: #ffffff;
	margin-right:20px;
}

.videoControls .btnRepeatStart.on,
.videoControls .btnRepeatEnd.on {
	background-color:#faa61a;
}

.videoControls .btnRepeatStart {
	width: 54px;
	border-radius:8px 0 0 8px !important;
	margin-right:0;
	cursor: pointer;
	background-image: url("../images/media/video_player/new_icon_repeatLeft.png");
	background-position: center center;
	background-repeat: no-repeat;
}

.videoControls .btnRepeatStart.on {
	background-image: url("../images/media/video_player/new_icon_repeatLeft.png");
	background-position: center center;
	background-repeat: no-repeat;
}

.videoControls .btnRepeatEnd {
	width: 54px;
	border-radius:0 8px 8px 0 !important;
	margin-left:0;
	height: 21px;
	cursor: pointer;
	background-image: url("../images/media/video_player/new_icon_repeatRight.png");
	background-position: center center;
	background-repeat: no-repeat;
	border-left: 0;
}

.videoControls .btnRepeatEnd.on {
	width: 54px;
	cursor: pointer;
	background-image: url("../images/media/video_player/new_icon_repeatRight.png");
	background-position: center center;
	background-repeat: no-repeat;
}



.videoWrap .btnLangWrap {
	width: 92px;
	border-radius: 100px;
	display: flex;
	justify-content: center;
	align-items: center;
	height: 37px;
	font-size: 18px;
	color: #898989;
	font-family:'PretendardB';
	margin-right: 4px;
	border: none !important;
	box-sizing: border-box;
	cursor: pointer;

}
.videoWrap .btnLangWrap .btnKor,
.videoWrap .btnLangWrap .btnEng{  flex: 1;display: flex; justify-content: center; align-items: center; background-color: #fff; box-sizing: border-box;}

.videoWrap .btnLangWrap .btnKor {  border-radius: 100px 0 0 100px; border-right: none;}
.videoWrap .btnLangWrap .btnEng { border-radius: 0 100px 100px 0;}

.videoWrap .btnLangWrap.disabled {
	color: #cccccc;
	border: solid 1px #cccccc;
	pointer-events: none;
	cursor: none;
}

.videoWrap .btnLangWrap .vBar {
	display: none;
	width: 1px;
	height: 15px;
	margin: 0 8px;
	background-color: #cccccc;
}

.videoWrap .btnLangWrap .btnKor.on,
.videoWrap .btnLangWrap .btnEng.on {
	color: #fff;
	background-color: #FF6700;
}

.videoWrap .btnFontsizeUp,
.videoWrap .btnFontsizeDown {
	width: 46px;
	font-size: 28px;
	border-radius: 100px !important;
	color: #898989;
	text-indent: -9999px;
}

.videoWrap .btnFontsizeUp {
	margin-right: 4px;
	background: rgba(255,255,255,1) url('../images/media/pulsIcon.png') center center no-repeat;

}
.videoWrap .btnFontsizeDown {
	background: rgba(255,255,255,1) url('../images/media/minusIcon.png ') center center no-repeat;

}


.videoWrap .btnSubtitle {
	width: 54px;
	margin-right: 4px;
	background: rgba(255,255,255,1) url('../images/media/video_player/new_btnSubtitle_off.png') center center no-repeat;
}

.videoWrap .btnSubtitle.on {
	width: 54px;
	margin-right: 4px;
	background: rgba(255,255,255,1) url('../images/media/video_player/new_btnSubtitle_off.png') center center no-repeat;
}

.videoWrap .btnChange {
	width: 37px;
	margin-right: 10px;
	background: url("../images/media/video_player/btnSubtitle_off.png") center center no-repeat;
}

.videoWrap .btnChange.on {
	width: 37px;
	margin-right: 10px;
	background: url("../images/media/video_player/btnSubtitle_on.png") center center no-repeat;
}

.videoWrap .btnFullscreen {
	width: 54px;
	background: rgba(255,255,255,1) url('../images/media/video_player/new_btnFullscreen.png') center center no-repeat;
}

.videoWrap .btnFullscreen.on {
	width: 54px;
	background: rgba(255,255,255,1)  url('../images/media/video_player/new_btnFullscreen.png') center center no-repeat;
}

.videoWrap .anchor {
	position: absolute;
}

/* 썸네일 */
.videoInnerContainer {
	position: absolute;
	width: 100%;
	z-index: 110;
}

.videoInnerContainer .toucharea {
	position: absolute;
	display: inline-block;
	top: 0;
	left: 0;
	width: 100%;
	height: 200px;
}

.videoInnerContainer .videoInner {
	position: absolute;
	background: #313131;
	width: 100%;
	height: 144px;
	padding: 17px 15px;
	overflow: hidden;
	z-index: 100;
	animation: videoInnerMotion ease 0.3s;
	-webkit-animaition: videoInnerMotion ease 0.3s;
	-ms-animation: videoInnerMotion ease 0.3s;
	box-sizing: border-box;
}

.videoInnerContainer .videoInner .videoInnerBox {
	position: relative;
	display: inline-block;
	float: left;
	width: 192px;
	height: 108px;
	border: 3px solid #313131;
	background: #313131;
	background-size: 240px 135px;
	margin: 0 8px;
	cursor:pointer;
}

.videoInnerContainer .videoInner .videoInnerBox:hover {
	border: 3px solid #f78022;
}

@keyframes videoInnerMotion {
	0% {
		opacity: 0;
		height: 0;
	}

	100% {
		opacity: 1;
		height: 144px;
	}
}

@-webkit-keyframes videoInnerMotion {
	0% {
		opacity: 0;
		height: 0;
	}

	100% {
		opacity: 1;
		height: 144px;
	}
}

@-ms-keyframes videoInnerMotion {
	0% {
		opacity: 0;
		height: 0;
	}

	100% {
		opacity: 1;
		height: 175px;
	}
}

/* 자막 */
.videoInnerScript {
	position: absolute;
	width: 100%;
	bottom: 180px;
	display: none;
	text-align: center;
}

.videoInnerScript .caption {
	display: inline-block;
	width: 100%;
	background-color: rgba(0, 0, 0, 0.5);
	padding: 0 100px;
	box-sizing: border-box;
	line-height: 0;
	color: #ffffff;
}

.videoInnerScript .caption .tEng,
.videoInnerScript .caption .tKor {
	display: none;
}

.videoInnerScript .caption .tEng.show,
.videoInnerScript .caption .tKor.show {
	display: block;
}

.videoInnerScript .caption .tEng {
	font-size: 43px;
	color: #fff !important;
	word-break: keep-all;
	line-height: 1.3em;
	font-family: NotoSans;
	padding: 0px 0px 0px;
}

.videoInnerScript .caption .tEng:hover {
	color: #fff !important;
}

.videoInnerScript .caption .tKor {
	font-size: 43px;
	color: #fff !important;
	word-break: keep-all;
	line-height: 1.3em;
	font-family: NotoSans;
	padding: 0px 0px 0px;
}
.videoInnerScript .caption .tEng.show + .tKor {
	padding-top: 0px;
}

.videoInnerScript .caption .tKor:hover {
	color: #fff !important;
}
.videoInnerScript .caption .show {
	display: inline !important;
}

/*
	***** 타입별 탐색바 길이 *****
*/
.mp_video.basic .mvTime .back {width:1020px;}
.mp_video.basic .videoControls .toucharea {width:1020px;}

.mp_video.thumbnail .mvTime .back {width:700px;}
.mp_video.thumbnail .videoControls .toucharea {width:700px;}

.mp_video.rolePlay .mvTime .back {width:550px;}
.mp_video.rolePlay .videoControls .toucharea {width:550px;}

.mp_video.playbackRate .mvTime .back {width:690px;}
.mp_video.playbackRate .videoControls .toucharea {width:690px;}

/* ------------------------------------------------------------------------------------------------------------- */
/* full screen */
*:-moz-full-screen .videoWrap .videoContainer {
	position: fixed;
	top: 0;
	left: 0;
	width: 100% !important;
	height: 100% !important;
	display: flex;
	align-items: center;
}
*:-webkit-full-screen .videoWrap .videoContainer {
	position: fixed;
	top: 0;
	left: 0;
	width: 100% !important;
	height: 100% !important;
	display: flex;
	align-items: center;
}
*:-ms-fullscreen .videoWrap .videoContainer {
	position: fixed;
	top: 0;
	left: 0;
	width: 100% !important;
	height: 100% !important;
	display: flex;
	align-items: center;
}
*:fullscreen .videoWrap .videoContainer {
	position: fixed;
	top: 0;
	left: 0;
	width: 100% !important;
	height: 100% !important;
	display: flex;
	align-items: center;
}

*:-moz-full-screen .videoWrap video {
	width: 100% !important;
	height: 100% !important;
}
*:-webkit-full-screen .videoWrap video {
	width: 100% !important;
	height: 100% !important;
}
*:-ms-fullscreen .videoWrap video {
	width: 100% !important;
	height: 100% !important;
}
*:fullscreen .videoWrap video {
	width: 100% !important;
	height: 100% !important;
}

*:-moz-full-screen .videoWrap .videoControls {
	position: fixed;
	left: 0px;
	bottom: 0px;
	background-color: #ffffff;
	z-index: 20;
}
*:-webkit-full-screen .videoWrap .videoControls {
	position: fixed;
	left: 0px;
	bottom: 0px;
	background-color: #ffffff;
	z-index: 20;
}
*:-ms-fullscreen .videoWrap .videoControls {
	position: fixed;
	left: 0px;
	bottom: 0px;
	background-color: #ffffff;
	z-index: 20;
}
*:fullscreen .videoWrap .videoControls {
	position: fixed;
	left: 0px;
	bottom: 0px;
	background-color: #ffffff;
	z-index: 20;
}

*:-moz-full-screen .videoWrap .btnCover {
	width: 100% !important;
	height: 100% !important;
}
*:-webkit-full-screen .videoWrap .btnCover {
	width: 100% !important;
	height: 100% !important;
}
*:-ms-fullscreen .videoWrap .btnCover {
	width: 100% !important;
	height: 100% !important;
}
*:fullscreen .videoWrap .btnCover {
	width: 100% !important;
	height: 100% !important;
}

*:-moz-full-screen .videoWrap .poster {
	width: 100% !important;
	height: 100% !important;
	background-repeat: no-repeat;
}
*:-webkit-full-screen .videoWrap .poster {
	width: 100% !important;
	height: 100% !important;
	background-repeat: no-repeat;
}
*:-ms-fullscreen .videoWrap .poster {
	width: 100% !important;
	height: 100% !important;
	background-repeat: no-repeat;
}
*:fullscreen .videoWrap .poster {
	left:0px;
	width: 100% !important;
	height: 100% !important;
	background-repeat: no-repeat;
}

*:-moz-full-screen .videoWrap .coverContainer {
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	z-index: 10;
}
*:-webkit-full-screen .videoWrap .coverContainer {
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	z-index: 10;
}
*:-ms-fullscreen .videoWrap .coverContainer {
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	z-index: 10;
}
*:fullscreen .videoWrap .coverContainer {
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	z-index: 10;
}

*:-moz-full-screen .videoInnerScript {
	bottom: 100px;
}
*:-webkit-full-screen .videoInnerScript {
	bottom: 100px;
}
*:-ms-fullscreen .videoInnerScript {
	bottom: 100px;
}
*:fullscreen .videoInnerScript {
	bottom: 100px;
}

*::-webkit-media-controls-panel,
*::-webkit-media-controls-play-button,
*::-webkit-media-controls-start-playback-button {
	display: none !important;
	-webkit-appearance: none;
}

video::-webkit-media-controls,
video::-webkit-media-controls-enclosure,
video::-webkit-media-controls-fullscreen-button {
	display:none !important;
}

*:-moz-full-screen .controls_out {
  opacity: 0;
}
*:-webkit-full-screen .controls_out {
  opacity: 0;
}
*:-ms-fullscreen .controls_out {
  opacity: 0;
}
*:fullscreen .controls_out {
  opacity: 0;
}




/*
	*** @@## hls방식의 해상도 셀렉트박스
*/
.resolutionSelector {position:absolute; top:-46px; right:0; z-index:100;}
.resolutionSelector .selectedCell {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 106px;
	height: 36px;
	border-radius: 10px;
	border: 1px solid #898989;
	cursor:pointer;
	background: #FFF;
}
.resolutionSelector .selectedCell:hover {background-color:#D6D6D6;}
.resolutionSelector .selectedCell .textCell {flex:1; font-size:18px; color:#898989; font-family:PretendardB; text-align:center;}
.resolutionSelector .selectedCell .arrowCell {width:20px; text-align:center;}
.resolutionSelector .selectedCell .arrowCell .off {display:block;}
.resolutionSelector .selectedCell .arrowCell .on {display:none;}

.resolutionSelector .optionWrap {
	display:none;
	overflow: hidden;
	border-radius: 10px;
	border: 1px solid #898989;
	background: #fff;
	box-shadow: 0px 8px 8px 0px rgba(0, 0, 0, 0.15);
}
.resolutionSelector .optionWrap .option {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 106px;
	height: 36px;
	font-size:18px;
	color:#898989;
	font-family:PretendardB;
	border-bottom: 1px solid #898989;
	cursor:pointer;
	background: #FFF;
}
.resolutionSelector .optionWrap .option:last-child {border-bottom:0;}
.resolutionSelector .optionWrap .option:hover {background-color:#D6D6D6;}
.resolutionSelector .optionWrap .option.on {color:#ffffff; pointer-events: none; background-color:#FF6700;}


/*셀렉트박스 on*/
.resolutionSelector.on .selectedCell .textCell {color:#FF6700;}
.resolutionSelector.on .selectedCell .arrowCell .off {display:none;}
.resolutionSelector.on .selectedCell .arrowCell .on {display:block;}

.resolutionSelector.on .optionWrap {display:block;}
























