@charset "utf-8";

:root {
  --color-mono0: #FFFFFF;
  --color-mono50: #FFFDF7;
  --color-mono100: #FAF2E6;
  --color-mono200: #DCD5CC;
  --color-mono300: #C5BDB3;
  --color-mono400: #AEA79F;
  --color-mono500: #706962;
  
  --color-blue100: #D5F3F8;
  --color-blue200: #B6E0FF;
  --color-blue300: #75C9FF;
  --color-blue400: #45B3F7;
  --color-blue500: #009DD2;
  --color-blue600: #0087E2;
  --color-blue700: #005CAB;
  --color-blue950: #083044;

  --color-green100: #DEFBDD;
  --color-green200: #CEF5BD;
  --color-green300: #BAF85E;
  --color-green400: #9AED27;
  --color-green500: #48D647;
  --color-green600: #00A470;
  --color-green700: #008448;
  
  --color-orange100: #FFF5C2;
  --color-orange200: #FFEB88;
  --color-orange300: #FFDC4A;
  --color-orange400: #FFCE2D;
  --color-orange500: #FFA400;
  --color-orange600: #E77400;

  --color-note-try: #009EBE;
  --color-note-sub-try: #2CC6E4;
  --color-note-mini-try: #EBFBFE;
  --color-note-find: #F54680;
  --color-note-look: #15AB0A;

  --color-hakushu-dark: #B2C903;
  --color-hakushu-thin: #F7F9E7;
  --color-kitaalps-dark: #A1B2F3;
  --color-kitaalps-thin: #F3F6FF;
  --color-okudaisen-dark: #FFD401;
  --color-okudaisen-thin: #FDFCEF;
  --color-aso-dark: #59B9C6;
  --color-aso-thin: #F5FEFF;

  --color-class-online: #105CD5;

  --color-hover-bg: #FFFBE6;

  --color-alert: #DC0909;

}

@font-face{
  font-family:"Noto Sans JP";
  font-style:normal;
  font-weight:500;
  font-display:swap;
  src:url("/common/fonts/NotoSansJP-Medium.woff2") format("woff2");
}
@font-face{
  font-family:"Noto Sans JP";
  font-style:bold;
  font-weight:600;
  font-display:swap;
  src:url("/common/fonts/NotoSansJP-Bold.woff2") format("woff2");
}
@font-face{
  font-family:"Noto Sans JP Extra";
  font-style:normal;
  font-weight:500;
  font-display:swap;
  src:url("/common/fonts/NotoSansJP-Extra-Medium.woff2") format("woff2");
}
@font-face{
  font-family:"Noto Sans JP Extra";
  font-style:bold;
  font-weight:600;
  font-display:swap;
  src:url("/common/fonts/NotoSansJP-Extra-Bold.woff2") format("woff2");
}


html {
  --window-width: 100vw
}

.mizuiku-contents {
  min-width: 960px;
  font-family:"Noto Sans JP","Noto Sans JP Extra","Yu Gothic Medium","游ゴシック Medium",YuGothic,"游ゴシック体","ヒラギノ角ゴ Pro W3","メイリオ",sans-serif;
  font-weight:500;
  background-color:var(--color-mono50);
  color: var(--color-blue950);
  overflow: clip;
  box-sizing: border-box;
}

.mizuiku-contents * {
  box-sizing: border-box;
}

h1,h2,h3,p,ul,ol,dl,dd {
  margin: 0;
  padding: 0;
}

.mizuiku-contents img {
    max-width:100%;
    height: auto;
}

.mizuiku-contents li {list-style: none;}

.mizuiku-contents a {
  color: var(--color-blue950);
  text-decoration: none;
}

button {
  padding: 0;
  border: none;
  background: none;
  color: var(--color-blue950);
  cursor: pointer;
}

.eco_all_wrap {
  min-width: 960px;
}

.mizuiku-contents rt {
  height: 1em;
  line-height: 1;
}
.rt-tight {
  letter-spacing: -0.5em;
}

@media screen and (min-width: 768px) and (max-width: 1400px) {
  .w-display-max {
    width: max(960px, var(--window-width));
    padding-right: 100px !important;
  }
}

@media screen and (min-width: 768px) {
  .pc_none {
    display: none !important;
  }
}

@media screen and (max-width: 767px) {
  .mizuiku-contents {
    min-width: auto;
  }
  .sp_none {
    display: none !important;
  }
}

/* =====================================
  mizuiku-header
===================================== */
.mizuiku-header {
  padding: 16px 0 12px;
}
.mizuiku-header__inner {
  max-width: 1164px;
  margin: 0 auto;
}
.mizuiku-header__logo {
  font-size: 0;
}
.mizuiku-header__logo-link {
  display: inline-block;
}
@media screen and (min-width: 768px) and (max-width: 1399px) {
  .mizuiku-header {
    padding-left: max(10px, calc((var(--window-width) - 1164px) / 2)) !important;
  }
  .mizuiku-header__inner {
    max-width: none !important;
  }
}

@media screen and (max-width: 767px) {
  .mizuiku-header {
    padding: 20px 20px 10px;
  }
  .mizuiku-header__logo-img {
    transform: scale(0.888);
    transform-origin: top left;
  }
}


/* =====================================
  breadcrumbs
===================================== */
#breadcrumbs {
  max-width: 1164px;
  margin: 0 auto;
  padding: 12px 0 12px;
  overflow-x: auto;
}
.mizuiku-header + #breadcrumbs {
  padding-top: 0;
}
.breadcrumb__list,
.breadcrumbs__list {
  display: flex;
  width: max-content;
}
.breadcrumbs__item {
  font-size: 0.75rem;/* 12px */
  line-height: 1.5;
  letter-spacing: 0.36px;
}
.breadcrumbs__item + .breadcrumbs__item {
  padding-left: 28px;
  position: relative;
}
.breadcrumbs__item + .breadcrumbs__item::before {
  content: "";
  width: 5.19px;
  height: 9.55px;
  background: url(/common/img/icon_arrow_right_02.svg) no-repeat center / contain;
  position: absolute;
  top: calc(50% + 1px);
  left: 12px;
  transform: translateY(-50%);
}
#breadcrumbs .breadcrumbs__link {
  color: var(--color-blue700);
}
.breadcrumbs__link--home {
  display: flex;
  align-items: center;
  height: 100%;
}

@media (hover: hover) {
  #breadcrumbs .breadcrumbs__link:hover {
    text-decoration: underline;
  }
}

@media screen and (min-width: 768px) and (max-width: 1400px) {
  #breadcrumbs {
    width: max(960px, var(--window-width));
    max-width: none;
    margin: 0;
    padding-left: max(10px, calc((var(--window-width) - 1164px) / 2));
  }
  .breadcrumb__list,
  .breadcrumbs__list {
    width: 100%;
    max-width: 1184px;
  }
}

@media screen and (max-width: 767px) {
  #breadcrumbs {
    padding: 10px 20px 12px;
  }
  .mizuiku-header + #breadcrumbs {
    padding-top: 0;
  }
  .breadcrumbs__item + .breadcrumbs__item {
    padding-left: 18px;
  }
  .breadcrumbs__item + .breadcrumbs__item::before {
    left: 6.78px;
  }
}


/* =====================================
  side-navi
===================================== */
.side-navi {
  position: relative;
}

.side-navi__buttons-wrap {
  position: fixed;
  top: 50%;
  right: 0; 
  opacity: 1;
  transition: 0.3s; 
  z-index: 120;
}
.side-navi__buttons-wrap--hidden { opacity: 0; visibility: hidden; }

.side-navi__buttons {
  display: flex;
  flex-direction: column;
  border-radius: 16px 0 0 16px;
  overflow: hidden;
  box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.18);
}
.side-navi__buttons--active {
  box-shadow: none;
  overflow: visible;
}

.side-navi__button {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 4px;
  width: 85px;
  height: 85px;
  padding: 4px; 
  background: #FFF5E0;
  border: none;
  border-bottom: 1px solid var(--color-mono200); 
  font-size: 0.75rem;/* 12px */
  font-weight: bold;
  line-height: 1.5;
  letter-spacing: 0.39px;
  cursor: pointer;
  transition: 0.2s;
  position: relative;
}
.side-navi__button.is-active {
  background: var(--color-mono50);
  border-color: var(--color-mono50);
}
.side-navi__buttons-item:has(+ .side-navi__buttons-item .is-active) .side-navi__button {
  border-color: var(--color-mono50);
}
.side-navi__button.is-active::before,
.side-navi__button.is-active::after {
  content: "";
  width: 16px;
  height: 16px;
  background-color: transparent;
  position: absolute;
  right: 0;
  z-index: 1;
}
.side-navi__button.is-active::before {
  border-bottom-right-radius: 16px;
  box-shadow: 5px 5px 0 5px var(--color-mono50);;
  top: -16px;
}
.side-navi__button.is-active::after {
  border-top-right-radius: 16px;
  box-shadow: 5px -5px 0 5px var(--color-mono50);;
  bottom: -16px;
}
.side-navi__buttons-item:first-of-type .side-navi__button,
.side-navi__buttons-item:last-of-type .side-navi__button {
  border-bottom: none;
}
.side-navi__buttons--active .side-navi__buttons-item:first-of-type .side-navi__button {
  border-top-left-radius: 16px;
}
.side-navi__buttons--active .side-navi__buttons-item:last-of-type .side-navi__button {
  border-bottom-left-radius: 16px;
}

.side-navi__button--menu {
  gap: 13px;
  padding-top: 14px;
  background-color: var(--color-blue700);
  color: var(--color-mono0);
}

.side-navi__button-icon {
  font-size: 0;
}

/* 閉じる切り替え */
.side-navi__button-close {
  display: none;
}
.side-navi__button.is-active .side-navi__button-close {
  display: block;
}
.side-navi__button.is-active .side-navi__button-text {
  display: none;
}
.side-navi__button.is-active .side-navi__button-icon {
  width: 28px;
  height: 28px;
  background: url(/common/img/icon_close.svg) no-repeat center / contain;
}
.side-navi__button.is-active .side-navi__button-icon img {
  display: none;
}

/* オーバーレイ */
.side-navi__overlay {
  width: 100%;
  height: 100%;
  background: rgba(0, 14, 27, 0.80);
  opacity: 0;
  visibility: hidden;
  position: fixed;
  top: 0;
  left: 0;
  transition: 0.3s;
  z-index: 90;
}
.side-navi__overlay--active { opacity: 1; visibility: visible; }

/* メニュー内 */
.side-navi__panel {
  display: none;
  width: 400px;
  height: 100%;
  padding: 80px 0 40px;
  background: var(--color-mono50);
  border-bottom-left-radius: 40px;
  overflow-y: auto;
  transform: translateX(100%);
  transition: 0.3s;
  position: fixed;
  top: 0;
  right: 0;
  z-index: 100;
}
.side-navi__panel--display { display: block; }
.side-navi__panel--active { transform: translateX(0); }

.side-navi__panel-head {
  padding: 0 40px 16px;
  border-bottom: 1px solid var(--color-mono200);
}

.side-navi__list {
  padding: 0 40px;
}

.side-navi__list-item {
  margin-top: 24px;
}
.side-navi__list-item:first-of-type {
  margin-top: 18px;
}

.side-navi__link {
  display: block;
  padding-right: 32px;
  color: var(--color-blue950);
  font-size: 1.0625rem;/* 17px */
  font-weight: bold;
  line-height: 1.5;
  letter-spacing: 0.54px;
  position: relative;
  transition: 0.2s;
}
.side-navi__link::after {
  content: "";
  width: 19px;
  height: 19px;
  background: var(--color-blue700) url(/common/img/icon_arrow_right_01.svg) no-repeat center / 5px auto;
  border-radius: 9999px;
  position: absolute;
  top: 50%;
  right: 2px;
  transform: translateY(-50%);
  transition: 0.2s;
}
.side-navi__link--top {
  padding-left: 27px;
  padding-right: 0;
}
.side-navi__link--top::after {
  transform: translateY(-50%) rotate(180deg);
  left: 0;
  right: auto;
}
.side-navi__link--list {
  padding-left: 8px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--color-mono200);
}
.side-navi__link--list::after {
  transform: translateY(calc(-50% - 6px));
}

.side-navi__category-top {
  margin-top: 26px;
  padding: 0 32px;
}
.side-navi__link--category-top {
  display: flex;
  align-items: center;
  min-height: 78px;
  padding: 14px 23px 14px 68px;
  border-radius: 8px;
  font-size: 1.3125rem;/* 21px */
  font-weight: bold;
  line-height: 1.2;
  letter-spacing: 0.66px;
}
.side-navi__link--category-top::before {
  content: "";
  width: 48px;
  height: 48px;
  background: no-repeat center / contain;
  position: absolute;
  top: 50%;
  left: 8px;
  transform: translateY(-50%);
}
.side-navi__link--what::before {
  background-image: url(/common/img/icon_navi_what.svg);
}
.side-navi__link--class::before {
  background-image: url(/common/img/icon_navi_class.svg);
}
.side-navi__link--gakko::before {
  background-image: url(/common/img/icon_navi_gakko.svg);
}
.side-navi__link--note::before {
  background-image: url(/common/img/icon_navi_note.svg);
}
.side-navi__link--category-top::after {
  right: 10px;
}
.side-navi__list-item-sub {
  display: block;
  font-size: 0.9375rem;/* 15px */
  font-weight: bold;
  line-height: 1.5;
  letter-spacing: 0.48px;
}

/* アコーディオン */
.side-navi__list-item:has(.side-navi__accordion) {
  padding-bottom: 12px;
  border-bottom: 1px solid var(--color-mono200);
}
.side-navi__accordion {
  display: block;
  width: 100%;
  padding: 0 24px 0 8px;
  border: none;
  background: none;
  color: var(--color-blue950);
  font-size: 1.0625rem;/* 17px */
  font-weight: bold;
  line-height: 1.5;
  letter-spacing: 0.54px;
  text-align: left;
  position: relative;
  transition: 0.2s;
  cursor: pointer;
}
.side-navi__accordion::after {
  content: "";
  width: 19px;
  height: 19px;
  background: url(/common/img/icon_accordion.svg) no-repeat center / 9px auto;
  border: 1px solid var(--color-blue700);
  border-radius: 9999px;
  position: absolute;
  top: 50%;
  right: 2px;
  transform: translateY(-50%);
  transition: 0.2s;
}
.side-navi__accordion.is-open::after {
  background-image: url(/common/img/icon_accordion_open.svg);
  background-position: center calc(50% + 1px);
}

.side-navi__submenu {
  height: 0;
  padding-left: 20px;
  overflow: hidden;
  visibility: hidden;
  opacity: 0;
  transition: 0.3s;
}
.side-navi__submenu.is-open {
  height: var(--content-height);
  visibility: visible;
  opacity: 1;
}
.side-navi__submenu > * {
  min-height: 0;
}

.side-navi__submenu-item {
  margin-top: 12px;
}
.side-navi__submenu-item:last-of-type {
  padding-bottom: 4px;
}
.side-navi__submenu-link {
  display: block;
  padding-right: 32px;
  color: var(--color-blue950);
  font-size: 0.9375rem;/* 15px */
  line-height: 1.5;
  letter-spacing: 0.48px;
  transition: 0.2s;
  position: relative;
}
.side-navi__submenu-link:hover {
  color: var(--color-blue700);
  text-decoration: underline;
}
.side-navi__submenu-link::after {
  content: "";
  width: 6px;
  height: 11px;
  background: url(/common/img/icon_arrow_right_02.svg) no-repeat center / contain;
  position: absolute;
  top: 50%;
  right: 9px;
  transform: translateY(-50%);
}
.side-navi__submenu-link[target="_blank"]::after {
  width: 12.6px;
  height: 12.595px;
  background-image: url(/common/img/icon_blank_02.svg);
  right: 6px;
}

/* お問い合わせ */
.side-navi__inquiry {
  margin-top: 56px;
  padding: 0 45px;
  color: var(--color-blue950);
}
.side-navi__inquiry-inner {
  padding: 24px 10px;
  background-color: var(--color-mono100);
  border-radius: 8px;
}
.side-navi__inquiry-title {
  font-size: 1.125rem;/* 18px */
  font-weight: bold;
  line-height: 1.5;
  letter-spacing: 0.54px;
  text-align: center;
}
.side-navi__inquiry-text {
  margin-top: 2px ;
  font-size: 0.875rem;/* 14px */
  line-height: 1.5;
  letter-spacing: 0.42px;
  text-align: center;
}
.side-navi__inquiry-number-wrap {
  margin-top: 16px;
  padding: 0 9px;
}
.side-navi__inquiry-number {
  display: flex;
  justify-content: center;
  align-items: center;
  padding-bottom: 4px;
  border-bottom: 1px solid var(--color-mono200);
  color: var(--color-blue950);
  font-size: 1.5rem;/* 24px */
  font-weight: bold;
  line-height: 1.5;
  letter-spacing: 0.72px;
  text-align: center;
  vertical-align: middle;
}
.side-navi__inquiry-number::before {
  content: "";
  display: inline-block;
  width: 24px;
  height: 24px;
  margin-right: 8px;
  background: url(/common/img/icon_phone.svg) no-repeat center / contain;
  vertical-align: middle;
}
.side-navi__inquiry-hours {
  margin-top: 8px;
  padding: 0 9px;
  font-size: 0.75rem;/* 12px */
  line-height: 1.5;
  letter-spacing: 0.36px;
}

/* 全体menu */
.side-navi__panel#navi-menu {
  width: 100%;
  max-width: 1244px;
  padding: 0 0 135px;
  background: #FFF5E0;
}
.side-navi__panel-inner {
  margin-top: 60px;
  padding: 0 40px 0 48px;
  position: relative;
}
.side-navi__close {
  position: absolute;
  top: -41px;
  right: 40px;
  background: none;
  border: none;
  color: var(--color-blue950); 
  font-size: 0.8125rem;/* 13px */
  font-weight: bold;
  line-height: 1.5;
  letter-spacing: 0.39px;
  cursor: pointer;
}
.side-navi__close::before {
  content: "";
  display: block;
  width: 35px;
  height: 35px;
  margin-bottom: 6px;
  background: url(/common/img/icon_close.svg) no-repeat center / contain;
}
#navi-menu .side-navi__link--top {
  display: inline-block;
}
.side-navi__content {
  display: flex;
  gap: 12px;
  margin-top: 23px;
}
.side-navi__content-item {
  flex: 1;
  padding: 8px 0 32px;
  background-color: var(--color-mono50);
  border-radius: 12px;
}
#navi-menu .side-navi__category-top {
  margin-top: 0;
  padding: 0 4px;
}
#navi-menu .side-navi__list-item-sub {
  font-size: 0.8125rem;/* 13px */
  letter-spacing: 0.42px;
}
#navi-menu .side-navi__link--category-top {
  min-height: 60px;
  padding: 8px 30px 8px 52px;
  font-size: 1.0625rem;/* 17px */
  line-height: 1.5;
  letter-spacing: 0.54px;
}
#navi-menu .side-navi__link--category-top::before {
  width: 40px;
  height: 40px;
}
#navi-menu .side-navi__list {
  padding: 0 20px;
}
#navi-menu .side-navi__link--list,
#navi-menu .side-navi__accordion,
#navi-menu .side-navi__submenu-link {
  font-size: 0.9375rem;/* 15px */
  letter-spacing: 0.48px;
}


/* page-top */
.side-navi__page-top {
  margin-top: 8px;
  width: 85px;
  height: 64px;
  background-color: var(--color-mono50);
  border-radius: 16px 0 0 16px;
  border: none;
  box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.18);
  transition: 0.2s;
  cursor: pointer;;
}
.side-navi__page-top--hidden {
  opacity: 0;
  visibility: hidden;
}


@media (hover: hover) {
  .side-navi__button:hover {
    background-color: var(--color-mono50);
  }
  .side-navi__button--menu:hover {
    background-color: var(--color-blue600);
  }
  .side-navi__link:hover {
    color: var(--color-blue700);
  }
  .side-navi__link:hover::after {
    transform: translateY(-50%) scale(1.21);
  }
  .side-navi__link--top:hover {
    text-decoration: underline;
  }
  .side-navi__link--top:hover::after {
    transform: translateY(-50%) scale(1.21) rotate(180deg);
  }
  .side-navi__link--list:hover {
    border-color: var(--color-blue700);
  }
  .side-navi__link--list:hover::after {
    transform: translateY(calc(-50% - 6px)) scale(1.21);
  }
  .side-navi__link--category-top:hover {
    background-color: var(--color-mono100);
    text-decoration: underline;
  }
}

@media screen and (min-width: 768px) and (max-width: 1400px) {
  .mizuiku-contents {
    padding-right: 85px;
  }
}

@media screen and (max-width: 767px) {
  .side-navi__buttons-wrap {
    display: flex;
    flex-direction: column-reverse;
    align-items: flex-end;
    opacity: 0;
    visibility: hidden; 
    top: auto;
    bottom: 0;
    left: 0;
    right: 0;
  }
  .side-navi__buttons-wrap--visible { opacity: 1; visibility: visible; }
  .side-navi__buttons-wrap--hidden { opacity: 0; visibility: hidden; }

  .side-navi__buttons {
    flex-direction: row;
    width: 100%;
    height: 80px;
    border-top: 2px solid var(--color-mono200);
    border-radius: 12px 12px 0 0;
    box-shadow: 0 0 13px 0 rgba(0, 0, 0, 0.30);
    overflow: hidden;
  }
  .side-navi__buttons--active {
    padding-bottom: 0;
    border-top: none;
    box-shadow: none;
    overflow: hidden;
  }

  .side-navi__buttons-item {
    width: 25%;
  }
  .side-navi__buttons-item--menu { display: none; }

  .side-navi__button {
    width: 100%;
    height: 100%;
    padding: 4px 0;
    border: none;
    border-right: 2px solid var(--color-mono200);
    font-size: 0.75rem;/* 12px */
    line-height: 1.3;
    letter-spacing: 0.36px;
    transition: none;
  }
  .side-navi__button.is-active {
    border-color: var(--color-mono200);
  }
  .side-navi__buttons-item:has(+ .side-navi__buttons-item .is-active) .side-navi__button {
    border-color: var(--color-mono200);
  }

  .side-navi__buttons-item:last-of-type .side-navi__button {
    border-right: none;
  }
  .side-navi__buttons--active .side-navi__buttons-item:last-of-type .side-navi__button {
    border-bottom-left-radius: 0;
  }
  .side-navi__button.is-active::before,
  .side-navi__button.is-active::after {
    content: none;
  }
  .side-navi__buttons--active .side-navi__button {
    padding-top: 6px;
  }

  .side-navi__button-icon img {
    width: 28px;
  }

  .side-navi__panel {
    transform: none;
    width: 100%;
    opacity: 0;
    visibility: hidden;
    padding: 40px 0 100px;
  }
  .side-navi__panel--active { opacity: 1; visibility: visible; }

  .side-navi__link {
    font-size: 1rem;/* 16px */
    letter-spacing: 0.48px;
  }

  .side-navi__panel-head {
    padding: 0 32px 12px;
  }

  .side-navi__category-top {
    margin-top: 32px;
  }
  .side-navi__link--category-top {
    min-height: 47px;
    padding: 0 23px 0 48px;
    font-size: 1.25rem;/* 20px */
    line-height: 1.3;
    letter-spacing: 0.6px;

  }
  .side-navi__link--category-top::before {
    width: 40px;
    height: 40px;
    left: 0;
  }
  .side-navi__link--category-top::after {
    width: 23px;
    height: 23px;
    right: 2px;
  }
  .side-navi__list-item-sub {
    font-size: 0.875rem;/* 14px */
    letter-spacing: 0.42px;
  }

  .side-navi__list {
    padding: 0 32px;
  }

  .side-navi__list-item:first-of-type {
    margin-top: 32px;
  }

  .side-navi__accordion {
    font-size: 1rem;/* 16px */
    letter-spacing: 0.48px;
  }
  .side-navi__submenu-item {
    margin-top: 11px;
  }
  .side-navi__submenu-link {
    font-size: 0.875rem;/* 14px */
    letter-spacing: 0.42px;
  }

  .side-navi__submenu-link[target="_blank"]::after {
    width: 11.2px;
    height: 11.196px;
  }


  .side-navi__inquiry {
    margin-top: 48px;
    padding: 0 32pxx;
  }

  .side-navi__page-top {
    width: 48px;
    height: 48px;
    border-radius: 8px;
    box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.15);
    position: absolute;
    right: 8px;
    bottom: calc(80px + 8px);
  }
  .side-navi__page-top--hidden {
    display: none;
  }
}


/* =====================================
  bg-wave
===================================== */
.bg-wave {
  --bg-color-01: #45B3F7;
  --bg-color-02: #8CCFF7;
  position: relative;
  background: repeating-linear-gradient(-55deg, var(--bg-color-02) 0px, var(--bg-color-02) 1px, var(--bg-color-01) 1px, var(--bg-color-01) 25px);
  -webkit-mask-image: 
    url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 86" preserveAspectRatio="none"><path d="M0 85.9999L1440 86L1440 28.007C1440 28.007 1211.87 84.7837 1063.62 85.9387C837.603 87.6998 688.243 6.65876 462.282 0.300452C267.998 -5.16651 0 65.7884 0 65.7884L0 85.9999Z" fill="black"/></svg>'),
    linear-gradient(#000, #000);
  mask-image: 
    url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 86" preserveAspectRatio="none"><path d="M0 85.9999L1440 86L1440 28.007C1440 28.007 1211.87 84.7837 1063.62 85.9387C837.603 87.6998 688.243 6.65876 462.282 0.300452C267.998 -5.16651 0 65.7884 0 65.7884L0 85.9999Z" fill="black"/></svg>'),
    linear-gradient(#000, #000);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: top center, 0 86px;
  mask-position: top center, 0 85px;
  -webkit-mask-size: 100% 86px, 100% 100%;
  mask-size: 100% 86px, 100% 100%;
}

@media screen and (max-width: 767px) {
.bg-wave {
    -webkit-mask-image: 
      url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 375 25" preserveAspectRatio="none"><path d="M0 24.5711L375 24.5712L375 7.02907C375 7.02907 315.59 21.2787 276.985 21.5686C218.126 22.0105 179.23 1.67116 120.386 0.0753714C69.791 -1.29671 0 16.5113 0 16.5113L0 24.5711Z" fill="black"/></svg>'),
      linear-gradient(#000, #000);
    mask-image: 
      url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 375 25" preserveAspectRatio="none"><path d="M0 24.5711L375 24.5712L375 7.02907C375 7.02907 315.59 21.2787 276.985 21.5686C218.126 22.0105 179.23 1.67116 120.386 0.0753714C69.791 -1.29671 0 16.5113 0 16.5113L0 24.5711Z" fill="black"/></svg>'),
      linear-gradient(#000, #000);
    mask-position: top center, 0 24px;
    -webkit-mask-position: top center, 0 24px;
    mask-size: 100% 25px, 100% 100%;
    -webkit-mask-size: 100% 25px, 100% 100%;
  }

}


/* =====================================
  container
===================================== */
.container {
  max-width: 1164px;
  margin: 0 auto;
}
.container--box {
  padding: 80px;
  border-radius: 40px;
  background-color: var(--color-mono50);
}

.max-container {
  padding: 120px 20px;
  background-color: var(--color-mono50);
  border-radius: 120px 120px 0 0;
}

@media screen and (max-width: 767px) {
  .container--box {
    padding: 48px 24px;
    border-radius: 20px;
  }
  .max-container {
    padding: 48px 20px;
    border-radius: 40px 40px 0 0;
  }
}


/* =====================================
  separator-line
===================================== */
.separator-line {
  --color-line: var(--color-green700);
  padding-top: 240px;
  position: relative;
  z-index: 1;
}
.separator-line::before {
  content: "";
  width: 1732.799px;
  height: 900.106px;
  background-color: var(--color-line);
  position: absolute;
  top: 64px;
  left: calc(50% + 25px);
  transform: translateX(-50%);
  -webkit-mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="-134 0 1733 901"><path d="M416.752 0.117873C510.388 -1.97063 602.216 23.9472 695.063 57.7458C787.162 91.2719 879.157 132.057 977.548 163L982.237 164.466L982.264 164.473L982.289 164.481C1032.23 180.288 1083.52 193.369 1134.25 206.017C1184.87 218.64 1235.02 230.852 1282.19 244.847C1375.55 272.543 1459.3 307.746 1514.26 369.2L1515.56 370.657C1570.6 433.134 1594.9 521.03 1598.36 614.88C1601.83 708.859 1584.47 809.93 1554.98 900.106L1535.97 893.891C1564.87 805.515 1581.74 706.817 1578.37 615.618C1575 524.288 1551.4 441.594 1500.55 383.878C1449.59 326.041 1370.06 291.776 1276.51 264.022C1229.86 250.184 1180.23 238.097 1129.41 225.424C1078.7 212.78 1026.88 199.571 976.305 183.564C875.796 152.344 779.811 109.88 688.223 76.5397C595.952 42.9507 506.951 18.0924 417.109 20.114L417.063 20.1149H417.017C238.272 22.4844 54.5261 133.508 -120.402 295.69L-134 281.023C41.8856 117.954 230.335 2.58887 416.752 0.117873Z" fill="black"/></svg>');
  mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="-134 0 1733 901"><path d="M416.752 0.117873C510.388 -1.97063 602.216 23.9472 695.063 57.7458C787.162 91.2719 879.157 132.057 977.548 163L982.237 164.466L982.264 164.473L982.289 164.481C1032.23 180.288 1083.52 193.369 1134.25 206.017C1184.87 218.64 1235.02 230.852 1282.19 244.847C1375.55 272.543 1459.3 307.746 1514.26 369.2L1515.56 370.657C1570.6 433.134 1594.9 521.03 1598.36 614.88C1601.83 708.859 1584.47 809.93 1554.98 900.106L1535.97 893.891C1564.87 805.515 1581.74 706.817 1578.37 615.618C1575 524.288 1551.4 441.594 1500.55 383.878C1449.59 326.041 1370.06 291.776 1276.51 264.022C1229.86 250.184 1180.23 238.097 1129.41 225.424C1078.7 212.78 1026.88 199.571 976.305 183.564C875.796 152.344 779.811 109.88 688.223 76.5397C595.952 42.9507 506.951 18.0924 417.109 20.114L417.063 20.1149H417.017C238.272 22.4844 54.5261 133.508 -120.402 295.69L-134 281.023C41.8856 117.954 230.335 2.58887 416.752 0.117873Z" fill="black"/></svg>');
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  z-index: -1;
}

@media screen and (max-width: 767px) {
  .separator-line {
    padding-top: 29.867vw;
  }
  .separator-line::before {
    width: 116.891vw;
    height: 68.622vw;
    top: 9.067vw;
    left: 58%;
    -webkit-mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 439 258"><path d="M389.3 257.324C398.78 234.754 405.41 209.064 406.51 184.644C407.6 160.304 403.22 136.504 389.83 118.534C376.5 100.644 354.95 89.5645 331.6 80.5045C319.84 75.9445 307.29 71.7745 294.77 67.5345C282.19 63.2745 269.57 58.9345 257.38 53.9445H257.36L257.34 53.9345C232.69 44.0045 210.37 31.7645 187 21.0245C164.09 10.4745 140.82 1.74445 116.3 0.284454C67.5401 -3.03555 16.4401 23.0445 -31.6699 60.8245L-23.6399 71.0445C23.8301 33.7745 71.6701 10.2545 115.47 13.2645H115.5H115.53C137.57 14.5745 159.04 22.4645 181.6 32.8345C203.72 43.0045 227.64 55.9745 252.51 65.9945C265.11 71.1445 278.05 75.6045 290.62 79.8545C303.27 84.1345 315.48 88.1945 326.91 92.6245C349.92 101.554 368.43 111.554 379.42 126.304C390.35 140.974 394.56 161.364 393.54 184.064C392.52 206.684 386.34 230.864 377.33 252.294L389.32 257.334L389.3 257.324Z" fill="black"/></svg>');
    mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 439 258"><path d="M389.3 257.324C398.78 234.754 405.41 209.064 406.51 184.644C407.6 160.304 403.22 136.504 389.83 118.534C376.5 100.644 354.95 89.5645 331.6 80.5045C319.84 75.9445 307.29 71.7745 294.77 67.5345C282.19 63.2745 269.57 58.9345 257.38 53.9445H257.36L257.34 53.9345C232.69 44.0045 210.37 31.7645 187 21.0245C164.09 10.4745 140.82 1.74445 116.3 0.284454C67.5401 -3.03555 16.4401 23.0445 -31.6699 60.8245L-23.6399 71.0445C23.8301 33.7745 71.6701 10.2545 115.47 13.2645H115.5H115.53C137.57 14.5745 159.04 22.4645 181.6 32.8345C203.72 43.0045 227.64 55.9745 252.51 65.9945C265.11 71.1445 278.05 75.6045 290.62 79.8545C303.27 84.1345 315.48 88.1945 326.91 92.6245C349.92 101.554 368.43 111.554 379.42 126.304C390.35 140.974 394.56 161.364 393.54 184.064C392.52 206.684 386.34 230.864 377.33 252.294L389.32 257.334L389.3 257.324Z" fill="black"/></svg>');
  }

}

/* =====================================
  column
===================================== */
.column-2 {
  display: flex;
  gap: 40px;
}
.column-2--gap0 {
  gap: 0;
}
.column-2__item {
  flex: 1;
}
.column-2__item--card,
.column-2__link--card {
  display: flex;
  flex-direction: column;
  gap: 32px;
  padding: 40px 48px;
  border-radius: 40px;
  border: 1px solid var(--color-mono200);
  background: var(--color-mono50);
}
.column-2__link--card {
  height: 100%;
  transition: 0.2s;
}
.column-2__grow {
  flex-grow: 1;
}
.column-2__item--auto {
  flex: none;
}

@media (hover: hover) {
  .column-2__link--card:hover {
    background-color: var(--color-hover-bg);
  }
  .column-2__link--card:hover .contents-link--card {
    color: var(--color-blue700);
    text-decoration: underline;
  }
  .column-2__link--card:hover .contents-link--card::after {
    transform: translateY(-50%) scale(1.333);
  }
  .column-2__link--card:hover .contents-image--card {
    opacity: 0.7;
  }
}

@media screen and (max-width: 767px) {
  .column-2 {
    flex-direction: column;
    gap: 16px;
  }
  .column-2__item--card,
  .column-2__link--card {
    gap: 20px;
    padding: 24px;
    border-radius: 20px;
  }
}


/* =====================================
  title
===================================== */
.contents-title {
  padding-left: 28px;
  font-size: 2.5rem;/* 40px */
  font-weight: bold;
  line-height: 1.5;
  letter-spacing: 1.2px;
  position: relative;
}
.contents-title::before {
  content: "";
  width: 12px;
  height: 100%;
  background-color: var(--color-blue600);
  border-radius: 9999px;
  position: absolute;
  top: 0;
  left: 0;
}
.contents-title--green::before {
  background-color: var(--color-green700);
}
.contents-title--blue::before {
  background-color: var(--color-blue700);
}
.contents-title--navy::before {
  background-color: var(--color-blue700);
}

.title-treat {
  --color-dots: var(--color-blue500);
  font-size: 1.75rem;/* 28px */
  font-weight: bold;
  line-height: 1.5;
  letter-spacing: 0.84px;
  text-align: center;
}
.title-treat__inner {
  display: inline-block;
  padding: 0 5px 12px;
  background-image: radial-gradient(circle 4px at center, var(--color-dots) 98%, transparent 100%);
  background-size: 16px 8px;
  background-repeat: space no-repeat;
  background-position: bottom;
}

.title-treat--type02  {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 67px;
  color: var(--color-green700);
  font-size: 2.5rem;/* 40px */
  font-weight: bold;
  line-height: 1.5;
  letter-spacing: 0.96px;
  text-align: center;
}
.title-treat__inner--type02 {
  display: inline-block;
  padding: 0 73px;
  position: relative;
}
.title-treat__inner--type02::before,
.title-treat__inner--type02::after {
  content: "";
  width: 56.715px;
  height: 67.024px;
  background: url(/common/img/bg_treat_green.svg) no-repeat center /contain;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
.title-treat__inner--type02::before {
  left: 0;
  transform: translateY(-50%) scale(-1, 1);
}
.title-treat__inner--type02::after {
  right: 0;
}

.title-treat__inner--type02-blue {
  color: var(--color-blue700);
}
.title-treat__inner--type02-blue::before,
.title-treat__inner--type02-blue::after {
  background-image: url(/common/img/bg_treat_blue.svg);
}

.tap-title {
  font-size: 1.5rem;/* 24px */
  font-style: normal;
  font-weight: 700;
  line-height: 150%; /* 36px */
  letter-spacing: 0.72px;
  text-align: center;
}
.tap-title__inner {
  display: inline-block;
  padding: 2px 0 2px 48px;
  position: relative;
  z-index: 1;
}
.tap-title__inner::before {
  content: "";
  width: 40px;
  height: 40px;
  background: url(/common/img/icon_tap.svg) no-repeat center /contain;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}
.tap-title__text {
  display: inline-block;
  position: relative;
  z-index: 1;
}
.tap-title__text::after {
  content: "";
  width: 100%;
  height: 12px;
  background-color: var(--color-orange200);
  border-radius: 9999px;
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  z-index: -1;
}

@media screen and (max-width: 767px) {
  .contents-title {
    padding-left: 20px;
    font-size: 1.75rem;/* 28px */
    letter-spacing: 0.84px;
  }
  .contents-title::before {
    width: 8px;
  }

  .title-treat {
    font-size: 1.25rem;/* 20px */
    letter-spacing: 0.6px;
  }
  .title-treat__inner {
    padding: 0 4px 10px;
    background-image: radial-gradient(circle 2.5px at center, var(--color-dots) 98%, transparent 100%);
    background-size: 10px 5px;
    background-repeat: space no-repeat;
    background-position: bottom;
  }

  .title-treat--type02  {
    font-size: 1.375rem;/* 22px */
    letter-spacing: 0.54px;
  }
  .title-treat__inner--type02 {
    padding: 0 37px;
  }
  .title-treat__inner--type02::before,
  .title-treat__inner--type02::after {
    content: "";
    width: 37.81px;
    height: 44.683px;
    top: auto;
    bottom: 0;
    transform: translateY(0);
  }
  .title-treat__inner--type02::before {
    left: -5px;
    transform: scale(-1, 1);
  }
  .title-treat__inner--type02::after {
    right: -5px;
  }

  .tap-title {
    font-size: 1.125rem;/* 18px */
    letter-spacing: 0.54px;
  }
  .tap-title__inner {
    display: inline-block;
    padding: 0 0 0 52px;
    text-align: left;
  }
  .tap-title__inner::after {
    content: "";
    width: calc(100% + 12px);
    height: 9px;
    background-color: var(--color-orange200);
    border-radius: 9999px;
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
    z-index: -1;
  }
  .tap-title__text::after {
    content: none;
  }
}


/* =====================================
  text
===================================== */
.contents-text {
  font-size: 1.125rem;/* 18px */
  line-height: 1.8;
  letter-spacing: 0.54px;
}
.contents-text--16 {
  font-size: 1rem;/* 16px */
  letter-spacing: 0.48px;
}
.contents-text--14 {
  font-size: 0.875rem;/* 14px */
  letter-spacing: 0.42px;
}
.contents-text--bold {
  font-weight: bold;
}
.text-red {
  color: var(--color-alert);
}
.text-blue {
  color: var(--color-blue700);
}
.mizuiku-contents .text-link {
  color: var(--color-blue700);
  font-weight: bold;
  text-decoration: underline;
}
.contents-text--line-h-200 {
  line-height: 2;
}
.contents-text--line-h-220 {
  line-height: 2.2;
}
.contents-text--line-h-150 {
  line-height: 1.5;
}
.text-right {
  text-align: right;
}
.contents-text__marker,
.text-marker {
  background-image: linear-gradient(  var(--color-orange200),  var(--color-orange200) );
  background-repeat: no-repeat;
  background-size: 100% 8px;
  background-position: 0 100%;
  font-weight: bold;
}

@media (hover: hover) {
  .mizuiku-contents .text-link:hover {
    text-decoration: none;
  }
}

@media screen and (max-width: 767px) {
  .contents-text {
    font-size: 1rem;/* 16px */
    letter-spacing: 0.48px;
  }
  .contents-text--sp14 {
    font-size: 0.875rem;/* 14px */
    letter-spacing: 0.42px;
  }
  .contents-text--16 {
    font-size: 0.875rem;/* 14px */
    letter-spacing: 0.42px;
  }
  .contents-text--14 {
    font-size: 0.75rem;/* 12px */
    letter-spacing: 0.36px;
  }
}


/* =====================================
  image
===================================== */
.contents-image {
  font-size: 0;
}
.contents-image__img {
  border-radius: 12px;
}
@media screen and (max-width: 767px) {
  .contents-image__img {
      width: 100%;
      border-radius: 8px;
  }
}


/* =====================================
  contents-button
===================================== */
.contents-button__link {
  --color-key: var(--color-blue950);
  --color-bg: var(--color-mono50);
  display: flex;
  justify-content: center;
  align-items: center;
  max-width: 398px;
  min-height: 72px;
  margin: 0 auto 0;
  padding: 5px 61px 5px 29px;
  border: 2px solid var(--color-key);
  border-radius: 9999px;
  background-color: var(--color-bg);
  color: var(--color-blue950);
  font-size: 1.125rem;/* 18px */
  font-weight: bold;
  line-height: 1.5;
  letter-spacing: 0.54px;
  text-align: center;
  text-decoration: none;
  position: relative;
  transition: 0.2s;
}
.contents-button__link::after {
  content: "";
  width: 32px;
  height: 32px;
  border-radius: 9999px;
  background: var(--color-key) url(/common/img/icon_arrow_right_01.svg) no-repeat center / 6px auto;
  position: absolute;
  top: 50%;
  right: 16px;
  transform: translateY(-50%);
  transition: transform 0.2s ease, background-color 0.2s ease;
  will-change: transform;
}
.contents-button__link--arrow-dark::after {
  background-image: url(/common/img/icon_arrow_right_02.svg);
}

/* primary */
.contents-button__link--primary {
  min-height: 88px;
  border-width: 4px;
  box-shadow: 0px 6px 0px var(--color-key);
  font-size: 1.25rem;/* 20px */
  letter-spacing: 0.6px;
}
.contents-button__link--primary::after {
  width: 40px;
  height: 40px;
  background-size: 9.833px auto;
}

.contents-button__link--w-100 {
  width: 100%;
  max-width: 100%;
}
.contents-button__link--w-auto {
  display: inline-flex;
  max-width: 100%;
}

/* icon */
.contents-button__link--icon {
  min-height: 88px;
  padding-left: 80px;
}
.contents-button__icon {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 80px;
  height: 80px;
  border-radius: 9999px;
  color: var(--color-mono0);
  font-size: 1.25rem;/* 20px */
  font-weight: bold;
  line-height: 1.3;
  letter-spacing: 0.6px;
  position: absolute;
  top: 50%;
  left: -1px;
  transform: translateY(-50%);
}
.contents-button__icon--area {
  background-color: var(--color-orange600);
}
.contents-button__icon--nationwide {
  background-color: var(--color-class-online);
}


@media (hover: hover) {
  .contents-button__link:hover {
    text-decoration: underline;
  }
  .contents-button__link:hover {
    background-color: var(--color-key);
    box-shadow: none;
    color: var(--color-mono50);
  }
  .contents-button__link--no-invert:hover {
    color: var(--color-blue950);
  }

  .contents-button__link:hover::after {
    background-color: var(--color-bg);
    background-image: url(/common/img/icon_arrow_right_02.svg);
    transform: translateY(-50%) scale(1.25);
  }

  /* primary */
  .contents-button__link--primary:hover {
    transform: translateY(6px);
  }
  .contents-button__link--primary:hover::after {
    transform: translateY(-50%) scale(1.2);
  }

  /* icon */
  .contents-button__link--area:hover::after {
    background-image: url(/common/img/icon_arrow_right_orange.svg);
  }
  .contents-button__link--nationwide:hover::after {
    background-image: url(/common/img/icon_arrow_right_blue.svg);
  }
  .contents-button__link:hover .contents-button__icon {
    background-color: var(--color-mono50);
  }
  .contents-button__link:hover .contents-button__icon--area {
    color: var(--color-orange600);
  }
  .contents-button__link:hover .contents-button__icon--nationwide {
    color: var(--color-class-online);
  }


}

@media screen and (max-width: 767px) {
  .contents-button__link {
    min-height: 56px;
    padding: 5px 42px 5px 22px;
    font-size: 1rem;/* 16px */
    letter-spacing: 0.48px;
  }
  .contents-button__link::after {
    width: 28px;
    height: 28px;
    background-size: 5.3px auto;
    right: 14px;
  }

  /* primary */
  .contents-button__link--primary {
    min-height: 64px;
    box-shadow: 0px 4px 0px var(--color-key);
  }
  .contents-button__link--primary::after {
    width: 32px;
    height: 32px;
    right: 12px;
    background-size: 7.866px auto;
  }

  /* icon */
  .contents-button__link--icon {
    min-height: 72px;
    padding-left: 68px;
  }
  .contents-button__icon {
    width: 72px;
    height: 72px;
    font-size: 1rem;/* 16px */
    line-height: 1.5;
    letter-spacing: 0.48px;
    left: -4px;
  }


  .contents-button__link--w-auto {
    width: 100%;
  }
}


/* =====================================
  contents-link
===================================== */
.contents-link {
  display: inline-block;
  padding-right: 36px;
  font-size: 1rem;/* 16px */
  font-weight: bold;
  line-height: 1.5;
  letter-spacing: 0.48px;
  position: relative;
  transition: 0.2s;
}
.contents-link::after {
  content: "";
  width: 24px;
  height: 24px;
  background: var(--color-blue700) url(/common/img/icon_arrow_right_01.svg) no-repeat center / 4.5px auto;
  border-radius: 9999px;
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  transition: 0.2s;
}

.contents-link--large {
  font-size: 1.125rem;/* 18px */
  letter-spacing: 0.54px;
}

.contents-link--blank::after {
  background-image: url(/common/img/icon_blank.svg);
  background-size: 18px auto;
}

@media (hover: hover) {
  a.contents-link:hover,
  a:hover .contents-link {
    color: var(--color-blue700);
    text-decoration: underline;
  }
  a.contents-link:hover::after,
  a:hover .contents-link::after {
    transform: translateY(-50%) scale(1.333);
  }
}
@media screen and (max-width: 767px) {
  .contents-link {
    font-size: 0.875rem;/* 14px */
    letter-spacing: 0.42px;
    word-break: break-all;
  }
  .contents-link--large {
    font-size: 1rem;/* 16px */
    letter-spacing: 0.48px;
  }
  .contents-link--sp-right {
    text-align: right;
  }
}


/* =====================================
  contents-banner
===================================== */
.contents-banner {
  max-width: 840px;
  margin: 0 auto;
}
.contents-banner__link {
  display: flex;
  gap: 40px;
  padding: 48px 40px;
  border: 1px solid var(--color-mono200);
  border-radius: 20px;
  background-color: var(--color-mono50);
  position: relative;
  transition: 0.2s;
}
.contents-banner__link::after {
  content: "";
  width: 32px;
  height: 32px;
  border-radius: 9999px;
  background: var(--color-blue700) url(/common/img/icon_arrow_right_01.svg) no-repeat center / 6px auto;
  position: absolute;
  right: 16px;
  bottom: 16.75px;
  transition: 0.2s;
}
.contents-banner__image {
  text-align: center;
}
.contents-banner__title:has(img) {
  font-size: 0;
}
.contents-banner__title + .contents-banner__text {
  margin-top: 8px;
}
.contents-banner__arrow-text {
  text-align: right;
}
.contents-banner__text + .contents-banner__arrow-text {
  margin-top: 16px;
}

/* type02 */
.contents-banner__link--type02 {
  padding: 32px 40px;
}
.contents-banner__link--type02::after {
  content: none;
}

@media (hover: hover) {
  .contents-banner__link:hover {
    background-color: #FFFBE6;
  }
  .contents-banner__link:hover::after {
    transform: scale(1.25);
  }
}

@media screen and (max-width: 767px) {
  .contents-banner {
  }
  .contents-banner__link {
    flex-direction: column;
    gap: 20px;
    padding: 32px 20px 40px;
  }
  .contents-banner__link::after {
    width: 24px;
    height: 24px;
    background-size: 4.543px auto;
    right: 12px;
    bottom: 12px;
  }
  .contents-banner__logo {
    margin: 0 auto;
    padding: 0 7.164%;
  }
  .contents-banner__img {
    width: 100%;
  }
  .contents-banner__text {
    font-size: 0.875rem;/* 14px */
    letter-spacing: 0.42px;
  }

  .contents-banner__text + .contents-banner__arrow-text {
    margin-top: 20px;
  }

  /* type02 */
  .contents-banner__link--type02 {
    padding: 32px 20px 16px;
  }

}

/* =====================================
  movie-box
===================================== */
.movie-box {
  position: relative;
  z-index: 10;
}
.movie-box__container {
  max-width: 800px;
  margin: 0 auto;
  padding: 24px 40px;
  background-color: var(--color-mono50);
  border-radius: 40px;
}
.movie-box__title {
  font-size: 1.5rem;/* 24px */
  font-weight: bold;
  line-height: 1.5;
  letter-spacing: 0.72px;
  text-align: center;
}
.movie-box__title-text {
  display: inline-block;
  padding: 4.34px 53.81px;
  position: relative;
}
.movie-box__title-text::before,
.movie-box__title-text::after {
  content: "";
  width: 37.81px;
  height: 44.683px;
  background: url(/common/img/bg_treat.svg) no-repeat center /contain;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
.movie-box__title-text::before {
  left: 0;
  transform: translateY(-50%) scale(-1, 1);
}
.movie-box__title-text::after {
  right: 0;
}
.movie-box__title-text--green::before,
.movie-box__title-text--green::after {
  background-image: url(/common/img/bg_treat_green.svg)
}
.movie-box__title-text--blue::before,
.movie-box__title-text--blue::after {
  background-image: url(/common/img/bg_treat_blue.svg)
}
.movie-box__embedded {
  margin-top: 16px;
  border-radius: 12px;
  overflow: hidden;
  font-size: 0;
}
.movie-box__iframe {
  width: 100%;
  aspect-ratio: 16 / 9;
}
.movie-box__caption {
  margin-top: 12px;
  font-size: 0.875rem;/* 14px */
  line-height: 1.5;
  letter-spacing: 0.42px;
}

@media screen and (max-width: 767px) {
  .movie-box {
    margin-top: 48px;
    padding: 0 7px;
  }
  .movie-box__container {
    border-radius: 20px;
    padding: 8px;
  }
  .movie-box__title {
    font-size: 1.125rem;/* 18px */
    letter-spacing: 0.54px;
  }
  .movie-box__title-text {
    padding: 0 41px;
  }
  .movie-box__title-text::before,
  .movie-box__title-text::after {
    top: auto;
    bottom: 0;
    transform: translateY(0);
  }
  .movie-box__title-text::before {
    transform: translateY(0) scale(-1, 1);
  }
  .movie-box__embedded {
    margin-top: 12px;
    border-radius: 8px;
  }
  .movie-box__caption {
    margin-top: 4px;
  }
}

/* =====================================
  notice
===================================== */
.notice {
}
.notice__list-item {
}

.notice__list-link,
.notice__list-item-inner {
  display: block;
  padding: 20px;
  background-color: var(--color-mono100);
  transition: 0.2s;
}

.notice__list-link-inner {
  display: flex;
  gap: 52px;
  max-width: 1164px;
  margin: 0 auto;
}

.notice__label {
  padding: 5px 8px;
  border-radius: 4px;
  background-color: var(--color-alert);
  color: var(--color-mono0);
  font-size: 1rem;/* 16px */
  font-weight: bold;
  line-height: 1.5;
  letter-spacing: 0.48px;
}
.notice__text {
  font-size: 1.25rem;/* 20px */
  font-weight: bold;
  line-height: 1.8;
  letter-spacing: 0.6px;
}

@media (hover: hover) {
  a.notice__list-link:hover {
    background-color: #FFFBE6;
  }
  a.notice__list-link:hover .notice__text {
    color: var(--color-blue700);
    text-decoration: underline;
  }
}

@media screen and (max-width: 767px) {
  .notice__list-link-inner {
    flex-direction: column;
    gap: 8px;
  }
  .notice__label {
    max-width: 74px;
    padding: 3.5px 8px;
    font-size: 0.875rem;/* 14px */
    letter-spacing: 0.42px;
  }
  .notice__text {
    font-size: 1rem;/* 16px */
    line-height: 1.5;
    letter-spacing: 0.48px;
  }
}


/* =====================================
  accordion
===================================== */
.accordion {
  border: 3px solid var(--color-mono200);
  border-radius: 20px;
  background: var(--color-mono50);
}
.accordion__header {
  width: 100%;
  padding: 32px 150px 32px 80px;
  font-size: 1.75rem;/* 28px */
  font-weight: bold;
  line-height: 1.5;
  letter-spacing: 0.84px;
  text-align: left;
  transition: 0.3s;
  position: relative;
}
.accordion__header.is-open {
  padding-bottom: 24px;
  border-bottom: 2px solid var(--color-mono200);
}

.accordion__title {
  --color-icon: var(--color-green700);
  display: block;
  position: relative;
}
.accordion__title--blue {
  --color-icon: var(--color-blue700);
}
.accordion__title::after {
  content: "";
  width: 40px;
  height: 40px;
  border-radius: 9999px;
  background: var(--color-icon) url(/common/img/icon_accordion_white.svg) no-repeat center / 20px auto;
  position: absolute;
  top: 50%;
  right: -70px;
  transform: translateY(-50%);
}
.accordion__header.is-open .accordion__title::after {
  background-image: url(/common/img/icon_accordion_white_open.svg);
}

.accordion__content {
  display: grid;
  grid-template-rows: 0fr;
  transition: 0.3s;
  overflow: hidden;
}
.accordion__content.is-open {
  grid-template-rows: 1fr;
  padding: 24px 0 32px;
}

.accordion__inner {
  min-height: 0;
  padding: 0 80px;
}

/* FAQ */
.accordion__title--faq {
  padding: 8.55px 0 8.55px 73.3px;
  font-size: 1.25rem;/* 20px */
  letter-spacing: 0.6px;
  position: relative;
}
.accordion__title--faq::before {
  content: "";
  width: 33.3px;
  height: 47.1px;
  background-color: var(--color-icon);
  -webkit-mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32.1 47.1"><path d="M16.05 38.2C12.9167 38.2 10.1333 37.4167 7.7 35.85C5.3 34.2833 3.41667 32.0667 2.05 29.2C0.683334 26.3 0 22.8833 0 18.95C0 14.9833 0.683334 11.6 2.05 8.8C3.41667 5.96667 5.3 3.8 7.7 2.3C10.1333 0.766668 12.9167 0 16.05 0C19.2167 0 22 0.766668 24.4 2.3C26.8 3.8 28.6833 5.96667 30.05 8.8C31.4167 11.6 32.1 14.9833 32.1 18.95C32.1 22.8833 31.4167 26.3 30.05 29.2C28.6833 32.0667 26.8 34.2833 24.4 35.85C22 37.4167 19.2167 38.2 16.05 38.2ZM16.05 33.35C18.0833 33.35 19.85 32.7833 21.35 31.65C22.8833 30.4833 24.0667 28.8167 24.9 26.65C25.7333 24.4833 26.15 21.9167 26.15 18.95C26.15 16.0833 25.7333 13.6167 24.9 11.55C24.0667 9.45 22.8833 7.85 21.35 6.75C19.85 5.61667 18.0833 5.05 16.05 5.05C14.0167 5.05 12.2333 5.61667 10.7 6.75C9.2 7.85 8.03333 9.45 7.2 11.55C6.4 13.6167 6 16.0833 6 18.95C6 21.9167 6.4 24.4833 7.2 26.65C8.03333 28.8167 9.2 30.4833 10.7 31.65C12.2333 32.7833 14.0167 33.35 16.05 33.35ZM27.6 47.1C25.1667 47.1 22.9833 46.6667 21.05 45.8C19.1167 44.9667 17.4833 43.8 16.15 42.3C14.8167 40.8333 13.7833 39.1833 13.05 37.35L19.05 36.8C19.5167 38.0333 20.2 39.0667 21.1 39.9C22.0333 40.7333 23.1167 41.3333 24.35 41.7C25.5833 42.1 26.8833 42.3 28.25 42.3C29.05 42.3 29.7667 42.25 30.4 42.15C31.0667 42.05 31.6667 41.9 32.2 41.7L33.3 46.1C32.7 46.3667 31.9 46.6 30.9 46.8C29.9 47 28.8 47.1 27.6 47.1Z" fill="black"/></svg>');
  mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32.1 47.1"><path d="M16.05 38.2C12.9167 38.2 10.1333 37.4167 7.7 35.85C5.3 34.2833 3.41667 32.0667 2.05 29.2C0.683334 26.3 0 22.8833 0 18.95C0 14.9833 0.683334 11.6 2.05 8.8C3.41667 5.96667 5.3 3.8 7.7 2.3C10.1333 0.766668 12.9167 0 16.05 0C19.2167 0 22 0.766668 24.4 2.3C26.8 3.8 28.6833 5.96667 30.05 8.8C31.4167 11.6 32.1 14.9833 32.1 18.95C32.1 22.8833 31.4167 26.3 30.05 29.2C28.6833 32.0667 26.8 34.2833 24.4 35.85C22 37.4167 19.2167 38.2 16.05 38.2ZM16.05 33.35C18.0833 33.35 19.85 32.7833 21.35 31.65C22.8833 30.4833 24.0667 28.8167 24.9 26.65C25.7333 24.4833 26.15 21.9167 26.15 18.95C26.15 16.0833 25.7333 13.6167 24.9 11.55C24.0667 9.45 22.8833 7.85 21.35 6.75C19.85 5.61667 18.0833 5.05 16.05 5.05C14.0167 5.05 12.2333 5.61667 10.7 6.75C9.2 7.85 8.03333 9.45 7.2 11.55C6.4 13.6167 6 16.0833 6 18.95C6 21.9167 6.4 24.4833 7.2 26.65C8.03333 28.8167 9.2 30.4833 10.7 31.65C12.2333 32.7833 14.0167 33.35 16.05 33.35ZM27.6 47.1C25.1667 47.1 22.9833 46.6667 21.05 45.8C19.1167 44.9667 17.4833 43.8 16.15 42.3C14.8167 40.8333 13.7833 39.1833 13.05 37.35L19.05 36.8C19.5167 38.0333 20.2 39.0667 21.1 39.9C22.0333 40.7333 23.1167 41.3333 24.35 41.7C25.5833 42.1 26.8833 42.3 28.25 42.3C29.05 42.3 29.7667 42.25 30.4 42.15C31.0667 42.05 31.6667 41.9 32.2 41.7L33.3 46.1C32.7 46.3667 31.9 46.6 30.9 46.8C29.9 47 28.8 47.1 27.6 47.1Z" fill="black"/></svg>');
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}

.accordion__title--faq.is-multiline::before {
  top: 1.2em;
}

@media (max-width: 767px) {
  .accordion__title--faq.is-multiline::before {
    top: 0.7em;
  }
}

.accordion__anser {
  --color-icon: var(--color-orange600);
  padding: 12px 0 12px 71.1px;
  position: relative;
}
.accordion__anser::before {
  content: "";
  width: 31.1px;
  height: 36.85px;
  background-color: var(--color-icon);
  -webkit-mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 31.1 36.85"><path d="M0 36.85L12.2 0H18.9L31.1 36.85H24.95L19 16.85C18.4 14.85 17.8167 12.8333 17.25 10.8C16.6833 8.73333 16.1167 6.66667 15.55 4.6H15.35C14.8167 6.7 14.25 8.76667 13.65 10.8C13.0833 12.8333 12.5 14.85 11.9 16.85L5.95 36.85H0ZM6.9 26.4V21.8H24.1V26.4H6.9Z" fill="black"/></svg>');
  mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 31.1 36.85"><path d="M0 36.85L12.2 0H18.9L31.1 36.85H24.95L19 16.85C18.4 14.85 17.8167 12.8333 17.25 10.8C16.6833 8.73333 16.1167 6.66667 15.55 4.6H15.35C14.8167 6.7 14.25 8.76667 13.65 10.8C13.0833 12.8333 12.5 14.85 11.9 16.85L5.95 36.85H0ZM6.9 26.4V21.8H24.1V26.4H6.9Z" fill="black"/></svg>');
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  top: 12px;
  left: 0;
}

@media (hover: hover) {
  .accordion__header:hover {
    color: var(--color-blue700);
    text-decoration: underline;
  }
}

@media screen and (max-width: 767px) {
  .accordion {
    border-radius: 16px;
  }
  .accordion__header {
    padding: 17px 45px 17px 13px;
    font-size: 1rem;/* 16px */
    letter-spacing: 0.48px;
   }
  .accordion__header.is-open {
    padding-bottom: 19px;
  }
  .accordion__title::after {
    width: 24px;
    height: 24px;
    background-size: 12px auto;
    right: -32px;
  }
  .accordion__content.is-open {
    padding: 20px 0;
  }
  .accordion__inner {
    min-height: 0;
    padding: 0 13px;
  }

  /* FAQ */
  .accordion__title--faq {
    padding: 0 0 0 29.31px;
    font-size: 1rem;/* 16px */
    letter-spacing: 0.48pxpx;
  }
  .accordion__title--faq::before {
    width: 17.308px;
    height: 24.48px;
  }
  .accordion__anser {
    padding: 0 0 0 33.3px;
  }
  .accordion__anser::before {
    width: 17.304px;
    height: 20.504px;
    top: 0;
  }
}


/* =====================================
  recruitment
===================================== */
.recruitment {
  --bg-color-01: #008448;
  --bg-color-02: #48A679;
  padding: 120px 0;
  background: repeating-linear-gradient(-55deg, var(--bg-color-02) 0px, var(--bg-color-02) 1px, var(--bg-color-01) 1px, var(--bg-color-01) 25px);
}
.recruitment--blue {
  --bg-color-01: #005CAB;
  --bg-color-02: #4C8DC2;
}
.recruitment__container {
  padding-top: 64px;
  border-radius: 60px;
  background-color: var(--color-mono50);
  overflow: hidden;
}

.recruitment__info {
  display: flex;
  justify-content: center;
  gap: 48px;
  margin-top: 16px;
}
.recruitment__info-item {
  padding-left: 20px;
  font-size: 18px;
  font-weight: bold;
  line-height: 1.5;
  letter-spacing: 0.54px;
  position: relative;
}
.recruitment__info-item::before {
  content: "";
  width: 12px;
  height: 12px;
  border-radius: 9999px;
  background-color: var(--color-green700);
  position: absolute;
  top: calc(0.5em * 1.5);
  left: 0;
  transform: translateY(-50%);
}
.recruitment__info-item--blue::before {
  background-color: var(--color-blue700);
}

.recruitment__button-list {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 28px 20px;
  margin-top: 52px;
}
.recruitment__button-list-item {
  min-width: 408px;
}

.contents-button__link--hakushu {
  --color-key: var(--color-hakushu-dark);
  --color-bg: var(--color-hakushu-thin);
}
.contents-button__link--kitaalps {
  --color-key: var(--color-kitaalps-dark);
  --color-bg: var(--color-kitaalps-thin);
}
.contents-button__link--okudaisen {
  --color-key: var(--color-okudaisen-dark);
  --color-bg: var(--color-okudaisen-thin);
}
.contents-button__link--aso {
  --color-key: var(--color-aso-dark);
  --color-bg: var(--color-aso-thin);
}
.contents-button__link--area {
  --color-key: var(--color-orange600);
}
.contents-button__link--nationwide {
  --color-key: var(--color-class-online);
}

.recruitment__link-list {
  display: flex;
  justify-content: center;
  gap: 48px;
  max-width: 840px;
  margin: 46px auto 0;
  padding: 20px 0 56px;
  border-top: 1px solid var(--color-mono200);
}
.recruitment__link-list-item {
  text-align: center;
}
.recruitment__link-list-text {
  margin-top: 4px;
}

.recruitment__inquiry {
  padding: 32px 20px;
  background-color: var(--color-mono100);
}
.recruitment__inquiry-inner {
  display: flex;
  max-width: 840px;
  margin: 0 auto;
}
.recruitment__inquiry-title {
  display: flex;
  align-items: center;
  min-width: 260px;
  border-right: 2px solid var(--color-mono200);
  font-size: 1.75rem;/* 28px */
  font-weight: bold;
  line-height: 1.5;
  letter-spacing: 0.84px;
}
.recruitment__inquiry-contents {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.recruitment__inquiry-number {
  margin-top: 12px;
  padding-left: 54px;
  font-size: 2rem;/* 32px */
  font-weight: bold;
  line-height: 1.5;
  letter-spacing: 0.96px;
  position: relative;
}
.recruitment__inquiry-number::before {
  content: "";
  width: 36px;
  height: 36.012px;
  background: url(/common/img/icon_phone.svg) no-repeat center / contain;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}
.recruitment__inquiry-hours {
  margin-top: 16px;
}


@media screen and (max-width: 767px) {
  .recruitment {
    padding: 48px 20px;
  }
  .recruitment__container {
    padding: 48px 0 0;
    border-radius: 20px;
  }
  .recruitment__inner {
    padding: 0 24px;
    text-align: center;
  }

  .recruitment__info {
    display: inline-flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 12px;
    text-align: left;
  }
  .recruitment__info-item {
    padding-left: 12px;
    font-size: 0.875rem;/* 14px */
    letter-spacing: 0.42px;
  }
  .recruitment__info-item::before {
    width: 8px;
    height: 8px;
  }

  .recruitment__button-list {
    flex-direction: column;
    gap: 12px;
    margin-top: 40px;
  }
  .recruitment__button-list-item {
    min-width: auto;
  }

  .recruitment__link-list {
    flex-direction: column;
    gap: 20px;
    margin-top: 20px;
    padding: 20px 0 40px;
  }
  .recruitment__link-list-item {
    text-align: right;
  }
  .recruitment__link-list-text {
    margin-top: 0;
    font-size: 0.75rem;/* 12px */
    letter-spacing: 0.36px;
  }
  .recruitment__link {
    font-size: 1rem;/* 16px */
    letter-spacing: 0.48px;
  }

  .recruitment__inquiry {
    padding: 24px 20px;
    text-align: center;
  }
  .recruitment__inquiry-inner {
    flex-direction: column;
  }
  .recruitment__inquiry-title {
    justify-content: center;
    min-width: auto;
    border-right: none;
    font-size: 1.25rem;/* 20px */
    letter-spacing: 0.6px;
  }
  .recruitment__inquiry-contents {
    margin-top: 4px;
  }
  .recruitment__inquiry-number {
    padding-left: 36px;
    font-size: 1.5rem;/* 24px */
    letter-spacing: 0.72px;
  }
  .recruitment__inquiry-number::before {
    width: 24px;
    height: 24.008px;
  }
}


/* =====================================
  tag-list
===================================== */
.tag-list {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}
.tag-list__item {
  display: inline-block;
  padding: 1px 8px;
  border-radius: 4px;
  background-color: #E8EAEB;
  font-size: 0.875rem;/* 14px */
  line-height: 1.5;
  letter-spacing: 0.42px;
}
.tag-list__item::before {
  content: "＃";
}

@media screen and (max-width: 767px) {
  .tag-list__item {
    display: inline-block;
    padding: 1.5pxpx 4px;
    font-size: 0.75rem;/* 12px */
    letter-spacing: 0.36px;
  }
}