@import url(controller_m4.css);


/* CSS Document */
html { -webkit-text-size-adjust: none; }
* {
	font-family: 'Noto Sans KR';
	-webkit-text-size-adjust: none;
}
html.mobile * {
	outline: none;
}
#footerSet{
	position: absolute;
	display:block;
	width: 100%;
	height:39px;
	left:0px;
	top: 0px;
}

#footer.off #footerSet {
	top: 31px;
	height: 9px;
}

html.mobile.def #footerSet{
	height:60px;
}

html.mobile.def #footer.off #footerSet {
	height:60px;
	top: 60px;
}

#footerSet_bg{
	position: absolute;
	display:block;
	width: 100%;
	height:39px;
	left:0px;
	opacity: 0.8;
	filter: alpha(opacity=80);
    z-index: 0;
}

html.mobile.def.ct2 #footer.off, html.mobile.def.ct2 #footer.off #footerSet {
	height: 20px;
}
html.mobile.def.ct2 #footer.off #jogbar {
    top: -60px;
}
html.mobile.def.ct2 #footer.off {
    top: -92px;
}

html.mobile.def #footerSet_bg{
	height:60px;
}

.controlSet{
	
}

#controller{
	position:relative;

	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;

	z-index: 1;
}

.controlBtn{
	cursor:pointer;
	text-indent: -1000em;
}
.controlBtn.dis{
	cursor:default;
}



.control_box_left {
	text-align: left;
	position: relative;
    /* width: 535px; */
	width: 100%;
    float: left;
}

.control_box_right {
	text-align: right;
	position: relative;
    float: right;
    width: 60%;
}

html.mobile .control_box_right {
    width: 100%;
	float: left;
	top: -4px;
}

.buffered {
	margin-top: -10px;
	height: 10px;
	position: relative;
	background: transparent;
	width: 100%;
    pointer-events: none;
	z-index: 1;

	overflow: hidden;
}

html.mobile.def .buffered {
	margin-top: -13px;
	height: 13px;
}

#buffered-amount {
	display: block;
	height: 100%;

	width: 0;
}

#logo{
	display:block;
	background: url(../img/main/controlbar_ci.png) right center no-repeat;
	width: 142px;
	height: 39px;
    position: relative;
    float: left;
	text-indent: -9999px;
}

html.mobile #logo{
	display: none;
}

#time{
	color:#dadada;
	font-size:16px;
	letter-spacing: 1px;
	position: relative;
	width:auto;
	float: left;
	top: 12px;
	margin-left: 15px;
	display:block;
	font-family: 'Noto Sans KR';
	-webkit-font-smoothing:antialiased;
	-moz-font-smoothing:antialiased;
	font-smoothing:antialiased;
}
html.mobile.def #time{
	font-size:16px;
	line-height: 15px;
	top: 28px;
	left: 0px;
	position: absolute;
}

#playBtn, #scriptBtn, #replayBtn, #pauseBtn, #lockBtn {
	width:30px;
	height: 30px;
	position: relative;
	border:0px;
    top: 1px;

	-webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
}

html.mobile #playBtn, html.mobile #scriptBtn, html.mobile #replayBtn, html.mobile #pauseBtn, html.mobile #lockBtn {
	position: absolute;
    top: 6px;
}

#lockBtn {
	display: none;

	background-color: transparent;
	background-image: url('data:image/svg+xml;charset=utf8;base64,PHN2ZyAgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgd2lkdGg9IjE0cHgiIGhlaWdodD0iMTlweCI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiAgZmlsbD0icmdiKDIxOCwgMjE4LCAyMTgpIiBkPSJNMTIuMjcyLDE5LjAwMCBMMS43MjgsMTkuMDAwIEMwLjc3NCwxOS4wMDAgLTAuMDAwLDE4LjIxOCAtMC4wMDAsMTcuMjUzIEwtMC4wMDAsOS43NDAgQy0wLjAwMCw4Ljc3NSAwLjc3NCw3Ljk5MyAxLjcyOCw3Ljk5MyBMMS43NzIsNy45OTMgTDEuNzcyLDUuMzI5IEMxLjc3MiwyLjM5MCA0LjEzNiwtMC4wMDAgNy4wNDMsLTAuMDAwIEM4LjQ0NiwtMC4wMDAgOS43NTQsMC40OTMgMTAuNzI3LDEuMzg3IEMxMS43NTEsMi4zMjkgMTIuMzE1LDMuNjM2IDEyLjMxNSw1LjA2NyBDMTIuMzE1LDUuNzkwIDExLjczNCw2LjM3NyAxMS4wMTgsNi4zNzcgQzEwLjMwMyw2LjM3NyA5LjcyMiw1Ljc5MCA5LjcyMiw1LjA2NyBDOS43MjIsMy40NjEgOC4zNzUsMi42MjEgNy4wNDMsMi42MjEgQzUuNTY2LDIuNjIxIDQuMzY0LDMuODM1IDQuMzY0LDUuMzI5IEw0LjM2NCw3Ljk5MyBMMTIuMjcyLDcuOTkzIEMxMy4yMjYsNy45OTMgMTQuMDAwLDguNzc1IDE0LjAwMCw5Ljc0MCBMMTQuMDAwLDE3LjI1MyBDMTQuMDAwLDE4LjIxOCAxMy4yMjYsMTkuMDAwIDEyLjI3MiwxOS4wMDAgWk03LjAwMCwxMC42MTQgQzYuMTc1LDEwLjYxNCA1LjUwNCwxMS4yOTIgNS41MDQsMTIuMTI2IEM1LjUwNCwxMi43MDYgNS44MjYsMTMuMjI2IDYuMzM0LDEzLjQ4MSBMNS43NDcsMTYuMzc1IEM1LjczOSwxNi40MTUgNS43NDksMTYuNDU3IDUuNzc1LDE2LjQ4OSBDNS44MDEsMTYuNTIxIDUuODM5LDE2LjU0MCA1Ljg4MCwxNi41NDAgTDguMDc3LDE2LjU1NCBDOC4wNzgsMTYuNTU0IDguMDc4LDE2LjU1NCA4LjA3OCwxNi41NTQgQzguMTU0LDE2LjU1NCA4LjIxNSwxNi40OTIgOC4yMTUsMTYuNDE2IEM4LjIxNSwxNi40MDMgOC4yMTMsMTYuMzkxIDguMjEwLDE2LjM3OSBMNy42MjAsMTMuNTAzIEM4LjE0OSwxMy4yNTkgOC40OTYsMTIuNzIwIDguNDk2LDEyLjEyNiBDOC40OTYsMTEuMjkyIDcuODI1LDEwLjYxNCA3LjAwMCwxMC42MTQgWiIvPjwvc3ZnPg==');
	background-position: center center;
	background-repeat: no-repeat;
}
#lockBtn:hover {

}
#lockBtn.on {
	background-color: transparent;
	background-image: url('data:image/svg+xml;charset=utf8;base64,PHN2ZyAgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgd2lkdGg9IjE0cHgiIGhlaWdodD0iMTlweCI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiAgZmlsbD0icmdiKDIxOCwgMjE4LCAyMTgpIiBkPSJNMTIuMjcyLDE4LjAwMCBMMS43MjgsMTguMDAwIEMwLjc3NCwxOC4wMDAgLTAuMDAwLDE3LjIyNyAtMC4wMDAsMTYuMjczIEwtMC4wMDAsOC44NDkgQy0wLjAwMCw3Ljg5NSAwLjc3NCw3LjEyMiAxLjcyOCw3LjEyMiBMMS44NTgsNy4xMjIgTDEuODU4LDUuMTA2IEMxLjg1OCwyLjI5MCA0LjE1MSwtMC4wMDAgNi45NjksLTAuMDAwIEM5Ljc4NywtMC4wMDAgMTIuMDgwLDIuMjkwIDEyLjA4MCw1LjEwNiBMMTIuMDgwLDcuMTIyIEwxMi4yNzIsNy4xMjIgQzEzLjIyNiw3LjEyMiAxNC4wMDAsNy44OTUgMTQuMDAwLDguODQ5IEwxNC4wMDAsMTYuMjczIEMxNC4wMDAsMTcuMjI3IDEzLjIyNiwxOC4wMDAgMTIuMjcyLDE4LjAwMCBaTTUuNzg0LDE1LjQ5NyBDNS43NzYsMTUuNTM2IDUuNzg2LDE1LjU3NiA1LjgxMSwxNS42MDcgQzUuODM2LDE1LjYzOCA1Ljg3MywxNS42NTYgNS45MTMsMTUuNjU2IEw4LjA0NiwxNS42NjkgQzguMDQ2LDE1LjY2OSA4LjA0NiwxNS42NjkgOC4wNDcsMTUuNjY5IEM4LjEyMCwxNS42NjkgOC4xNzksMTUuNjEwIDguMTc5LDE1LjUzNyBDOC4xNzksMTUuNTI1IDguMTc3LDE1LjUxMyA4LjE3NCwxNS41MDEgTDcuNjAyLDEyLjc0MiBDOC4xMTUsMTIuNTA4IDguNDUyLDExLjk5MiA4LjQ1MiwxMS40MjIgQzguNDUyLDEwLjYyMiA3LjgwMSw5Ljk3MSA3LjAwMCw5Ljk3MSBDNi4xOTksOS45NzEgNS41NDgsMTAuNjIyIDUuNTQ4LDExLjQyMiBDNS41NDgsMTEuOTc4IDUuODYwLDEyLjQ3NyA2LjM1MywxMi43MjEgTDUuNzg0LDE1LjQ5NyBaTTkuNTY2LDUuMTA2IEM5LjU2NiwzLjY3NSA4LjQwMSwyLjUxMSA2Ljk2OSwyLjUxMSBDNS41MzcsMi41MTEgNC4zNzIsMy42NzUgNC4zNzIsNS4xMDYgTDQuMzcyLDcuMTIyIEw5LjU2Niw3LjEyMiBMOS41NjYsNS4xMDYgWiIvPjwvc3ZnPg==');
	background-position: center center;
	background-repeat: no-repeat;
}
#lockBtn.on:hover {

}

#playBtn {
    margin: 0 0px 0 0;
    top: 2px;

	background-color: transparent;
	background-image: url('data:image/svg+xml;charset=utf8;base64,PHN2ZyAgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgd2lkdGg9IjE1cHgiIGhlaWdodD0iMThweCI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiAgZmlsbD0icmdiKDIxOCwgMjE4LCAyMTgpIiBkPSJNMTQuOTM2LDkuMDAwIEwwLjgzMCwtMC4wMDAgTDAuODMwLDE3Ljk5OSBMMTQuOTM2LDkuMDAwIFoiLz48L3N2Zz4=');
	background-position: center center;
	background-repeat: no-repeat;
}

#replayBtn{
    margin: 0 5px 0 0;
    top: 2px;

	background-color: transparent;
	background-image: url('data:image/svg+xml;charset=utf8;base64,PHN2ZyAgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgd2lkdGg9IjIycHgiIGhlaWdodD0iMTlweCI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiAgZmlsbD0icmdiKDIxOCwgMjE4LCAyMTgpIiBkPSJNMTYuMDAwLDE1LjAwMCBMOC4wMDAsMTUuMDAwIEw4LjAwMCwxMi4wMDAgTDE2LjAwMCwxMi4wMDAgQzE2LjAwMCwxMi4wMDAgMTguNjc5LDEyLjU2MCAxOS4wMDAsOS4wMDAgTDE5LjAwMCw2LjAwMCBDMTkuMDAwLDYuMDAwIDE4LjY4NiwzLjU2NCAxNi4wMDAsMy4wMDAgTDUuMDAwLDMuMDAwIEw1LjAwMCwtMC4wMDAgTDE2LjAwMCwtMC4wMDAgQzE2LjAwMCwtMC4wMDAgMjIuMDAwLDAuMzg5IDIyLjAwMCw2LjAwMCBMMjIuMDAwLDkuMDAwIEMyMi4wMDAsOS4wMDAgMjAuOTU5LDE1LjAwMCAxNi4wMDAsMTUuMDAwIFpNOC4wMDAsMTkuMDAwIEwtMC4wMDAsMTMuNTAwIEw4LjAwMCw4LjAwMCBMOC4wMDAsMTkuMDAwIFoiLz48L3N2Zz4=');
	background-position: center center;
	background-repeat: no-repeat;
}
#scriptBtn{

    margin: 0 14px 0 0;
	background-color: transparent;
	background-image: url('data:image/svg+xml;charset=utf8;base64,PHN2ZyAgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgd2lkdGg9IjE4cHgiIGhlaWdodD0iMTVweCI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiAgZmlsbD0icmdiKDIxOCwgMjE4LCAyMTgpIiBkPSJNLTAuMDAwLDE1LjAwMCBMLTAuMDAwLDEyLjAwMCBMMTguMDAwLDEyLjAwMCBMMTguMDAwLDE1LjAwMCBMLTAuMDAwLDE1LjAwMCBaTS0wLjAwMCwtMC4wMDAgTDE4LjAwMCwtMC4wMDAgTDE4LjAwMCwzLjAwMCBMLTAuMDAwLDMuMDAwIEwtMC4wMDAsLTAuMDAwIFpNMTYuMDAwLDkuMDAwIEwtMC4wMDAsOS4wMDAgTC0wLjAwMCw2LjAwMCBMMTYuMDAwLDYuMDAwIEwxNi4wMDAsOS4wMDAgWiIvPjwvc3ZnPg==');
	background-position: center center;
	background-repeat: no-repeat;
}

html.mobile.def #playBtn, html.mobile.def #scriptBtn, html.mobile.def #replayBtn, html.mobile.def #pauseBtn, html.mobile.def #lockBtn {
    transform-origin: 0% 0%;
    transform: scale(1.2);
}
html.mobile #lockBtn {
	display: block;
}
html.mobile.def #lockBtn {
	left: 0px;
}
html.mobile.def #playBtn {
	right: 50px;
}
html.mobile.def #scriptBtn {
    left: 105px;
}
html.mobile.def #replayBtn {
	right: 80px;
}

#muteBtn{
	width:27px;
	height: 30px;
	position: relative;
	border:0px;
    margin: 0px -12px 0 0;
    top: 1px;
	background-color: transparent;
	background-image: url('data:image/svg+xml;charset=utf8;base64,PHN2ZyAgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgd2lkdGg9IjE0cHgiIGhlaWdodD0iMTlweCI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiAgZmlsbD0icmdiKDIxOCwgMjE4LCAyMTgpIiAgZD0iTTAuODU3LDIuNDM3IEw2LjAwMCwyLjQzNyBMMTAuMjg2LC0wLjAwMCBMMTEuMTQzLC0wLjAwMCBMMTIuMDAwLDAuODEyIEwxMi4wMDAsMTIuMTg3IEwxMS4xNDMsMTMuMDAwIEwxMC4yODYsMTMuMDAwIEw2LjAwMCwxMC41NjIgTDAuODU3LDEwLjU2MiBMLTAuMDAwLDkuNzUwIEwtMC4wMDAsMy4yNTAgTDAuODU3LDIuNDM3IFoiLz48L3N2Zz4=');
	background-position: left 80%;
	background-repeat: no-repeat;

	-webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;

}

html.mobile.def #muteBtn{
    transform-origin: 0% 0%;
    transform: scale(1.5);
	right: 195px;
    position: absolute;
}


#playBtn:hover{	}
#replayBtn:hover{	}
#scriptBtn:hover{	}
#muteBtn:hover{	}

#scriptBtn.on, #scriptBtn.on:hover {

}

#muteBtn.mute{
	background-color: transparent;
	background-image: url('data:image/svg+xml;charset=utf8;base64,PHN2ZyAgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgd2lkdGg9IjI0cHgiIGhlaWdodD0iMTlweCI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiAgZmlsbD0icmdiKDIxOCwgMjE4LCAyMTgpIiAgZD0iTTAuODU3LDIuNDM3IEw2LjAwMCwyLjQzNyBMMTAuMjg2LC0wLjAwMCBMMTEuMTQzLC0wLjAwMCBMMTIuMDAwLDAuODEyIEwxMi4wMDAsMTIuMTg3IEwxMS4xNDMsMTMuMDAwIEwxMC4yODYsMTMuMDAwIEw2LjAwMCwxMC41NjIgTDAuODU3LDEwLjU2MiBMLTAuMDAwLDkuNzUwIEwtMC4wMDAsMy4yNTAgTDAuODU3LDIuNDM3IFpNMTYuMjg2LDIuNDM4IEwxOC44NTcsNC44NzUgTDE5LjcxNCw0Ljg3NSBMMjIuMjg2LDIuNDM4IEwyNC4wMDAsNC4wNjIgTDIxLjQyOSw2LjUwMCBMMjEuNDI5LDcuMzEzIEwyNC4wMDAsOS43NTAgTDIyLjI4NiwxMS4zNzUgTDE5LjcxNCw4LjkzNyBMMTguODU3LDguOTM3IEwxNi4yODYsMTEuMzc1IEwxNC41NzEsOS43NTAgTDE3LjE0Myw3LjMxMyBMMTcuMTQzLDYuNTAwIEwxNC41NzEsNC4wNjIgTDE2LjI4NiwyLjQzOCBaIi8+PC9zdmc+');
	background-position: left 80%;
	background-repeat: no-repeat;
}

#muteBtn.mute:hover{

}

#playBtn.pause{
	background-color: transparent;
	background-image: url('data:image/svg+xml;charset=utf8;base64,PHN2ZyAgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgd2lkdGg9IjE1cHgiIGhlaWdodD0iMThweCI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiAgZmlsbD0icmdiKDIxOCwgMjE4LCAyMTgpIiBkPSJNMTAuNSwxNi41di0xNWg0djE1SDEwLjV6IE0wLjUsMS41aDR2MTVoLTRWMS41eiIvPjwvc3ZnPg==');
	background-position: center center;
	background-repeat: no-repeat;
}
#playBtn.pause:hover{

}

#prevBtn{
    border: 0px;
    width: 57px;
    height: 30px;
    position: relative;
	top: 1px;
    margin: 0px -32px 0 0;
    z-index: 2;
	background-color: transparent;

	-webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
}

#prevBtn .i1 {
    position: absolute;
    top: 0;
    right: 0px;
	width: 100%;
	height: 100%;
	z-index: 1;

	background-color: transparent;
	background-image: url('data:image/svg+xml;charset=utf8;base64,PHN2ZyAgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgd2lkdGg9IjhweCIgaGVpZ2h0PSI3cHgiPjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgIGZpbGw9InJnYigyNTUsIDI1NSwgMjU1KSIgZD0iTTQuMjA4LDAuMTg0IEM2LjAwMywwLjE4NCA3LjQ1OCwxLjY2OSA3LjQ1OCwzLjUwMCBDNy40NTgsNS4zMzEgNi4wMDMsNi44MTYgNC4yMDgsNi44MTYgQzIuNDEzLDYuODE2IDAuOTU4LDUuMzMxIDAuOTU4LDMuNTAwIEMwLjk1OCwxLjY2OSAyLjQxMywwLjE4NCA0LjIwOCwwLjE4NCBaIi8+PC9zdmc+');
	background-position: 23% center;
	background-repeat: no-repeat;

	-webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
}
#prevBtn .i2 {
    position: absolute;
    top: 0;
    right: 0px;
	width: 100%;
	height: 100%;

	background-color: transparent;
	background-image: url('data:image/svg+xml;charset=utf8;base64,PHN2ZyAgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgd2lkdGg9IjEzcHgiIGhlaWdodD0iMjFweCI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiAgZmlsbD0icmdiKDIxOCwgMjE4LCAyMTgpIiBkPSJNMTIuMDcxLDQuODU1IEw2LjUzOCwxMC41MDAgTDEyLjA3MSwxNi4xNDUgQzEzLjIyNSwxNy4zMjIgMTMuMzAzLDE5LjE1MSAxMi4yNDUsMjAuMjMwIEMxMS4xODgsMjEuMzA5IDkuMzk1LDIxLjIzMCA4LjI0MSwyMC4wNTIgTDEuMTQzLDEyLjgxMSBDMS4wMDYsMTIuNzE4IDAuODc1LDEyLjYxNSAwLjc1NSwxMi40OTMgQzAuMjM2LDExLjk2NCAtMC4wMDYsMTEuMjUzIDAuMDE1LDEwLjUyOCBDMC4wMTQsMTAuNTE5IDAuMDE0LDEwLjUwOSAwLjAxMywxMC41MDAgQzAuMDE0LDEwLjQ5MSAwLjAxNCwxMC40ODEgMC4wMTUsMTAuNDcyIEMtMC4wMDYsOS43NDcgMC4yMzYsOS4wMzYgMC43NTUsOC41MDcgQzAuODc1LDguMzg1IDEuMDA2LDguMjgyIDEuMTQzLDguMTg5IEw4LjI0MSwwLjk0OCBDOS4zOTUsLTAuMjMwIDExLjE4OCwtMC4zMDkgMTIuMjQ1LDAuNzcwIEMxMy4zMDMsMS44NDkgMTMuMjI1LDMuNjc4IDEyLjA3MSw0Ljg1NSBaIi8+PC9zdmc+');
	background-position: 23% center;
	background-repeat: no-repeat;

	-webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
}


#nextBtn {
    border: 0px;

    width: 57px;
    height: 30px;
    position: relative;
    top: 1px;

    z-index: 2;

	background-color: transparent;

	-webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
}

#nextBtn .i1 {
    position: absolute;
    top: 0;
    right: 0px;
	width: 100%;
	height: 100%;
	z-index: 1;

	background-color: transparent;
	background-image: url('data:image/svg+xml;charset=utf8;base64,PHN2ZyAgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgd2lkdGg9IjhweCIgaGVpZ2h0PSI3cHgiPjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgIGZpbGw9InJnYigyNTUsIDI1NSwgMjU1KSIgZD0iTTQuMjA4LDAuMTg0IEM2LjAwMywwLjE4NCA3LjQ1OCwxLjY2OSA3LjQ1OCwzLjUwMCBDNy40NTgsNS4zMzEgNi4wMDMsNi44MTYgNC4yMDgsNi44MTYgQzIuNDEzLDYuODE2IDAuOTU4LDUuMzMxIDAuOTU4LDMuNTAwIEMwLjk1OCwxLjY2OSAyLjQxMywwLjE4NCA0LjIwOCwwLjE4NCBaIi8+PC9zdmc+');
	background-position: 69% center;
	background-repeat: no-repeat;

	-webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
}
#nextBtn .i2 {
    position: absolute;
    top: 0;
    right: 0px;
	width: 100%;
	height: 100%;

	background-color: transparent;
	background-image: url('data:image/svg+xml;charset=utf8;base64,PHN2ZyAgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgd2lkdGg9IjEzcHgiIGhlaWdodD0iMjFweCI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiAgZmlsbD0icmdiKDIxOCwgMjE4LCAyMTgpIiBkPSJNMTIuOTg3LDEwLjUwMCBDMTIuOTg2LDEwLjUwOSAxMi45ODYsMTAuNTE5IDEyLjk4NSwxMC41MjggQzEzLjAwNiwxMS4yNTMgMTIuNzY0LDExLjk2NCAxMi4yNDUsMTIuNDkzIEMxMi4xMjUsMTIuNjE1IDExLjk5MywxMi43MTggMTEuODU3LDEyLjgxMSBMNC43NTksMjAuMDUyIEMzLjYwNSwyMS4yMzAgMS44MTIsMjEuMzA5IDAuNzU1LDIwLjIzMCBDLTAuMzAzLDE5LjE1MSAtMC4yMjUsMTcuMzIyIDAuOTI5LDE2LjE0NSBMNi40NjEsMTAuNTAwIEwwLjkyOSw0Ljg1NSBDLTAuMjI1LDMuNjc4IC0wLjMwMywxLjg0OSAwLjc1NSwwLjc3MCBDMS44MTIsLTAuMzA5IDMuNjA1LC0wLjIzMCA0Ljc1OSwwLjk0OCBMMTEuODU3LDguMTg5IEMxMS45OTMsOC4yODIgMTIuMTI1LDguMzg0IDEyLjI0NSw4LjUwNyBDMTIuNzY0LDkuMDM2IDEzLjAwNiw5Ljc0NyAxMi45ODUsMTAuNDcyIEMxMi45ODYsMTAuNDgxIDEyLjk4NiwxMC40OTEgMTIuOTg3LDEwLjUwMCBaIi8+PC9zdmc+');
	background-position: 69% center;
	background-repeat: no-repeat;

	-webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
}

#prevBtn:hover{}
#nextBtn:hover{}

html.mobile.def #prevBtn{
    transform-origin: 0% 0%;
    transform: scale(1.5);
    right: 187px;
    position: absolute;
    top: -3px;
}
html.mobile.def #nextBtn{
    transform-origin: 0% 0%;
    transform: scale(1.5);
    right: 30px;

    position: absolute;
    top: -3px;
}

#jogbar_block{
	display: none;
	width: 300px;
	width: 30%;
	padding: 0 0px;

	height: 15px;

	position: absolute;
	top:30px;
	z-index:9;

  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}
#jogbar_block.on{
	display: block;
}

#jogbar * {
	-webkit-transition-duration: 0s; /* Safari */
    transition-duration: 0s;
}

#jogbar{
	display: block;
	width: 30%;
	padding: 0 0px;

	height: 10px;

    position: relative;
    top: 15px;
    float: left;
	margin: 0 0 0 22px;

	cursor:pointer;

  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}
#jogProgress_bg{
	display: block;
	width: 100%;
	height: 10px;

	position: relative;

    margin-top: -10px;
    z-index: 1;
	cursor:pointer;
}
html.mobile.def #jogProgress_bg {
	height: 13px;
    margin-top: -13px;

}
#jogProgress{
	display: block;
	width:250px;
	height: 10px;

	position: absolute;

	top:0px;
    z-index: 2;
	cursor:pointer;

  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}
html.mobile.def #jogProgress {
	height: 13px;
}

#jogbtn{
	display: block;
	width:10px;
	height: 10px;
	cursor: pointer;

	position: relative;
	left:0%;
	top:0px;
	z-index:2;

  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}

#control_box {
    position: absolute;
    margin: 0px 0 0 0;
    width: 100%;
    height: auto;
}

#footer.off #control_box {

}

#footer.off #footerSet_bg {

}

html.mobile #jogbar{
	width: 100%;
	left: 0;
	margin: 0;
}

html.mobile.def #jogbar_block{
	top: 0px;
	height:13px;
}

html.mobile.def #jogbar{
	top: 0px;
	height:13px;
}
html.mobile.def #jogProgress_bg{

}
html.mobile.def #jogProgress{

}

html.mobile.def #control_box {
    margin: 18px 0 0 0;
}

html.mobile.def #jogbtn{
	height: 13px;
}

/* volume*/
#volJogBar_con{
	display: inline-block;
	width: 55px;
	height: 5px;
}
#volJogBar * {
	-webkit-transition-duration: 0s; /* Safari */
    transition-duration: 0s;
}
#volJogBar{
	display: inline-block;
	width:32px;
	height: 5px;
	position: relative;
    margin: 0px 23px 0px 0;
    top: -2px;

  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}

html.mobile.def #volJogBar{
    right: 135px;
    top: -120px;
    position: absolute;
}
html.mobile.def #slider-vertical{
	top: 0px;
	left: -17px;
}

/* pc - ??????*/
.ui-slider-horizontal.ui-widget.ui-widget-content {
	display: block;
	width:39px;
	height: 6px;

	border-radius: 0;
}

.ui-slider-horizontal .ui-slider-range-min {

}

.ui-slider-horizontal .ui-state-default {
	display: block;
	width: 6px;
	height: 16px;
	cursor: pointer;
    margin: 0 0px 0 0px;

	border-radius: 0;
}

/* mobile - ????? */
.ui-slider-vertical.ui-widget.ui-widget-content {
	display: block;
	width: 12px;
	height: 100px;

	border-radius: 0;
}

.ui-slider-vertical .ui-slider-range-min {

}

.ui-slider-vertical .ui-state-default {
	display: block;
	width: 30px;
	height: 12px;
	cursor: pointer;
    margin: 0 0px 0 -4px;
	border-radius: 0;
}

.vol_slider_bg {
    width: 150px;
    height: 130px;
    position: absolute;
    top: -10px;
    left: -68px;
}

.volJogProgress{
	display: block;
	width:30px;
	height: 6px;

	position: absolute;
	left: -1px;
	top: -1px;


  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}
html.mobile.def .volJogProgress{
    bottom: 0;
    width: 100%;
    top: initial;
    left: initial;
}

.volJogbtn{
	display: block;
	width:8px;
	height: 17px;
	cursor: pointer;
	position: absolute;
	top:-5px;left:0%;

}
html.mobile.def .volJogbtn {
    width: 100%;
	background: none;
    top: initial;
    left: initial;
}

/* page num*/
#paging {
	z-index: 1;
    position: relative;
    display: inline-block;
}

#pageNum {
    display: inline-block;
    margin: 0 -29px 0 0;
}

#currentNum {
	display:block;
	
	border:0px solid #FF0000;
	width:38px;
	height:24px;

	margin:0px;
	padding:0px 0 0 0;
	text-align: center;
	text-indent: 0;
	
	cursor: default;
	color:#3ec9f4;
	font-size: 20.43px;
	line-height: 26px;
	
	position: relative;
	display:block;
    top: 8px;
    margin: 0 1px 0 0;
	float: left;
	z-index: 1;

	font-family: 'itc_avant_garde_gothicbook';
	font-weight: normal;
	-webkit-user-select: none;  /* Chrome all / Safari all */
	-moz-user-select: none;     /* Firefox all */
	-ms-user-select: none;      /* IE 10+ */
	user-select: none;          /* Likely future */  
}
#pageLine{
	display:block;
	width:1px;
	height: 10px;
	position: relative;
	float: left;
    top: 15px;
    margin: 0 1px 0 0;
	z-index: 1;

	background-color: transparent;
	background-image: url('data:image/svg+xml;charset=utf8;base64,PHN2ZyAgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgd2lkdGg9IjFweCIgaGVpZ2h0PSIxMHB4Ij48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiICBmaWxsPSJyZ2IoMjE4LCAyMTgsIDIxOCkiIGQ9Ik0tMC4wMDAsLTAuMDAwIEwxLjAwMCwtMC4wMDAgTDEuMDAwLDEwLjAwMCBMLTAuMDAwLDEwLjAwMCBMLTAuMDAwLC0wLjAwMCBaIi8+PC9zdmc+');
	background-position: center center;
	background-repeat: no-repeat;
}
#totalNum{
	display:block;
	
	border:0px solid #FF0000;
	width:38px;
	height:24px;

	margin:0px;
	padding:0px 0 0 0;
	text-align: center;
	text-indent: 0;
	
	cursor: default;
	color:#dadada;
	font-size: 20.43px;
	line-height: 26px;
	position: relative;
	display:block;
	float: left;
	top: 8px;
	z-index: 1;

	font-family: 'itc_avant_garde_gothicbook';
	font-weight: normal;
	-webkit-user-select: none;  /* Chrome all / Safari all */
	-moz-user-select: none;     /* Firefox all */
	-ms-user-select: none;      /* IE 10+ */
	user-select: none;          /* Likely future */  
}

html.ie11 #currentNum, html.ie10 #currentNum, html.ie9 #currentNum, 
html.ie11 #totalNum, html.ie10 #totalNum, html.ie9 #totalNum
{
	top: 6px;
}

#paging .n1{
	background-position-x:0;
}
#paging .n2{
	background-position-x:-38px;
}
#paging .n3{
	background-position-x:-76px;
}
#paging .n4{
	background-position-x:-114px;
}
#paging .n5{
	background-position-x:-152px;
}
#paging .n6{
	background-position-x:-190px;
}
#paging .n7{
	background-position-x:-228px;
}
#paging .n8{
	background-position-x:-266px;
}
#paging .n9{
	background-position-x:-304px;
}
#paging .n10{
	background-position-x:-342px;
}
#paging .n11{
	background-position-x:-380px;
}
#paging .n12{
	background-position-x:-418px;
}
#paging .n13{
	background-position-x:-456px;
}
#paging .n14{
	background-position-x:-494px;
}
#paging .n15{
	background-position-x:-532px;
}
#paging .n16{
	background-position-x:-570px;
}
#paging .n17{
	background-position-x:-608px;
}
#paging .n18{
	background-position-x:-646px;
}
#paging .n19{
	background-position-x:-684px;
}
#paging .n20{
	background-position-x:-722px;
}


html.mobile.def #currentNum {
    transform-origin: 0% 0%;
    transform: scale(1.5);
	right: 134px;
	top: 1px;
    position: absolute;
}
html.mobile.def #pageLine {
    transform-origin: 0% 0%;
    transform: scale(1.5);
    right: 111px;
    top: 11px;
    position: absolute;
}
html.mobile.def #totalNum {
    transform-origin: 0% 0%;
    transform: scale(1.5);
	right: 69px;
	top: 1px;
    position: absolute;
}


.on{
	background-position-y:-44px;
}

.cha_ani {
	width: 102px;
	height: 120px;
	position:absolute;
	right: -50px;
	top: -37px;
	background-size: 100% 100%;
}

#popClosing2{
	display: block;
	border:0px;
	width:63px;
	height: 63px;
	position: absolute;
	left:100%;
	top:38px;
	cursor: pointer;
	margin-left: -63px;
}
#popClosing2:hover{
}


#popClosing{
	display: block;
	border:0px;
	width:112px;
	height: 32px;
	position: absolute;
	left:889px;
	top:0px;
	cursor: pointer;
}

#popClosing:hover{
}


html.mobile .player_fullscreen_btn {
}

.player_fullscreen_btn {
    position: relative;
    width: 32px;
    height: 32px;
	margin-right: 5px;

    top: 1px;
	cursor:pointer;
	border: none;
	background-color: transparent;
	background-image: url('data:image/svg+xml;charset=utf8;base64,PHN2ZyAgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgd2lkdGg9IjIwcHgiIGhlaWdodD0iMjBweCI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiAgZmlsbD0icmdiKDIxOCwgMjE4LCAyMTgpIiAgZD0iTTIwLjAwMCwxMy4wMDAgQzIwLjAwMCwxNi44MDAgMjAuMDAwLDIwLjAwMCAyMC4wMDAsMjAuMDAwIEMyMC4wMDAsMjAuMDAwIDE2LjgzMSwyMC4wMDAgMTMuMDAwLDIwLjAwMCBMMTMuMDAwLDE4LjAwMCBDMTUuNzgwLDE4LjAwMCAxOC4wMDAsMTguMDAwIDE4LjAwMCwxOC4wMDAgQzE4LjAwMCwxOC4wMDAgMTguMDAwLDE1Ljc3MyAxOC4wMDAsMTMuMDAwIE03LjAwNywyMC4wMDAgQzMuMTgyLDIwLjAwMCAtMC4wMDAsMjAuMDAwIC0wLjAwMCwyMC4wMDAgQy0wLjAwMCwyMC4wMDAgLTAuMDAwLDE2LjgyNSAtMC4wMDAsMTMuMDAwIEwyLjAwMCwxMy4wMDAgQzIuMDAwLDE1Ljc4MyAyLjAwMCwxOC4wMDAgMi4wMDAsMTguMDAwIEMyLjAwMCwxOC4wMDAgNC4yMTMsMTguMDAwIDcuMDAwLDE4LjAwMCBMNy4wMDcsMjAuMDAwIFpNLTAuMDAwLDcuMDAwIEMtMC4wMDAsMy4xNzAgLTAuMDAwLC0wLjAwMCAtMC4wMDAsLTAuMDAwIEw3LjAwNSwtMC4wMDAgTDcuMDAwLDIuMDAwIEM0LjIyNywyLjAwMCAyLjAwMCwyLjAwMCAyLjAwMCwyLjAwMCBDMi4wMDAsMi4wMDAgMi4wMDAsNC4yMDUgMi4wMDAsNy4wMDAgTC0wLjAwMCw3LjAwMCBaTTEzLjAwNywtMC4wMDAgQzE2LjgyNiwtMC4wMDAgMjAuMDAwLC0wLjAwMCAyMC4wMDAsLTAuMDAwIEwyMC4wMDAsNy4wMDAgTDE4LjAwMCw3LjAwMCBMMTguMDAwLDIuMDAwIEMxOC4wMDAsMi4wMDAgMTUuNzkyLDIuMDAwIDEzLjAwMCwyLjAwMCBMMTMuMDA3LC0wLjAwMCBaIi8+PC9zdmc+');
	background-position: center center;
	background-repeat: no-repeat;
	text-indent: -9999px;

	-webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
}
.player_fullscreen_btn:hover {

}

html.mobile.def .player_fullscreen_btn {
    transform-origin: 0% 0%;
    transform: scale(1.2);
    right: 5px;
	top: 4px;
	position: absolute;
}

.blank-viewer{
	position:absolute; 
	top:0; 
	bottom:0; 
	left:0;
	right:0;
	width:100%;
	height:100%;
	max-height:100%;
	border:0;
	text-align:center;
	background:url('../img/blank.png') no-repeat;
}
.bg2 .blank-viewer{
	z-index: 9;
}

.overico_play {
	width:62px;
	height:62px;
	background:url('../img/play_overico.png') no-repeat;
	position:absolute;
	top:50%;
	left:50%;
	margin:-31px 0 0 -31px;
	display:none;
}
.overico_pause {
	width:62px;
	height:62px;
	background:url('../img/pause_overico.png') no-repeat;
	position:absolute;
	top:50%;
	left:50%;
	margin:-31px 0 0 -31px;
	display:none;
}

.nav-svg-fill {
    fill: #fff
}

.nav-bezel {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 52px;
    height: 52px;
    z-index: 19;
    margin-left: -26px;
    margin-top: -26px;
    background: rgba(0,0,0,.5);
    border-radius: 26px;
    -moz-animation: nav-bezel-fadeout .5s linear 1 normal forwards;
    -webkit-animation: nav-bezel-fadeout .5s linear 1 normal forwards;
    animation: nav-bezel-fadeout .5s linear 1 normal forwards;
    pointer-events: none
}

.nav-big-mode .nav-bezel {
    width: 78px;
    height: 78px;
    margin-left: -39px;
    margin-top: -39px;
    border-radius: 39px
}

.nav-bezel-icon {
    width: 36px;
    height: 36px;
    margin: 8px
}

.nav-big-mode .nav-bezel-icon {
    width: 54px;
    height: 54px;
    margin: 12px
}

@keyframes nav-bezel-fadeout {
    0% {
        opacity: 1
    }

    to {
        opacity: 0;
        transform: scale(2)
    }
}

.rate {

	width:38px;
	height:24px;

}

.player_rate.off .rate.on {


}

.player_rate.on .rate.on {

}

.player_rate_over { 
	display:none;
	position:absolute;
    bottom: -5px;
	width:45px;
	height:140px;
	z-index:5;
	overflow:hidden;
    margin: -69px 0 0 0;
}

html.mobile .player_rate_over {
	display:none;
	position:absolute;
	bottom: -5px;
	width:45px;
	height:148px;
	z-index:5;
	overflow:hidden;
	margin: -69px 0 0 0;
}

.player_rate_over.off {
	display:none;

}
.player_rate_over.on {
	display:block;
	background:url('../img/main/view_icon6.png') 0 0 repeat-y;

}

.player_rate_over ul { 
	list-style:none;
    margin: 5px 0 0 0;
    padding: 0px;

	color:#fff;

    font-size: 0.9em;
    font-weight: normal;

	cursor:pointer;
	text-align:center;
}
.player_rate_over ul li { 
	padding:2px 0px;
	opacity: 1.0;
	line-height: 15px;
}
.player_rate_over ul li:hover { 
	font-weight:normal;

	opacity: 1;
}

.control .player_rate{
	position:relative;
	padding:0;
	top:0px;
    margin-left: 3px;
	display:block;
}

#controller .player_rate-dummy
 {
	display: inline-block;
	width:45px;
	height:22px;
	margin: 0px 5px 0 0;
	background:none;
	position:relative;
	top:6px;
	z-index: 2;
}

html.mobile.def #controller .player_rate-dummy
{
	display: inline-block;
	width:45px;
	height:22px;
	margin: 0px 5px 0 0;
	background:none;
	position:absolute;
	top:4px;
	z-index: 2;
}

#controller.type2 .player_rate-dummy
 {
	width:45px;
	height:22px;
	margin: 0px 0 0 0;
	background:none;
	position:relative;
	top:8px;
	float: right;
}

html.mobile.def #controller .player_rate-dummy {
    transform-origin: 0% 0%;
    transform: scale(1.2);
    right: 120px;
    top: 8px;
}

.player_rate-dummy2 {
    position: absolute;
    top: 0;
    left: 4px;
    z-index: 9;
}

#controller .rate{
    padding: 0 0 0 0;
    text-align: center;
	display:inline-block;
	font-size:0.9em;
    line-height: 23px;
	font-weight:normal;
	cursor:pointer;
	display:none;
}

html.mobile #controller .rate{
	font-size:0.8em;
	line-height: 22px;
}

.lms_b1 {
	background: #ffffff;
    font-size: 16px;
    font-weight: 700;
    color: #606060;
    letter-spacing: -1px;
    text-align: center;
    border-radius: 5px;
    padding: 0px 5px 1px 5px;
    line-height: 22px;
    text-indent: 0;
    border: none;

  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}

.lms_b1:hover {
	background: #d26708;
    color: #fff;
}

#bt_0 {
    position: absolute;
    right: 124px;
    top: 4px;
}

#bt_1 {
    position: absolute;
	right: 307px;
    top: 4px;
}
#bt_2 {
    position: absolute;
    right: 222px;
    top: 4px;
}
#bt_3 {
    position: absolute;
    right: 124px;
    top: 4px;
}

#bt_0 {
	display: none;
}

html.mobile.def #bt_0 {
	display: block;
    transform-origin: 0% 0%;
    transform: scale(1.5);
    right: 285px;
	top: 7px;
}

html.mobile.def .lms_set {
    position: absolute;
    bottom: 115px;
	width: 110px;
    right: 278px;
    padding: 10px 10px;
    background: #818181;
    border-radius: 10px;
    z-index: 2;
	display: none;

    transform-origin: 0% 0%;
    transform: scale(1.5);
}

html.mobile.def .lms_set.on {
	display:block;
}

html.mobile.def .lms_set #bt_1 {
	position:relative;
	left: 0;
	top: 0;
	margin-bottom: 10px;
}
html.mobile.def .lms_set #bt_2 {
	position:relative;
	left: 0;
	top: 0;
	margin-bottom: 10px;
}
html.mobile.def .lms_set #bt_3 {
	position:relative;
	left: 0;
	top: 0;
}


html.mobile.full #bt_0 {
	display: block;
    right: 125px;
	top: 3px;
}

html.mobile.full .lms_set {
    position: absolute;
    bottom: 2px;
    width: 110px;
    right: 96px;
    padding: 10px 10px;
    background: #818181;
    border-radius: 10px;
    z-index: 1;
	display: none;
}

html.mobile.full .lms_set.on {
	display:block;
}

html.mobile.full .lms_set #bt_1 {
	position:relative;
	left: 0;
	top: 0;
	margin-bottom: 10px;
}
html.mobile.full .lms_set #bt_2 {
	position:relative;
	left: 0;
	top: 0;
	margin-bottom: 10px;
}
html.mobile.full .lms_set #bt_3 {
	position:relative;
	left: 0;
	top: 0;
}


html.mobile.full .player_fullscreen_btn {
    right: 209px;
}

html.mobile.full #controller .player_rate-dummy {
    right: 257px;
}

html.mobile.full .volJogProgress {
    bottom: 0;
    width: 100%;
    top: initial;
    left: initial;
}
html.mobile.full .volJogbtn {
    width: 100%;
	background: none;
	background-color: #d26708;
    top: initial;
    left: initial;
}

html.mobile.full #time {
    top: 5px;
    left: 170px;
}

.s_time {
	margin-top: -10px;
    height: 10px;
    position: relative;
    background: transparent;
    width: 100%;
    z-index: 2;
}
.s_time .i_time {
	width: 15px;
	height: 10px;
	position: absolute;
	bottom: 0;
}
.s_time .i_time .e1 {
	width: 5px;
	height: 10px;
	margin: 0 0 0 5px;
	background: #f62459;
}
.s_time .i_time:hover {

}
.s_time .i_time:hover .e1 {
	background: #f62459;
}

.s_time .t_1 {
	left: 17.0%;
}
.s_time .t_2 {
	left: 68.2%;
}


#jogbar .icon span {
	background: #fff;
	color: #222;
	font-size: 14px;
	font-weight: bold;
	position:  absolute;
	bottom: 0;
	left: -18px;
	right: -25px;
	padding: 5px 7px;
	visibility: hidden;
	opacity: 0;

	white-space: nowrap;
	word-break: keep-all;
	width: auto;
	display: table;

	-webkit-transition: all .4s;
	-moz-transition: all .4s;
	transition: all .4s;
}

#jogbar .icon span:before {
  content: '';
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 5px solid #fff;
  position: absolute;

  bottom: -5px;
  left: 20px;
}

#jogbar .icon:hover span {
	bottom: 20px;
	visibility: visible;
	opacity: 1;
}


/* Hover through the icons */
#jogbar .icon.c1:hover {
  background-color: #4183d7; 
  color: #bfbfbf;
}

#jogbar .icon.c1 span {
  color: #4183d7;
}

#jogbar .icon.c2:hover {
  background-color: #19b5fe;
  color: #fff;
}

#jogbar .icon.c2 span {
  color: #19b5fe;
}

#jogbar .icon.c3:hover {
  background-color: #000;
  color: #fff;
}

#jogbar .icon.c3 span {
  color: #000;
}

#jogbar .icon.c4:hover {
/*  background-color: #f62459;
  color: #fff; */
}

#jogbar .icon.c4 span {
  color: #f62459;
}

#jogbar .icon.c5:hover {
  background-color: #f22613;
  color: #fff;
}

#jogbar .icon.c5 span {
  color: #f22613;
}