@charset "utf-8";

.sml {
    font-size: 75%;
}
.seminar {
    letter-spacing: 0.5px;
    padding: 0 0 80px;
}
.seminar .sectionTit {
    background: #2EB4F1;
    color: #fff;
    line-height: 1.4em;
    padding: 80px 0 80px;
}
.seminar h3 {
    text-align: center;
    font-weight: bold;
    font-size: 24px;
    line-height: 1;
    padding: 0 0 38px;
    letter-spacing: 1px;
}
.seminar .text{
    padding: 20px 0 60px;
}
.seminar .text p{
    padding: 0 0 10px;
}

.listReserveAll {
    padding: 0 0 80px;
}
.listReserveAll table{
    width: 100%;
    border-top: 1px solid;
    border-left: 1px solid;
}
.listReserveAll table tr th, .listReserveAll table tr td{
    text-align: center;
    padding: 5px;
    border-right: 1px solid;
    border-bottom: 1px solid;
}
.listReserveAll table tr th{
    background: rgba(220,60,19,0.1);
}

.listReserve{
    border-top: 1px solid #ddd;
}
.listReserve > li{
    padding: 50px 0;
    border-bottom: 1px solid #ddd;
}
.listReserve li .tit {
    font-size: 22px;
    font-weight: bold;
    letter-spacing: 1px;
    color: #fff;
}
.listReserve li .tit span{
    border: 1px solid;
    font-size: 15px;
    line-height: 1;
    padding: 0 5px 1px 7px;
    text-align: center;
    letter-spacing: 2px;
    border-radius: 2px;
    margin: 0 10px 0 0;
    vertical-align: 3px;
}

.listReserve > li table{
    border: 1px solid;
    width: 100%;
}
.listReserve > li table tr{
    padding: 25px;
    display: block;
    border-bottom: 1px solid;
}
.listReserve > li table tr:first-of-type{
    background: #dc3c13;
    color: #fff;
    padding: 20px 25px;
}
.listReserve > li table tr th{
    font-weight: bold;
    font-size: 16px;
    letter-spacing: 3px;
}
.listReserve > li table tr:not(:first-of-type) {
    padding: 20px 0;
    margin: 0 25px;
}
.listReserve > li table tr:last-of-type{
    border-bottom: none;
}
.listReserve > li table tr td{
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: space-between;
}
.listReserve > li table tr td ul {
    font-size: 18px;
    letter-spacing: 1px;
    width: 70%;
}
.listReserve > li table tr td ul li .ico{
    border: 1px solid;
    padding: 2px 6px 2px 8px;
    border-radius: 5px;
    background: rgba(125,186 ,41, 0.2);
    margin: 0 8px 0 0;
}
.listReserve > li table tr td ul li .ico.ico15{

    background: rgba(252, 202, 0, 0.2);
}
.listReserve > li table tr td ul li .ico.ico16{

    background: rgba(0,159 ,232, 0.2);
}
.listReserve > li table tr td ul li .ico.ico17{

    background: rgba(229,0 ,78, 0.2);
}
.listReserve > li table tr td ul li > i{
    font-size: 14px;
    color: #666;
    margin: 0 10px 0 0;
}

.listReserve > li table tr td ul li:not(:last-of-type) {
    padding: 0 0 15px;
}


.seminar .btn a {
    background: #000;
    color: #fff;
    border: none;
}
.seminar .btn a:hover {
    background: #e94829;
}

/* PC
=================================== */
@media screen and (min-width: 900px){

}
@media screen and (min-width:600px) and ( max-width:960px) {
  .detail .sectionTit{
    font-size: 5vw;
  }
  .seminar .text {
    padding: 0 0 60px;
  }
  .seminar .btn a{
    min-width: 200px;
  }
}


/* SP
=================================== */
@media screen and (max-width: 900px){

  .listReserve > li table tr td ul {
    width: 65%;
  }

}

@media screen and (max-width: 700px){

  .seminar {
    padding: 0 0 10%;
  }
  .seminar .sectionTit {
    line-height: 1.5;
    padding: 10% 0 9%;
    font-size: 5vw;
    letter-spacing: 1px;
    margin: 0 0 10%;
  }
  .seminar .text {
    padding: 0 0 8%;
  }
  .seminar .text p {
    padding: 0 0 2%;
  }
  
  .seminar h3 {
    font-size: 5vw;
    padding: 0 0 8%;
  }
  
  .listReserve > li table tr td ul {
    font-size: 15px;
    padding: 0 0 6%;
  }
  .listReserve > li {
    padding: 10% 0;
  }
  .listReserve li .tit {
    font-size: 16px;
  }
  .listReserve li .tit span {
    font-size: 12px;
  }
  
  .listReserve > li table tr td ul li .ico {
    padding: 0 5px 2px 7px;
    margin: 0 6px 0 0;
  }
  .listReserve > li table tr:first-of-type {
    padding: 3% 5%;
  }
  .listReserve > li table tr th {
    font-size: 14px;
  }
  .listReserve > li table tr:not(:first-of-type) {
    padding: 8% 0;
    margin: 0 5%;
  }
  .listReserve > li table tr td ul {
    width: 100%;
  }
  .listReserve > li table tr td ul li:not(:last-of-type) {
    padding: 0 0 6%;
    margin: 0;
    border: none;
  }
  .seminar .btn {
    width: 100%;
  }
  
  .listReserve > li table tr td ul li > i {
    font-size: 12px;
    margin: 0 8px 0 0;
  }
  .listReserve > li table tr td ul li .ico {
    margin: 0 4px 0 0;
    font-size: 13px;
  }
  
  .listReserveAll > div{
    overflow-x: scroll;
  }
  .listReserveAll table {
    min-width: 500px;
    font-size: 12px;
  }
}