@charset "utf-8";

/*LIST*/

#wrap ul {
  max-width:1000px;
  margin:30px auto;
}
.systemlist li{
   width:100%;
   overflow:hidden;
   margin-bottom:10%;
   }

.systemlist li:last-child{
   margin-bottom:0px;
   }

.systemlist li h3{
font-size: 2.4rem;
line-height:1.4;
margin-bottom:2%;
}
.systemlist li h3 span{
font-size: 1.1rem;
display: inline-block;
vertical-align: middle;
margin-left:7px;
}

.systemlist li.notes h3{
	font-size: 1.1rem;
	margin-top: 40px;
}

.systemlist .comment {
	clear: both;
	padding: 4% 0 2.6%;
}

/*COURSE LIST*/

.systemlist table {
  	font-size:1.4rem;
  	border:#e5b986 1px solid;
    width:100%;
  }
  .systemlist table th {
  	padding:1% 0;
  }
  .systemlist table th:first-child {
  }

  .systemlist table tr {
  	text-align: center;
  }
  .systemlist table td:first-child {
  }
  .systemlist table td {
  	padding:1.5% 0;
  	border-top: 1px solid #e5b986;
  	border-bottom:1px solid #e5b986;
  	border-left: 1px solid #e5b986;
  }

  .systemlist table tr:last-child td {
  	border-bottom:0;
  }

  .systemlist table tr:hover td {
  	background: #271103;
  }



.systemlist dl {
    font-size: 1.6rem;
    overflow: hidden;
    padding: 2% 0 1.4%;
    text-align: left;
    width:50%;
    float:left;
    border-bottom: 1px solid #ccc;
    /* margin-right:1%; */
}

.systemlist dt {
    float: left;
    width:40%;
    text-align:center;
}

.systemlist dd {
    float: left;
    width: 58%;
    text-align:right;
}

.systemlist dt span,
.systemlist dd span {
	font-size: 1.4rem;
	margin-left:3px;
}

.systemlist dt span.system_cancel {
	display: block;
	font-size: 1.1rem;
}

.playlist {
    font-size: 1.5rem;
    line-height:1.5;
    margin: 15px 0 10px;
    /*text-align:center;*/
}

.systemlist .oplist{
 margin:30px auto 20px;
  }

.systemlist .oplist dl {
    font-size: 1.2rem;
    overflow: hidden;
    text-align: left;
    box-sizing: border-box;
    width: 100%;
    float:none;
    padding: 0%;

}

.systemlist .oplist dt {
    float: left;
    width: 18%;
    /* font-weight: bold; */
    /*border-top: 1px solid #5ac9ec;*/
    padding:1.5% 1%;
    text-align: center;
    /* color: #C90000; */
    font-size:1.6rem;
}

.systemlist .oplist dd {
    float: left;
    width: 76%;
    padding:1.5% 1%;
    text-align: left;
}

.caution{
  text-align:center;
  font-size: 1rem;
  margin-top:15px;
}


@media screen and (max-width: 768px) {

  .systemlist table {
    	font-size:1.1rem;
    }

.systemlist .oplist dl{
    font-size: 1.1rem;
    margin:auto;
}
.systemlist .oplist dt {
    float: none;
    width: 98%;
    padding:2% 1% 0.5% 1%;
    text-align: left;
    font-size:1.4rem;
}
.systemlist .oplist dd {
    float: none;
    width: 98%;
    padding:0.5% 1% 2% 1%;
    border:none;
    font-size:1.1rem;
}

}





.set{
 margin:1% auto 4%;
 width:90%;
 overflow:hidden;
}

.set .setitem{
border:3px solid #555555;
text-align:center;
font-size: 1.5rem;
padding:1.5% 0;
}
#wrap ul li .set .setprice{margin: 10px auto;overflow:visible;}


.set .setprice li{
 float:left;
 width:32%;
 margin:0.5%;
 border:1px solid #5ac9ec;
color:#cb2fff;
text-align:center;
font-size: 1.8rem;
padding:1.5% 0;
position:relative;
overflow:visible;
box-sizing: border-box;

}
.set .setprice li:after {
border:15px solid transparent;
border-bottom-color:#5ac9ec;
border-top-width:0;
top:-15px;
content:"";
display:block;
left:45%;
position:absolute;
width:0;
}
.set .setprice li .choice{
color:#AAAAAA;
font-size: 1.4rem;
}
.set .setprice li span{
font-size: 1.2rem;
}

li.notes div {
	width:90%;
	margin: 0 auto;
}

li.notes p{
}

li.notes ul {
}

li.notes ul li{
	list-style-type: square;
	list-style-position: inside;
	margin-bottom: 0;
}



li .system_cancel {
	display: block;
	text-align: left;
}



@media screen and (max-width: 768px) {


#wrap ul {
    margin-top: 10px;
    width:96%;
}

.systemlist dl {
      width:100%;
      display:block;
    font-size: 1.2rem;
}
.systemlist dt span,
.systemlist dd span {
    font-size: 0.9rem;
    margin-left: 2px;
}


.systemlist dt span.system_cancel {
	display: block;
	font-size: 0.6rem;
	margin-top: -2px;
}


   .systemlist{margin-top:0px;}


   .systemlist li h3{font-size: 1.4rem;}


.systemlist li h3 span {font-size:0.9rem;}

   .playlist {
    font-size: 1.1rem;
    text-align:left;
}

.systemlist li.notes h3{
	font-size: 0.9rem;
	margin-top: 40px;
}


#wrap ul .oplist {
    width: 98%;
}
.oplist li {
    font-size: 1.1rem;
}

.set {
    width: 100%;
}
.set .setitem {
font-size: 1.1rem;
text-align:left;
padding:1%;
}

.set .setprice li:after {left: 43%;}
.set .setprice li {
    font-size: 1.2rem;
}

.set .setprice li span {
    font-size: 1rem;
}
.set .setprice li .choice {
    font-size: 0.9rem;
}
}


@media screen and (max-width: 378px) {
.set .setprice li:after {left: 40%;}

.oplist li span{
    display:block;
    width:30%;
}

}
