html,body{
	margin:0;padding:0;
}
.videowrap{
	position: absolute;
	top: 0px; left: 50%;
	background-color:rgba( 0,0,0,0);
	transform: translate(-50%,0%);
}

.vjs-custom-skin {  }

.vjs-custom-skin .vjs-control-bar {

	height: 6em;
	padding-top:2.4em;
}

.vjs-custom-skin:not(.vjs-has-started) .vjs-control-bar {
  display: flex;
}

.vjs-custom-skin .vjs-custom-control-spacer {
    display: flex;
    flex: 1 1 auto;
  }
.vjs-custom-skin   .vjs-time-divider {
    display: inherit;
  }
.vjs-custom-skin   .vjs-current-time {
    margin-left: 1em;
  }

.vjs-custom-skin   .vjs-current-time, .vjs-custom-skin .vjs-duration, .vjs-custom-skin .vjs-remaining-time {
	font-size:12px;
    padding: 0;
	margin-top:-3px;

}

/* 진행바의 현재위치를 표시하는 circle */
.vjs-custom-skin   .vjs-play-progress:before {
	margin-top:1px;
	display:none;
 }
.vjs-custom-skin  .vjs-progress-control:hover .vjs-play-progress:before {
	display:inherit;
	margin-top:2px;
  }
.vjs-custom-skin   .vjs-progress-control {
    position: absolute;
    left: 0;
    right: 0;
    width: 100%;
    height: .5em;
    top: 1.2em;
}
.vjs-custom-skin   .vjs-progress-control:hover {
    height: 0.8em;
    top: 1.05em;
 }
.vjs-custom-skin   .vjs-progress-holder {
    margin: 0;
    height: 100%;
  }

.vjs-custom-skin .vjs-time-control {
    display: block;
}


/* 현재 진행시간 & 전체시간 */
.vjs-custom-skin   .vjs-current-time, .vjs-custom-skin .vjs-duration {
    display: inherit;
}
/* 남은시간 표시 */
.vjs-custom-skin   .vjs-remaining-time {
    display: none;
}

/* 프로그래스바에 현재시간 등의 글자 */
.vjs-custom-skin .vjs-progress-control:hover .vjs-time-tooltip,
.vjs-custom-skin .vjs-progress-control:hover .vjs-progress-holder:focus .vjs-time-tooltip {
	display:none;
	font-size: 0.8em;
}

/* 프로그래스바에 마우스 올렸을때 위치 표시(바) */
.vjs-custom-skin .vjs-progress-control .vjs-mouse-display {
  width: 3px;
  background-color: #f00;
 }
/* 프로그래스바에 마우스 올렸을때 시간 툴팁 */
.vjs-custom-skin .vjs-mouse-display .vjs-time-tooltip {
	color:#000;
	background-color: #fff;
}
.vjs-custom-skin .vjs-play-progress .vjs-time-tooltip  {
	display:none !important;
}

.vjs-custom-skin .vjs-icon-play-circle {  }
.vjs-custom-skin .vjs-play-progress { color: #ff0000;background: #ff0000; }


/* Show if the video is paused */
.vjs-custom-skin .vjs-paused .vjs-big-play-button {
    opacity: 1;
    pointer-events: all;
    transition: opacity 0.5s;
}

.vjs-custom-skin .vjs-control-bar{
	z-index:99;
}

.vjs-custom-skin .vjs-fullscreen-control,.vjs-custom-skin .vjs-icon-fullscreen-exit{
	font-size:1.2em;
}

.vjs-custom-skin .vjs-no-playbackrate{
	line-height: 1.2em;
	font-size:1.2em;
	width:90px;
}

.vjs-custom-skin .vjs-big-play-button
{
	display: none;
}
.vjs-custom-skin .vjs-playback-rate
{
	margin-top:3px;
}

.video-js .vjs-quality-selector{display:block}
.vjs-menu-item.disabled{ display:none }
.vjs-icon-hd, .vjs-hd-btn, .vjs-quality-selector .vjs-icon-placeholder{
	color:#fff;
	text-align:center;
	pointer-events: none;
	font-size: 1.4em;
}

.vjs-quality-selector  .vjs-menu-button{
	padding-top:0px;

}

.vjs-text-hd{
	font-style: normal;
	text-decoration:none;
	letter-spacing: -1px;
	color:#ffcc00;
	font-weight:bold;
	font-size:9px;
	text-transform:uppercase;
	margin-top:-3px;
}
 sup.vjs-text-hd{
	font-style: normal;
	text-decoration:none;
	letter-spacing: -1px;
	color:#ffcc00;
	font-weight:bold;
	font-size:10px;
	text-transform:uppercase;
}
sup.vjs-text-hd:before{
	content: "HD";
}

.video-js.vjs-fullscreen .vjs-topOverlay{

}

.vjs-topOverlay{
  display: inline-block;
  vertical-align: middle;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: contain;
  margin: 0;
  padding: 0;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  height: 100%;
}

.vjs-topOverlay .content{
	display:none;
	text-align:center;
    position: absolute;
    top: 50%; left: 50%;
	transform: translate(-50%,-50%);
	background-color:rgba( 0,0,0,0.5);
	padding:30px 20px;
	border-radius: 25px;
	color:#fff;
	font-size: 1.6em;
}

.vjs-topOverlay .vjs-big-play-button {
  font-size: 3em;
  line-height: 1.5em;
  height: 1.63332em;
  width: 3em;
  display: block;
  padding: 0;
  cursor: pointer;
  opacity: 1;
  border: 0.06666em solid #fff;
  background-color: #2B333F;
  background-color: rgba(43, 51, 63, 0.7);
  border-radius: 0.3em;
  transition: all 0.4s;
    position: absolute;
    top: 50%; left: 50%;
	transform: translate(-50%,-50%);
}

.vjs-topOverlay:hover .vjs-big-play-button,
.vjs-topOverlay .vjs-big-play-button:focus {
  border-color: #fff;
  background-color: #73859f;
  background-color: rgba(115, 133, 159, 0.5);
  transition: all 0s;
}


.vjs-topOverlay .content.small{
	font-size:1.3em;
}
.vjs-topOverlay .content.Title{
	background-color:rgba( 0,0,0,0);
    background-image: linear-gradient(to bottom, rgba(0,0,0,0.9), rgba(0,0,0,0));

	text-align:left;
	border-radius: 0px;
	top:0px;
	width:100%;
	padding-top:120px !important;
}

.vjs-topOverlay .content.Title:before{
	content:attr( Pos );
	color:#ff6b02;
	font-size:2em;
}

.belowContent {
	background-color:rgba( 0,0,0,0.3);
	border-radius:10px;
	width:200px;
	height:200px;
	font-size: 1.6em;
	padding:10px;
}


.vjs-info{
  display: inline-block;
  vertical-align: middle;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: contain;
  background-color: #000000;
  cursor: pointer;
  margin: 0;
  padding: 0;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  height: 100%;
  background-color: rgba( 0,0,0, 0);
}

.vjs-info .content{
	display:none;
	text-align:center;
    position: absolute;
    top: 50%; left: 50%;
	transform: translate(-50%,-50%);
	background-color:rgba( 0,0,0,0);
	padding:30px 20px;
	border-radius: 25px;

	color:#fff;
}
.vjs-info .content.command {

	background-color:rgba( 0,0,0,0);
	font-size: 10em;

}

.vjs-info .content.Error {
	cursor:default;
	width:100%;
	border-radius: 0px;
	background-color:rgba( 0,0,0,0.7);
	line-height:1.2em;
	font-size: 1.7em;
	color:#3e9dfd;
	text-align:left;
	vertical-align: middle;
}
.vjs-info .command{
	display:none;
	text-align:center;
    position: absolute;
    top: 0; left: 0;
	transform: translate(-50%,-50%);
	background-color:rgba( 0,0,0,0);
	padding:30px 20px;
	border-radius: 25px;

	color:#fff;
}

@font-face { font-family: 'videojs-theaterMode'; speak: none; src: url("data:application/font-sfnt;base64,AAEAAAALAIAAAwAwT1MvMg8SB2gAAAC8AAAAYGNtYXAXVtKIAAABHAAAAFRnYXNwAAAAEAAAAXAAAAAIZ2x5ZpVu9XQAAAF4AAAAnGhlYWQSAf6DAAACFAAAADZoaGVhC8IHxwAAAkwAAAAkaG10eBO3AAAAAAJwAAAAGGxvY2EAdgBKAAACiAAAAA5tYXhwAAkACwAAApgAAAAgbmFtZZlKCfsAAAK4AAABhnBvc3QAAwAAAAAEQAAAACAAAwU9AZAABQAAApkCzAAAAI8CmQLMAAAB6wAzAQkAAAAAAAAAAAAAAAAAAAABEAAAAAAAAAAAAAAAAAAAAABAAADpAQPA/8AAQAPAAEAAAAABAAAAAAAAAAAAAAAgAAAAAAADAAAAAwAAABwAAQADAAAAHAADAAEAAAAcAAQAOAAAAAoACAACAAIAAQAg6QH//f//AAAAAAAg6QD//f//AAH/4xcEAAMAAQAAAAAAAAAAAAAAAQAB//8ADwABAAAAAAAAAAAAAgAANzkBAAAAAAEAAAAAAAAAAAACAAA3OQEAAAAAAQAAAAAAAAAAAAIAADc5AQAAAAACAAD/wAW3A8AABAAIAAABESERITchESEFJfttBJOS+kkFtwMu/SQC3JL8AAAAAAACAAD/wAgAA8AABAAIAAABESERITchESEHM/maBmbN+AAIAALz/ZoCZs38AAAAAAABAAAAAAAAL/heSV8PPPUACwQAAAAAANVx3QMAAAAA1XHdAwAA/8AIAAPAAAAACAACAAAAAAAAAAEAAAPA/8AAAAgAAAAAAAgAAAEAAAAAAAAAAAAAAAAAAAAGBAAAAAAAAAAAAAAAAgAAAAW3AAAIAAAAAAAAAAAKABQAHgA2AE4AAAABAAAABgAJAAIAAAAAAAIAAAAAAAAAAAAAAAAAAAAAAAAADgCuAAEAAAAAAAEABwAAAAEAAAAAAAIABwBgAAEAAAAAAAMABwA2AAEAAAAAAAQABwB1AAEAAAAAAAUACwAVAAEAAAAAAAYABwBLAAEAAAAAAAoAGgCKAAMAAQQJAAEADgAHAAMAAQQJAAIADgBnAAMAAQQJAAMADgA9AAMAAQQJAAQADgB8AAMAAQQJAAUAFgAgAAMAAQQJAAYADgBSAAMAAQQJAAoANACkaWNvbW9vbgBpAGMAbwBtAG8AbwBuVmVyc2lvbiAxLjAAVgBlAHIAcwBpAG8AbgAgADEALgAwaWNvbW9vbgBpAGMAbwBtAG8AbwBuaWNvbW9vbgBpAGMAbwBtAG8AbwBuUmVndWxhcgBSAGUAZwB1AGwAYQByaWNvbW9vbgBpAGMAbwBtAG8AbwBuRm9udCBnZW5lcmF0ZWQgYnkgSWNvTW9vbi4ARgBvAG4AdAAgAGcAZQBuAGUAcgBhAHQAZQBkACAAYgB5ACAASQBjAG8ATQBvAG8AbgAuAAAAAwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA==") format("truetype"), url("data:application/font-woff;base64,d09GRgABAAAAAASsAAsAAAAABGAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABPUy8yAAABCAAAAGAAAABgDxIHaGNtYXAAAAFoAAAAVAAAAFQXVtKIZ2FzcAAAAbwAAAAIAAAACAAAABBnbHlmAAABxAAAAJwAAACclW71dGhlYWQAAAJgAAAANgAAADYSAf6DaGhlYQAAApgAAAAkAAAAJAvCB8dobXR4AAACvAAAABgAAAAYE7cAAGxvY2EAAALUAAAADgAAAA4AdgBKbWF4cAAAAuQAAAAgAAAAIAAJAAtuYW1lAAADBAAAAYYAAAGGmUoJ+3Bvc3QAAASMAAAAIAAAACAAAwAAAAMFPQGQAAUAAAKZAswAAACPApkCzAAAAesAMwEJAAAAAAAAAAAAAAAAAAAAARAAAAAAAAAAAAAAAAAAAAAAQAAA6QEDwP/AAEADwABAAAAAAQAAAAAAAAAAAAAAIAAAAAAAAwAAAAMAAAAcAAEAAwAAABwAAwABAAAAHAAEADgAAAAKAAgAAgACAAEAIOkB//3//wAAAAAAIOkA//3//wAB/+MXBAADAAEAAAAAAAAAAAAAAAEAAf//AA8AAQAAAAAAAAAAAAIAADc5AQAAAAABAAAAAAAAAAAAAgAANzkBAAAAAAEAAAAAAAAAAAACAAA3OQEAAAAAAgAA/8AFtwPAAAQACAAAAREhESE3IREhBSX7bQSTkvpJBbcDLv0kAtyS/AAAAAAAAgAA/8AIAAPAAAQACAAAAREhESE3IREhBzP5mgZmzfgACAAC8/2aAmbN/AAAAAAAAQAAAAAAAC/4XklfDzz1AAsEAAAAAADVcd0DAAAAANVx3QMAAP/ACAADwAAAAAgAAgAAAAAAAAABAAADwP/AAAAIAAAAAAAIAAABAAAAAAAAAAAAAAAAAAAABgQAAAAAAAAAAAAAAAIAAAAFtwAACAAAAAAAAAAACgAUAB4ANgBOAAAAAQAAAAYACQACAAAAAAACAAAAAAAAAAAAAAAAAAAAAAAAAA4ArgABAAAAAAABAAcAAAABAAAAAAACAAcAYAABAAAAAAADAAcANgABAAAAAAAEAAcAdQABAAAAAAAFAAsAFQABAAAAAAAGAAcASwABAAAAAAAKABoAigADAAEECQABAA4ABwADAAEECQACAA4AZwADAAEECQADAA4APQADAAEECQAEAA4AfAADAAEECQAFABYAIAADAAEECQAGAA4AUgADAAEECQAKADQApGljb21vb24AaQBjAG8AbQBvAG8AblZlcnNpb24gMS4wAFYAZQByAHMAaQBvAG4AIAAxAC4AMGljb21vb24AaQBjAG8AbQBvAG8Abmljb21vb24AaQBjAG8AbQBvAG8AblJlZ3VsYXIAUgBlAGcAdQBsAGEAcmljb21vb24AaQBjAG8AbQBvAG8AbkZvbnQgZ2VuZXJhdGVkIGJ5IEljb01vb24uAEYAbwBuAHQAIABnAGUAbgBlAHIAYQB0AGUAZAAgAGIAeQAgAEkAYwBvAE0AbwBvAG4ALgAAAAMAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA=") format("woff"); font-weight: normal; font-style: normal; font-variant: normal; text-transform: none; line-height: 1; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

.vjs-theater-mode-control-open, .vjs-theater-mode-control-close { font-family: 'videojs-theaterMode'; float: right; cursor: pointer; }

.video-js .vjs-theater-mode-control-open.vjs-control:before { content: "\e901"; font-size: 1.1em; line-height: 2.9em; }

.video-js .vjs-theater-mode-control-close.vjs-control:before { content: "\e900"; font-size: 1.2em; line-height: 2.2em; }


.ErrorBtn{
	border:1px solid #33cc00 !important;
	background-color:#3399cc !important;
	color:#fff !important;
	text-align:center;
	padding: 4px 12px;
	font-size:14px;
	border-radius: 4px;
}
.ErrorBtn:hover{
	background-color:#ffcc33 !important;
	color:#5a5a5a !important;
}


.video-js .vjs-seekButton { font-size: 1.2em; width: 36px !important;cursor:pointer }
.video-js .vjs-seekButton:hover{font-size: 1.4em;font-weight:bold}
.video-js .vjs-seekButton-mp4 { margin-top:-3px;font-size: 1.4em; width: 36px !important;cursor:pointer }
.video-js .vjs-seekButton-mp4:hover{font-size: 1.6em;font-weight:bold}



@media screen and (max-width: 991px) {
	.vjs-topOverlay .content{ font-size:1.4em}
	.vjs-topOverlay .content.small{ font-size:1.0em}

	.vjs-topOverlay .content.Title:before{ font-size:1.5em;}
	.vjs-custom-skin .vjs-time-control { display:none }
	.vjs-custom-skin .vjs-current-time { display:inherit }
}



.BottomsWrap{ display:none;
	position:fixed;
	left:0;
	bottom:0;
	height:70px;
	width:100%;
}
.Bottoms{
	display: table;
	height:70px;
	color: #fff;
	font-weight:bold;
	background-color:#fff;
}

.Bottoms div {
	display:table-cell;
}


.BottomsWrap .vvTitle{
	color: #000;
	padding: 5px 20px;
	font-weight:bold;

}


.vjs-fullscreen #player{
  position: absolute; /* or absolute */
  width:100%;
  height:100%;

  top: 50%;
  left: 50%;
  /* bring your own prefixes */
  transform: translate(-50%, -50%);
}

