/*
customVideoSlide
IR ver 1.6
*/

#customVideoSlide{
 margin: 0 auto 30px !important;
 padding: 0px;
 position: relative;
 width: 100%;
 background:#faebe8;
}

/* TOPページバナーの背景色 */
#customVideoSlide.slideClass1{
 background:#ffffff;
}

#customVideoSlide.slideClass2{
 background:#faebe8;
}

#customVideoSlide.slideClass3{
 background:#969696;
}

#customVideoSlide.slideClass4{
 background:#053b93;
}

#customVideoSlide .thumAreaSp{
 display: none;
}
#customVideoSlide .slideArea,
#customVideoSlide .slideArea .thumArea *{
 margin: 0px;
 padding: 0px;
}
#customVideoSlide .slideArea{
 width: 1000px;
 height:355px;
 margin: 0 auto !important;
 position: relative;
 overflow: hidden;
 display:block;
}
#customVideoSlide .slideArea .slide img{
 width: 100%;

 display: none;
}
#customVideoSlide .slideArea .this img{
 display: block;
}
#customVideoSlide .slideArea .slide{
 top: 0px;
 left: 0px;
 position: absolute;
 z-index: 1;
 opacity: 0;
 background: #fff;
}
#customVideoSlide .slideArea .slide.video,
#customVideoSlide .slideArea .slide.movie{
 background: #000;
}
#customVideoSlide .slideArea .this{
 opacity:1;
 z-index: 2;
 display: block;
}
#customVideoSlide .thumArea{
 width:100%;
 margin:0 auto;
 position: relative;
 background:#fff;
 border-top:1px solid #ddd;
}
#customVideoSlide .carousel .leftBorder{
 display: block;
 content: "";
 border-left: solid 1px #ccc;
 position: absolute;
 left: 0px;
 z-index: 3;
}
#customVideoSlide .carousel .rightBorder{
 display: block;
 content: "";
 border-left: solid 1px #ccc;
 position: absolute;
 right: 0px;
 z-index: 3;
}
#customVideoSlide .carousel .thumAreaInner{
 position: absolute;
}
#customVideoSlide .thumAreaInner{
 display: table;
 table-layout: fixed;
 width: 708px;
 margin:0 auto;
 padding:0 295px 0 0;
 z-index: 3;
}
#customVideoSlide .thumArea .thum:first-child{
 border-left:solid 1px #ccc;
}
#customVideoSlide .thumArea .thum{
 cursor: pointer;
 display: table-cell;
 *float:left;
 vertical-align: middle;
 border-top:solid 1px #ccc;
 border-right:solid 1px #ccc;
 border-bottom:solid 2px #ccc;
 background: #efefef;
 padding: 15px;
 *padding: 0px;
 line-height: 1.5em;
 box-sizing: border-box;
 font-size: 12px;
 font-weight: bold;
 color: #4d4d4d;
}
#customVideoSlide .thumArea .this{
 background: #cee5f3;
 position: relative;
}
#customVideoSlide .thumArea .this:after{
 position: absolute;
 content: "";
 display: block;
 top: -10px;
 left: 50%;
 margin-left: -5px;
 border-bottom: solid 10px #ccc;
 border-left: solid 10px transparent;
 border-right: solid 10px transparent;
 z-index: 2;
}
#customVideoSlide .thumArea .this:before{
 position: absolute;
 content: "";
 display: block;
 top: -9px;
 left: 50%;
 margin-left: -5px;
 border-bottom: solid 10px #cee5f3;
 border-left: solid 10px transparent;
 border-right: solid 10px transparent;
 z-index: 3;
}
#customVideoSlide .leftBtn{
 position: absolute;
 left: 0px;
 bottom: -10px;
 cursor: pointer;
}
#customVideoSlide .rightBtn{
 position: absolute;
 right: 0px;
 bottom: -10px;
 cursor: pointer;
}
#customVideoSlide .ctrBtn{
 width:980px;
 margin:0 auto;
 position: relative;
 z-index: 3;
 padding: 0;
 text-align: right;
 font-size: 14px;
 display: none;
 background:#fff;
}
#customVideoSlide .ctrBtn #circleTimer{
 display: inline-block;
 vertical-align: middle;
}
#customVideoSlide .ctrBtnView{
 display: block;
}
#customVideoSlide .ctrBtn .inner{
 width:260px;
 margin:0 auto;
 cursor: pointer;
 display: inline-block;
 *display:inline;
 *zoom:1;
 min-width: 162px;
 text-align: left;
 *padding-left: 20px;
 position:absolute;
 top:-55px;
 right:0;
 z-index:9999;
}
#customVideoSlide .startBtn .inner{
 background: url("../images/index/slide1_start.gif") no-repeat 11px 10px;
}
#customVideoSlide .stopBtn .inner{
 background: url("../images/index/slide1_stop.gif") no-repeat 10px 10px;
}

#customVideoSlide .ctrBtn .inner .circle_wrapper,
#customVideoSlide .ctrBtn .inner .start,
#customVideoSlide .ctrBtn .inner .stop{
 display: inline-block;
 *display: inline;
 *zoom:1;
 vertical-align: middle;
 *vertical-align: top;
}

@media screen and (max-width: 767px) {
.slidewrap{
  height:100%;
}
 #customVideoSlide{
  width: 100%;
  height: auto;
  margin:0 auto 10px !important;
  background: #fff;
  display:block;
 }
 #customVideoSlide .slideArea {
  width:100%; 
  height:1px;
  margin:0;
  display:block;
  border-bottom:1px solid #ddd;
  position:static;

 }
 #customVideoSlide .slideArea .slide img {
  width:100%; 
  display: block;
 }
 #customVideoSlide .thumArea{
  display: none;
 }
 #customVideoSlide .thumAreaSp{
  width:100%; 
  display: block;
  text-align: center;
  float:left;
  border-top:1px solid #ddd;
  /*padding: 2%;*/
 }
 
 
 #customVideoSlide .thumAreaSp .thum:first-child{
  border:none;
 }
 #customVideoSlide .thumAreaSp .thum{
  cursor: pointer;
  display: inline-block;
  border:none;
  background: #efefef;
  padding: 5px;
  background: #ddd;
  border-radius:10px;
  -webkit-border-radius:10px;
  -moz-border-radius:10px;
  display: inline-block;
  width: 20px !important;
  height: 20px !important;
  margin: 8px;
 }
 #customVideoSlide .thumAreaSp .this{
  background: #000066;
 }
 #customVideoSlide .thumAreaSp .thum:before,
 #customVideoSlide .thumAreaSp .thum:after{
  display: none;
 }
 #customVideoSlide .thumAreaSp .thum .txt{
  display: none;
 }
 #customVideoSlide .ctrBtnView{
  display: none;
 }
 #customVideoSlide .ctrBtn{
  display: none;
 }
}