@charset "utf-8";

#videoBoxHead .captionDate{
	display:flex;
	padding: 10px 6px 8px 3px;
	line-height: 1.5em;
}

#videoBoxHead .captionDate p{
  background:none;
  margin: 0 0 0 auto;
  white-space: nowrap;
  font-size: 12px;
  color: #999;
}

#videoBox h3{
	padding:12px 6px 0;
}

#videoBox > p{
	margin:6px;
	padding:10px;
	background:#000;
}

#videoBox > p img{
	display:block;
	width:60%;
	margin:0 auto 6px;
}


#videoBox > p a{
	display:block;
	padding:10px;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	box-sizing:border-box;

	width:60%;
	margin:0 auto 10px;
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
	border-radius:4px;

	border:1px solid rgba(255,255,255,0.7);
	text-align:center;
	color:rgba(255,255,255,0.7);
}



#videoBox footer nav{
	margin:12px 6px 6px;
	padding:6px;
	background:#ebeced;

	-moz-border-radius:4px;
	-webkit-border-radius:4px;
	border-radius:4px;
}

#videoBox footer li{
	border-bottom:1px solid #d2d2d2;
}

#videoBox footer li:last-child { border-bottom:none; }

#videoBox ol a{
	display:flex;
	margin:2px 0;
	padding:6px 6px 6px 2em;
	position:relative;
	font-weight:bold;
	cursor:pointer;
	font-weight:bold;
	color:#333;
	line-height: 1.5em;
}

#videoBox ol a span{
  display:block;
}

#videoBox ol a span:first-child{
  margin-right:10px;
}

#videoBox ol a span:last-child{
  margin: 0 0 0 auto;
  white-space: nowrap;
  font-size: 12px;
  color: #999;
}

#videoBox ol a[href]{
	font-weight:normal;
	color:#011B8F;
}

#videoBox ol a:before {
	content:"1";
	display:block;
	width:1.3em;
	height:1.3em;
	line-height:1.3;
	text-align:center;
	position:absolute;
	left:0;
	top:6px;
	font-size:13px;
	border:1px solid #ccc;
	background:#D3E2EF;
}

#videoBox ol a[href]:before{ background:#fff; }

#videoBox ol li:nth-child(1) a:before { content:"1"; }
#videoBox ol li:nth-child(2) a:before { content:"2"; }
#videoBox ol li:nth-child(3) a:before { content:"3"; }
#videoBox ol li:nth-child(4) a:before { content:"4"; }
#videoBox ol li:nth-child(5) a:before { content:"5"; }
#videoBox ol li:nth-child(6) a:before { content:"6"; }
#videoBox ol li:nth-child(7) a:before { content:"7"; }
#videoBox ol li:nth-child(8) a:before { content:"8"; }
#videoBox ol li:nth-child(9) a:before { content:"9"; }
#videoBox ol li:nth-child(10) a:before { content:"10"; }
#videoBox ol li:nth-child(11) a:before { content:"11"; }
#videoBox ol li:nth-child(12) a:before { content:"12"; }
#videoBox ol li:nth-child(13) a:before { content:"13"; }
#videoBox ol li:nth-child(14) a:before { content:"14"; }
#videoBox ol li:nth-child(15) a:before { content:"15"; }
#videoBox ol li:nth-child(16) a:before { content:"16"; }
#videoBox ol li:nth-child(17) a:before { content:"17"; }
#videoBox ol li:nth-child(18) a:before { content:"18"; }
#videoBox ol li:nth-child(19) a:before { content:"19"; }
#videoBox ol li:nth-child(20) a:before { content:"20"; }


#videoBox ol strong{
    display:inline-block;
    font-size:10px;
    line-height: 1;
    margin: 0 4px 0 0;
    padding: 4px;
	background-color: #c00;
    color:rgba(255,255,255,1);
    position: relative;
    top: -2px;

	-moz-border-radius:2px;
	-webkit-border-radius:2px;
	border-radius:2px;

}

#video {
    position:relative;
}
#video_el {
    display:block;
    width:100%;
}
#video_play{
    position:absolute;
    z-index:1;
    width:100%;
    height:100%;
    background:transparent url(../../images/smartphone/play-icon.png) no-repeat center center;
    top:50%;
    left:50%;
    transform:translate(-50%, -50%);
    cursor:pointer;
    opacity:0.9;
}
#video .message:before{
	content:"\26d4";
	font-size:26px;
	margin-right:5px;
	vertical-align:middle;
}
#video .message{
	display:flex;
	justify-content:center;
	align-items: center;
	font-size:14px;
	width:100%;
	height:14em;
	background-color:#eee;
}

#relBox h2 {
  padding: 8px 6px 6px;
  background: #a1a1a1;
  font-size: 16px;
  color: #fff;
}