@charset "UTF-8";
a,
abbr,
acronym,
address,
applet,
article,
aside,
audio,
b,
big,
blockquote,
body,
canvas,
caption,
center,
cite,
code,
dd,
del,
details,
dfn,
div,
dl,
dt,
em,
embed,
fieldset,
figcaption,
figure,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
hgroup,
html,
i,
iframe,
img,
ins,
kbd,
label,
legend,
li,
mark,
menu,
nav,
object,
ol,
output,
p,
pre,
q,
ruby,
s,
samp,
section,
small,
span,
strike,
strong,
sub,
summary,
sup,
table,
tbody,
td,
tfoot,
th,
thead,
time,
tr,
tt,
u,
ul,
var,
video {
  border: 0;
  font: inherit;
  font-size: 100%;
  margin: 0;
  padding: 0;
  vertical-align: baseline
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block
}
body {
  line-height: 1
}
ol,
ul {
  list-style: none
}
blockquote,
q {
  quotes: none
}
blockquote:after,
blockquote:before,
q:after,
q:before {
  content: "";
  content: none
}
table {
  border-collapse: collapse;
  border-spacing: 0
}
:root {
  --text-color: #000000;
  --base-color: #f5f5f5;
  --bg-color: #222222;
  --line-color: #cccccc;
  --gray: #aaaaaa;
  --bg-gray: #e3e3e3;
  --dark-gray: #888888;
  --light-gray: #eee;
  --post-text-color: #555555;
  --white: #ffffff;
  --red: #ff5100;
  --line-length: 0;
  --font-ja: "Zen Kaku Gothic New",sans-serif;
  --font-en: "Host Grotesk",sans-serif;
  --hover-transition: 0.5s;
  --opacity-06: 0.6
}
*,
:after,
:before {
  box-sizing: border-box
}
html {
  font-size: 62.5%;
  -webkit-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
  text-size-adjust: 100%;
  block-size: 100%;
  scroll-padding-top: var(--header-height)
}
body {
  background: var(--base-color);
  color: var(--text-color);
  font-family: var(--font-ja);
  font-feature-settings: "palt";
  font-size: 16px;
  font-weight: 500;
  line-break: strict;
  line-height: normal;
  max-inline-size: 100vw;
  min-block-size: 100vh;
  min-block-size: 100svb;
  min-inline-size: 0;
  overflow-x: clip
}
body.no-scroll {
  overflow: hidden
}
::view-transition-new(root),
::view-transition-old(root) {
  animation-duration: .6s;
  animation-timing-function: cubic-bezier(.4,0,.2,1)
}
a {
  color: inherit;
  text-decoration: none;
  transition: var(--hover-transition)
}
a:focus-visible {
  cursor: pointer;
  text-decoration: none
}
@media (any-hover:hover) {
  a:hover {
    cursor: pointer;
    text-decoration: none
  }
}
:where(:-moz-any-link) {
  text-decoration-color: color-mix(in srgb,currentcolor,transparent 40%);
  text-underline-offset: .25em
}
:where(:any-link) {
  text-decoration-color: color-mix(in srgb,currentcolor,transparent 40%);
  text-underline-offset: .25em
}
a,
span {
  display: inline-block
}
picture {
  display: block;
  inline-size: 100%
}
svg {
  block-size: 100%;
  inline-size: 100%;
  vertical-align: middle
}
img {
  block-size: 100%;
  font-style: italic;
  inline-size: 100%;
  vertical-align: bottom;
  -o-object-fit: cover;
  object-fit: cover
}
input {
  margin: 0;
  padding: 0
}
textarea {
  color: inherit;
  font: inherit;
  padding: 0
}
button {
  background: 0 0;
  border: none;
  color: inherit;
  cursor: pointer;
  font: inherit;
  inline-size: -moz-fit-content;
  inline-size: fit-content;
  padding: 0;
  touch-action: manipulation;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none
}
:focus-visible {
  outline: auto solid oklch(60% .4 240deg);
  outline-offset: 2px
}
:focus:not(:focus-visible) {
  outline: 0
}
:target {
  outline: 0
}
:target:focus-visible {
  outline: auto solid oklch(60% .4 240deg);
  outline-offset: 2px
}
@supports (-webkit-touch-callout:none) {
  :target {
    outline: 0!important
  }
  :target:focus-visible {
    outline: auto solid oklch(60% .4 240deg)!important;
    outline-offset: 2px!important
  }
}
a[href^="tel:"] {
  pointer-events: none
}
@media (pointer:coarse) {
  a[href^="tel:"] {
    pointer-events: auto
  }
}
:where(button,[type=button],[type=reset],[type=submit]) {
  touch-action: manipulation
}
:where(ul,ol) {
  list-style-type: "";
  padding: unset
}
:where(:-moz-any-link,button,[type=button],[type=reset],[type=submit],label[for],select,summary,[role=tab],[role=button]) {
  cursor: pointer
}
:where(:any-link,button,[type=button],[type=reset],[type=submit],label[for],select,summary,[role=tab],[role=button]) {
  cursor: pointer
}
:where(dialog) {
  background-color: unset;
  block-size: unset;
  border: unset;
  color: unset;
  inline-size: unset;
  max-block-size: unset;
  max-inline-size: unset;
  overflow: unset;
  padding: unset
}
:where([popover]) {
  background-color: unset;
  block-size: unset;
  border: unset;
  color: unset;
  inline-size: unset;
  overflow: unset;
  padding: unset
}
@media (prefers-reduced-motion:reduce) {
  *,
  ::after,
  ::backdrop,
  ::before {
    animation-delay: 0s!important;
    animation-duration: 1ms!important;
    animation-iteration-count: 1!important;
    background-attachment: scroll!important;
    scroll-behavior: auto!important;
    transition-delay: 0s!important;
    transition-duration: 1ms!important
  }
}
.scroller {
  overflow: auto;
  overscroll-behavior-block: contain
}
html:has(dialog[open]) {
  overflow: hidden
}
summary {
  display: block
}
summary::-webkit-details-marker {
  display: none
}
:where(pre) {
  text-spacing-trim: space-all
}
:where(pre,time,input,textarea) {
  text-autospace: no-autospace
}
.description {
  hanging-punctuation: last allow-end
}
.number {
  font-variant-numeric: tabular-nums
}
.text-center {
  text-align: center;
  text-wrap: balance
}
.scroll-container {
  overflow: scroll;
  scrollbar-gutter: stable
}
.scroll-container::-webkit-scrollbar {
  width: 8px
}
.scroll-container::-webkit-scrollbar-thumb {
  background: #ccc;
  border-radius: 4px
}
.scroll-container::-webkit-scrollbar-track {
  background: 0 0
}
.l-drawer__icon {
  position: fixed;
  right: 24px;
  top: 32px;
  z-index: 40
}
@media screen and (min-width:1024px) {
  .l-drawer__icon {
    display: none
  }
}
.l-drawer__icon.-active .l-drawer__icon--bar:nth-of-type(1) {
  top: 5px;
  transform: rotate(-30deg)
}
.l-drawer__icon.-active .l-drawer__icon--bar:nth-of-type(2) {
  top: 5px;
  transform: rotate(30deg)
}
.l-drawer__icon--bars {
  block-size: 18px;
  display: block;
  inline-size: 28px;
  position: relative;
  z-index: 41
}
.l-drawer__icon--bar {
  background: var(--text-color);
  block-size: 1px;
  border-radius: 6px;
  inline-size: 28px;
  position: absolute;
  right: 0;
  top: 0;
  transition: transform var(--hover-transition) linear,top var(--hover-transition) linear
}
.l-drawer__icon--bar:nth-of-type(2) {
  inline-size: 20px;
  top: 10px
}
.l-drawer__content {
  background: var(--base-color);
  block-size: 100vh;
  block-size: 100dvh;
  inline-size: 100%;
  max-inline-size: 480px;
  position: fixed;
  right: 0;
  top: 72px;
  transform: translateX(100%);
  transition: transform .6s cubic-bezier(.83,0,.17,1),visibility .6s cubic-bezier(.83,0,.17,1);
  visibility: hidden;
  z-index: 39
}
.l-drawer__content.-active {
  transform: translateX(0);
  visibility: visible
}
.l-drawer__inner {
  block-size: 100%;
  display: flex;
  flex-direction: column;
  gap: 40px;
  overflow: scroll;
  padding-block: 48px 80px;
  padding-inline: 32px
}
.l-drawer__lists {
  display: block flex;
  flex-direction: column;
  gap: 16px
}
.l-drawer__link {
  align-items: end;
  border-block-end: 1px solid var(--line-color);
  display: flex;
  justify-content: space-between;
  margin-inline-end: 3px;
  padding-block-end: 17px
}
.l-drawer__link:focus-visible .c-arrow {
  opacity: 0;
  transform: translate(10px,-10px) rotate(-45deg)
}
.l-drawer__link:focus-visible .c-arrow.--hover {
  opacity: 1;
  transform: translate(0,0) rotate(-45deg)
}
@media (any-hover:hover) {
  .l-drawer__link:hover .c-arrow {
    opacity: 0;
    transform: translate(10px,-10px) rotate(-45deg)
  }
  .l-drawer__link:hover .c-arrow.--hover {
    opacity: 1;
    transform: translate(0,0) rotate(-45deg)
  }
}
.l-drawer__labelWrap {
  display: flex;
  flex-direction: column;
  gap: 4px
}
.l-drawer__list--en {
  font-family: var(--font-en);
  font-optical-sizing: auto;
  font-size: 3.2rem;
  font-style: normal;
  font-weight: 400;
  line-height: 0;
  line-height: 100%;
  text-transform: uppercase
}
.l-drawer__list--ja {
  font-size: 1.4rem;
  line-height: 100%
}
.l-drawer__btn {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: 16px;
  justify-content: center
}
.l-drawer__btnLink--wrap {
  display: flex;
  flex-direction: column;
  gap: 16px
}
.l-drawer__btnLinks {
  display: flex;
  flex-direction: column;
  gap: 16px
}
.l-drawer__btnTitle {
  color: var(--gray);
  font-family: var(--font-en);
  font-optical-sizing: auto;
  font-size: 1.2rem;
  font-style: normal;
  font-weight: 400;
  line-height: 0;
  line-height: 160%;
  text-transform: uppercase
}
.l-drawer__btnLink {
  aspect-ratio: 326/83;
  max-inline-size: 400px
}
.l-drawer__btnLink a {
  display: block;
  transition: opacity var(--hover-transition) cubic-bezier(.83,0,.17,1) 0s
}
.l-drawer__btnLink a:focus-visible {
  opacity: var(--opacity-06)
}
@media (any-hover:hover) {
  .l-drawer__btnLink a:hover {
    opacity: var(--opacity-06)
  }
}
.l-drawer__privacy {
  color: var(--dark-gray);
  font-size: 1.2rem
}
.l-drawer__background {
  background: var(--text-color);
  block-size: 100%;
  inline-size: 100%;
  left: 0;
  opacity: 0;
  position: fixed;
  top: 0;
  visibility: hidden;
  z-index: 19
}
.l-drawer__background.-active {
  opacity: var(--opacity-06);
  visibility: visible
}
.l-footer {
  background: var(--text-color);
  color: var(--white);
  margin-inline: auto;
  padding-block: clamp(5.6rem,3.223rem + 6.095vw,12rem) 32px;
  position: relative
}
@media screen and (max-width:767px) {
  .l-footer::before {
    content: "";
    position: absolute;
    -webkit-mask-image: url(../img/common/otogi-logo-sp.svg);
    mask-image: url(../img/common/otogi-logo-sp.svg);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    aspect-ratio: 390/257;
    background: var(--white);
    inline-size: 100%;
    left: 0;
    mask-size: contain;
    opacity: .1;
    top: 0
  }
}
@media screen and (max-width:767px) {
  .l-footer__inner {
    padding-inline-start: 32px
  }
}
.l-footer__contents {
  display: flex;
  flex-direction: column;
  gap: 40px
}
@media screen and (min-width:768px) {
  .l-footer__contents {
    flex-direction: row;
    justify-content: space-between
  }
}
.l-footer__menu {
  display: flex;
  flex-direction: column;
  gap: 16px
}
@media screen and (min-width:768px) {
  .l-footer__menu {
    gap: 24px
  }
}
.l-footer__menuTitle {
  color: var(--gray);
  font-family: var(--font-en);
  font-optical-sizing: auto;
  font-size: 1.2rem;
  font-style: normal;
  font-weight: 400;
  line-height: 0;
  line-height: 160%;
  text-transform: uppercase
}
.l-footer__menuColumns {
  display: flex;
  flex-direction: row;
  gap: 88px
}
@media screen and (min-width:768px) {
  .l-footer__menuColumns {
    gap: 104px
  }
}
.l-footer__lists {
  display: flex;
  flex-direction: column;
  gap: 17px
}
.l-footer__lists li a {
  display: block;
  font-size: clamp(1.4rem,1.363rem + .095vw,1.5rem);
  line-height: normal;
  transition: opacity var(--hover-transition) cubic-bezier(.83,0,.17,1) 0s
}
.l-footer__lists li a:focus-visible {
  opacity: var(--opacity-06)
}
@media (any-hover:hover) {
  .l-footer__lists li a:hover {
    opacity: var(--opacity-06)
  }
}
.l-footer__privacy {
  color: var(--dark-gray);
  display: block;
  font-size: 1.2rem;
  line-height: normal;
  margin-block: 0 24px;
  transition: opacity var(--hover-transition) cubic-bezier(.83,0,.17,1) 0s;
  z-index: 2
}
@media screen and (min-width:768px) {
  .l-footer__privacy {
    margin-block: 56px 80px
  }
}
.l-footer__privacy:focus-visible {
  opacity: var(--opacity-06)
}
@media (any-hover:hover) {
  .l-footer__privacy:hover {
    opacity: var(--opacity-06)
  }
}
.l-footer__linkWrap {
  display: flex;
  flex-direction: column;
  gap: 16px
}
@media screen and (min-width:768px) {
  .l-footer__linkWrap {
    gap: 24px
  }
}
.l-footer__links {
  display: flex;
  flex-direction: column;
  gap: 16px
}
@media screen and (min-width:768px) {
  .l-footer__links {
    gap: 24px
  }
}
.l-footer__link {
  aspect-ratio: 326/83;
  display: block;
  inline-size: 83.5897435897vw;
  max-inline-size: 420px;
  transition: opacity var(--hover-transition) cubic-bezier(.83,0,.17,1) 0s
}
@media screen and (min-width:768px) {
  .l-footer__link {
    aspect-ratio: 282/72;
    inline-size: 282px
  }
}
.l-footer__link:focus-visible {
  opacity: var(--opacity-06)
}
@media (any-hover:hover) {
  .l-footer__link:hover {
    opacity: var(--opacity-06)
  }
}
.l-footer__copyright {
  color: var(--dark-gray);
  font-family: var(--font-en);
  font-optical-sizing: auto;
  font-size: 1.2rem;
  font-style: normal;
  font-weight: 400;
  line-height: 0;
  line-height: normal;
  padding-block-start: 18px;
  position: relative;
  text-align: center;
  text-transform: uppercase
}
@media screen and (min-width:768px) {
  .l-footer__copyright {
    padding-block-start: 4.375vw
  }
  .l-footer__copyright::before {
    content: "";
    position: absolute;
    -webkit-mask-image: url(../img/common/otogi-logo.svg);
    mask-image: url(../img/common/otogi-logo.svg);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    aspect-ratio: 916/162;
    background: var(--white);
    inline-size: 63.6111111111vw;
    left: 0;
    mask-size: contain;
    opacity: .1;
    top: -2.9166666667vw;
    translate: 0 -50%
  }
}
.l-footer__copyright::after {
  background: var(--post-text-color);
  block-size: 1px;
  content: "";
  inline-size: 100%;
  left: 0;
  position: absolute;
  top: 0
}
@media screen and (min-width:768px) {
  .l-footer__copyright::after {
    top: 2.5694444444vw
  }
}
.l-header {
  background: var(--base-color);
  block-size: 72px;
  border-bottom: 1px solid var(--line-color);
  inline-size: 100%;
  left: 0;
  padding-inline: 6.154vw;
  position: fixed;
  top: 0;
  z-index: 20
}
@media screen and (min-width:1024px) {
  .l-header {
    block-size: 60px;
    padding-inline: 24px 0
  }
}
@media screen and (min-width:1280px) {
  .l-header {
    padding-inline: clamp(2.4rem,.914rem + 3.81vw,6.4rem) 0
  }
}
.l-header__inner {
  block-size: inherit;
  margin-inline: auto;
  max-inline-size: 1920px
}
.l-header__wrap {
  align-items: center;
  block-size: inherit;
  display: flex;
  justify-content: space-between
}
.l-header__line {
  block-size: 60px;
  position: relative
}
@media screen and (min-width:1024px) {
  .l-header__line::before {
    background: var(--line-color);
    block-size: 100%;
    content: "";
    display: block;
    inline-size: 1px;
    inset: 0;
    position: absolute
  }
}
.l-header__logo {
  aspect-ratio: 163/21;
  inline-size: clamp(13.6rem,12.597rem + 2.571vw,16.3rem)
}
.l-header__logo a {
  display: block;
  padding-block: 24px;
  transition: opacity var(--hover-transition) cubic-bezier(.83,0,.17,1) 0s
}
@media screen and (min-width:1024px) {
  .l-header__logo a {
    padding-block: 16px
  }
}
.l-header__logo a:focus-visible {
  opacity: var(--opacity-06)
}
@media (any-hover:hover) {
  .l-header__logo a:hover {
    opacity: var(--opacity-06)
  }
}
.l-header__menu {
  display: none
}
@media screen and (min-width:1024px) {
  .l-header__menu {
    align-items: center;
    display: flex
  }
}
.l-header__nav {
  align-items: center;
  display: flex;
  -moz-column-gap: 40px;
  column-gap: 40px;
  position: relative
}
.l-header__nav::after,
.l-header__nav::before {
  content: "";
  position: absolute
}
.l-header__lists {
  align-items: center;
  display: flex;
  -moz-column-gap: clamp(1.6rem,1.006rem + 1.524vw,3.2rem);
  column-gap: clamp(1.6rem,1.006rem + 1.524vw,3.2rem)
}
.l-header__lists li a {
  display: block;
  font-size: 1.3rem;
  font-weight: 500;
  line-height: normal;
  padding-block: 8px;
  position: relative;
  white-space: nowrap
}
@media screen and (min-width:1920px) {
  .l-header__lists li a {
    font-size: 1.4rem
  }
}
.l-header__lists li a::after {
  background: var(--text-color);
  block-size: 1px;
  bottom: 0;
  content: "";
  inline-size: 100%;
  left: 0;
  position: absolute;
  transform: scale(0,1);
  transform-origin: right top;
  transition: transform var(--hover-transition) cubic-bezier(.83,0,.17,1)
}
.l-header__lists li a:focus-visible::after {
  transform: scale(1,1);
  transform-origin: left top
}
@media (any-hover:hover) {
  .l-header__lists li a:hover::after {
    transform: scale(1,1);
    transform-origin: left top
  }
}
.l-header__btnWrap {
  display: none
}
@media screen and (min-width:1024px) {
  .l-header__btnWrap {
    align-items: center;
    display: flex
  }
}
.l-inner {
  block-size: inherit;
  inline-size: 100%;
  margin-inline: auto;
  max-inline-size: 640px;
  padding: 0 24px;
  position: relative
}
@media screen and (min-width:768px) {
  .l-inner {
    max-inline-size: 1200px;
    padding-inline: 40px
  }
}
@media screen and (min-width:768px) {
  .l-inner__narrow {
    max-inline-size: 1040px
  }
}
@media screen and (min-width:1920px) {
  .l-inner__narrow {
    max-inline-size: 1200px
  }
}
@media screen and (min-width:768px) {
  .l-inline-width_960 {
    max-inline-size: 960px
  }
}
@media screen and (min-width:768px) {
  .l-inline-width_980 {
    max-inline-size: 980px
  }
}
@media screen and (min-width:768px) {
  .l-inline-width_1000 {
    max-inline-size: 1000px
  }
}
.l-main {
  overflow: clip
}
.l-contents {
  position: relative
}
@media screen and (min-width:1024px) {
  .l-contents {
    padding-inline-start: 19.4444444444vw
  }
}
@media screen and (min-width:1280px) {
  .l-contents {
    padding-inline-start: 280px
  }
}
@media screen and (min-width:1024px) {
  .l-contents.--narrow {
    padding-inline-start: 12.0138888889vw
  }
}
@media screen and (min-width:1280px) {
  .l-contents.--narrow {
    padding-inline-start: 173px
  }
}
@media screen and (min-width:1024px) {
  .l-contents.--wide {
    padding-inline-start: 18.0555555556vw
  }
}
@media screen and (min-width:1280px) {
  .l-contents.--wide {
    padding-inline-start: 260px
  }
}
@media screen and (min-width:1920px) {
  .l-contents.--wide {
    padding-inline-start: 280px
  }
}
.l-section {
  padding-block: clamp(6.4rem,2.834rem + 9.143vw,16rem)
}
.l-section-narrow {
  padding-block: clamp(5.6rem,3.223rem + 6.095vw,12rem)
}
.l-section__wide {
  max-inline-size: 960px
}
.l-breadcrumb__inner {
  inline-size: 100%;
  margin-inline: auto;
  max-inline-size: 1280px
}
.l-breadcrumb__lists {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
  vertical-align: middle
}
.l-breadcrumb__list {
  color: var(--gray);
  font-family: var(--font-en);
  font-size: 1.1rem;
  font-weight: 400;
  letter-spacing: .1em;
  position: relative
}
.l-breadcrumb__list:not(:last-child)::after {
  background: var(--gray);
  block-size: 1px;
  content: "";
  display: inline-block;
  inline-size: 18px;
  inset: 0;
  margin-inline-start: 6px;
  vertical-align: middle
}
.l-breadcrumb__list a {
  transition: opacity var(--hover-transition) cubic-bezier(.83,0,.17,1) 0s
}
.l-breadcrumb__list a:focus-visible {
  opacity: var(--opacity-06)
}
@media (any-hover:hover) {
  .l-breadcrumb__list a:hover {
    opacity: var(--opacity-06)
  }
}
.l-breadcrumb__list > span:nth-child(n):not(:last-child) {
  color: var(--text-color);
  font-family: var(--font-ja);
  font-weight: 500;
  letter-spacing: .1em;
  line-height: normal
}
.l-cta {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: 8px
}
@media screen and (min-width:768px) {
  .l-cta {
    flex-direction: row;
    justify-content: center
  }
}
.l-cta__btn {
  aspect-ratio: 390/240;
  inline-size: 100%
}
@media screen and (min-width:768px) {
  .l-cta__btn {
    aspect-ratio: 716/450;
    inline-size: 49.72%
  }
}
.l-cta-mbs {
  margin-block-start: clamp(6.4rem,4.914rem + 3.81vw,10.4rem)
}
@media screen and (min-width:768px) {
  .l-cta-line {
    margin-block-start: 104px;
    position: relative
  }
  .l-cta-line::after {
    background: var(--line-color);
    block-size: 1px;
    content: "";
    inline-size: 100%;
    inset: 0;
    position: absolute
  }
}
.l-lower-page {
  background: url(../img/common/lower-bg-sp.png) no-repeat center center/cover;
  block-size: 341px;
  border-block-end: 1px solid var(--line-color);
  position: relative
}
@media screen and (min-width:768px) {
  .l-lower-page {
    background: url(../img/common/lower-bg.png) no-repeat center center/cover;
    block-size: 540px
  }
}
.l-lower-page.--no-line {
  border-block-end: none
}
@media screen and (max-width:767px) {
  .l-lower-page.--privacy {
    block-size: 397px
  }
}
.l-lower-page__contents {
  align-items: end;
  display: flex;
  flex-direction: column;
  padding-block-start: 160px
}
@media screen and (min-width:768px) {
  .l-lower-page__contents {
    padding-block-start: 29.296875vw
  }
}
@media screen and (min-width:1024px) {
  .l-lower-page__contents {
    padding-block-start: 260px
  }
}
@media screen and (min-width:1024px) {
  .l-lower-wrap {
    padding-block-start: 168px
  }
}
@media screen and (min-width:1024px) {
  .l-lower-sidebar {
    flex-shrink: 0;
    inline-size: 100px;
    isolation: isolate;
    left: 8.3333333333vw;
    mix-blend-mode: exclusion;
    opacity: 0;
    pointer-events: none;
    position: fixed;
    top: 150px;
    transition: opacity var(--hover-transition) cubic-bezier(.83,0,.17,1);
    z-index: 2
  }
  .l-lower-sidebar.is-visible {
    opacity: 1;
    pointer-events: auto
  }
}
@media screen and (min-width:1920px) {
  .l-lower-sidebar {
    inline-size: -moz-fit-content;
    inline-size: fit-content;
    left: 15.625vw
  }
}
@media screen and (min-width:1280px) {
  .l-lower-sidebar.--narrow {
    left: 17.7777777778vw
  }
}
.page-transition {
  animation: curtain-transition 1.2s cubic-bezier(.4,0,.2,1) both;
  background: var(--text-color);
  display: block;
  inset: 0;
  pointer-events: none;
  position: fixed;
  transform: scaleY(0);
  transform-origin: bottom;
  z-index: 999
}
@keyframes curtain-transition {
  0% {
    transform: scaleY(0);
    transform-origin: bottom
  }
  50% {
    transform: scaleY(1);
    transform-origin: bottom
  }
  50.001% {
    transform-origin: top
  }
  100% {
    transform: scaleY(0);
    transform-origin: top
  }
}
.fadeout {
  animation: fadeOut .2s .4s both;
  -webkit-animation: fadeOut .2s .4s both
}
@keyframes fadeOut {
  0% {
    opacity: 1
  }
  100% {
    opacity: 0
  }
}
#container {
  opacity: 0
}
body.move #container {
  animation: fadeIn .4s .4s forwards;
  -webkit-animation: fadeIn .4s .4s forwards;
  background-color: var(--base-color);
  opacity: 0
}
@keyframes fadeIn {
  0% {
    opacity: 0
  }
  100% {
    opacity: 1
  }
}
.c-btn {
  display: flex;
  gap: 14px;
  inline-size: -moz-fit-content;
  inline-size: fit-content
}
.c-btn span {
  display: inline-block;
  font-size: 1.5rem;
  line-height: normal;
  padding-block: 11px 8px;
  position: relative
}
.c-btn span::before {
  background: var(--line-color);
  block-size: 1px;
  bottom: 0;
  content: "";
  inline-size: 100%;
  left: 0;
  position: absolute
}
.c-btn span::after {
  background: var(--text-color);
  block-size: 1px;
  bottom: 0;
  content: "";
  inline-size: 100%;
  left: 0;
  position: absolute;
  transform: scale(0,1);
  transform-origin: right top;
  transition: transform var(--hover-transition) cubic-bezier(.83,0,.17,1)
}
.c-btn.--news {
  gap: 8px
}
.c-btn span.--no-line {
  flex-shrink: 0;
  font-size: 1.3rem;
  padding-block: 7px
}
.c-btn span.--no-line::before {
  content: none
}
.c-btn.--white span {
  color: var(--white)
}
.c-btn.--white span::after {
  background: var(--white)
}
.c-btn:focus-visible span::after {
  transform: scale(1,1);
  transform-origin: left top
}
.c-btn:focus-visible .c-btn__arrow {
  opacity: 0;
  transform: translate(10px,-10px) rotate(-45deg)
}
.c-btn:focus-visible .c-btn__arrow.--hover {
  opacity: 1;
  transform: translate(0,0) rotate(-45deg)
}
@media (any-hover:hover) {
  .c-btn:hover span::after {
    transform: scale(1,1);
    transform-origin: left top
  }
  .c-btn:hover .c-btn__arrow {
    opacity: 0;
    transform: translate(10px,-10px) rotate(-45deg)
  }
  .c-btn:hover .c-btn__arrow.--hover {
    opacity: 1;
    transform: translate(0,0) rotate(-45deg)
  }
}
.c-btn .c-btn__circle {
  background: var(--text-color);
  block-size: 41px;
  border-radius: calc(infinity * 1px);
  flex-shrink: 0;
  inline-size: 41px;
  position: relative;
  transition: translate var(--hover-transition) cubic-bezier(.83,0,.17,1)
}
.c-btn .c-btn__circle.--white {
  background: var(--white)
}
.c-btn .c-btn__circle.--white .c-btn__arrow {
  fill: var(--text-color)
}
.c-btn .c-btn__circle.--small {
  block-size: 33px;
  inline-size: 33px
}
.c-btn .c-btn__circle.--small .c-btn__arrowWrap {
  margin-block-start: 9px;
  margin-inline-start: 9px
}
.c-btn .c-btn__arrowWrap {
  block-size: 13px;
  inline-size: 17px;
  margin-block-start: 13px;
  margin-inline-start: 12px;
  overflow: hidden;
  position: relative
}
.c-btn .c-btn__arrow {
  left: 0;
  position: absolute;
  top: 0;
  transform: rotate(-45deg);
  transition: opacity var(--hover-transition) cubic-bezier(.83,0,.17,1),transform var(--hover-transition) cubic-bezier(.83,0,.17,1)
}
.c-btn .c-btn__arrow.--hover {
  opacity: 0;
  transform: translate(-10px,10px) rotate(-45deg)
}
.c-btn .c-btn__link {
  color: var(--white);
  left: 0;
  position: absolute;
  top: 0;
  transition: scale var(--hover-transition) cubic-bezier(.83,0,.17,1)
}
.c-btn--return .c-btn__arrowWrap {
  block-size: 13px;
  inline-size: 17px;
  margin-block-start: 13px;
  margin-inline-end: 12px;
  overflow: hidden;
  position: relative
}
.c-btn--return .c-btn__arrowWrap .c-btn__arrow {
  left: 0;
  position: absolute;
  top: 0;
  transform: scaleX(-1);
  transition: opacity var(--hover-transition) cubic-bezier(.83,0,.17,1),transform var(--hover-transition) cubic-bezier(.83,0,.17,1)
}
.c-btn--return .c-btn__arrowWrap .c-btn__arrow.--hover {
  opacity: 0;
  transform: translateX(10px) scaleX(-1)
}
.c-btn--return:focus-visible .c-btn__arrow {
  opacity: 0;
  transform: translateX(-10px) scaleX(-1)
}
.c-btn--return:focus-visible .c-btn__arrow.--hover {
  opacity: 1;
  transform: translateX(0) scaleX(-1)
}
@media (any-hover:hover) {
  .c-btn--return:hover .c-btn__arrow {
    opacity: 0;
    transform: translateX(-10px) scaleX(-1)
  }
  .c-btn--return:hover .c-btn__arrow.--hover {
    opacity: 1;
    transform: translateX(0) scaleX(-1)
  }
}
.c-header-btn {
  block-size: 60px;
  display: block;
  font-size: 1.3rem;
  line-height: 60px;
  padding-inline: 20px;
  position: relative;
  transition: background-color var(--hover-transition) cubic-bezier(.83,0,.17,1) 0s;
  white-space: nowrap
}
@media screen and (min-width:1920px) {
  .c-header-btn {
    font-size: 1.4rem
  }
}
@media screen and (min-width:1280px) {
  .c-header-btn__document {
    padding-inline: 32px
  }
}
@media screen and (min-width:1280px) {
  .c-header-btn__contact {
    padding-inline: 45px
  }
}
.c-header-btn::before {
  background: var(--line-color);
  block-size: 100%;
  content: "";
  inline-size: 1px;
  left: 0;
  position: absolute;
  top: 50%;
  translate: 0 -50%
}
.c-header-btn span {
  padding-inline-start: 32px;
  position: relative;
  transition: color var(--hover-transition) cubic-bezier(.83,0,.17,1) 0s
}
.c-header-btn span::before {
  content: "";
  position: absolute;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  aspect-ratio: 19/15;
  background: var(--text-color);
  inline-size: 19px;
  left: 0;
  mask-size: contain;
  top: 50%;
  transition: background-color var(--hover-transition) cubic-bezier(.83,0,.17,1) 0s;
  translate: 0 -50%
}
.c-header-btn:focus-visible {
  background: var(--text-color)
}
.c-header-btn:focus-visible span {
  color: var(--white)
}
.c-header-btn:focus-visible span::before {
  background: var(--white)
}
@media (any-hover:hover) {
  .c-header-btn:hover {
    background: var(--text-color)
  }
  .c-header-btn:hover span {
    color: var(--white)
  }
  .c-header-btn:hover span::before {
    background: var(--white)
  }
}
.c-header-btn__document span::before {
  -webkit-mask-image: url(../img/common/icon-download.svg);
  mask-image: url(../img/common/icon-download.svg)
}
.c-header-btn__contact {
  border-inline-end: 1px solid var(--line-color)
}
.c-header-btn__contact span::before {
  -webkit-mask-image: url(../img/common/icon-send.svg);
  mask-image: url(../img/common/icon-send.svg)
}
.c-btn-cta {
  block-size: 100%;
  color: var(--white);
  display: flex;
  flex-direction: column;
  inline-size: 100%;
  isolation: isolate;
  overflow: hidden;
  padding: 16px 8px 16px 24px;
  position: relative
}
@media screen and (min-width:768px) {
  .c-btn-cta {
    padding: clamp(1.6rem,.709rem + 2.286vw,4rem) 16px 24px 32px
  }
}
.c-btn-cta .c-btn-cta__bg {
  background: no-repeat center center/cover;
  inset: 0;
  position: absolute;
  transition: scale var(--hover-transition) cubic-bezier(.83,0,.17,1);
  will-change: scale;
  z-index: 0
}
.c-btn-cta.--company .c-btn-cta__bg {
  background-image: url(../img/common/company-sp.jpg)
}
@media screen and (min-width:768px) {
  .c-btn-cta.--company .c-btn-cta__bg {
    background-image: url(../img/common/company.jpg)
  }
}
.c-btn-cta.--recruit .c-btn-cta__bg {
  background-image: url(../img/common/recruit-sp.jpg)
}
@media screen and (min-width:768px) {
  .c-btn-cta.--recruit .c-btn-cta__bg {
    background-image: url(../img/common/recruit.jpg)
  }
}
.c-btn-cta.--service .c-btn-cta__bg {
  background-image: url(../img/common/service-sp.png)
}
@media screen and (min-width:768px) {
  .c-btn-cta.--service .c-btn-cta__bg {
    background-image: url(../img/common/service.png)
  }
}
.c-btn-cta.--about .c-btn-cta__bg {
  background-image: url(../img/common/about-sp.jpg)
}
@media screen and (min-width:768px) {
  .c-btn-cta.--about .c-btn-cta__bg {
    background-image: url(../img/common/about.jpg)
  }
}
.c-btn-cta::before {
  content: "";
  inset: 0;
  margin: auto;
  overflow: hidden;
  position: absolute;
  z-index: 1
}
.c-btn-cta::before {
  background: linear-gradient(0deg,rgba(0,0,0,.5) 0,rgba(0,0,0,.5) 100%);
  opacity: 1;
  transition: opacity var(--hover-transition) cubic-bezier(.83,0,.17,1),visibility var(--hover-transition) cubic-bezier(.83,0,.17,1);
  visibility: visible
}
.c-btn-cta.--service::before {
  background: linear-gradient(0deg,rgba(0,0,0,.6) 0,rgba(0,0,0,.6) 100%)
}
.c-btn-cta > * {
  position: relative;
  z-index: 2
}
.c-btn-cta .c-btn-cta__text--en {
  font-family: var(--font-en);
  font-optical-sizing: auto;
  font-size: 4rem;
  font-style: normal;
  font-weight: 400;
  line-height: 0;
  line-height: normal;
  text-transform: uppercase
}
.c-btn-cta .c-btn-cta__textWrap {
  bottom: 0;
  display: flex;
  gap: 20px;
  justify-content: end;
  margin-block-start: auto;
  margin-inline-start: auto;
  position: relative;
  right: 0
}
.c-btn-cta .c-btn-cta__text--ja {
  display: block;
  font-size: 2rem;
  line-height: normal;
  text-align: right
}
.c-btn-cta .c-btn-cta__arrowWrap {
  block-size: 16px;
  inline-size: 20px;
  margin-block-start: 8px;
  overflow: hidden;
  position: relative
}
.c-btn-cta .c-btn__arrow {
  left: 0;
  position: absolute;
  top: 0;
  transform: rotate(-45deg);
  transition: opacity var(--hover-transition) cubic-bezier(.83,0,.17,1),transform var(--hover-transition) cubic-bezier(.83,0,.17,1)
}
.c-btn-cta .c-btn__arrow.--hover {
  opacity: 0;
  transform: translate(-10px,10px) rotate(-45deg)
}
.c-btn-cta:focus-visible .c-btn-cta__bg {
  scale: 1.02
}
.c-btn-cta:focus-visible .c-btn__arrow {
  opacity: 0;
  transform: translate(10px,-10px) rotate(-45deg)
}
.c-btn-cta:focus-visible .c-btn__arrow.--hover {
  opacity: 1;
  transform: translate(0,0) rotate(-45deg)
}
@media (any-hover:hover) {
  .c-btn-cta:hover .c-btn-cta__bg {
    scale: 1.02
  }
  .c-btn-cta:hover .c-btn__arrow {
    opacity: 0;
    transform: translate(10px,-10px) rotate(-45deg)
  }
  .c-btn-cta:hover .c-btn__arrow.--hover {
    opacity: 1;
    transform: translate(0,0) rotate(-45deg)
  }
}
.c-btn-document {
  display: inline-flex;
  -moz-column-gap: 16px;
  align-items: center;
  background-color: var(--main-color);
  border: 1px solid var(--line-color);
  column-gap: 16px;
  cursor: pointer;
  font-size: 1.4rem;
  inline-size: min(100%,334px);
  justify-content: center;
  line-height: 180%;
  padding: 14px 32px 17px 32px;
  text-wrap: pretty;
  transition-duration: var(--hover-transition);
  transition-property: background-color,color,border-color;
  transition-timing-function: cubic-bezier(.83,0,.17,1);
  vertical-align: middle
}
.c-btn-document::after {
  aspect-ratio: 1;
  content: "";
  -webkit-mask-image: url(../img/common/icon-download.svg);
  mask-image: url(../img/common/icon-download.svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  aspect-ratio: 19/15;
  background: var(--text-color);
  inline-size: 19px;
  mask-size: contain;
  transition: background-color var(--hover-transition) cubic-bezier(.83,0,.17,1)
}
.c-btn-document:focus-visible {
  background-color: var(--text-color);
  border-color: var(--text-color);
  color: var(--white)
}
.c-btn-document:focus-visible::after {
  background-color: var(--white)
}
@media (any-hover:hover) {
  .c-btn-document:where(:-moz-any-link,:enabled):hover {
    background-color: var(--text-color);
    border-color: var(--text-color);
    color: var(--white)
  }
  .c-btn-document:where(:any-link,:enabled):hover {
    background-color: var(--text-color);
    border-color: var(--text-color);
    color: var(--white)
  }
  .c-btn-document:where(:-moz-any-link,:enabled):hover::after {
    background-color: var(--white)
  }
  .c-btn-document:where(:any-link,:enabled):hover::after {
    background-color: var(--white)
  }
}
.c-section-title--en {
  font-family: var(--font-en);
  font-optical-sizing: auto;
  font-size: clamp(6rem,4.663rem + 3.429vw,9.6rem);
  font-style: normal;
  font-weight: 400;
  letter-spacing: -.02em;
  line-height: 0;
  text-transform: uppercase
}
.c-section-title--en.--white {
  color: var(--white)
}
.c-section-title--en.--small {
  font-size: clamp(4.8rem,3.017rem + 4.571vw,9.6rem)
}
.c-section-title--enBig {
  font-family: var(--font-en);
  font-optical-sizing: auto;
  font-size: clamp(7.2rem,6.309rem + 2.286vw,9.6rem);
  font-style: normal;
  font-weight: 400;
  letter-spacing: -.02em;
  line-height: 0;
  text-transform: uppercase
}
.c-section-title--enBig.--right {
  text-align: right
}
.c-section-title--enBig.--white {
  color: var(--white)
}
.c-recruit-title--en {
  font-family: var(--font-en);
  font-optical-sizing: auto;
  font-size: clamp(5.6rem,4.114rem + 3.81vw,9.6rem);
  font-style: normal;
  font-weight: 400;
  letter-spacing: -.02em;
  line-height: 0;
  text-transform: uppercase
}
.c-recruit-title--en.--right {
  text-align: right
}
.c-section-title {
  font-size: clamp(2rem,1.554rem + 1.143vw,3.2rem);
  line-height: 150%
}
@media screen and (min-width:768px) {
  .c-section-title {
    line-height: 100%
  }
}
.c-section-name {
  color: var(--gray);
  font-family: var(--font-en);
  font-optical-sizing: auto;
  font-size: 1.3rem;
  font-style: normal;
  font-weight: 400;
  line-height: 0;
  line-height: normal;
  text-transform: uppercase
}
@media screen and (min-width:768px) {
  .c-section-name.--tate {
    writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    -webkit-writing-mode: vertical-rl;
    rotate: 180deg
  }
}
.c-section-name.--both-tate {
  writing-mode: vertical-rl;
  -ms-writing-mode: tb-rl;
  -webkit-writing-mode: vertical-rl;
  rotate: 180deg
}
[data-title-hide] {
  block-size: -moz-fit-content;
  block-size: fit-content;
  block-size: auto;
  line-height: 1;
  overflow: hidden
}
[data-title-hide].--lineHeight {
  line-height: 1
}
[data-title-hide].--lineHeight1-3 {
  line-height: 1.3
}
[data-title-hide].--lineHeight1-3-1 {
  line-height: 1.3
}
@media screen and (min-width:768px) {
  [data-title-hide].--lineHeight1-3-1 {
    margin-block-start: -19px
  }
}
[data-title-show] {
  display: inline-block;
  font-size: inherit;
  letter-spacing: inherit;
  line-height: inherit;
  opacity: 0;
  text-transform: inherit;
  transform: translateY(100%)
}
.c-lower-titleWrap {
  align-items: flex-end;
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-block-start: 32px
}
.c-lower-title--en {
  font-family: var(--font-en);
  font-optical-sizing: auto;
  font-size: clamp(5.6rem,3.223rem + 6.095vw,12rem);
  font-style: normal;
  font-weight: 400;
  letter-spacing: -.02em;
  line-height: 0;
  text-transform: uppercase
}
.c-lower-title--en.--privacy {
  text-align: right
}
.c-lower-title {
  font-size: clamp(1.8rem,1.577rem + .571vw,2.4rem);
  line-height: 160%
}
.c-heading-ja {
  font-size: clamp(2.4rem,2.103rem + .762vw,3.2rem);
  line-height: 160%
}
.c-heading-ja.--right {
  text-align: right
}
.c-heading-en {
  color: var(--gray);
  font-family: var(--font-en);
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 400;
  line-height: 0;
  text-transform: uppercase
}
.c-heading-en__big {
  font-family: var(--font-en);
  font-optical-sizing: auto;
  font-size: clamp(4.8rem,4.206rem + 1.524vw,6.4rem);
  font-style: normal;
  font-weight: 400;
  letter-spacing: -.02em;
  line-height: 0;
  text-transform: uppercase
}
.c-lists {
  display: flex;
  flex-direction: column;
  gap: 16px;
  inline-size: 100%;
  max-inline-size: 640px
}
@media screen and (min-width:768px) {
  .c-lists {
    gap: 8px
  }
}
.c-list.--archive {
  gap: 0;
  max-inline-size: 848px
}
.c-list.--archive .c-list__link {
  background: var(--base-color);
  border-block-start: 1px solid var(--line-color);
  gap: 13px;
  padding: 20px 60px 38px 8px;
  position: relative
}
@media screen and (min-width:768px) {
  .c-list.--archive .c-list__link {
    padding: 29px 58px 35px 25px
  }
}
.c-list.--archive .c-list__link:focus-visible {
  background: var(--light-gray)
}
@media (any-hover:hover) {
  .c-list.--archive .c-list__link:hover {
    background: var(--light-gray)
  }
}
.c-list.--archive .c-list__title {
  font-size: 1.4rem
}
@media screen and (min-width:768px) {
  .c-list.--archive .c-list__title {
    margin-inline-end: 0
  }
}
@media screen and (min-width:1920px) {
  .c-list.--archive .c-list__title {
    font-size: 1.6rem
  }
}
.c-list.--archive .c-list__arrowWrap {
  bottom: 18px;
  right: 6px
}
@media screen and (min-width:768px) {
  .c-list.--archive .c-list__arrowWrap {
    bottom: 27px;
    right: 26px
  }
}
.c-list__link {
  align-items: stretch;
  background: var(--white);
  block-size: 100%;
  display: flex;
  flex-direction: column;
  gap: 5px;
  padding: 12px 56px 24px 24px;
  position: relative;
  transition: background-color var(--hover-transition) cubic-bezier(.83,0,.17,1) 0s
}
@media screen and (min-width:768px) {
  .c-list__link {
    gap: 17px;
    padding: 27px 44px 35px 24px
  }
}
.c-list__link:focus-visible {
  background: var(--light-gray)
}
.c-list__link:focus-visible .c-list__arrow {
  opacity: 0;
  transform: translate(10px,-10px) rotate(-45deg)
}
.c-list__link:focus-visible .c-list__arrow.--hover {
  opacity: 1;
  transform: translate(0,0) rotate(-45deg)
}
@media (any-hover:hover) {
  .c-list__link:hover {
    background: var(--light-gray)
  }
  .c-list__link:hover .c-list__arrow {
    opacity: 0;
    transform: translate(10px,-10px) rotate(-45deg)
  }
  .c-list__link:hover .c-list__arrow.--hover {
    opacity: 1;
    transform: translate(0,0) rotate(-45deg)
  }
}
.c-list__meta {
  align-items: baseline;
  display: flex;
  gap: 16px;
  order: 1
}
@media screen and (min-width:768px) {
  .c-list__meta {
    gap: 10px
  }
}
.c-list__title {
  display: -webkit-box;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  font-size: 1.3rem;
  line-height: 180%;
  order: 2;
  overflow: hidden;
  text-overflow: ellipsis
}
@media screen and (min-width:768px) {
  .c-list__title {
    -webkit-line-clamp: 2;
    font-size: 1.4rem;
    line-height: 210%
  }
}
@media screen and (min-width:1920px) {
  .c-list__title {
    font-size: 1.6rem
  }
}
.c-list__publish {
  color: var(--dark-gray);
  font-family: var(--font-en);
  font-optical-sizing: auto;
  font-size: 1.2rem;
  font-style: normal;
  font-weight: 400;
  line-height: 0;
  order: 1;
  text-transform: uppercase
}
@media screen and (min-width:768px) {
  .c-list__publish {
    letter-spacing: .05em
  }
}
.c-list__categories {
  display: flex;
  flex-shrink: 0;
  flex-wrap: wrap;
  gap: 8px;
  order: 2
}
.c-list__category {
  color: var(--dark-gray);
  display: inline-block;
  font-family: var(--font-en);
  font-optical-sizing: auto;
  font-size: 1.2rem;
  font-style: normal;
  font-weight: 400;
  line-height: 0;
  line-height: normal;
  text-transform: uppercase;
  text-transform: capitalize
}
.c-list__category[href] {
  transition: opacity var(--hover-transition) cubic-bezier(.83,0,.17,1)
}
.c-list__category[href]:focus-visible {
  opacity: var(--opacity-06)
}
@media (any-hover:hover) {
  .c-list__category[href]:hover {
    opacity: var(--opacity-06)
  }
}
.c-list__arrowWrap {
  aspect-ratio: 20/16;
  bottom: 18px;
  inline-size: 18px;
  overflow: hidden;
  position: absolute;
  right: 14px
}
@media screen and (min-width:768px) {
  .c-list__arrowWrap {
    bottom: 21px;
    right: 16px
  }
}
.c-list__arrow {
  left: 0;
  position: absolute;
  top: 0;
  transform: rotate(-45deg);
  transition: opacity var(--hover-transition) cubic-bezier(.83,0,.17,1),transform var(--hover-transition) cubic-bezier(.83,0,.17,1)
}
.c-list__arrow.--hover {
  opacity: 0;
  transform: translate(-10px,10px) rotate(-45deg)
}
.c-pagination {
  align-items: center;
  display: flex;
  gap: 16px;
  justify-content: center
}
.c-pagination__list {
  align-items: center;
  display: flex;
  gap: clamp(1.2rem,.754rem + 1.143vw,2.4rem);
  justify-content: center
}
.c-pagination__item a {
  display: block;
  padding: 4px 4px 6px
}
.c-pagination__item a:not(.c-pagination__item--prev):not(.c-pagination__item--next) {
  border-block-end: 2px solid transparent;
  color: var(--gray);
  font-family: var(--font-en);
  font-optical-sizing: auto;
  font-size: 2.4rem;
  font-style: normal;
  font-weight: 400;
  letter-spacing: -.02em;
  line-height: 0;
  line-height: 100%;
  text-transform: uppercase;
  transition-duration: var(--hover-transition);
  transition-property: opacity;
  transition-timing-function: cubic-bezier(.83,0,.17,1);
  white-space: nowrap
}
.c-pagination__item a:not(.c-pagination__item--prev):not(.c-pagination__item--next):focus-visible {
  opacity: var(--opacity-06)
}
@media (any-hover:hover) {
  .c-pagination__item a:not(.c-pagination__item--prev):not(.c-pagination__item--next):hover {
    opacity: var(--opacity-06)
  }
}
.c-pagination__item.is-current span {
  display: block;
  font-family: var(--font-en);
  font-optical-sizing: auto;
  font-size: 2.4rem;
  font-style: normal;
  font-weight: 400;
  letter-spacing: -.02em;
  line-height: 0;
  line-height: 100%;
  padding: 4px 4px 8px;
  pointer-events: none;
  position: relative;
  text-transform: uppercase
}
.c-pagination__item.is-current span::after {
  background: var(--text-color);
  block-size: 2px;
  bottom: 0;
  content: "";
  inline-size: calc(100% - 8px);
  left: 50%;
  position: absolute;
  right: 0;
  translate: -50%
}
.c-pagination__item.c-pagination__item--dots span {
  color: var(--gray);
  display: block;
  font-family: var(--font-en);
  font-optical-sizing: auto;
  font-size: 2.4rem;
  font-style: normal;
  font-weight: 400;
  letter-spacing: -.02em;
  line-height: 0;
  line-height: 100%;
  padding: 4px 4px 6px;
  pointer-events: none;
  text-transform: uppercase;
  translate: 0 -6px
}
.c-pagination__nav {
  aspect-ratio: 1;
  inline-size: 36px
}
.c-pagination__nav img {
  block-size: 100%;
  inline-size: 100%;
  -o-object-fit: contain;
  object-fit: contain
}
.c-pagination__item--next,
.c-pagination__item--prev {
  display: none
}
@media screen and (min-width:768px) {
  .c-pagination__item--next,
  .c-pagination__item--prev {
    display: block;
    position: relative
  }
}
.c-pagination__item--next a,
.c-pagination__item--prev a {
  aspect-ratio: 20/16;
  block-size: 16px;
  display: block;
  inline-size: 20px;
  overflow: hidden
}
.c-pagination__item--next a .c-pagination__arrowWrap,
.c-pagination__item--prev a .c-pagination__arrowWrap {
  block-size: 16px;
  inline-size: 20px;
  overflow: hidden;
  position: relative
}
.c-pagination__item--next a .c-btn__arrow,
.c-pagination__item--prev a .c-btn__arrow {
  left: 0;
  position: absolute;
  top: 0;
  transition: opacity var(--hover-transition) cubic-bezier(.83,0,.17,1),transform var(--hover-transition) cubic-bezier(.83,0,.17,1)
}
.c-pagination__item--next a .c-btn__arrow.--hover,
.c-pagination__item--prev a .c-btn__arrow.--hover {
  opacity: 0;
  transform: translateX(-10px)
}
.c-pagination__item--next {
  margin-inline-start: 10px
}
@media screen and (min-width:768px) {
  .c-pagination__item--next {
    margin-inline-start: 32px
  }
}
.c-pagination__item--next a:focus-visible .c-btn__arrow {
  opacity: 0;
  transform: translateX(10px)
}
.c-pagination__item--next a:focus-visible .c-btn__arrow.--hover {
  opacity: 1;
  transform: translateX(0)
}
@media (any-hover:hover) {
  .c-pagination__item--next a:hover .c-btn__arrow {
    opacity: 0;
    transform: translateX(10px)
  }
  .c-pagination__item--next a:hover .c-btn__arrow.--hover {
    opacity: 1;
    transform: translateX(0)
  }
}
.c-pagination__item--prev {
  margin-inline-end: 24px
}
@media screen and (min-width:768px) {
  .c-pagination__item--prev {
    margin-inline-end: 32px
  }
}
.c-pagination__item--prev a .c-btn__arrow {
  transform: scaleX(-1)
}
.c-pagination__item--prev a .c-btn__arrow.--hover {
  opacity: 0;
  transform: translateX(10px) scaleX(-1)
}
.c-pagination__item--prev a:focus-visible .c-btn__arrow {
  opacity: 0;
  transform: translateX(-10px) scaleX(-1)
}
.c-pagination__item--prev a:focus-visible .c-btn__arrow.--hover {
  opacity: 1;
  transform: translateX(0) scaleX(-1)
}
@media (any-hover:hover) {
  .c-pagination__item--prev a:hover .c-btn__arrow {
    opacity: 0;
    transform: translateX(-10px) scaleX(-1)
  }
  .c-pagination__item--prev a:hover .c-btn__arrow.--hover {
    opacity: 1;
    transform: translateX(0) scaleX(-1)
  }
}
.c-packages {
  align-items: stretch;
  display: grid;
  flex-direction: column;
  gap: 38px
}
@media screen and (min-width:768px) {
  .c-packages {
    display: grid;
    grid-template-columns: 1fr 1fr
  }
}
@media screen and (min-width:1280px) {
  .c-packages {
    border-block-end: 1px solid var(--line-color);
    display: grid;
    gap: 0;
    grid-template-columns: revert;
    grid-template-rows: 1fr 1fr
  }
}
.c-package {
  align-items: stretch;
  block-size: 100%;
  display: flex;
  flex-direction: column;
  min-height: 0;
  position: relative
}
@media screen and (max-width:767px) {
  .c-package:first-child {
    border-block-end: 1px solid var(--line-color);
    padding-block-end: 38px
  }
  .c-package:last-child {
    padding-block-end: 24px
  }
}
.c-package__link {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 24px;
  position: relative;
  transition: background-color var(--hover-transition) cubic-bezier(.83,0,.17,1) 0s
}
@media screen and (min-width:1280px) {
  .c-package__link {
    block-size: 100%;
    border-block-start: 1px solid var(--line-color);
    display: grid;
    gap: 48px;
    grid-template-columns: 352px auto
  }
}
.c-package__link:focus-visible {
  background: var(--light-gray)
}
.c-package__link:focus-visible .c-package__img img {
  scale: 1.04
}
.c-package__link:focus-visible .c-arrow {
  opacity: 0;
  transform: translate(10px,-10px) rotate(-45deg)
}
.c-package__link:focus-visible .c-arrow.--hover {
  opacity: 1;
  transform: translate(0,0) rotate(-45deg)
}
@media (any-hover:hover) {
  .c-package__link:hover {
    background: var(--light-gray)
  }
  .c-package__link:hover .c-package__img img {
    scale: 1.04
  }
  .c-package__link:hover .c-arrow {
    opacity: 0;
    transform: translate(10px,-10px) rotate(-45deg)
  }
  .c-package__link:hover .c-arrow.--hover {
    opacity: 1;
    transform: translate(0,0) rotate(-45deg)
  }
}
.c-package__contents {
  display: flex;
  flex-direction: column;
  gap: clamp(2.4rem,1.509rem + 2.286vw,4.8rem)
}
@media screen and (min-width:1280px) {
  .c-package__contents {
    display: grid;
    grid-template-columns: 1fr auto
  }
}
.c-package__img {
  aspect-ratio: 352/235;
  flex-shrink: 0;
  inline-size: 100%;
  overflow: hidden
}
@media screen and (min-width:1280px) {
  .c-package__img {
    aspect-ratio: revert;
    block-size: 100%;
    border-inline-end: 1px solid var(--line-color);
    inline-size: auto
  }
}
.c-package__img img {
  block-size: 100%;
  inline-size: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center;
  object-position: center;
  transition: scale var(--hover-transition) cubic-bezier(.83,0,.17,1);
  will-change: scale
}
.c-package__textWrap {
  align-items: stretch;
  block-size: 100%;
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 12px
}
@media screen and (min-width:1280px) {
  .c-package__textWrap {
    block-size: 100%;
    gap: 30px;
    padding: 24px 70px 24px 0
  }
}
.c-package__titleWrap {
  display: flex;
  flex-direction: column
}
.c-package__number {
  color: var(--gray);
  font-family: var(--font-en);
  font-optical-sizing: auto;
  font-size: 1.2rem;
  font-style: normal;
  font-weight: 400;
  line-height: 0;
  line-height: 160%;
  text-transform: uppercase
}
.c-package__title {
  flex-grow: 1;
  font-size: 2.6rem;
  line-height: normal
}
.c-package__text {
  font-size: 1.4rem;
  line-height: 180%
}
@media screen and (max-width:1279px) {
  .c-package__circle {
    background: var(--text-color);
    block-size: 41px;
    border-radius: calc(infinity * 1px);
    display: grid;
    flex-shrink: 0;
    inline-size: 41px;
    margin-block-start: -16px;
    margin-inline-start: auto;
    place-content: center;
    position: relative
  }
  .c-package__circle .c-arrow {
    fill: var(--white)
  }
}
@media screen and (min-width:1280px) {
  .c-package__circle {
    display: contents
  }
}
@media screen and (min-width:1280px) {
  .c-package__arrowWrap {
    bottom: 20px;
    position: absolute!important;
    right: 16px
  }
  .c-package__arrowWrap .c-arrow {
    fill: var(--text-color)
  }
}
.c-page-nav {
  block-size: inherit;
  inline-size: 100%;
  isolation: isolate;
  margin-inline: auto;
  max-inline-size: 640px;
  padding: 56px 24px;
  position: relative;
  transform: translateZ(0);
  z-index: 10
}
@media screen and (min-width:768px) {
  .c-page-nav {
    margin-inline: revert;
    max-inline-size: revert;
    padding-inline: 40px
  }
}
@media screen and (min-width:1024px) {
  .c-page-nav {
    padding: 0
  }
}
.c-page-nav__lists {
  display: flex;
  flex-wrap: wrap;
  row-gap: 16px;
  -moz-column-gap: 24px;
  column-gap: 24px
}
@media screen and (min-width:1024px) {
  .c-page-nav__lists {
    flex-direction: column;
    gap: 4px
  }
}
.c-page-nav__item {
  flex-shrink: 0
}
.c-page-nav__link {
  color: var(--dark-gray);
  display: block;
  font-size: 1.2rem;
  letter-spacing: .1em;
  line-height: 180%;
  transition: opacity var(--hover-transition) cubic-bezier(.83,0,.17,1) 0s
}
@media screen and (max-width:1023px) {
  .c-page-nav__link {
    border-block-end: 1px solid var(--line-color);
    padding-block-end: 4px
  }
}
@media screen and (min-width:1024px) {
  .c-page-nav__link {
    color: rgba(255,255,255,.5);
    mix-blend-mode: exclusion;
    pointer-events: auto
  }
  .c-page-nav__link.is-active {
    color: #fff
  }
}
@media screen and (min-width:1920px) {
  .c-page-nav__link {
    font-size: 1.4rem
  }
}
.c-page-nav__link:focus-visible {
  opacity: var(--opacity-06)
}
@media (any-hover:hover) {
  .c-page-nav__link:hover {
    opacity: var(--opacity-06)
  }
}
.c-loading {
  align-items: center;
  background: var(--base-color);
  block-size: 100%;
  block-size: 100dvh;
  display: flex;
  inline-size: 100%;
  justify-content: center;
  left: 0;
  position: fixed;
  top: 0;
  z-index: 300
}
.c-loading__logoWrap {
  align-items: center;
  block-size: 5.8974358974vw;
  display: flex;
  inline-size: 46.1538461538vw;
  justify-content: center;
  max-block-size: 30px;
  max-inline-size: 236px;
  overflow: hidden
}
@media screen and (min-width:768px) {
  .c-loading__logoWrap {
    block-size: 2.0833333333vw;
    inline-size: 16.3888888889vw
  }
}
.c-loading__logo {
  block-size: 100%;
  inline-size: 100%;
  opacity: 1;
  translate: 0 100%;
  will-change: transform
}
.c-loading__logo img {
  block-size: 100%;
  display: block;
  inline-size: 100%;
  -o-object-fit: contain;
  object-fit: contain
}
.c-arrowWrap {
  aspect-ratio: 20/16;
  flex-shrink: 0;
  inline-size: 20px;
  overflow: hidden;
  position: relative
}
.c-arrow {
  left: 0;
  position: absolute;
  top: 0;
  transform: rotate(-45deg);
  transition: opacity var(--hover-transition) cubic-bezier(.83,0,.17,1),transform var(--hover-transition) cubic-bezier(.83,0,.17,1)
}
.c-arrow.--hover {
  opacity: 0;
  transform: translate(-10px,10px) rotate(-45deg)
}
.c-link:focus-visible {
  background: var(--light-gray)
}
.c-link:focus-visible .c-arrow {
  opacity: 0;
  transform: translate(10px,-10px) rotate(-45deg)
}
.c-link:focus-visible .c-arrow.--hover {
  opacity: 1;
  transform: translate(0,0) rotate(-45deg)
}
@media (any-hover:hover) {
  .c-link:hover {
    background: var(--light-gray)
  }
  .c-link:hover .c-arrow {
    opacity: 0;
    transform: translate(10px,-10px) rotate(-45deg)
  }
  .c-link:hover .c-arrow.--hover {
    opacity: 1;
    transform: translate(0,0) rotate(-45deg)
  }
}
.c-casestudy__titleWrap {
  display: flex;
  flex-direction: column;
  gap: 16px;
  max-inline-size: 540px
}
.c-casestudy__title {
  display: -webkit-box;
  font-size: 2rem;
  line-height: 1.8;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis
}
.c-casestudy__title.--white {
  color: var(--white)
}
@media screen and (max-width:767px) {
  .c-casestudy__title.--top {
    -webkit-line-clamp: 3
  }
}
.c-casestudy__lead {
  display: -webkit-box;
  font-size: 1.4rem;
  line-height: 1.8;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
  text-overflow: ellipsis
}
.c-casestudy__lead.--gray {
  color: var(--dark-gray)
}
.c-casestudy__lists {
  display: flex;
  flex-direction: column;
  gap: 4px
}
@media screen and (min-width:1024px) {
  .c-casestudy__lists {
    gap: 8px
  }
}
.c-casestudy__list {
  display: grid;
  gap: 8px;
  grid-template-columns: 60px 1fr
}
@media screen and (min-width:1024px) {
  .c-casestudy__list {
    gap: 16px;
    grid-template-columns: 70px 1fr
  }
}
.c-casestudy__list.--gray {
  color: var(--dark-gray)
}
.c-casestudy__value {
  display: -webkit-box;
  font-size: 1.3rem;
  line-height: normal;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
  text-overflow: ellipsis
}
.c-casestudy__value.--gray {
  color: var(--dark-gray)
}
.c-casestudy__arrowWrap {
  bottom: 28px;
  position: absolute;
  right: 25px
}
@media screen and (min-width:768px) {
  .c-casestudy__arrowWrap {
    bottom: 24px;
    right: 18px
  }
}
.p-casestudy-single__postContent .c-link-card,
.p-single__content .c-link-card {
  block-size: auto;
  inline-size: 100%;
  margin-block-start: 20px
}
.p-casestudy-single__postContent .c-link-card__link,
.p-single__content .c-link-card__link {
  border: none;
  display: flex;
  flex-direction: column;
  gap: clamp(2.4rem,2.103rem + .762vw,3.2rem);
  margin: 0;
  padding: 0;
  transition: opacity var(--hover-transition) cubic-bezier(.83,0,.17,1) 0s
}
@media screen and (min-width:768px) {
  .p-casestudy-single__postContent .c-link-card__link,
  .p-single__content .c-link-card__link {
    flex-direction: row-reverse;
    justify-content: space-between
  }
}
.p-casestudy-single__postContent .c-link-card__link:focus-visible,
.p-single__content .c-link-card__link:focus-visible {
  opacity: var(--opacity-06)
}
@media (any-hover:hover) {
  .p-casestudy-single__postContent .c-link-card__link:hover,
  .p-single__content .c-link-card__link:hover {
    opacity: var(--opacity-06)
  }
}
.p-casestudy-single__postContent .c-link-card__image,
.p-single__content .c-link-card__image {
  aspect-ratio: 342/201;
  background-color: var(--light-gray);
  block-size: auto;
  flex-shrink: 0;
  inline-size: 100%;
  overflow: hidden
}
@media screen and (min-width:768px) {
  .p-casestudy-single__postContent .c-link-card__image,
  .p-single__content .c-link-card__image {
    aspect-ratio: 245/185;
    max-inline-size: 245px
  }
}
.p-casestudy-single__postContent .c-link-card__image:empty,
.p-single__content .c-link-card__image:empty {
  display: none
}
.p-casestudy-single__postContent .c-link-card__image img,
.p-single__content .c-link-card__image img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover
}
.p-casestudy-single__postContent .c-link-card__textWrap,
.p-single__content .c-link-card__textWrap {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin: 0 24px 32px
}
@media screen and (min-width:768px) {
  .p-casestudy-single__postContent .c-link-card__textWrap,
  .p-single__content .c-link-card__textWrap {
    gap: 8px;
    inline-size: 100%;
    margin: 32px 0 32px 40px;
    max-inline-size: 643px
  }
}
.p-casestudy-single__postContent .c-link-card__title,
.p-single__content .c-link-card__title {
  color: var(--post-text-color);
  display: -webkit-box;
  font-size: 1.8rem;
  line-height: 150%;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  margin: 0;
  overflow: hidden;
  padding: 0;
  text-overflow: ellipsis
}
@media screen and (min-width:768px) {
  .p-casestudy-single__postContent .c-link-card__title,
  .p-single__content .c-link-card__title {
    -webkit-line-clamp: 1;
    font-size: 1.6rem;
    line-height: 180%
  }
}
.p-casestudy-single__postContent .c-link-card__title::before,
.p-single__content .c-link-card__title::before {
  content: none
}
.p-casestudy-single__postContent .c-link-card__excerpt,
.p-single__content .c-link-card__excerpt {
  color: var(--dark-gray);
  display: -webkit-box;
  font-size: 1.3rem;
  line-height: 180%;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  margin: 0;
  overflow: hidden;
  padding: 0;
  text-overflow: ellipsis
}
@media screen and (min-width:768px) {
  .p-casestudy-single__postContent .c-link-card__excerpt,
  .p-single__content .c-link-card__excerpt {
    font-size: 1.2rem
  }
}
.p-casestudy-single__postContent .c-link-card__url-wrapper,
.p-single__content .c-link-card__url-wrapper {
  align-items: center;
  display: flex;
  gap: 8px
}
@media screen and (min-width:768px) {
  .p-casestudy-single__postContent .c-link-card__url-wrapper,
  .p-single__content .c-link-card__url-wrapper {
    margin-block-start: 8px
  }
}
.p-casestudy-single__postContent .c-link-card__url,
.p-single__content .c-link-card__url {
  color: var(--dark-gray);
  display: -webkit-box;
  font-size: 1.3rem;
  line-height: 180%;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  margin: 0;
  overflow: hidden;
  padding: 0;
  text-overflow: ellipsis
}
@media screen and (min-width:768px) {
  .p-casestudy-single__postContent .c-link-card__url,
  .p-single__content .c-link-card__url {
    font-size: 1.2rem
  }
}
.p-casestudy-single__postContent .c-link-card__favicon,
.p-single__content .c-link-card__favicon {
  aspect-ratio: 1;
  display: block;
  flex-shrink: 0;
  inline-size: 25px
}
.p-casestudy-single__postContent .c-link-card__link {
  background: var(--white)
}
.p-single__content .c-link-card__link {
  background: var(--base-color)
}
.p-about-philosophy {
  inline-size: 100%;
  padding-block-end: clamp(6rem,4.514rem + 3.81vw,10rem)
}
@media screen and (min-width:768px) {
  .p-about-philosophy__inner {
    padding: 0 0 0 40px!important
  }
}
.p-about-philosophy__contents {
  display: flex;
  flex-direction: column;
  gap: 56px;
  position: relative
}
@media screen and (min-width:768px) {
  .p-about-philosophy__contents {
    align-items: flex-start;
    flex-direction: row;
    gap: 40px;
    justify-content: space-between
  }
}
.p-about-philosophy__textWrap {
  display: flex;
  flex-direction: column;
  gap: 48px
}
@media screen and (min-width:768px) {
  .p-about-philosophy__text {
    max-inline-size: 52.0833333333vw
  }
}
@media screen and (min-width:1024px) {
  .p-about-philosophy__text {
    max-inline-size: 415px
  }
}
.p-about-philosophy__img {
  aspect-ratio: 390/280;
  inline-size: 100vw;
  margin-inline: calc(50% - 50vw);
  overflow: hidden
}
@media screen and (min-width:768px) {
  .p-about-philosophy__img {
    aspect-ratio: 608/479;
    inline-size: 42.2222222222vw;
    margin-inline: revert;
    max-inline-size: 608px
  }
}
.p-about-philosophy__img picture {
  block-size: 100%;
  display: block;
  inline-size: 100%;
  -o-object-fit: cover;
  object-fit: cover
}
.p-about-philosophy__items {
  display: flex;
  flex-direction: column;
  gap: 53px;
  margin-block-start: clamp(6.4rem,5.211rem + 3.048vw,9.6rem);
  max-inline-size: 1048px;
  position: relative
}
@media screen and (min-width:768px) {
  .p-about-philosophy__items {
    align-items: stretch;
    flex-direction: row;
    gap: 40px;
    justify-content: space-between
  }
  .p-about-philosophy__items::before {
    background-color: var(--line-color);
    bottom: 0;
    content: "";
    inline-size: 1px;
    left: 50%;
    position: absolute;
    top: 0;
    translate: -50%
  }
}
.p-about-philosophy__item {
  display: flex;
  flex-direction: column;
  gap: 16px
}
@media screen and (min-width:768px) {
  .p-about-philosophy__item {
    gap: 24px
  }
}
.p-about-philosophy__item--titleWrap {
  display: flex;
  flex-direction: column;
  gap: 12px
}
@media screen and (min-width:768px) {
  .p-about-philosophy__item--titleWrap {
    gap: 16px
  }
}
.p-about-philosophy__item--heading {
  font-size: clamp(2.8rem,2.651rem + .381vw,3.2rem);
  line-height: 150%
}
.p-about-philosophy__item--text {
  max-inline-size: 438px
}
.p-about-photo {
  border-block-start: 1px solid var(--line-color);
  overflow: hidden;
  padding-block: clamp(6.4rem,5.806rem + 1.524vw,8rem);
  perspective: 1000px;
  position: relative;
  transform: translateZ(0)
}
.p-about-photo__img {
  animation: loopImg 2000s linear infinite;
  backface-visibility: hidden;
  background-image: url(../img/about/about-photo-sp.png);
  background-image: -webkit-image-set(url(../img/about/about-photo-sp.webp) type("image/webp"), url(../img/about/about-photo-sp.png) type("image/png"));
  background-image: image-set(url(../img/about/about-photo-sp.webp) type("image/webp"), url(../img/about/about-photo-sp.png) type("image/png"));
  background-position: left center;
  background-repeat: repeat-x;
  background-size: auto 234px;
  block-size: 234px;
  transform: translateZ(0)
}
.p-about-photo__img.is-visible {
  will-change: background-position
}
@media screen and (min-width:1024px) {
  .p-about-photo__img {
    background-image: url(../img/about/about-photo.png);
    background-image: -webkit-image-set(url(../img/about/about-photo.webp) type("image/webp"), url(../img/about/about-photo.png) type("image/png"));
    background-image: image-set(url(../img/about/about-photo.webp) type("image/webp"), url(../img/about/about-photo.png) type("image/png"));
    background-size: auto 489px;
    block-size: 489px
  }
}
@keyframes loopImg {
  0% {
    background-position: left 0 center
  }
  100% {
    background-position: left -100000px center
  }
}
.p-about-why {
  background: var(--bg-gray);
  inline-size: 100%;
  padding-block: clamp(6.4rem,.457rem + 15.238vw,22.4rem);
  position: relative
}
.p-about-why::after {
  content: "";
  position: absolute;
  -webkit-mask-image: url(../img/common/about-otogi-logo-sp.svg);
  mask-image: url(../img/common/about-otogi-logo-sp.svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  aspect-ratio: 390/258;
  background: var(--base-color);
  block-size: 66.1538461538vw;
  bottom: -5px;
  inline-size: 100%;
  mask-size: contain;
  right: 0;
  z-index: 1
}
@media screen and (min-width:768px) {
  .p-about-why::after {
    -webkit-mask-image: url(../img/common/about-otogi-logo.svg);
    aspect-ratio: 1475/261;
    block-size: 18.125vw;
    bottom: -5px;
    inline-size: 102.4305555556vw;
    left: -2.4305555556vw;
    mask-image: url(../img/common/about-otogi-logo.svg);
    right: revert
  }
}
.p-about-why__contents {
  display: flex;
  flex-direction: column
}
@media screen and (min-width:768px) {
  .p-about-why__contents {
    flex-direction: row;
    gap: 40px;
    justify-content: space-between
  }
}
.p-about-why__title {
  flex-shrink: 0;
  line-height: 130%;
  text-transform: capitalize
}
.p-about-why__textWrap {
  display: flex;
  flex-direction: column;
  gap: 32px;
  margin-block-start: -11px
}
@media screen and (min-width:768px) {
  .p-about-why__textWrap {
    gap: 24px;
    margin-block-start: 0;
    max-inline-size: 544px
  }
}
.p-about-why__lead {
  font-size: clamp(2rem,1.554rem + 1.143vw,3.2rem);
  line-height: 210%
}
.p-about-why__text {
  font-size: 1.4rem;
  line-height: 210%;
  z-index: 2
}
@media screen and (min-width:1920px) {
  .p-about-why__text {
    font-size: 1.6rem
  }
}
.p-about-why__text p + p {
  margin-block-start: 26px
}
@media screen and (min-width:768px) {
  .p-about-why__text p + p {
    margin-block-start: 28px
  }
}
.p-about-member {
  padding-block: clamp(6.4rem,2.983rem + 8.762vw,15.6rem)
}
.p-about-member__line {
  background-color: var(--line-color);
  block-size: 1px;
  inline-size: 100%
}
.p-about-member__title {
  font-family: var(--font-en);
  font-optical-sizing: auto;
  font-size: clamp(4.8rem,2.423rem + 6.095vw,11.2rem);
  font-style: normal;
  font-weight: 400;
  grid-area: title;
  letter-spacing: -.02em;
  line-height: 0;
  line-height: 100%;
  padding-block: 30px 25px;
  padding-inline: 6.154vw;
  position: relative;
  text-transform: uppercase
}
@media screen and (min-width:768px) {
  .p-about-member__title {
    padding-block: 40px 25px;
    padding-inline: 0;
    text-align: center
  }
}
.p-about-member__lists {
  align-items: stretch;
  display: grid;
  grid-template-columns: repeat(2,1fr);
  inline-size: 100vw;
  margin-inline: calc(50% - 50vw);
  position: relative
}
@media screen and (min-width:768px) {
  .p-about-member__lists {
    border-inline: 1px solid var(--line-color);
    grid-template-columns: repeat(4,1fr)
  }
}
@media screen and (min-width:1024px) {
  .p-about-member__lists {
    grid-template-columns: repeat(4,minmax(0,246px));
    inline-size: 100%;
    margin-inline: revert;
    max-inline-size: 980px
  }
}
.l-modal__open-btn {
  position: relative
}
.l-modal__open-btn .p-about-member__img {
  aspect-ratio: 195/253;
  position: relative;
  z-index: 1
}
.l-modal__open-btn .p-about-member__arrowWrap {
  bottom: 13px;
  right: 9px
}
@media screen and (max-width:767px) {
  .l-modal__open-btn {
    min-block-size: 87.9487179487vw
  }
  .l-modal__open-btn[data-sp-image-type=tall] .p-about-member__img {
    aspect-ratio: 195/253
  }
  .l-modal__open-btn[data-sp-image-type=tall] .p-about-member__arrowWrap {
    bottom: 13px;
    right: 9px
  }
  .l-modal__open-btn[data-sp-image-type=wide] .p-about-member__img {
    aspect-ratio: 195/180
  }
  .l-modal__open-btn[data-sp-image-type=wide] .p-about-member__arrowWrap {
    bottom: 22.821vw;
    right: 2.051vw
  }
  .l-modal__open-btn.sp-left-line::before {
    background-color: var(--line-color);
    block-size: calc(100% * var(--sp-line-rows,1));
    content: "";
    inline-size: 1px;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 2
  }
}
@media screen and (max-width:767px) and (min-width:768px) {
  .l-modal__open-btn.sp-left-line::before {
    display: none
  }
}
@media screen and (max-width:767px) {
  .l-modal__open-btn.sp-row-top-line::after {
    background-color: var(--line-color);
    block-size: 1px;
    content: "";
    inline-size: 200%;
    left: 0;
    position: absolute;
    top: 0;
    z-index: 2
  }
}
@media screen and (max-width:767px) and (min-width:768px) {
  .l-modal__open-btn.sp-row-top-line::after {
    display: none
  }
}
@media screen and (min-width:768px) {
  .l-modal__open-btn {
    min-block-size: 424px
  }
  .l-modal__open-btn .p-about-member__img {
    aspect-ratio: 195/253
  }
  .l-modal__open-btn .p-about-member__arrowWrap {
    bottom: 24px;
    right: 11px
  }
  .l-modal__open-btn[data-pc-image-type=tall] .p-about-member__img {
    aspect-ratio: 195/253!important
  }
  .l-modal__open-btn[data-pc-image-type=tall] .p-about-member__arrowWrap {
    bottom: 24px!important;
    right: 11px!important
  }
  .l-modal__open-btn[data-pc-image-type=wide] .p-about-member__img {
    aspect-ratio: 195/180!important
  }
  .l-modal__open-btn[data-pc-image-type=wide] .p-about-member__arrowWrap {
    bottom: 115px!important;
    right: 11px!important
  }
}
@media screen and (min-width:768px) {
  .l-modal__open-btn.pc-col-1::after,
  .l-modal__open-btn.pc-col-2::after,
  .l-modal__open-btn.pc-col-3::after {
    background-color: var(--line-color);
    block-size: calc(100% * var(--pc-line-rows,1));
    content: "";
    inline-size: 1px;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 2
  }
  .l-modal__open-btn.pc-row-top-line::before {
    background-color: var(--line-color);
    block-size: 1px;
    content: "";
    inline-size: 100vw;
    left: 0;
    position: absolute;
    top: 0;
    z-index: 2
  }
}
.p-about-member__img {
  display: block;
  flex-shrink: 0;
  inline-size: 100%;
  overflow: hidden;
  position: relative
}
.p-about-member__img img {
  block-size: 100%;
  inline-size: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: top center;
  object-position: top center;
  transition: scale var(--hover-transition) cubic-bezier(.83,0,.17,1) 0s;
  will-change: scale
}
.modalOpen {
  align-items: stretch;
  block-size: 100%;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  gap: 1.538vw;
  position: relative
}
@media screen and (min-width:768px) {
  .modalOpen {
    gap: 8px
  }
}
.modalOpen:focus-visible {
  opacity: var(--opacity-06)
}
@media (any-hover:hover) {
  .modalOpen:hover .p-about-member__img img {
    scale: 1.04
  }
  .modalOpen:hover .c-arrow {
    opacity: 0;
    transform: translate(10px,-10px) rotate(-45deg)
  }
  .modalOpen:hover .c-arrow.--hover {
    opacity: 1;
    transform: translate(0,0) rotate(-45deg)
  }
}
.p-about-member__infoWrap {
  align-items: flex-start;
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: .769vw;
  justify-content: flex-start;
  padding-inline: 13px;
  position: relative
}
@media screen and (min-width:768px) {
  .p-about-member__infoWrap {
    gap: 4px;
    padding-inline: 16px
  }
}
.p-about-member__position {
  font-size: 1.2rem;
  inline-size: 100%;
  line-height: 150%;
  text-align: left;
  white-space: normal
}
.p-about-member__name {
  font-size: clamp(1.8rem,1.726rem + .19vw,2rem);
  line-height: 100%
}
.p-about-member__arrowWrap {
  aspect-ratio: 20/16;
  inline-size: 18px;
  overflow: hidden;
  position: absolute
}
@media screen and (min-width:768px) {
  .p-about-member__arrowWrap {
    inline-size: 24px
  }
}
.l-modal {
  align-items: flex-start;
  background-color: rgba(0,0,0,.6);
  block-size: 100vh;
  display: flex;
  inline-size: 100%;
  justify-content: center;
  left: 0;
  opacity: 0;
  pointer-events: none;
  position: fixed;
  top: 0;
  transition: opacity var(--hover-transition);
  z-index: 9999
}
@media screen and (min-width:768px) {
  .l-modal {
    align-items: center;
    padding-block: 0
  }
}
.l-modal.is-active {
  opacity: 1;
  pointer-events: auto
}
.l-modal__overlay {
  block-size: 100%;
  cursor: pointer;
  inline-size: 100%;
  position: absolute;
  z-index: 1
}
.l-modal__wrap {
  display: flex;
  flex-direction: column;
  inline-size: calc(100vw - 48px);
  left: 50%;
  max-block-size: calc(100vh - 48px);
  max-block-size: calc(100dvh - 48px);
  max-inline-size: 480px;
  position: fixed;
  top: 24px;
  translate: -50% 0;
  z-index: 2
}
@media screen and (min-width:1024px) {
  .l-modal__wrap {
    inline-size: revert;
    max-block-size: calc(100vh - 80px);
    max-block-size: calc(100dvh - 80px);
    max-inline-size: 1120px;
    top: 50%;
    translate: -50% -50%
  }
}
.l-modal__inner {
  align-items: flex-start;
  display: flex;
  flex: 1;
  inline-size: 87.692vw;
  justify-content: flex-start;
  margin-inline: auto;
  max-inline-size: 480px;
  overflow-y: auto
}
@media screen and (min-width:1024px) {
  .l-modal__inner {
    max-inline-size: 1120px
  }
}
.l-modal__close-btn-head {
  aspect-ratio: 1;
  inline-size: 24px;
  margin-inline: auto 8px;
  padding-block-end: 45px;
  position: relative;
  -webkit-mask-image: url(../img/common/icon-cross.svg);
  mask-image: url(../img/common/icon-cross.svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  background: var(--white);
  cursor: pointer;
  mask-size: contain;
  transition: opacity var(--hover-transition) cubic-bezier(.83,0,.17,1);
  z-index: 10
}
@media screen and (min-width:1024px) {
  .l-modal__close-btn-head {
    display: none
  }
}
.l-modal__close-btn-head:focus-visible {
  opacity: var(--opacity-06)
}
@media (any-hover:hover) {
  .l-modal__close-btn-head:hover {
    opacity: var(--opacity-06)
  }
}
.l-modal__swiper .swiper-slide {
  block-size: auto
}
.l-modal__contents {
  display: flex;
  flex-direction: column;
  inline-size: 100%;
  overflow: hidden
}
@media screen and (min-width:1024px) {
  .l-modal__contents {
    flex-direction: row
  }
}
.l-modal__body {
  align-items: stretch;
  background: var(--white);
  block-size: 100%;
  display: flex;
  flex-direction: column;
  inline-size: 100%
}
@media screen and (min-width:1024px) {
  .l-modal__body {
    flex-direction: row
  }
}
.l-modal__img {
  aspect-ratio: 342/420;
  inline-size: 100%;
  overflow: hidden
}
@media screen and (min-width:1024px) {
  .l-modal__img {
    aspect-ratio: 480/590;
    flex: 42.85%;
    max-inline-size: 480px
  }
}
.l-modal__textWrap {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 32px;
  padding: 32px 24px
}
@media screen and (min-width:1024px) {
  .l-modal__textWrap {
    flex: 52.23%;
    padding: 40px 32px
  }
}
@media screen and (min-width:1280px) {
  .l-modal__textWrap {
    gap: clamp(1.6rem,.411rem + 3.048vw,4.8rem);
    padding: clamp(3.2rem,1.343rem + 4.762vw,8.2rem) clamp(2.4rem,.691rem + 4.381vw,7rem)
  }
}
.l-modal__nameWrap {
  display: flex;
  flex-direction: column;
  gap: 8px
}
@media screen and (min-width:1024px) {
  .l-modal__nameWrap {
    align-items: baseline
  }
}
.l-modal__position {
  font-size: clamp(1.2rem,1.126rem + .19vw,1.4rem);
  line-height: 150%;
  text-align: left;
  white-space: normal
}
.l-modal__name {
  font-size: clamp(2.4rem,2.103rem + .762vw,3.2rem);
  line-height: 100%
}
.l-modal__info {
  display: flex;
  flex-direction: column;
  gap: clamp(1.6rem,1.303rem + .762vw,2.4rem)
}
.l-modal__infoTitle {
  color: var(--gray);
  font-family: var(--font-en);
  font-optical-sizing: auto;
  font-size: 1.3rem;
  font-style: normal;
  font-weight: 400;
  letter-spacing: -.26px;
  line-height: 0;
  line-height: 100%;
  text-transform: uppercase
}
@media screen and (min-width:1920px) {
  .l-modal__infoTitle {
    font-size: 1.5rem
  }
}
.l-modal__identityWrap {
  display: flex;
  flex-direction: column;
  gap: 8px
}
.l-modal__identityText {
  font-size: clamp(2rem,1.851rem + .381vw,2.4rem);
  line-height: 150%
}
.l-modal__profileWrap {
  display: flex;
  flex-direction: column;
  gap: 8px
}
.l-modal__profileText {
  font-size: 1.4rem;
  line-height: 210%
}
@media screen and (min-width:1920px) {
  .l-modal__profileText {
    font-size: 1.6rem
  }
}
.l-modal__controls {
  align-items: center;
  background: var(--white);
  border-block-start: 1px solid var(--line-color);
  display: flex;
  justify-content: space-between
}
@media screen and (min-width:1024px) {
  .l-modal__controls {
    border-block-start: none;
    border-inline-start: 1px solid var(--line-color);
    flex-direction: column
  }
}
.l-modal__nav {
  align-items: center;
  display: flex;
  inline-size: -moz-fit-content;
  inline-size: fit-content;
  position: relative
}
@media screen and (min-width:1024px) {
  .l-modal__nav {
    flex-direction: column;
    order: 2
  }
}
.l-modal__nav::after,
.l-modal__nav::before {
  background-color: var(--line-color);
  bottom: 0;
  content: "";
  inline-size: 1px;
  position: absolute;
  top: 0;
  z-index: 1
}
.l-modal__nav::before {
  left: 50%;
  translate: -50%
}
@media screen and (min-width:1024px) {
  .l-modal__nav::before {
    block-size: 1px;
    inline-size: 100%;
    left: 0;
    translate: revert
  }
}
.l-modal__nav::after {
  right: 0
}
@media screen and (min-width:1024px) {
  .l-modal__nav::after {
    block-size: 1px;
    inline-size: 100%;
    right: revert;
    top: 50%;
    translate: 0 -50%
  }
}
.l-modal__next,
.l-modal__prev {
  block-size: 68px;
  display: block;
  inline-size: 68px;
  position: relative;
  -webkit-mask-image: url(../img/common/icon-arrow-btn.svg);
  mask-image: url(../img/common/icon-arrow-btn.svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  background: var(--text-color);
  mask-size: contain;
  transition: opacity var(--hover-transition) cubic-bezier(.83,0,.17,1)
}
.l-modal__next:focus-visible,
.l-modal__prev:focus-visible {
  opacity: var(--opacity-06)
}
@media (any-hover:hover) {
  .l-modal__next:hover,
  .l-modal__prev:hover {
    opacity: var(--opacity-06)
  }
}
.l-modal__next {
  left: 0!important;
  rotate: 180deg
}
.l-modal__close-btnWrap {
  aspect-ratio: 1;
  cursor: pointer;
  display: block;
  inline-size: 68px;
  position: relative;
  transition: opacity var(--hover-transition) cubic-bezier(.83,0,.17,1)
}
@media screen and (min-width:1024px) {
  .l-modal__close-btnWrap {
    order: 1
  }
}
.l-modal__close-btnWrap::before {
  background: var(--line-color);
  block-size: 100%;
  content: "";
  inline-size: 1px;
  left: 0;
  position: absolute;
  top: 0;
  z-index: 2
}
@media screen and (min-width:1024px) {
  .l-modal__close-btnWrap::before {
    block-size: 1px;
    bottom: 0;
    inline-size: 100%;
    top: revert
  }
}
.l-modal__close-btnWrap:focus-visible {
  opacity: var(--opacity-06)
}
@media (any-hover:hover) {
  .l-modal__close-btnWrap:hover {
    opacity: var(--opacity-06)
  }
}
.l-modal__close-btn {
  block-size: 100%;
  display: block;
  inline-size: 100%;
  -webkit-mask-image: url(../img/common/icon-cross-btn.svg);
  mask-image: url(../img/common/icon-cross-btn.svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  background: var(--text-color);
  mask-size: contain;
  z-index: 1
}
body.l-modal-open {
  block-size: 100%;
  inline-size: 100%;
  left: 0;
  overflow: hidden;
  position: fixed;
  top: 0
}
.p-about-greeting {
  background: var(--bg-gray);
  inline-size: 100%;
  padding-block-end: clamp(6.4rem,2.834rem + 9.143vw,16rem);
  position: relative
}
.p-about-greeting__inner {
  max-inline-size: revert;
  padding: 0 0 0 24px!important
}
@media screen and (min-width:768px) {
  .p-about-greeting__inner {
    padding: 0 0 0 40px!important
  }
}
@media screen and (min-width:1920px) {
  .p-about-greeting__inner {
    max-inline-size: 1200px
  }
}
.p-about-greeting__contents {
  display: flex;
  flex-direction: column;
  gap: clamp(2rem,1.257rem + 1.905vw,4rem)
}
@media screen and (min-width:768px) {
  .p-about-greeting__contents {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    max-inline-size: 1140px
  }
}
.p-about-greeting__imgWrap {
  display: flex;
  flex-direction: column;
  gap: clamp(2.4rem,.914rem + 3.81vw,6.4rem);
  padding-block-end: 6.1538461538vw;
  position: relative
}
@media screen and (min-width:768px) {
  .p-about-greeting__imgWrap {
    order: 2;
    padding-block-end: 0
  }
}
.p-about-greeting__imgWrap::after {
  background-color: var(--line-color);
  block-size: 1px;
  bottom: 0;
  content: "";
  inline-size: 100vw;
  left: 0;
  margin-inline: calc(50% - 50vw);
  position: absolute;
  z-index: 1
}
@media screen and (min-width:768px) {
  .p-about-greeting__imgWrap::after {
    background-color: var(--line-color);
    block-size: calc(100% + clamp(6.4rem,2.834rem + 9.143vw,16rem));
    bottom: revert;
    inline-size: 1px;
    margin-inline: revert;
    top: 0
  }
}
.p-about-greeting__img {
  aspect-ratio: 303/363;
  block-size: auto;
  inline-size: 77.6923076923vw;
  margin-inline-start: auto;
  overflow: hidden;
  position: relative
}
@media screen and (min-width:768px) {
  .p-about-greeting__img {
    aspect-ratio: 542/715;
    inline-size: 37.6388888889vw;
    max-inline-size: 542px
  }
}
@media screen and (min-width:1280px) {
  .p-about-greeting__img {
    margin-inline: auto 0;
    max-inline-size: 542px
  }
}
.p-about-greeting__img picture {
  block-size: 100%;
  display: block;
  inline-size: 100%;
  -o-object-fit: cover;
  object-fit: cover
}
.p-about-greeting__nameWrap {
  margin-inline-start: auto;
  padding-inline-end: 24px;
  padding-inline-start: clamp(2.4rem,1.509rem + 2.286vw,4.8rem)
}
@media screen and (min-width:768px) {
  .p-about-greeting__nameWrap {
    margin-inline-start: 0;
    order: 1
  }
}
.p-about-greeting__degree {
  text-align: right
}
@media screen and (min-width:768px) {
  .p-about-greeting__degree {
    text-align: left
  }
}
.p-about-greeting__name {
  font-size: clamp(2.8rem,2.651rem + .381vw,3.2rem);
  line-height: 180%;
  margin-block-start: -4px
}
@media screen and (min-width:768px) {
  .p-about-greeting__name {
    margin-block-start: 0
  }
}
.p-about-greeting__textWrap {
  display: flex;
  flex-direction: column;
  gap: 24px;
  margin-block-start: clamp(2.4rem,-4.063rem + 16.571vw,19.8rem);
  max-inline-size: 498px;
  padding-inline-end: 24px
}
@media screen and (min-width:768px) {
  .p-about-greeting__textWrap {
    padding-inline-end: 0
  }
}
.p-about-greeting__titleWrap {
  display: flex;
  flex-direction: column;
  gap: clamp(.8rem,.503rem + .762vw,1.6rem)
}
.p-about-greeting__heading {
  font-size: clamp(2.4rem,2.103rem + .762vw,3.2rem);
  line-height: 180%
}
@media screen and (min-width:768px) {
  .p-about-greeting__heading {
    line-height: 150%
  }
}
.p-contact {
  inline-size: 100%;
  margin-inline: auto;
  padding-block: clamp(5.7rem,3.36rem + 6vw,12rem) clamp(8rem,6.514rem + 3.81vw,12rem)
}
.p-contact__contents {
  display: flex;
  flex-direction: column;
  gap: 56px
}
@media screen and (min-width:1024px) {
  .p-contact__contents {
    flex-direction: row;
    gap: 40px;
    justify-content: space-between
  }
}
.p-contact-flow {
  display: flex;
  flex-direction: column;
  gap: clamp(3.9rem,2.971rem + 2.381vw,6.4rem);
  inline-size: 100%
}
@media screen and (min-width:768px) {
  .p-contact-flow {
    margin-inline: auto;
    max-inline-size: 640px
  }
}
@media screen and (min-width:1024px) {
  .p-contact-flow {
    margin-inline: revert;
    max-inline-size: 354px
  }
}
.p-contact-flow.--thanks {
  margin-inline: auto
}
.p-contact-flow__text .--red {
  color: var(--red);
  padding-inline-start: 4px
}
.p-contact-flow__steps {
  align-items: center;
  display: flex;
  gap: 50px;
  justify-content: center
}
@media screen and (min-width:768px) {
  .p-contact-flow__steps {
    gap: 56px
  }
}
.p-contact-flow__step {
  position: relative
}
.p-contact-flow__step:not(:first-child)::after {
  content: "";
  display: block;
  position: absolute;
  -webkit-mask-image: url(../img/common/dot-arrow.svg);
  mask-image: url(../img/common/dot-arrow.svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  aspect-ratio: 38/10;
  background: var(--line-color);
  inline-size: 38px;
  left: -46px;
  mask-size: contain;
  top: 50%;
  translate: 0 -50%
}
.p-contact-flow__step.is-current:after {
  background: var(--text-color)
}
.p-contact-flow__step.is-current .p-contact-flow__circle {
  color: var(--text-color)
}
.p-contact-flow__circle {
  align-items: center;
  aspect-ratio: 1;
  border: 1px solid;
  border-radius: calc(infinity * 1px);
  color: var(--line-color);
  display: flex;
  font-size: 1.4rem;
  inline-size: 80px;
  justify-content: center;
  line-height: 180%;
  transition: all var(--hover-transition)
}
.p-contact__form {
  display: flex;
  flex-direction: column;
  gap: clamp(4rem,3.034rem + 2.476vw,6.6rem);
  max-inline-size: 640px
}
@media screen and (min-width:768px) {
  .p-contact__form {
    margin-inline: auto
  }
}
.p-contact__formWrap {
  display: flex;
  flex-direction: column;
  gap: 16px
}
@media screen and (min-width:1024px) {
  .p-contact__formWrap {
    gap: 38px
  }
}
.p-contact__footerWrap {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: clamp(1.6rem,1.303rem + .762vw,2.4rem)
}
.p-contact__row {
  display: grid;
  gap: 4px;
  overflow: hidden;
  transition: opacity var(--hover-transition) cubic-bezier(.83,0,.17,1),height var(--hover-transition) cubic-bezier(.83,0,.17,1)
}
@media screen and (min-width:1024px) {
  .p-contact__row {
    align-items: flex-start;
    gap: 8px;
    grid-template-columns: min(175px,26%) 1fr
  }
}
.p-contact__row.--aifs {
  align-items: flex-start
}
@media screen and (max-width:767px) {
  .p-contact__row.--textarea {
    margin-block-start: 18px
  }
}
.p-contact__row.is-hidden {
  gap: 0;
  height: 0;
  margin: 0;
  opacity: 0;
  padding: 0
}
.p-contact__data span {
  inline-size: 100%
}
.p-contact__data.--address {
  display: flex;
  flex-direction: column;
  gap: 5px
}
@media screen and (min-width:768px) {
  .p-contact__data.--address {
    gap: 10px
  }
}
.p-contact__zipWrap {
  align-items: flex-start;
  display: flex;
  gap: 8px
}
.p-contact__zipWrap .wpcf7-form-control-wrap {
  inline-size: clamp(12.1rem,10.391rem + 4.381vw,16.7rem)
}
.p-contact__zipWrap .zip-mark {
  color: var(--dark-gray);
  font-size: 1.5rem;
  inline-size: -moz-fit-content;
  inline-size: fit-content;
  letter-spacing: .05em;
  padding-block: 7px
}
.p-contact__zipWrap button {
  background: var(--line-color);
  block-size: 30px;
  border-radius: 4px;
  color: var(--dark-gray);
  font-size: 1.5rem;
  letter-spacing: .05em;
  margin: 3px 0 3px 8px;
  padding-block-end: 2px;
  padding-inline: 12px;
  transition: opacity var(--hover-transition) cubic-bezier(.83,0,.17,1)
}
.p-contact__zipWrap button:focus-visible {
  opacity: var(--opacity-06)
}
@media (any-hover:hover) {
  .p-contact__zipWrap button:hover {
    opacity: var(--opacity-06)
  }
}
.p-contact__head {
  color: var(--dark-gray);
  font-size: 1.5rem;
  letter-spacing: .05em;
  padding-block: 7px;
  position: relative
}
@media screen and (max-width:1023px) {
  .p-contact__head span.--must {
    display: inline-block;
    padding-inline-start: 11px;
    position: relative
  }
  .p-contact__head span.--must::after {
    color: var(--red);
    content: "*";
    display: inline-block;
    font-size: 1.2rem;
    left: 0;
    letter-spacing: .2em;
    position: absolute;
    top: calc(50% - 5px);
    translate: 0 -50%;
    white-space: nowrap
  }
}
@media screen and (max-width:1023px) and (min-width:1024px) {
  .p-contact__head span.--must::after {
    top: calc(50% + 5px)
  }
}
@media screen and (min-width:1024px) {
  .p-contact__head.--must::after {
    color: var(--red);
    content: "*";
    display: inline-block;
    font-size: 1.2rem;
    font-weight: 700;
    line-height: normal;
    position: absolute;
    right: 0;
    top: calc(50% - 5px);
    translate: 0 -50%;
    white-space: nowrap
  }
}
input[type=email],
input[type=number],
input[type=tel],
input[type=text],
select,
textarea {
  background: var(--white);
  border: none;
  border: 1px solid transparent;
  border-radius: 0;
  font-family: var(--font-ja);
  font-size: 1.5rem;
  font-weight: 500;
  inline-size: 100%;
  letter-spacing: .7px;
  line-height: normal;
  outline: 0;
  padding: 6px 14px;
  transition: border var(--hover-transition) cubic-bezier(.83,0,.17,1) 0s
}
input[type=email]::-moz-placeholder,
input[type=number]::-moz-placeholder,
input[type=tel]::-moz-placeholder,
input[type=text]::-moz-placeholder,
select::-moz-placeholder,
textarea::-moz-placeholder {
  color: #ccc
}
input[type=email]::placeholder,
input[type=number]::placeholder,
input[type=tel]::placeholder,
input[type=text]::placeholder,
select::placeholder,
textarea::placeholder {
  color: #ccc
}
input[type=email]:focus-visible,
input[type=number]:focus-visible,
input[type=tel]:focus-visible,
input[type=text]:focus-visible,
select:focus-visible,
textarea:focus-visible {
  border: 1px solid var(--text-color)
}
@media (any-hover:hover) {
  input[type=email]:hover,
  input[type=number]:hover,
  input[type=tel]:hover,
  input[type=text]:hover,
  select:hover,
  textarea:hover {
    border: 1px solid var(--text-color)
  }
}
textarea {
  --_min-rows: 7;
  --_max-rows: 20;
  --_padding: 6px 14px;
  inline-size: 100%;
  line-height: 160%;
  max-block-size: calc(var(--_max-rows) * 1lh + 28px);
  min-block-size: calc(var(--_min-rows) * 1lh + 12px);
  padding: 6px 14px;
  field-sizing: content
}
@supports (field-sizing:content) {
  textarea {
    resize: none
  }
}
input[type=checkbox] {
  display: inline flow-root;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none
}
input[type=checkbox]:focus + span::before {
  outline: auto var(--text-color);
  outline-offset: 1px
}
input[type=checkbox]:checked + span::after {
  opacity: 1
}
.p-contact__data-checkbox span.wpcf7-list-item {
  margin: 0
}
.p-contact__data-checkbox span.wpcf7-list-item span {
  inline-size: -moz-fit-content;
  inline-size: fit-content
}
.p-contact__data-checkbox span.wpcf7-list-item-label {
  display: inline-block;
  font-size: 1.5rem;
  letter-spacing: .7px;
  line-height: normal;
  padding: 6px 0 6px 24px;
  position: relative
}
.p-contact__data-checkbox span.wpcf7-list-item-label::before {
  background: var(--white);
  block-size: 14px;
  border: 1px solid var(--gray);
  content: "";
  inline-size: 14px;
  left: 0;
  position: absolute;
  top: calc(50% + 1px);
  translate: 0 -50%
}
.p-contact__data-checkbox span.wpcf7-list-item-label::after {
  block-size: 12px;
  border-bottom: 1.5px solid var(--text-color);
  border-right: 1.5px solid var(--text-color);
  content: "";
  inline-size: 6px;
  left: 5px;
  opacity: 0;
  position: absolute;
  rotate: 45deg;
  top: calc(50% - 1px);
  transition: opacity var(--hover-transition) cubic-bezier(.83,0,.17,1);
  translate: 0 -50%
}
input[type=button],
input[type=submit] {
  border-radius: 0;
  -webkit-box-sizing: content-box;
  -webkit-appearance: button;
  -moz-appearance: button;
  appearance: button;
  background: 0 0;
  border: none;
  box-sizing: border-box;
  cursor: pointer
}
input[type=button]::-webkit-search-decoration,
input[type=submit]::-webkit-search-decoration {
  display: none
}
.row.jc-center {
  justify-content: center
}
.p-contact__back,
.p-contact__confirm,
.p-contact__download,
.p-contact__submit {
  cursor: pointer;
  display: inline-block;
  margin-inline: auto;
  position: relative;
  text-align: center
}
.p-contact__back::after,
.p-contact__confirm::after,
.p-contact__download::after,
.p-contact__submit::after {
  content: "";
  position: absolute;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  aspect-ratio: 16/13;
  background: var(--text-color);
  inline-size: 16px;
  mask-size: contain;
  top: 50%;
  transition: transform var(--hover-transition) cubic-bezier(.83,0,.17,1) 0s;
  translate: 0 -50%
}
.p-contact__back:focus-visible::after,
.p-contact__confirm:focus-visible::after,
.p-contact__download:focus-visible::after,
.p-contact__submit:focus-visible::after {
  background: var(--white)
}
@media (any-hover:hover) {
  .p-contact__back:hover::after,
  .p-contact__confirm:hover::after,
  .p-contact__download:hover::after,
  .p-contact__submit:hover::after {
    background: var(--white)
  }
}
.p-contact__back input[type=button],
.p-contact__back input[type=submit],
.p-contact__confirm input[type=button],
.p-contact__confirm input[type=submit],
.p-contact__download input[type=button],
.p-contact__download input[type=submit],
.p-contact__submit input[type=button],
.p-contact__submit input[type=submit] {
  background: var(--base-color);
  border: 1px solid var(--line-color);
  color: var(--text-color);
  display: inline-block;
  font-family: var(--font-ja);
  font-size: 1.5rem;
  font-weight: 500;
  inline-size: clamp(16.3rem,9.651rem + 17.048vw,34.2rem);
  line-height: 180%;
  max-inline-size: 342px;
  padding-block: 15px 16px;
  position: relative;
  transition-duration: var(--hover-transition);
  transition-property: color,background-color;
  transition-timing-function: cubic-bezier(.83,0,.17,1)
}
.p-contact__back input[type=button]:focus-visible,
.p-contact__back input[type=submit]:focus-visible,
.p-contact__confirm input[type=button]:focus-visible,
.p-contact__confirm input[type=submit]:focus-visible,
.p-contact__download input[type=button]:focus-visible,
.p-contact__download input[type=submit]:focus-visible,
.p-contact__submit input[type=button]:focus-visible,
.p-contact__submit input[type=submit]:focus-visible {
  background: var(--text-color);
  color: var(--white);
  outline: 2px solid oklch(60% .4 240deg)
}
@media (any-hover:hover) {
  .p-contact__back input[type=button]:hover,
  .p-contact__back input[type=submit]:hover,
  .p-contact__confirm input[type=button]:hover,
  .p-contact__confirm input[type=submit]:hover,
  .p-contact__download input[type=button]:hover,
  .p-contact__download input[type=submit]:hover,
  .p-contact__submit input[type=button]:hover,
  .p-contact__submit input[type=submit]:hover {
    background: var(--text-color);
    color: var(--white)
  }
}
.p-contact__back:has(input:focus-visible)::after,
.p-contact__confirm:has(input:focus-visible)::after,
.p-contact__submit:has(input:focus-visible)::after {
  background: var(--white)
}
input:focus-visible ~ .p-contact__back::after,
input:focus-visible ~ .p-contact__confirm::after,
input:focus-visible ~ .p-contact__submit::after {
  background: var(--white)
}
.is-focused.p-contact__back::after,
.is-focused.p-contact__confirm::after,
.is-focused.p-contact__submit::after {
  background: var(--white)
}
.p-contact__back,
.p-contact__submit {
  inline-size: 41.795vw
}
@media screen and (min-width:768px) {
  .p-contact__back,
  .p-contact__submit {
    inline-size: min(100%,308px)
  }
}
.p-contact__back input[type=button],
.p-contact__back input[type=submit],
.p-contact__submit input[type=button],
.p-contact__submit input[type=submit] {
  inline-size: 41.795vw
}
@media screen and (min-width:768px) {
  .p-contact__back input[type=button],
  .p-contact__back input[type=submit],
  .p-contact__submit input[type=button],
  .p-contact__submit input[type=submit] {
    inline-size: min(100%,308px)
  }
}
.p-contact__confirm {
  inline-size: 342px
}
.p-contact__confirm::after {
  -webkit-mask-image: url(../img/common/arrow.svg);
  mask-image: url(../img/common/arrow.svg);
  right: 36px
}
.p-contact__confirm input[type=button] {
  inline-size: 342px
}
.p-contact__submit::after {
  -webkit-mask-image: url(../img/common/arrow.svg);
  mask-image: url(../img/common/arrow.svg);
  right: clamp(1.6rem,1.006rem + 1.524vw,3.2rem)
}
.p-contact__back::after {
  -webkit-mask-image: url(../img/common/arrow.svg);
  background: var(--gray);
  left: clamp(1.6rem,1.006rem + 1.524vw,3.2rem);
  mask-image: url(../img/common/arrow.svg);
  rotate: 180deg
}
.p-contact__back input[type=button] {
  border-color: var(--gray);
  color: var(--gray);
  cursor: pointer
}
.p-contact__back input[type=button]:focus-visible {
  background: var(--gray)!important;
  color: var(--white)!important
}
@media (any-hover:hover) {
  .p-contact__back input[type=button]:hover {
    background: var(--gray)!important;
    color: var(--white)!important
  }
}
.p-contact__download::after {
  -webkit-mask-image: url(../img/common/icon-download.svg);
  aspect-ratio: 19/15;
  inline-size: 22px;
  mask-image: url(../img/common/icon-download.svg);
  right: 32%
}
.p-contact__download input[type=submit] {
  background: var(--white);
  font-size: 1.5rem;
  inline-size: 294px;
  line-height: 180%;
  padding-inline-end: 33px
}
@media screen and (min-width:768px) {
  .p-contact__download input[type=submit] {
    inline-size: 334px
  }
}
.p-confirm-btn:disabled {
  background-color: var(--light-gray);
  color: var(--text-color);
  cursor: not-allowed;
  opacity: .6
}
.p-confirm-btn:disabled::after {
  background: var(--gray)
}
.p-contact__btnWrap {
  display: flex;
  flex-direction: column;
  gap: 16px
}
.p-contact__btnWrap.--document {
  gap: 10px
}
@media screen and (min-width:768px) {
  .p-contact__btnWrap.--document {
    gap: 16px
  }
}
.p-contact__btnText {
  color: var(--dark-gray);
  font-size: 1.1rem;
  letter-spacing: .55px;
  line-height: 150%;
  text-align: center
}
.p-contact__acceptance {
  font-size: 1.3rem;
  grid-template-columns: revert;
  letter-spacing: .7px;
  line-height: 25px;
  place-content: center;
  position: relative
}
.p-contact__acceptance .wpcf7-list-item-label {
  color: var(--dark-gray)!important;
  font-size: 1.3rem!important
}
.p-contact__acceptance::before {
  color: var(--red);
  content: "*";
  display: inline-block;
  font-size: 1.2rem;
  font-weight: 700;
  left: -12px;
  letter-spacing: 2em;
  line-height: normal;
  position: absolute;
  top: calc(50% - 2px);
  translate: 0 -50%;
  white-space: nowrap
}
@media screen and (min-width:768px) {
  .p-contact__acceptance::before {
    left: -14px
  }
}
.p-contact__date--link {
  display: inline-block;
  text-decoration: underline;
  transition: opacity var(--hover-transition) cubic-bezier(.83,0,.17,1) 0s
}
.p-contact__date--link:focus-visible {
  opacity: var(--opacity-06)
}
@media (any-hover:hover) {
  .p-contact__date--link:hover {
    opacity: var(--opacity-06);
    -webkit-text-decoration: revert;
    text-decoration: revert
  }
}
.p-confirm-area {
  display: none;
  inline-size: 100%;
  max-inline-size: 640px;
  padding-block: 2px
}
@media screen and (min-width:768px) {
  .p-confirm-area {
    margin-inline: auto
  }
}
@media screen and (min-width:1024px) {
  .p-confirm-area {
    inline-size: 53.90625vw
  }
}
.p-confirm-area .p-contact__row {
  gap: 10px
}
@media screen and (min-width:768px) {
  .p-confirm-area .p-contact__row {
    gap: 2px
  }
}
.p-confirm-area .p-contact__data {
  padding-block-start: 3px
}
.p-confirm-area .p-contact__data span {
  font-size: 1.5rem;
  letter-spacing: .7px;
  line-height: 180%
}
.p-confirm-area .p-contact__formWrap {
  gap: clamp(2.4rem,1.731rem + 1.714vw,4.2rem)
}
.p-confirm-area__footerWrap {
  display: flex;
  gap: 16px;
  justify-content: center;
  margin-block-start: clamp(4.6rem,3.486rem + 2.857vw,7.6rem)
}
@media screen and (min-width:768px) {
  .p-confirm-area__footerWrap {
    gap: 24px
  }
}
.wpcf7-response-output.wpcf7-mail-sent-ok {
  display: none
}
.wpcf7-response-output {
  display: none
}
.wpcf7-not-valid-tip {
  color: var(--red);
  font-size: 1.4rem;
  letter-spacing: .7px
}
.p-contact-thanks {
  padding-block: 200px clamp(10.2rem,9.531rem + 1.714vw,12rem)
}
.p-contact-thanks__inner {
  display: grid;
  place-content: center
}
.p-contact-thanks__contents {
  display: flex;
  flex-direction: column;
  gap: clamp(4rem,3.109rem + 2.286vw,6.4rem)
}
.p-contact-thanks__titleWrap {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: 12px
}
@media screen and (min-width:768px) {
  .p-contact-thanks__titleWrap {
    gap: 8px
  }
}
.p-contact-thanks__title {
  font-size: clamp(2rem,1.851rem + .381vw,2.4rem);
  line-height: 160%
}
.p-contact-thanks__text {
  font-size: 1.6rem;
  line-height: 180%;
  text-align: center
}
.p-contact-thanks__btn {
  margin-block-start: clamp(6.4rem,5.806rem + 1.524vw,8rem);
  margin-inline: auto
}
.p-index-fv {
  block-size: 581px;
  margin-block-start: 72px;
  overflow: hidden;
  position: relative
}
@media screen and (min-width:768px) {
  .p-index-fv {
    block-size: min(785px,100vh - 72px)
  }
}
@media screen and (min-width:1024px) {
  .p-index-fv {
    block-size: min(785px,100vh - 60px);
    margin-block-start: 60px
  }
}
.p-index-fv__video {
  block-size: 100%;
  display: block;
  inline-size: 100%;
  inset: 0;
  position: absolute;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center;
  aspect-ratio: auto;
  border: none;
  filter: drop-shadow(0 0 rgba(0, 0, 0, 0));
  min-block-size: 100%;
  min-inline-size: 100%;
  object-position: center;
  outline: 0;
  transform: scale(1.01);
  will-change: transform;
  z-index: 0
}
.p-index-fv__contents {
  bottom: 40px;
  margin-inline: clamp(2.4rem,1.249rem + 2.952vw,5.5rem) clamp(2.4rem,1.806rem + 1.524vw,4rem);
  position: absolute
}
@media screen and (min-width:1280px) {
  .p-index-fv__contents {
    bottom: 48px
  }
}
@media screen and (max-width:767px) {
  .p-index-fv__titleWrap {
    display: flex;
    flex-direction: column;
    gap: 16px
  }
}
.p-index-fv__title {
  font-family: var(--font-en);
  font-optical-sizing: auto;
  font-size: 84px;
  font-style: normal;
  font-weight: 400;
  letter-spacing: -.02em;
  line-height: 0;
  text-transform: uppercase
}
@media screen and (min-width:768px) {
  .p-index-fv__title {
    font-size: clamp(8.4rem,6.469rem + 4.952vw,13.6rem)
  }
}
.p-index-fv__text {
  font-size: 24px
}
@media screen and (min-width:768px) {
  .p-index-fv__text {
    font-size: clamp(2.4rem,2.103rem + .762vw,3.2rem)
  }
}
.p-index-fv__text span {
  line-height: 170%
}
.p-index-topNews {
  border-block: 1px solid var(--line-color);
  padding-block: 23px
}
.p-index-topNews__contents {
  display: flex;
  flex-direction: column;
  gap: 14px
}
@media screen and (min-width:1024px) {
  .p-index-topNews__contents {
    align-items: center;
    flex-direction: row;
    gap: 40px;
    justify-content: space-between
  }
}
.p-index-topNews__wrap {
  block-size: 100%
}
.p-index-topNews__link {
  display: grid;
  grid-template-areas: "date category" "title title";
  grid-template-columns: auto 1fr;
  grid-template-rows: auto auto;
  -moz-column-gap: 16px;
  column-gap: 16px;
  row-gap: 8px;
  transition: opacity var(--hover-transition) cubic-bezier(.83,0,.17,1)
}
@media screen and (min-width:1024px) {
  .p-index-topNews__link {
    display: grid;
    grid-template-areas: "category line date" "category line title";
    grid-template-columns: auto 1px 1fr;
    grid-template-rows: auto auto;
    -moz-column-gap: 32px;
    align-items: center;
    block-size: 100%;
    column-gap: 32px;
    row-gap: 5px
  }
}
.p-index-topNews__link:focus-visible .p-index-topNews__title {
  border-color: var(--line-color)
}
@media (any-hover:hover) {
  .p-index-topNews__link:hover .p-index-topNews__title {
    border-color: var(--line-color)
  }
}
.p-index-topNews__title {
  display: -webkit-box;
  font-size: 1.3rem;
  grid-area: title;
  line-height: 180%;
  max-inline-size: 640px;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  border-block-end: 1px solid transparent;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: border-color var(--hover-transition) cubic-bezier(.83,0,.17,1) 0s
}
@media screen and (min-width:768px) {
  .p-index-topNews__title {
    -webkit-line-clamp: 1
  }
}
@media screen and (min-width:1920px) {
  .p-index-topNews__title {
    font-size: 1.6rem
  }
}
.p-index-topNews__categories {
  font-size: 1.3rem;
  grid-area: category;
  inline-size: 56px
}
.p-index-topNews__category {
  color: var(--dark-gray);
  font-family: var(--font-en);
  font-optical-sizing: auto;
  font-size: 1.3rem;
  font-style: normal;
  font-weight: 400;
  line-height: 0;
  line-height: 180%;
  text-transform: uppercase;
  text-transform: capitalize
}
.p-topNewsCard__line {
  display: contents
}
@media screen and (min-width:1024px) {
  .p-topNewsCard__line {
    background: var(--line-color);
    block-size: 100%;
    display: block;
    grid-area: line;
    inline-size: 1px
  }
}
.p-index-topNews__publish {
  color: var(--dark-gray);
  font-family: var(--font-en);
  font-size: 1.3rem;
  font-weight: 400;
  grid-area: date;
  line-height: 180%
}
.p-index-topNews__swiper,
.p-index-topNews__swiper-container,
.p-index-topNews__swiper-slide,
.p-index-topNews__swiper-wrapper {
  position: relative
}
@media screen and (min-width:1024px) {
  .p-index-topNews__swiper-container {
    inline-size: 60.91%;
    max-inline-size: 762px
  }
}
.p-index-topNews__swiper-slide {
  block-size: auto
}
.swiper-button-next,
.swiper-button-prev {
  bottom: unset;
  left: unset;
  margin: 0;
  padding: 0;
  right: unset;
  top: unset
}
.swiper-button-next::after,
.swiper-button-prev::after {
  content: ""
}
.p-index-topNews__buttons {
  block-size: 16px;
  flex-shrink: 0;
  inline-size: 74px;
  position: relative
}
.p-index-topNews__buttons::after {
  background: var(--line-color);
  block-size: 100%;
  content: "";
  display: block;
  inline-size: 1px;
  left: 50%;
  position: absolute;
  top: 50%;
  translate: -50% -50%
}
.swiper-button-next.p-index-topNews__next,
.swiper-button-prev.p-index-topNews__prev {
  aspect-ratio: 14/11;
  display: block;
  inline-size: 16px;
  overflow: hidden;
  position: absolute;
  top: 50%;
  translate: 0 -50%
}
.swiper-button-next.p-index-topNews__next .c-swiper__arrowWrap,
.swiper-button-prev.p-index-topNews__prev .c-swiper__arrowWrap {
  block-size: 100%;
  inline-size: 100%;
  overflow: hidden;
  position: relative
}
.swiper-button-next.p-index-topNews__next .c-btn__arrow,
.swiper-button-prev.p-index-topNews__prev .c-btn__arrow {
  left: 0;
  position: absolute;
  top: 0;
  transition: opacity var(--hover-transition) cubic-bezier(.83,0,.17,1),transform var(--hover-transition) cubic-bezier(.83,0,.17,1)
}
.swiper-button-next.p-index-topNews__next .c-btn__arrow.--hover,
.swiper-button-prev.p-index-topNews__prev .c-btn__arrow.--hover {
  opacity: 0;
  transform: translateX(-10px)
}
.swiper-button-next.p-index-topNews__next:focus-visible .c-btn__arrow,
.swiper-button-prev.p-index-topNews__prev:focus-visible .c-btn__arrow {
  opacity: 0;
  transform: translateX(10px)
}
.swiper-button-next.p-index-topNews__next:focus-visible .c-btn__arrow.--hover,
.swiper-button-prev.p-index-topNews__prev:focus-visible .c-btn__arrow.--hover {
  opacity: 1;
  transform: translateX(0)
}
@media (any-hover:hover) {
  .swiper-button-next.p-index-topNews__next:hover .c-btn__arrow,
  .swiper-button-prev.p-index-topNews__prev:hover .c-btn__arrow {
    opacity: 0;
    transform: translateX(10px)
  }
  .swiper-button-next.p-index-topNews__next:hover .c-btn__arrow.--hover,
  .swiper-button-prev.p-index-topNews__prev:hover .c-btn__arrow.--hover {
    opacity: 1;
    transform: translateX(0)
  }
}
.swiper-button-prev.p-index-topNews__prev {
  left: 0;
  rotate: 180deg
}
.swiper-button-next.p-index-topNews__next {
  right: 0
}
.p-index-topNews__btnWrap {
  align-items: center;
  display: flex;
  gap: 40px;
  justify-content: space-between
}
@media screen and (min-width:1024px) {
  .p-index-topNews__btnWrap {
    gap: clamp(4rem,3.294rem + 1.81vw,5.9rem)
  }
}
.p-index-topNews__btn {
  flex-shrink: 0
}
.p-index-topNews__line {
  display: none
}
@media screen and (min-width:1024px) {
  .p-index-topNews__line {
    background: var(--line-color);
    block-size: 44px;
    display: block;
    inline-size: 1px;
    position: relative
  }
}
.p-index-about {
  padding-block: clamp(8.8rem,4.64rem + 10.667vw,20rem) clamp(5.6rem,2.926rem + 6.857vw,12.8rem)
}
.p-index-about__wrap {
  display: grid;
  grid-template-areas: "name title" "text text";
  grid-template-columns: auto 1fr;
  grid-template-rows: auto auto;
  -moz-column-gap: 32px;
  align-items: start;
  column-gap: 32px;
  justify-content: space-between;
  row-gap: 58px
}
@media screen and (min-width:768px) {
  .p-index-about__wrap {
    grid-template-areas: "name text title";
    grid-template-columns: auto auto auto;
    row-gap: 40px
  }
}
.p-index-about__headWrap {
  display: flex;
  flex-direction: column;
  gap: clamp(4rem,2.514rem + 3.81vw,8rem);
  grid-area: title
}
@media screen and (min-width:768px) {
  .p-index-about__headWrap {
    order: 3
  }
}
.p-index-about__titleWrap {
  align-items: flex-end;
  display: flex;
  flex-direction: column;
  gap: 24px
}
@media screen and (min-width:768px) {
  .p-index-about__titleWrap {
    gap: 48px
  }
}
.p-index-about__title {
  font-size: clamp(2.4rem,2.103rem + .762vw,3.2rem);
  line-height: 100%;
  text-align: right
}
.p-index-about__name {
  grid-area: name
}
.p-index-about__text {
  align-self: stretch;
  font-size: 1.5rem;
  grid-area: text;
  line-height: 180%
}
.p-index-about__text p + p {
  margin-block-start: 27px
}
@media screen and (min-width:768px) {
  .p-index-about__text p + p {
    margin-block-start: 34px
  }
}
@media screen and (min-width:768px) {
  .p-index-about__text {
    font-size: 1.6rem;
    line-height: 210%;
    order: 2
  }
}
.p-index-about__btn {
  align-self: flex-end
}
.p-index-photo {
  aspect-ratio: 390/263;
  block-size: auto;
  inline-size: 100%;
  overflow: hidden
}
@media screen and (min-width:768px) {
  .p-index-photo {
    aspect-ratio: 1440/450
  }
}
.p-index-photo picture {
  block-size: calc(100% + 67px);
  inline-size: 100%;
  -o-object-fit: cover;
  object-fit: cover
}
@media screen and (min-width:768px) {
  .p-index-photo picture {
    block-size: calc(100% + 100px)
  }
}
.p-index-service__wrapper {
  display: flex;
  flex-direction: column;
  padding-block-start: clamp(8.8rem,5.977rem + 7.238vw,16.4rem)
}
@media screen and (min-width:1024px) {
  .p-index-service__wrapper {
    flex-direction: row;
    gap: 40px;
    justify-content: space-between
  }
}
.p-index-service__title {
  display: flex;
  flex-direction: column;
  gap: 6.6666666667vw
}
.p-index-service__textWrap {
  display: flex;
  flex-direction: column;
  gap: clamp(2.4rem,1.954rem + 1.143vw,3.6rem)
}
@media screen and (max-width:1023px) {
  .p-index-service__textWrap {
    margin-block-start: 40px
  }
}
.p-index-service__countItems {
  border-block-start: 1px solid var(--line-color);
  display: grid;
  gap: clamp(1.8rem,.686rem + 2.857vw,4.8rem);
  grid-template-columns: 1fr 1px 1fr;
  justify-content: space-between;
  padding-block-start: clamp(2.4rem,1.806rem + 1.524vw,4rem)
}
.p-index-service__countItem {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: 5px
}
@media screen and (min-width:1024px) {
  .p-index-service__countItem {
    gap: 8px
  }
}
.p-index-service__countItem p {
  font-size: clamp(1.4rem,1.177rem + .571vw,2rem);
  text-align: center;
  white-space: nowrap
}
.p-index-service__itemWrap {
  display: flex;
  flex-direction: column;
  gap: 24px
}
@media screen and (min-width:1024px) {
  .p-index-service__itemWrap {
    align-items: start;
    flex-direction: row;
    gap: 40px;
    justify-content: space-between
  }
}
.p-index-service__itemWrap.--package {
  margin-block-start: 80px;
  position: relative
}
@media screen and (min-width:1024px) {
  .p-index-service__itemWrap.--package {
    margin-block-start: 72px;
    padding-block-end: 80px
  }
  .p-index-service__itemWrap.--package::after {
    background: var(--line-color);
    block-size: 1px;
    bottom: 0;
    content: "";
    inline-size: 100vw;
    left: 0;
    margin-inline: calc(50% - 50cqi);
    position: absolute
  }
}
.p-index-service__itemWrap.--contents {
  gap: 16px!important;
  padding-block: clamp(4.8rem,3.611rem + 3.048vw,8rem) clamp(6.4rem,4.914rem + 3.81vw,10.4rem)
}
@media screen and (min-width:1024px) {
  .p-index-service__itemWrap.--contents {
    flex-direction: column;
    gap: 16px
  }
}
.p-index-service__package {
  max-inline-size: 1024px
}
.p-index-service__name {
  flex-shrink: 0
}
.p-index-service__contentsWrap {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(1,1fr);
  inline-size: 100%
}
@media screen and (min-width:1280px) {
  .p-index-service__contentsWrap {
    grid-template-columns: repeat(1,1fr)
  }
}
.p-index-service__contents--link {
  background: var(--white);
  display: flex;
  flex-direction: column;
  gap: clamp(2.4rem,.914rem + 3.81vw,6.4rem);
  inline-size: 100%;
  position: relative
}
@media screen and (min-width:1024px) {
  .p-index-service__contents--link {
    display: block grid;
    grid-template-columns: auto 1fr;
    justify-content: space-between
  }
}
.p-index-service__contents--link::after {
  content: "";
  position: absolute;
  -webkit-mask-image: url(../img/common/icon-link.svg);
  mask-image: url(../img/common/icon-link.svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  aspect-ratio: 19/14;
  background: var(--text-color);
  bottom: 24px;
  inline-size: 19px;
  mask-size: contain;
  right: 24px;
  transition: scale var(--hover-transition) cubic-bezier(.83,0,.17,1) 0s;
  will-change: scale
}
@media screen and (min-width:1024px) {
  .p-index-service__contents--link::after {
    right: 20px
  }
}
.p-index-service__contents--link:focus-visible {
  background: var(--light-gray)
}
.p-index-service__contents--link:focus-visible::after {
  scale: 1.1
}
.p-index-service__contents--link:focus-visible .p-index-service__contents--img img {
  scale: 1.04
}
@media (any-hover:hover) {
  .p-index-service__contents--link:hover {
    background: var(--light-gray)
  }
  .p-index-service__contents--link:hover::after {
    scale: 1.1
  }
  .p-index-service__contents--link:hover .p-index-service__contents--img img {
    scale: 1.04
  }
}
.p-index-service__head {
  align-items: center;
  display: flex;
  gap: clamp(1.6rem,.114rem + 3.81vw,5.6rem);
  inline-size: 100%
}
@media screen and (min-width:1024px) {
  .p-index-service__head {
    inline-size: auto;
    min-inline-size: 424px
  }
}
.p-index-service__contents--img {
  aspect-ratio: 1;
  inline-size: clamp(13rem,10.289rem + 6.952vw,20.3rem);
  overflow: hidden
}
.p-index-service__contents--img img {
  display: block;
  transition: scale var(--hover-transition) cubic-bezier(.83,0,.17,1) 0s
}
.p-index-service__contents--textWrap {
  align-items: center;
  background: var(--white);
  block-size: 100%;
  display: flex;
  gap: 40px;
  justify-content: space-between;
  max-block-size: 203px;
  padding-inline: 58px;
  position: relative;
  transition: background-color var(--hover-transition) cubic-bezier(.83,0,.17,1) 0s
}
.p-index-service__contents--titleWrap {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  gap: 8px;
  padding-inline-end: 20px
}
@media screen and (min-width:1024px) {
  .p-index-service__contents--titleWrap {
    padding-inline-end: 0
  }
}
.p-index-service__contents--logo {
  aspect-ratio: 102/28;
  inline-size: clamp(8.8rem,8.28rem + 1.333vw,10.2rem)
}
.p-index-service__contents--title.--en {
  font-family: var(--font-en);
  font-optical-sizing: auto;
  font-size: clamp(3rem,2.629rem + .952vw,4rem);
  font-weight: 400;
  line-height: normal
}
.p-index-service__contents--title.--ja {
  font-size: clamp(2.5rem,2.017rem + 1.238vw,3.8rem)
}
.p-index-service__contents--text {
  font-size: 1.4rem;
  line-height: 180%;
  padding: 0 24px 54px
}
@media screen and (min-width:1024px) {
  .p-index-service__contents--text {
    block-size: 100%;
    display: grid;
    line-height: 210%;
    max-inline-size: 450px;
    padding: 0;
    place-content: center
  }
}
.p-index-client {
  background: var(--white);
  padding: clamp(4rem,3.257rem + 1.905vw,6rem) 0
}
.p-index-client__logos {
  display: flex;
  flex-direction: column;
  gap: clamp(2.4rem,1.991rem + 1.048vw,3.5rem);
  inline-size: 100vw;
  overflow: hidden
}
.p-index-client__row {
  align-items: center;
  display: flex;
  inline-size: 100%
}
.p-index-client__track {
  align-items: center;
  animation-duration: var(--loop-duration,60s);
  animation-iteration-count: infinite;
  animation-name: loop-x;
  animation-timing-function: linear;
  block-size: clamp(4.8rem,3.797rem + 2.571vw,7.5rem);
  display: flex;
  gap: clamp(2.4rem,1.509rem + 2.286vw,4.8rem);
  inline-size: -moz-max-content;
  inline-size: max-content;
  will-change: transform
}
.p-index-client__track img {
  block-size: 100%;
  inline-size: auto;
  -o-object-fit: contain;
  object-fit: contain
}
.p-index-client__row--reverse .p-index-client__track {
  animation-direction: reverse
}
@keyframes loop-x {
  to {
    transform: translateX(calc(var(--loop-width) * -1))
  }
}
.p-index-casestudy {
  background: var(--text-color);
  margin-block-start: 64px;
  overflow: clip;
  position: relative
}
@media screen and (min-width:768px) {
  .p-index-casestudy {
    margin-block-start: 0
  }
}
.p-index-casestudy__container {
  overflow: hidden;
  position: absolute;
  right: calc(50% - 344px);
  top: calc(clamp(6.4rem,2.834rem + 9.143vw,16rem) * -1)
}
@media screen and (min-width:768px) {
  .p-index-casestudy__container {
    right: -120px
  }
}
@media screen and (min-width:1024px) {
  .p-index-casestudy__container {
    right: calc(50% - 670px)
  }
}
@media screen and (min-width:1280px) {
  .p-index-casestudy__container {
    right: -240px
  }
}
.p-index-casestudy__sliderWrap {
  aspect-ratio: 478/445;
  display: flex;
  gap: 10px;
  inline-size: 478px;
  justify-content: center;
  position: relative
}
@media screen and (min-width:768px) {
  .p-index-casestudy__sliderWrap {
    aspect-ratio: 654/485;
    gap: 13px;
    inline-size: 654px;
    max-block-size: 485px;
    max-inline-size: 654px
  }
}
.p-index-casestudy__sliderWrap::after {
  background: linear-gradient(90deg,#000 -28.67%,#7c7c7c 140.32%);
  block-size: calc(100% + 1px);
  content: "";
  inset: 0;
  mix-blend-mode: multiply;
  position: absolute;
  z-index: 1
}
.p-index-casestudy__sliderWrap .p-index-casestudy__infinity-carousel {
  aspect-ratio: 234/445;
  inline-size: 234px;
  max-inline-size: 320px;
  overflow: hidden;
  position: relative
}
@media screen and (min-width:768px) {
  .p-index-casestudy__sliderWrap .p-index-casestudy__infinity-carousel {
    aspect-ratio: 320/471;
    inline-size: 320px
  }
}
.p-index-casestudy__sliderWrap .p-index-casestudy__infinity-carousel .p-index-casestudy__scroller {
  animation: infinite-translate-y 30s linear infinite;
  display: grid;
  grid-auto-flow: row;
  grid-auto-rows: 103px;
  row-gap: 10px;
  --loop-distance: 678px
}
@media screen and (min-width:768px) {
  .p-index-casestudy__sliderWrap .p-index-casestudy__infinity-carousel .p-index-casestudy__scroller {
    grid-auto-rows: 141px;
    row-gap: 13px;
    --loop-distance: 924px
  }
}
.p-index-casestudy__sliderWrap .p-index-casestudy__infinity-carousel .p-index-casestudy__scroller > img {
  aspect-ratio: 320/141;
  block-size: 100%;
  display: block;
  inline-size: 100%;
  -o-object-fit: cover;
  object-fit: cover
}
.p-index-casestudy__sliderWrap .p-index-casestudy__infinity-carousel[data-direction=bt] .p-index-casestudy__scroller {
  animation-direction: normal
}
.p-index-casestudy__sliderWrap .p-index-casestudy__infinity-carousel[data-direction=tb] .p-index-casestudy__scroller {
  animation-direction: reverse
}
@keyframes infinite-translate-y {
  to {
    translate: 0 calc(var(--loop-distance) * -1)
  }
}
.p-index-casestudy__wrapper {
  display: flex;
  flex-direction: column;
  gap: clamp(5.6rem,4.709rem + 2.286vw,8rem);
  position: relative;
  z-index: 2
}
.p-index-casestudy__head {
  display: flex;
  flex-direction: column;
  gap: clamp(2.4rem,1.806rem + 1.524vw,4rem);
  z-index: 2
}
@media screen and (min-width:768px) {
  .p-index-casestudy__head {
    align-items: flex-end;
    flex-direction: row
  }
}
.p-index-casestudy__titleWrap {
  display: flex;
  flex-direction: column;
  gap: clamp(1.6rem,.411rem + 3.048vw,4.8rem)
}
.p-index-casestudy__text {
  color: var(--white);
  font-size: 1.4rem;
  line-height: 180%;
  max-inline-size: 448px
}
@media screen and (min-width:768px) {
  .p-index-casestudy__text {
    line-height: 210%
  }
}
@media screen and (min-width:1920px) {
  .p-index-casestudy__text {
    font-size: 1.6rem
  }
}
.p-index-casestudy__btn {
  z-index: 2
}
.p-index-casestudy__body {
  display: flex;
  flex-direction: column;
  gap: clamp(4rem,2.514rem + 3.81vw,8rem)
}
.p-index-casestudy__items {
  inline-size: 100vw;
  margin-inline: calc(50% - 50vw);
  position: relative
}
.p-index-casestudy__item {
  display: flex;
  flex-direction: column
}
@media screen and (min-width:768px) {
  .p-index-casestudy__item {
    align-items: stretch;
    block-size: 400px
  }
}
@media screen and (min-width:1024px) {
  .p-index-casestudy__item {
    block-size: 27.7777777778vw
  }
}
@media screen and (min-width:768px) {
  .js-scroll-overlap {
    position: sticky;
    top: var(--sticky-offset,0);
    --dim: 0
  }
  .js-scroll-overlap::after {
    background: var(--text-color);
    content: "";
    inset: 0;
    opacity: var(--dim);
    pointer-events: none;
    position: absolute;
    transition: opacity .32s cubic-bezier(.22,.61,.36,1);
    will-change: opacity
  }
  .js-scroll-overlap.is-dark {
    --dim: 0.4
  }
  .js-scroll-overlap.is-disabled {
    --dim: 0!important
  }
}
@media screen and (prefers-reduced-motion:reduce) and (min-width:768px) {
  .js-scroll-overlap::after {
    transition: none
  }
}
.p-index-casestudy__link {
  align-items: stretch;
  block-size: 100%;
  display: flex;
  flex-direction: column
}
@media screen and (min-width:768px) {
  .p-index-casestudy__link {
    flex-direction: row;
    justify-content: space-between
  }
}
.p-index-casestudy__link:focus-visible .p-index-casestudy__thumb img {
  scale: 1.02
}
.p-index-casestudy__link:focus-visible .c-arrow {
  opacity: 0;
  transform: translate(10px,-10px) rotate(-45deg)
}
.p-index-casestudy__link:focus-visible .c-arrow.--hover {
  opacity: 1;
  transform: translate(0,0) rotate(-45deg)
}
@media (any-hover:hover) {
  .p-index-casestudy__link:hover .p-index-casestudy__thumb img {
    scale: 1.02
  }
  .p-index-casestudy__link:hover .c-arrow {
    opacity: 0;
    transform: translate(10px,-10px) rotate(-45deg)
  }
  .p-index-casestudy__link:hover .c-arrow.--hover {
    opacity: 1;
    transform: translate(0,0) rotate(-45deg)
  }
}
.p-index-casestudy__thumb {
  aspect-ratio: 390/270;
  flex: 50.34%;
  flex-shrink: 0;
  inline-size: 100%;
  overflow: hidden
}
@media screen and (min-width:768px) {
  .p-index-casestudy__thumb {
    aspect-ratio: 724/400;
    inline-size: 50.3472222222vw
  }
}
.p-index-casestudy__thumb img {
  transition: scale var(--hover-transition) cubic-bezier(.83,0,.17,1)
}
.p-index-casestudy__contents {
  background: var(--bg-color);
  display: flex;
  flex: 49.65%;
  flex-direction: column;
  padding: clamp(3.2rem,2.606rem + 1.524vw,4.8rem) 24px 65px clamp(2.4rem,1.211rem + 3.048vw,5.6rem);
  position: relative
}
@media screen and (min-width:768px) {
  .p-index-casestudy__contents {
    justify-content: space-between;
    padding: clamp(3.2rem,2.606rem + 1.524vw,4.8rem) 24px 40px clamp(2.4rem,1.211rem + 3.048vw,5.6rem)
  }
}
@media screen and (min-width:1920px) {
  .p-index-casestudy__contents {
    padding: 3.3333333333vw 1.6666666667vw 2.7777777778vw 3.8888888889vw
  }
}
.p-index-casestudy__textWrap {
  block-size: 100%;
  display: flex;
  flex-direction: column
}
.p-index-casestudy__lists {
  margin-block-start: auto
}
.p-index-casestudy__btn--foot {
  display: grid;
  place-content: center
}
.p-index-news {
  padding-block: clamp(6.4rem,4.914rem + 3.81vw,10.4rem)
}
.p-index-news__wrap {
  display: flex;
  flex-direction: column;
  gap: 56px
}
@media screen and (min-width:768px) {
  .p-index-news__wrap {
    flex-direction: row;
    gap: 40px;
    justify-content: space-between
  }
}
.p-index-news__titleWrap {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  gap: clamp(2.4rem,1.806rem + 1.524vw,4rem)
}
.p-news__menus {
  align-items: center;
  display: flex;
  flex-shrink: 0;
  flex-wrap: wrap;
  gap: 4.103vw;
  overflow: hidden;
  padding: 56px 6.154vw 32px 6.154vw
}
@media screen and (min-width:1024px) {
  .p-news__menus {
    align-items: flex-start;
    flex-direction: column;
    gap: 5px;
    padding: 0
  }
}
.p-news__menu--link {
  color: rgba(255,255,255,.2);
  font-family: var(--font-en);
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 180%;
  mix-blend-mode: exclusion;
  transition: opacity var(--hover-transition) cubic-bezier(.83,0,.17,1) 0s
}
@media screen and (min-width:768px) {
  .p-news__menu--link {
    font-weight: 400
  }
}
.p-news__menu--link:not(.is-current):focus-visible {
  opacity: var(--opacity-06)
}
@media (any-hover:hover) {
  .p-news__menu--link:not(.is-current):hover {
    opacity: var(--opacity-06)
  }
}
.p-news__menu--link.is-current {
  border-bottom: 1px solid;
  color: rgba(255,255,255,.8)
}
.p-news__items {
  border-block-end: 1px solid var(--line-color);
  inline-size: 100%;
  margin-inline: auto;
  max-inline-size: 768px
}
@media screen and (min-width:768px) {
  .p-news__line {
    border-block-end: 1px solid var(--line-color)
  }
}
.p-news__pagination {
  padding-block-start: clamp(6.4rem,4.691rem + 4.381vw,11rem)
}
@media screen and (min-width:768px) {
  .p-news__pagination {
    padding-block-end: 98px
  }
}
.p-cta {
  padding-block: clamp(6.4rem,4.914rem + 3.81vw,10.4rem)
}
.p-cta__inner {
  display: flex;
  flex-direction: column;
  gap: 28px
}
@media screen and (min-width:768px) {
  .p-cta__inner {
    flex-direction: row;
    gap: 16px;
    justify-content: space-between
  }
}
.p-cta__wrap {
  display: flex;
  flex-direction: column;
  gap: clamp(2.4rem,.914rem + 3.81vw,6.4rem);
  inline-size: 100%
}
@media screen and (min-width:768px) {
  .p-cta__wrap {
    max-inline-size: 489px
  }
}
.p-cta__titleWrap {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  gap: clamp(1.6rem,.709rem + 2.286vw,4rem)
}
.p-cta__section-title {
  font-size: clamp(2rem,1.851rem + .381vw,2.4rem);
  line-height: 150%
}
@media screen and (min-width:768px) {
  .p-cta__section-title {
    line-height: normal
  }
}
.p-cta__text {
  font-size: 1.4rem;
  line-height: 180%
}
@media screen and (min-width:768px) {
  .p-cta__text {
    line-height: 210%
  }
}
@media screen and (min-width:1920px) {
  .p-cta__text {
    font-size: 1.6rem
  }
}
.p-cta__lists {
  display: flex;
  flex-direction: column;
  inline-size: 100%;
  max-inline-size: 480px
}
.p-cta__lists.--drawer {
  gap: 16px
}
.p-cta__lists.--drawer .p-cta__link {
  border: 1px solid var(--line-color);
  padding: 16px
}
.p-cta__lists.--drawer .p-cta__list:not(:first-child) {
  border: none
}
.p-cta__list:not(:first-child) {
  border-block-end: 1px solid var(--line-color)
}
.p-cta__link {
  border-block-start: 1px solid var(--line-color);
  display: flex;
  gap: clamp(2rem,1.257rem + 1.905vw,4rem);
  justify-content: space-between;
  padding: 16px 12px 16px 8px
}
@media screen and (min-width:768px) {
  .p-cta__link {
    padding: 15px
  }
}
.p-cta__link:focus-visible {
  background: var(--light-gray)
}
.p-cta__link:focus-visible .c-arrow {
  opacity: 0;
  transform: translate(10px,-10px) rotate(-45deg)
}
.p-cta__link:focus-visible .c-arrow.--hover {
  opacity: 1;
  transform: translate(0,0) rotate(-45deg)
}
@media (any-hover:hover) {
  .p-cta__link:hover {
    background: var(--light-gray)
  }
  .p-cta__link:hover .c-arrow {
    opacity: 0;
    transform: translate(10px,-10px) rotate(-45deg)
  }
  .p-cta__link:hover .c-arrow.--hover {
    opacity: 1;
    transform: translate(0,0) rotate(-45deg)
  }
}
.p-cta__linkText--wrap {
  align-items: center;
  display: flex;
  gap: 16px;
  justify-content: space-between
}
.p-cta__icon {
  aspect-ratio: 1;
  flex-shrink: 0;
  inline-size: 56px
}
@media screen and (min-width:768px) {
  .p-cta__icon {
    inline-size: clamp(4rem,3.406rem + 1.524vw,5.6rem)
  }
}
.p-cta__linkText {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  padding-block-end: 8px
}
@media screen and (min-width:768px) {
  .p-cta__linkText {
    padding-block: 4px 12px
  }
}
.p-cta__linkText--en {
  color: var(--gray);
  font-family: var(--font-en);
  font-optical-sizing: auto;
  font-size: 1.2rem;
  font-style: normal;
  font-weight: 400;
  line-height: 0;
  line-height: 160%;
  text-transform: uppercase
}
.p-cta__linkText--ja {
  font-size: clamp(2rem,1.851rem + .381vw,2.4rem);
  line-height: normal
}
.p-cta__arrowWrap {
  margin-block-start: clamp(3.3rem,2.743rem + 1.429vw,4.8rem)
}
@media screen and (min-width:768px) {
  .p-cta__arrowWrap {
    block-size: 18px;
    inline-size: 22px
  }
}
.p-company-access__contents,
.p-company-overview__contents {
  display: flex;
  flex-direction: column;
  gap: 24px
}
@media screen and (min-width:768px) {
  .p-company-access__contents,
  .p-company-overview__contents {
    display: grid;
    gap: clamp(4rem,.731rem + 8.381vw,12.8rem);
    grid-template-columns: 200px 1fr
  }
}
@media screen and (min-width:768px) {
  .p-company-access,
  .p-company-overview {
    padding-block-end: clamp(5.6rem,4.709rem + 2.286vw,8rem)
  }
}
.p-company-access,
.p-company-overview {
  position: relative
}
@media screen and (min-width:768px) {
  .p-company-access::after,
  .p-company-overview::after {
    background: var(--line-color);
    block-size: 1px;
    bottom: 0;
    content: "";
    inline-size: 100vw;
    left: 50%;
    margin-inline: calc(50% - 50vw);
    position: absolute;
    translate: -50%
  }
}
.p-company-access__title,
.p-company-overview__title {
  font-family: var(--font-en);
  font-optical-sizing: auto;
  font-size: 48px;
  font-style: normal;
  font-weight: 400;
  letter-spacing: -.02em;
  line-height: 0;
  line-height: 100%;
  text-transform: uppercase
}
@media screen and (min-width:768px) {
  .p-company-access__title,
  .p-company-overview__title {
    font-size: 40px;
    height: -moz-fit-content;
    height: fit-content;
    position: sticky;
    top: 0
  }
}
@media screen and (min-width:768px) {
  .p-company-access__head,
  .p-company-overview__head {
    align-self: start;
    height: -moz-fit-content;
    height: fit-content;
    position: sticky;
    top: 120px
  }
}
.p-company-overview__lists {
  border-block-end: 1px solid var(--line-color)
}
.p-company-overview__list {
  border-block-start: 1px solid var(--line-color);
  display: grid;
  grid-template-columns: 80px auto;
  padding: clamp(2.3rem,2.003rem + .762vw,3.1rem) clamp(.8rem,.354rem + 1.143vw,2rem)
}
@media screen and (min-width:768px) {
  .p-company-overview__list {
    grid-template-columns: 120px auto
  }
}
.p-company-overview__detail {
  font-size: 1.4rem;
  line-height: 180%
}
@media screen and (min-width:1920px) {
  .p-company-overview__detail {
    font-size: 1.6rem
  }
}
.p-company-overview__name {
  color: var(--dark-gray);
  font-size: 1.4rem;
  line-height: 150%
}
@media screen and (min-width:1920px) {
  .p-company-overview__name {
    font-size: 1.6rem
  }
}
.p-company-access {
  padding-block-start: clamp(5.4rem,4.434rem + 2.476vw,8rem)
}
.p-company-access__map iframe {
  aspect-ratio: 390/290;
  inline-size: 100vw;
  margin-inline: calc(50% - 50vw)
}
@media screen and (min-width:768px) {
  .p-company-access__map iframe {
    aspect-ratio: 636/407;
    inline-size: 44.1666666667vw;
    margin-inline: revert;
    max-inline-size: 636px
  }
}
.p-count__counter {
  align-items: center;
  display: inline-flex;
  gap: 6px
}
.p-count__counter.--baseline {
  align-items: baseline
}
.p-count__numberWrap {
  display: inline-block;
  min-inline-size: 5ch;
  text-align: right
}
.p-count__numberWrap.--ja {
  min-inline-size: 4ch
}
.p-count__number,
.p-count__unit {
  font-family: var(--font-en);
  font-optical-sizing: auto;
  font-size: clamp(4.8rem,4.206rem + 1.524vw,6.4rem);
  font-style: normal;
  font-weight: 400;
  letter-spacing: -.05em;
  line-height: 0;
  line-height: 100%;
  text-transform: uppercase
}
.p-count__plus {
  font-size: clamp(2rem,1.554rem + 1.143vw,3.2rem);
  line-height: 100%
}
.p-count__plus.--ja {
  font-size: clamp(1.6rem,1.006rem + 1.524vw,3.2rem)
}
@media screen and (min-width:1024px) {
  .p-count__plus.--ja {
    font-size: clamp(2rem,1.554rem + 1.143vw,3.2rem)
  }
}
.p-count__line {
  background: var(--line-color);
  block-size: 100%;
  inline-size: 1px
}
.p-service__countItem .p-count__number,
.p-service__countItem .p-count__unit {
  font-family: var(--font-en);
  font-optical-sizing: auto;
  font-size: clamp(4.4rem,3.954rem + 1.143vw,5.6rem);
  font-style: normal;
  font-weight: 400;
  letter-spacing: -.05em;
  line-height: 0;
  line-height: 100%;
  text-transform: uppercase
}
.p-service__countItem .p-count__plus.--ja {
  font-size: clamp(1.6rem,1.006rem + 1.524vw,3.2rem)
}
@media screen and (min-width:1024px) {
  .p-service__countItem .p-count__plus.--ja {
    font-size: 1.953pxvw
  }
}
@media screen and (min-width:1280px) {
  .p-service__countItem .p-count__plus.--ja {
    font-size: clamp(1.6rem,1.006rem + 1.524vw,3.2rem)
  }
}
.p-service__countItem .p-count__line {
  background: var(--line-color);
  block-size: 100%;
  inline-size: 1px
}
.p-service-overview {
  padding-block-end: 48px
}
@media screen and (min-width:768px) {
  .p-service-overview {
    padding-block-end: 0
  }
}
.p-service__contents {
  display: flex;
  flex-direction: column;
  gap: clamp(4.8rem,4.28rem + 1.333vw,6.2rem)
}
.p-service-overview__wrap {
  display: flex;
  flex-direction: column;
  gap: clamp(3.2rem,2.903rem + .762vw,4rem)
}
@media screen and (min-width:768px) {
  .p-service-overview__wrap {
    flex-direction: row;
    justify-content: space-between
  }
}
.p-service-overview__title {
  flex-shrink: 0;
  font-size: clamp(2.8rem,2.057rem + 1.905vw,4.8rem);
  line-height: 150%
}
@media screen and (min-width:768px) {
  .p-service-overview__text {
    max-inline-size: 415px
  }
}
.p-service__countItems {
  display: grid;
  gap: 0;
  grid-template-columns: minmax(154px,1fr) minmax(134px,1fr)
}
@media screen and (min-width:1024px) {
  .p-service__countItems {
    border-block: 1px solid var(--line-color);
    gap: 16px;
    grid-template-columns: minmax(0,220px) minmax(0,206px) minmax(0,150px) minmax(0,187px);
    justify-content: space-between;
    padding-block: 40px
  }
}
@media screen and (min-width:1280px) {
  .p-service__countItems {
    gap: 48px;
    grid-template-columns: minmax(0,220px) minmax(0,206px) minmax(0,186px) minmax(0,187px)
  }
}
.p-service__countItem {
  display: flex;
  flex-direction: column;
  position: relative;
  text-align: center
}
.p-service__countItem p {
  font-size: clamp(1.4rem,1.177rem + .571vw,2rem);
  line-height: normal;
  white-space: nowrap
}
@media screen and (min-width:1024px) {
  .p-service__countItem p {
    font-size: 1.6rem
  }
}
@media screen and (min-width:1280px) {
  .p-service__countItem p {
    font-size: clamp(1.4rem,1.177rem + .571vw,2rem)
  }
}
@media screen and (max-width:1023px) {
  .p-service__countItem {
    gap: 5px
  }
  .p-service__countItem:nth-child(-n+2) {
    padding-bottom: 28px
  }
  .p-service__countItem:nth-child(n+3) {
    padding-top: 26px
  }
  .p-service__countItem:nth-child(2n-1) {
    padding-right: 17px
  }
  .p-service__countItem:nth-child(2n) {
    padding-left: 0
  }
  .p-service__countItem:nth-child(1)::after,
  .p-service__countItem:nth-child(2)::after {
    background-color: var(--line-color);
    block-size: 1px;
    bottom: 0;
    content: "";
    left: 0;
    position: absolute;
    right: 0
  }
  .p-service__countItem:nth-child(2)::before,
  .p-service__countItem:nth-child(4)::before {
    background-color: var(--line-color);
    bottom: 0;
    content: "";
    inline-size: 1px;
    left: 0;
    position: absolute;
    top: 0
  }
}
@media screen and (min-width:1024px) {
  .p-service__countItem {
    gap: 8px
  }
  .p-service__countItem:first-child {
    padding-inline-start: 0
  }
  .p-service__countItem:last-child {
    padding-inline-end: 0
  }
  .p-service__countItem:not(:last-child)::after {
    background-color: var(--line-color);
    block-size: 100%;
    content: "";
    inline-size: 1px;
    position: absolute;
    right: -16px;
    top: 0
  }
}
@media screen and (min-width:1280px) {
  .p-service__countItem:not(:last-child)::after {
    right: -24px
  }
}
.p-service-recruit {
  margin-block-start: clamp(7.8rem,6.24rem + 4vw,12rem);
  position: relative
}
.p-service-recruit__contents {
  display: flex;
  flex-direction: column;
  gap: 48px
}
.p-service-recruit__item {
  display: flex;
  flex-direction: column;
  gap: 32px
}
@media screen and (max-width:767px) {
  .p-service-recruit__item:first-child {
    border-block-end: 1px solid var(--line-color);
    padding-block-end: 46px
  }
}
@media screen and (min-width:768px) {
  .p-service-recruit__item {
    flex-direction: row;
    justify-content: space-between
  }
}
.p-service-recruit__textWrap {
  display: flex;
  flex-direction: column;
  gap: 32px
}
@media screen and (min-width:1280px) {
  .p-service-recruit__textWrap {
    flex: 48.75%
  }
}
.p-service-recruit__titleWrap {
  display: flex;
  flex-direction: column;
  gap: 24px
}
.p-service-recruit__title {
  font-size: clamp(2.8rem,2.651rem + .381vw,3.2rem);
  letter-spacing: -.02em;
  line-height: 100%
}
@media screen and (min-width:768px) {
  .p-service-recruit__title {
    line-height: 150%
  }
}
.p-service-recruit__lead {
  font-size: 2rem;
  line-height: 150%
}
@media screen and (min-width:768px) {
  .p-service-recruit__lead {
    font-size: 1.8rem
  }
}
.p-service-recruit__text {
  align-self: stretch;
  font-size: 1.4rem;
  line-height: 180%
}
.p-service-recruit__text p + p {
  margin-block-start: 24px
}
.p-service-recruit__figureItem {
  background: var(--white);
  display: flex;
  flex-direction: column;
  gap: clamp(.8rem,-.091rem + 2.286vw,3.2rem);
  inline-size: 100%;
  max-inline-size: 560px;
  padding-block-end: 32px
}
@media screen and (min-width:768px) {
  .p-service-recruit__figureItem {
    max-inline-size: 460px
  }
}
@media screen and (min-width:1280px) {
  .p-service-recruit__figureItem {
    flex: 47.91%
  }
}
.p-service-recruit__figureTitle {
  background: var(--text-color);
  color: var(--white);
  font-size: 1.8rem;
  inline-size: 100%;
  letter-spacing: -.02em;
  line-height: 100%;
  padding: 8px 24px 10px 24px;
  text-align: center;
  white-space: nowrap
}
@media screen and (min-width:768px) {
  .p-service-recruit__figureTitle {
    padding-block: 8px 10px
  }
}
@media screen and (min-width:1024px) {
  .p-service-recruit__figureTitle {
    font-size: clamp(1.8rem,1.726rem + .19vw,2rem)
  }
}
.p-service-recruit__figureImg {
  display: block;
  inline-size: 80vw;
  margin-inline: auto;
  max-inline-size: 420px
}
.p-service-recruit__figureImg.--01 {
  aspect-ratio: 365/320
}
@media screen and (min-width:768px) {
  .p-service-recruit__figureImg.--01 {
    inline-size: 100%;
    max-inline-size: 365px;
    padding-inline: 12px
  }
}
@media screen and (min-width:1280px) {
  .p-service-recruit__figureImg.--01 {
    inline-size: 25.3472222222vw
  }
}
.p-service-recruit__figureImg.--02 {
  aspect-ratio: 369/320
}
@media screen and (min-width:768px) {
  .p-service-recruit__figureImg.--02 {
    inline-size: 100%;
    max-inline-size: 369px;
    padding-inline: 16px
  }
}
@media screen and (min-width:1280px) {
  .p-service-recruit__figureImg.--02 {
    inline-size: 25.625vw
  }
}
.p-service-recruit__figureText {
  flex-grow: 1;
  padding-inline: clamp(2.4rem,1.583rem + 2.095vw,4.6rem)
}
.p-service-casestudy {
  background: var(--text-color);
  color: var(--white);
  margin-block-start: clamp(6.7rem,4.731rem + 5.048vw,12rem);
  padding-block: clamp(6.4rem,4.32rem + 5.333vw,12rem) clamp(6.4rem,5.211rem + 3.048vw,9.6rem);
  position: relative
}
.p-service-casestudy__titleWrap {
  display: flex;
  flex-direction: column;
  gap: clamp(2.4rem,1.806rem + 1.524vw,4rem)
}
@media screen and (min-width:768px) {
  .p-service-casestudy__titleWrap {
    align-items: end;
    flex-direction: row;
    justify-content: space-between
  }
}
.p-service-casestudy__btnWrap {
  align-items: flex-end;
  display: flex;
  justify-content: space-between
}
@media screen and (min-width:768px) {
  .p-service-casestudy__btnWrap {
    align-items: flex-end;
    display: flex;
    justify-content: flex-end
  }
}
.p-service-casestudy__btn {
  display: block
}
.p-service-casestudy__swiper,
.p-service-casestudy__swiper-container,
.p-service-casestudy__swiper-slide,
.p-service-casestudy__swiper-wrapper {
  position: relative
}
.p-service-casestudy__swiper-container {
  margin-block-start: clamp(4.8rem,2.72rem + 5.333vw,10.4rem)
}
.p-service-casestudy__swiper-container .swiper {
  overflow: visible
}
.p-service-casestudy__swiper-wrapper {
  margin-left: -24px
}
@media screen and (min-width:576px) {
  .p-service-casestudy__swiper-wrapper {
    margin-left: 0
  }
}
.p-service-casestudy__swiper .swiper-slide {
  opacity: .6;
  padding-block-start: 1%;
  transform: scale(.9);
  transition: opacity .4s cubic-bezier(.83,0,.17,1),transform .4s cubic-bezier(.83,0,.17,1);
  width: 302px!important
}
@media screen and (min-width:768px) {
  .p-service-casestudy__swiper .swiper-slide {
    padding-block-start: 2%;
    transform: scale(.94);
    width: 520px!important
  }
}
.p-service-casestudy__swiper .swiper-slide-active {
  opacity: 1;
  padding-block-start: 0;
  transform: scale(1)
}
@media screen and (min-width:768px) {
  .p-service-casestudy__swiper .swiper-slide-active {
    padding-block-start: 0;
    transform: scale(1)
  }
}
.p-service-casestudy__swiper .swiper-slide-active .p-service-casestudy__contents {
  padding: 24px 24px 51px 24px!important
}
@media screen and (min-width:768px) {
  .p-service-casestudy__swiper .swiper-slide-active .p-service-casestudy__contents {
    padding: 32px 48px!important
  }
}
.p-service-casestudy__swiper .swiper-slide-active .p-service-casestudy__title {
  block-size: 6.48rem!important;
  font-size: 18px!important
}
@media screen and (min-width:768px) {
  .p-service-casestudy__swiper .swiper-slide-active .p-service-casestudy__title {
    block-size: 7.2rem!important;
    font-size: 20px!important
  }
}
.p-service-casestudy__swiper .swiper-slide-active .p-service-casestudy__textWrap {
  gap: clamp(1.4rem,.991rem + 1.048vw,2.5rem)!important
}
.p-service-casestudy__swiper .swiper-slide-active .p-service-casestudy__lists {
  gap: 4px!important
}
@media screen and (min-width:768px) {
  .p-service-casestudy__swiper .swiper-slide-active .p-service-casestudy__lists {
    gap: 8px!important
  }
}
.p-service-casestudy__swiper .swiper-slide-active .p-service-casestudy__list {
  gap: 8px!important;
  grid-template-columns: 60px 1fr!important
}
@media screen and (min-width:768px) {
  .p-service-casestudy__swiper .swiper-slide-active .p-service-casestudy__list {
    gap: 16px!important
  }
}
.p-service-casestudy__swiper .swiper-slide-active .p-service-casestudy__name {
  font-size: 1.2rem
}
@media screen and (min-width:768px) {
  .p-service-casestudy__swiper .swiper-slide-active .p-service-casestudy__name {
    font-size: 1.3rem
  }
}
.p-service-casestudy__swiper .swiper-slide-active .p-service-casestudy__tag,
.p-service-casestudy__swiper .swiper-slide-active .p-service-casestudy__value {
  font-size: 1.2rem
}
@media screen and (min-width:768px) {
  .p-service-casestudy__swiper .swiper-slide-active .p-service-casestudy__tag,
  .p-service-casestudy__swiper .swiper-slide-active .p-service-casestudy__value {
    font-size: 1.3rem
  }
}
.p-service-casestudy__swiper .swiper-button-next,
.p-service-casestudy__swiper .swiper-button-prev {
  bottom: unset;
  left: unset;
  margin: 0;
  padding: 0;
  right: unset;
  top: unset
}
.p-service-casestudy__swiper .swiper-button-next::after,
.p-service-casestudy__swiper .swiper-button-prev::after {
  content: ""
}
@media screen and (max-width:767px) {
  .p-service-casestudy__buttons {
    block-size: 16px;
    flex-shrink: 0;
    inline-size: 74px;
    position: relative
  }
  .p-service-casestudy__buttons::after {
    background: var(--line-color);
    block-size: 100%;
    content: "";
    display: block;
    inline-size: 1px;
    left: 50%;
    position: absolute;
    top: 50%;
    translate: -50% -50%
  }
}
@media screen and (max-width:767px) {
  .swiper-button-next.p-service-casestudy__next--sp,
  .swiper-button-prev.p-service-casestudy__prev--sp {
    position: absolute;
    -webkit-mask-image: url(../img/common/arrow.svg);
    mask-image: url(../img/common/arrow.svg);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    background: var(--white);
    block-size: 13px;
    inline-size: 16px;
    mask-size: contain;
    top: 50%;
    transition: opacity var(--hover-transition) cubic-bezier(.83,0,.17,1);
    translate: 0 -50%
  }
  .swiper-button-next.p-service-casestudy__next--sp:focus-visible,
  .swiper-button-prev.p-service-casestudy__prev--sp:focus-visible {
    opacity: var(--opacity-06)
  }
}
@media screen and (max-width:767px) and (any-hover:hover) {
  .swiper-button-next.p-service-casestudy__next--sp:hover,
  .swiper-button-prev.p-service-casestudy__prev--sp:hover {
    opacity: var(--opacity-06)
  }
}
@media screen and (min-width:768px) {
  .swiper-button-next.p-service-casestudy__next--sp,
  .swiper-button-prev.p-service-casestudy__prev--sp {
    display: none
  }
}
.swiper-button-prev.p-service-casestudy__prev--sp {
  left: 0;
  rotate: 180deg
}
.swiper-button-next.p-service-casestudy__next--sp {
  right: 0
}
.swiper-button-next.p-service-casestudy__next--pc,
.swiper-button-prev.p-service-casestudy__prev--pc {
  display: none
}
@media screen and (min-width:768px) {
  .swiper-button-next.p-service-casestudy__next--pc,
  .swiper-button-prev.p-service-casestudy__prev--pc {
    aspect-ratio: 1;
    background: url(../img/service/arrow-btn.png) no-repeat center center/cover;
    block-size: 68px;
    display: block;
    inline-size: 68px;
    opacity: 1;
    position: absolute;
    transition: opacity var(--hover-transition) cubic-bezier(.83,0,.17,1)
  }
  .swiper-button-next.p-service-casestudy__next--pc:focus-visible,
  .swiper-button-prev.p-service-casestudy__prev--pc:focus-visible {
    opacity: var(--opacity-06)
  }
}
@media screen and (min-width:768px) and (any-hover:hover) {
  .swiper-button-next.p-service-casestudy__next--pc:hover,
  .swiper-button-prev.p-service-casestudy__prev--pc:hover {
    opacity: var(--opacity-06)
  }
}
.swiper-button-prev.p-service-casestudy__prev--pc {
  left: calc(50% - 300px);
  top: 51%;
  translate: -50% -50%
}
.swiper-button-next.p-service-casestudy__next--pc {
  right: calc(50% - 370px);
  rotate: 180deg;
  top: 51%;
  translate: -50% -50%
}
.p-service-casestudy__item {
  block-size: 100%;
  inline-size: 100%
}
.p-service-casestudy__link {
  display: flex;
  flex-direction: column;
  transition: opacity var(--hover-transition) cubic-bezier(.83,0,.17,1)
}
.p-service-casestudy__link:focus-visible {
  opacity: var(--opacity-06)
}
.p-service-casestudy__link:focus-visible .c-arrow {
  opacity: 0;
  transform: translate(10px,-10px) rotate(-45deg)
}
.p-service-casestudy__link:focus-visible .c-arrow.--hover {
  opacity: 1;
  transform: translate(0,0) rotate(-45deg)
}
@media (any-hover:hover) {
  .p-service-casestudy__link:hover {
    opacity: var(--opacity-06)
  }
  .p-service-casestudy__link:hover .c-arrow {
    opacity: 0;
    transform: translate(10px,-10px) rotate(-45deg)
  }
  .p-service-casestudy__link:hover .c-arrow.--hover {
    opacity: 1;
    transform: translate(0,0) rotate(-45deg)
  }
}
.p-service-casestudy__thumb {
  aspect-ratio: 302/240;
  inline-size: 100%
}
@media screen and (min-width:768px) {
  .p-service-casestudy__thumb {
    aspect-ratio: 520/310;
    overflow: hidden;
    -o-object-position: center;
    object-position: center
  }
}
.p-service-casestudy__contents {
  background: var(--bg-color);
  display: flex;
  flex-direction: column;
  inline-size: 100%;
  padding: 22px 22px 48px 22px
}
@media screen and (min-width:768px) {
  .p-service-casestudy__contents {
    padding: 22px 43px 23px 43px
  }
}
.p-service-casestudy__textWrap {
  display: flex;
  flex-direction: column;
  gap: clamp(1.2rem,.829rem + .952vw,2.2rem)
}
.p-service-casestudy__title {
  color: var(--white);
  display: -webkit-box;
  font-size: 1.6rem;
  height: min(100%,2lh);
  line-height: 180%;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2
}
@media screen and (min-width:768px) {
  .p-service-casestudy__title {
    font-size: 1.4rem
  }
}
.p-service-casestudy__title span {
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit
}
.p-service-casestudy__lists {
  color: var(--gray);
  display: flex;
  flex-direction: column;
  gap: 3.5px
}
@media screen and (min-width:768px) {
  .p-service-casestudy__lists {
    gap: 4px
  }
}
.p-service-casestudy__list {
  display: grid;
  gap: 7px;
  grid-template-columns: 54px 1fr
}
@media screen and (min-width:768px) {
  .p-service-casestudy__list {
    gap: 12px;
    grid-template-columns: 40px 1fr
  }
}
.p-service-casestudy__name {
  font-family: var(--font-en);
  font-optical-sizing: auto;
  font-size: 1.1rem;
  font-weight: 400;
  line-height: normal;
  text-transform: uppercase
}
@media screen and (min-width:768px) {
  .p-service-casestudy__name {
    font-size: .9rem
  }
}
.p-service-casestudy__value {
  -webkit-line-clamp: 1;
  display: -webkit-box;
  font-size: 1.2rem;
  font-weight: 500;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
  text-overflow: ellipsis
}
@media screen and (min-width:768px) {
  .p-service-casestudy__value {
    font-size: .9rem
  }
}
.p-service-casestudy__arrowWrap {
  bottom: 16px;
  position: absolute;
  right: 14px
}
@media screen and (min-width:768px) {
  .p-service-casestudy__arrowWrap {
    right: 20px
  }
}
.p-service-package {
  padding-block: clamp(6.4rem,3.429rem + 7.619vw,14.4rem) clamp(2.4rem,-2.28rem + 12vw,15rem)
}
.p-service-package__titleWrap {
  display: flex;
  flex-direction: column;
  gap: 16px
}
@media screen and (min-width:768px) {
  .p-service-package__titleWrap {
    align-items: center;
    flex-direction: row-reverse;
    gap: 40px;
    justify-content: space-between
  }
}
.p-service-package__title {
  flex-shrink: 0
}
.p-service-package__text {
  max-inline-size: 464px
}
.p-service-package__wrap {
  margin-block-start: clamp(7.2rem,6.42rem + 2vw,9.3rem);
  max-inline-size: 960px
}
.p-recruit__line {
  background: var(--line-color);
  block-size: 1px;
  inline-size: 100%;
  position: relative
}
.p-recruit__fv {
  background: url(../img/recruit/fv-bg-sp.png) no-repeat center center/cover;
  block-size: 642px;
  margin-block-start: 72px;
  padding-block: 46px 24px;
  position: relative
}
@media screen and (min-width:1024px) {
  .p-recruit__fv {
    background: url(../img/recruit/fv-bg.png) no-repeat center center/cover;
    block-size: 785px;
    margin-block-start: 60px;
    padding-block: 60px 24px
  }
}
.p-recruit-fv__breadcrumb {
  display: grid;
  justify-content: right;
  position: relative
}
.p-recruit-fv__img {
  position: absolute
}
.p-recruit-fv__img.--01 {
  aspect-ratio: 133/106;
  inline-size: 133px;
  left: 0;
  max-inline-size: 196px;
  top: -20px
}
@media screen and (min-width:768px) {
  .p-recruit-fv__img.--01 {
    aspect-ratio: 196/156;
    inline-size: 13.6111111111vw;
    left: 236px
  }
}
@media screen and (min-width:1024px) {
  .p-recruit-fv__img.--01 {
    top: -60px
  }
}
.p-recruit-fv__img.--02 {
  aspect-ratio: 123/89;
  inline-size: 123px;
  max-inline-size: 187px;
  right: 0;
  top: 97px
}
@media screen and (min-width:768px) {
  .p-recruit-fv__img.--02 {
    top: 34px
  }
}
@media screen and (min-width:1280px) {
  .p-recruit-fv__img.--02 {
    aspect-ratio: 187/136;
    inline-size: 12.9861111111vw;
    right: -120px;
    top: 108px
  }
}
.p-recruit-fv__img.--03 {
  aspect-ratio: 148/110;
  bottom: 70px;
  inline-size: 148px;
  max-inline-size: 256px;
  right: 102px
}
@media (min-width:420px) {
  .p-recruit-fv__img.--03 {
    bottom: 20px;
    right: 60px
  }
}
@media screen and (min-width:768px) {
  .p-recruit-fv__img.--03 {
    bottom: 100px;
    left: 0;
    right: revert
  }
}
@media screen and (min-width:1280px) {
  .p-recruit-fv__img.--03 {
    aspect-ratio: 256/191;
    bottom: 217px;
    inline-size: 17.7777777778vw;
    left: -120px
  }
}
.p-recruit-fv__titleWrap {
  display: flex;
  flex-direction: column;
  gap: clamp(2.4rem,1.583rem + 2.095vw,4.6rem);
  margin-block-start: 106px
}
@media screen and (min-width:768px) {
  .p-recruit-fv__titleWrap {
    align-items: center;
    inline-size: 100vw;
    margin-inline: calc(50% - 50vw);
    padding-inline: 60px
  }
}
.p-recruit-fv__title--en {
  font-family: var(--font-en);
  font-optical-sizing: auto;
  font-size: clamp(7rem,2.766rem + 10.857vw,18.4rem);
  font-style: normal;
  font-weight: 400;
  letter-spacing: -.02em;
  line-height: 0;
  text-transform: uppercase
}
@media screen and (min-width:768px) {
  .p-recruit-fv__title--en .--02 {
    margin-left: 1em!important
  }
}
@media screen and (min-width:1024px) {
  .p-recruit-fv__title--en .--02 {
    margin-left: 2.1em!important
  }
}
.p-recruit-fv__title {
  font-size: clamp(2rem,1.406rem + 1.524vw,3.6rem);
  letter-spacing: -.4px;
  line-height: 180%
}
@media screen and (min-width:768px) {
  .p-recruit-fv__title {
    letter-spacing: -.72px;
    margin-inline-start: -43px
  }
}
.p-recruit-start {
  padding-block-end: clamp(6.2rem,1.074rem + 13.143vw,20rem)
}
@media screen and (min-width:768px) {
  .p-recruit-start {
    margin-inline-start: 28px;
    padding-block-start: 90px
  }
}
.p-recruit-start__text {
  font-size: clamp(1.6rem,1.451rem + .381vw,2rem);
  line-height: 180%;
  max-inline-size: 736px
}
@media screen and (min-width:768px) {
  .p-recruit-start__text {
    display: grid;
    line-height: 210%;
    place-content: center
  }
}
.p-recruit-start__text p + p {
  margin-block-start: 30px
}
@media screen and (min-width:768px) {
  .p-recruit-start__text p + p {
    margin-block-start: 42px
  }
}
.char {
  display: inline-block;
  white-space: pre
}
@media screen and (min-width:768px) {
  .p-recruit-reward {
    position: relative
  }
  .p-recruit-reward::after {
    background: var(--line-color);
    block-size: 1px;
    content: "";
    inline-size: 100%;
    left: 50%;
    position: absolute;
    top: 0;
    translate: -50%
  }
  .p-recruit-reward::before {
    background: var(--line-color);
    block-size: 1px;
    bottom: 0;
    content: "";
    inline-size: 100%;
    left: 50%;
    position: absolute;
    translate: -50%
  }
}
.p-recruit-reward__line {
  background: var(--line-color);
  block-size: 1px;
  inline-size: 100%;
  position: relative
}
@media screen and (min-width:1024px) {
  .p-recruit-flow__inner,
  .p-recruit-message__inner,
  .p-recruit-reward__inner,
  .p-recruit-work__inner {
    padding-inline: 0
  }
}
.p-recruit-reward__items {
  display: grid;
  grid-template-areas: "a a a a a" "b b b c c" "b b b . ." "d d d d d" ". . f f f" "e e f f f" "g g g g ." "k h h h h" "i i i i l" "j j j j m";
  grid-template-columns: repeat(5,1fr);
  grid-template-rows: auto;
  inline-size: 100vw;
  margin-inline: calc(50% - 50vw);
  position: relative
}
@media screen and (min-width:768px) {
  .p-recruit-reward__items {
    grid-template-areas: "a a b ." "f d c c " "e d j ." "g h i .";
    grid-template-columns: 33% 36% 31% minmax(0,160px)
  }
  .p-recruit-reward__items::before {
    background: var(--line-color);
    block-size: 100%;
    content: "";
    inline-size: 1px;
    left: 0;
    position: absolute;
    top: 0
  }
  .p-recruit-reward__items::after {
    background: var(--line-color);
    block-size: 100%;
    content: "";
    inline-size: 1px;
    position: absolute;
    right: 0;
    top: 0
  }
}
@media screen and (min-width:1024px) {
  .p-recruit-reward__items {
    grid-template-columns: 31% 35% 29% minmax(0,160px);
    inline-size: revert;
    margin-inline: auto
  }
}
@media screen and (min-width:1280px) {
  .p-recruit-reward__items {
    grid-template-columns: 28.4% 30.43% 27.32% minmax(0,166px)
  }
}
.p-recruit-reward__item.item--b,
.p-recruit-reward__item.item--f,
.p-recruit-reward__item.item--g,
.p-recruit-reward__item.item--h,
.p-recruit-reward__item.item--j {
  display: flex;
  flex-direction: column;
  gap: clamp(.8rem,.206rem + 1.524vw,2.4rem);
  padding: 24px 24px 32px 24px
}
@media screen and (min-width:1280px) {
  .p-recruit-reward__item.item--b,
  .p-recruit-reward__item.item--f,
  .p-recruit-reward__item.item--g,
  .p-recruit-reward__item.item--h,
  .p-recruit-reward__item.item--j {
    padding: 40px 32px 40px 36px
  }
}
.p-recruit-reward__item.item--c,
.p-recruit-reward__item.item--d,
.p-recruit-reward__item.item--e,
.p-recruit-reward__item.item--i {
  overflow: hidden;
  position: relative
}
.p-recruit-reward__item.item--c img,
.p-recruit-reward__item.item--d img,
.p-recruit-reward__item.item--e img,
.p-recruit-reward__item.item--i img {
  block-size: 100%;
  display: block;
  inline-size: 100%;
  left: 0;
  position: absolute;
  top: 0
}
.p-recruit-reward__item.item--a {
  grid-area: a;
  padding-block: 24px;
  text-align: center
}
@media screen and (min-width:768px) {
  .p-recruit-reward__item.item--a {
    padding-block: 37px
  }
}
.p-recruit-reward__item.item--b {
  grid-area: b;
  position: relative
}
.p-recruit-reward__item.item--b::after,
.p-recruit-reward__item.item--b::before {
  background: var(--line-color);
  content: "";
  position: absolute;
  top: 0
}
.p-recruit-reward__item.item--b::before {
  block-size: 1px;
  inline-size: 150%;
  left: 0
}
@media screen and (min-width:768px) {
  .p-recruit-reward__item.item--b::before {
    block-size: 100%;
    bottom: 0;
    inline-size: 1px
  }
}
.p-recruit-reward__item.item--b::after {
  block-size: 100%;
  inline-size: 1px;
  right: 0
}
.p-recruit-reward__item.item--c {
  grid-area: c;
  z-index: 2
}
@media screen and (max-width:767px) {
  .p-recruit-reward__item.item--c {
    aspect-ratio: 156/132
  }
}
.p-recruit-reward__item.item--d {
  grid-area: d;
  z-index: 2
}
@media screen and (max-width:767px) {
  .p-recruit-reward__item.item--d {
    aspect-ratio: 390/265
  }
}
.p-recruit-reward__item.item--e {
  grid-area: e;
  z-index: 2
}
@media screen and (max-width:767px) {
  .p-recruit-reward__item.item--e {
    aspect-ratio: 156/132
  }
}
.p-recruit-reward__item.item--f {
  grid-area: f;
  position: relative
}
.p-recruit-reward__item.item--f::after,
.p-recruit-reward__item.item--f::before {
  background: var(--line-color);
  content: "";
  position: absolute;
  top: 0
}
.p-recruit-reward__item.item--f::before {
  block-size: 100%;
  inline-size: 1px;
  left: 0
}
@media screen and (min-width:768px) {
  .p-recruit-reward__item.item--f::before {
    block-size: 1px;
    inline-size: 100vw;
    inline-size: 125%;
    left: 0
  }
}
.p-recruit-reward__item.item--f::after {
  block-size: 1px;
  bottom: 0;
  inline-size: 100vw;
  left: 0;
  top: revert;
  z-index: 1
}
.p-recruit-reward__item.item--g {
  grid-area: g;
  position: relative
}
@media screen and (min-width:768px) {
  .p-recruit-reward__item.item--g {
    padding-inline-end: 27px
  }
}
.p-recruit-reward__item.item--g::after,
.p-recruit-reward__item.item--g::before {
  background: var(--line-color);
  content: "";
  position: absolute
}
.p-recruit-reward__item.item--g::before {
  block-size: 1px;
  bottom: 0;
  inline-size: 125%;
  left: 0
}
@media screen and (min-width:768px) {
  .p-recruit-reward__item.item--g::before {
    bottom: revert;
    inline-size: 100vw;
    top: 0
  }
}
.p-recruit-reward__item.item--g::after {
  block-size: 100%;
  inline-size: 1px;
  right: 0;
  top: 0
}
.p-recruit-reward__item.item--h {
  grid-area: h;
  position: relative
}
.p-recruit-reward__item.item--h::after,
.p-recruit-reward__item.item--h::before {
  background: var(--line-color);
  content: "";
  position: absolute
}
.p-recruit-reward__item.item--h::before {
  block-size: 1px;
  bottom: 0;
  inline-size: 125%;
  right: 0
}
@media screen and (min-width:768px) {
  .p-recruit-reward__item.item--h::before {
    content: none
  }
}
.p-recruit-reward__item.item--h::after {
  block-size: 100%;
  inline-size: 1px;
  left: 0;
  top: 0
}
@media screen and (min-width:768px) {
  .p-recruit-reward__item.item--h::after {
    left: revert;
    right: 0
  }
}
.p-recruit-reward__item.item--i {
  grid-area: i
}
@media screen and (max-width:767px) {
  .p-recruit-reward__item.item--i {
    aspect-ratio: 324/223
  }
}
.p-recruit-reward__item.item--j {
  grid-area: j;
  position: relative
}
.p-recruit-reward__item.item--j::before {
  background: var(--line-color);
  block-size: 1px;
  content: "";
  inline-size: 125%;
  left: 0;
  position: absolute;
  top: 0
}
@media screen and (min-width:768px) {
  .p-recruit-reward__item.item--j::before {
    block-size: 100%;
    inline-size: 1px
  }
}
.p-recruit-reward__item.item--j::after {
  background: var(--line-color);
  block-size: 100%;
  content: "";
  inline-size: 1px;
  position: absolute;
  right: 0;
  top: 0
}
.p-recruit-reward__heading {
  font-size: clamp(1.8rem,1.726rem + .19vw,2rem);
  line-height: 150%
}
.p-recruit-work {
  padding-block-start: clamp(6.4rem,4.32rem + 5.333vw,12rem)
}
.p-recruit-work__line.--01 {
  margin-block-start: 16px
}
.p-recruit-work__items {
  display: grid;
  grid-template-columns: repeat(1,1fr)
}
@media screen and (max-width:767px) {
  .p-recruit-work__items {
    inline-size: 100vw;
    margin-inline: calc(50% - 50vw)
  }
}
@media screen and (min-width:768px) {
  .p-recruit-work__items {
    grid-template-columns: repeat(2,1fr)
  }
}
.p-recruit-work__item {
  display: flex;
  flex-direction: column;
  gap: clamp(1.6rem,1.303rem + .762vw,2.4rem);
  padding: 32px 24px 40px
}
@media screen and (max-width:767px) {
  .p-recruit-work__item:not(:last-child) {
    border-block-end: 1px solid var(--line-color)
  }
}
@media screen and (min-width:768px) {
  .p-recruit-work__item {
    border-inline-start: 1px solid var(--line-color);
    padding: 32px
  }
  .p-recruit-work__item:nth-child(1),
  .p-recruit-work__item:nth-child(2) {
    border-block-end: 1px solid var(--line-color)
  }
}
.p-recruit-work__titleWrap {
  display: flex;
  flex-direction: column;
  gap: clamp(.8rem,.503rem + .762vw,1.6rem)
}
.p-recruit-work__title {
  font-size: clamp(2rem,1.851rem + .381vw,2.4rem);
  line-height: 150%
}
@media screen and (min-width:768px) {
  .p-recruit-work__title {
    letter-spacing: -.02em;
    line-height: 100%
  }
}
.p-recruit-work__text {
  align-self: stretch
}
.p-recruit-work__post {
  margin-block-start: clamp(1.6rem,1.006rem + 1.524vw,3.2rem)
}
.p-recruit-story {
  margin-block-start: clamp(6.4rem,3.429rem + 7.619vw,14.4rem);
  overflow: visible
}
@media screen and (min-width:1024px) {
  .p-recruit-story__inner {
    padding-inline: 0 40px
  }
}
.p-recruit-story__headWrap {
  align-items: baseline;
  display: flex;
  flex-direction: column;
  gap: clamp(1.6rem,1.303rem + .762vw,2.4rem)
}
.p-recruit-story__swiper .swiper-slide-duplicate h3,
.p-recruit-story__swiper .swiper-slide-duplicate h4,
.p-recruit-story__swiper .swiper-slide-duplicate h5,
.p-recruit-story__swiper .swiper-slide-duplicate h6 {
  display: none
}
.p-recruit-story__swiper,
.p-recruit-story__swiper-container,
.p-recruit-story__swiper-slide,
.p-recruit-story__swiper-wrapper {
  position: relative
}
.p-recruit-story__slideContainer {
  margin-block-start: clamp(.8rem,.206rem + 1.524vw,2.4rem)
}
.p-recruit-story__slideContainer .swiper-slide {
  block-size: auto;
  display: grid;
  grid-template-rows: 1fr
}
.swiper.p-recruit-story__swiper {
  overflow: visible
}
.p-recruit-story__swiperWrap {
  display: flex
}
.p-recruit-story__swiper:not(.swiper-initialized) .p-recruit-story__swiperWrap {
  gap: 16px
}
.p-recruit-story__slide {
  block-size: -moz-fit-content;
  block-size: fit-content;
  display: flex;
  flex-direction: column;
  inline-size: 317px
}
.p-recruit-story__link {
  align-items: stretch;
  background: var(--white);
  block-size: 100%;
  display: flex;
  flex-direction: column;
  inline-size: 100%;
  padding: 16px 16px 46px 16px;
  position: relative
}
.p-recruit-story__link::after {
  content: "";
  position: absolute;
  -webkit-mask-image: url(../img/common/icon-link.svg);
  mask-image: url(../img/common/icon-link.svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  aspect-ratio: 19/14;
  background: var(--text-color);
  bottom: 16px;
  inline-size: 19px;
  mask-size: contain;
  right: 16px;
  transition: scale var(--hover-transition) cubic-bezier(.83,0,.17,1) 0s;
  will-change: scale
}
.p-recruit-story__link:focus-visible .p-recruit-story__img {
  scale: 1.04
}
.p-recruit-story__link:focus-visible::after {
  scale: 1.2
}
@media (any-hover:hover) {
  .p-recruit-story__link:hover .p-recruit-story__img img {
    scale: 1.04
  }
  .p-recruit-story__link:hover::after {
    scale: 1.1
  }
}
.p-recruit-story__slideContents {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  gap: 16px
}
.p-recruit-story__img {
  aspect-ratio: 285/124;
  inline-size: 100%;
  overflow: hidden
}
.p-recruit-story__img img {
  transition: scale var(--hover-transition) cubic-bezier(.83,0,.17,1) 0s;
  vertical-align: middle;
  will-change: scale
}
.p-recruit-story__title {
  display: -webkit-box;
  flex-grow: 1;
  font-size: 1.4rem;
  line-height: 180%;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  align-self: stretch;
  overflow: hidden;
  text-overflow: ellipsis
}
.swiper-button-next,
.swiper-button-prev,
.swiper-pagination-bullets.swiper-pagination-horizontal {
  bottom: unset;
  left: unset;
  margin: 0;
  padding: 0;
  right: unset;
  top: unset
}
.swiper-button-next::after,
.swiper-button-prev::after {
  content: ""
}
.p-recruit-story__navWrap {
  align-items: center;
  display: flex;
  gap: 32px;
  padding-block-end: 8px
}
@media screen and (min-width:768px) {
  .p-recruit-story__navWrap {
    padding-block-end: 0
  }
}
.p-recruit-story__navWrap span {
  font-size: 2rem;
  line-height: 210%
}
.p-recruit-story__buttons {
  block-size: 16px;
  inline-size: 74px;
  position: relative
}
.p-recruit-story__buttons::after {
  background: var(--line-color);
  block-size: 100%;
  content: "";
  display: block;
  inline-size: 1px;
  left: 50%;
  position: absolute;
  top: 50%;
  translate: -50% -50%
}
.p-recruit-story__next,
.p-recruit-story__prev {
  aspect-ratio: 13/11;
  display: block;
  inline-size: 13px;
  overflow: hidden;
  position: absolute;
  top: 50%;
  translate: 0 -50%
}
.p-recruit-story__next .c-swiper__arrowWrap,
.p-recruit-story__prev .c-swiper__arrowWrap {
  block-size: 100%;
  inline-size: 100%;
  overflow: hidden;
  position: relative
}
.p-recruit-story__next .c-btn__arrow,
.p-recruit-story__prev .c-btn__arrow {
  left: 0;
  position: absolute;
  top: 0;
  transition: opacity var(--hover-transition) cubic-bezier(.83,0,.17,1),transform var(--hover-transition) cubic-bezier(.83,0,.17,1)
}
.p-recruit-story__next .c-btn__arrow.--hover,
.p-recruit-story__prev .c-btn__arrow.--hover {
  opacity: 0;
  transform: translateX(-10px)
}
.p-recruit-story__next:focus-visible .c-btn__arrow,
.p-recruit-story__prev:focus-visible .c-btn__arrow {
  opacity: 0;
  transform: translateX(10px)
}
.p-recruit-story__next:focus-visible .c-btn__arrow.--hover,
.p-recruit-story__prev:focus-visible .c-btn__arrow.--hover {
  opacity: 1;
  transform: translateX(0)
}
@media (any-hover:hover) {
  .p-recruit-story__next:hover .c-btn__arrow,
  .p-recruit-story__prev:hover .c-btn__arrow {
    opacity: 0;
    transform: translateX(10px)
  }
  .p-recruit-story__next:hover .c-btn__arrow.--hover,
  .p-recruit-story__prev:hover .c-btn__arrow.--hover {
    opacity: 1;
    transform: translateX(0)
  }
}
.p-recruit-story__prev {
  left: 0;
  rotate: 180deg
}
.p-recruit-story__next {
  right: 0
}
.p-recruit-flow {
  padding-block: clamp(5.6rem,3.223rem + 6.095vw,12rem) clamp(5.6rem,1.737rem + 9.905vw,16rem)
}
.p-recruit-flow__line.--01 {
  margin-block-start: 32px
}
.p-recruit-flow__items {
  display: grid;
  grid-template-columns: repeat(1,1fr)
}
@media screen and (max-width:767px) {
  .p-recruit-flow__items {
    inline-size: 100vw;
    margin-inline: calc(50% - 50vw)
  }
}
@media screen and (min-width:768px) {
  .p-recruit-flow__items {
    grid-template-columns: repeat(3,1fr)
  }
}
.p-recruit-flow__item {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 28px 24px 40px 24px
}
@media screen and (max-width:767px) {
  .p-recruit-flow__item:not(:last-child) {
    border-block-end: 1px solid var(--line-color)
  }
}
@media screen and (min-width:768px) {
  .p-recruit-flow__item {
    border-inline-start: 1px solid var(--line-color);
    padding: 28px 30px 30px
  }
  .p-recruit-flow__item:last-child {
    border-inline-end: 1px solid var(--line-color)
  }
}
.p-recruit-flow__titleWrap {
  display: flex;
  flex-direction: column;
  gap: 8px
}
.p-recruit-flow__title {
  font-size: 2rem;
  line-height: 150%
}
.p-recruit-message {
  background: url(../img/recruit/message-sp.jpg) no-repeat center center/cover;
  padding-block: clamp(6.4rem,2.834rem + 9.143vw,16rem)
}
@media screen and (min-width:768px) {
  .p-recruit-message {
    background: url(../img/recruit/message.jpg) no-repeat center center/cover
  }
}
.p-recruit-message__contents {
  color: var(--white);
  display: flex;
  flex-direction: column;
  gap: 40px
}
.p-recruit-message__titleWrap {
  display: flex;
  flex-direction: column;
  gap: clamp(1.6rem,.709rem + 2.286vw,4rem)
}
.p-recruit-message__heading {
  font-size: clamp(2.4rem,1.806rem + 1.524vw,4rem);
  inline-size: 100%;
  line-height: 150%;
  max-inline-size: 620px
}
.p-recruit-message__text {
  font-size: 1.4rem;
  line-height: 210%;
  max-inline-size: 532px
}
@media screen and (min-width:1920px) {
  .p-recruit-message__text {
    font-size: 1.6rem
  }
}
.p-recruit-message__text p + p {
  margin-block-start: 28px
}
.p-recruit-entry {
  margin-block: clamp(6.2rem,4.64rem + 4vw,10.4rem) clamp(5.6rem,3.631rem + 5.048vw,10.9rem);
  margin-inline: 24px
}
@media screen and (min-width:768px) {
  .p-recruit-entry {
    margin-inline: 32px
  }
}
.p-recruit-entry__link {
  border: 1px solid var(--gray);
  display: block;
  padding: clamp(6.4rem,4.914rem + 3.81vw,10.4rem) clamp(2.2rem,1.531rem + 1.714vw,4rem);
  transition-duration: .6s;
  transition-property: color,scale,background-color
}
.p-recruit-entry__link:focus-visible {
  background: var(--text-color)
}
.p-recruit-entry__link .c-btn__arrow path {
  fill: var(--white);
  transition: fill var(--hover-transition) cubic-bezier(.83,0,.17,1) 0s
}
.p-recruit-entry__link:focus-visible {
  background: var(--text-color);
  color: var(--white);
  scale: .99
}
.p-recruit-entry__link:focus-visible .c-btn {
  color: var(--white)
}
.p-recruit-entry__link:focus-visible .c-btn__circle {
  background: var(--white)
}
.p-recruit-entry__link:focus-visible .c-btn__link {
  color: var(--text-color)
}
@media (any-hover:hover) {
  .p-recruit-entry__link:hover {
    background: var(--text-color);
    color: var(--white);
    scale: .99
  }
  .p-recruit-entry__link:hover .c-btn {
    color: var(--white)
  }
  .p-recruit-entry__link:hover .c-btn__circle {
    background: var(--white)
  }
  .p-recruit-entry__link:hover .c-btn__link {
    color: var(--text-color)
  }
}
.p-recruit-entry__contents {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: clamp(2.4rem,1.806rem + 1.524vw,4rem)
}
.p-recruit-entry__title {
  text-align: center;
  text-wrap: balance
}
.p-recruit-entry__text {
  font-size: 1.4rem;
  line-height: 210%
}
@media screen and (min-width:768px) {
  .p-recruit-entry__text {
    text-align: center
  }
}
@media screen and (min-width:1920px) {
  .p-recruit-entry__text {
    font-size: 1.6rem
  }
}
.p-tabPost__tabContents {
  padding-block-start: clamp(6.4rem,4.32rem + 5.333vw,12rem)
}
.hidden-tab {
  display: none!important
}
.p-tabPost__tabList {
  display: flex;
  flex-shrink: 0;
  flex-wrap: nowrap;
  position: relative
}
@media screen and (min-width:768px) {
  .p-tabPost__tabList {
    gap: 16px
  }
}
.p-tabPost__tabList::after {
  background: var(--line-color);
  block-size: 1px;
  bottom: 0;
  content: "";
  inline-size: 100vw;
  left: 0;
  margin-inline: calc(50% - 50vw);
  position: absolute
}
.p-tabPost__tab {
  background: var(--base-color);
  block-size: auto;
  border-block-start: 1px solid var(--line-color);
  border-inline: 1px solid var(--line-color);
  color: var(--dark-gray);
  display: inline-block;
  font-size: clamp(1.4rem,1.326rem + .19vw,1.6rem);
  inline-size: clamp(17.1rem,11.863rem + 13.429vw,31.2rem);
  min-inline-size: 171px;
  padding-block: 12px 14px;
  text-align: center;
  transition: all var(--hover-transition) cubic-bezier(.83,0,.17,1) 0s
}
@media screen and (min-width:768px) {
  .p-tabPost__tab {
    padding-block: 16px 18px
  }
}
.p-tabPost__tab[role=tab][aria-selected=true] {
  background: var(--text-color);
  border-color: var(--text-color);
  color: var(--white)
}
.p-tabPost__tab:focus-visible {
  opacity: var(--opacity-06)
}
@media (any-hover:hover) {
  .p-tabPost__tab:not([aria-selected=true]):hover {
    opacity: var(--opacity-06)
  }
}
.p-tabPost__tabpanelWrapper {
  margin-block-start: clamp(3.2rem,2.011rem + 3.048vw,6.4rem)
}
.p-tabPost__tabpanel {
  display: block;
  grid-column: 1/-1
}
@media screen and (min-width:768px) {
  .p-tabPost__tabpanel {
    width: 100%
  }
}
.p-tabPost__tabpanel:target {
  display: revert
}
.p-tabPost__cards {
  display: grid;
  gap: 3.2rem;
  grid-template-columns: 1fr;
  width: 100%
}
.p-tabPost__link {
  display: flex;
  flex-direction: column
}
@media screen and (min-width:768px) {
  .p-tabPost__link {
    align-items: stretch;
    flex-direction: row
  }
}
.p-tabPost__link:focus-visible .p-tabPost__contents {
  background: var(--light-gray)
}
.p-tabPost__link:focus-visible .p-tabPost__thumb img {
  scale: 1.02
}
@media (any-hover:hover) {
  .p-tabPost__link:hover .p-tabPost__contents {
    background: var(--light-gray)
  }
  .p-tabPost__link:hover .p-tabPost__thumb img {
    scale: 1.02
  }
  .p-tabPost__link:hover .c-arrow {
    opacity: 0;
    transform: translate(10px,-10px) rotate(-45deg)
  }
  .p-tabPost__link:hover .c-arrow.--hover {
    opacity: 1;
    transform: translate(0,0) rotate(-45deg)
  }
}
.p-tabPost__thumb {
  aspect-ratio: 342/250;
  flex-shrink: 0;
  overflow: hidden
}
@media screen and (min-width:768px) {
  .p-tabPost__thumb {
    align-self: stretch;
    aspect-ratio: unset;
    flex: 45.7%
  }
}
.p-tabPost__thumb img {
  transition: scale var(--hover-transition) cubic-bezier(.83,0,.17,1);
  will-change: scale
}
.p-tabPost__contents {
  background: var(--white);
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 24px 6.154vw 56px;
  position: relative;
  transition: background-color var(--hover-transition) cubic-bezier(.83,0,.17,1)
}
@media screen and (min-width:768px) {
  .p-tabPost__contents {
    flex: 54.2%;
    justify-content: revert;
    padding: 24px
  }
}
@media screen and (min-width:1024px) {
  .p-tabPost__contents {
    padding: 32px 56px 32px 40px
  }
}
.p-tabPost__textWrap {
  display: flex;
  flex-direction: column;
  gap: 22px;
  height: 100%;
  justify-content: space-between
}
@media screen and (min-width:1024px) {
  .p-tabPost__textWrap {
    gap: clamp(2.2rem,1.011rem + 3.048vw,5.4rem)
  }
}
.p-tabPost__headWrap {
  display: flex;
  flex-direction: column;
  gap: 16px
}
.p-tabPost__titleWrap {
  display: flex;
  flex-direction: column;
  gap: 16px
}
@media screen and (min-width:768px) {
  .p-tabPost__titleWrap {
    gap: 8px
  }
}
.p-tabPost__titleWrap .c-casestudy__title {
  font-size: clamp(1.8rem,1.726rem + .19vw,2rem)
}
.p-tabPost__logo {
  aspect-ratio: 1;
  inline-size: 46px;
  overflow: hidden
}
.p-tabPost__logo img {
  height: 100%;
  width: 100%;
  -o-object-fit: contain;
  object-fit: contain
}
.p-tabPost__lists {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  gap: 4px
}
.p-tabPost__list {
  align-self: start;
  display: grid;
  gap: 16px;
  grid-template-columns: 55px 1fr
}
@media screen and (min-width:1024px) {
  .p-tabPost__list {
    grid-template-columns: 70px 1fr
  }
}
.p-tabPost__label {
  color: var(--dark-gray);
  display: block;
  font-family: var(--font-en);
  font-optical-sizing: auto;
  font-size: 1.2rem;
  font-style: normal;
  font-weight: 400;
  line-height: 0;
  line-height: normal;
  text-transform: uppercase
}
@media screen and (min-width:768px) {
  .p-tabPost__label {
    font-size: 1.1rem
  }
}
.p-tabPost__value {
  color: var(--dark-gray);
  font-size: 1.2rem
}
@media screen and (min-width:768px) {
  .p-tabPost__value {
    font-size: 1.1rem
  }
}
.p-tabPost__value--scopes {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap
}
.p-tabPost__scope-separator {
  color: var(--dark-gray);
  margin-inline: 0
}
.p-tabPost__arrowWrap {
  bottom: 22px;
  position: absolute;
  right: 18px
}
.p-tabPost__pagination {
  margin-block-start: clamp(5.6rem,2.109rem + 8.952vw,15rem)
}
.p-casestudy-single {
  margin-block-start: 100px;
  margin-inline: auto;
  max-inline-size: 1008px
}
@media screen and (min-width:768px) {
  .p-casestudy-single {
    margin-block-start: 110px
  }
}
.p-casestudy-single__contents {
  display: flex;
  flex-direction: column;
  gap: clamp(2.4rem,1.806rem + 1.524vw,4rem);
  margin-block-start: clamp(3.2rem,1.046rem + 5.524vw,9rem);
  padding-block-end: clamp(4rem,2.217rem + 4.571vw,8.8rem);
  position: relative
}
.p-casestudy-single__contents::after {
  background: var(--line-color);
  block-size: 1px;
  bottom: 0;
  content: "";
  inline-size: 100vw;
  left: 0;
  margin-inline: calc(50% - 50vw);
  position: absolute
}
.p-casestudy-single__mainImg {
  aspect-ratio: 342/228;
  inline-size: 100%
}
@media screen and (min-width:768px) {
  .p-casestudy-single__mainImg {
    aspect-ratio: 928/619
  }
}
.p-casestudy-single__title {
  font-size: clamp(2rem,1.554rem + 1.143vw,3.2rem);
  line-height: 180%
}
.p-casestudy-single__lists {
  display: flex;
  flex-direction: column;
  gap: clamp(.4rem,-.046rem + 1.143vw,1.6rem)
}
.p-casestudy-single__list {
  align-items: self-start;
  display: grid;
  gap: 16px;
  grid-template-columns: 60px 1fr
}
@media screen and (min-width:768px) {
  .p-casestudy-single__list {
    grid-template-columns: 80px 1fr
  }
}
.p-casestudy-single__label {
  color: var(--gray);
  font-family: var(--font-en);
  font-optical-sizing: auto;
  font-size: 1.3rem;
  font-style: normal;
  font-weight: 400;
  line-height: 0;
  line-height: 1.8;
  text-transform: uppercase
}
@media screen and (min-width:768px) {
  .p-casestudy-single__label {
    font-size: 1.2rem
  }
}
@media screen and (min-width:1920px) {
  .p-casestudy-single__label {
    font-size: 1.4rem
  }
}
.p-casestudy-single__value {
  font-size: 1.3rem;
  overflow-wrap: anywhere;
  word-wrap: break-word;
  word-break: break-all
}
@media screen and (min-width:768px) {
  .p-casestudy-single__value {
    font-size: 1.4rem
  }
}
.p-casestudy-single__value--scopes {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  row-gap: 1px;
  -moz-column-gap: 5px;
  column-gap: 5px
}
.p-casestudy-single__value a {
  overflow-wrap: anywhere;
  word-wrap: break-word;
  text-decoration: underline;
  white-space: normal;
  word-break: break-all
}
.p-casestudy-single__value a:focus-visible {
  opacity: var(--opacity-06)
}
@media (any-hover:hover) {
  .p-casestudy-single__value a:hover {
    opacity: var(--opacity-06)
  }
}
.p-casestudy-single__scope-separator {
  color: var(--gray);
  margin-inline: 0
}
.p-casestudy-single__infoWrap {
  background: var(--light-gray);
  display: flex;
  flex-direction: column;
  gap: clamp(2.4rem,1.509rem + 2.286vw,4.8rem);
  padding: clamp(2.4rem,1.806rem + 1.524vw,4rem) clamp(2.4rem,1.211rem + 3.048vw,5.6rem) 40px clamp(2.4rem,1.211rem + 3.048vw,5.6rem)
}
@media screen and (min-width:768px) {
  .p-casestudy-single__infoWrap {
    align-items: center;
    flex-direction: row
  }
}
.p-casestudy-single__logo {
  align-items: center;
  background: var(--white);
  block-size: clamp(7.8rem,7.057rem + 1.905vw,9.8rem);
  border-radius: calc(infinity * 1px);
  display: flex;
  flex-shrink: 0;
  inline-size: clamp(7.8rem,7.057rem + 1.905vw,9.8rem);
  justify-content: center;
  overflow: hidden
}
.p-casestudy-single__logo img {
  block-size: 100%;
  inline-size: 100%;
  -o-object-fit: contain;
  object-fit: contain;
  padding: 16px;
  vertical-align: middle
}
@media screen and (min-width:768px) {
  .p-casestudy-single__logo img {
    padding: 20px
  }
}
.p-casestudy-single__items {
  display: flex;
  flex-direction: column;
  gap: 8px
}
@media screen and (min-width:1024px) {
  .p-casestudy-single__items {
    align-items: flex-start;
    display: flex;
    flex-direction: row;
    gap: 40px;
    justify-content: space-between
  }
}
.p-casestudy-single__items--col {
  display: contents
}
@media screen and (min-width:768px) {
  .p-casestudy-single__items--col {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 8px
  }
  .p-casestudy-single__items--col:nth-child(2) {
    max-inline-size: 310px
  }
}
.p-casestudy-single__item {
  align-items: start;
  display: grid;
  gap: 16px;
  grid-template-columns: 80px minmax(210px,1fr)
}
@media screen and (min-width:768px) {
  .p-casestudy-single__item {
    -moz-column-break-inside: avoid;
    break-inside: avoid;
    page-break-inside: avoid
  }
}
.p-casestudy-single__item .p-casestudy-single__label {
  font-family: var(--font-ja);
  font-size: 1.3rem;
  font-weight: 500;
  line-height: normal
}
@media screen and (min-width:768px) {
  .p-casestudy-single__item .p-casestudy-single__label {
    font-size: 1.4rem;
    white-space: wrap
  }
}
.p-casestudy-single__postContent {
  margin-block-start: clamp(4rem,2.217rem + 4.571vw,8.8rem);
  padding-block-end: clamp(4.8rem,2.869rem + 4.952vw,10rem);
  position: relative
}
.p-casestudy-single__postContent::after {
  background: var(--line-color);
  block-size: 1px;
  bottom: 0;
  content: "";
  inline-size: 100vw;
  left: 0;
  margin-inline: calc(50% - 50vw);
  position: absolute
}
.p-casestudy-single__postContent p {
  color: var(--post-text-color);
  font-size: clamp(1.4rem,1.326rem + .19vw,1.6rem);
  font-weight: 500;
  line-height: 180%
}
.p-casestudy-single__postContent h2 {
  font-size: clamp(2rem,1.703rem + .762vw,2.8rem);
  font-weight: 500;
  line-height: 180%
}
.p-casestudy-single__postContent h3 {
  font-size: clamp(1.6rem,1.451rem + .381vw,2rem);
  font-style: normal;
  font-weight: 500;
  line-height: 150%;
  padding-inline-start: clamp(6rem,5.257rem + 1.905vw,8rem);
  position: relative
}
@media screen and (min-width:768px) {
  .p-casestudy-single__postContent h3 {
    line-height: normal
  }
}
.p-casestudy-single__postContent h3::before {
  background: var(--text-color);
  block-size: 1px;
  content: "";
  inline-size: clamp(4.4rem,3.657rem + 1.905vw,6.4rem);
  left: 0;
  position: absolute;
  top: 12px
}
@media screen and (min-width:768px) {
  .p-casestudy-single__postContent h3::before {
    top: 13px
  }
}
.p-casestudy-single__postContent .wp-block-image {
  block-size: auto;
  inline-size: 100%
}
.p-casestudy-single__postContent p.is-style-callout {
  background: #ececec!important
}
.p-casestudy-single__btnWrap {
  block-size: 100%;
  display: flex;
  flex-direction: column;
  gap: clamp(5.2rem,5.051rem + .381vw,5.6rem);
  margin-block: clamp(6.4rem,5.806rem + 1.524vw,8rem)
}
.p-casestudy-single__nav {
  align-items: stretch;
  block-size: 100%;
  display: grid;
  gap: clamp(.8rem,.206rem + 1.524vw,2.4rem);
  grid-template-columns: 1fr 1fr
}
.p-casestudy-single__nav.--only-next .p-casestudy-single__nav--item.--next {
  grid-column: 1;
  justify-self: start
}
.p-casestudy-single__nav.--only-prev .p-casestudy-single__nav--item.--prev {
  grid-column: 2;
  justify-self: end
}
.p-casestudy-single__nav--item {
  align-items: center;
  background: var(--white);
  block-size: 100%;
  display: flex;
  flex: 1;
  gap: clamp(.8rem,.206rem + 1.524vw,2.4rem);
  max-inline-size: 452px;
  padding: clamp(1.8rem,1.577rem + .571vw,2.4rem) clamp(.8rem,.206rem + 1.524vw,2.4rem) 28px clamp(1.6rem,1.006rem + 1.524vw,3.2rem);
  transition: opacity var(--hover-transition) cubic-bezier(.83,0,.17,1) 0s
}
@media screen and (min-width:768px) {
  .p-casestudy-single__nav--item {
    inline-size: 100%;
    max-inline-size: 452px
  }
}
.p-casestudy-single__nav--item.--next {
  flex-direction: row-reverse
}
.p-casestudy-single__nav--item:focus-visible {
  opacity: var(--opacity-06)
}
@media (any-hover:hover) {
  .p-casestudy-single__nav--item:hover {
    opacity: var(--opacity-06)
  }
}
.p-casestudy-single__nav--content {
  align-items: stretch;
  block-size: 100%;
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 8px
}
@media screen and (min-width:768px) {
  .p-casestudy-single__nav--content {
    gap: 16px
  }
}
.p-casestudy-single__nav--label {
  color: var(--gray);
  font-size: 1.2rem;
  line-height: normal
}
@media screen and (min-width:768px) {
  .p-casestudy-single__nav--label {
    font-size: 1.3rem
  }
}
.p-casestudy-single__nav--title {
  display: -webkit-box;
  font-size: clamp(1.3rem,1.189rem + .286vw,1.6rem);
  line-height: 180%;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  flex-grow: 1;
  overflow: hidden;
  text-overflow: ellipsis
}
.p-casestudy-single__nav--arrow {
  aspect-ratio: 14/11;
  inline-size: clamp(1.4rem,1.214rem + .476vw,1.9rem);
  position: relative
}
.p-casestudy-single__nav--arrow::before {
  content: "";
  position: absolute;
  -webkit-mask-image: url(../img/common/arrow.svg);
  mask-image: url(../img/common/arrow.svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  background: var(--text-color);
  block-size: 100%;
  inline-size: 100%;
  left: 50%;
  mask-size: contain;
  top: 50%;
  translate: -50% -50%
}
.p-casestudy-single__nav--arrow.--next::before {
  rotate: 180deg
}
.p-casestudy-single__btn {
  display: grid;
  place-content: center
}
.p-single {
  margin-block-start: -182px;
  position: relative;
  z-index: 1
}
@media screen and (min-width:768px) {
  .p-single {
    margin-block-start: -418px
  }
}
.p-single__breadcrumb .l-breadcrumb__lists {
  justify-content: flex-start
}
.p-single__breadcrumb .l-breadcrumb__inner {
  padding-inline-start: clamp(2.4rem,.32rem + 5.333vw,8rem)
}
.p-single__body {
  background: var(--white);
  display: flex;
  flex-direction: column;
  gap: 40px;
  margin-block-start: clamp(2.7rem,-.16rem + 7.333vw,10.4rem);
  padding: clamp(5.3rem,4.669rem + 1.619vw,7rem) clamp(2.4rem,.32rem + 5.333vw,8rem) clamp(5.3rem,4.297rem + 2.571vw,8rem)
}
.p-single__article {
  display: flex;
  flex-direction: column;
  gap: 40px
}
.p-single__titleWrap {
  border-block-end: 1px solid var(--line-color);
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding-block-end: 38px
}
.p-single__title {
  font-size: clamp(2rem,1.851rem + .381vw,2.4rem);
  line-height: 180%;
  order: 2
}
.p-single__content h2 {
  font-size: clamp(2rem,1.851rem + .381vw,2.4rem);
  font-weight: 500;
  line-height: 180%
}
.p-single__content h3 {
  font-size: clamp(1.6rem,1.451rem + .381vw,2rem);
  font-weight: 500;
  line-height: 180%;
  padding-block: 12px 4px
}
@media screen and (min-width:768px) {
  .p-single__content h3 {
    padding-block: 16px 8px
  }
}
.p-single__content .wp-block-image {
  block-size: auto;
  inline-size: 100%
}
.p-single__content p {
  color: var(--post-text-color);
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 180%
}
@media screen and (min-width:1920px) {
  .p-single__content p {
    font-size: 1.6rem
  }
}
.p-casestudy-single__postContent hr,
.p-single__content hr {
  border-top: 1px solid var(--line-color);
  margin-block: clamp(3.2rem,2.903rem + .762vw,4rem)
}
.p-casestudy-single__postContent blockquote,
.p-single__content blockquote {
  color: var(--post-text-color);
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 180%;
  margin-block: 8px 12px;
  padding: 3px 0 0 20px;
  position: relative
}
@media screen and (min-width:768px) {
  .p-casestudy-single__postContent blockquote,
  .p-single__content blockquote {
    margin-block: 8px 16px;
    padding-inline-start: 20px
  }
}
@media screen and (min-width:1920px) {
  .p-casestudy-single__postContent blockquote,
  .p-single__content blockquote {
    font-size: 1.6rem
  }
}
.p-casestudy-single__postContent blockquote p,
.p-single__content blockquote p {
  color: var(--post-text-color);
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 180%;
  padding: 0!important
}
@media screen and (min-width:1920px) {
  .p-casestudy-single__postContent blockquote p,
  .p-single__content blockquote p {
    font-size: 1.6rem
  }
}
.p-casestudy-single__postContent blockquote::before,
.p-single__content blockquote::before {
  background: var(--bg-gray);
  block-size: 100%;
  content: "";
  inline-size: 4px;
  left: 0;
  position: absolute;
  top: 50%;
  translate: 0 -50%
}
.p-casestudy-single__postContent strong,
.p-single__content strong {
  font-weight: 700
}
.p-casestudy-single__postContent em,
.p-single__content em {
  font-style: italic
}
.p-casestudy-single__postContent p a:not(.wp-block-button__link),
.p-single__content p a:not(.wp-block-button__link) {
  border-block-end: 1px solid currentColor
}
.p-casestudy-single__postContent a,
.p-single__content a {
  color: var(--dark-gray);
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 180%;
  transition: opacity var(--hover-transition) cubic-bezier(.83,0,.17,1)
}
@media screen and (min-width:1920px) {
  .p-casestudy-single__postContent a,
  .p-single__content a {
    font-size: 1.6rem
  }
}
.p-casestudy-single__postContent a:focus-visible,
.p-single__content a:focus-visible {
  opacity: var(--opacity-06)
}
@media (any-hover:hover) {
  .p-casestudy-single__postContent a:hover,
  .p-single__content a:hover {
    opacity: var(--opacity-06)
  }
}
.p-casestudy-single__postContent figcaption,
.p-single__content figcaption {
  color: var(--dark-gray);
  font-size: 1.3rem;
  font-weight: 500;
  line-height: 180%
}
@media screen and (min-width:768px) {
  .p-casestudy-single__postContent figcaption,
  .p-single__content figcaption {
    font-size: 1.2rem
  }
}
@media screen and (min-width:1920px) {
  .p-casestudy-single__postContent figcaption,
  .p-single__content figcaption {
    font-size: 1.4rem
  }
}
.p-casestudy-single__postContent ol,
.p-casestudy-single__postContent ul,
.p-single__content ol,
.p-single__content ul {
  padding-inline-start: clamp(1.6rem,1.303rem + .762vw,2.4rem)
}
.p-casestudy-single__postContent ul li,
.p-single__content ul li {
  color: var(--post-text-color);
  font-size: 1.4rem;
  list-style-type: disc
}
@media screen and (min-width:1920px) {
  .p-casestudy-single__postContent ul li,
  .p-single__content ul li {
    font-size: 1.6rem
  }
}
.p-casestudy-single__postContent ol,
.p-single__content ol {
  list-style-position: outside;
  list-style-type: decimal
}
.p-casestudy-single__postContent ol li,
.p-single__content ol li {
  color: var(--post-text-color);
  font-size: 1.4rem;
  padding-inline-start: 2px
}
@media screen and (min-width:1920px) {
  .p-casestudy-single__postContent ol li,
  .p-single__content ol li {
    font-size: 1.6rem
  }
}
.p-casestudy-single__postContent table,
.p-single__content table {
  display: block;
  inline-size: 100%;
  overflow-x: scroll
}
.p-casestudy-single__postContent table thead,
.p-single__content table thead {
  display: block
}
.p-casestudy-single__postContent table tbody,
.p-single__content table tbody {
  display: block
}
.p-casestudy-single__postContent table tr,
.p-single__content table tr {
  border-top: 1px solid var(--gray);
  display: flex;
  justify-content: space-between
}
.p-casestudy-single__postContent table tr:last-of-type,
.p-single__content table tr:last-of-type {
  border-bottom: 1px solid var(--gray)
}
.p-casestudy-single__postContent table td,
.p-casestudy-single__postContent table th,
.p-single__content table td,
.p-single__content table th {
  display: grid;
  place-items: center
}
.p-casestudy-single__postContent table th,
.p-single__content table th {
  background: var(--base-color);
  flex: 1;
  flex-shrink: 0;
  font-size: clamp(1.4rem,1.326rem + .19vw,1.6rem);
  font-weight: 700;
  line-height: 180%;
  min-width: 0;
  padding: 14px;
  white-space: nowrap
}
.p-casestudy-single__postContent table td,
.p-single__content table td {
  flex: 1;
  flex-shrink: 0;
  font-size: 1.6rem;
  line-height: 180%;
  padding: 14px
}
.p-casestudy-single__postContent p.is-style-callout,
.p-single__content p.is-style-callout {
  background: var(--base-color);
  color: var(--post-text-color);
  font-size: 1.4rem;
  line-height: 180%;
  margin-block: clamp(2.4rem,1.806rem + 1.524vw,4rem);
  padding: 24px 24px 32px 24px
}
@media screen and (min-width:1920px) {
  .p-casestudy-single__postContent p.is-style-callout,
  .p-single__content p.is-style-callout {
    font-size: 1.6rem
  }
}
.p-casestudy-single__postContent p.is-style-annotation,
.p-single__content p.is-style-annotation {
  color: var(--dark-gray);
  font-size: 1.2rem;
  line-height: 180%;
  margin-block: 8px 20px;
  padding-block: 0!important
}
@media screen and (min-width:1920px) {
  .p-casestudy-single__postContent p.is-style-annotation,
  .p-single__content p.is-style-annotation {
    font-size: 1.4rem
  }
}
.p-casestudy-single__postContent figcaption,
.p-single__content figcaption {
  color: var(--dark-gray);
  font-size: 1.2rem;
  line-height: 180%;
  margin-block-start: 8px;
  padding-block: 0!important
}
@media screen and (min-width:1920px) {
  .p-casestudy-single__postContent figcaption,
  .p-single__content figcaption {
    font-size: 1.4rem
  }
}
.p-casestudy-single__postContent h2,
.p-single__content h2 {
  margin-block-end: clamp(1.6rem,1.303rem + .762vw,2.4rem)
}
.p-casestudy-single__postContent h3,
.p-casestudy-single__postContent h4,
.p-single__content h3,
.p-single__content h4 {
  margin-block-end: 20px
}
.p-casestudy-single__postContent p + p,
.p-single__content p + p {
  margin-block-start: 20px
}
.p-casestudy-single__postContent figure,
.p-single__content figure {
  margin-block: clamp(2.4rem,1.806rem + 1.524vw,4rem)
}
.p-casestudy-single__postContent table,
.p-single__content table {
  margin-block: clamp(4rem,3.406rem + 1.524vw,5.6rem)
}
.p-casestudy-single__postContent div + ol,
.p-casestudy-single__postContent div + p,
.p-casestudy-single__postContent div + ul,
.p-casestudy-single__postContent ol + p,
.p-casestudy-single__postContent ol + ul,
.p-casestudy-single__postContent p + ol,
.p-casestudy-single__postContent p + ul,
.p-casestudy-single__postContent ul + ol,
.p-casestudy-single__postContent ul + p,
.p-single__content div + ol,
.p-single__content div + p,
.p-single__content div + ul,
.p-single__content ol + p,
.p-single__content ol + ul,
.p-single__content p + ol,
.p-single__content p + ul,
.p-single__content ul + ol,
.p-single__content ul + p {
  margin-block-start: clamp(2.4rem,2.103rem + .762vw,3.2rem)
}
.p-casestudy-single__postContent div + h2,
.p-casestudy-single__postContent figure + h2,
.p-casestudy-single__postContent ol + h2,
.p-casestudy-single__postContent p + h2,
.p-casestudy-single__postContent table + h2,
.p-casestudy-single__postContent ul + h2,
.p-single__content div + h2,
.p-single__content figure + h2,
.p-single__content ol + h2,
.p-single__content p + h2,
.p-single__content table + h2,
.p-single__content ul + h2 {
  margin-block-start: clamp(4rem,3.406rem + 1.524vw,5.6rem)
}
.p-casestudy-single__postContent div + h3,
.p-casestudy-single__postContent figure + h3,
.p-casestudy-single__postContent ol + h3,
.p-casestudy-single__postContent p + h3,
.p-casestudy-single__postContent table + h3,
.p-casestudy-single__postContent ul + h3,
.p-single__content div + h3,
.p-single__content figure + h3,
.p-single__content ol + h3,
.p-single__content p + h3,
.p-single__content table + h3,
.p-single__content ul + h3 {
  margin-block-start: clamp(2.4rem,1.211rem + 3.048vw,5.6rem)
}
.p-casestudy-single__postContent div + h4,
.p-casestudy-single__postContent figure + h4,
.p-casestudy-single__postContent ol + h4,
.p-casestudy-single__postContent p + h4,
.p-casestudy-single__postContent table + h4,
.p-casestudy-single__postContent ul + h4,
.p-single__content div + h4,
.p-single__content figure + h4,
.p-single__content ol + h4,
.p-single__content p + h4,
.p-single__content table + h4,
.p-single__content ul + h4 {
  margin-block-start: clamp(2.4rem,2.103rem + .762vw,3.2rem)
}
.p-casestudy-single__postContent table + table,
.p-single__content table + table {
  margin-block-start: clamp(4rem,3.406rem + 1.524vw,5.6rem)
}
.p-casestudy-single__postContent ol li + li,
.p-casestudy-single__postContent ul li + li,
.p-single__content ol li + li,
.p-single__content ul li + li {
  margin-block-start: .4em
}
.p-single__btnWrap {
  display: flex;
  flex-direction: column;
  gap: 40px;
  margin-block-start: clamp(2.4rem,1.211rem + 3.048vw,5.6rem)
}
.p-single__btn {
  border-block-end: 1px solid var(--line-color);
  padding-block-end: 40px
}
.p-single__nav {
  align-items: center;
  block-size: 100%;
  display: grid;
  gap: clamp(1.6rem,1.303rem + .762vw,2.4rem);
  grid-template-columns: 1fr auto 1fr
}
.p-single__nav.--only-next {
  grid-template-columns: 1fr auto 1fr
}
.p-single__nav.--only-next .p-single__nav--item.--next {
  grid-column: 1
}
.p-single__nav.--only-next .p-single__nav--line {
  grid-column: 2
}
.p-single__nav.--only-prev {
  grid-template-columns: 1fr auto 1fr
}
.p-single__nav.--only-prev .p-single__nav--item.--prev {
  grid-column: 3
}
.p-single__nav.--only-prev .p-single__nav--line {
  grid-column: 2
}
.p-single__nav--item {
  align-items: center;
  display: flex;
  flex: 1;
  gap: clamp(.9rem,.343rem + 1.429vw,2.4rem);
  max-inline-size: 456px;
  transition: opacity var(--hover-transition) cubic-bezier(.83,0,.17,1) 0s
}
@media screen and (min-width:768px) {
  .p-single__nav--item {
    inline-size: 100%;
    padding: 24px 22px 32px 32px
  }
}
.p-single__nav--item.--next {
  flex-direction: row-reverse;
  margin-inline-end: auto
}
.p-single__nav--item.--prev {
  margin-inline-start: auto
}
.p-single__nav--item:focus-visible {
  opacity: var(--opacity-06)
}
@media (any-hover:hover) {
  .p-single__nav--item:hover {
    opacity: var(--opacity-06)
  }
}
.p-single__nav--line {
  align-self: stretch;
  background: var(--line-color);
  display: block;
  flex-shrink: 0;
  inline-size: 1px
}
.p-single__nav--wrap {
  align-items: stretch;
  block-size: 100%;
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 8px
}
@media screen and (min-width:768px) {
  .p-single__nav--wrap {
    gap: 16px
  }
}
.p-single__nav--label {
  color: var(--gray);
  font-size: 1.2rem;
  line-height: normal
}
@media screen and (min-width:768px) {
  .p-single__nav--label {
    font-size: 1.4rem
  }
}
.p-single__nav--title {
  display: -webkit-box;
  font-size: clamp(1.3rem,1.189rem + .286vw,1.6rem);
  line-height: 180%;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  flex-grow: 1;
  overflow: hidden;
  text-overflow: ellipsis
}
.p-single__nav--arrow {
  aspect-ratio: 20/16;
  inline-size: 20px;
  position: relative
}
.p-single__nav--arrow::before {
  content: "";
  position: absolute;
  -webkit-mask-image: url(../img/common/arrow.svg);
  mask-image: url(../img/common/arrow.svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  background: var(--text-color);
  block-size: 100%;
  inline-size: 100%;
  left: 50%;
  mask-size: contain;
  top: 50%;
  translate: -50% -50%
}
.p-single__nav--arrow.--next::before {
  rotate: 180deg
}
.p-single__others {
  background: var(--bg-gray);
  margin-block-start: clamp(6.4rem,4.543rem + 4.762vw,11.4rem);
  padding-block: clamp(6.4rem,4.914rem + 3.81vw,10.4rem) clamp(6.4rem,6.103rem + .762vw,7.2rem)
}
.p-single__others__title {
  color: var(--gray);
  font-family: var(--font-en);
  font-size: 1.4rem;
  font-weight: 400;
  letter-spacing: -.018em;
  line-height: 100%;
  text-transform: uppercase
}
@media screen and (min-width:1920px) {
  .p-single__others__title {
    font-size: 1.6rem
  }
}
.p-single__others__wrap {
  display: flex;
  flex-direction: column;
  gap: clamp(4rem,2.811rem + 3.048vw,7.2rem);
  margin-block-start: 34px
}
.p-single__others__lists {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(1,1fr)
}
@media screen and (min-width:768px) {
  .p-single__others__lists {
    grid-template-columns: repeat(2,1fr)
  }
}
.p-single__others__list {
  align-items: stretch;
  display: flex;
  flex-direction: column
}
.p-single-other__btn {
  display: grid;
  place-content: center
}
.p-document {
  padding-block: clamp(8rem,5.029rem + 7.619vw,16rem) 0;
  position: relative
}
@media screen and (min-width:768px) {
  .p-document {
    padding-block: clamp(8rem,5.029rem + 7.619vw,16rem) clamp(6.4rem,4.914rem + 3.81vw,10.4rem)
  }
  .p-document::after {
    background: var(--line-color);
    block-size: 1px;
    bottom: 0;
    content: "";
    inline-size: 100vw;
    left: 0;
    margin-inline: calc(50% - 50vw);
    position: absolute;
    right: 0
  }
}
.p-document__items {
  display: grid;
  gap: 60px;
  grid-template-columns: repeat(1,1fr)
}
@media screen and (min-width:768px) {
  .p-document__items {
    grid-template-columns: repeat(2,1fr);
    -moz-column-gap: min(clamp(2.4rem,1.806rem + 1.524vw,4rem),40px);
    column-gap: min(clamp(2.4rem,1.806rem + 1.524vw,4rem),40px);
    row-gap: 60px
  }
  .p-document__items:has(.p-document__wrap:nth-child(odd):last-child) .p-document__wrap:last-child {
    grid-column: 1/-1;
    justify-self: center;
    max-inline-size: calc(50% - min(clamp(1.2rem,.903rem + .762vw,2rem),20px))
  }
}
@media screen and (min-width:1024px) {
  .p-document__items {
    grid-template-columns: repeat(3,1fr)
  }
  .p-document__items:has(.p-document__wrap:nth-child(odd):last-child) .p-document__wrap:last-child {
    grid-column: revert;
    justify-self: revert;
    max-inline-size: revert
  }
}
.p-document__wrap {
  block-size: 100%;
  display: flex;
  flex-direction: column;
  gap: 24px
}
.p-document__content {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 24px
}
.p-document__titleWrap {
  display: flex;
  flex-direction: column;
  gap: 8px
}
.p-document__title {
  font-size: 2rem;
  line-height: 180%
}
.p-document__description {
  color: var(--dark-gray);
  font-size: 1.4rem;
  line-height: 180%;
  margin-block-start: -16px
}
@media screen and (min-width:1920px) {
  .p-document__description {
    font-size: 1.6rem
  }
}
.p-document__btn {
  display: flex;
  justify-content: center;
  margin-block-start: auto
}
.p-document__pagination {
  margin-block-start: clamp(6.4rem,4.914rem + 3.81vw,10.4rem)
}
.p-document-single {
  padding-block: clamp(5.6rem,3.223rem + 6.095vw,12rem) clamp(6.4rem,4.914rem + 3.81vw,10.4rem);
  position: relative
}
.p-document-single::after {
  background: var(--line-color);
  block-size: 1px;
  bottom: 0;
  content: "";
  inline-size: 100vw;
  left: 0;
  margin-inline: calc(50% - 50vw);
  position: absolute;
  right: 0
}
.p-document-single__item {
  display: flex;
  flex-direction: column;
  gap: 32px;
  max-inline-size: 640px
}
@media screen and (min-width:768px) {
  .p-document-single__item {
    gap: 40px;
    margin-inline: auto
  }
}
@media screen and (min-width:1024px) {
  .p-document-single__item {
    margin-inline: revert;
    max-inline-size: revert
  }
}
.p-document-single__wrap {
  display: flex;
  flex-direction: column;
  gap: 56px
}
@media screen and (min-width:1024px) {
  .p-document-single__wrap {
    flex-direction: row;
    gap: 40px;
    justify-content: space-between
  }
}
.p-document-single__contents {
  display: flex;
  flex-direction: column;
  gap: 16px
}
@media screen and (min-width:768px) {
  .p-document-single__contents {
    gap: 24px
  }
}
@media screen and (min-width:1024px) {
  .p-document-single__contents {
    flex: 1;
    max-inline-size: 577px
  }
}
.p-document-single__title {
  font-size: clamp(2rem,1.554rem + 1.143vw,3.2rem);
  line-height: 180%
}
.p-document-single__thumbnail {
  aspect-ratio: 334/188;
  inline-size: 85.641025641vw;
  max-inline-size: 100%
}
@media screen and (min-width:768px) {
  .p-document-single__thumbnail {
    aspect-ratio: 577/325;
    inline-size: 40.0694444444vw;
    max-inline-size: 577px
  }
}
.p-document-single__text {
  color: var(--dark-gray);
  font-size: 1.4rem;
  line-height: 180%
}
@media screen and (min-width:1920px) {
  .p-document-single__text {
    font-size: 1.6rem
  }
}
.p-download-single__form {
  inline-size: 100%;
  max-inline-size: 480px
}
@media screen and (min-width:768px) {
  .p-download-single__form {
    inline-size: 33.3333333333vw
  }
}
.p-document__form {
  background: var(--white);
  display: flex;
  flex-direction: column;
  gap: 8px;
  inline-size: 100%;
  max-inline-size: 640px;
  padding: 40px 20px
}
@media screen and (min-width:768px) {
  .p-document__form {
    gap: 16px;
    margin-inline: auto;
    padding: 48px 32px
  }
}
.p-document__form .p-contact__footerWrap {
  gap: clamp(1.6rem,1.303rem + .762vw,2.4rem);
  margin-block-start: 24px
}
@media screen and (min-width:768px) {
  .p-document__form .p-contact__footerWrap {
    margin-block-start: 28px
  }
}
.p-document__formWrap {
  display: flex;
  flex-direction: column
}
@media screen and (min-width:768px) {
  .p-document__formWrap {
    gap: 14px
  }
}
.p-document__formWrap .p-contact__head {
  padding-block: 11px
}
@media screen and (min-width:768px) {
  .p-document__formWrap .p-contact__head {
    padding-block: 8px
  }
}
.p-document__formWrap .p-contact__row {
  gap: 0
}
@media screen and (min-width:1024px) {
  .p-document__formWrap .p-contact__row {
    align-items: start;
    grid-template-columns: 142px 1fr
  }
}
.p-document__formWrap .p-contact__row input[type=email],
.p-document__formWrap .p-contact__row input[type=tel],
.p-document__formWrap .p-contact__row input[type=text] {
  background: var(--base-color)
}
@media screen and (min-width:1024px) {
  .p-document__formWrap .p-contact__row input[type=email],
  .p-document__formWrap .p-contact__row input[type=tel],
  .p-document__formWrap .p-contact__row input[type=text] {
    max-inline-size: 273px
  }
}
@media screen and (min-width:1024px) {
  .p-document__formWrap .p-contact__head.--must::after {
    right: 7px
  }
}
.p-document-single__btn {
  display: grid;
  margin-block-start: clamp(4rem,2.589rem + 3.619vw,7.8rem);
  place-content: center
}
.p-privacy {
  padding-block: clamp(5.6rem,3.223rem + 6.095vw,12rem) clamp(8rem,5.586rem + 6.19vw,14.5rem)
}
.p-privacy__content {
  counter-reset: privacy-section;
  display: flex;
  flex-direction: column;
  gap: clamp(8rem,6.514rem + 3.81vw,12rem)
}
.p-privacy__wrap {
  display: flex;
  flex-direction: column;
  gap: clamp(2.4rem,1.806rem + 1.524vw,4rem)
}
.p-privacy__wrap .p-privacy__lead {
  padding-block-end: clamp(2.2rem,1.531rem + 1.714vw,4rem)
}
.p-privacy__wrap h2 {
  border-block-end: 1px solid var(--line-color);
  font-size: clamp(2rem,1.554rem + 1.143vw,3.2rem);
  line-height: 180%;
  padding-block-end: 8px
}
.p-privacy__wrap h3 {
  font-size: 1.6rem;
  line-height: 1.8;
  padding-left: 3.2ch
}
.p-privacy__wrap h4,
.p-privacy__wrap h5 {
  color: var(--post-text-color);
  font-size: 1.4rem;
  line-height: 1.8
}
.p-privacy__wrap h4 + ul,
.p-privacy__wrap p + h4,
.p-privacy__wrap p + p,
.p-privacy__wrap p + ul {
  margin-block-start: 1em
}
.p-privacy__wrap p {
  font-size: 1.4rem;
  line-height: 1.8
}
.p-privacy__wrap > ol {
  counter-reset: policy-num;
  display: flex;
  flex-direction: column;
  gap: clamp(2.4rem,1.806rem + 1.524vw,4rem);
  list-style: none;
  margin: 0;
  padding: 0
}
.p-privacy__wrap > ol > li {
  counter-increment: policy-num;
  position: relative
}
.p-privacy__wrap > ol > li::before {
  content: counter(policy-num) ".";
  font-variant-numeric: tabular-nums;
  left: 7px;
  position: absolute;
  top: .1em
}
.p-privacy__wrap > ol > li h3 {
  font-size: 1.6rem;
  line-height: 1.8;
  margin: 0 0 8px
}
.p-privacy__wrap > ol > li p {
  color: var(--post-text-color);
  font-size: 1.4rem;
  line-height: 1.8;
  margin: 0
}
.p-privacy__contentsWrap {
  display: flex;
  flex-direction: column;
  gap: 8px
}
.p-privacy__contentsWrap > .p-privacy__heading {
  counter-increment: privacy-section;
  counter-reset: privacy-subsection;
  font-size: 1.6rem;
  line-height: 1.8;
  padding-left: 3.2ch;
  position: relative
}
.p-privacy__contentsWrap > .p-privacy__heading::before {
  content: counter(privacy-section) ". ";
  font-variant-numeric: tabular-nums;
  left: 7px;
  position: absolute;
  top: 0
}
.p-privacy__textWrap {
  color: var(--post-text-color);
  counter-reset: privacy-subsection;
  font-size: 1.4rem;
  line-height: 1.8
}
.p-privacy__textWrap > h4.p-privacy__heading {
  counter-increment: privacy-subsection;
  counter-reset: privacy-subsubsection;
  padding-left: 4ch;
  position: relative
}
@media screen and (min-width:768px) {
  .p-privacy__textWrap > h4.p-privacy__heading.--pc-mds {
    margin-block-start: 24px!important
  }
}
.p-privacy__textWrap > h4.p-privacy__heading::before {
  content: "( " counter(privacy-subsection) " ) ";
  left: 0;
  position: absolute;
  top: 0
}
.p-privacy__textWrap > h5.p-privacy__heading {
  counter-increment: privacy-subsubsection;
  margin-block-start: 24px;
  padding-left: 4.2ch;
  position: relative
}
.p-privacy__textWrap > h5.p-privacy__heading::before {
  content: "( " counter(privacy-subsubsection,lower-roman) " ) ";
  left: 0;
  position: absolute;
  top: 0
}
@counter-style circled-decimal {
  system: fixed;
  symbols: "①" "②" "③" "④" "⑤" "⑥" "⑦" "⑧" "⑨" "⑩" "⑪" "⑫" "⑬" "⑭" "⑮" "⑯" "⑰" "⑱" "⑲" "⑳";
  suffix: " "
}
.p-privacy__number-lists {
  counter-reset: circled;
  list-style: none;
  margin: 0;
  padding: 0
}
.p-privacy__number-lists.--mbs {
  margin-block-start: 24px!important
}
@media screen and (min-width:768px) {
  .p-privacy__number-lists.--pc-mbs {
    margin-block-start: 0!important
  }
}
.p-privacy__number-lists > li {
  counter-increment: circled;
  padding-left: 2.4ch;
  position: relative
}
.p-privacy__number-lists > li::before {
  content: counter(circled,circled-decimal);
  left: 0;
  position: absolute;
  top: 0
}
.p-privacy__number-lists + h4 {
  margin-block-start: 24px
}
.p-privacy__lists {
  list-style: none;
  margin: 0;
  padding: 0
}
.p-privacy__lists > li {
  padding-left: .8em;
  position: relative
}
.p-privacy__lists > li::before {
  content: "–";
  left: 0;
  position: absolute;
  top: .1em
}
.p-privacy__textWrap ul li {
  line-height: 1.8
}
.p-privacy__mbs {
  margin-block-start: 24px!important
}
.p-404 {
  padding-block: 160px
}
.p-404__inner {
  display: flex;
  flex-direction: column;
  gap: 40px
}
@media screen and (min-width:768px) {
  .p-404__inner {
    align-items: center
  }
}
@media screen and (min-width:768px) {
  .u-hidden-pc {
    display: none
  }
}
@media screen and (min-width:1024px) {
  .u-hidden-pc-wide {
    display: none
  }
}
@media screen and (max-width:767px) {
  .u-hidden-sp {
    display: none
  }
}
@media screen and (max-width:1023px) {
  .u-hidden-tab {
    display: none
  }
}
.u-visually-hidden {
  block-size: 4px!important;
  border: none!important;
  contain: strict!important;
  display: block!important;
  inline-size: 4px!important;
  inset: 0!important;
  margin: 0!important;
  opacity: 0!important;
  padding: 0!important;
  pointer-events: none!important;
  position: fixed!important;
  visibility: visible!important
}
.u-inline-block {
  display: inline-block;
  font-weight: inherit
}
.u-manual-br {
  display: contents
}
.u-manual-br:lang(ja) {
  display: block flow-root
}
.u-manual-wbr {
  display: contents
}
.u-manual-wbr:lang(ja) {
  display: inline flow-root
}
.u-text {
  font-size: 1.4rem;
  line-height: 180%
}
.u-text p + p {
  margin-block-start: 24px
}
@media screen and (min-width:1920px) {
  .u-text {
    font-size: 1.6rem
  }
}