@charset "UTF-8";
  /* box */
  .box_itp {
    padding: 14px;
    border-radius: 8px;
    background-color: #F3F1FF;
    border: var(--c01color) 3px solid;
  }
  .box_itd {
    padding: 14px;
    border-radius: 8px;
    background-color: #fff4ff;
    border: var(--c02color) 3px solid;
  }
  .box_ito {
    padding: 14px;
    border-radius: 8px;
    background-color: #effff7;
    border: var(--c03color) 3px solid;
  }
  .box_ite {
    padding: 14px;
    border-radius: 8px;
    background-color: #eaf4ff;
    border: var(--c04color) 3px solid;
  }
  .box_ite_v {
    padding: 0;
    background:none;
    border:none;
  }
  @media (max-width: 767px) {
    .box_itp,.box_itd,.box_ito,.box_ite {
      padding: 0;
      background:none;
      border:none;
    }
    .box_ite_v {
      padding: 14px;
      border-radius: 8px;
      background-color: #eaf4ff;
      border: var(--c04color) 3px solid;
    }
  }
  /* タイトル */
  .courses_title {
      position: relative;
      padding-top: 50px;
      padding-bottom: 50px;
      font-size: 30px;
      font-weight: bold;
      text-align: center;
    }
    .courses_title span {
      position: relative;
      z-index: 2;
    }
    .courses_title::before {
      content: attr(data-en);
      position: absolute;
      top: -10px;
      left: 50%;
      transform: translateX(-50%);
      font-size: 80px;
      font-weight: bold;
      font-style: italic;
    }
    .c01_title::before {
    color: #F3F1FF;
    }
    .c02_title::before {
      color: #fff4ff;
    }
    .c03_title::before {
      color: #effff7;
    }
    .c04_title::before {
      color: #eaf4ff;
    }
    @media (max-width: 575px) {
      .courses_title {
        font-size: 26px;
        padding-bottom: 20px;
      }
    .courses_title::before {
      top: 22px;
      font-size: 42px;
    }
  }
  /* ボーダー */
.bd_itp {
  border: var(--c01color) 1px solid;
  opacity: 1;
}
.bd_itd {
  border: var(--c02color) 1px solid;
  opacity: 1;
}
.bd_ito {
  border: var(--c03color) 1px solid;
  opacity: 1;
}
.bd_ite {
  border: var(--c04color) 1px solid;
  opacity: 1;
}
  /* ヘッダー */
  #c_header {
    background-blend-mode:lighten;
    background-size: cover;
    padding-bottom: 20px;
  }
  .c_header01 {
    background-image: url(../img/back01.png);
    background-color:rgba(255,255,255,0.4);
  }
  .c_header02 {
    background-image: url(../img/back02.png);
    background-color:rgba(255,255,255,0.4);
  }
  .c_header03 {
    background-image: url(../img/back03.png);
    background-color:rgba(255,255,255,0.4);
  }
  .c_header04 {
    background-image: url(../img/back04.png);
    background-color:rgba(255,255,255,0.4);
  }
.c_header_img {
  position:relative;
  height:380px;
  margin-bottom: 90px;
}
.c_header_img_c04a {
margin-bottom: 140px;
}
.c_header_img img {
  position:absolute;
  float: right;
  height:380px;
  width: 100%;
  object-fit: cover;
  padding-left: 100px;
}
.c_header_img h1 {
    position:absolute;
    /* font-family :  "Osaka", "MS PGothic", "DFPHSGothic-W5", "DFGHSGothic-W5", "DFHSGothic-W5", sans-serif; */
    top:200px;
    padding:18px;
    font-size:20px;
    font-weight: 600;
    line-height:56px;
    color: #fff;
  }
  .c_header_img p {
    position: absolute;
    top: 160px;
    padding: 18px;
    font-size: 18px;
    font-weight: 600;
    line-height: 0;
    background-color: #fff;
  }
  .c_03 p {
    top: 220px;
  }
  .c_03 h1 {
    top:260px;
  }
  .c_header_img h1 span {
    font-size:52px;
  }
  .c_01 h1 span {
    font-size:43px;
  }
  .c_03 h1 span {
    font-size:51px;
  }
  .c_04 h1 span {
    font-size:44px;
  }
  .c_header_img h1 .c_header_c04a {
    font-size:27px;
  }
  @media (max-width: 720px) {
    .c_header_img {
      height:200px;
    }
    .c_header_img_c04a {
      margin-bottom: 120px;
      }
    .c_header_img img {
      height:200px;
      padding-left: 8%;
    }
    .c_header_img h1 {
      top:160px;
      font-size: 18px;
      line-height:30px;
    }
    .c_header_img h1 span {
      font-size:30px;
    }
    .c_header_img p {
      top: 130px;
      padding: 12px;
      font-size: 14px;
    }
  }
  .c_01 h1 {
    width:350px;
    background:var(--c01color);
    background-image: linear-gradient( 135deg, #faa7e4 10%,#9135f3 100%);
  }
  .c_02 h1 {
    width:300px;
    background:var(--c02color);
    background-image: linear-gradient(135deg, #ffd09b 0%, #fa63ae 86%);
  }
  .c_03 h1 {
    width:300px;
    background:var(--c03color);
    background-image: linear-gradient( 135deg, #28C76F 10%,#81FBB8 100%);
  }
  .c_04 h1 {
    width:300px;
    background:var(--c04color);
    background-image: linear-gradient(315deg, #7fbfff 0%, #bf7fff 100%);
    padding: 14px;
  }
  @media (max-width: 720px) {/* eスポーツページ タイトル スマホ表示 */
    .c_01 h1 {
      width:280px;
    }
  }
  @media (max-width: 720px) {/* eスポーツページ タイトル スマホ表示 */
    .c_04 h1 {
      width:208px;
    }
  }
  .c_01 p {
    color:#b473fa;
  }
  .c_02 p {
    color:#fa63ae;
  }
  .c_03 p {
    color:#28C76F;
    }
  .c_04 p {
    color:#7fbfff;
    }
/* カリキュラム */
  #c_main {
    padding-top: 60px;
  }
  @media (max-width: 575px) {
    #c_main {
      padding-top: 10px;
    }
  }
  .plan_btn {
    background-color: #ffffe0;
    border: #000 2px solid;
    padding: 8px;
    font-size: 17px;
  }
  .courses_plan {/* カリキュラムボックス */
    position: relative;
    padding: 3rem;
    border-radius: 10px;
    }
    .courses_plan::before {
    position: absolute;
    top: -10px;
    left: 10px;
    width: 100%;
    height: 100%;
    border-radius: 10px;
    content: '';
    }
    .courses_plan a {
      position: relative;
    }
    .c01_plan {
      background-color: #F3F1FF;
    }
    .c01_plan::before {
      border: 3px solid var(--c01color);
    }
    .c02_plan {
      background-color: #fff4ff;
    }
    .c02_plan::before {
      border: 3px solid var(--c02color);
    }
    .c03_plan {
      background-color: #effff7;
    }
    .c03_plan::before {
      border: 3px solid var(--c03color);
    }
    .c04_plan {
      background-color: #eaf4ff;
    }
    .c04_plan::before {
      border: 3px solid var(--c04color);
    }
    @media (max-width: 720px) {/* カリキュラムボックス スマホ表示 */
      .courses_plan {
        padding: 2rem;
      }
      .courses_plan::before {
        border: 0; 
      }
    }
    @media (max-width: 401px) {/* カリキュラムボックス スマホ表示 */
      .btn-course {
        font-size: 0.85rem;
      }
    }

/* 施設紹介・在校生の声 */
  #c01_other {
    background:#F3F1FF;
    background-image: linear-gradient( 135deg, #ffddea 10%,#d7e4ff 100%);
    padding: 50px 0;
  }
  #c02_other {
    background:#fff4ff;
    background-image: linear-gradient( 135deg, #f2e5ff 10%,#fff4f4 100%);
    padding: 50px 0;
  }
  #c03_other {
    background:#effff7;
    background-image: linear-gradient( 135deg, #d7e4ff 0%,#dbffdb 100%);
    padding: 50px 0;
  }
  #c04_other {
    background:#eaf4ff;
    background-image: linear-gradient( 135deg, #e0e0ff 10%,#e5fff2 100%);
    padding: 50px 0;
  }
  .c_other {
    background-color: #fff;
    border-radius: 10px;
    padding: 22px;
  }
  .instrtor {
    max-width: 200px;
  }