@charset "utf-8";
/* CSS Document */
.cover {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  margin: 0 auto;
  display: flex;
  align-items: flex-end;
  width: 100%;
  height: 1000px;
  background: url("../../../img/mv_bg.png") no-repeat center;
  background-position-y: bottom;
  background-size: cover;
  z-index: -1;
}
.page_visual {
  background: url("../img/page_visual.png") center no-repeat;
  background-size: cover;
}

.category_box--flex {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  gap: 20px;
  @media screen and (max-width: 767px) {
    flex-direction: column;
    align-items: center;
  }
}
.category_box--single {
  width: calc(50% - 10px);
  @media screen and (max-width: 767px) {
    width: 100%;
  }
}
.category_box--single .explanation_box {
  flex-direction: column;
  align-items: center;
  @media screen and (max-width: 767px) {
    flex-direction: column-reverse;
    margin-top: 24px;
  }
}
.ex_left,
.ex_left .third_table {
  width: 100%;
  max-width: 416px;
}

.title_box h2 + p {
  min-height: 64px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.category_box--flex + .category_box--flex {
  margin-top: 56px;
  margin-bottom: 32px;
  .title_box {margin-top: 0;}
  @media screen and (max-width: 767px) {
    gap: 52px;
  }
}

/*カテゴリー色変更*/
.blue {
  background: #0076C0;
}
.green {
  background: #3BB906;
}
.orange {
  background: #ED6C0F;
}
.yellow {
  background: #F8B201;
}
.red {
  background: #E22608;
}
.skyblue {
  background: #019DE6;
}
.purple {
  background: #9B08C7;
}

@media screen and (orientation: portrait) and (min-width: 768px){}

@media screen and (max-width: 767px) {
  .title_box {margin-top: 32px;}

  .category_box--flex + p.center {text-align: center;}
  p.center + .btn.w_348 {width: 100%;}
}
@media screen and (max-width: 350px){
.st_flex {
    flex-wrap: wrap;
    width: 100%;
}
}