/*--------------------------------------------------------------
# メインビジュアル
--------------------------------------------------------------*/
header .inner{
  background: rgba(255,255,255,0.8);
}
.main_visual {
  aspect-ratio: 1 / 1;
  background: url(/assets/img//home/main_visual_sp.jpg) no-repeat center / cover;
  @media (min-width: 768px) {
    aspect-ratio: 1920 / 830;
    background: url(/assets/img/home/main_visual_pc.jpg) no-repeat right top / cover;
  }
}
/*--------------------------------------------------------------
# セクションタイトル
--------------------------------------------------------------*/
.home_section_title {
  color: var(--key-color);
  font-family: var(--ff-maru);
  font-size: var(--fs-page-title);
  line-height: 1;
  width: fit-content;
  margin: 0 auto 7rem;
  position: relative;

  &::before {
    display: block;
    content:attr(data-title);
    color: var(--fc-base);
    font-family: var(--ff-maru);
    font-size: var(--fs-normal);
    text-align: center;
    margin-bottom: 2em;
  }
  &::after {
    display: block;
    content:"";
    width: 100%;
    height: 0.3rem;
    margin-top: 3rem;
    background: #000;
  }
}
/*--------------------------------------------------------------
# イントロ
--------------------------------------------------------------*/
#home_intro {
  padding: 7rem 0;
  @media (min-width:768px) {
    padding: 7rem 0 10rem;
  }
}
#home_intro .intro_title {
  font-family: var(--ff-maru);
  font-size: var(--fs-intro-title);
  text-align: center;
  line-height: 1.5;
  word-break: keep-all;
  overflow-wrap: anywhere;
  margin-bottom: 1em;
}
#home_intro .content_block {
  max-width: 80rem;
  margin: 0 auto;
}
#home_intro .btn {
  margin: 0 auto;
}
/*--------------------------------------------------------------
# お知らせ
--------------------------------------------------------------*/
#home_news {
  background: url(/assets/img/common/bg_gradation_sp.jpg) no-repeat center top 18% / cover;
  @media (min-width:768px) {
    background-image: url(/assets/img/common/bg_gradation_pc.jpg);
  }
}
#home_news .news_list {
  @media (min-width:768px) {
    .column2_img_text .img_wrap {
      width: 41%;
    }
    .column2_img_text .text_wrap {
      width: 49%;
    }
  }

  & img {
    aspect-ratio: 500 / 281;
    object-fit: cover;
    object-position: center;
  } 
  .date {
    color: var(--key-color);
    font-weight: 700;
  }
  .news_title {
    color: var(--fc-base);
    font-family: var(--ff-maru);
    font-size: var(--fs-bl-title);
    line-height: 1.5;
    margin-bottom: 1.8em;
  }
  .btn {
    color: var(--fc-base);
    min-width: 21.6rem;
    padding: 0.5em 1.6em; 
    background: #FFF;
    border-color: currentColor;
    &:hover {
      background-color: rgba(0,0,0,0.2);
    }
  }
}
#home_news .archive .btn {
  margin: 0 auto;
}
/*--------------------------------------------------------------
# アルペンワークの特長
--------------------------------------------------------------*/
#home_features {
  background: var(--bg-blue);
}
#home_features .first_text {
  font-family: var(--ff-maru);
  font-size: var(--fs-bl-title);
  width: fit-content;
  margin: 0 auto 7rem;
}
#home_features .grid_column {
  counter-reset: count 0;

  .block_title {
    counter-increment: count 1;
    text-align: center;
    &::before {
      content: counter(count)".";
    }
  }
}
#home_features .btn {
  margin: 0 auto;
  @media (min-width:768px) {
    margin: 0
  }
  + .btn {
    margin-top: 3rem;
    @media (min-width:768px) {
      margin-top: 0;
    }
  }
}
@media (min-width:768px) {
  #home_features .btn_wrap {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 3rem;
  }
}
/*--------------------------------------------------------------
# スキルアップサポート
--------------------------------------------------------------*/
#home_support {
  background: url(/assets/img/home/skillup_bg_sp.jpg) no-repeat center / cover;
  @media (min-width:768px) {
    background-image: url(/assets/img/home/skillup_bg_pc.jpg);
  }
}
#home_support .home_section_title {
  color: #FFF;
  &::before {
    color: #FFF;
  }
  &::after {
    background: #FFF;
  }
}
#home_support .text {
  color: #FFF;
  font-family: var(--ff-maru);
  font-size: var(--fs-page-title);
  line-height: 1;
  text-align: center;
  word-break: keep-all;
  overflow-wrap: anywhere;
}
#home_support .support_list {
  counter-reset: count 0;
  margin-top: 7rem;
  @media (min-width:768px) {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  & li {
    counter-increment: count 1;
    display: flex;
    font-family: var(--ff-maru);
    font-size: var(--fs-bl-title);
    align-items: center;
    line-height: 1.5;
    word-break: keep-all;
    overflow-wrap: anywhere;
    height: 3.7em;
    margin-bottom: 3rem;
    background: #FFF;
    border-radius: 1rem;
    overflow: hidden;
    @media (min-width:768px) {
      width: 48%;
      margin-bottom: 5rem;
    }
    
    &::before {
      display: flex;
      content: counter(count);
      color: #FFF;
      justify-content: center;
      align-items: center;
      width: 17%;
      height: 100%;
      margin-right: 1em;
      background: var(--key-color);
    }
  }
}
#home_support .btn {
  margin: 0 auto;
  border-color: #FFF;
}
/*--------------------------------------------------------------
# アクセス
--------------------------------------------------------------*/
#home_access .address_list {
  display: flex;
  width: fit-content;
  margin: 3rem auto 7rem;

  & dt {
    flex-shrink: 0;
    &::after {
      content: "：";
    }
  }
}
#home_access .btn {
  margin: 0 auto;
}