@charset "utf-8";
/*************************************************
프로젝트명 : 연합뉴스 국문 PC 홈페이지 (2019)
commnet : video_js 비디오, 오디오 스킨
*************************************************/

@import url('//r.yna.co.kr/global/home/v01/css/video-js.css');

/* =============== 비디오 스킨 ======================== */
/* vid-skin01, vid-skin02 : ASIS 영상 스킨
 * vid-skin03 : [공통] 2019년 버전 - 글기사 본문 */

/* ---- vid-skin 02 ---- */
/* .vid-skin02{} */

/* Big Play Button */
.vid-skin02 .vjs-big-play-button{
display:block;position:absolute;left:50%;top:50%;width:120px;height:120px;margin:-60px 0 0 -60px;font-size:3em;text-align:center;vertical-align:middle;opacity:1;cursor:pointer;z-index:2;
background:transparent url(//r.yna.co.kr/www/home_n/v02/img/sprites_video_skin02_ui01.png) -134px 3px no-repeat;
border:none;-webkit-border-radius:none;-moz-border-radius:none;border-radius:none;
-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;
-webkit-transition:all 0.4s;
-moz-transition:all 0.4s;
-o-transition:all 0.4s;
transition:all 0.4s;}
.vid-skin02.vjs-controls-disabled .vjs-big-play-button{display:none;}
.vid-skin02.vjs-has-started .vjs-big-play-button{display:none;}
.vid-skin02.vjs-using-native-controls .vjs-big-play-button{display:none;}
.vid-skin02.vjs-error .vjs-big-play-button{display:none;}
.vid-skin02:hover .vjs-big-play-button,
.vid-skin02 .vjs-big-play-button:focus{
border-color:none;outline:0;background-color:transparent;
-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;
-webkit-transition:all 0s;
-moz-transition:all 0s;
-o-transition:all 0s;
transition:all 0s;}
.vid-skin02 .vjs-big-play-button:before{display:none;}

/* Control Bars */
.vid-skin02 .vjs-control-bar{display:block;position:absolute;bottom:0;left:0;right:0;height:40px;
background-color:#07141e;background-color:rgba(7, 20, 30, 0.7);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000);
-ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000)";}
.vid-skin02.vjs-has-started .vjs-control-bar{visibility:visible;display:block;opacity:1;
-webkit-transition:visibility 0.4s, opacity 0.4s;
-moz-transition:visibility 0.4s, opacity 0.4s;
-o-transition:visibility 0.4s, opacity 0.4s;
transition:visibility 0.4s, opacity 0.4s;}
.vid-skin02.vjs-has-started.vjs-user-inactive.vjs-playing .vjs-control-bar{
visibility:hidden;.visibility:visible;display:block;opacity:0;
-webkit-transition:visibility 1s, opacity 1s;
-moz-transition:visibility 1s, opacity 1s;
-o-transition:visibility 1s, opacity 1s;
transition:visibility 1s, opacity 1s;}
.vid-skin02.vjs-has-started.vjs-user-inactive.vjs-playing .vjs-control-bar:hover{visibility:visible !important;display:block;opacity:1;}
.msie8 .vid-skin02.vjs-has-started.vjs-user-inactive.vjs-playing .vjs-control-bar{visibility:visible;}

/* Progress Bars 타임라인 */
.vid-skin02 .vjs-play-progress{background:#039ff8;}
.vid-skin02 .vjs-progress-control{
position:absolute;left:0;right:0;top:17px;width:auto;height:4px;margin-left:124px;margin-right:130px;font-size:0.3em;
-webkit-transition:all 0.4s;
-moz-transition:all 0.4s;
-o-transition:all 0.4s;
transition:all 0.4s;}

/* Progress 핸들러 아이콘 */
.vid-skin02 .vjs-seek-handle{width:4px;height:4px;}
.vid-skin02 .vjs-slider-handle{}
.vid-skin02 .vjs-slider-handle:before{
display:none;content:"";position:absolute;top:0;width:4px;height:4px;background:#039ff8;text-shadow:none;color:#039ff8;text-align:center;font-size:0;line-height:0;
-webkit-transform:none;
-moz-transform:none;
-ms-transform:none;
-o-transform:none;
transform:none;}

/* Play/Pause 버튼 */
.vid-skin02 .vjs-play-control{width:38px;height:38px;margin-left:6px;background:url(//r.yna.co.kr/www/home_n/v02/img/sprites_video_skin02_ui01.png) 15px 13px no-repeat;cursor:pointer;}
.vid-skin02 .vjs-play-control:before{display:none;content:"";position:absolute;top:10px;left:9px;width:17px;height:17px;font-size:17px;line-height:17px;text-align:center;text-shadow:none;}
.vid-skin02.vjs-playing .vjs-play-control{background:url(//r.yna.co.kr/www/home_n/v02/img/sprites_video_skin02_ui01.png) 14px -47px no-repeat;}
.vid-skin02.vjs-playing .vjs-play-control:before{display:none;content:"";position:absolute;top:10px;left:9px;width:17px;height:17px;font-size:17px;line-height:17px;text-align:center;text-shadow:none;}

/* 재생 시간 */
.vid-skin02 .vjs-time-controls{font-size:1em;line-height:3em;}
.vid-skin02 .vjs-current-time{float:left;margin-top:4px;}
.vid-skin02 .vjs-current-time:after{display:none;}
.vid-skin02 .vjs-duration{float:left;margin-top:4px;}
.vid-skin02 .vjs-remaining-time{display:none;float:left;}
.vid-skin02 .vjs-time-divider{float:left;line-height:3em;margin-top:4px;}
.vid-skin02 .vjs-time-divider span{vertical-align:middle;}

/* 볼륨 */
.vid-skin02 .vjs-volume-control{float:right;width:60px;}
.vid-skin02 .vjs-volume-control .vjs-slider{background:url(//r.yna.co.kr/www/home_n/v02/img/sprites_video_skin02_volume01.png) 0 0 repeat-x;}
.vid-skin02 .vjs-volume-bar{width:5em;height:8px;margin:15px auto 0;}

.vid-skin02 .vjs-volume-level{position:absolute;top:0;left:0;width:100%;height:8px;background:url(//r.yna.co.kr/www/home_n/v02/img/sprites_video_skin02_volume01.png) 0 -8px repeat-x;}
/* 2020-09-25 : 영상본문 음소거 설정 작업
* 음소거상태 일때 videojs 에서 width 5~6% 를 주기 때문에 게이지가 넓이만큼 보이는걸 방지한다.
* vjs-volume-level의 넓이 값은 넓이에 따라 수치가 달려져 0~7% 까지 대비함 */
.vid-skin02 .vjs-volume-level[style*="width: 0%;"],
.vid-skin02 .vjs-volume-level[style*="width: 1%;"],
.vid-skin02 .vjs-volume-level[style*="width: 2%;"],
.vid-skin02 .vjs-volume-level[style*="width: 3%;"],
.vid-skin02 .vjs-volume-level[style*="width: 4%;"],
.vid-skin02 .vjs-volume-level[style*="width: 5%;"],
.vid-skin02 .vjs-volume-level[style*="width: 6%;"],
.vid-skin02 .vjs-volume-level[style*="width: 7%;"]{background:none;}

.vid-skin02 .vjs-volume-bar .vjs-volume-handle{width:0.5em;height:8px;left:4.5em;}
.vid-skin02 .vjs-volume-handle:before{display:none;top:0;left:0;width:2px;height:8px;background:#039ff8;font-size:4px;}

.vid-skin02 .vjs-mute-control,
.vid-skin02 .vjs-volume-menu-button{float:right;width:38px;height:38px;background:url(//r.yna.co.kr/www/home_n/v02/img/sprites_video_skin02_ui01.png) 14px -108px no-repeat;cursor:pointer;}
.vid-skin02 .vjs-mute-control:before,
.vid-skin02 .vjs-volume-menu-button:before{display:none;content:"";position:absolute;top:14px;left:17px;width:18px;height:14px;}

.vid-skin02 .vjs-mute-control.vjs-vol-0,
.vid-skin02 .vjs-volume-menu-button.vjs-vol-0{background:url(//r.yna.co.kr/www/home_n/v02/img/sprites_video_skin02_ui01.png) 14px -288px no-repeat;}
.vid-skin02 .vjs-mute-control.vjs-vol-1,
.vid-skin02 .vjs-volume-menu-button.vjs-vol-1{background:url(//r.yna.co.kr/www/home_n/v02/img/sprites_video_skin02_ui01.png) 14px -228px no-repeat;}
.vid-skin02 .vjs-mute-control.vjs-vol-2,
.vid-skin02 .vjs-volume-menu-button.vjs-vol-2{background:url(//r.yna.co.kr/www/home_n/v02/img/sprites_video_skin02_ui01.png) 14px -168px no-repeat;}
.vid-skin02 .vjs-mute-control.vjs-vol-3,
.vid-skin02 .vjs-volume-menu-button.vjs-vol-3{background:url(//r.yna.co.kr/www/home_n/v02/img/sprites_video_skin02_ui01.png) 14px -108px no-repeat;}

/* Fullscreen 확대/축소 */
.vid-skin02 .vjs-fullscreen-control{float:right;width:38px;height:38px;background:url(//r.yna.co.kr/www/home_n/v02/img/sprites_video_skin02_ui01.png) -37px -228px no-repeat;cursor:pointer;}
.vid-skin02.vjs-fullscreen .vjs-fullscreen-control{background:url(//r.yna.co.kr/www/home_n/v02/img/sprites_video_skin02_ui01.png) -37px -288px no-repeat;}
.vid-skin02 .vjs-fullscreen-control:before{display:none;content:"";position:absolute;top:14px;left:17px;width:11px;height:11px;background:none;}
.vid-skin02.vjs-fullscreen .vjs-fullscreen-control:before{display:none;content:"";position:absolute;top:14px;left:17px;width:11px;height:11px;background:none;}

/* Fullscreen 확대시 z-index 문제 */
/* .fullscreen-page{overflow-y:hidden !important;}
.fullscreen-page #header{position:relative;z-index:1;}
.fullscreen-page #content{position:relative;z-index:100;}
.fullscreen-page .header-content{position:relative;z-index:1;}
.fullscreen-page .contents{position:relative;z-index:100;}
.fullscreen-page .contents01{position:relative;z-index:100;}
.fullscreen-page .contents02{position:relative;z-index:1;}
.fullscreen-page .article-video{z-index:100;}
.fullscreen-page .btn-top{display:none;}
.fullscreen-page #tmpILSA_Container{display:none !important;}
.fullscreen-page.video-page .title-page01{z-index:90;}
.fullscreen-page.video-page .video-view-zone{z-index:100;} */

/* ---- vid-skin 03 ---- */

/* Poster */
.vjs-default-skin.vid-skin03 .vjs-poster{background-size:cover;}

/* Big Play Button */
.vjs-default-skin.vid-skin03 .vjs-big-play-button{
display:block;position:absolute;left:0;top:0;z-index:10;width:100%;height:100%;cursor:pointer;background:rgba(0,0,0,0);
border:none;-webkit-border-radius:0;-moz-border-radius:none;border-radius:0;
-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;
-webkit-transition:background 0.2s;
-moz-transition:background 0.2s;
-o-transition:background 0.2s;
transition:background 0.2s;}
.vjs-default-skin.vid-skin03 .vjs-big-play-button:before{content:'';overflow:hidden;position:absolute;left:50%;top:50%;width:70px;height:78px;margin:-39px 0 0 -35px;background:url(//r.yna.co.kr/www/home_n/v02/img/sprites_video_skin03_ui01.png) -250px 0px no-repeat;opacity:0.5;
-webkit-transform:scale(0.85);
-ms-transform:scale(0.85);
transform:scale(0.85);
-webkit-transition:all 0.2s;
-moz-transition:all 0.2s;
-o-transition:all 0.2s;
transition:all 0.2s;}
.vjs-default-skin.vid-skin03.vjs-controls-disabled .vjs-big-play-button{display:none;}
.vjs-default-skin.vid-skin03.vjs-has-started .vjs-big-play-button{display:none;}
.vjs-default-skin.vid-skin03.vjs-using-native-controls .vjs-big-play-button{display:none;}
.vjs-default-skin.vid-skin03.vjs-error .vjs-big-play-button{display:none;}
.vjs-default-skin.vid-skin03:hover .vjs-big-play-button,
.vjs-default-skin.vid-skin03 .vjs-big-play-button:focus{background:rgba(0,0,0,0.5);}
.vjs-default-skin.vid-skin03:hover .vjs-big-play-button:before,
.vjs-default-skin.vid-skin03 .vjs-big-play-button:focus:before{opacity:1.0;
-webkit-transform:scale(1.0);
-ms-transform:scale(1.0);
transform:scale(1.0);}

/* Control Bars */
.vid-skin03 .vjs-control-bar{
display:block;position:absolute;bottom:0;left:0;right:0;height:40px;
background-color:#07141e;background-color:rgba(7, 20, 30, 0.7);opacity:0;}
.vid-skin03.vjs-has-started .vjs-control-bar{
visibility:visible;display:block;opacity:1;
-webkit-transition:visibility 0.4s, opacity 0.4s;
-moz-transition:visibility 0.4s, opacity 0.4s;
-o-transition:visibility 0.4s, opacity 0.4s;
transition:visibility 0.4s, opacity 0.4s;}
.vid-skin03.vjs-has-started.vjs-user-inactive.vjs-playing .vjs-control-bar{
visibility:hidden;display:block;opacity:0;
-webkit-transition:visibility 1s, opacity 1s;
-moz-transition:visibility 1s, opacity 1s;
-o-transition:visibility 1s, opacity 1s;
transition:visibility 1s, opacity 1s;}
.vid-skin03.vjs-has-started.vjs-user-inactive.vjs-playing .vjs-control-bar:hover{visibility:visible !important;display:block;opacity:1;}

/* Progress Bars 타임라인 */
.vid-skin03 .vjs-slider{background-color:#8e918b;}
.vid-skin03 .vjs-play-progress{background:#3061ff;}
.vid-skin03 .vjs-progress-control{position:absolute;left:0;right:0;top:17px;width:auto;height:4px;margin-left:124px;margin-right:130px;font-size:0.3em;
-webkit-transition:all 0.4s;
-moz-transition:all 0.4s;
-o-transition:all 0.4s;
transition:all 0.4s;}

/* Progress 핸들러 아이콘 */
.vid-skin03 .vjs-seek-handle{width:4px;height:4px;}
.vid-skin03 .vjs-slider-handle{}
.vid-skin03 .vjs-slider-handle:before{display:none;content:'';position:absolute;top:0;width:4px;height:4px;background:#3061ff;text-shadow:none;color:#3061ff;text-align:center;font-size:0;line-height:0;
-webkit-transform:none;
-moz-transform:none;
-ms-transform:none;
-o-transform:none;
transform:none;}

/* Play/Pause 버튼 */
.vid-skin03 .vjs-play-control{width:38px;height:38px;margin-left:6px;background:url(//r.yna.co.kr/www/home_n/v02/img/sprites_video_skin03_ui01.png) 15px 13px no-repeat;cursor:pointer;}
.vid-skin03 .vjs-play-control:before{display:none;content:'';position:absolute;top:10px;left:9px;width:17px;height:17px;font-size:17px;line-height:17px;text-align:center;text-shadow:none;}
.vid-skin03.vjs-playing .vjs-play-control{background:url(//r.yna.co.kr/www/home_n/v02/img/sprites_video_skin03_ui01.png) 16px -37px no-repeat;}
.vid-skin03.vjs-playing .vjs-play-control:before{display:none;content:'';position:absolute;top:10px;left:9px;width:17px;height:17px;font-size:17px;line-height:17px;text-align:center;text-shadow:none;}

/* 재생 시간 */
.vid-skin03 .vjs-time-controls{width:2.7em;font-size:12px;line-height:3em;}
.vid-skin03 .vjs-current-time{float:left;margin-top:4px;}
.vid-skin03 .vjs-current-time:after{display:none;}
.vid-skin03 .vjs-duration{float:left;margin-top:4px;}
.vid-skin03 .vjs-remaining-time{display:none;float:left;}
.vid-skin03 .vjs-time-divider{float:left;margin-top:4px;line-height:3em;}

/* 볼륨 */
.vid-skin03 .vjs-volume-control{float:right;width:60px;}
.vid-skin03 .vjs-volume-control .vjs-slider{background:url(//r.yna.co.kr/www/home_n/v02/img/sprites_video_skin03_volume01.png) 0 0 repeat-x;}
.vid-skin03 .vjs-volume-bar{width:5em;height:8px;margin:15px auto 0;}

.vid-skin03 .vjs-volume-level{position:absolute;top:0;left:0;width:100%;height:8px;background:url(//r.yna.co.kr/www/home_n/v02/img/sprites_video_skin03_volume01.png) 0 -50px repeat-x;}
/* 2020-09-25 : 영상본문 음소거 설정 작업
 * 음소거상태 일때 videojs 에서 width 5~6% 를 주기 때문에 게이지가 넓이만큼 보이는걸 방지한다.
 * vjs-volume-level의 넓이 값은 넓이에 따라 수치가 달려져 0~7% 까지 대비함 */
.vid-skin03 .vjs-volume-level[style*="width: 0%;"],
.vid-skin03 .vjs-volume-level[style*="width: 1%;"],
.vid-skin03 .vjs-volume-level[style*="width: 2%;"],
.vid-skin03 .vjs-volume-level[style*="width: 3%;"],
.vid-skin03 .vjs-volume-level[style*="width: 4%;"],
.vid-skin03 .vjs-volume-level[style*="width: 5%;"],
.vid-skin03 .vjs-volume-level[style*="width: 6%;"],
.vid-skin03 .vjs-volume-level[style*="width: 7%;"]{background:none;}

.vid-skin03 .vjs-volume-bar .vjs-volume-handle{width:0.5em;height:8px;left:4.5em;}
.vid-skin03 .vjs-volume-handle:before{display:none;top:0;left:0;width:2px;height:8px;background:#3061ff;font-size:4px;}

.vid-skin03 .vjs-mute-control,
.vid-skin03 .vjs-volume-menu-button{float:right;width:38px;height:38px;background:url(//r.yna.co.kr/www/home_n/v02/img/sprites_video_skin03_ui01.png) 14px -92px no-repeat;cursor:pointer;}
.vid-skin03 .vjs-mute-control:before,
.vid-skin03 .vjs-volume-menu-button:before{display:none;content:'';position:absolute;top:14px;left:17px;width:18px;height:14px;}

.vid-skin03 .vjs-mute-control.vjs-vol-0,
.vid-skin03 .vjs-volume-menu-button.vjs-vol-0{background:url(//r.yna.co.kr/www/home_n/v02/img/sprites_video_skin03_ui01.png) 14px -237px no-repeat;}
.vid-skin03 .vjs-mute-control.vjs-vol-1,
.vid-skin03 .vjs-volume-menu-button.vjs-vol-1{background:url(//r.yna.co.kr/www/home_n/v02/img/sprites_video_skin03_ui01.png) 14px -187px no-repeat;}
.vid-skin03 .vjs-mute-control.vjs-vol-2,
.vid-skin03 .vjs-volume-menu-button.vjs-vol-2{background:url(//r.yna.co.kr/www/home_n/v02/img/sprites_video_skin03_ui01.png) 14px -139px no-repeat;}
.vid-skin03 .vjs-mute-control.vjs-vol-3,
.vid-skin03 .vjs-volume-menu-button.vjs-vol-3{background:url(//r.yna.co.kr/www/home_n/v02/img/sprites_video_skin03_ui01.png) 14px -92px no-repeat;}

/* Fullscreen 확대/축소 */
.vid-skin03 .vjs-fullscreen-control{float:right;width:38px;height:38px;background:url(//r.yna.co.kr/www/home_n/v02/img/sprites_video_skin03_ui01.png) -50px -190px no-repeat;cursor:pointer;}
.vid-skin03.vjs-fullscreen .vjs-fullscreen-control{background:url(//r.yna.co.kr/www/home_n/v02/img/sprites_video_skin03_ui01.png) -50px -240px no-repeat;}
.vid-skin03 .vjs-fullscreen-control:before{display:none;content:'';position:absolute;top:14px;left:17px;width:11px;height:11px;background:none;}
.vid-skin03.vjs-fullscreen .vjs-fullscreen-control:before{display:none;content:'';position:absolute;top:14px;left:17px;width:11px;height:11px;background:none;}


/* =============== 오디오 스킨 ======================== */
/* .audio-skin01 : 2014 버전 오디오 스킨 - ASIS PC 국문, 현행 PC 영문 메인 사용
 * .audio-skin02 : [메인] 2019년 버전 오디오 뉴스 - 현행
	└ audio-type01 : (임시) 오디오뉴스 확장형
 * .audio-skin03 : [본문] 2019년 버전 오디오 소재 - 현행 */

/* ---- .audio-skin02 : [메인] 오디오 뉴스 ---- */
.audio-skin02{overflow:hidden;width:100%;height:215px;box-sizing:border-box;background:none;}
.audio-skin02 .vjs-poster{}

/* 시작버튼 */
.audio-skin02 .vjs-big-play-button{overflow:hidden;position:absolute;left:117px;top:66px;z-index:10;width:72px;height:67px;box-sizing:border-box;padding-left:72px;cursor:pointer;background:url(//r.yna.co.kr/www/home_n/v02/img/sprites_audio_ui02.png) -100px 0 no-repeat;
-webkit-transform:scale(0.9306);
-ms-transform:scale(0.9306);
transform:scale(0.9306);
-webkit-transition:-webkit-transform 0.2s;
transition:-webkit-transform 0.2s;
transition:transform 0.2s;
transition:transform 0.2s, -webkit-transform 0.2s;}
.audio-skin02 .vjs-big-play-button:hover{
-webkit-transform:scale(1);
-ms-transform:scale(1);
transform:scale(1);}
.audio-skin02.vjs-has-started .vjs-big-play-button{display:none;}
.audio-skin02 .vjs-big-play-button:before{display:none;}

/* .vjs-control-bar 영역 */
.audio-skin02 .vjs-control-bar{position:static;}
.audio-skin02 .vjs-control{color:#fff;font-size:12px;line-height:16px;letter-spacing:0;cursor:pointer;}
.audio-skin02 .vjs-control .vjs-control-text{overflow:hidden;position:absolute;z-index:-1;width:1px;height:1px;box-sizing:border-box;padding-left:1px;white-space:nowrap;}
/* 재생/일시정지 버튼 */
.audio-skin02 .vjs-play-control{overflow:hidden;display:none;position:absolute;left:117px;top:66px;z-index:10;width:72px;height:67px;box-sizing:border-box;padding-left:72px;cursor:pointer;background:url(//r.yna.co.kr/www/home_n/v02/img/sprites_audio_ui02.png) 0 0 no-repeat;
-webkit-transform:scale(0.9306);
-ms-transform:scale(0.9306);
transform:scale(0.9306);
-webkit-transition:-webkit-transform 0.2s;
transition:-webkit-transform 0.2s;
transition:transform 0.2s;
transition:transform 0.2s, -webkit-transform 0.2s;}
.audio-skin02 .vjs-play-control:hover{
-webkit-transform:scale(1);
-ms-transform:scale(1);
transform:scale(1);}
.audio-skin02 .vjs-play-control.vjs-playing{display:block;}
.audio-skin02 .vjs-play-control.vjs-paused{display:block;background-position:-100px 0;}
/* 재생 상태바 */
.audio-skin02 .vjs-current-time{position:absolute;left:20px;top:156px;}
.audio-skin02 .vjs-time-divider{display:none;}
.audio-skin02 .vjs-duration{position:absolute;right:20px;top:156px;}
.audio-skin02 .vjs-remaining-time{display:none;}
.audio-skin02 .vjs-live-controls{display:none;}
.audio-skin02 .vjs-progress-control{position:absolute;left:20px;right:20px;top:186px;height:4px;border-radius:2px;background:rgba(255,255,255,0.3);}
.audio-skin02 .vjs-load-progress{display:none;}
.audio-skin02 .vjs-play-progress{position:absolute;left:0;top:0;height:100%;border-radius:2px;background:#fff;}
.audio-skin02 .vjs-seek-handle{position:absolute;top:-4px;width:12px;height:12px;border-radius:50%;background:#fff;
-webkit-transform:scale(1);
-ms-transform:scale(1);
transform:scale(1);
-webkit-transition:-webkit-transform 0.2s;
transition:-webkit-transform 0.2s;
transition:transform 0.2s;
transition:transform 0.2s, -webkit-transform 0.2s;}
.audio-skin02 .vjs-seek-handle:hover{-webkit-transform:scale(1.25);
-ms-transform:scale(1.25);
transform:scale(1.25);}
/* 음량 */
.audio-skin02 .vjs-volume-control{position:absolute;right:16px;top:16px;width:70px;height:4px;border-radius:2px;background:rgba(255,255,255,0.3);}
.audio-skin02 .vjs-volume-level{position:absolute;left:0;top:0;height:100%;border-radius:2px;background:#fff;}
.audio-skin02 .vjs-volume-handle{position:absolute;top:-4px;width:12px;height:12px;border-radius:50%;background:#fff;
-webkit-transform:scale(1);
-ms-transform:scale(1);
transform:scale(1);
-webkit-transition:-webkit-transform 0.2s;
transition:-webkit-transform 0.2s;
transition:transform 0.2s;
transition:transform 0.2s, -webkit-transform 0.2s;}
.audio-skin02 .vjs-volume-handle:hover{-webkit-transform:scale(1.25);
-ms-transform:scale(1.25);
transform:scale(1.25);}
.audio-skin02 .vjs-mute-control{overflow:hidden;position:absolute;right:89px;top:12px;width:11px;height:12px;background:url(//r.yna.co.kr/www/home_n/v02/img/sprites_audio_ui02.png) 0 -200px no-repeat;}
.audio-skin02 .vjs-mute-control.vjs-vol-0{width:17px;background-position-y:-150px;}
.audio-skin02 .vjs-mute-control.vjs-vol-1{}
.audio-skin02 .vjs-mute-control.vjs-vol-2{}
.audio-skin02 .vjs-mute-control.vjs-vol-3{}
/* 영상관련 버튼 */
.audio-skin02 .vjs-fullscreen-control{display:none;}
.audio-skin02 .vjs-playback-rate,
.audio-skin02 .vjs-subtitles-button,
.audio-skin02 .vjs-captions-button,
.audio-skin02 .vjs-chapters-button{display:none;}

/* 재생오류 시, 에러표출 */
.audio-skin02 .vjs-error-display{}

/* ---- .audio-skin03 : [본문] 오디오 소재 ---- */
.audio-skin03{overflow:hidden;width:100%;box-sizing:border-box;padding-left:40px;height:45px;box-sizing:border-box;background:none;}
.audio-skin03 .vjs-poster,
.audio-skin03 .vjs-text-track-display,
.audio-skin03 .vjs-loading-spinner{display:none}

/* 시작버튼 */
.audio-skin03 .vjs-big-play-button{overflow:hidden;position:absolute;left:0;top:0;z-index:10;width:24px;height:30px;box-sizing:border-box;padding-left:24px;cursor:pointer;background:url(//r.yna.co.kr/www/home_n/v02/img/sprites_audio_ui03.png) -100px 0 no-repeat;}
.audio-skin03 .vjs-big-play-button:hover{}
.audio-skin03.vjs-has-started .vjs-big-play-button{display:none;}
.audio-skin03 .vjs-big-play-button:before{display:none;}

/* .vjs-control-bar 영역 */
.audio-skin03 .vjs-control-bar{position:static;}
.audio-skin03 .vjs-control{color:#000;font-size:14px;line-height:20px;letter-spacing:0;cursor:pointer;}
.audio-skin03 .vjs-control .vjs-control-text{overflow:hidden;position:absolute;z-index:-1;width:1px;height:1px;box-sizing:border-box;padding-left:1px;white-space:nowrap;}
/* 재생/일시정지 버튼 */
.audio-skin03 .vjs-play-control{overflow:hidden;display:none;position:absolute;left:0;top:0;z-index:10;width:24px;height:30px;box-sizing:border-box;padding-left:24px;cursor:pointer;background:url(//r.yna.co.kr/www/home_n/v02/img/sprites_audio_ui03.png) 0 0 no-repeat;}
.audio-skin03 .vjs-play-control:hover{}
.audio-skin03 .vjs-play-control.vjs-playing{display:block;}
.audio-skin03 .vjs-play-control.vjs-paused{display:block;background-position:-100px 0;}
/* 재생 상태바 */
.audio-skin03 .vjs-current-time{position:absolute;left:42px;bottom:0;}
.audio-skin03 .vjs-time-divider{display:none;}
.audio-skin03 .vjs-duration{position:absolute;right:2px;bottom:0;}
.audio-skin03 .vjs-remaining-time{display:none;}
.audio-skin03 .vjs-live-controls{display:none;}
.audio-skin03 .vjs-progress-control{position:absolute;left:42px;right:2px;top:13px;height:4px;border-radius:2px;background:rgba(0,0,0,0.15);}
.audio-skin03 .vjs-load-progress{display:none;}
.audio-skin03 .vjs-play-progress{position:absolute;left:0;top:0;height:100%;border-radius:2px;background:#000;}
.audio-skin03 .vjs-seek-handle{position:absolute;top:-4px;width:12px;height:12px;border-radius:50%;background:#000;
-webkit-transform:scale(1);
-ms-transform:scale(1);
transform:scale(1);
-webkit-transition:-webkit-transform 0.2s;
transition:-webkit-transform 0.2s;
transition:transform 0.2s;
transition:transform 0.2s, -webkit-transform 0.2s;}
.audio-skin03 .vjs-seek-handle:hover{-webkit-transform:scale(1.25);
-ms-transform:scale(1.25);
transform:scale(1.25);}
/* 음량 */
.audio-skin03 .vjs-volume-control,
.audio-skin03 .vjs-volume-level,
.audio-skin03 .vjs-volume-handle,
.audio-skin03 .vjs-mute-control{display:none;}

/* 영상관련 버튼 */
.audio-skin03 .vjs-fullscreen-control{display:none;}
.audio-skin03 .vjs-playback-rate,
.audio-skin03 .vjs-subtitles-button,
.audio-skin03 .vjs-captions-button,
.audio-skin03 .vjs-chapters-button{display:none;}

/* 재생오류 시, 에러표출 */
.audio-skin03 .vjs-error-display{}


/* ---- .audio-type01 : [메인] 오디오 뉴스 ---- */
.audio-type01{overflow:hidden;position:relative;border-top:4px solid #3061ff;background:url(//r.yna.co.kr/www/home_n/v02/img/bg_audio_main01.jpg) 50% 0 no-repeat;}
.audio-type01 .tit-audio{position:absolute;left:15px;top:10px;z-index:10;font-weight:bold;color:#fff;font-size:16px;line-height:20px;}
.audio-type01 .audio-con{width:100%;height:288px;background:rgba(33,57,137,0.7);
-webkit-transition:background 0.3s;
transition:background 0.3s;}
.audio-type01:hover .audio-con{background:rgba(33,57,137,0.9);}
.audio-type01 [class*='btn-']{overflow:hidden;display:inline-block;box-sizing:border-box;border:none;background-color:transparent;color:inherit;font:inherit;line-height:normal;vertical-align:top;white-space:nowrap;cursor:pointer;}

/* 오디오 뉴스 기사 제목 */
.audio-type01 .tit-wrap{position:absolute;left:0;bottom:0;z-index:1;width:100%;height:73px;box-sizing:border-box;padding:13px 60px 0 15px;background:#213989;}
.audio-type01 .tit-wrap .title-news{overflow:hidden;max-height:36px;box-sizing:border-box;padding-right:2px;color:#fff;font-size:13px;line-height:18px;}

/* 재생목록 열기 */
.audio-type01 .btn-audio-list-open{position:absolute;right:5px;bottom:24px;z-index:10;}
.audio-type01 .btn-audio-list-open.hide{display:none;}
.audio-type01 .btn-audio-list-open>span{overflow:hidden;position:relative;width:37px;height:36px;box-sizing:border-box;padding-left:37px;white-space:nowrap;}
.audio-type01 .btn-audio-list-open>span:after{content:'';overflow:hidden;position:absolute;left:15px;top:3px;width:7px;height:31px;background:url(//r.yna.co.kr/www/home_n/v02/img/sprites_audio_ui02.png) -100px -150px no-repeat;}
/* 재생목록 닫기 */
.audio-type01 .btn-audio-list-close{position:absolute;right:5px;bottom:5px;}
.audio-type01 .btn-audio-list-close>span{overflow:hidden;position:relative;width:34px;height:34px;box-sizing:border-box;padding-left:34px;white-space:nowrap;}
.audio-type01 .btn-audio-list-close>span:after{content:'';overflow:hidden;position:absolute;left:9px;top:9px;width:16px;height:16px;background:url(//r.yna.co.kr/www/home_n/v02/img/sprites_audio_ui02.png) -150px -150px no-repeat;}

/* 재생목록 */
.audio-type01 .audio-list{display:none;position:absolute;left:0;bottom:0;z-index:10;width:100%;height:100%;box-sizing:border-box;padding:22px 44px 0 15px;background:#213989;}
.audio-type01 .audio-list li+li{margin-top:17px;}
.audio-type01 .audio-list li a{position:relative;padding-left:16px;color:#fff;font-size:13px;line-height:18px;}
.audio-type01 .audio-list li a:hover{text-decoration:underline;}
.audio-type01 .audio-list li.on a{}
.audio-type01 .audio-list li .ico-play{overflow:hidden;position:absolute;left:0;top:3px;width:10px;height:11px;background:url(//r.yna.co.kr/www/home_n/v02/img/sprites_audio_ui02.png) -50px -150px no-repeat;}
.audio-type01 .audio-list li .ico-stop{display:none;}

/* 이전/다음 목록 재생 */
.audio-type01 .btn-audio-prev,
.audio-type01 .btn-audio-next{position:absolute;top:93px;z-index:10;width:32px;height:20px;box-sizing:border-box;padding-left:32px;white-space:nowrap;background:url(//r.yna.co.kr/www/home_n/v02/img/sprites_audio_ui02.png) 0 -100px no-repeat;
-webkit-transform:scale(0.8125);
-ms-transform:scale(0.8125);
transform:scale(0.8125);
-webkit-transition:-webkit-transform 0.2s;
transition:-webkit-transform 0.2s;
transition:transform 0.2s;
transition:transform 0.2s, -webkit-transform 0.2s;}
.audio-type01 .btn-audio-prev{left:15px;}
.audio-type01 .btn-audio-next{right:15px;background-position-x:-50px;}
.audio-type01 .btn-audio-prev:hover,
.audio-type01 .btn-audio-next:hover{transform:scale(1);}