.spectable { width: 100%; margin: 0 auto 80px auto; border:none; border-collapse:collapse;}
.spectable caption { font-size: 24px; color: #FFFFFF; margin-bottom:8px; background-color:#00c8b4; line-height:42px; }


.spectable thead { text-align: center; font-size: 24px; color: rgb(164,164,164); }
.spectable tr { border-bottom: 1px solid rgba(0,200,180,0.5); }
.spectable th { width: 32%; font-weight: normal; font-size: 110%; color: rgb(164,164,164); text-align: right; padding-right: 0.5em; }
.spectable th:after { content: "●"; color: #00b49b; padding-left: 0.5em; }
.spectable td { padding: 0.4em 0; }
.spectable dt { display: inline; margin-right: 0.5em; font-weight: normal; color: #00b49b; }
.spectable dd { display: inline; margin-left: 0;  }
.spectable dd:after { content: "\A"; white-space: pre; }
.spectable li:before { content: "- "; color: #00b49b; }
.spectable + div.note {  margin: -60px 0 40px 0; }
.spectable + div.note p ,
.spectable + div.note dl
{ margin-bottom: 0.5em; color: rgb(128,128,128); }

.sub-cap {
border-top:#00c8b4 solid 3px;
}

.hakase_cmt {
  font-size:1.1rem;line-height: 0px;padding-top:10px;
}
.hakase_cmt img{
  float:left;
  width:20px;
  height:auto;
}

.hakase{
position: relative;
display: inline-block;
vertical-align: top;
margin-bottom: 10px;
padding: 0.9em 0.5em;
background-color: rgba(0,200,180,0.25);
border-radius: 0.5em;
}
.hakase_cmt .hakase {
  display:block;
  margin-left:30px;
padding: 0.5em;
  line-height:1.2;
}

.hakase::after{
position: absolute;
top: 1.25em;
content: "";
width: 0;
height: 0;
pointer-events: none;
margin-top: -8px;
border: solid transparent;
}

.hface::after{
right: 100%;
border-right-color: rgba(0,200,180,0.25);
border-width: 4px 8px;
}

.hface{
margin-right: 20px; 
}

@media screen and (max-width: 767px) {
.spectable th, .spectable td {
display:block;
width:100%;
text-align:left;
}

.spectable th { background-color:#F4F4F4; padding:0.3em 0; color:#484848; }
.spectable th:after { content: "";}
.spectable th:before { content: "●"; color: #00b49b; padding:0 0.5em;}

}
.note dt {
font-weight:bold;
}

.more{display:inline-block;
margin-bottom:12px;
background-color:#00b49b;
border:#00b49b solid 1px;
color:#FFFFFF;
text-align:center;
line-height:2.4;
letter-spacing:normal;
-webkit-transition: all .3s;
transition: all .3s;
width:200px;
text-align:center;

}
.more:hover{
background-color:#FFFFFF;
color:#00b49b;
}

.videolist{
  letter-spacing:-.4em;
  text-align:center;}

.videolist li{
display: inline-block;
width:23%;
min-width:200px;
margin: 0 1%;
padding: 0 0 2em 0;
vertical-align: top;
letter-spacing: normal;
text-align:center;
}
.videolist li .txt-box{
  text-align:left;
  line-height:1.2;
}
.videolist li .ph-box {
  width:100%!important;
}
.cg{
float: left;
padding-right: 0.3em;
display: inline-block;
width: auto;
margin: 2px 2px 0 0;
padding: 3px 0.5em;
color: #FFF;
font-size: 9px;
line-height: 1;
letter-spacing: normal;
background-color: #3b2f28;
word-wrap: normal;
border-radius: 2px;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
}