@charset "UTF-8";

/* 講習詳細　予約できる講習があります欄 */

@media print, (min-width: 768px) {

  .contracted-title {
      margin-top: 150px;
  }

  .result-detail {
  width: auto !important;
  
  }

  .contracted-course {
      display: flex;
  }

  .book-company-detail {
      padding: 20px 20px;
      margin: 0px 35px;
      border:1px solid #ccc;
  }

  .btn-area-right {
      width: 60px;
      height: 280px;
      line-height: 280px;
      vertical-align:middle;
      margin: 0px 30px 0px 0px;
  }

  .btn-area-left {
      width: 60px;
      height: 280px;
      line-height: 280px;
      vertical-align:middle;
      margin: 0px 0px 0px 30px;
  }

  .detail-title {
      color: #47AE3A;
      font-weight: 500;
  }

  .arrow{
      position: relative;
      display: inline-block;
      padding: 0 0 0 16px;
      color: #000;
      vertical-align: middle;
      text-decoration: none;
      font-size: 15px;
      cursor:pointer
  }
  .arrow::before,
  .arrow::after{
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      margin: auto;
      content: "";
      vertical-align: middle;
  }

  .arrow-right::before{
      width: 35px;
      height: 35px;
      -webkit-border-radius: 25%;
      border-radius: 25%;
      background: #47AE3A;
  }
  .arrow-right::after{
      left: 12px;
      width: 8px;
      height: 8px;
      border-top: 2px solid #fff;
      border-right: 2px solid #fff;
      -webkit-transform: rotate(45deg);
      transform: rotate(45deg);
  }

  .arrow-left::before{
      width: 35px;
      height: 35px;
      -webkit-border-radius: 25%;
      border-radius: 25%;
      background: #47AE3A;
  }
  .arrow-left::after{
      left: 14px;
      width: 8px;
      height: 8px;
      border-top: 2px solid #fff;
      border-right: 2px solid #fff;
      -webkit-transform: rotate(225deg);
      transform: rotate(225deg);
  }
}

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

  .contracted-title {
      margin-top: 100px;
  }

  .detail-title {
  font-size: 16px !important;
  }

  .result-detail {
      width: 280px !important;
  }

  .caption-title {
      padding-bottom: 20px;
  }

  .box-course-detail-sm {
      display: flex;
      padding-top: 46px !important;
  }

  .book-company-detail {
      padding: 20px 5px 15px;
      border:1px solid #ccc;
  }

  .btn-area-right {
      width: 60px;
      height: 240px;
      line-height: 240px;
      vertical-align: middle;
      margin: 0px 0px 0px 8px;
  }

  .btn-area-left {
      width: 60px;
      height: 240px;
      line-height: 240px;
      vertical-align:middle;
      margin: 0px 0px 0px 0px;
  }

  .detail-title {
      color: #47AE3A;
      font-weight: 500;
  }

  .arrow{
      position: relative;
      display: inline-block;
      padding: 0 0 0 16px;
      color: #000;
      vertical-align: middle;
      text-decoration: none;
      font-size: 15px;

  }
  .arrow::before,
  .arrow::after{
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      margin: auto;
      content: "";
      vertical-align: middle;
  }

  .arrow-right::before{
      width: 35px;
      height: 35px;
      -webkit-border-radius: 25%;
      border-radius: 25%;
      background: #47AE3A;
  }
  .arrow-right::after{
      left: 12px;
      width: 8px;
      height: 8px;
      border-top: 2px solid #fff;
      border-right: 2px solid #fff;
      -webkit-transform: rotate(45deg);
      transform: rotate(45deg);
  }

  .arrow-left::before{
      width: 35px;
      height: 35px;
      -webkit-border-radius: 25%;
      border-radius: 25%;
      background: #47AE3A;
  }
  .arrow-left::after{
      left: 14px;
      width: 8px;
      height: 8px;
      border-top: 2px solid #fff;
      border-right: 2px solid #fff;
      -webkit-transform: rotate(225deg);
      transform: rotate(225deg);
  }

}

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

    .slider-wrapper {
        overflow-x: auto;
        overflow-y: hidden;
    }
    
    .slider {
        width: 870px;
        -webkit-overflow-scrolling: touch;
    }
    
    .slider > * {
        -webkit-transform: translateZ(0px);
    }
    
    
    .slider-wrapper::-webkit-scrollbar {
        display: none;
        height: 0 !important;
    }
    
    
    .result-detail {
        float: left;
        width: 240px;
        margin: 0 0 0 15px;
    }
    
    .result-detail:first-child {
        margin: 0;
    }
    
    .result-detail .img {
        text-align: center;
    }

    .section-course-result .box-result .box-course-detail {
        padding: 0px;
    }

    .section-course-result .box-result .list-detail .name {
        font-size: 12px;
        flex: 0 0 70px;
        padding: 1px 5px 0px;
    }

    .detail {
       font-size: 16px !important;
    }

    .book-company-detail {
        height: 280px;
    }

    .list-detail {
        margin-bottom: 15px;
    }
}