@charset "UTF-8";
@import url("https://cdn.jsdelivr.net/npm/yakuhanjp@4.1.1/dist/css/yakuhanjp.css");
@import url("https://cdn.jsdelivr.net/npm/yakuhanjp@4.1.1/dist/css/yakuhanmp.css");
@import url("https://fonts.googleapis.com/css2?family=Albert+Sans:ital,wght@0,100..900;1,100..900&family=Damion&family=Frank+Ruhl+Libre:wght@300..900&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Judson:ital,wght@0,400;0,700;1,400&family=Kolker+Brush&family=Mochiy+Pop+P+One&family=Noto+Sans+JP:wght@100..900&family=Outfit:wght@100..900&family=Saira+Condensed:wght@400;500;600;700&family=Squada+One&display=swap");
:root {
  -webkit-font-smoothing: antialiased;
  --base-size: 62.5%;
  --clr-text: #333;
  --clr-lighttext: #999;
  --clr-placeholder: #a7a7a7;
  --clr-line: #ccc;
  --clr-main: #009bff;
  --clr-bg: #f5f5f5;
  --clr-strong: #e8070b;
  --clr-green: #00b900;
  --clr-pink: #ff47ae;
  --clr-yellow: #ffe100;
  --ff-sans: YakuHanJP, "Outfit", "Noto Sans JP", sans-serif;
  --ff-outfit: "Outfit", sans-serif;
  --ff-inter: "Inter", sans-serif;
  --ff-damion: "Damion", cursive;
  --ff-sarira: "Saira Condensed", sans-serif;
  --ff-squada: "Squada One", sans-serif;
  --ff-kolker: "Kolker Brush", cursive;
  --ff-mochiy: "Mochiy Pop P One", sans-serif;
  --ff-frank: "Frank Ruhl Libre", serif;
  --ff-judson: "Judson", serif;
  --ff-albert: "Albert Sans", sans-serif;
  --fz: 1.4rem;
  --ls: normal;
  --lh: 2;
  --ani: 250ms ease-out;
  --ani-fast: 200ms ease-out;
  --ani-slow: 300ms ease-out;
  --speed: 250ms;
  --spSize: 375;
}

.blue {
  color: var(--clr-main);
}

.yellow {
  color: var(--clr-yellow);
}

.pink {
  color: var(--clr-pink);
}

.red {
  color: var(--clr-strong);
}

@supports (-webkit-touch-callout: none) {
  body {
    /* The hack for Safari */
    height: -webkit-fill-available;
  }
}
body {
  background-color: #fff;
}

.ui-widget,
body {
  font: inherit;
  font-family: var(--ff-sans);
  font-weight: normal;
  -webkit-text-size-adjust: 100%;
  letter-spacing: var(--ls);
  font-feature-settings: "pkna" 1;
}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  vertical-align: baseline;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: normal;
}

ol,
ul {
  list-style: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

caption,
th,
td {
  text-align: left;
  font-weight: normal;
  vertical-align: middle;
}

q,
blockquote {
  quotes: none;
}

q:before, q:after {
  content: "";
  content: none;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
  display: block;
}

*,
::before,
::after {
  box-sizing: border-box;
}

input:not([type=checkbox]):not([type=radio]),
textarea,
select,
button {
  font-size: 1.6rem;
  font-family: var(--ff-sans);
  color: var(--clr-text);
  line-height: var(--lh);
  letter-spacing: var(--ls);
  font-feature-settings: "palt" 1;
  -webkit-appearance: none;
  -moz-appearance: none;
       appearance: none;
}

input,
textarea {
  -webkit-appearance: none;
  border-radius: 0;
}
input:focus,
textarea:focus {
  outline: 2px solid #125fc4;
}
input::-moz-placeholder, textarea::-moz-placeholder {
  color: var(--clr-placeholder);
  display: inline;
  vertical-align: middle;
}
input::placeholder,
textarea::placeholder {
  color: var(--clr-placeholder);
  display: inline;
  vertical-align: middle;
}

input[type=reset],
input[type=submit] {
  background: none;
  border: none;
  outline: none;
}

select {
  border-radius: 0;
}
select:focus {
  outline: 0;
}
select::-ms-expand {
  display: none;
}

button {
  font-size: var(--fz);
  font-family: var(--ff-sans);
  padding: 0;
  margin: 0;
  border: none;
  background: none;
}
button:focus {
  outline: 0;
}
@media (720px <= width) {
  button {
    cursor: pointer;
  }
}

b,
strong,
.bold {
  font-weight: 700;
}

sup {
  vertical-align: super;
  font-size: 1rem;
}

sub {
  vertical-align: baseline;
  font-size: 1rem;
}

img {
  vertical-align: middle;
  font-size: 0;
  line-height: 0;
  max-width: 100%;
  height: auto;
  image-rendering: auto;
}

html {
  line-height: 1;
  font-size: 62.5%;
  font-size: var(--base-size);
  scroll-padding-top: 9rem;
}
@media (720px <= width) {
  html {
    scroll-padding-top: 21rem;
  }
}

body.is-menuopen {
  overflow: hidden;
}

#stage {
  position: relative;
  width: 100%;
  min-height: 100vh;
  min-width: 320px;
  font-size: var(--fz);
  font-family: var(--ff-sans);
  font-weight: 400;
  font-optical-sizing: auto;
  font-style: normal;
  line-height: 2;
  color: var(--clr-text);
}
@media (width < 720px) {
  .pc {
    display: none;
  }
  .pc.important {
    display: none !important;
  }
}
@media (720px <= width) {
  .sp {
    display: none;
  }
  .sp.important {
    display: none !important;
  }
}
ul.dot li {
  position: relative;
  padding-left: 2em;
}
ul.dot li::before {
  content: "";
  width: 8px;
  height: 8px;
  background: var(--clr-main);
  position: absolute;
  left: 0;
  top: 0.8em;
  border-radius: 100px;
}
@media (720px <= width) {
  ul.dot li::before {
    width: 1.2rem;
    height: 1.2rem;
    top: 0.6em;
  }
}
ul.dot.gray li::before {
  background-color: var(--clr-lightYellow4);
}

ol.number > li {
  padding-left: 1.7em;
  position: relative;
  counter-increment: number;
}
ol.number > li::before {
  content: counter(number);
  position: absolute;
  left: 0.3em;
}

ol.numberdot > li {
  padding-left: 2em;
  position: relative;
  counter-increment: numberdot;
}
ol.numberdot > li::before {
  content: counter(numberdot) ". ";
  position: absolute;
  left: 0.3em;
  color: var(--clr-main);
  font-weight: 700;
}
@media (720px <= width) {
  ol.numberdot > li {
    padding-left: 3rem;
  }
}

em {
  font-style: italic;
}

a,
.btn {
  color: var(--clr-text);
  text-decoration: none;
}

@media (hover: hover) and (width >= 720px) {
  a[href^="tel:"]:hover {
    opacity: 1;
    cursor: context-menu;
  }
}
svg {
  -webkit-backface-visibility: hidden;
}

p + p {
  margin-top: 1.5em;
}

.entry-is-isolated {
  /* 2026年モダンブラウザ必須プロパティ */
  contain: layout style;
  /* レイアウトの土台を安定させる */
  display: block;
  width: 100%;
  clear: both;
  /* 念のため、中身がはみ出しても外に影響させない */
  overflow: clip; /* hiddenより高速 */
}

#header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 200;
}

.header {
  position: relative;
}
.header::before {
  content: "";
  width: 100%;
  height: 100%;
  background-color: #fff;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
}
@media (1024px <= width) {
  .header::before {
    transition: height 0.3s ease, opacity 0.3s ease;
  }
}
body.nonimages .header::before, .header.is-scrolled::before {
  height: 100%;
  opacity: 1;
}
body.pullopen .header::before {
  height: calc(100% + 22rem);
  opacity: 1;
}
@media (1024px <= width) {
  .header {
    display: grid;
    grid-template-columns: 23.1770833333vw auto;
  }
}
@media (1536px <= width) {
  .header {
    grid-template-columns: 44.5rem auto;
  }
}
.header__inner {
  height: 6rem;
  display: flex;
}
@media (720px <= width) {
  .header__inner {
    height: 14rem;
  }
}
@media (1024px <= width) {
  .header__inner {
    display: contents;
  }
}
.header__logo {
  width: 23.017rem;
  height: 6rem;
  position: relative;
  z-index: 110;
}
@media (720px <= width) {
  .header__logo {
    width: auto;
    height: 14rem;
  }
}
.header__logo a {
  display: block;
  padding: 1.3rem 0 1.1rem;
  text-align: center;
  width: 100%;
  height: 100%;
}
@media (720px <= width) {
  .header__logo a {
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
  }
}
@media (720px <= width) {
  .header__logo picture {
    width: 80.2469135802%;
  }
}
.header__logo img {
  width: 19.017rem;
}
@media (720px <= width) {
  .header__logo img {
    width: 100%;
  }
}
.header .btn_menu {
  width: 6rem;
  height: 6rem;
  background-color: var(--clr-main);
  margin-left: auto;
  border-radius: 0 0 0 1.6rem;
  text-align: center;
  position: relative;
  z-index: 110;
}
@media (1024px <= width) {
  .header .btn_menu {
    display: none;
  }
}
.header .btn_menu span {
  background-color: #fff;
  border-radius: 100rem;
  width: 2.5rem;
  height: 1px;
  display: block;
  position: absolute;
  left: 50%;
  transform: translate(-50%, -50%);
  transition: all 0.25s cubic-bezier(0.43, 0.05, 0.17, 1);
}
.header .btn_menu span:nth-child(1) {
  top: calc(50% - 0.6rem);
}
.header .btn_menu span:nth-child(2) {
  top: 50%;
}
.header .btn_menu span:nth-child(3) {
  top: calc(50% + 0.6rem);
}
body.is-menuopen .header .btn_menu span:nth-child(1) {
  top: 50%;
  transform: translate(-50%, -50%) rotate(45deg);
}
body.is-menuopen .header .btn_menu span:nth-child(2) {
  opacity: 0;
}
body.is-menuopen .header .btn_menu span:nth-child(3) {
  top: 50%;
  transform: translate(-50%, -50%) rotate(-45deg);
}
.header__nav {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-color: #fff;
  padding-top: 11rem;
  padding-left: 2rem;
  padding-right: 2rem;
  padding-bottom: 10rem;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease-in;
}
@media (width < 1024px) {
  body.is-menuopen .header__nav {
    opacity: 1;
    pointer-events: auto;
    overflow-y: auto;
  }
}
@media (1024px <= width) {
  .header__nav {
    opacity: 1;
    pointer-events: auto;
    transition: none;
    padding: 0;
    position: relative;
    background: none;
    width: auto;
    height: auto;
    padding: 0;
    display: grid;
    grid-template-columns: auto max-content;
    margin-left: auto;
    width: 100%;
  }
}
.header__nav .gnav {
  border-top: 1px solid #ccc;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0 1.5rem;
}
@media (1024px <= width) {
  .header__nav .gnav {
    grid-template-columns: repeat(7, max-content);
    gap: 0;
    margin-left: auto;
    border-top: none;
    position: relative;
  }
}
.header__nav .gnav .wrap:not(.wide) {
  border-bottom: 1px solid #ccc;
}
@media (1024px <= width) {
  .header__nav .gnav .wrap:not(.wide) {
    border: none;
  }
}
@media (1024px <= width) {
  .header__nav .gnav .wrap.notpc {
    display: none;
  }
}
@media (1024px <= width) {
  .header__nav .gnav .wrap {
    display: table-cell;
  }
}
@media (width < 1024px) {
  .header__nav .gnav .wide {
    grid-column: 1/3;
  }
}
@media (1280px <= width) {
  .header__nav .gnav .wide {
    grid-column: auto;
  }
}
.header__nav .gnav .wide .box {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0 1.5rem;
}
@media (1024px <= width) {
  .header__nav .gnav .wide .box {
    opacity: 0;
    pointer-events: none;
    position: absolute;
    max-width: 80rem;
    width: 100%;
    height: 16rem;
    display: grid;
    justify-content: center;
    transition: opacity 0.3s ease;
    gap: 0 4rem;
    background-color: #fff;
  }
}
@media (1024px <= width) {
  .header__nav .gnav .wide.pulldown a {
    height: auto;
  }
}
@media (1024px <= width) {
  .header__nav .gnav .wide.pulldown.pullopen > span {
    color: var(--clr-main);
  }
  .header__nav .gnav .wide.pulldown.pullopen .box {
    opacity: 1;
    pointer-events: all;
  }
}
.header__nav .gnav .wide a {
  border-bottom: 1px solid #ccc;
  padding-bottom: 2rem;
  padding-top: 0;
}
@media (1024px <= width) {
  .header__nav .gnav .wide a {
    border: none;
    padding: 0;
  }
}
.header__nav .gnav span,
.header__nav .gnav a {
  font-weight: 700;
  font-size: 1.6rem;
  line-height: 1em;
  padding: 2rem 0;
  display: block;
}
@media (720px <= width) {
  .header__nav .gnav span,
  .header__nav .gnav a {
    font-size: 1.4rem;
    color: var(--color);
    --color: var(--clr-text);
  }
}
@media (1024px <= width) {
  .header__nav .gnav span,
  .header__nav .gnav a {
    padding: 0 0.5rem;
    height: 14rem;
    font-size: 1.4rem;
  }
  .header:not(.is-scrolled) .header__nav .gnav span,
  .header:not(.is-scrolled) .header__nav .gnav a {
    --color: #fff;
  }
  body.nonimages .header:not(.is-scrolled) .header__nav .gnav span,
  body.nonimages .header:not(.is-scrolled) .header__nav .gnav a {
    --color: var(--clr-text);
  }
}
@media (1024px <= width) and (1024px <= width) {
  body.pullopen .header:not(.is-scrolled) .header__nav .gnav span,
  body.pullopen .header:not(.is-scrolled) .header__nav .gnav a {
    --color: var(--clr-text);
  }
}
@media (1280px <= width) {
  .header__nav .gnav span,
  .header__nav .gnav a {
    font-size: 1.6rem;
    text-align: center;
    padding: 0 1rem;
  }
}
@media (1536px <= width) {
  .header__nav .gnav span,
  .header__nav .gnav a {
    font-size: 2rem;
  }
}
@media (1024px <= width) {
  .header__nav .gnav span {
    display: flex;
    align-items: center;
    justify-content: center;
  }
}
.header__nav .gnav a {
  position: relative;
  display: flex;
  align-items: center;
}
@media (hover: hover) and (width >= 720px) {
  .header__nav .gnav a {
    transition: all var(--speed) ease-in-out;
  }
  .header__nav .gnav a:hover {
    color: var(--clr-main);
  }
}
@media (1024px <= width) {
  .header__nav .gnav a {
    justify-content: center;
  }
}
.header__nav .gnav a.link::after {
  content: "";
  background: url('data:image/svg+xml;charset=utf8, <svg width="14" height="12" viewBox="0 0 14 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M8.63636 1.00002L13 6.00002L8.63636 11M12.5152 6.00002H1" stroke="%23009BFF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>') center/contain no-repeat;
  width: 1.2rem;
  height: 1rem;
  margin-left: auto;
}
@media (1024px <= width) {
  .header__nav .gnav a.link::after {
    content: none;
  }
}
.header__nav .buttonarea {
  margin-top: 4rem;
}
@media (1024px <= width) {
  .header__nav .buttonarea {
    margin-top: 0;
  }
}
.header__nav .buttonarea a {
  margin-left: auto;
  margin-right: auto;
  width: 335px;
  height: 60px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0 1.5rem;
  font-size: 1.8rem;
  font-weight: 700;
  text-align: center;
  color: #ffffff;
}
@media (1024px <= width) {
  .header__nav .buttonarea a {
    width: auto;
    height: 100%;
    padding: 0 1rem 0 0.5rem;
    gap: 1rem;
    white-space: nowrap;
    width: -moz-min-content;
    width: min-content;
    margin: 0;
    font-size: 1.4rem;
    color: var(--color);
    --color: var(--clr-text);
  }
}
@media (1024px <= width) {
  body:not(.nonimages) .header:not(.is-scrolled) .header__nav .buttonarea a {
    --color: #fff;
  }
  body:not(.nonimages).pullopen .header:not(.is-scrolled) .header__nav .buttonarea a {
    --color: var(--clr-text);
  }
}
@media (1280px <= width) {
  .header__nav .buttonarea a {
    padding: 0 1rem;
    font-size: 1.8rem;
  }
}
@media (1536px <= width) {
  .header__nav .buttonarea a {
    font-size: 2rem;
    padding: 0 2rem;
  }
}
@media (hover: hover) and (width >= 1024px) {
  .header__nav .buttonarea a {
    transition: all var(--speed) ease-in-out;
  }
  .header__nav .buttonarea a:hover {
    opacity: 1;
    color: var(--clr-main);
  }
}
.header__nav .buttonarea a::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, #ffe100 0%, #009bff 70%);
  border-radius: 60px;
}
@media (1024px <= width) {
  .header__nav .buttonarea a::before {
    content: none;
  }
}
.header__nav .buttonarea a i,
.header__nav .buttonarea a span {
  position: relative;
  z-index: 2;
}
@media (1024px <= width) {
  .header__nav .buttonarea a i {
    background: url('data:image/svg+xml;charset=utf8, <svg width="23" height="18" viewBox="0 0 23 18" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M13.8 10.125H19.55V7.875H13.8V10.125ZM13.8 6.75H19.55V4.5H13.8V6.75ZM3.45 13.5H12.65V12.8812C12.65 12.0375 12.2283 11.3674 11.385 10.8709C10.5417 10.3744 9.43 10.1257 8.05 10.125C6.67 10.1242 5.55833 10.3729 4.715 10.8709C3.87167 11.3689 3.45 12.039 3.45 12.8812V13.5ZM8.05 9C8.6825 9 9.22415 8.77987 9.67495 8.33962C10.1257 7.89937 10.3508 7.3695 10.35 6.75C10.3492 6.1305 10.1242 5.601 9.67495 5.1615C9.22568 4.722 8.68403 4.5015 8.05 4.5C7.41597 4.4985 6.8747 4.719 6.4262 5.1615C5.9777 5.604 5.7523 6.1335 5.75 6.75C5.7477 7.3665 5.9731 7.89637 6.4262 8.33962C6.8793 8.78287 7.42057 9.003 8.05 9ZM2.3 18C1.6675 18 1.12623 17.7799 0.6762 17.3396C0.226167 16.8994 0.000766667 16.3695 0 15.75V2.25C0 1.63125 0.2254 1.10175 0.6762 0.6615C1.127 0.22125 1.66827 0.00075 2.3 0H20.7C21.3325 0 21.8741 0.2205 22.3249 0.6615C22.7757 1.1025 23.0008 1.632 23 2.25V15.75C23 16.3687 22.775 16.8986 22.3249 17.3396C21.8749 17.7806 21.3333 18.0007 20.7 18H2.3Z" fill="%23009BFF"/></svg>') center/contain no-repeat;
  }
}
.header__nav .subnav {
  margin-top: 4rem;
  padding-left: 2.5rem;
  padding-right: 2.5rem;
  display: flex;
  flex-wrap: wrap;
  gap: 1rem 2rem;
}
.header__nav .subnav a {
  font-size: 1.3rem;
}
@media (1024px <= width) {
  .header__nav .subnav {
    display: none;
  }
}

.footer {
  padding-top: 8rem;
  padding-left: 2rem;
  padding-right: 2rem;
  padding-bottom: 13rem;
  border-top: 1px solid var(--clr-line);
  position: relative;
}
@media (720px <= width) {
  .footer {
    padding-left: 0;
    padding-right: 0;
  }
}
@media (720px <= width) {
  .footer__inner {
    margin-left: max(50% - 85rem, 6rem);
    margin-right: max(50% - 85rem, 6rem);
  }
}
@media (1024px <= width) {
  .footer__inner {
    display: grid;
    grid-template-columns: 32.5rem auto;
    gap: 0 10rem;
  }
}
.footer__logo {
  width: 21.7rem;
}
@media (720px <= width) {
  .footer__logo {
    width: 32.5rem;
  }
}
.footer__nav {
  margin-top: 5rem;
}
@media (1024px <= width) {
  .footer__nav {
    margin-top: 0;
  }
}
@media (1536px <= width) {
  .footer__nav {
    display: grid;
    grid-template-columns: auto 32rem;
    gap: 12rem;
  }
}
.footer .gnav {
  display: grid;
  gap: 1.3rem;
}
@media (720px <= width) {
  .footer .gnav {
    grid-template-columns: repeat(2, max-content);
    gap: 2rem 3em;
    grid-auto-flow: column;
    grid-template-rows: repeat(5, auto);
    margin-left: auto;
  }
}
.footer .gnav a {
  display: flex;
  align-items: center;
  gap: 1rem;
  font-size: 1.6rem;
  font-weight: 700;
  color: var(--clr-main);
}
@media (hover: hover) and (width >= 720px) {
  .footer .gnav a {
    transition: all var(--speed) ease-in-out;
  }
  .footer .gnav a:hover {
    opacity: 0.7;
  }
}
.footer .buttonarea {
  margin-top: 3.4rem;
}
@media (1536px <= width) {
  .footer .buttonarea {
    margin-top: 0;
  }
}
.footer .buttonarea a {
  margin-left: auto;
  margin-right: auto;
  height: 60px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0 1.5rem;
  font-size: 1.8rem;
  font-weight: 700;
  text-align: center;
  color: #ffffff;
}
@media (720px <= width) {
  .footer .buttonarea a {
    width: 32rem;
    padding: 0 1rem 0 0.5rem;
    gap: 1rem;
    white-space: nowrap;
    margin: 0;
    font-size: 1.4rem;
  }
}
@media (1024px <= width) {
  .footer .buttonarea a {
    font-size: 1.6rem;
  }
}
@media (1280px <= width) {
  .footer .buttonarea a {
    padding: 0 1rem;
    font-size: 1.8rem;
  }
}
@media (1536px <= width) {
  .footer .buttonarea a {
    font-size: 2rem;
    padding: 0 2rem;
  }
}
.footer .buttonarea a::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, #ffe100 0%, #009bff 70%);
  border-radius: 60px;
}
.footer .buttonarea a i,
.footer .buttonarea a span {
  position: relative;
  z-index: 2;
}
@media (hover: hover) and (width >= 720px) {
  .footer .buttonarea a::before {
    transition: all var(--speed) ease-in-out;
  }
  .footer .buttonarea a:hover {
    opacity: 1;
  }
  .footer .buttonarea a:hover::before {
    width: calc(100% + 1rem);
    height: calc(100% + 1rem);
  }
}
.footer .subnav {
  margin-top: 6rem;
  padding-top: 6rem;
  border-top: 1px solid var(--clr-line);
  display: flex;
  flex-wrap: wrap;
  gap: 1rem 2rem;
  justify-content: space-between;
}
@media (720px <= width) {
  .footer .subnav {
    gap: 0 4rem;
    justify-content: center;
    grid-column: 1/3;
  }
}
@media (1280px <= width) {
  .footer .subnav {
    justify-content: flex-start;
  }
}
@media (hover: hover) and (width >= 720px) {
  .footer .subnav a {
    transition: all var(--speed) ease-in-out;
  }
  .footer .subnav a:hover {
    opacity: 0.7;
  }
}
.footer .copyright {
  margin-top: 4rem;
  text-align: center;
  color: var(--clr-lighttext);
  font-size: 1.4rem;
}
@media (720px <= width) {
  .footer .copyright {
    font-size: 1.8rem;
    grid-column: 1/3;
  }
}
@media (1280px <= width) {
  .footer .copyright {
    position: absolute;
    right: 11rem;
    bottom: 13rem;
    line-height: 2.8rem;
  }
}

.floatingbanner {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  position: fixed;
  left: 0;
  bottom: 0;
  z-index: 100;
  width: 100%;
}
@media (720px <= width) {
  .floatingbanner {
    bottom: 10rem;
    left: auto;
    right: 3rem;
    width: 29rem;
    gap: 1rem;
    transition: opacity var(--speed) ease-in-out;
  }
  .floatingbanner.is-hidden {
    opacity: 0;
    pointer-events: none;
  }
}
.floatingbanner a {
  text-align: center;
  color: #fff;
  font-weight: 700;
  height: 5rem;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.8rem;
}
@media (720px <= width) {
  .floatingbanner a {
    aspect-ratio: 1;
    height: auto;
    border-radius: 1000rem;
    text-indent: -999em;
    position: relative;
  }
  .floatingbanner a::after {
    content: "";
    width: 100%;
    aspect-ratio: 1;
    position: absolute;
    left: calc(50% - 7rem);
    top: calc(50% - 7rem);
  }
}
@media (hover: hover) and (width >= 720px) {
  .floatingbanner a::after {
    transition: all var(--speed) ease-in-out;
  }
  .floatingbanner a:hover::after {
    transform: scale(1.02);
  }
}
.floatingbanner a.gym {
  background: var(--clr-main);
}
@media (720px <= width) {
  .floatingbanner a.gym {
    background: none;
  }
  .floatingbanner a.gym::after {
    background: url(../images/common/floatingbanner_gym.webp) center/contain no-repeat;
    background-image: -webkit-image-set(url(../images/common/floatingbanner_gym.webp) 1x, url(../images/common/floatingbanner_gym@2x.webp) 2x);
    background-image: image-set(url(../images/common/floatingbanner_gym.webp) 1x, url(../images/common/floatingbanner_gym@2x.webp) 2x);
  }
}
.floatingbanner a.gym i {
  width: 1.9rem;
  height: 1rem;
}
@media (720px <= width) {
  .floatingbanner a.gym i {
    display: none;
  }
}
.floatingbanner a.guidance {
  background: linear-gradient(90deg, #ffe100 0%, var(--clr-main) 70%);
}
@media (720px <= width) {
  .floatingbanner a.guidance {
    background: none;
  }
  .floatingbanner a.guidance::after {
    background: url(../images/common/floatingbanner_guidance.webp) center/contain no-repeat;
    background-image: -webkit-image-set(url(../images/common/floatingbanner_guidance.webp) 1x, url(../images/common/floatingbanner_guidance@2x.webp) 2x);
    background-image: image-set(url(../images/common/floatingbanner_guidance.webp) 1x, url(../images/common/floatingbanner_guidance@2x.webp) 2x);
  }
}
.floatingbanner a.guidance i {
  width: 1.5rem;
  height: 1.2rem;
}
@media (720px <= width) {
  .floatingbanner a.guidance i {
    display: none;
  }
}

@media (720px <= width) {
  .w_1000 {
    margin-left: max(50% - 500px, 5rem);
    margin-right: max(50% - 500px, 5rem);
    max-width: 1000px;
    width: calc(100% - 10rem);
  }
}
@media (1280px <= width) {
  .w_1000 {
    margin-left: max(50% - 500px, 11rem);
    margin-right: max(50% - 500px, 11rem);
    width: calc(100% - 22rem);
  }
}

@media (720px <= width) {
  .w_1100 {
    margin-left: max(50% - 550px, 5rem);
    margin-right: max(50% - 550px, 5rem);
    max-width: 1100px;
    width: calc(100% - 10rem);
  }
}
@media (1280px <= width) {
  .w_1100 {
    margin-left: max(50% - 550px, 11rem);
    margin-right: max(50% - 550px, 11rem);
    width: calc(100% - 22rem);
  }
}

@media (720px <= width) {
  .w_1200 {
    margin-left: max(50% - 600px, 5rem);
    margin-right: max(50% - 600px, 5rem);
    max-width: 1200px;
    width: calc(100% - 10rem);
  }
}
@media (1280px <= width) {
  .w_1200 {
    margin-left: max(50% - 600px, 11rem);
    margin-right: max(50% - 600px, 11rem);
    width: calc(100% - 22rem);
  }
}

@media (720px <= width) {
  .w_1300 {
    margin-left: max(50% - 650px, 5rem);
    margin-right: max(50% - 650px, 5rem);
    max-width: 1300px;
    width: calc(100% - 10rem);
  }
}
@media (1280px <= width) {
  .w_1300 {
    margin-left: max(50% - 650px, 11rem);
    margin-right: max(50% - 650px, 11rem);
    width: calc(100% - 22rem);
  }
}

@media (720px <= width) {
  .w_1400 {
    margin-left: max(50% - 700px, 5rem);
    margin-right: max(50% - 700px, 5rem);
    max-width: 1400px;
    width: calc(100% - 10rem);
  }
}
@media (1280px <= width) {
  .w_1400 {
    margin-left: max(50% - 700px, 11rem);
    margin-right: max(50% - 700px, 11rem);
    width: calc(100% - 22rem);
  }
}

@media (720px <= width) {
  .w_1500 {
    margin-left: max(50% - 750px, 5rem);
    margin-right: max(50% - 750px, 5rem);
    max-width: 1500px;
    width: calc(100% - 10rem);
  }
}
@media (1280px <= width) {
  .w_1500 {
    margin-left: max(50% - 750px, 11rem);
    margin-right: max(50% - 750px, 11rem);
    width: calc(100% - 22rem);
  }
}

@media (720px <= width) {
  .w_1600 {
    margin-left: max(50% - 800px, 5rem);
    margin-right: max(50% - 800px, 5rem);
    max-width: 1600px;
    width: calc(100% - 10rem);
  }
}
@media (1280px <= width) {
  .w_1600 {
    margin-left: max(50% - 800px, 11rem);
    margin-right: max(50% - 800px, 11rem);
    width: calc(100% - 22rem);
  }
}

@media (720px <= width) {
  .w_1700 {
    margin-left: max(50% - 850px, 5rem);
    margin-right: max(50% - 850px, 5rem);
    max-width: 1700px;
    width: calc(100% - 10rem);
  }
}
@media (1280px <= width) {
  .w_1700 {
    margin-left: max(50% - 850px, 11rem);
    margin-right: max(50% - 850px, 11rem);
    width: calc(100% - 22rem);
  }
}

.buttonarea {
  margin-top: 3rem;
  text-align: right;
}
.buttonarea:has(.small) {
  margin-top: 0;
}
@media (720px <= width) {
  .buttonarea:has(.small) {
    margin-top: 1rem;
  }
}

.postList.news {
  border-top: 1px solid var(--clr-line);
}
.postList.news a {
  border-bottom: 1px solid var(--clr-line);
  display: block;
  padding: 2rem 0;
  padding-right: 2.8rem;
  display: grid;
  grid-template-columns: 9.8rem auto;
  gap: 1.5rem 0;
  position: relative;
}
@media (720px <= width) {
  .postList.news a {
    padding: 3rem 0;
    padding-right: 4rem;
    grid-template-columns: 18rem 23rem auto;
    gap: 0;
  }
}
@media (hover: hover) and (width >= 720px) {
  .postList.news a {
    transition: all var(--speed) ease-in-out;
  }
  .postList.news a:hover {
    padding-left: 0.3rem;
  }
}
.postList.news a::after {
  content: "";
  background: url('data:image/svg+xml;charset=utf8, <svg width="15" height="12" viewBox="0 0 15 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M9.27273 1L14 6L9.27273 11M13.4747 6H1" stroke="%23009BFF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>') center/contain no-repeat;
  width: 1.4rem;
  height: 1.1rem;
  position: absolute;
  right: 0;
  top: calc(50% - 0.65rem);
}
@media (720px <= width) {
  .postList.news a::after {
    right: 2rem;
  }
}
.postList.news a time {
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 2.4rem;
  color: #000042;
}
@media (720px <= width) {
  .postList.news a time {
    padding-left: 2rem;
    font-size: 2rem;
    line-height: 3rem;
  }
}
.postList.news a .category {
  text-align: center;
  width: 14rem;
  border-radius: 100rem;
  line-height: 2.4rem;
  background-color: #e2e2e2;
  font-size: 1.3rem;
  font-weight: 700;
  color: #000042;
}
.postList.news a .category:has(img) {
  padding-left: 2rem;
  padding-right: 2rem;
}
@media (720px <= width) {
  .postList.news a .category {
    font-size: 1.6rem;
    width: 18rem;
    line-height: 3rem;
    align-self: start;
  }
}
.postList.news a .title {
  grid-column: 1/3;
  font-size: 1.6rem;
  line-height: 2.8rem;
}
@media (720px <= width) {
  .postList.news a .title {
    grid-column: 3/4;
    font-size: 2rem;
  }
}
@media (1024px <= width) {
  .postList.news.archive {
    border-top: none;
  }
}
.postList.news.archive a.post {
  display: block;
  padding-right: 0;
}
.postList.news.archive a.post::after {
  content: none;
}
@media (1024px <= width) {
  .postList.news.archive a.post:first-child {
    padding-top: 0;
    padding-bottom: 6rem;
  }
}
@media (1024px <= width) {
  .postList.news.archive a.post {
    padding-top: 6rem;
    padding-bottom: 6rem;
    position: relative;
    min-height: 34.5rem;
    display: grid;
    grid-template-columns: min(35%, 36rem) auto;
    gap: 0 4rem;
    align-content: center;
  }
}
@media (hover: hover) and (width >= 720px) {
  .postList.news.archive a.post .post__header,
  .postList.news.archive a.post .post__title,
  .postList.news.archive a.post .post__image {
    transition: all var(--speed) ease-in-out;
  }
  .postList.news.archive a.post:hover {
    color: var(--clr-main);
  }
  .postList.news.archive a.post:hover .post__header,
  .postList.news.archive a.post:hover .post__title,
  .postList.news.archive a.post:hover .post__image {
    transform: translateX(10px);
  }
}
.postList.news.archive .post__header {
  display: grid;
  grid-template-columns: 9.8rem auto;
  gap: 1.5rem 0;
  position: relative;
}
@media (720px <= width) {
  .postList.news.archive .post__header {
    grid-template-columns: 13rem auto;
  }
  .postList.news.archive .post__header time {
    padding-left: 0;
  }
}
@media (1024px <= width) {
  .postList.news.archive .post__header {
    grid-row: 1/2;
    grid-column: 2/3;
    align-self: end;
    grid-template-columns: 13rem 23rem;
    gap: 0;
    justify-self: start;
  }
}
.postList.news.archive .post__body {
  margin-top: 1.5rem;
  display: grid;
  grid-template-columns: auto 12.8rem;
  gap: 1.5rem;
}
@media (1024px <= width) {
  .postList.news.archive .post__body {
    display: contents;
  }
}
.postList.news.archive .post__title {
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 175%;
}
@media (1024px <= width) {
  .postList.news.archive .post__title {
    grid-column: 2/3;
    grid-row: 2/3;
    margin-top: 2rem;
    font-size: 2.4rem;
    line-height: 183.3333%;
  }
}
.postList.news.archive .post__image {
  aspect-ratio: 125/78;
  position: relative;
}
.postList.news.archive .post__image img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
@media (1024px <= width) {
  .postList.news.archive .post__image {
    max-width: 36rem;
    grid-row: 1/3;
    grid-column: 1/2;
  }
}
.postList.news.archive .post__image.noimage::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  border: 1px solid var(--clr-line);
  top: 0;
  left: 0;
  z-index: 1;
}

body:not(.home) .mv__inner {
  position: relative;
}
body:not(.home) .mv__img img {
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
@media (720px <= width) {
  body:not(.home) .mv__img img {
    height: 100vh;
  }
}
body:not(.home) .mv .breadcrumbs {
  position: absolute;
  top: 9rem;
  left: 2rem;
  color: #ccc;
  font-size: 1.1rem;
  font-weight: 700;
  line-height: 1em;
}
@media (720px <= width) {
  body:not(.home) .mv .breadcrumbs {
    left: max(50% - 85rem, 6rem);
    right: max(50% - 85rem, 6rem);
    top: 20rem;
    font-size: 2rem;
  }
}
body:not(.home) .mv .breadcrumbs a {
  color: #fff;
  text-decoration: underline;
}
body:not(.home) .mv .breadcrumbs .icon_breadcrumbs {
  margin: 0 0.4rem;
}
@media (720px <= width) {
  body:not(.home) .mv .breadcrumbs .icon_breadcrumbs {
    margin: 0 0.9rem;
  }
}
body:not(.home) .mv__pagetitle {
  color: #fff;
  position: absolute;
  bottom: 10rem;
  left: 2rem;
  right: 2rem;
}
@media (720px <= width) {
  body:not(.home) .mv__pagetitle {
    left: max(50% - 85rem, 6rem);
    right: max(50% - 85rem, 6rem);
    bottom: 18rem;
  }
}
body:not(.home) .mv__pagetitle .jp {
  font-size: 2rem;
  font-weight: 700;
  line-height: 1em;
}
@media (720px <= width) {
  body:not(.home) .mv__pagetitle .jp {
    font-size: 4rem;
  }
}
body:not(.home) .mv__pagetitle .en {
  font-size: min(6.4rem, 15vw);
  font-weight: 700;
  font-family: var(--ff-Outfit);
  line-height: 1em;
  margin-top: 1rem;
}
@media (720px <= width) {
  body:not(.home) .mv__pagetitle .en {
    font-size: min(13.6rem, 10vw);
  }
}
body:not(.home) .mv__pagetitle .lbl {
  font-size: 3.2rem;
  font-weight: 700;
  line-height: 1.375;
  color: var(--clr-text);
}
body:not(.home) .mv__pagetitle .label {
  background-color: var(--color);
  color: #fff;
  display: inline-block;
  font-size: 1.3rem;
  font-weight: 700;
  line-height: 1;
  padding: 0.5rem 2rem;
  border-radius: 100rem;
}
@media (720px <= width) {
  body:not(.home) .mv__pagetitle .label {
    font-size: 1.8rem;
    padding: 0.6rem 2rem;
  }
}
body:not(.home) .mv__pagetitle .title {
  margin-top: 2rem;
  font-size: 3.2rem;
  font-weight: 700;
  line-height: 1.375;
  color: var(--clr-text);
}
@media (720px <= width) {
  body:not(.home) .mv__pagetitle .title {
    margin-top: 3rem;
    font-size: 4.6rem;
    line-height: 1.4783;
  }
}
body:not(.home).nonimages .mv__img {
  height: 28.9rem;
}
@media (720px <= width) {
  body:not(.home).nonimages .mv__img {
    height: 58.6rem;
  }
}
body:not(.home).nonimages .breadcrumbs {
  color: #999;
}
body:not(.home).nonimages .breadcrumbs a {
  color: var(--clr-text);
}
body:not(.home).nonimages .mv__pagetitle {
  color: var(--clr-main);
  bottom: 0;
}
body:not(.home).nonimages .recruit .mv__img {
  height: 37.3rem;
}
@media (720px <= width) {
  body:not(.home).nonimages .recruit .mv__img {
    height: 60.8rem;
  }
}
body:not(.home).nonimages .recruit .mv__pagetitle {
  bottom: 6rem;
}
@media (720px <= width) {
  body:not(.home).nonimages .recruit .mv__pagetitle {
    bottom: 16rem;
  }
}
body:not(.home).nonimages .border {
  position: relative;
}
body:not(.home).nonimages .border .mv__pagetitle {
  bottom: 6rem;
}
@media (720px <= width) {
  body:not(.home).nonimages .border .mv__pagetitle {
    bottom: 16rem;
  }
}
body:not(.home).nonimages .border::after {
  content: "";
  display: block;
  height: 0;
  border-bottom: 1px solid var(--clr-line);
  margin-left: 2rem;
  margin-right: 2rem;
}
@media (720px <= width) {
  body:not(.home).nonimages .border::after {
    max-width: 170rem;
    margin-left: max(50% - 85rem, 6rem);
    margin-right: max(50% - 85rem, 6rem);
  }
}
body:not(.home) .mv.input .mv__img {
  height: 34.9rem;
}
body:not(.home) .mv.input .mv__pagetitle {
  bottom: 6rem;
}

#index {
  margin: 10rem 2rem;
}
@media (720px <= width) {
  #index {
    max-width: 170rem;
    margin-left: max(50% - 85rem, 6rem);
    margin-right: max(50% - 85rem, 6rem);
    margin-top: 16rem;
    margin-bottom: 0;
  }
}

.index {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  border: 1px solid #ccc;
  border-width: 1px 0 0;
  position: relative;
}
@media (720px <= width) {
  .index::after {
    content: "";
    width: 100%;
    height: 1px;
    background-color: #ccc;
    position: absolute;
    bottom: 0;
    left: 0;
  }
}
@media (width < 720px) {
  .index.column3 a:nth-child(3) {
    grid-column: span 2;
    border-right: none;
  }
  .index.column5 a:nth-child(5) {
    grid-column: span 2;
    border-right: none;
  }
}
@media (720px <= width) {
  .index {
    grid-template-columns: repeat(4, 1fr);
  }
  .index.column2 {
    grid-template-columns: repeat(2, 1fr);
  }
  .index.column3 {
    grid-template-columns: repeat(3, 1fr);
  }
  .index.column5 {
    grid-template-columns: repeat(5, 1fr);
  }
  .index.column6 {
    grid-template-columns: repeat(6, 1fr);
  }
  .index.flex {
    display: flex;
  }
  .index.flex a {
    flex-grow: 1;
  }
}
.index a {
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 2rem;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0 0.6rem;
  padding: 1.5rem 0;
}
@media (width < 720px) {
  .index a:has(br) {
    padding: 0.5rem 0;
  }
}
.index a span {
  text-align: center;
}
.index a span.flexwrap {
  display: flex;
  flex-wrap: wrap;
  gap: 0 0.6rem;
}
@media (720px <= width) {
  .index a {
    font-size: 2rem;
    padding: 3.8rem 1rem;
  }
}
@media (hover: hover) and (width >= 720px) {
  .index a span,
  .index a i {
    transition: all var(--speed) ease-in-out;
  }
  .index a:hover.down span,
  .index a:hover.down i {
    transform: translateY(2px);
  }
  .index a:hover.next span,
  .index a:hover.next i {
    transform: translateX(2px);
  }
}
.index a.down i {
  background: url('data:image/svg+xml;charset=utf8, <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="10" cy="10" r="10" transform="rotate(90 10 10)" fill="%23009BFF"/><path d="M13.7179 10.3945C14.1023 10.791 14.0927 11.4241 13.6964 11.8086L10.6964 14.7178C10.3085 15.0939 9.69168 15.0939 9.30379 14.7178L6.30379 11.8086C5.90749 11.4241 5.8979 10.791 6.28231 10.3945C6.6668 9.99823 7.29995 9.98864 7.69637 10.373L9.00008 11.6377L9.00008 6C9.00008 5.44772 9.4478 5 10.0001 5C10.5524 5 11.0001 5.44772 11.0001 6L11.0001 11.6377L12.3038 10.373C12.7002 9.98864 13.3334 9.99823 13.7179 10.3945Z" fill="white"/></svg>') center/contain no-repeat;
  width: 2rem;
  aspect-ratio: 1;
  display: inline-block;
}
@media (720px <= width) {
  .index a.down i {
    width: 2.4rem;
  }
}
.index a.next i {
  background: url('data:image/svg+xml;charset=utf8, <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12 24C5.37258 24 -8.1423e-07 18.6274 -5.24537e-07 12C-2.34843e-07 5.37258 5.37258 -8.1423e-07 12 -5.24537e-07C18.6274 -2.34843e-07 24 5.37258 24 12C24 18.6274 18.6274 24 12 24Z" fill="white"/><path d="M12 23C18.0751 23 23 18.0751 23 12C23 5.92487 18.0751 1 12 0.999999C5.92487 0.999999 1 5.92487 0.999999 12L-5.24537e-07 12C-2.34843e-07 5.37258 5.37258 -8.1423e-07 12 -5.24537e-07C18.6274 -2.34843e-07 24 5.37258 24 12C24 18.6274 18.6274 24 12 24C5.37258 24 -8.1423e-07 18.6274 -5.24537e-07 12L0.999999 12C0.999999 18.0751 5.92487 23 12 23Z" fill="%23009BFF"/><path d="M12.6914 7.25976C13.1 6.88867 13.7321 6.91874 14.1035 7.32715L17.7402 11.3271C18.0869 11.7086 18.0869 12.2914 17.7402 12.6728L14.1035 16.6728C13.7321 17.0813 13.1 17.1113 12.6914 16.7402C12.2827 16.3687 12.2525 15.7358 12.624 15.3271L14.7393 13L7 13C6.44772 13 6 12.5523 6 12C6 11.4477 6.44772 11 7 11L14.7393 11L12.624 8.67285C12.2525 8.26419 12.2827 7.63127 12.6914 7.25976Z" fill="%23009BFF"/></svg>') center/contain no-repeat;
  width: 2rem;
  aspect-ratio: 1;
  display: inline-block;
}
@media (720px <= width) {
  .index a.next i {
    width: 2.4rem;
  }
}
@media (width < 720px) {
  .index a {
    border-bottom: 1px solid #ccc;
  }
  .index a:nth-child(odd) {
    border-right: 1px solid #ccc;
  }
}
@media (720px <= width) {
  .index a:not(:last-child) {
    position: relative;
  }
  .index a:not(:last-child)::after {
    content: "";
    width: 1px;
    height: 4rem;
    background-color: #d9d9d9;
    position: absolute;
    right: 0;
    top: calc(50% - 2rem);
  }
}

@media (720px <= width) {
  .order1 {
    order: 1;
  }
}

@media (720px <= width) {
  .order2 {
    order: 2;
  }
}

@media (720px <= width) {
  .order3 {
    order: 3;
  }
}

@media (720px <= width) {
  .order4 {
    order: 4;
  }
}

@media (720px <= width) {
  .order5 {
    order: 5;
  }
}

@media (720px <= width) {
  .order6 {
    order: 6;
  }
}

@media (720px <= width) {
  .order7 {
    order: 7;
  }
}

@media (720px <= width) {
  .order8 {
    order: 8;
  }
}

.comingsoon {
  text-decoration: line-through;
  pointer-events: none;
}

.traininglocations {
  padding: 10rem 2rem;
}
@media (720px <= width) {
  .traininglocations {
    padding: 20rem max(50% - 85rem, 6rem);
  }
}
@media (1024px <= width) {
  .traininglocations__header {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 11.7647058824%;
  }
}
.traininglocations__coution {
  margin-top: 4rem;
  font-size: 1.6rem;
  line-height: 160%;
  color: #999999;
}
@media (1024px <= width) {
  .traininglocations__coution {
    margin-top: 0;
    font-size: 2rem;
    line-height: 3.6rem;
  }
}
.traininglocations__coution li {
  padding-left: 1.2em;
  text-indent: -1.2em;
}
.traininglocations__lists {
  margin-top: 6rem;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 3rem 1.5rem;
}
@media (720px <= width) {
  .traininglocations__lists {
    gap: 6rem 3.5294117647%;
  }
}
@media (1024px <= width) {
  .traininglocations__lists {
    margin-top: 16rem;
    grid-template-columns: repeat(4, 1fr);
  }
}
.traininglocations .gym__type {
  margin-top: 1.5rem;
  display: flex;
  gap: 0.4rem;
}
@media (720px <= width) {
  .traininglocations .gym__type {
    margin-top: 3rem;
    gap: 0.5rem;
  }
}
.traininglocations .gym__type span {
  padding: 0.3rem 0.5rem;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1;
  color: #fff;
  border-radius: 100rem;
}
@media (720px <= width) {
  .traininglocations .gym__type span {
    padding: 0.5rem 1.5rem;
    font-size: 1.6rem;
  }
}
.traininglocations .gym__type span.tag__fitness {
  background-color: #ff47ae;
}
.traininglocations .gym__type span.tag__ride {
  background-color: #009bff;
}
.traininglocations .gym__type span.tag__hf24 {
  background-color: #36993e;
}
.traininglocations .gym__name {
  margin-top: 1rem;
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 150%;
  color: #333;
}
@media (720px <= width) {
  .traininglocations .gym__name {
    font-size: 2.4rem;
    line-height: 4rem;
  }
}
.traininglocations .gym__pref {
  margin-top: 1rem;
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 1;
  color: #999;
}
@media (720px <= width) {
  .traininglocations .gym__pref {
    font-size: 1.8rem;
  }
}
.traininglocations .gym__links {
  margin-top: 1.5rem;
}
@media (720px <= width) {
  .traininglocations .gym__links {
    margin-top: 2.4rem;
  }
}
.traininglocations .gym__links a {
  display: block;
  text-align: center;
  padding: 1.3rem;
  position: relative;
  font-size: 1.4rem;
  line-height: 1;
  font-weight: 700;
  color: var(--clr-main);
}
.traininglocations .gym__links a::before {
  content: "";
  pointer-events: none;
  border: 1px solid var(--clr-line);
  border-radius: 100rem;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
@media (720px <= width) {
  .traininglocations .gym__links a {
    padding: 1.5rem;
    font-size: 2rem;
  }
}
@media (hover: hover) and (width >= 720px) {
  .traininglocations .gym__links a {
    transition: all var(--speed) ease-in-out;
  }
  .traininglocations .gym__links a::before {
    transition: transform var(--speed) ease-in-out;
  }
  .traininglocations .gym__links a:hover::before {
    transform: scale(1.05, 1.1);
  }
}
.traininglocations .gym__links a i {
  position: absolute;
  right: 1.5rem;
  top: 50%;
  transform: translateY(-50%);
}
@media (720px <= width) {
  .traininglocations .gym__links a i {
    right: 1.9rem;
    width: 2.4rem;
    height: 2.4rem;
  }
}

.fadeinUp {
  opacity: 0;
  transform: translateY(30px);
  transition: transform var(--speed) ease-in-out, opacity var(--speed) ease-in-out;
  transition-delay: var(--delay);
}
.fadeinUp.is-animeted {
  opacity: 1;
  transform: translateY(0);
}

.delay1 {
  transition-delay: 0.3s;
}

.delay2 {
  transition-delay: 0.6s;
}

.delay3 {
  transition-delay: 0.9s;
}

.delay4 {
  transition-delay: 1.2s;
}

.delay5 {
  transition-delay: 1.5s;
}

.delay6 {
  transition-delay: 1.8s;
}

.delay7 {
  transition-delay: 2.1s;
}

.delay8 {
  transition-delay: 2.4s;
}

.delay9 {
  transition-delay: 2.7s;
}

.delay10 {
  transition-delay: 3s;
}

@keyframes anim--first {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(-100%);
  }
}
a.button,
button.button,
input[type=submit].button,
input[type=reset].button {
  display: block;
}
@media (hover: hover) and (width >= 720px) {
  a.button,
  button.button,
  input[type=submit].button,
  input[type=reset].button {
    transition: opacity var(--ani);
  }
  a.button:hover,
  button.button:hover,
  input[type=submit].button:hover,
  input[type=reset].button:hover {
    opacity: 0.7;
  }
}
a.base,
button.base,
input[type=submit].base,
input[type=reset].base {
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: var(--clr-main);
  color: #fff;
  font-size: 1.6rem;
  font-weight: 700;
  height: 4.7rem;
  border-radius: 4px;
  gap: 1rem;
}
@media (720px <= width) {
  a.base,
  button.base,
  input[type=submit].base,
  input[type=reset].base {
    font-size: 2.4rem;
    height: 8.2rem;
    gap: 1rem;
  }
}
a.grade,
button.grade,
input[type=submit].grade,
input[type=reset].grade {
  width: 335px;
  height: 60px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0 1.5rem;
}
a.grade::before,
button.grade::before,
input[type=submit].grade::before,
input[type=reset].grade::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, #ffe100 0%, #009bff 70%);
  border-radius: 60px;
}
a.grade i,
a.grade span,
button.grade i,
button.grade span,
input[type=submit].grade i,
input[type=submit].grade span,
input[type=reset].grade i,
input[type=reset].grade span {
  position: relative;
  z-index: 2;
}
a.grade span,
button.grade span,
input[type=submit].grade span,
input[type=reset].grade span {
  font-size: 1.8rem;
  font-weight: 700;
  /* ボックスの高さと同一、または100% */
  text-align: center;
  color: #ffffff;
}

.links.viewmore {
  font-size: 1.6rem;
  font-weight: 700;
  color: var(--clr-main);
  display: inline-flex;
  align-items: center;
  gap: 2rem;
  text-decoration: underline;
  text-underline-offset: 5px;
  text-decoration-thickness: 1px;
}
@media (720px <= width) {
  .links.viewmore {
    font-size: 2rem;
    gap: 3rem;
  }
}
@media (hover: hover) and (width >= 720px) {
  .links.viewmore {
    transition: all var(--speed) ease-in-out;
  }
  .links.viewmore:hover {
    text-decoration: none;
    transform: translateX(0.3rem);
  }
}
.links.viewmore::after {
  content: "";
  background: url('data:image/svg+xml;charset=utf8, <svg width="60" height="60" viewBox="0 0 60 60" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="30" cy="30" r="30" fill="%23F5F5F5"/><path d="M31.6667 25L36 30L31.6667 35M35.5185 30H23" stroke="%23009BFF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>') center/contain no-repeat;
  width: 6rem;
  aspect-ratio: 1;
}
@media (720px <= width) {
  .links.viewmore::after {
    width: 9rem;
  }
}
.links.viewmore.small::after {
  width: 4rem;
}
@media (720px <= width) {
  .links.viewmore.small::after {
    width: 5rem;
  }
}
.links.viewmore.white {
  color: #fff;
}
.links.viewmore.whiteicon::after {
  content: "";
  background: url('data:image/svg+xml;charset=utf8, <svg width="60" height="60" viewBox="0 0 60 60" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="30" cy="30" r="30" fill="%23fff"/><path d="M31.6667 25L36 30L31.6667 35M35.5185 30H23" stroke="%23009BFF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>') center/contain no-repeat;
}

.formlead {
  border-top: 1px solid var(--clr-line);
  margin-left: 2rem;
  margin-right: 2rem;
  padding-top: 10rem;
}
@media (720px <= width) {
  .formlead {
    max-width: 170rem;
    margin-left: max(50% - 85rem, 6rem);
    margin-right: max(50% - 85rem, 6rem);
  }
}
.formlead .text {
  margin-top: 6rem;
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 160%;
}
@media (720px <= width) {
  .formlead .text {
    margin-top: 10rem;
    text-align: center;
    font-size: 2.2rem;
    line-height: 1.8182;
  }
}

.formstep {
  display: flex;
  justify-content: space-between;
  padding: 0 1.5rem;
  position: relative;
}
@media (720px <= width) {
  .formstep {
    width: 40.8rem;
    margin-left: auto;
    margin-right: auto;
  }
}
.formstep::before, .formstep::after {
  content: "";
  border-top: 3px dotted var(--clr-line);
  width: 3.1rem;
  height: 0;
  position: absolute;
  top: 3rem;
}
@media (720px <= width) {
  .formstep::before, .formstep::after {
    top: 4rem;
  }
}
.formstep::before {
  left: 27.4626865672%;
}
.formstep::after {
  left: 63.5820895522%;
}
.formstep .step .num {
  aspect-ratio: 1;
  width: 6rem;
  border-radius: 100rem;
  background-color: var(--clr-bg);
  color: #999;
  font-size: 2.2rem;
  font-weight: 700;
  line-height: 1;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media (720px <= width) {
  .formstep .step .num {
    width: 8rem;
    font-size: 2.8rem;
  }
}
.formstep .step .lbl {
  margin-top: 2rem;
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1;
  color: #999;
  text-align: center;
}
@media (720px <= width) {
  .formstep .step .lbl {
    font-size: 2rem;
  }
}
.formstep .step.current .num {
  background-color: var(--clr-main);
  color: #fff;
}
.formstep .step.current .lbl {
  color: var(--clr-text);
}

.inputarea {
  margin-top: 8rem;
  margin-left: 2rem;
  margin-right: 2rem;
  margin-bottom: 12rem;
  padding: 3rem 2rem 6rem;
  background: var(--clr-bg);
}
@media (720px <= width) {
  .inputarea {
    padding: 6rem;
  }
}
@media (1024px <= width) {
  .inputarea {
    max-width: 170rem;
    margin-left: max(50% - 85rem, 6rem);
    margin-right: max(50% - 85rem, 6rem);
    padding: 8rem 10rem 12rem;
  }
}
@media (1024px <= width) {
  .inputarea dl {
    display: grid;
    grid-template-columns: 40rem auto;
  }
}
.inputarea dl + .headline {
  margin-top: 8rem;
}
.inputarea dt > p,
.inputarea dd > p {
  display: contents;
}
.inputarea dt {
  padding-top: 3rem;
  font-size: 1.6rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
@media (720px <= width) {
  .inputarea dt {
    padding: 4rem 0;
    padding-right: 5rem;
    border-bottom: 1px solid var(--clr-line);
    font-size: 2rem;
  }
}
.inputarea dd {
  padding-top: 2.4rem;
  padding-bottom: 3.5rem;
  border-bottom: 1px solid var(--clr-line);
}
@media (720px <= width) {
  .inputarea dd {
    padding: 4rem 0;
    font-size: 2rem;
  }
}
.inputarea dd.value {
  font-size: 1.6rem;
  line-height: 175%;
  container-type: inline-size;
}
.inputarea dd.value:has([data-name=city]), .inputarea dd.value:has([data-name=pref2]) {
  container-name: address;
}
.inputarea dd.value:has([data-name=getsugakuyachin]) {
  container-name: getsugakuyachin;
}
@media (720px <= width) {
  .inputarea dd.value {
    font-size: 2rem;
  }
}
.inputarea dd.value > div .wpcf7-form-control-wrap {
  display: block;
}
.inputarea dd.value > div + div {
  margin-top: 2rem;
}
.inputarea dd.value > div p {
  display: contents;
}
@media (720px <= width) {
  .inputarea dd.value > div {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem 0;
    align-items: center;
  }
  .inputarea dd.value > div label {
    font-size: 2rem;
    width: 16rem;
  }
  .inputarea dd.value > div .wpcf7-form-control-wrap {
    width: min(100% - 16rem, 40rem);
  }
  .inputarea dd.value > div .zip-coution {
    font-size: 2rem;
    padding-left: 3rem;
    line-height: 166%;
  }
  .inputarea dd.value > div:has([data-name=city]) .wpcf7-form-control-wrap, .inputarea dd.value > div:has([data-name=building]) .wpcf7-form-control-wrap {
    width: calc(100% - 16rem);
  }
  .inputarea dd.value > div input {
    width: 100%;
  }
}
@container address (max-width: 930px) {
  .inputarea dd.value > div .zip-coution {
    padding-left: 16rem;
  }
}
.inputarea dd.value label {
  font-size: 1.6rem;
  line-height: 175%;
  display: block;
  margin-bottom: 0.5rem;
}
@media (720px <= width) {
  .inputarea dd.value label {
    font-size: 2rem;
  }
}
.inputarea dd.value .zip-coution {
  font-size: 1.4rem;
  line-height: 175%;
}
.inputarea dd.value .coution {
  font-size: 1.4rem;
  line-height: 175%;
  margin-bottom: 2rem;
  display: block;
}
@media (720px <= width) {
  .inputarea dd.value .coution {
    font-size: 1.6rem;
  }
}
.inputarea .required {
  background-color: var(--clr-main);
  color: #fff;
  font-size: 1.2rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1;
  border-radius: 100rem;
  padding: 0.4rem 1rem;
  white-space: nowrap;
}
.inputarea .required::before {
  content: "必須";
}
@media (720px <= width) {
  .inputarea .required {
    font-size: 1.6rem;
    padding: 0.5rem 1rem;
  }
}
.inputarea input:not([type=submit]):not([type=checkbox]),
.inputarea textarea,
.inputarea select {
  -webkit-appearance: none;
  border: none;
  background-color: #fff;
  padding: 1.1rem 1.5rem;
  font-size: 1.6rem;
}
@media (720px <= width) {
  .inputarea input:not([type=submit]):not([type=checkbox]),
  .inputarea textarea,
  .inputarea select {
    font-size: 2rem;
    padding: 2.2rem 3rem;
  }
}
.inputarea input[type=radio]:not([type=submit]):not([type=checkbox]) {
  width: 2.5rem;
  height: 2.5rem;
  padding: 0;
  margin: 0;
  border-radius: 100rem;
  position: relative;
}
.inputarea input[type=radio]:not([type=submit]):not([type=checkbox])::after {
  content: "";
  width: 0.9rem;
  height: 0.9rem;
  background-color: var(--clr-main);
  position: absolute;
  top: calc(50% - 0.45rem);
  left: calc(50% - 0.45rem);
  border-radius: 100rem;
  opacity: 0;
}
.inputarea input[type=radio]:not([type=submit]):not([type=checkbox]):focus {
  outline: none;
}
.inputarea input[type=radio]:not([type=submit]):not([type=checkbox]):checked::after {
  opacity: 1;
}
.inputarea input[type=date] {
  min-height: 5.6rem;
}
@media (720px <= width) {
  .inputarea input[type=date] {
    min-height: 7.6rem;
  }
}
.inputarea dd.value .wpcf7-radio {
  display: grid;
  gap: 1rem;
}
.inputarea dd.value .wpcf7-radio .wpcf7-list-item {
  margin: 0;
}
.inputarea dd.value .wpcf7-radio label {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin: 0;
  line-height: 2.5rem;
}
.inputarea input[type*=text],
.inputarea input[type*=email],
.inputarea input[type*=tel],
.inputarea textarea {
  width: 100%;
}
.inputarea textarea {
  height: 15rem;
}
@media (720px <= width) {
  .inputarea textarea {
    height: 30rem;
  }
}
.inputarea input#zip {
  width: 10em;
}
@media (720px <= width) {
  .inputarea input#zip {
    width: 40rem;
  }
}
.inputarea select {
  font-size: 1.6rem;
  font-family: var(--ff-sans);
  color: var(--clr-text);
  line-height: var(--lh);
  letter-spacing: var(--ls);
  font-feature-settings: "palt" 1;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  padding: 1.1rem 1.5rem;
}
@media (720px <= width) {
  .inputarea select {
    font-size: 2rem;
    padding: 2.2rem 3rem;
  }
}
.inputarea select option[disabled] {
  display: none;
}
@media (720px <= width) {
  .inputarea select#pref {
    width: 40rem;
  }
}
.inputarea span[data-name=pref],
.inputarea span[data-name=recruitgym] {
  position: relative;
  display: block;
}
.inputarea span[data-name=pref]::after,
.inputarea span[data-name=recruitgym]::after {
  content: "";
  width: 0.8rem;
  height: 0.7rem;
  background-color: var(--clr-main);
  position: absolute;
  right: 1.5rem;
  top: calc(50% - 0.3rem);
  clip-path: polygon(0 0, 100% 0, 50% 100%);
  pointer-events: none;
}
@media (720px <= width) {
  .inputarea span[data-name=pref],
  .inputarea span[data-name=recruitgym] {
    width: 40rem;
  }
  .inputarea span[data-name=pref]::after,
  .inputarea span[data-name=recruitgym]::after {
    width: 1.2rem;
    height: 1rem;
    top: calc(50% - 0.5rem);
    right: 3rem;
  }
}
.inputarea span[data-name=pref] select,
.inputarea span[data-name=recruitgym] select {
  width: 100%;
}
.inputarea select#tenpopref,
.inputarea select#tenponame {
  width: 100%;
}
.inputarea span[data-name=tenpopref],
.inputarea span[data-name=tenponame] {
  position: relative;
  display: block;
}
@media (720px <= width) {
  .inputarea span[data-name=tenpopref],
  .inputarea span[data-name=tenponame] {
    width: 50rem;
  }
}
.inputarea span[data-name=tenpopref]::after,
.inputarea span[data-name=tenponame]::after {
  content: "";
  width: 0.8rem;
  height: 0.7rem;
  background-color: var(--clr-main);
  position: absolute;
  right: 1.5rem;
  top: calc(50% - 0.3rem);
  clip-path: polygon(0 0, 100% 0, 50% 100%);
  pointer-events: none;
}
@media (720px <= width) {
  .inputarea span[data-name=tenpopref]::after,
  .inputarea span[data-name=tenponame]::after {
    width: 1.2rem;
    height: 1rem;
    top: calc(50% - 0.5rem);
    right: 3rem;
  }
}
.inputarea span[data-name=tenpopref]:has(select[disabled])::after,
.inputarea span[data-name=tenponame]:has(select[disabled])::after {
  opacity: 0.5;
}
.inputarea span[data-name=tenponame] {
  margin-top: 2rem;
}
@media (720px <= width) {
  .inputarea span[data-name=tenponame] {
    margin-top: 1.5rem;
  }
}
.inputarea span[data-name=tenpopref] + br {
  display: none;
}
.inputarea input[type=number]::-webkit-inner-spin-button,
.inputarea input[type=number]::-webkit-outer-spin-button {
  opacity: 1;
}
.inputarea p:has(span[data-name=riyousu]) {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding-right: 1em;
}
@media (720px <= width) {
  .inputarea p:has(span[data-name=riyousu]) {
    width: 50rem;
    font-size: 2rem;
    gap: 3rem;
    padding-right: 5rem;
  }
}
.inputarea p:has(span[data-name=riyousu]) .wpcf7-form-control-wrap {
  width: 100%;
}
.inputarea p:has(span[data-name=riyousu]) #riyousu {
  width: 100%;
}
.inputarea span[data-name=kaisi] {
  display: block;
}
.inputarea span[data-name=kaisi] input {
  width: 100%;
}
@media (720px <= width) {
  .inputarea span[data-name=kaisi] input {
    width: 40rem;
  }
}
.inputarea dd.value > div.note {
  padding: 1rem 0;
  display: block;
}
.inputarea input[type=file] {
  width: 100%;
}
.inputarea .agree {
  margin-top: 4rem;
}
@media (720px <= width) {
  .inputarea .agree {
    margin-top: 10.2rem;
    grid-column: span 2;
  }
}
.inputarea .agree p {
  display: contents;
}
.inputarea .agree .wpcf7-list-item {
  display: block;
  margin: 0;
  text-align: center;
}
.inputarea .agree label {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.6rem;
}
@media (720px <= width) {
  .inputarea .agree label {
    font-size: 2rem;
    gap: 1rem;
  }
}
.inputarea .agree a {
  text-decoration: underline;
  color: var(--clr-main);
}
.inputarea .agree input[type=checkbox] {
  width: 3rem;
  height: 3rem;
  background-color: #fff;
}
.inputarea .agree input[type=checkbox]::after {
  content: "";
  background: url('data:image/svg+xml;utf8,<svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg"><rect width="30" height="30" fill="%23009BFF"/><path d="M9 14.625L13.0006 18.75L21 10.5" stroke="white" stroke-width="2"/></svg>') center/contain no-repeat;
  width: 100%;
  aspect-ratio: 1;
  display: block;
  opacity: 0;
}
.inputarea .agree input[type=checkbox]:focus {
  outline: none;
}
.inputarea .agree input[type=checkbox]:checked::after {
  opacity: 1;
}
.inputarea .agree .wpcf7-list-item-label {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}
.inputarea .agree .wpcf7-not-valid-tip {
  text-align: center;
  font-size: 1.6rem;
}
@media (720px <= width) {
  .inputarea .agree .wpcf7-not-valid-tip {
    font-size: 2rem;
  }
}
.inputarea p:has(span[data-name=bukkenhirosa]) {
  display: flex;
  margin-bottom: 2rem;
}
.inputarea span[data-name=bukkenhirosa] {
  width: 50%;
  display: inline-block;
}
.inputarea span[data-name=bukkenhirosatani] {
  margin-left: 1.5rem;
  display: inline-block;
  padding-top: 1.4rem;
}
@media (720px <= width) {
  .inputarea span[data-name=bukkenhirosatani] {
    padding-top: 3rem;
  }
}
.inputarea span[data-name=bukkenhirosatani] span.wpcf7-radio {
  grid-template-columns: repeat(2, 1fr);
}
.inputarea p:has(span[data-name=chikunensu]) {
  display: grid;
  grid-template-columns: auto 1em;
  align-items: center;
  gap: 1rem;
  padding-right: 0.4rem;
}
.inputarea p:has(span[data-name=chikunensu]) input {
  width: 100%;
}
.inputarea p:has(span[data-name=chusyajo]) {
  display: grid;
  grid-template-columns: 8.6rem auto 1em;
  padding-right: 0.4rem;
}
@media (720px <= width) {
  .inputarea p:has(span[data-name=chusyajo]) {
    grid-template-columns: 12.5rem auto 1em;
  }
}
.inputarea p:has(span[data-name=chusyajo]) span[data-name=chusyajo] .wpcf7-radio {
  gap: 2.3rem;
}
@media (720px <= width) {
  .inputarea p:has(span[data-name=chusyajo]) span[data-name=chusyajo] .wpcf7-radio {
    gap: 4rem;
  }
}
.inputarea p:has(span[data-name=chusyajo]) span[data-name=daisu] {
  margin-top: 3.5rem;
  padding-right: 1rem;
}
.inputarea p:has(span[data-name=chusyajo]) span[data-name=daisu] input {
  width: 100%;
}
.inputarea p:has(span[data-name=chusyajo]) span:nth-child(3) {
  margin-top: 4.8rem;
}
@media (720px <= width) {
  .inputarea p:has(span[data-name=chusyajo]) span:nth-child(3) {
    margin-top: 5.8rem;
  }
}
.inputarea ul:has(span[data-name=getsugakuyachin]) {
  display: grid;
  gap: 2rem;
}
@media (720px <= width) {
  .inputarea ul:has(span[data-name=getsugakuyachin]) {
    grid-template-rows: repeat(3, auto);
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem 8rem;
  }
}
@container getsugakuyachin (max-width: 930px) {
  .inputarea ul:has(span[data-name=getsugakuyachin]) {
    gap: 1.5rem 5.376344086%;
  }
}
.inputarea ul:has(span[data-name=getsugakuyachin]) li {
  display: grid;
  grid-template-columns: 8rem auto;
  align-items: center;
}
@media (720px <= width) {
  .inputarea ul:has(span[data-name=getsugakuyachin]) li {
    grid-template-columns: 12rem auto;
  }
}
.inputarea ul:has(span[data-name=getsugakuyachin]) .content p {
  display: grid;
  grid-template-columns: auto 1em;
  align-items: center;
  gap: 1rem;
  padding-right: 0.4rem;
}
.inputarea ul:has(span[data-name=getsugakuyachin]) .content p input {
  width: 100%;
}
.inputarea ul:has(span[data-name=josui]) {
  display: grid;
  gap: 2rem;
}
.inputarea ul:has(span[data-name=josui]) .item {
  font-weight: 700;
}
.inputarea ul:has(span[data-name=josui]) .content {
  margin-top: 1.2rem;
}
@media (720px <= width) {
  .inputarea ul:has(span[data-name=josui]) .wpcf7-radio {
    display: grid;
    grid-template-columns: repeat(3, 16rem);
  }
}
@media (720px <= width) {
  .inputarea .value:has([data-name=ukewatashijiki]) {
    display: grid;
    grid-template-columns: 23rem auto;
  }
  .inputarea .value:has([data-name=ukewatashijiki]) .wpcf7-radio {
    gap: 4rem;
  }
}
@media (720px <= width) {
  .inputarea dd.value .riyoukanoujiki {
    margin-top: 2.3rem;
  }
}
.inputarea dd.value .riyoukanoujiki p {
  display: grid;
  align-items: center;
  font-size: 1.6rem;
  margin-top: 1.4rem;
  padding-left: 3.4rem;
}
.inputarea dd.value .riyoukanoujiki p input {
  width: 100%;
}
@media (720px <= width) {
  .inputarea dd.value .riyoukanoujiki p {
    grid-template-columns: 15rem auto;
  }
  .inputarea dd.value .riyoukanoujiki p input {
    width: 40rem;
  }
}
.inputarea p:has(span[data-name=riyoukanoujiki]) input {
  width: 100%;
}
@media (720px <= width) {
  .inputarea p:has(span[data-name=riyoukanoujiki]) input {
    width: 40rem;
  }
}
.inputarea .buttonarea {
  margin-top: 4rem;
  text-align: center;
}
@media (720px <= width) {
  .inputarea .buttonarea {
    grid-column: span 2;
    width: 46rem;
    margin-top: 6rem;
    margin-left: auto;
    margin-right: auto;
  }
  .inputarea .buttonarea:has(.previous) {
    width: 95rem;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 3rem;
  }
}
.inputarea .buttonarea p {
  display: contents;
}
.inputarea .buttonarea .submit {
  position: relative;
}
@media (720px <= width) {
  .inputarea .buttonarea .submit {
    order: 2;
  }
}
.inputarea .buttonarea .submit input[type=submit] {
  background-color: var(--clr-main);
  color: #fff;
  width: 100%;
  height: 6rem;
  border-radius: 100rem;
  text-align: left;
  font-size: 1.6rem;
  font-weight: 700;
  padding: 0 2rem;
}
.inputarea .buttonarea .submit input[type=submit][disabled] {
  background-color: var(--clr-lighttext);
  cursor: not-allowed;
}
@media (720px <= width) {
  .inputarea .buttonarea .submit input[type=submit] {
    height: 10rem;
    padding: 0 4rem;
    font-size: 2.4rem;
    cursor: pointer;
  }
}
.inputarea .buttonarea .submit::after {
  content: "";
  background: url('data:image/svg+xml;utf8,<svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="15" cy="15" r="15" fill="white"/><path d="M15.6667 11L19 15L15.6667 19M18.6296 15H9" stroke="%23009BFF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>') center/contain no-repeat;
  width: 3rem;
  aspect-ratio: 1;
  position: absolute;
  right: 2rem;
  top: calc(50% - 1.5rem);
  pointer-events: none;
}
@media (720px <= width) {
  .inputarea .buttonarea .submit::after {
    right: 4rem;
    width: 5rem;
    top: calc(50% - 2.5rem);
  }
}
.inputarea .buttonarea .submit:has([disabled])::after {
  background-image: url('data:image/svg+xml;utf8,<svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="15" cy="15" r="15" fill="white"/><path d="M15.6667 11L19 15L15.6667 19M18.6296 15H9" stroke="%23999999" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>');
}
@media (hover: hover) and (width >= 720px) {
  .inputarea .buttonarea .submit {
    transition: all var(--speed) ease-in-out;
  }
  .inputarea .buttonarea .submit:not(:has([disabled])):hover {
    opacity: 0.7;
  }
}
.inputarea .buttonarea .previous {
  position: relative;
}
.inputarea .buttonarea .previous p {
  display: contents;
}
.inputarea .buttonarea .previous input {
  width: 100%;
  height: 6rem;
  background: #ddd;
  border-radius: 100rem;
  text-align: left;
  font-size: 1.6rem;
  font-weight: 700;
  padding: 0 2rem;
}
@media (720px <= width) {
  .inputarea .buttonarea .previous input {
    height: 10rem;
    padding: 0 4rem;
    font-size: 2.4rem;
    cursor: pointer;
  }
}
.inputarea .buttonarea .previous::after {
  content: "";
  background: url('data:image/svg+xml;utf8,<svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="15" cy="15" r="15" fill="%23f5f5f5"/><path d="M15.6667 11L19 15L15.6667 19M18.6296 15H9" stroke="%23666" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>') center/contain no-repeat;
  width: 3rem;
  aspect-ratio: 1;
  position: absolute;
  right: 2rem;
  top: calc(50% - 1.5rem);
  pointer-events: none;
}
@media (720px <= width) {
  .inputarea .buttonarea .previous::after {
    right: 4rem;
    width: 5rem;
    top: calc(50% - 2.5rem);
  }
}
@media (hover: hover) and (width >= 720px) {
  .inputarea .buttonarea .previous {
    transition: all var(--speed) ease-in-out;
  }
  .inputarea .buttonarea .previous:hover {
    opacity: 0.7;
  }
}
@media (width < 720px) {
  .inputarea .buttonarea .submit + .previous {
    margin-top: 1.5rem;
  }
}
.inputarea .buttonarea .wpcf7-spinner {
  display: none;
}

.wpcf7 form.invalid .wpcf7-response-output {
  text-align: center;
  border: none;
  color: #dc3232;
  font-size: 1.6rem;
  margin: 1em 0.5em 1em;
}
@media (720px <= width) {
  .wpcf7 form.invalid .wpcf7-response-output {
    font-size: 2rem;
  }
}

.file-error {
  color: #dc3232;
  font-size: 1em;
  font-weight: normal;
  display: none;
}

.wpcf7-form-control-wrap[data-name=resume-file] .wpcf7-not-valid-tip {
  display: none;
}

dd.value:has(.wpcf7-form-control-wrap[data-name=resume-file] .wpcf7-not-valid-tip) .file-error {
  display: inline;
}

.message-mensetu {
  display: none;
  color: #dc3232;
}

body.parttime i.required.chack,
body.yakin i.required.chack {
  display: none;
}
body.parttime .message-mensetu,
body.yakin .message-mensetu {
  display: inline;
}

.section__title {
  color: var(--clr-main);
}
.section__title.white {
  color: #fff;
}
.section__title .ja {
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1em;
}
@media (720px <= width) {
  .section__title .ja {
    font-size: 3rem;
  }
}
.section__title .en {
  font-size: 5rem;
  font-weight: 700;
  line-height: 1.12em;
  margin-top: 1rem;
}
@media (720px <= width) {
  .section__title .en {
    font-size: 10rem;
    line-height: 1em;
    margin-top: 1.5rem;
  }
}

.headline {
  font-size: 2.4rem;
  font-weight: 700;
  line-height: 1.5;
  border-left: 0.8rem solid var(--clr-main);
  padding-left: 2rem;
}
@media (720px <= width) {
  .headline {
    font-size: 2.8rem;
    line-height: 1.5714;
  }
}

.heading {
  position: relative;
  text-align: center;
  padding-bottom: 1.2rem;
  line-height: 1.44;
  margin-bottom: 2.4rem;
}
@media (720px <= width) {
  .heading {
    padding-bottom: 1.7rem;
    margin-bottom: 3.2rem;
  }
}

[class^=icon] {
  position: relative;
  display: inline-block;
  vertical-align: middle;
}

.icon-back {
  width: 6rem;
  height: 6rem;
  background: var(--clr-bg) url(../images/installation-machine/icon_back.svg) center/1.7rem auto no-repeat;
  border-radius: 100%;
}
@media (720px <= width) {
  .icon-back {
    width: 9rem;
    height: 9rem;
    background-size: 2.2rem auto;
  }
}

.icon_arrow {
  background: url('data:image/svg+xml;charset=utf8, <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="10" cy="10" r="10" fill="%23009BFF"/><path d="M11.0909 7L14 10L11.0909 13M13.6768 10H6" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>') center/contain no-repeat;
  width: 2rem;
  height: 2rem;
}
.icon_arrow.whitebase {
  background: url('data:image/svg+xml;charset=utf8, <svg width="60" height="60" viewBox="0 0 60 60" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="30" cy="30" r="30" fill="%23F5F5F5"/><path d="M31.6667 25L36 30L31.6667 35M35.5185 30H23" stroke="%23009BFF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>') center/contain no-repeat;
  width: 6rem;
  height: 6rem;
}

.icon_guidance {
  background: url('data:image/svg+xml;charset=utf8, <svg width="25" height="20" viewBox="0 0 25 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M15 11.25H21.25V8.75H15V11.25ZM15 7.5H21.25V5H15V7.5ZM3.75 15H13.75V14.3125C13.75 13.375 13.2917 12.6304 12.375 12.0787C11.4583 11.5271 10.25 11.2508 8.75 11.25C7.25 11.2492 6.04167 11.5254 5.125 12.0787C4.20833 12.6321 3.75 13.3767 3.75 14.3125V15ZM8.75 10C9.4375 10 10.0262 9.75542 10.5162 9.26625C11.0062 8.77708 11.2508 8.18833 11.25 7.5C11.2492 6.81167 11.0046 6.22333 10.5162 5.735C10.0279 5.24667 9.43917 5.00167 8.75 5C8.06083 4.99833 7.4725 5.24333 6.985 5.735C6.4975 6.22667 6.2525 6.815 6.25 7.5C6.2475 8.185 6.4925 8.77375 6.985 9.26625C7.4775 9.75875 8.06583 10.0033 8.75 10ZM2.5 20C1.8125 20 1.22417 19.7554 0.735 19.2662C0.245833 18.7771 0.000833333 18.1883 0 17.5V2.5C0 1.8125 0.245 1.22417 0.735 0.735C1.225 0.245833 1.81333 0.000833333 2.5 0H22.5C23.1875 0 23.7762 0.245 24.2662 0.735C24.7562 1.225 25.0008 1.81333 25 2.5V17.5C25 18.1875 24.7554 18.7762 24.2662 19.2662C23.7771 19.7562 23.1883 20.0008 22.5 20H2.5Z" fill="white"/></svg>') center/contain no-repeat;
  width: 2.5rem;
  height: 2rem;
}

.icon_gym {
  background: url('data:image/svg+xml;charset=utf8, <svg width="19" height="10" viewBox="0 0 19 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6.14095e-08 5C-0.000107015 4.55652 0.139817 4.12558 0.39777 3.77495C0.655723 3.42431 1.01707 3.17387 1.425 3.063V6.937C1.01707 6.82613 0.655723 6.57569 0.39777 6.22505C0.139817 5.87442 -0.000107015 5.44348 6.14095e-08 5ZM19 5C19.0001 5.44348 18.8602 5.87442 18.6022 6.22505C18.3443 6.57569 17.9829 6.82613 17.575 6.937V3.063C17.9829 3.17387 18.3443 3.42431 18.6022 3.77495C18.8602 4.12558 19.0001 4.55652 19 5ZM16.15 2V8C16.15 8.465 16.15 8.697 16.1015 8.888C16.0368 9.14213 15.9096 9.37386 15.7329 9.55991C15.5561 9.74597 15.336 9.87981 15.0946 9.948C14.9122 10 14.6908 10 14.25 10C13.8092 10 13.5869 10 13.4064 9.949C13.165 9.88081 12.9448 9.74697 12.7681 9.56091C12.5913 9.37486 12.4642 9.14313 12.3994 8.889C12.35 8.697 12.35 8.464 12.35 8V5.75H6.65V8C6.65 8.465 6.65 8.697 6.60155 8.888C6.53677 9.14213 6.40962 9.37386 6.23287 9.55991C6.05611 9.74597 5.83598 9.87981 5.59455 9.948C5.4112 10 5.1908 10 4.75 10C4.3092 10 4.08785 10 3.9064 9.949C3.66497 9.88081 3.44484 9.74697 3.26808 9.56091C3.09133 9.37486 2.96418 9.14313 2.8994 8.889C2.85 8.697 2.85 8.464 2.85 8V2C2.85 1.535 2.85 1.303 2.89845 1.112C2.96323 0.857868 3.09038 0.626144 3.26713 0.440089C3.44389 0.254033 3.66402 0.120192 3.90545 0.052C4.0888 4.65661e-08 4.3092 0 4.75 0C5.1908 0 5.41215 1.21072e-07 5.5936 0.0510001C5.83503 0.119192 6.05516 0.253033 6.23192 0.439089C6.40867 0.625144 6.53582 0.856868 6.6006 1.111C6.65 1.304 6.65 1.536 6.65 2V4.25H12.35V2C12.35 1.535 12.35 1.303 12.3984 1.112C12.4632 0.857868 12.5904 0.626144 12.7671 0.440089C12.9439 0.254033 13.164 0.120192 13.4054 0.052C13.5878 4.65661e-08 13.8092 0 14.25 0C14.6908 0 14.9131 1.21072e-07 15.0936 0.0510001C15.335 0.119192 15.5552 0.253033 15.7319 0.439089C15.9087 0.625144 16.0358 0.856868 16.1006 1.111C16.15 1.304 16.15 1.536 16.15 2Z" fill="white"/></svg>') center/contain no-repeat;
  width: 2.5rem;
  height: 2rem;
}

.icon_breadcrumbs {
  background: url('data:image/svg+xml;charset=utf8, <svg width="5" height="8" viewBox="0 0 5 8" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M0.585938 0.585571L3.58594 3.58557L0.585938 6.58557" stroke="%23CCCCCC" stroke-width="1.1711" stroke-linecap="round" stroke-linejoin="round"/></svg>') center/contain no-repeat;
  width: 0.417rem;
  aspect-ratio: 417/717;
}
@media (720px <= width) {
  .icon_breadcrumbs {
    width: 0.7rem;
  }
}

.icon_coution {
  background: url('data:image/svg+xml;charset=utf8, <svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M0 20C0 8.954 8.954 0 20 0C31.046 0 40 8.954 40 20C40 31.046 31.046 40 20 40C8.954 40 0 31.046 0 20ZM20 22C19.4696 22 18.9609 21.7893 18.5858 21.4142C18.2107 21.0391 18 20.5304 18 20V12C18 11.4696 18.2107 10.9609 18.5858 10.5858C18.9609 10.2107 19.4696 10 20 10C20.5304 10 21.0391 10.2107 21.4142 10.5858C21.7893 10.9609 22 11.4696 22 12V20C22 20.5304 21.7893 21.0391 21.4142 21.4142C21.0391 21.7893 20.5304 22 20 22ZM17 28C17 27.2044 17.3161 26.4413 17.8787 25.8787C18.4413 25.3161 19.2044 25 20 25H20.02C20.8156 25 21.5787 25.3161 22.1413 25.8787C22.7039 26.4413 23.02 27.2044 23.02 28V28.02C23.02 28.8156 22.7039 29.5787 22.1413 30.1413C21.5787 30.7039 20.8156 31.02 20.02 31.02H20C19.2044 31.02 18.4413 30.7039 17.8787 30.1413C17.3161 29.5787 17 28.8156 17 28.02V28Z" fill="%23FF47AE"/></svg>') center/contain no-repeat;
  width: 4rem;
  aspect-ratio: 1;
}

.wp-pagenavi {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 5rem;
  gap: 0.4rem;
}
@media (720px <= width) {
  .wp-pagenavi {
    margin-top: 4.8rem;
  }
}
.wp-pagenavi span.current,
.wp-pagenavi .page {
  width: 4rem;
  aspect-ratio: 1;
  background: #f5f5f5;
  border-radius: 100%;
  color: var(--clr-main);
  text-align: center;
  font-size: 2rem;
  font-weight: 700;
  line-height: 1;
  display: grid;
  place-content: center;
}
@media (hover: hover) and (width >= 720px) {
  .wp-pagenavi .page {
    transition: all var(--ani);
  }
  .wp-pagenavi .page:hover {
    background-color: var(--clr-lightYellow2);
  }
}
.wp-pagenavi span.current {
  background-color: var(--clr-main);
  color: #fff;
}
.wp-pagenavi .previouspostslink,
.wp-pagenavi .nextpostslink {
  width: 2.1rem;
  height: 1.6rem;
}
.wp-pagenavi .previouspostslink i,
.wp-pagenavi .nextpostslink i {
  width: 100%;
  height: 100%;
}
.wp-pagenavi .previouspostslink {
  margin-right: 1rem;
  background: url('data:image/svg+xml;charset=utf8, <svg width="21" height="16" viewBox="0 0 21 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M8.00391 0.258599C7.59437 -0.111912 6.96233 -0.0806188 6.5918 0.328912L0.258789 7.32891C-0.0858307 7.70981 -0.0858307 8.28981 0.258789 8.67071L6.5918 15.6707C6.96233 16.0802 7.59437 16.1115 8.00391 15.741C8.41339 15.3705 8.44557 14.7385 8.0752 14.3289L3.25293 8.99981H20C20.5523 8.99981 21 8.55209 21 7.99981C21 7.44753 20.5523 6.99981 20 6.99981H3.25293L8.0752 1.67071C8.44557 1.26116 8.41339 0.629083 8.00391 0.258599Z" fill="%23009BFF"/></svg>') center/contain no-repeat;
}
.wp-pagenavi .nextpostslink {
  margin-left: 1rem;
  background: url('data:image/svg+xml;charset=utf8, <svg width="21" height="16" viewBox="0 0 21 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12.9961 0.258599C13.4056 -0.111912 14.0377 -0.0806188 14.4082 0.328912L20.7412 7.32891C21.0858 7.70981 21.0858 8.28981 20.7412 8.67071L14.4082 15.6707C14.0377 16.0802 13.4056 16.1115 12.9961 15.741C12.5866 15.3705 12.5544 14.7385 12.9248 14.3289L17.7471 8.99981H1C0.447715 8.99981 0 8.55209 0 7.99981C0 7.44753 0.447715 6.99981 1 6.99981H17.7471L12.9248 1.67071C12.5544 1.26116 12.5866 0.629083 12.9961 0.258599Z" fill="%23009BFF"/></svg>') center/contain no-repeat;
}

@media (720px <= width) {
  section.links {
    display: flex;
    flex-wrap: wrap;
  }
}
section.links a {
  display: block;
  aspect-ratio: 375/500;
  color: #fff;
  padding: 10rem 2rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  background: center/cover no-repeat;
}
@media (720px <= width) {
  section.links a {
    flex: 1;
    aspect-ratio: auto;
    height: 70rem;
    padding: 8rem;
  }
}
@media (hover: hover) and (width >= 720px) {
  section.links a {
    position: relative;
    transition: all var(--speed) ease-in-out;
  }
  section.links a::before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background-color: rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: all var(--speed) ease-in-out;
  }
  section.links a .buttonarea {
    transition: all var(--speed) ease-in-out;
  }
  section.links a:hover::before {
    opacity: 1;
  }
  section.links a:hover .buttonarea {
    transform: translateX(0.3rem);
  }
}
section.links a.facility {
  background-image: url(../images/common/links_facility_sp.webp);
}
@media (720px <= width) {
  section.links a.facility {
    background-image: url(../images/common/links_facility.webp);
    background-image: -webkit-image-set(url(../images/common/links_facility.webp) 1x, url(../images/common/links_facility@2x.webp) 2x);
    background-image: image-set(url(../images/common/links_facility.webp) 1x, url(../images/common/links_facility@2x.webp) 2x);
  }
}
section.links a.gym {
  background-image: url(../images/common/links_gym_sp.webp);
}
@media (720px <= width) {
  section.links a.gym {
    background-image: url(../images/common/links_gym.webp);
    background-image: -webkit-image-set(url(../images/common/links_gym.webp) 1x, url(../images/common/links_gym@2x.webp) 2x);
    background-image: image-set(url(../images/common/links_gym.webp) 1x, url(../images/common/links_gym@2x.webp) 2x);
  }
}
section.links a .title {
  position: relative;
}
section.links a .title .ja {
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1;
}
@media (720px <= width) {
  section.links a .title .ja {
    font-size: 3rem;
  }
}
section.links a .title .en {
  font-size: 5rem;
  font-weight: 700;
  line-height: 1;
}
@media (720px <= width) {
  section.links a .title .en {
    margin-top: 1.5rem;
    font-size: 10rem;
  }
}
section.links a .buttonarea {
  position: relative;
}

.table {
  border: 1px solid var(--clr-line);
}
@media (720px <= width) {
  .table {
    display: grid;
    grid-template-columns: 30rem auto;
  }
}
.table dt,
.table dd {
  padding: 2rem;
  font-size: 1.6rem;
  line-height: 175%;
}
@media (720px <= width) {
  .table dt,
  .table dd {
    font-size: 2rem;
    line-height: 1.8;
    padding: 3rem 4rem;
  }
}
.table dt {
  border-bottom: 1px solid var(--clr-line);
  font-weight: 700;
}
@media (720px <= width) {
  .table dt {
    display: grid;
    align-items: center;
  }
  .table dt:nth-last-child(1 of dt) {
    border: none;
  }
}
.table dd {
  background-color: #fff;
}
@media (width < 720px) {
  .table dd:has(+ dt) {
    border-bottom: 1px solid var(--clr-line);
  }
}
@media (720px <= width) {
  .table dd {
    border-left: 1px solid var(--clr-line);
  }
  .table dd:not(:last-child) {
    border-bottom: 1px solid var(--clr-line);
  }
}
.table.gray dt {
  background: #eee;
}