/*! Writen  by SCSS */
.sup_wrap {
  position: relative; }
  .sup_wrap sup {
    position: absolute;
    top: -0.5em;
    right: -0.5em;
    font-size: 10px; }
    @media screen and (max-width: 480px) {
      .sup_wrap sup {
        top: -1em; } }

.sec_head.sup_txt {
  line-height: 1.6; }
  @media screen and (max-width: 480px) {
    .sec_head.sup_txt {
      line-height: 1.8; } }

.sec_main {
  position: relative;
  background: #000; }
  .sec_main .inner_head {
    width: 60.93%;
    position: absolute;
    z-index: 2;
    top: 17.95%;
    left: 8.58%; }
  .sec_main img {
    width: 100%; }
  .sec_main .main_image_bottom {
    background: #000;
    max-width: 1600px;
    margin-inline: auto; }
    @media screen and (max-width: 1400px) {
      .sec_main .main_image_bottom img {
        display: block;
        width: 100%;
        height: 100%;
        aspect-ratio: 1400 / 900;
        object-fit: cover;
        object-position: center; } }

.sec01 {
  padding-bottom: clamp(30px, 4.17%, 50px);
  max-width: 1400px;
  margin-inline: auto; }

.sec01_laed_image {
  margin-bottom: clamp(50px, 6.67%, 80px); }

.sec01_illust {
  margin-top: 15px;
  max-width: 1066px;
  margin-inline: auto; }

.sec02 {
  padding-top: clamp(50px, 7.5%, 90px);
  padding-bottom: clamp(40px, 5.84%, 70px);
  background: #f2f6fa url("../images/bg.jpg") bottom center/100% auto no-repeat; }

.sec02_lead_wrap {
  justify-content: center;
  align-items: flex-end;
  gap: 0 3.33%;
  margin-bottom: clamp(40px, 5.84%, 70px); }
  @media screen and (max-width: 480px) {
    .sec02_lead_wrap {
      flex-direction: column;
      align-items: center;
      gap: 25px 0; } }
  .sec02_lead_wrap .sec02_head {
    width: 26.59%; }
    @media screen and (max-width: 480px) {
      .sec02_lead_wrap .sec02_head {
        width: 30%; } }
  .sec02_lead_wrap .sec02_lead {
    width: 34.67%; }
    @media screen and (max-width: 480px) {
      .sec02_lead_wrap .sec02_lead {
        width: 100%; } }

.sec02_image_list {
  display: grid;
  align-items: start;
  align-content: start;
  grid-template-columns: repeat(6, 1fr); }
  @media screen and (max-width: 480px) {
    .sec02_image_list {
      grid-template-columns: repeat(2, 1fr);
      gap: 15px 0; } }
  .sec02_image_list .item .item_image img {
    width: 100%; }
  .sec02_image_list .item .cap_l {
    margin-top: 5px; }

.sec02_center_lead {
  margin-top: clamp(25px, 3.34%, 40px);
  margin-bottom: clamp(40px, 5%, 60px); }
  .sec02_center_lead .lead {
    margin-bottom: 1em; }

button {
  background-color: transparent;
  border: none;
  cursor: pointer;
  padding: 0;
  appearance: none; }

.year_cont .year_group {
  max-width: 1400px;
  margin-inline: auto;
  position: relative; }
  .year_cont .year_group .year_wrap {
    max-width: 1290px;
    margin-inline: auto;
    overflow: hidden; }
    .year_cont .year_group .year_wrap .button_wrap {
      pointer-events: all; }
      .year_cont .year_group .year_wrap .button_wrap button {
        pointer-events: all; }
    .year_cont .year_group .year_wrap .year_wrap_in {
      position: relative;
      height: 562px; }
      @media screen and (max-width: 480px) {
        .year_cont .year_group .year_wrap .year_wrap_in {
          height: 300px; } }
      .year_cont .year_group .year_wrap .year_wrap_in .year_img {
        position: relative;
        width: 100%;
        height: 100%; }
        @media screen and (max-width: 480px) {
          .year_cont .year_group .year_wrap .year_wrap_in .year_img {
            overflow-x: scroll; } }
        .year_cont .year_group .year_wrap .year_wrap_in .year_img img {
          display: block;
          position: absolute;
          top: 0;
          left: 0;
          right: 0;
          bottom: 0;
          max-width: none;
          height: 100%; }
          @media screen and (max-width: 480px) {
            .year_cont .year_group .year_wrap .year_wrap_in .year_img img {
              position: relative; } }
    .year_cont .year_group .year_wrap .button_wrap button {
      position: absolute;
      top: 0;
      bottom: 0;
      width: 32px;
      height: 300px;
      margin: auto;
      background: #434343;
      border-radius: 5px;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: opacity 0.3s ease-in-out; }
      @media (hover: hover) {
        .year_cont .year_group .year_wrap .button_wrap button:hover {
          opacity: 0.7; } }
    .year_cont .year_group .year_wrap .button_wrap .next_prev_btn {
      touch-action: manipulation;
      -webkit-touch-callout: none;
      -webkit-user-select: none;
      user-select: none;
      background: #333; }
      @media screen and (max-width: 480px) {
        .year_cont .year_group .year_wrap .button_wrap .next_prev_btn {
          display: none; } }
      .year_cont .year_group .year_wrap .button_wrap .next_prev_btn:after {
        content: "";
        display: block;
        width: 11px;
        aspect-ratio: 0.8 / 1;
        background: #fff; }
      .year_cont .year_group .year_wrap .button_wrap .next_prev_btn.prev {
        left: 15px; }
        .year_cont .year_group .year_wrap .button_wrap .next_prev_btn.prev:after {
          clip-path: polygon(100% 0, 0 50%, 100% 100%); }
      .year_cont .year_group .year_wrap .button_wrap .next_prev_btn.next {
        right: 15px; }
        .year_cont .year_group .year_wrap .button_wrap .next_prev_btn.next:after {
          clip-path: polygon(0 0, 0 100%, 100% 50%); }

.sec03 {
  background: #000; }
  .sec03 .sec03_inner {
    max-width: 1400px;
    position: relative;
    margin-inline: auto; }
  .sec03 .sec03_head {
    position: absolute;
    z-index: 3;
    right: 0.36%;
    top: 6.22%;
    width: 16.36%; }
    .sec03 .sec03_head img {
      width: 100%; }
  .sec03 .sec03_bg img {
    width: 100%; }
  .sec03 .sec03_lead_wrap {
    z-index: 2;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.7);
    padding-top: clamp(30px, 4.17%, 50px);
    padding-bottom: clamp(30px, 4.17%, 50px);
    color: #fff; }
    @media screen and (max-width: 480px) {
      .sec03 .sec03_lead_wrap {
        position: static;
        background: #000; } }
    .sec03 .sec03_lead_wrap .lead {
      margin-bottom: 1em; }
    .sec03 .sec03_lead_wrap .read {
      margin-bottom: 1em; }

/*# sourceMappingURL=style.css.map */