@charset "UTF-8";
.contents-body {
  overflow: unset;
}
.section {
  padding: 100px 0;
  position: relative;
}
.section.bg-group::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background: url(https://ha-base.haproxy.athuman.com/assets/img/pattern_dot05-tr.svg#wh) repeat center #F7F6EE;
  background-size: 24px 24px;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}
.section.pc-radius,
.section.sp-radius {
  background-color: #fff;
}
.section .inner {
  width: 1200px;
  margin: auto;
}

.txt {
  letter-spacing: 0;
  line-height: 1.75;
  font-size: 1.6rem;
  font-weight: 400;
}

@media screen and (min-width: 481px) {
  .section.pc-radius {
    width: 1200px;
    margin: auto;
    border-radius: 40px;
  }
  .section.pc-radius .inner {
    padding-right: 60px;
    padding-left: 60px;
  }
}
@media screen and (max-width: 480px) {
  .section {
    padding: 13.33vw 0;
  }
  .section.bg-group::before {
    height: calc(100% + 13.33vw);
    background-size: 3.2vw 3.2vw;
    top: -13.33vw;
  }
  .section.sp-radius {
    border-radius: 13.33vw;
  }
  .section .inner {
    width: 90.67vw;
  }
  .txt {
    font-size: 3.73vw;
    line-height: 1.65;
  }
}

/* btn */
.btn-box02 {
  margin-top: 50px;
  margin-bottom: 9px;
}
.btn-box02 a::before,
.btn-box02 a .btn {
  width: 216px;
  height: 72px;
  border-width: 2px;
  border-radius: 13px;
}
.btn-box02 a::before {
  top: 9px;
  left: 10px;
}
.btn-box02 a .btn {
  font-size: 1.8rem;
}
@media(hover: hover) {
  .btn-box02 a:hover .btn {
    transform: translateX(10px) translateY(9px);
  }
}
@media screen and (max-width: 480px) {
  .btn-box02 {
    margin-top: 6.67vw;
    margin-bottom: 1.2vw;
  }
  .btn-box02 a::before,
  .btn-box02 a .btn {
    width: 36.53vw;
    height: 12vw;
    border-width: 1px;
    border-radius: 1.73vw;
  }
  .btn-box02 a::before {
    top: 1.2vw;
    left: 1.33vw;
  }
  .btn-box02 a .btn {
    font-size: 3.47vw;
  }
}

/*** college ***/
.contents-body > .college-section{
  position: relative;
  padding: 100px 0;
}
.contents-body > .college-section::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background-color: #EEECDC;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}
.college-section .head-group{
  margin-bottom: 35px;
}
.college-section .head-group .title.star-line::before{
  background: url(../assets/img/icon_flash_star-line04.svg) no-repeat center;
}
.college-section .head-group .title.star-line::after{
  background: url(../assets/img/icon_flash_star-line04_02.svg) no-repeat center;
}
.college-section .head-group{
  margin-bottom: 50px;
}

.college-section h3{
  font-size: 3.2rem;
  text-align: center;
  margin-bottom: 40px;
}

.college-list ul{
  display: grid;
  grid-template-columns: 1fr 1fr; /*2カラム*/
/*
  grid-template-columns: 1fr 1fr 1fr;
*/
  gap: 30px;
}

.college-list li{
  position: relative;
  margin-bottom: 21px;
/*
  padding: 30px 30px 50px 30px;
*/
  padding: 15px 15px 40px 15px;
  border: 1px solid #040000;
  border-radius: 25px;
  z-index: 1;
}
.college-list li::before{
  display: block;
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  border-radius: 25px;
  opacity: .1;
  z-index: -1;
}

.college-list h4{
  margin-bottom: 20px;
  padding-top: 100px;
  text-align: center;
  font-weight: 500;
  font-size: 1.4rem;
/*
  font-size: 2rem;
*/
  position: relative;
}
.college-list h4::before{
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  height: 90px;
}

.college-list .txt{
  font-size: 0.9rem;
/*
  font-size: 1.4rem;
*/
  margin: 0 !important;
}

.college-list li .btn-box02{
  position: absolute;
  bottom: -23px;
  left: 50%;
  transform: translateX(-50%);
}

.college-section .btn-box02 a::before,
.college-section .btn-box02 a .btn{
  border-width: 1px;
}

/* パフォーミングアーツ */
.college-list .pa::before{
  background-color: var(--color-pa);
}
.college-list .pa h4::before{
  background: url(https://ha-base.haproxy.athuman.com//assets/img/icon_modal_pa.svg) no-repeat center;
}
/* マンガ・イラスト */
.college-list .manga::before{
  background-color: var(--color-manga);
}
.college-list .manga h4::before{
  background: url(https://ha-base.haproxy.athuman.com//assets/img/icon_modal_mi.svg) no-repeat center;
}
/* ゲーム */
.college-list .game::before{
  background-color: var(--color-game);
}
.college-list .game h4::before{
  background: url(https://ha-base.haproxy.athuman.com//assets/img/icon_modal_gm.svg) no-repeat center;
}
/* e-Sports */
.college-list .e_sports::before{
  background-color: var(--color-e_sports);
}
.college-list .e_sports h4::before{
  background: url(https://ha-base.haproxy.athuman.com//assets/img/icon_modal_es.svg) no-repeat center;
}
/* IT */
.college-list .it::before{
  background-color: var(--color-it);
}
.college-list .it h4::before{
  background: url(https://ha-base.haproxy.athuman.com//assets/img/icon_modal_it.svg) no-repeat center;
}
/* 動画クリエイター */
.college-list .movie_creator::before{
  background-color: var(--color-movie_creator);
}
.college-list .movie_creator h4::before{
  background: url(https://ha-base.haproxy.athuman.com//assets/img/icon_modal_vc.svg) no-repeat center;
}
/* チャイルドケア */
.college-list .child::before{
  background-color: var(--color-child);
}
.college-list .child h4::before{
  background: url(https://ha-base.haproxy.athuman.com//assets/img/icon_modal_cc.svg) no-repeat center;
}
/* スポーツ */
.college-list .sports::before{
  background-color: var(--color-sports);
}
.college-list .sports h4::before{
  background: url(https://ha-base.haproxy.athuman.com//assets/img/icon_modal_spt.svg) no-repeat center;
}
/* ヘアメイク */
.college-list .hairmake::before{
  background-color: var(--color-hairmake);
}
.college-list .hairmake h4::before{
  background: url(https://ha-base.haproxy.athuman.com//assets/img/icon_modal_hm.svg) no-repeat center;
}
/* デザイン */
.college-list .design::before{
  background-color: var(--color-design);
}
.college-list .design h4::before{
  background: url(https://ha-base.haproxy.athuman.com//assets/img/icon_modal_ds.svg) no-repeat center;
}
/* ミュージック */
.college-list .music::before{
  background-color: var(--color-music);
}
.college-list .music h4::before{
  background: url(https://ha-base.haproxy.athuman.com//assets/img/icon_modal_mu.svg) no-repeat center;
}
/* バスケットボール */
.college-list .bas::before{
  background-color: var(--color-bas);
}
.college-list .bas h4::before{
  background: url(https://ha-base.haproxy.athuman.com//assets/img/icon_modal_bb.svg) no-repeat center;
}
/* フィッシング */
.college-list .fishing::before{
  background-color: var(--color-fishing);
}
.college-list .fishing h4::before{
  background: url(https://ha-base.haproxy.athuman.com//assets/img/icon_modal_fs.svg) no-repeat center;
}
/* ビジネス */
.college-list .business::before{
  background-color: var(--color-business);
}
.college-list .business h4::before{
  background: url(https://ha-base.haproxy.athuman.com//assets/img/icon_modal_bz.svg) no-repeat center;
}
/* ダンス*/
.college-list .dance::before{
  background-color: var(--color-dance);
}
.college-list .dance h4::before{
  background: url(https://ha-base.haproxy.athuman.com//assets/img/icon_modal_dc.svg) no-repeat center;
}
/* シナリオ */
.college-list .scenario::before{
  background-color: var(--color-scenario);
}
.college-list .scenario h4::before{
  background: url(https://ha-base.haproxy.athuman.com//assets/img/icon_modal_sn.svg) no-repeat center;
}

@media screen and (max-width: 480px) {
  .contents-body > .college-section{
    padding: 13.33vw 0;
  }
  .contents-body > .college-section .inner{
    padding: 0 3.33vw;
  }
  .college-section::before {
    height: calc(100% + 13.33vw * 2 + 8vw);
    top: -13.33vw;
  }
  .college-section .head-group .title.star-line::before{
    background: url(../assets/img/icon_flash_star-line04_sp.svg) no-repeat center;
  }
  .college-section .head-group .title.star-line::after{
    background: url(../assets/img/icon_flash_star-line04_02_sp.svg) no-repeat center;
  }
  .college_list .main-column{
      margin-bottom: 13.33vw;
  }
  .college-section .head-group .jp-ttl{
      margin-bottom: 8vw !important;
  }
  .college-section h3{
      font-size: 5.6vw;
      margin-bottom: 5.13vw;
  }
  .head-group .txt{
      font-size: 3.73vw;
      text-align: left;
  }
  .college-section .head-group{
      margin-bottom: 10.25vw;
  }
  .college-list ul {
      grid-template-columns: auto;
      gap: 3.58vw;
  }
  .college-list li{
      padding: 4vw;
      padding-bottom: 8.46vw;
      border-radius: 2.67vw;
  }
  .college-list li::before{
      border-radius: 2.67vw;
  }
  .college-list h4{
      width: 46.15vw;
      margin-left: auto;
      margin-bottom: 4vw;
      padding: 3.73vw 0;
      font-size: 3.73vw;
      border-top: 1px solid #000;
      border-bottom: 1px solid #000;
  }
  .college-list h4::before{
    width: 33.32vw;
    height: 13.05vw;
    left: calc( -38.04vw + 4vw);
    transform: translateX(0);
  }
  /* パフォーミングアーツ */
  .college-list .pa h4{
    border-color: #EB8F00;
  }
  /* マンガ・イラスト */
  .college-list .manga h4{
    border-color: #D5B200;
  }
  /* ゲーム */
  .college-list .game h4{
    border-color: #AACC03;
  }
  /* e-Sports */
  .college-list .e_sports h4{
    border-color: #8F70AE;
  }
  /* IT */
  .college-list .it h4{
    border-color: #0DAC67;
  }
  /* 動画クリエイター */
  .college-list .movie_creator h4{
    border-color: #C95A9C;
  }
  /* チャイルドケア */
  .college-list .child h4{
    border-color: #B979B0;
  }
  /* スポーツ */
  .college-list .sports h4{
    border-color: #00A8D5;
  }
  /* ヘアメイク */
  .college-list .hairmake h4{
    border-color: #EB6D65;
  }
  /* デザイン */
  .college-list .design h4{
    border-color: #CF8F53; 
  }
  /* ミュージック */
  .college-list .music h4{
    border-color: #F9BF11;
  }
  /* バスケットボール */
  .college-list .bas h4{
    border-color: #8F8195;
  }
  /* フィッシング */
  .college-list .fishing h4{
    border-color: #4593D0;
  }
  /* ビジネス */
  .college-list .business h4{
    border-color: #00B0AD;
  }
  /* ダンス */
  .college-list .dance h4{
    border-color: #efc700;
  }
  /* シナリオ */
  .college-list .scenario h4{
    border-color: #6aa8bf;
  }

  .college-list .txt{
    font-size: 3.73vw;
  }
  .college-list li .btn-box02{
    left: auto;
    right: 4vw;
    transform: translateX(0);
    bottom: -5.64vw;
  }
  .btn-box02.small a .btn {
      font-size: 3.47vw;
  }
  .btn-box02.small a::before, .btn-box02.small a .btn{
      width: 30vw;
      height: 10.77vw;
  } 
}
