@charset "UTF-8";
/*
  File Name   : top.css
  Description : Write top content styles
*/
/* TOP 共通パーツ
============================================================ */
/* KV
============================================================ */
.top-kv {
  position: relative;
  height: calc(100vh - 6.5555555556rem);
  height: calc(100dvh - 6.5555555556rem);
}
@media print, screen and (min-width: 1025px) {
  .top-kv {
    padding: 0 60px;
  }
}
@media only screen and (max-width: 1024px) {
  .top-kv {
    height: calc(100vh - 3.75rem);
    height: calc(100dvh - 3.75rem);
    padding: 0 var(--sidePadding_base_mbl);
  }
}
@media only screen and (min-width: 600px) and (max-width: 1024px) {
  .top-kv {
    height: calc(100vh - 6.25rem);
    height: calc(100dvh - 6.25rem);
  }
}
@media only screen and (max-width: 599px) {
  .top-kv {
    height: calc(100vh - 5rem);
    height: calc(100dvh - 5rem);
  }
}
.top-kvInner {
  position: relative;
  height: 100%;
  overflow: hidden;
}
.top-kvInner::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #0E76BD;
  opacity: 0.2;
  mix-blend-mode: screen;
  pointer-events: none;
  z-index: 2;
}
.top-kv > .splide__pagination {
  position: absolute;
  z-index: 1;
  bottom: -30px;
  left: 0;
  width: 100%;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 8px;
}
@media only screen and (max-width: 1024px) {
  .top-kv > .splide__pagination {
    bottom: -22px;
  }
}
.top-kv > .splide__pagination .splide__pagination__page {
  width: 8px;
  height: 8px;
  margin: 0;
  background-color: #D9D9D9;
  border-radius: 50%;
  opacity: 1;
  -webkit-transition: all 0.2s ease-in;
  transition: all 0.2s ease-in;
}
.top-kv > .splide__pagination .splide__pagination__page.is-active {
  width: 12px;
  height: 12px;
  background-color: var(--color_main);
  -webkit-transform: none;
          transform: none;
}
.top-kv .top-kv-catch {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  z-index: 1;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  max-width: 750px;
  background-color: rgba(255, 255, 255, 0.75);
  border-radius: 20px;
  padding: 1.8em 3em;
  text-align: center;
}
@media only screen and (max-width: 1024px) {
  .top-kv .top-kv-catch {
    left: 50%;
    right: auto;
    width: calc(100% - 40px);
    max-width: 70%;
    padding: 1.5em 1.75em;
  }
}
@media only screen and (max-width: 599px) {
  .top-kv .top-kv-catch {
    width: 100%;
    max-width: 300px;
    padding: 1.5em 1em;
  }
}
.top-kv .top-kv-catch-ttl {
  color: var(--color_main);
  font-size: clamp(1.8rem, calc(0.4286rem + 2.4107vw), 3rem);
  font-weight: 900;
  line-height: 1.4em;
}
@media only screen and (max-width: 1024px) {
  .top-kv .top-kv-catch-ttl {
    font-size: 1.4rem;
  }
}
@media only screen and (min-width: 600px) and (max-width: 1024px) {
  .top-kv .top-kv-catch-ttl {
    font-size: clamp(1.7125rem, calc(-0.2863rem + 5.3302vw), 3.125rem);
  }
}
@media only screen and (max-width: 599px) {
  .top-kv .top-kv-catch-ttl {
    font-size: 1.875rem;
  }
}
.top-kv .top-kv-catch-txt {
  color: var(--color_main);
  font-size: clamp(1.3rem, calc(0.2717rem + 1.808vw), 2.2rem);
  font-weight: 700;
  line-height: 1.6em;
}
@media only screen and (max-width: 1024px) {
  .top-kv .top-kv-catch-txt {
    font-size: 0.85rem;
  }
}
@media only screen and (min-width: 600px) and (max-width: 1024px) {
  .top-kv .top-kv-catch-txt {
    font-size: clamp(1.1625rem, calc(-0.5533rem + 4.5755vw), 2.375rem);
  }
}
@media only screen and (max-width: 599px) {
  .top-kv .top-kv-catch-txt {
    font-size: 1.125rem;
    letter-spacing: 0.01em;
    white-space: nowrap;
  }
}
.top-kv .top-kv-alert {
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: 3;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  width: 100%;
  max-width: calc(170px + 730px);
  min-height: 120px;
}
.top-kv .top-kv-alert-icon {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 4px;
  width: 170px;
  padding: 0.75em 0.5em;
  background-color: #BC0707;
  border-top-left-radius: 30px;
}
.top-kv .top-kv-alert-icon-mark {
  display: block;
  width: 26px;
  height: 26px;
  background: url(../images/common/icon/icon_alert.svg) no-repeat center/contain;
}
.top-kv .top-kv-alert-icon-txt {
  max-width: 100%;
  color: #F5E740;
  font-size: 1.39rem;
  font-weight: 900;
  line-height: 1.3em;
  text-align: center;
}
.top-kv .top-kv-alert-body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 0.25em;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  min-width: 0;
  max-width: 730px;
  padding: 0.6em 1.5em;
  background-color: #F5E740;
}
.top-kv .top-kv-alert-date {
  color: #b3141d;
  font-size: 1.1rem;
  font-weight: 700;
}
.top-kv .top-kv-alert-link a {
  color: #b3141d;
  font-size: 1.2rem;
  font-weight: 700;
  text-decoration: underline;
}
.top-kv .top-kv-alert-link a:hover {
  text-decoration: none;
}
@media only screen and (max-width: 1024px) {
  .top-kv .top-kv-alert {
    max-width: calc(110px + 730px);
  }
  .top-kv .top-kv-alert-icon {
    width: 110px;
    padding: 0.5em 0.25em;
    gap: 2px;
  }
  .top-kv .top-kv-alert-icon-mark {
    width: 25px;
    height: 25px;
  }
  .top-kv .top-kv-alert-icon-txt {
    font-size: 0.6rem;
  }
  .top-kv .top-kv-alert-body {
    padding: 0.4em 0.75em;
  }
  .top-kv .top-kv-alert-date {
    font-size: 0.6rem;
  }
  .top-kv .top-kv-alert-link a {
    font-size: 0.7rem;
  }
}
@media only screen and (min-width: 600px) and (max-width: 1024px) {
  .top-kv .top-kv-alert {
    width: calc(100% - 15px);
  }
  .top-kv .top-kv-alert-icon-txt {
    font-size: 1.25rem;
  }
  .top-kv .top-kv-alert-date {
    font-size: 1.2375rem;
  }
  .top-kv .top-kv-alert-link a {
    font-size: 1.35rem;
  }
}
@media only screen and (max-width: 599px) {
  .top-kv .top-kv-alert {
    min-height: 100px;
    width: calc(100% - 15px);
  }
  .top-kv .top-kv-alert-icon-txt {
    font-size: 1.25rem;
  }
  .top-kv .top-kv-alert-date {
    font-size: 1rem;
  }
  .top-kv .top-kv-alert-link a {
    font-size: 1.125rem;
  }
}
.top-kv .top-kv-slider {
  position: relative;
  width: 100%;
  height: 100%;
}
.top-kv .top-kv-slider .splide {
  position: relative;
  height: 100%;
  -webkit-animation-delay: 0.6s;
          animation-delay: 0.6s;
}
.top-kv .top-kv-slider .splide .splide__track {
  width: 100%;
  height: 100%;
}
.top-kv .top-kv-slider .splide .splide__track .splide__list {
  height: 100%;
}
.top-kv .top-kv-slider .splide .splide__track .splide__list .splide__slide {
  height: 100%;
  overflow: hidden;
}
.top-kv .top-kv-slider .splide .splide__track .splide__list .splide__slide--pict {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
/* NEWS
============================================================ */
.top-news {
  position: relative;
  padding: 8.3rem 0;
}
@media screen and (max-width: 899px) {
  .top-news {
    padding-top: 3.125rem;
  }
}
.top-news .top-news-decoSquare {
  position: absolute;
  top: -250px;
  left: -100px;
  z-index: 0;
  width: 760px;
  height: 700px;
  max-width: 90vw;
  border-radius: 150px;
  background-color: #F4F9FF;
  opacity: 1;
  pointer-events: none;
  z-index: -1;
}
@media print, screen and (min-width: 1025px) {
  .top-news .top-news-decoSquare {
    width: clamp(380px, calc(-55.19px + 42.458vw), 760px);
    height: clamp(350px, calc(-50.83px + 39.106vw), 700px);
    border-radius: clamp(75px, calc(-10.8938px + 8.3799vw), 150px);
  }
}
@media only screen and (max-width: 1024px) {
  .top-news .top-news-decoSquare {
    top: -50px;
    width: 380px;
    height: 350px;
    border-radius: clamp(22px, calc(-8.6242px + 8.1664vw), 75px);
  }
}
.top-news .top-news-decoSquareGroup {
  position: absolute;
  bottom: -167px;
  right: -90px;
  z-index: -2;
  width: 670px;
  height: 970px;
  pointer-events: none;
  -webkit-transform-origin: bottom right;
          transform-origin: bottom right;
}
@media print, screen and (min-width: 1025px) {
  .top-news .top-news-decoSquareGroup {
    -webkit-transform: scale(clamp(0.5, calc(0.5 + 0.5 * (100vw - 1025px) / 895px), 1));
            transform: scale(clamp(0.5, calc(0.5 + 0.5 * (100vw - 1025px) / 895px), 1));
  }
}
@media only screen and (max-width: 1024px) {
  .top-news .top-news-decoSquareGroup {
    -webkit-transform: scale(0.5);
            transform: scale(0.5);
  }
}
.top-news .top-news-decoSquare02 {
  position: absolute;
  top: 60px;
  right: 10px;
  z-index: -2;
  width: 410px;
  height: 410px;
  border-radius: 80px;
  background-color: #F5FAF9;
  opacity: 1;
}
.top-news .top-news-decoSquare03 {
  position: absolute;
  top: 300px;
  right: 0;
  z-index: -1;
  width: 670px;
  height: 670px;
  border-radius: 100px;
  background-color: #FFFDF4;
  opacity: 1;
}
.top-news > .lay-contentsContainer {
  position: relative;
  z-index: 1;
}
.top-news .top-news-header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 1.5em 2em;
}
@media only screen and (max-width: 1024px) {
  .top-news .top-news-header {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    text-align: center;
  }
}
@media screen and (max-width: 899px) {
  .top-news .top-news-header {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
}
.top-news .top-news-header .top-news-header-ttl-en {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5em;
  color: var(--color_main);
  font-family: "Lato", sans-serif;
  font-size: 1.2rem;
  font-weight: 700;
  letter-spacing: 0.02em;
}
.top-news .top-news-header .top-news-header-ttl-en::before {
  content: "";
  display: block;
  width: 20px;
  height: 1px;
  background-color: var(--color_main);
}
.top-news .top-news-header .top-news-header-ttl-ja {
  color: #0C2032;
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.4em;
}
@media only screen and (min-width: 600px) and (max-width: 1024px) {
  .top-news .top-news-header .top-news-header-ttl-ja {
    font-size: 1.6rem;
  }
}
@media only screen and (max-width: 599px) {
  .top-news .top-news-header .top-news-header-ttl-ja {
    font-size: 1.75rem;
  }
}
.top-news .top-news-header .top-news-header-catTab {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 0.5em 0.5em;
}
@media only screen and (max-width: 1024px) {
  .top-news .top-news-header .top-news-header-catTab {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}
@media print, screen and (min-width: 1025px) {
  .top-news .top-news-header .top-news-header-catTab {
    -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
    gap: 0;
  }
}
@media screen and (min-width: 900px) and (max-width: 1024px) {
  .top-news .top-news-header .top-news-header-catTab {
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
    -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
    gap: 0;
  }
}
.top-news .top-news-header .top-news-header-catTab > li {
  display: block;
}
@media print, screen and (min-width: 1025px) {
  .top-news .top-news-header .top-news-header-catTab > li {
    margin-left: -1px;
  }
  .top-news .top-news-header .top-news-header-catTab > li:first-child {
    margin-left: 0;
  }
}
@media screen and (min-width: 900px) and (max-width: 1024px) {
  .top-news .top-news-header .top-news-header-catTab > li {
    margin-left: -1px;
  }
  .top-news .top-news-header .top-news-header-catTab > li:first-child {
    margin-left: 0;
  }
}
.top-news .top-news-header .top-news-header-catTab > li > a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-line-pack: center;
      align-content: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  min-width: 8.5em;
  height: 100%;
  color: var(--color_main);
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: var(--letterSpacing_base);
  text-indent: var(--letterSpacing_base);
  text-decoration: none;
  border: 2px solid var(--color_main);
  background-color: #fff;
  border-radius: 999px;
  padding: 0.5em 0.75em;
  -webkit-transition: background-color 0.2s ease-in, color 0.2s ease-in;
  transition: background-color 0.2s ease-in, color 0.2s ease-in;
}
@media print, screen and (min-width: 1025px) {
  .top-news .top-news-header .top-news-header-catTab > li > a {
    border-radius: 0;
  }
}
@media screen and (min-width: 900px) and (max-width: 1024px) {
  .top-news .top-news-header .top-news-header-catTab > li > a {
    border-radius: 0;
  }
}
@media only screen and (max-width: 599px) {
  .top-news .top-news-header .top-news-header-catTab > li > a {
    font-size: 0.875rem;
  }
}
.top-news .top-news-header .top-news-header-catTab > li > a.active {
  position: relative;
  z-index: 1;
  color: #fff;
  background-color: var(--color_main);
}
@media print, screen and (min-width: 1025px) {
  .top-news .top-news-header .top-news-header-catTab > li:first-child > a {
    border-radius: 999px 0 0 999px;
  }
  .top-news .top-news-header .top-news-header-catTab > li:last-child > a {
    border-radius: 0 999px 999px 0;
  }
}
@media screen and (min-width: 900px) and (max-width: 1024px) {
  .top-news .top-news-header .top-news-header-catTab > li:first-child > a {
    border-radius: 999px 0 0 999px;
  }
  .top-news .top-news-header .top-news-header-catTab > li:last-child > a {
    border-radius: 0 999px 999px 0;
  }
}
@media screen and (max-width: 899px) {
  .top-news .top-news-header .top-news-header-catTab {
    width: 100%;
    gap: 0;
  }
  .top-news .top-news-header .top-news-header-catTab .catAll {
    -webkit-box-flex: 1;
        -ms-flex: 1 1 100%;
            flex: 1 1 100%;
    margin-bottom: 0.5em;
  }
  .top-news .top-news-header .top-news-header-catTab .catAll > a {
    width: 100%;
    height: 45px;
  }
  .top-news .top-news-header .top-news-header-catTab > li:not(.catAll) {
    -webkit-box-flex: 1;
        -ms-flex: 1 1 0px;
            flex: 1 1 0;
    margin-left: -1px;
  }
  .top-news .top-news-header .top-news-header-catTab > li:not(.catAll) > a {
    min-width: 0;
    padding: 0.5em 0.25em;
    border-radius: 0;
  }
  .top-news .top-news-header .top-news-header-catTab > li:not(.catAll):nth-child(2) {
    margin-left: 0;
  }
  .top-news .top-news-header .top-news-header-catTab > li:not(.catAll):nth-child(2) > a {
    border-radius: 999px 0 0 999px;
  }
  .top-news .top-news-header .top-news-header-catTab > li:not(.catAll):last-child > a {
    border-radius: 0 999px 999px 0;
  }
}
.top-news .top-news-list-wrap {
  margin: 3rem 0;
}
.top-news .top-news-moreBtn {
  margin: 2rem 0 0 auto;
  height: 60px;
  min-height: 60px;
  font-size: 1rem;
  width: 300px;
  border-radius: 999px;
}
@media only screen and (max-width: 1024px) {
  .top-news .top-news-moreBtn {
    margin: 2rem auto 0;
    width: 280px;
  }
}
.top-news .top-news-moreBtn::after {
  width: 9px;
  height: 9px;
  top: 50%;
  right: 1.5em;
  background: none;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  -webkit-transform: translate(0, -50%) rotate(45deg);
          transform: translate(0, -50%) rotate(45deg);
  -webkit-transition: right 0.2s ease-in;
  transition: right 0.2s ease-in;
}
.top-news .top-news-moreBtn:hover {
  opacity: 0.8 !important;
}
@media print, screen and (min-width: 1025px) {
  .top-news .top-news-moreBtn:hover::after {
    right: 1em;
  }
}

/* SEARCH
============================================================ */
.top-search {
  padding: 6rem 0;
  text-align: center;
  background-color: #F0F6FA;
}
.top-search .top-search-header {
  margin-bottom: 2.8rem;
}
.top-search .top-search-header-en {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5em;
  color: var(--color_main);
  font-family: "Lato", sans-serif;
  font-size: 1.2rem;
  font-weight: 700;
  letter-spacing: 0.02em;
}
.top-search .top-search-header-en::before {
  content: "";
  display: block;
  width: 20px;
  height: 1px;
  background-color: var(--color_main);
}
.top-search .top-search-header-ja {
  color: #0C2032;
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.4em;
}
@media only screen and (min-width: 600px) and (max-width: 1024px) {
  .top-search .top-search-header-ja {
    font-size: 1.6rem;
  }
}
@media only screen and (max-width: 599px) {
  .top-search .top-search-header-ja {
    font-size: 1.75rem;
  }
}
.top-search .top-search-form {
  max-width: 600px;
  margin: 0 auto 1.5rem;
}
.top-search .top-search-form form {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 56px;
  border: 2px solid var(--color_main);
  border-radius: 999px;
  background-color: #fff;
  overflow: hidden;
}
.top-search .top-search-form input[type=text] {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  min-width: 0;
  height: 100%;
  border: none;
  background: none;
  color: #9AAEBC;
  padding: 0 0 0 24px;
  font-size: 1.1rem;
  font-weight: 700;
}
.top-search .top-search-form input[type=text]::-webkit-input-placeholder {
  color: #9AAEBC;
}
.top-search .top-search-form input[type=text]::-moz-placeholder {
  color: #9AAEBC;
}
.top-search .top-search-form input[type=text]:-ms-input-placeholder {
  color: #9AAEBC;
}
.top-search .top-search-form input[type=text]::-ms-input-placeholder {
  color: #9AAEBC;
}
.top-search .top-search-form input[type=text]::placeholder {
  color: #9AAEBC;
}
.top-search .top-search-form button {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 56px;
  height: 56px;
  border: none;
  background-color: var(--color_main);
  cursor: pointer;
}
.top-search .top-search-form button::before {
  content: "";
  display: block;
  width: 20px;
  height: 20px;
  background: url(../images/common/icon/icon_search_white.svg) no-repeat center/contain;
}
.top-search .top-search-tags {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 0.5em 1em;
  margin-bottom: 2.8rem;
}
.top-search .top-search-tags > li {
  display: block;
}
.top-search .top-search-tags > li > a {
  color: var(--color_main);
  font-size: 0.9rem;
  font-weight: 700;
  text-decoration: none;
}
.top-search .top-search-tags > li > a:hover {
  opacity: 1 !important;
  text-decoration: underline;
}
.top-search .top-search-cards {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 2rem;
  text-align: left;
}
@media only screen and (max-width: 1024px) {
  .top-search .top-search-cards {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
@media only screen and (min-width: 600px) and (max-width: 1024px) {
  .top-search .top-search-cards {
    max-width: 600px;
    margin: 0 auto;
  }
}
.top-search .top-search-cards-item {
  display: block;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 0px;
          flex: 1 1 0;
}
@media only screen and (max-width: 1024px) {
  .top-search .top-search-cards-item {
    -webkit-box-flex: 0;
        -ms-flex: none;
            flex: none;
  }
}
.top-search .top-search-cards-item > a {
  position: relative;
  display: block;
  height: 100%;
  background-color: #fff;
  border-radius: 20px;
  -webkit-box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
          box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
  padding: 2.5rem 0.5rem 3.5rem;
  text-align: center;
  text-decoration: none;
}
.top-search .top-search-cards-item > a:hover {
  opacity: 0.8 !important;
}
@media print, screen and (min-width: 1025px) {
  .top-search .top-search-cards-item > a:hover::before {
    right: 22px;
  }
}
.top-search .top-search-cards-item > a::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 1;
  width: 60px;
  height: 33px;
  background-color: var(--color_main);
  border-radius: 20px 0 20px 0;
}
.top-search .top-search-cards-item > a::before {
  content: "";
  position: absolute;
  right: 26px;
  bottom: 12px;
  z-index: 2;
  width: 8px;
  height: 8px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
  -webkit-transition: right 0.2s ease-in;
  transition: right 0.2s ease-in;
}
.top-search .top-search-cards-item-icon {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 70px;
  height: 70px;
  margin: 0 auto 1.25rem;
  border-radius: 50%;
  background-color: #E9F3FC;
}
.top-search .top-search-cards-item-icon img {
  display: block;
  width: 32px;
  height: 32px;
}
.top-search .top-search-cards-item-ttl {
  display: block;
  color: #0C2032;
  font-size: 1.1rem;
  font-weight: 700;
  line-height: 1.6em;
  margin-bottom: 0.5em;
}
@media only screen and (min-width: 600px) and (max-width: 1024px) {
  .top-search .top-search-cards-item-ttl {
    font-size: 1.25rem;
  }
}
@media only screen and (max-width: 599px) {
  .top-search .top-search-cards-item-ttl {
    font-size: 1.25rem;
  }
}
.top-search .top-search-cards-item-txt {
  display: block;
  color: #0C2032;
  font-size: clamp(0.7778rem, calc(-0.2382rem + 1.75vw), 0.9722rem);
  font-weight: 500;
  line-height: 1.7em;
}
@media only screen and (min-width: 600px) and (max-width: 1024px) {
  .top-search .top-search-cards-item-txt {
    font-size: 1.105rem;
  }
}
@media only screen and (max-width: 599px) {
  .top-search .top-search-cards-item-txt {
    font-size: 1rem;
    letter-spacing: 0.02em;
  }
}

/* INTRODUCTION
============================================================ */
.top-introduction {
  position: relative;
  width: 100%;
  aspect-ratio: 1920/750;
  background: url(../images/home/bg_introduction.jpg) no-repeat center/cover fixed;
  overflow: hidden;
}
@media only screen and (max-width: 1024px) {
  .top-introduction {
    background-attachment: scroll;
  }
}
@media only screen and (min-width: 600px) and (max-width: 1024px) {
  .top-introduction {
    background-position: center 85%;
    background-size: cover;
  }
}
@media screen and (max-width: 600px) {
  .top-introduction {
    background-image: url(../images/home/bg_introduction_sp.jpg);
    background-position: center 100%;
    background-size: cover;
    aspect-ratio: auto;
    height: 500px;
  }
}
.top-introduction::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #0E76BD;
  opacity: 0.2;
  mix-blend-mode: screen;
  pointer-events: none;
  z-index: 1;
}
.top-introduction .top-introduction-spell {
  z-index: 2;
  position: absolute;
  top: 62%;
  right: max(var(--sidePadding_base), calc((100% - var(--width_base)) / 2));
  width: 44.53%;
  max-width: 855px;
  -webkit-transform: translateY(-50%) rotate(-4deg);
          transform: translateY(-50%) rotate(-4deg);
}
@media only screen and (max-width: 1024px) {
  .top-introduction .top-introduction-spell {
    top: 65%;
    right: var(--sidePadding_base_mbl);
    width: 70%;
    max-width: none;
  }
}
@media only screen and (min-width: 600px) and (max-width: 1024px) {
  .top-introduction .top-introduction-spell {
    top: 49%;
  }
}
@media only screen and (max-width: 599px) {
  .top-introduction .top-introduction-spell {
    top: 49%;
  }
}
.top-introduction .top-introduction-spell img {
  display: block;
  width: 100%;
}

/* INTRO LIST
============================================================ */
.top-introList {
  position: relative;
  z-index: 2;
  background-color: #fff;
  padding: 3.5rem 0 4.5rem;
}
@media only screen and (max-width: 1024px) {
  .top-introList {
    padding: 2.5rem 0 3rem;
  }
}
.top-introList .top-introList-header {
  position: relative;
  max-width: 620px;
  margin: calc(-6.25% - 50px) auto 2.5rem;
  padding: 2.5rem 2rem 0;
  background-color: #fff;
  border-radius: 50px 50px 0 0;
  text-align: center;
}
@media only screen and (max-width: 1024px) {
  .top-introList .top-introList-header {
    max-width: calc(100% - 40px);
    margin-top: -90px;
    padding: 1.75rem 1.5rem 0;
    border-radius: 30px 30px 0 0;
  }
}
.top-introList .top-introList-header-en {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5em;
  margin-top: 1.5rem;
  color: var(--color_main);
  font-family: "Lato", sans-serif;
  font-size: 1.2rem;
  font-weight: 700;
  letter-spacing: 0.02em;
}
.top-introList .top-introList-header-en::before {
  content: "";
  display: block;
  width: 20px;
  height: 1px;
  background-color: var(--color_main);
}
.top-introList .top-introList-header-ja {
  color: #0C2032;
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.4em;
}
@media only screen and (min-width: 600px) and (max-width: 1024px) {
  .top-introList .top-introList-header-ja {
    font-size: 1.6rem;
  }
}
@media only screen and (max-width: 599px) {
  .top-introList .top-introList-header-ja {
    font-size: 1.75rem;
  }
}
.top-introList .top-introList-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.75rem 1.5rem;
}
@media only screen and (max-width: 1024px) {
  .top-introList .top-introList-grid {
    grid-template-columns: 1fr;
    gap: 1.25rem;
  }
}
@media only screen and (min-width: 600px) and (max-width: 1024px) {
  .top-introList .top-introList-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media only screen and (max-width: 599px) {
  .top-introList .top-introList-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 15px;
    max-width: 450px;
    margin: 0 auto;
  }
}
.top-introList .top-introList-grid > li {
  display: block;
}
.top-introList .top-introList-grid > li > a {
  display: block;
  border: 1px solid var(--color_main);
  border-radius: 12px;
  overflow: hidden;
  padding: 15px 15px 0;
  background-color: #F0F5F8;
  text-decoration: none;
}
@media only screen and (max-width: 599px) {
  .top-introList .top-introList-grid > li > a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: stretch;
        -ms-flex-align: stretch;
            align-items: stretch;
    min-height: 125px;
    padding: 0;
  }
}
.top-introList .top-introList-grid > li > a .thumb {
  display: block;
  aspect-ratio: 7/4;
  overflow: hidden;
  border-radius: 8px;
}
@media only screen and (max-width: 599px) {
  .top-introList .top-introList-grid > li > a .thumb {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
            flex: 0 0 50%;
    aspect-ratio: auto;
    border-radius: 0;
    padding: 6px 0 6px 6px;
  }
}
.top-introList .top-introList-grid > li > a .thumb img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -webkit-transition: -webkit-transform 0.3s ease-in;
  transition: -webkit-transform 0.3s ease-in;
  transition: transform 0.3s ease-in;
  transition: transform 0.3s ease-in, -webkit-transform 0.3s ease-in;
}
@media only screen and (max-width: 599px) {
  .top-introList .top-introList-grid > li > a .thumb img {
    border-radius: 8px;
  }
}
.top-introList .top-introList-grid > li > a .ttl {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 75px;
  padding: 0 3.5rem;
  background-color: #F0F5F8;
  color: var(--color_main);
  font-size: 1.1rem;
  font-weight: 700;
}
@media only screen and (max-width: 599px) {
  .top-introList .top-introList-grid > li > a .ttl {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
            flex: 0 0 50%;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    text-align: center;
    height: auto;
    padding: 0 1.25rem;
    font-size: 1.18rem;
  }
}
.top-introList .top-introList-grid > li > a .ttl::before {
  content: "";
  position: absolute;
  top: 50%;
  right: 16px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background-color: var(--color_main);
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  -webkit-transition: right 0.2s ease-in;
  transition: right 0.2s ease-in;
}
@media only screen and (max-width: 599px) {
  .top-introList .top-introList-grid > li > a .ttl::before {
    top: auto;
    bottom: 16px;
    -webkit-transform: none;
            transform: none;
  }
}
.top-introList .top-introList-grid > li > a .ttl::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 23px;
  width: 6px;
  height: 6px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  -webkit-transform: translateY(-50%) rotate(45deg);
          transform: translateY(-50%) rotate(45deg);
  -webkit-transition: right 0.2s ease-in;
  transition: right 0.2s ease-in;
}
@media only screen and (max-width: 599px) {
  .top-introList .top-introList-grid > li > a .ttl::after {
    top: auto;
    bottom: 22px;
    -webkit-transform: rotate(45deg);
            transform: rotate(45deg);
  }
}
.top-introList .top-introList-grid > li > a:hover {
  opacity: 1 !important;
}
@media print, screen and (min-width: 1025px) {
  .top-introList .top-introList-grid > li > a:hover .thumb img {
    -webkit-transform: scale(1.08);
            transform: scale(1.08);
  }
  .top-introList .top-introList-grid > li > a:hover .ttl::before {
    right: 8px;
  }
  .top-introList .top-introList-grid > li > a:hover .ttl::after {
    right: 15px;
  }
}

/* CHARM
============================================================ */
.top-charm {
  position: relative;
  z-index: 0;
  overflow: hidden;
  padding: 6rem 0;
  border-radius: 150px 150px 0 0;
  background: -webkit-gradient(linear, left top, left bottom, from(#fcfbe8), to(#e8f3fa));
  background: -webkit-linear-gradient(#fcfbe8 0%, #e8f3fa 100%);
  background: linear-gradient(#fcfbe8 0%, #e8f3fa 100%);
}
@media only screen and (min-width: 600px) and (max-width: 1024px) {
  .top-charm {
    border-radius: 100px 100px 0 0;
  }
}
@media only screen and (max-width: 599px) {
  .top-charm {
    border-radius: 50px 50px 0 0;
  }
}
.top-charm .top-charm-header {
  margin-bottom: 2.5rem;
  text-align: center;
}
.top-charm .top-charm-header-en {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5em;
  color: var(--color_main);
  font-family: "Lato", sans-serif;
  font-size: 1.2rem;
  font-weight: 700;
  letter-spacing: 0.02em;
}
.top-charm .top-charm-header-en::before {
  content: "";
  display: block;
  width: 20px;
  height: 1px;
  background-color: var(--color_main);
}
.top-charm .top-charm-header-ja {
  color: #0C2032;
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.4em;
}
@media only screen and (min-width: 600px) and (max-width: 1024px) {
  .top-charm .top-charm-header-ja {
    font-size: 1.6rem;
  }
}
@media only screen and (max-width: 599px) {
  .top-charm .top-charm-header-ja {
    font-size: 1.75rem;
  }
}
.top-charm .top-charm-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 3rem 3.5rem;
}
@media screen and (max-width: 700px) {
  .top-charm .top-charm-grid {
    grid-template-columns: 1fr;
    gap: 2rem;
  }
}
.top-charm .top-charm-grid > li {
  display: block;
  height: 100%;
}
@media screen and (max-width: 700px) {
  .top-charm .top-charm-grid > li {
    width: 100%;
    max-width: 450px;
    margin: 0 auto;
  }
}
.top-charm .top-charm-grid > li > a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  height: 100%;
  text-decoration: none;
}
.top-charm .top-charm-grid > li > a .thumb {
  position: relative;
  display: block;
  aspect-ratio: 5/2.8;
  overflow: hidden;
  border-radius: 20px;
}
.top-charm .top-charm-grid > li > a .thumb img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center 60%;
     object-position: center 60%;
  -webkit-transition: -webkit-transform 0.3s ease-in;
  transition: -webkit-transform 0.3s ease-in;
  transition: transform 0.3s ease-in;
  transition: transform 0.3s ease-in, -webkit-transform 0.3s ease-in;
}
.top-charm .top-charm-grid > li > a .thumb .num {
  position: absolute;
  top: 0;
  left: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 160px;
  height: 60px;
  background-color: var(--color_main);
  border-radius: 20px 0 20px 0;
}
@media only screen and (min-width: 600px) and (max-width: 1024px) {
  .top-charm .top-charm-grid > li > a .thumb .num {
    width: clamp(130px, calc(65.185px + 9.2593vw), 160px);
    height: clamp(40px, calc(-3.21px + 6.1728vw), 60px);
  }
}
@media only screen and (max-width: 599px) {
  .top-charm .top-charm-grid > li > a .thumb .num {
    width: clamp(95px, calc(36.41px + 15.625vw), 130px);
    height: clamp(35px, calc(26.63px + 2.2321vw), 40px);
  }
}
.top-charm .top-charm-grid > li > a .thumb .num img {
  display: block;
  width: auto;
  height: 36px;
}
@media only screen and (min-width: 600px) and (max-width: 1024px) {
  .top-charm .top-charm-grid > li > a .thumb .num img {
    height: 60%;
  }
}
@media only screen and (max-width: 599px) {
  .top-charm .top-charm-grid > li > a .thumb .num img {
    height: 60%;
  }
}
.top-charm .top-charm-grid > li > a .ttl {
  display: block;
  margin-top: 1.25rem;
  color: var(--color_main);
  font-size: 1.2rem;
  font-weight: 700;
  line-height: 1.6em;
}
@media only screen and (max-width: 1024px) {
  .top-charm .top-charm-grid > li > a .ttl {
    font-size: 1.25rem;
  }
}
.top-charm .top-charm-grid > li > a .txt {
  position: relative;
  display: block;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  margin-top: 0.5rem;
  padding-right: 2.5rem;
  color: #0C2032;
  font-size: 0.95rem;
  font-weight: 500;
  line-height: 1.8em;
}
@media only screen and (max-width: 1024px) {
  .top-charm .top-charm-grid > li > a .txt {
    font-size: 0.95rem;
  }
}
.top-charm .top-charm-grid > li > a .txt::before {
  content: "";
  position: absolute;
  top: 50%;
  right: 7px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background-color: var(--color_main);
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  -webkit-transition: right 0.2s ease-in;
  transition: right 0.2s ease-in;
}
.top-charm .top-charm-grid > li > a .txt::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 14px;
  width: 6px;
  height: 6px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  -webkit-transform: translateY(-50%) rotate(45deg);
          transform: translateY(-50%) rotate(45deg);
  -webkit-transition: right 0.2s ease-in;
  transition: right 0.2s ease-in;
}
.top-charm .top-charm-grid > li > a .more {
  display: block;
  margin-top: 1.25rem;
  border-top: 1px solid var(--color_main);
}
.top-charm .top-charm-grid > li > a:hover {
  opacity: 1 !important;
}
@media print, screen and (min-width: 1025px) {
  .top-charm .top-charm-grid > li > a:hover .thumb > img {
    -webkit-transform: scale(1.08);
            transform: scale(1.08);
  }
  .top-charm .top-charm-grid > li > a:hover .txt::before {
    right: 0;
  }
  .top-charm .top-charm-grid > li > a:hover .txt::after {
    right: 7px;
  }
}

/* YOUTUBE
============================================================ */
.top-youtube {
  position: relative;
  z-index: 0;
  width: 100%;
  aspect-ratio: 1920/600;
  overflow: hidden;
  background: url(../images/home/bg_youtube.jpg) no-repeat center/cover;
}
@media only screen and (max-width: 1024px) {
  .top-youtube {
    aspect-ratio: auto;
    padding: 3rem 0;
  }
}
@media only screen and (max-width: 599px) {
  .top-youtube {
    height: 460px;
    background-position: 10% center;
  }
}
.top-youtube::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  background-color: #0E76BD;
  opacity: 0.2;
  mix-blend-mode: screen;
  pointer-events: none;
}
.top-youtube .top-youtube-card {
  position: absolute;
  z-index: 2;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: 620px;
  max-width: calc(100% - 40px);
  padding: 3.2rem 2rem;
  background-color: rgba(255, 255, 255, 0.85);
  border-radius: 20px;
  text-align: center;
}
@media print, screen and (min-width: 1025px) and (max-width: 1259px) {
  .top-youtube .top-youtube-card {
    width: 460px;
    padding: 1.75rem 1.5rem;
  }
}
@media only screen and (max-width: 1024px) {
  .top-youtube .top-youtube-card {
    position: relative;
    top: auto;
    left: auto;
    -webkit-transform: none;
            transform: none;
    margin: 0 auto;
    padding: 2rem 1.5rem;
  }
}
@media only screen and (max-width: 599px) {
  .top-youtube .top-youtube-card {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    margin: 0;
  }
}
.top-youtube .top-youtube-card-icon {
  display: block;
  margin: 0 auto 1.25rem;
}
@media print, screen and (min-width: 1025px) and (max-width: 1259px) {
  .top-youtube .top-youtube-card-icon {
    margin-bottom: 0.75rem;
  }
}
.top-youtube .top-youtube-card-icon img {
  display: block;
  width: 68px;
  height: auto;
  margin: 0 auto;
}
@media print, screen and (min-width: 1025px) and (max-width: 1259px) {
  .top-youtube .top-youtube-card-icon img {
    width: 48px;
  }
}
.top-youtube .top-youtube-card-txt {
  color: #0C2032;
  font-size: 1.1rem;
  font-weight: 700;
  line-height: 1.6em;
  margin-bottom: 1.75rem;
}
@media print, screen and (min-width: 1025px) and (max-width: 1259px) {
  .top-youtube .top-youtube-card-txt {
    font-size: 1rem;
    margin-bottom: 1rem;
  }
}
.top-youtube .top-youtube-card-btn {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  width: 300px;
  height: 60px;
  min-height: 60px;
  border-radius: 999px;
  font-size: 1rem;
}
@media only screen and (max-width: 1024px) {
  .top-youtube .top-youtube-card-btn {
    width: 280px;
  }
}
.top-youtube .top-youtube-card-btn::after, .top-youtube .top-youtube-card-btn[target=_blank]::after {
  width: 9px;
  height: 9px;
  border: none;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  background: none;
  -webkit-mask: none;
          mask: none;
  background-color: transparent;
  -webkit-transform: translateY(-50%) rotate(45deg);
          transform: translateY(-50%) rotate(45deg);
  top: 50%;
  right: 1.5em;
  -webkit-transition: right 0.2s ease-in;
  transition: right 0.2s ease-in;
}
.top-youtube .top-youtube-card-btn:hover {
  opacity: 0.8 !important;
}
@media print, screen and (min-width: 1025px) {
  .top-youtube .top-youtube-card-btn:hover::after {
    right: 1em;
  }
}

/* CALENDAR
============================================================ */
.top-calendar {
  padding: 6rem 0;
  text-align: center;
}
.top-calendar .top-calendar-header {
  margin-bottom: 2.5rem;
}
.top-calendar .top-calendar-header-en {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5em;
  color: var(--color_main);
  font-family: "Lato", sans-serif;
  font-size: 1.2rem;
  font-weight: 700;
  letter-spacing: 0.02em;
}
.top-calendar .top-calendar-header-en::before {
  content: "";
  display: block;
  width: 20px;
  height: 1px;
  background-color: var(--color_main);
}
.top-calendar .top-calendar-header-ja {
  color: #0C2032;
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.4em;
}
@media only screen and (min-width: 600px) and (max-width: 1024px) {
  .top-calendar .top-calendar-header-ja {
    font-size: 1.6rem;
  }
}
@media only screen and (max-width: 599px) {
  .top-calendar .top-calendar-header-ja {
    font-size: 1.75rem;
  }
}
.top-calendar .top-calendar-embed {
  max-width: var(--width_base);
  margin: 0 auto 3rem;
  -webkit-box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
          box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}
.top-calendar .top-calendar-embed iframe {
  display: block;
  width: 100%;
  aspect-ratio: 800/600;
  border: none;
}
.top-calendar .top-calendar-moreBtn {
  margin: 0 auto;
  height: 60px;
  min-height: 60px;
  font-size: 1rem;
  width: 300px;
  border-radius: 999px;
}
@media only screen and (max-width: 1024px) {
  .top-calendar .top-calendar-moreBtn {
    width: 280px;
  }
}
.top-calendar .top-calendar-moreBtn::after {
  width: 9px;
  height: 9px;
  border: none;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  background: none;
  -webkit-transform: translateY(-50%) rotate(45deg);
          transform: translateY(-50%) rotate(45deg);
  top: 50%;
  right: 1.5em;
  -webkit-transition: right 0.2s ease-in;
  transition: right 0.2s ease-in;
}
.top-calendar .top-calendar-moreBtn:hover {
  opacity: 0.8 !important;
}
@media print, screen and (min-width: 1025px) {
  .top-calendar .top-calendar-moreBtn:hover::after {
    right: 1em;
  }
}

/* BANNER LINKS
============================================================ */
.top-bannerLinks {
  padding: 6.6rem 0 0;
  background-color: #E8E8E8;
}
.top-bannerLinks .top-bannerLinks-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, 225px);
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 100%;
  gap: 1rem;
}
@media screen and (min-width: 1260px) {
  .top-bannerLinks .top-bannerLinks-grid {
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
  }
}
@media only screen and (max-width: 599px) {
  .top-bannerLinks .top-bannerLinks-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
.top-bannerLinks .top-bannerLinks-grid > li {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 225px;
          flex: 0 0 225px;
  width: 225px;
}
@media only screen and (max-width: 599px) {
  .top-bannerLinks .top-bannerLinks-grid > li {
    -webkit-box-flex: 0;
        -ms-flex: 0 1 calc((100% - 1rem) / 2);
            flex: 0 1 calc((100% - 1rem) / 2);
    width: auto;
  }
}
.top-bannerLinks .top-bannerLinks-grid > li > a {
  display: block;
  aspect-ratio: 225/110;
  border: 1px solid #BCBCBC;
  overflow: hidden;
  text-decoration: none;
  -webkit-transition: opacity 0.2s ease-in;
  transition: opacity 0.2s ease-in;
}
.top-bannerLinks .top-bannerLinks-grid > li > a img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.top-bannerLinks .top-bannerLinks-grid > li > a:hover {
  opacity: 0.8 !important;
}

/* BANNER LINKS 02
============================================================ */
.top-bannerLinks02 {
  padding: 1rem 0 6.6rem;
  background-color: #E8E8E8;
}
.top-bannerLinks02 .top-bannerLinks02-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, 225px);
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 100%;
  gap: 1rem;
}
@media screen and (min-width: 1260px) {
  .top-bannerLinks02 .top-bannerLinks02-grid {
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
  }
}
@media only screen and (max-width: 599px) {
  .top-bannerLinks02 .top-bannerLinks02-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
.top-bannerLinks02 .top-bannerLinks02-grid > li {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 225px;
          flex: 0 0 225px;
  width: 225px;
}
@media only screen and (max-width: 599px) {
  .top-bannerLinks02 .top-bannerLinks02-grid > li {
    -webkit-box-flex: 0;
        -ms-flex: 0 1 calc((100% - 1rem) / 2);
            flex: 0 1 calc((100% - 1rem) / 2);
    width: auto;
  }
}
.top-bannerLinks02 .top-bannerLinks02-grid > li > a {
  display: block;
  aspect-ratio: 225/110;
  border: 1px solid #BCBCBC;
  overflow: hidden;
  text-decoration: none;
  -webkit-transition: opacity 0.2s ease-in;
  transition: opacity 0.2s ease-in;
}
.top-bannerLinks02 .top-bannerLinks02-grid > li > a img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.top-bannerLinks02 .top-bannerLinks02-grid > li > a:hover {
  opacity: 0.8 !important;
}

/* SNS
============================================================ */
.top-sns {
  padding: 5rem 0;
  background-color: var(--color_main);
  text-align: center;
}
.top-sns .top-sns-spell {
  margin-bottom: 2rem;
}
.top-sns .top-sns-spell img {
  display: block;
  margin: 0 auto;
  width: auto;
  height: 40px;
}
@media only screen and (max-width: 1024px) {
  .top-sns .top-sns-spell img {
    height: 28px;
  }
}
.top-sns .top-sns-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 1.5rem;
  max-width: var(--width_base);
  margin: 0 auto;
}
@media only screen and (max-width: 1024px) {
  .top-sns .top-sns-list {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
}
.top-sns .top-sns-list > li {
  display: block;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 0px;
          flex: 1 1 0;
}
@media only screen and (max-width: 1024px) {
  .top-sns .top-sns-list > li {
    -webkit-box-flex: 0;
        -ms-flex: none;
            flex: none;
    width: 100%;
    max-width: 360px;
  }
}
.top-sns .top-sns-list > li > a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  height: 90px;
  padding: 0 2rem;
  background-color: #fff;
  border: 3px solid #F5E740;
  border-radius: 999px;
  -webkit-transition: opacity 0.2s ease-in;
  transition: opacity 0.2s ease-in;
}
.top-sns .top-sns-list > li > a img {
  display: block;
  width: auto;
  height: 40px;
}
.top-sns .top-sns-list > li > a:hover {
  opacity: 0.8 !important;
}
.top-sns .top-sns-list > li:nth-child(2) > a img {
  height: 29px;
}