@charset "UTF-8";
/* ----------------------------------------------------------------------------------------------------
*  基本情報
* --------------------------------------------------------------------------------------------------*/
@layer components, variations;
@layer components {
  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 {
    margin: 0;
    padding: 0;
    border: 0;
    font: inherit;
    font-size: 100%;
    vertical-align: baseline;
  }
  p {
    font-size: 1.6rem;
    line-height: 1.75;
  }
  button {
    border: none;
    font: inherit;
    color: currentColor;
  }
  ol,
  ul {
    list-style: none;
  }
}
html {
  line-height: 1;
}

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

strong {
  font-weight: 700;
}

caption,
td,
th {
  text-align: left;
}

blockquote,
q {
  quotes: none;
}

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

a img {
  border: none;
}

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

html {
  font-size: 100%;
  line-height: 1.5em;
}
html.wf-loading {
  display: none;
}

* {
  box-sizing: border-box;
  word-break: break-word; /* 長い単語を強制的に折り返す */
  overflow-wrap: break-word; /* 同様の目的。対応ブラウザが広い */
  line-break: strict; /* 節での自然な改行を優先（日本語では特に有効） */
  white-space: normal; /* 普通の折り返し挙動に */
}

html {
  font-size: 100%;
  width: 100%;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  scroll-behavior: smooth;
}

body {
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  position: relative;
  font-weight: 400;
  font-family: dnp-shuei-mincho-pr6n, sans-serif;
  color: #000;
  scroll-behavior: smooth;
  background-color: #fefff7;
  font-size: 1rem;
  line-height: 1.8;
  letter-spacing: 0.025em;
  position: relative;
}
body.is-fixed {
  overscroll-behavior-y: none;
  overflow: hidden;
}

div[id],
section[id] {
  scroll-margin-top: 0;
}
@media screen and (max-width: 767px) {
  div[id],
  section[id] {
    scroll-margin-top: 50px;
  }
}

@media (min-width: 768px) {
  a[href*="tel:"] {
    text-decoration: none;
    cursor: default;
    pointer-events: none;
  }
}
img {
  max-width: 100%;
  height: auto;
  vertical-align: top;
}

.clearfix::after {
  content: "";
  display: block;
  clear: both;
}

.u-hide {
  opacity: 0;
  visibility: hidden;
  height: 0;
}

.u-gothic {
  font-family: zen-kaku-gothic-antique, sans-serif;
  font-weight: 500;
}

.u-pc {
  display: block !important;
}
@media screen and (max-width: 767px) {
  .u-pc {
    display: none !important;
  }
}

.u-pcOnly {
  display: block;
}
@media screen and (max-width: 1199px) {
  .u-pcOnly {
    display: none;
  }
}

.u-tabOnly {
  display: none;
}

@media screen and (max-width: 1198.98px) and (min-width: 767.98px) {
  .u-noTab {
    display: none;
  }
  .u-tabOnly {
    display: block;
  }
}
.u-sp {
  display: none !important;
}
@media screen and (max-width: 767px) {
  .u-sp {
    display: block !important;
  }
}

.p-frame {
  border: 1px solid #231815;
  position: relative;
  z-index: 100001;
}

#l-main {
  width: 100%;
  position: relative;
}
@media screen and (max-width: 767px) {
  #l-main {
    padding-top: 50px;
    border-top: none;
  }
}
#l-main::before,
#l-main::after {
  position: absolute;
  content: "";
  width: 1px;
  top: 0;
  height: 100%;
  background-color: #231815;
  z-index: 1000;
}
#l-main::before {
  left: 0;
}
#l-main::after {
  right: 0;
}

/* .is-animate {
	opacity: 0;
	transform: translateY(40px);
	transition:
		0.5s opacity,
		0.5s transform;
	&.is-show {
		opacity: 1;
		transform: translateY(0);
	}
} */
/* ----------------------------------------------------------------------------------------------------
*	header
* --------------------------------------------------------------------------------------------------*/
#l-header {
  border-bottom: 1px solid #231815;
  border: 1px solid #231815;
}
@media screen and (max-width: 767px) {
  #l-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 50px;
    background-color: #fefff7;
    z-index: 1000;
  }
}
#l-header .l-hamburger__wrapper {
  display: none;
}
@media screen and (max-width: 767px) {
  #l-header .l-hamburger__wrapper {
    border-left: 1px solid #231815;
    position: static;
    display: block;
    width: 58px;
  }
}
@media screen and (max-width: 767px) {
  #l-header {
    display: block !important;
  }
}

@media screen and (max-width: 1188px) {
  #l-header {
    display: none;
  }
  #l-main {
    border-top: 1px solid #231815;
  }
  .l-fixhamburger {
    opacity: 1 !important;
    pointer-events: auto !important;
  }
}
.l-header__inner {
  display: flex;
  justify-content: space-between;
  padding-inline: min(2.6666666667vw, 40px);
}
@media screen and (max-width: 767px) {
  .l-header__inner {
    padding: 0;
    height: 100%;
    position: relative;
  }
}

.l-header__logo-wrapper {
  display: flex;
  align-items: center;
  -moz-column-gap: min(0.9333333333vw, 14px);
  column-gap: min(0.9333333333vw, 14px);
  padding-top: 10px;
  margin-right: min(3vw, 70px);
}
@media screen and (max-width: 767px) {
  .l-header__logo-wrapper {
    padding: 10px 18px 0;
    flex-grow: 1;
    height: 100%;
  }
}
.l-header__logo-wrapper .u-gothic {
  font-size: 0.75rem;
  background-color: #b4b4b5;
  color: #fff;
  display: inline-block;
  padding: 5px 20px;
  line-height: 1;
  position: relative;
  top: -4px;
}
@media screen and (max-width: 767px) {
  .l-header__logo-wrapper .u-gothic {
    font-size: 0.5625rem;
    display: block;
    flex-grow: 1;
    text-align: center;
    margin-left: 10px;
    max-width: 119px;
    padding-inline: 10px;
  }
}

.l-header__logo {
  width: 175px;
  position: relative;
  top: -3px;
  line-height: 1;
}
@media screen and (max-width: 767px) {
  .l-header__logo {
    width: 140px;
    top: -1px;
  }
}
@media (any-hover) {
  .l-header__logo a {
    transition: 0.3s;
  }
  .l-header__logo a:hover {
    opacity: 0.7;
  }
}

.l-header__nav {
  flex-grow: 1;
  max-width: 1190px;
  margin-left: auto;
}
@media screen and (max-width: 767px) {
  .l-header__nav {
    display: none;
  }
}

.l-header__nav-list {
  font-size: 0.8125rem;
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 767px) {
  .l-header__nav-list {
    display: block;
  }
}
.l-header__nav-list a {
  color: currentColor;
  text-decoration: none;
}

.l-header__nav-item {
  padding-block: 13px;
}
.l-header__nav-item.c-current a span:before {
  transform: scale(1) !important;
}
.l-header__nav-item a {
  min-height: 48px;
  place-content: center;
  display: grid;
}
@media (any-hover: hover) {
  .l-header__nav-item a:hover span::before {
    transform: scale(1, 1);
    transform-origin: right top;
  }
}
.l-header__nav-item a span {
  position: relative;
  padding-left: 16px;
}
.l-header__nav-item a span::before {
  transition: 0.3s transform;
  content: "";
  height: 1px;
  background-color: #231815;
  position: absolute;
  top: 50%;
  left: 0;
  width: 10px;
  transform: scale(0, 1);
  transform-origin: left top;
}
.l-header__nav-item.-inquiry {
  border-left: 1px solid #231815;
  padding-left: min(3.3333333333vw, 50px);
  margin-left: min(3.3333333333vw, 50px);
}
.l-header__nav-item.-inquiry a {
  color: #fff;
  width: 240px;
  border-radius: 5px;
  background-color: #3e3a39;
  border: 1px solid #000;
  transition:
    0.3s color,
    0.3s background-color;
}
@media (any-hover: hover) {
  .l-header__nav-item.-inquiry a:hover {
    color: #000;
    background-color: transparent;
  }
}

.l-hamburger {
  display: block;
  width: 100%;
  height: 100%;
  position: relative;
  background-color: transparent;
  cursor: pointer;
}
@media (any-hover) {
  .l-hamburger {
    transition: 0.3s;
  }
  .l-hamburger:hover {
    opacity: 0.7;
  }
}
.l-hamburger::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: #e50012;
  -webkit-clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
  clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
  width: 45px;
  height: 23px;
}
.l-hamburger.is-open .l-line {
  top: 50% !important;
}
.l-hamburger .l-line {
  position: absolute;
  width: 13px;
  height: 1px;
  background-color: #fff;
  left: 0;
  right: 0;
  margin-inline: auto;
  top: 50%;
  z-index: 10;
  transition: 0.3s top;
}
.l-hamburger .l-line:first-of-type {
  top: calc(50% - 2px);
}
.l-hamburger .l-line:last-of-type {
  top: calc(50% + 2px);
}

.l-megamenu {
  background-color: #fefff7;
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1000;
  border: 1px solid #231815;
  transform: translateY(calc(-100% - 1px));
  transition: 0.65s transform cubic-bezier(0.16, 0.8, 0.2, 1);
}
.l-megamenu.is-open {
  transform: translateY(0);
}
@media screen and (max-width: 767px) {
  .l-megamenu {
    z-index: 10;
  }
}
.l-megamenu .l-hamburger__wrapper {
  width: 70px;
  height: 36px;
  margin-right: min(5.3333333333vw, 80px);
}
@media screen and (max-width: 767px) {
  .l-megamenu .l-hamburger__wrapper {
    display: none;
  }
}
.l-megamenu .l-hamburger {
  display: block;
  width: 100%;
  height: 100%;
  position: relative;
}
.l-megamenu .l-hamburger::after {
  width: 100%;
  height: 100%;
}
.l-megamenu .l-hamburger .l-line {
  width: 20px;
}

.l-fixhamburger {
  position: fixed;
  top: 32px;
  left: 20px;
  width: 70px;
  height: 36px;
  z-index: 1001;
  opacity: 0;
  pointer-events: none;
  transition: 0.3s opacity;
}
.l-fixhamburger.is-show {
  opacity: 1;
  pointer-events: auto;
}
@media screen and (max-width: 767px) {
  .l-fixhamburger {
    display: none !important;
  }
}
.l-fixhamburger .l-hamburger::after {
  width: 100%;
  height: 100%;
}
.l-fixhamburger .l-hamburger .l-line {
  width: 20px;
}

.l-megamenu__content {
  display: flex;
  padding: 35px 100px 35px 140px;
  align-items: flex-start;
}
@media screen and (max-width: 900px) {
  .l-megamenu__content {
    display: block;
    padding-left: 100px;
  }
}
@media screen and (max-width: 767px) {
  .l-megamenu__content {
    padding: 60px 18px 46px;
    overflow: auto;
    max-height: 100svh;
  }
}

.l-megamenu__nav {
  flex-grow: 1;
  margin-left: auto;
  max-width: 830px;
}
@media screen and (max-width: 900px) {
  .l-megamenu__nav {
    margin-top: 40px;
  }
}
@media screen and (max-width: 767px) {
  .l-megamenu__nav {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin: 20px auto 0;
  }
}

.win .l-megamenu__nav-item a span::before {
  top: 14px;
}

.l-megamenu__nav-item {
  font-size: 1rem;
}
@media screen and (max-width: 767px) {
  .l-megamenu__nav-item {
    font-size: 0.9375rem;
  }
}
.l-megamenu__nav-item.c-current a span::before {
  transform: scale(1) !important;
}
.l-megamenu__nav-item a {
  color: currentColor;
  text-decoration: none;
  display: inline-block;
}
@media (any-hover: hover) {
  .l-megamenu__nav-item a:hover span::before {
    transform: scale(1);
    transform-origin: right top;
  }
}
@media screen and (max-width: 767px) {
  .l-megamenu__nav-item a {
    padding: 10px 5px;
  }
}
.l-megamenu__nav-item a span {
  position: relative;
}
.l-megamenu__nav-item a span::before {
  transition: 0.3s transform;
  position: absolute;
  content: "";
  width: 12px;
  top: 7px;
  height: 1px;
  background-color: #000;
  left: -20px;
  transform: scale(0, 1);
  transform-origin: left top;
}
@media screen and (max-width: 767px) {
  .l-megamenu__nav-item a span::before {
    top: 0.5em;
    left: -16px;
  }
}
.l-megamenu__nav-item.-inquiry a {
  border: 1px solid #000;
  padding: 5px 30px;
  background-color: #3e3a39;
  color: #fff;
  transition:
    0.3s background-color,
    0.3s color;
  word-break: keep-all;
}
@media screen and (max-width: 767px) {
  .l-megamenu__nav-item.-inquiry a {
    padding: 10px 10px;
    margin-top: 20px;
    background-color: transparent;
    color: #000;
  }
}
@media (any-hover: hover) {
  .l-megamenu__nav-item.-inquiry a:hover {
    background-color: transparent;
    color: #000;
  }
}

.l-megamenu__logo-link {
  width: 244px;
}
.l-megamenu__logo-link .p-btn-wrapper {
  margin: 13px auto 0;
}
@media screen and (max-width: 900px) {
  .l-megamenu__logo-link {
    margin-top: 40px;
  }
}
@media screen and (max-width: 767px) {
  .l-megamenu__logo-link {
    margin: 26px auto 0;
    width: 187px;
  }
}

.l-megamenu__nav-list {
  display: grid;
  grid-template-rows: repeat(2, auto);
  grid-auto-flow: column;
  gap: 20px 20px;
}
@media screen and (max-width: 1199px) {
  .l-megamenu__nav-list {
    grid-template-rows: repeat(3, auto);
  }
}
@media screen and (max-width: 767px) {
  .l-megamenu__nav-list {
    display: block;
  }
}

.l-scroll-txt__content {
  overflow: clip;
}

.l-scroll-txt__inner {
  display: flex;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  border-top: 1px solid #231815;
  padding-block: 60px;
}
@media screen and (max-width: 767px) {
  .l-scroll-txt__inner {
    padding-block: 30px;
  }
}
.l-scroll-txt__inner.-form--right {
  -webkit-animation: scroll-right 148s infinite linear;
  animation: scroll-right 148s infinite linear;
}
.l-scroll-txt__inner.-form--left {
  -webkit-animation: scroll-left 148s infinite linear;
  animation: scroll-left 148s infinite linear;
}
.l-scroll-txt__inner > div {
  display: flex;
  flex-shrink: 0;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  align-items: center;
  -moz-column-gap: 30px;
  column-gap: 30px;
  padding-right: 30px;
}
@media screen and (max-width: 767px) {
  .l-scroll-txt__inner > div {
    -moz-column-gap: 10px;
    column-gap: 10px;
    padding-right: 10px;
  }
}
.l-scroll-txt__inner > div figure {
  flex-shrink: 0;
  width: 76px;
}
@media screen and (max-width: 767px) {
  .l-scroll-txt__inner > div figure {
    width: 35px;
    height: 35px;
  }
}
.l-scroll-txt__inner > div p {
  font-size: 3.625rem;
  flex-shrink: 0;
  font-weight: 500;
}
@media screen and (max-width: 767px) {
  .l-scroll-txt__inner > div p {
    font-size: 1.6875rem;
  }
}

@-webkit-keyframes scroll-right {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}

@keyframes scroll-right {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}
@-webkit-keyframes scroll-left {
  0% {
    transform: translateX(-50%);
  }
  100% {
    transform: translateX(0%);
  }
}
@keyframes scroll-left {
  0% {
    transform: translateX(-50%);
  }
  100% {
    transform: translateX(0%);
  }
}
/* ----------------------------------------------------------------------------------------------------
*	footer
* --------------------------------------------------------------------------------------------------*/
#l-footer {
  padding-top: min(7.1333333333vw, 107px);
  padding-bottom: min(2.1333333333vw, 32px);
  border: 1px solid #231815;
}
@media screen and (max-width: 767px) {
  #l-footer {
    padding-top: 58px;
    padding-bottom: 32px;
  }
}

.l-footer__inner {
  margin-inline: auto;
  box-sizing: content-box;
  width: calc(100% - 200px);
}
@media screen and (max-width: 767px) {
  .l-footer__inner {
    width: auto;
    padding-inline: 18px;
  }
}

.l-footer__nav-list {
  font-size: 1.125rem;
}
@media screen and (max-width: 767px) {
  .l-footer__nav-list {
    font-size: 0.9375rem;
  }
}
.l-footer__nav-list a {
  color: currentColor;
  text-decoration: none;
}

.l-footer__logo-link {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-right: 100px;
}
@media screen and (max-width: 767px) {
  .l-footer__logo-link {
    width: 200px;
    margin-inline: auto;
  }
}
.l-footer__logo-link .p-btn-wrapper {
  margin-top: 33px;
  max-width: 244px;
  margin-inline: auto;
}
@media screen and (max-width: 767px) {
  .l-footer__logo-link .p-btn-wrapper {
    margin-top: 10px;
    max-width: inherit;
  }
}

.win .l-footer__logo-link .p-btn-wrapper .c-btn {
  padding-bottom: 6px;
}

.l-footer__logo {
  width: 260px;
}
@media screen and (max-width: 767px) {
  .l-footer__logo {
    width: auto;
  }
}
.l-footer__logo img {
  width: 100%;
}

.l-footer__company-info {
  margin-top: 104px;
  display: grid;
  grid-auto-columns: 1fr;
  grid-auto-rows: 1fr;
  grid-template-columns: auto 1fr;
  grid-template-rows: auto 1fr;
  gap: 0px 20px;
  grid-template-areas: "logo txt" "logo copy";
}
@media screen and (max-width: 767px) {
  .l-footer__company-info {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin: 60px auto 0;
    grid-template-areas: "logo txt" "copy copy";
  }
}
.l-footer__company-info .c-logo {
  grid-area: logo;
  width: 78px;
  margin-top: 9px;
}
@media screen and (max-width: 767px) {
  .l-footer__company-info .c-logo {
    width: 64px;
  }
}
.l-footer__company-info .c-logo img {
  width: 100%;
}
.l-footer__company-info .c-company-info {
  grid-area: txt;
}
.l-footer__company-info .c-company-info .c-company {
  font-size: 1.375rem;
}
@media screen and (max-width: 767px) {
  .l-footer__company-info .c-company-info .c-company {
    font-size: 1.125rem;
  }
}
.l-footer__company-info .c-company-info .c-add {
  font-size: 0.875rem;
}
@media screen and (max-width: 767px) {
  .l-footer__company-info .c-company-info .c-add {
    font-size: 0.6875rem;
  }
}

.c-copyright {
  grid-area: copy;
  display: block;
  font-size: 0.625rem;
  line-height: 1.2;
  margin-top: 4px;
  letter-spacing: 0;
}
@media screen and (max-width: 767px) {
  .c-copyright {
    font-size: 0.4375rem;
    max-width: 230px;
    margin: 30px auto 0;
    text-align: center;
  }
}

.l-footer__nav {
  flex-grow: 1;
  margin-left: auto;
  max-width: 800px;
}
@media screen and (max-width: 767px) {
  .l-footer__nav {
    max-width: inherit;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin-inline: auto;
  }
}

.l-footer__upper {
  display: flex;
  width: 100%;
}
@media screen and (max-width: 900px) {
  .l-footer__upper {
    display: block;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin-inline: auto;
  }
}

@media screen and (max-width: 900px) {
  .l-footer__nav {
    margin-top: 80px;
  }
}
@media screen and (max-width: 767px) {
  .l-footer__nav {
    margin-top: 20px;
  }
}

.l-footer__nav-list {
  display: flex;
  flex-wrap: wrap;
  gap: 30px 20px;
}
@media screen and (max-width: 767px) {
  .l-footer__nav-list {
    display: block;
  }
}

.l-footer__nav-item {
  width: calc(50% - 10px);
}
.l-footer__nav-item.c-current a span::before {
  transform: scale(1) !important;
}
@media screen and (max-width: 767px) {
  .l-footer__nav-item {
    width: auto;
  }
}
.l-footer__nav-item a {
  position: relative;
  display: inline-block;
}
@media (any-hover: hover) {
  .l-footer__nav-item a:hover span::before {
    transform: scale(1, 1);
    transform-origin: right top;
  }
}
@media screen and (max-width: 767px) {
  .l-footer__nav-item a {
    padding: 10px 0;
  }
}
.l-footer__nav-item a span::before {
  content: "";
  position: absolute;
  top: 0.91em;
  width: 14px;
  height: 1px;
  background-color: #000;
  left: -30px;
  transition: 0.3s transform;
  transform: scale(0, 1);
  transform-origin: left top;
}
@media screen and (max-width: 767px) {
  .l-footer__nav-item a span::before {
    top: 1.51em;
    left: -22px;
  }
}
.l-footer__nav-item:nth-of-type(2) {
  order: 3;
}
.l-footer__nav-item:nth-of-type(3) {
  order: 5;
}
.l-footer__nav-item:nth-of-type(4) {
  order: 2;
}
.l-footer__nav-item:nth-of-type(5) {
  order: 4;
}
.l-footer__nav-item.-inquiry {
  order: 6;
}
@media screen and (max-width: 767px) {
  .l-footer__nav-item.-inquiry {
    margin-top: 24px;
  }
}
.l-footer__nav-item.-inquiry a {
  border: 1px solid #000;
  padding: 7px min(2.2666666667vw, 34px) 3px;
  font-size: 1rem;
  display: inline-block;
  word-break: keep-all;
  transition:
    0.3s color,
    0.3s background-color;
}
@media screen and (max-width: 767px) {
  .l-footer__nav-item.-inquiry a {
    font-size: 0.9375rem;
    padding: 13px 12px;
  }
}
.l-footer__nav-item.-inquiry a::before {
  display: none;
}
@media (any-hover: hover) {
  .l-footer__nav-item.-inquiry a:hover {
    color: #fefff7;
    background-color: #3e3a39;
  }
}

.win .l-footer__nav-item.-inquiry a {
  padding-bottom: 8px;
}

.l-border-top {
  border-top: 1px solid #231815;
}

.l-border-bottom {
  border-bottom: 1px solid #231815;
}

.c-btn {
  display: block;
  color: #3e3a39;
  text-decoration: none;
  font-size: 1rem;
  border: 1px solid #3e3a39;
  border-radius: 9999px;
  width: 100%;
  text-align: center;
  padding: 4px 10px 2px;
  transition:
    0.3s background-color,
    0.3s color;
}
@media (any-hover: hover) {
  .c-btn:hover {
    background-color: #3e3a39;
    color: #fefff7;
  }
}

.p-content__heading.-works {
  padding-block: min(5.2vw, 78px);
}

.p-content__ttl {
  font-weight: 500;
  text-align: center;
  font-size: 2rem;
  line-height: 1.3775510204;
}
@media screen and (max-width: 767px) {
  .p-content__ttl {
    font-size: 1.225rem;
  }
}

/* ----------------------------------------------------------------------------------------------------
*	top
* --------------------------------------------------------------------------------------------------*/
.p-kv__content {
  display: grid;
  grid-auto-columns: 1fr;
  grid-auto-rows: 1fr;
  grid-template-columns: 15.8666666667% 22.4% 30.9333333333% 30.8%;
  grid-template-rows: auto auto auto auto auto;
  gap: 0px 0px;
}
@media screen and (max-width: 767px) {
  .p-kv__content {
    grid-template-columns: 41.75% 1fr 45.75%;
    grid-template-rows: auto auto auto auto auto auto;
  }
}

.p-kv__block {
  display: grid;
  place-content: center;
}
.p-kv__block .p-img-change {
  position: relative;
}
.p-kv__block .p-img-change .p-img-wrapper {
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: 5px;
  position: absolute;
  top: 0;
  left: 0;
}
@media screen and (max-width: 767px) {
  .p-kv__block .p-img-change .p-img-wrapper {
    border-radius: 3px;
  }
}
.p-kv__block .p-img-change img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}
.p-kv__block.block01 {
  padding-top: min(4.6666666667vw, 70px);
  padding-bottom: min(6.6666666667vw, 100px);
  grid-column: 1/3;
  grid-row: 1/3;
}
@media screen and (max-width: 767px) {
  .p-kv__block.block01 {
    grid-column: 1/3;
    grid-row: 1;
    padding-block: 6.6666666667vw;
  }
}
.p-kv__block.block01 .p-img-change {
  width: 25.8666666667vw;
  height: 16.6666666667vw;
}
@media screen and (max-width: 767px) {
  .p-kv__block.block01 .p-img-change {
    width: 37.3333333333vw;
    height: 24vw;
  }
}
.p-kv__block.block02 {
  padding-top: min(4.6666666667vw, 70px);
  padding-bottom: min(5.6666666667vw, 85px);
  grid-column: 3;
  grid-row: 1;
  border-left: 1px solid #231815;
}
@media screen and (max-width: 767px) {
  .p-kv__block.block02 {
    grid-column: 3;
    grid-row: 1;
    padding-block: 0;
  }
}
.p-kv__block.block02 .p-img-change {
  width: 16vw;
  height: 10.6666666667vw;
}
@media screen and (max-width: 767px) {
  .p-kv__block.block02 .p-img-change {
    width: 33.0666666667vw;
    height: 22.1333333333vw;
  }
}
.p-kv__block.block03 {
  grid-column: 4;
  grid-row: 1/4;
  border-left: 1px solid #231815;
  padding-top: min(1.3333333333vw, 20px);
}
@media screen and (max-width: 767px) {
  .p-kv__block.block03 {
    grid-column: 2/4;
    grid-row: 2/4;
    border-top: 1px solid #231815;
  }
}
.p-kv__block.block03 .c-img {
  display: inline-block;
  width: 4.2666666667vw;
  height: 4.2666666667vw;
  position: relative;
  right: min(1.4666666667vw, 22px);
}
@media screen and (max-width: 767px) {
  .p-kv__block.block03 .c-img {
    width: 31px;
    height: 31px;
    right: 10px;
  }
}
.p-kv__block.block03 .c-img.img01 {
  margin-top: 0.1em;
}
.p-kv__block.block03 .c-img.img02 {
  margin-top: 0.2em;
  margin-bottom: 0.2em;
}
.p-kv__block.block03 .c-cathc {
  writing-mode: vertical-rl;
  font-weight: 700;
  font-size: min(4vw, 3.75rem);
  line-height: 1.8;
}
@media screen and (max-width: 767px) {
  .p-kv__block.block03 .c-cathc {
    font-size: 1.85625rem;
  }
}
.p-kv__block.block04 {
  grid-column: 1;
  grid-row: 3/5;
  border-top: 1px solid #231815;
}
@media screen and (max-width: 767px) {
  .p-kv__block.block04 {
    grid-column: 1;
    grid-row: 5/7;
    padding-block: 9.0666666667vw 6.4vw;
  }
}
.p-kv__block.block04 .p-img-change {
  width: 8vw;
  height: 8.6666666667vw;
}
@media screen and (max-width: 767px) {
  .p-kv__block.block04 .p-img-change {
    width: 22.4vw;
    height: 22.6666666667vw;
  }
}
.p-kv__block.block05 {
  grid-column: 2;
  grid-row: 3/6;
  border-top: 1px solid #231815;
  border-left: 1px solid #231815;
  padding-top: min(4.6666666667vw, 70px);
  padding-bottom: min(4vw, 60px);
}
@media screen and (max-width: 767px) {
  .p-kv__block.block05 {
    grid-column: 1;
    grid-row: 3/5;
    padding-block: 8vw;
  }
}
.p-kv__block.block05 .p-img-change {
  width: 13.0666666667vw;
  height: 17.7333333333vw;
}
@media screen and (max-width: 767px) {
  .p-kv__block.block05 .p-img-change {
    width: 24.2666666667vw;
    height: 33.0666666667vw;
  }
}
.p-kv__block.block06 {
  grid-column: 3;
  grid-row: 2/6;
  border-top: 1px solid #231815;
  border-left: 1px solid #231815;
  padding-block: min(5.3333333333vw, 80px);
}
@media screen and (max-width: 767px) {
  .p-kv__block.block06 {
    grid-row: 2;
    grid-column: 1;
    border-left: none;
    padding-block: 8vw;
  }
}
.p-kv__block.block06 .p-img-change {
  width: 16vw;
  height: 25.8666666667vw;
}
@media screen and (max-width: 767px) {
  .p-kv__block.block06 .p-img-change {
    width: 22.1333333333vw;
    height: 31.2vw;
  }
}
.p-kv__block.block07 {
  grid-column: 4;
  grid-row: 4/6;
  border-top: 1px solid #231815;
  border-left: 1px solid #231815;
}
@media screen and (max-width: 767px) {
  .p-kv__block.block07 {
    grid-column: 2/4;
    grid-row: 4/6;
  }
}
.p-kv__block.block07 .p-img-change {
  width: 22.6666666667vw;
  height: 11.3333333333vw;
}
@media screen and (max-width: 767px) {
  .p-kv__block.block07 .p-img-change {
    width: 42.4vw;
    height: 21.0666666667vw;
  }
}
.p-kv__block.block08 {
  grid-column: 1;
  grid-row: 5;
  border-top: 1px solid #231815;
  padding-block: min(1.3333333333vw, 20px);
}
@media screen and (max-width: 767px) {
  .p-kv__block.block08 {
    grid-column: 2/4;
    grid-row: 6;
    border-left: 1px solid #231815;
    padding-block: 10.6666666667vw;
  }
}
.p-kv__block.block08 p {
  font-size: min(0.6666666667vw, 0.625rem);
  font-weight: 500;
}
.p-kv__block.block08 p span {
  position: relative;
}
.p-kv__block.block08 p span::after {
  content: "";
  position: absolute;
  top: 0;
  left: calc(100% + 1em);
  width: 0.6em;
  height: 0.6em;
  border-bottom: 1px solid #000;
  border-right: 1px solid #000;
  transform: rotate(45deg);
}
@media screen and (max-width: 767px) {
  .p-kv__block.block08 p span::after {
    width: 0.5em;
    height: 0.5em;
  }
}
@media screen and (max-width: 767px) {
  .p-kv__block.block08 p {
    font-size: 0.5625rem;
  }
}

.block01 .p-img-change .img01,
.block07 .p-img-change .img01 {
  -webkit-clip-path: polygon(0 0, 0% 0, 0% 100%, 0% 100%);
  clip-path: polygon(0 0, 0% 0, 0% 100%, 0% 100%);
  -webkit-animation: changeSideImg 6s 3s cubic-bezier(0.72, 0.16, 0.27, 1.01) infinite;
  animation: changeSideImg 6s 3s cubic-bezier(0.72, 0.16, 0.27, 1.01) infinite;
}
.block01 .p-img-change .img02,
.block07 .p-img-change .img02 {
  -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
  -webkit-animation: changeSideImg 6s 6s cubic-bezier(0.72, 0.16, 0.27, 1.01) infinite;
  animation: changeSideImg 6s 6s cubic-bezier(0.72, 0.16, 0.27, 1.01) infinite;
}

.block07 .p-img-change .img01 {
  -webkit-animation-delay: 0.5s;
  animation-delay: 0.5s;
}
.block07 .p-img-change .img02 {
  -webkit-animation-delay: 3.5s;
  animation-delay: 3.5s;
}

@-webkit-keyframes changeSideImg {
  0% {
    -webkit-clip-path: polygon(0 0, 0% 0, 0% 100%, 0% 100%);
    clip-path: polygon(0 0, 0% 0, 0% 100%, 0% 100%);
  }
  5% {
    z-index: 1;
    -webkit-clip-path: polygon(0 0, 0% 0, 0% 100%, 0% 100%);
    clip-path: polygon(0 0, 0% 0, 0% 100%, 0% 100%);
  }
  10% {
    z-index: 2;
    -webkit-clip-path: polygon(0 0, 0% 0, 0% 100%, 0% 100%);
    clip-path: polygon(0 0, 0% 0, 0% 100%, 0% 100%);
  }
  15% {
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
  }
  100% {
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
  }
}

@keyframes changeSideImg {
  0% {
    -webkit-clip-path: polygon(0 0, 0% 0, 0% 100%, 0% 100%);
    clip-path: polygon(0 0, 0% 0, 0% 100%, 0% 100%);
  }
  5% {
    z-index: 1;
    -webkit-clip-path: polygon(0 0, 0% 0, 0% 100%, 0% 100%);
    clip-path: polygon(0 0, 0% 0, 0% 100%, 0% 100%);
  }
  10% {
    z-index: 2;
    -webkit-clip-path: polygon(0 0, 0% 0, 0% 100%, 0% 100%);
    clip-path: polygon(0 0, 0% 0, 0% 100%, 0% 100%);
  }
  15% {
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
  }
  100% {
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
  }
}
.block06 .img01 {
  -webkit-animation: changeSideImg-rev 6s 2.2s ease-in-out infinite;
  animation: changeSideImg-rev 6s 2.2s ease-in-out infinite;
}
.block06 .img02 {
  -webkit-animation: changeSideImg-rev 6s 5.2s ease-in-out infinite;
  animation: changeSideImg-rev 6s 5.2s ease-in-out infinite;
}

.block05 .img01 {
  -webkit-animation: changeSideImg-rev 6s 1.5s ease-in-out infinite;
  animation: changeSideImg-rev 6s 1.5s ease-in-out infinite;
}
.block05 .img02 {
  -webkit-animation: changeSideImg-rev 6s 4.5s ease-in-out infinite;
  animation: changeSideImg-rev 6s 4.5s ease-in-out infinite;
}

@-webkit-keyframes changeSideImg-rev {
  0% {
    -webkit-clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);
    clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);
  }
  5% {
    z-index: 1;
    -webkit-clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);
    clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);
  }
  10% {
    z-index: 2;
    -webkit-clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);
    clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);
  }
  15% {
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
  }
  100% {
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
  }
}

@keyframes changeSideImg-rev {
  0% {
    -webkit-clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);
    clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);
  }
  5% {
    z-index: 1;
    -webkit-clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);
    clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);
  }
  10% {
    z-index: 2;
    -webkit-clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);
    clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);
  }
  15% {
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
  }
  100% {
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
  }
}
.block02 .p-img-change,
.block04 .p-img-change {
  display: grid;
  transform-style: preserve-3d;
  perspective: 600px;
}
.block02 .img01,
.block02 .img02,
.block04 .img01,
.block04 .img02 {
  position: relative !important;
  grid-column: 1;
  grid-row: 1;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
.block02 .img01,
.block04 .img01 {
  -webkit-animation: frontFilip 7s 1s cubic-bezier(0.11, 0.11, 0.59, 1.3) infinite;
  animation: frontFilip 7s 1s cubic-bezier(0.11, 0.11, 0.59, 1.3) infinite;
  transform: rotateY(0deg);
}
.block02 .img02,
.block04 .img02 {
  transform: rotateY(-180deg);
  -webkit-animation: backFilip 7s 1s cubic-bezier(0.11, 0.11, 0.59, 1.3) infinite;
  animation: backFilip 7s 1s cubic-bezier(0.11, 0.11, 0.59, 1.3) infinite;
}

.block04 .img01,
.block04 .img02 {
  -webkit-animation-delay: 0.2s;
  animation-delay: 0.2s;
}

@-webkit-keyframes frontFilip {
  0% {
    transform: rotateY(0deg);
  }
  42.8% {
    transform: rotateY(0deg);
  }
  50% {
    transform: rotateY(180deg);
  }
  50.1% {
    transform: rotateY(-180deg);
  }
  60% {
    transform: rotateY(-180deg);
  }
  60.1% {
    transform: rotateY(-180deg);
  }
  92.8% {
    transform: rotateY(-180deg);
  }
  100% {
    transform: rotateY(0deg);
  }
}

@keyframes frontFilip {
  0% {
    transform: rotateY(0deg);
  }
  42.8% {
    transform: rotateY(0deg);
  }
  50% {
    transform: rotateY(180deg);
  }
  50.1% {
    transform: rotateY(-180deg);
  }
  60% {
    transform: rotateY(-180deg);
  }
  60.1% {
    transform: rotateY(-180deg);
  }
  92.8% {
    transform: rotateY(-180deg);
  }
  100% {
    transform: rotateY(0deg);
  }
}
@-webkit-keyframes backFilip {
  0% {
    transform: rotateY(-180deg);
  }
  42.8% {
    transform: rotateY(-180deg);
  }
  50% {
    transform: rotateY(0deg);
  }
  50.1% {
    transform: rotateY(0deg);
  }
  60% {
    transform: rotateY(0deg);
  }
  60.1% {
    transform: rotateY(0deg);
  }
  92.8% {
    transform: rotateY(0deg);
  }
  100% {
    transform: rotateY(180deg);
  }
}
@keyframes backFilip {
  0% {
    transform: rotateY(-180deg);
  }
  42.8% {
    transform: rotateY(-180deg);
  }
  50% {
    transform: rotateY(0deg);
  }
  50.1% {
    transform: rotateY(0deg);
  }
  60% {
    transform: rotateY(0deg);
  }
  60.1% {
    transform: rotateY(0deg);
  }
  92.8% {
    transform: rotateY(0deg);
  }
  100% {
    transform: rotateY(180deg);
  }
}
.p-introduction {
  border-top: 1px solid #231815;
}

.p-introduction__content {
  display: flex;
  flex-direction: row-reverse;
}
@media screen and (max-width: 767px) {
  .p-introduction__content {
    display: block;
  }
}

.c-btn-arrow {
  font-size: 1rem;
  font-weight: 700;
  color: #fff;
  display: block;
  min-height: 40px;
  border-radius: 5px;
  text-decoration: none;
  background-color: #3e3a39;
  padding: 5px 0 5px 28px;
  position: relative;
  border: 1px solid #3e3a39;
  transition:
    0.3s color,
    0.3s background-color;
  font-family: zen-kaku-gothic-antique, sans-serif;
}
@media screen and (max-width: 767px) {
  .c-btn-arrow {
    border-radius: 3px;
    font-size: 0.8125rem;
    min-height: 46px;
    padding: 10px 0 10px 56px;
  }
}
@media (any-hover: hover) {
  .c-btn-arrow:hover {
    background-color: #fefff7;
    color: #3e3a39;
  }
  .c-btn-arrow:hover::after {
    background-color: #3e3a39;
    right: calc(32px - 0.5em);
  }
}
.c-btn-arrow::after {
  transition:
    0.3s background-color,
    0.3s right;
  content: "";
  position: absolute;
  width: min(7.3333333333vw, 110px);
  height: min(0.6666666667vw, 10px);
  content: "";
  background-color: #fefff7;
  -webkit-mask-image: url('data:image/svg+xml;utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 112.68 9.72"><title>arrow</title><polygon class="cls-1" points="112.68 9.72 0 9.72 0 8.72 110.27 8.72 102.25 .71 102.96 0 112.68 9.72"/></svg>');
  mask-image: url('data:image/svg+xml;utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 112.68 9.72"><title>arrow</title><polygon class="cls-1" points="112.68 9.72 0 9.72 0 8.72 110.27 8.72 102.25 .71 102.96 0 112.68 9.72"/></svg>');
  display: block;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  right: 32px;
  top: 0.8em;
}
@media screen and (max-width: 767px) {
  .c-btn-arrow::after {
    width: 77px;
    height: 8px;
    right: 50px;
    top: 1.3em;
  }
}

.p-introduction__nav-content {
  width: 37.1428571429%;
  padding-top: min(5.3333333333vw, 80px);
  padding-inline: min(3.3333333333vw, 50px);
  width: 37.1428571429%;
}
@media screen and (max-width: 767px) {
  .p-introduction__nav-content {
    width: auto;
    padding-top: 30px;
    padding-bottom: 47px;
    border-top: 1px solid #231815;
  }
}

.p-introduction__txt-content {
  width: 70%;
  border-left: 1px solid #231815;
  padding: min(5.3333333333vw, 80px) min(3.3333333333vw, 50px);
}
@media screen and (max-width: 767px) {
  .p-introduction__txt-content {
    padding: 45px 18px;
    width: auto;
  }
}
.p-introduction__txt-content .p-txt-wrapper {
  max-width: 856px;
  margin-inline: auto;
}
@media screen and (max-width: 767px) {
  .p-introduction__txt-content .p-txt-wrapper {
    max-width: inherit;
  }
}
.p-introduction__txt-content p {
  font-size: 2rem;
  font-weight: 500;
  line-height: 2.3125;
  letter-spacing: 0.3em;
  color: #b4b4b5;
}
@media screen and (max-width: 767px) {
  .p-introduction__txt-content p {
    font-size: 1.05rem;
    line-height: 2.2321428571;
  }
}
.p-introduction__txt-content p span {
  opacity: 0;
}
.p-introduction__txt-content p span.is-active {
  opacity: 1;
}
.p-introduction__txt-content p .c-frame {
  position: relative;
  display: inline-table;
  color: #000;
}
.p-introduction__txt-content p .c-frame.is-active::after {
  visibility: visible;
}
.p-introduction__txt-content p .c-frame::after {
  content: "";
  position: absolute;
  top: 50%;
  left: calc(38% - 1px);
  transform: translate(-50%, -50%);
  width: calc(1em + 8px);
  height: calc(1em + 8px);
  border: 1px solid #000;
  visibility: hidden;
  transition: 1s 0.1s visibility;
}
@media screen and (max-width: 767px) {
  .p-introduction__txt-content p .c-frame::after {
    width: calc(1em + 4px);
    height: calc(1em + 4px);
  }
}

.win .p-introduction__txt-content .p-txt-wrapper p .c-frame::after {
  top: 55%;
}

.p-introduction__nav-inner {
  max-width: 280px;
  margin-inline: auto;
}
@media screen and (max-width: 767px) {
  .p-introduction__nav-inner {
    max-width: 74.6666666667vw;
  }
}
.p-introduction__nav-inner .p-btn-wrapper {
  margin-top: 40px;
}
@media screen and (max-width: 767px) {
  .p-introduction__nav-inner .p-btn-wrapper {
    margin-top: 20px;
  }
}

.p-about__ttl {
  padding: min(5.3333333333vw, 80px) min(3.3333333333vw, 50px);
  text-align: center;
  color: #fff;
  font-size: 3.625rem;
  background-color: #3e3a39;
  word-break: keep-all;
  line-height: 1.4;
}
@media screen and (max-width: 767px) {
  .p-about__ttl {
    padding-block: 38px;
    font-size: 1.6375rem;
  }
}

.p-about__content {
  display: flex;
  flex-direction: row-reverse;
  align-items: flex-start;
}

.p-about__side {
  width: 320px;
  flex-shrink: 0;
  position: -webkit-sticky;
  position: sticky;
  min-height: 100vh;
  top: 0;
}
@media screen and (max-width: 1199px) {
  .p-about__side {
    width: 220px;
  }
}
@media screen and (max-width: 767px) {
  .p-about__side {
    display: none;
  }
}

.p-about__wrapper {
  flex-grow: 1;
  border-right: 1px solid #231815;
}

.p-about__side-ttl-wrapper {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  opacity: 0;
  transition: 0.3s opacity;
}
.p-about__side-ttl-wrapper.is-show {
  opacity: 1;
}

.p-about__block-ttl-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: min(4vw, 60px);
}
.p-about__block-ttl-wrapper .c-ttl {
  font-size: 1.75rem;
  writing-mode: vertical-rl;
  font-weight: 500;
}

.p-about__block {
  display: grid;
  grid-auto-columns: 1fr;
  grid-auto-rows: 1fr;
  gap: 0px 0px;
}
.p-about__block .p-about__block-ttl-wrapper {
  display: none;
}
@media screen and (max-width: 767px) {
  .p-about__block .p-about__block-ttl-wrapper {
    display: flex;
  }
}
.p-about__block:not(:first-of-type) {
  border-top: 1px solid #231815;
}
@media screen and (min-width: 767.98px) {
  .p-about__block:nth-of-type(odd) {
    grid-template-columns: 1fr 44.0677966102%;
    grid-template-rows: auto 1fr;
  }
  .p-about__block:nth-of-type(odd) .p-about__img-middle {
    grid-column: 2;
    grid-row: 1;
  }
  .p-about__block:nth-of-type(odd) .p-about__img-large {
    border-right: 1px solid #231815;
    grid-column: 1;
    grid-row: 1/3;
  }
  .p-about__block:nth-of-type(odd) .p-about__txt-wrapper {
    border-top: 1px solid #231815;
    grid-column: 2;
    grid-row: 2;
  }
}
@media screen and (min-width: 767.98px) {
  .p-about__block:nth-of-type(even) {
    grid-template-columns: 44.0677966102% 1fr;
    grid-template-rows: 1fr auto;
  }
  .p-about__block:nth-of-type(even) .p-about__img-middle {
    grid-column: 1;
    grid-row: 2;
    border-top: 1px solid #231815;
  }
  .p-about__block:nth-of-type(even) .p-about__img-large {
    grid-column: 2;
    grid-row: 1/3;
    border-left: 1px solid #231815;
  }
  .p-about__block:nth-of-type(even) .p-about__txt-wrapper {
    grid-column: 1;
    grid-row: 1;
  }
}
@media screen and (max-width: 767px) {
  .p-about__block {
    grid-template-columns: 1fr 28.75%;
    grid-template-rows: auto 1fr auto auto;
  }
}
.p-about__block .p-page-wrapper {
  display: none;
}
@media screen and (max-width: 767px) {
  .p-about__block .p-page-wrapper {
    display: grid !important;
    grid-column: 2;
    grid-row: 1;
    aspect-ratio: inherit;
  }
}
@media screen and (max-width: 767px) {
  .p-about__block .p-about__block-ttl-wrapper {
    flex-direction: column;
    align-items: center;
    padding-top: 20px;
    grid-column: 2;
    grid-row: 2;
  }
}
@media screen and (max-width: 767px) {
  .p-about__block .p-about__block-ttl-wrapper .c-ttl {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.p-about__block .p-about__img-middle {
  padding: min(6.6666666667vw, 100px) 18px min(7.3333333333vw, 110px);
}
@media screen and (max-width: 767px) {
  .p-about__block .p-about__img-middle {
    grid-column: 2;
    grid-row: 3;
    padding-block: 15px;
    border-top: 1px solid #231815;
  }
}
.p-about__block .p-about__img-middle .p-img-wrapper {
  width: 22.6666666667vw;
  height: 18.6666666667vw;
  margin-inline: auto;
}
.p-about__block .p-about__img-middle .p-img-wrapper img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}
@media screen and (max-width: 767px) {
  .p-about__block .p-about__img-middle .p-img-wrapper {
    width: 20.5333333333vw;
    height: 17.0666666667vw;
  }
}
.p-about__block .p-about__img-large {
  padding: min(6.6666666667vw, 100px) 18px min(5.3333333333vw, 80px);
  display: grid;
  align-items: center;
}
@media screen and (max-width: 767px) {
  .p-about__block .p-about__img-large {
    border-right: 1px solid #231815;
    grid-column: 1;
    grid-row: 1/4;
    padding-top: 24px;
    padding-bottom: 15px;
    display: block;
  }
}
.p-about__block .p-about__img-large .p-img-wrapper {
  overflow: hidden;
  margin-inline: auto;
  width: 33.3333333333vw;
  height: 47.3333333333vw;
}
.p-about__block .p-about__img-large .p-img-wrapper img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}
@media screen and (max-width: 767px) {
  .p-about__block .p-about__img-large .p-img-wrapper {
    width: 60vw;
    height: 100vw;
  }
}
.p-about__block .p-about__txt-wrapper {
  display: grid;
  place-content: center;
  padding: min(3.3333333333vw, 50px) 18px;
}
@media screen and (max-width: 767px) {
  .p-about__block .p-about__txt-wrapper {
    border-top: 1px solid #231815;
    grid-column: 1/3;
    grid-row: 4;
    padding: 36px 34px;
  }
}
.p-about__block .p-about__txt-wrapper .p-txt-wrapper {
  max-width: 346px;
  margin-inline: auto;
}
.p-about__block .p-about__txt-wrapper p {
  font-family: zen-kaku-gothic-antique, sans-serif;
  font-weight: 500;
  font-size: 0.875rem;
  line-height: 2.2857142857;
  text-align: justify;
}
@media screen and (max-width: 767px) {
  .p-about__block .p-about__txt-wrapper p {
    font-size: 0.75rem;
    line-height: 1.95;
  }
}

.p-page__nav {
  border-top: 1px solid #231815;
  border-bottom: 1px solid #231815;
}
@media screen and (max-width: 767px) {
  .p-page__nav {
    padding-inline: 18px;
  }
}

.p-page__nav-list {
  width: calc(100% - 200px);
  border-left: 1px solid #231815;
  border-right: 1px solid #231815;
  margin-inline: auto;
  display: flex;
}
@media screen and (max-width: 767px) {
  .p-page__nav-list {
    display: block;
    width: 100%;
    box-sizing: border-box;
  }
}

.p-page__nav-item {
  width: 33.333%;
}
@media screen and (max-width: 767px) {
  .p-page__nav-item {
    width: auto;
    position: relative;
    box-sizing: content-box;
    min-height: 320px;
  }
}
.p-page__nav-item:not(:last-of-type) {
  border-right: 1px solid #231815;
}
@media screen and (max-width: 767px) {
  .p-page__nav-item:not(:last-of-type) {
    border-right: none;
  }
  .p-page__nav-item:not(:last-of-type)::before {
    bottom: 0;
    content: "";
    width: 100vw;
    left: -19px;
    position: absolute;
    border-top: 1px solid #231815;
  }
}
.p-page__nav-item a {
  color: currentColor;
  text-decoration: none;
  display: block;
  height: 100%;
  position: relative;
  transition:
    0.3s background-color,
    0.3s color;
}
@media (any-hover: hover) {
  .p-page__nav-item a:hover {
    color: #fefff7;
    background-color: #3e3a39;
  }
  .p-page__nav-item a:hover::after {
    background-color: #fefff7;
  }
  .p-page__nav-item a:hover .p-page__nav-ttl::after {
    background-color: #fefff7;
  }
}
.p-page__nav-item a::after {
  display: none;
  transition: 0.3s background-color;
  content: "";
  position: absolute;
  width: 28px;
  height: 7.5px;
  background-color: #000;
  bottom: min(2vw, 30px);
  content: "";
  background-color: #000;
  -webkit-mask-image: url('data:image/svg+xml;utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 28.45 8.04"><title>arrow</title><polygon class="cls-1" points="14.22 8.04 0 .89 .45 0 14.22 6.92 28 0 28.45 .89 14.22 8.04"/></svg>');
  mask-image: url('data:image/svg+xml;utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 28.45 8.04"><title>arrow</title><polygon class="cls-1" points="14.22 8.04 0 .89 .45 0 14.22 6.92 28 0 28.45 .89 14.22 8.04"/></svg>');
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  bottom: 20px;
  right: 30px;
}
@media screen and (max-width: 900px) {
  .p-page__nav-item a::after {
    display: block;
  }
}
@media screen and (max-width: 767px) {
  .p-page__nav-item a::after {
    display: none;
  }
}

.p-page__nav-inner {
  padding-top: clamp(20px, 4vw, 60px);
  padding-left: clamp(20px, 3.3333333333vw, 50px);
  display: flex;
  flex-direction: row-reverse;
  height: 100%;
}
@media screen and (max-width: 900px) {
  .p-page__nav-inner {
    display: block;
    padding-right: clamp(20px, 3.3333333333vw, 50px);
  }
}
@media screen and (max-width: 767px) {
  .p-page__nav-inner {
    display: flex;
    margin-right: 0;
    padding-top: 36px;
    padding-right: 0;
    padding-left: 0;
  }
}
.p-page__nav-inner .p-img-wrapper {
  width: 100%;
}
.p-page__nav-inner .p-img-wrapper img {
  width: 100%;
}

.p-page__nav-ttl {
  writing-mode: vertical-rl;
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-size: min(2.4vw, 2.25rem);
  letter-spacing: 0.024em;
  padding-block: min(2.2vw, 33px);
  position: relative;
}
.p-page__nav-ttl::after {
  transition: 0.3s background-color;
  content: "";
  position: absolute;
  width: 28px;
  height: 7.5px;
  background-color: #000;
  bottom: min(2vw, 30px);
  content: "";
  background-color: #000;
  -webkit-mask-image: url('data:image/svg+xml;utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 28.45 8.04"><title>arrow</title><polygon class="cls-1" points="14.22 8.04 0 .89 .45 0 14.22 6.92 28 0 28.45 .89 14.22 8.04"/></svg>');
  mask-image: url('data:image/svg+xml;utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 28.45 8.04"><title>arrow</title><polygon class="cls-1" points="14.22 8.04 0 .89 .45 0 14.22 6.92 28 0 28.45 .89 14.22 8.04"/></svg>');
  display: block;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  bottom: 25px;
}
@media screen and (max-width: 900px) {
  .p-page__nav-ttl::after {
    display: none;
  }
}
@media screen and (max-width: 767px) {
  .p-page__nav-ttl::after {
    display: block;
  }
}
@media screen and (max-width: 900px) {
  .p-page__nav-ttl {
    display: block;
    writing-mode: horizontal-tb;
  }
}
@media screen and (max-width: 767px) {
  .p-page__nav-ttl {
    display: flex;
    writing-mode: vertical-rl;
    font-size: 1.93125rem;
    padding-block: 1.3333333333vw;
  }
}

.p-page__nav-body {
  flex-grow: 1;
  max-width: calc(100% - min(7.3333333333vw, 110px));
  padding-bottom: clamp(20px, 4.8vw, 72px);
}
@media screen and (max-width: 900px) {
  .p-page__nav-body {
    max-width: inherit;
    box-sizing: content-box;
  }
}
@media screen and (max-width: 767px) {
  .p-page__nav-body {
    padding-inline: 34px;
  }
}
.p-page__nav-body .c-ttl {
  font-size: 1.125rem;
  line-height: 1.2222222222;
  margin-top: min(4.8vw, 72px);
  font-weight: 700;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 767px) {
  .p-page__nav-body .c-ttl {
    line-height: 1.4285714286;
    margin-top: 12px;
    font-size: 0.81875rem;
  }
}
.p-page__nav-body .c-list {
  font-family: zen-kaku-gothic-antique, sans-serif;
  font-size: 0.9375rem;
  line-height: 1.4;
  margin-top: min(2.9333333333vw, 44px);
}
@media screen and (max-width: 767px) {
  .p-page__nav-body .c-list {
    line-height: 1.3;
    margin-top: 22px;
    font-size: 0.64375rem;
  }
}
.p-page__nav-body .c-list li {
  text-indent: -1em;
  padding-left: 1em;
}

.p-works {
  display: flex;
}
.p-works:not(:first-of-type) {
  border-top: 1px solid #231815;
}
.p-works.-rev {
  flex-direction: row-reverse;
  flex-direction: row-reverse;
}
.p-works.-rev .p-wroks__side {
  border-right: none;
  border-left: 1px solid #231815;
}
.p-works.-rev .p-works__content {
  flex-direction: row-reverse;
}
.p-works.-rev .p-img-content {
  border-left: none !important;
  border-right: 1px solid #231815;
}
@media screen and (max-width: 767px) {
  .p-works.-rev .p-img-content {
    border-right: none;
  }
}
.p-works.-rev .p-ttl-content {
  border-right: none !important;
  border-left: 1px solid #231815;
}
@media screen and (max-width: 767px) {
  .p-works.-rev .p-ttl-content {
    border-left: none;
  }
  .p-works.-rev .p-ttl-content.-single {
    padding-top: 49px;
    padding-bottom: 34px;
  }
}
.p-works.-rev .content02 .p-ttl-content {
  width: 52%;
  flex-shrink: 0;
}
@media screen and (max-width: 767px) {
  .p-works.-rev .content02 .p-ttl-content {
    padding-top: 59px;
    padding-bottom: 50px;
    width: auto;
  }
}
@media screen and (max-width: 767px) {
  .p-works.-rev .content02 .p-txt-content {
    padding-bottom: 45px;
  }
}

.p-wroks__side {
  width: 101px;
  border-right: 1px solid #231815;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 156px;
  padding-bottom: 50px;
}
@media screen and (max-width: 767px) {
  .p-wroks__side {
    width: 19px;
    padding-top: 10px;
  }
}
.p-wroks__side .c-section__ttl {
  writing-mode: vertical-rl;
  font-size: 1.4375rem;
  position: -webkit-sticky;
  position: sticky;
  top: 156px;
  padding-top: 46px;
  letter-spacing: 0.025em;
}
@media screen and (max-width: 767px) {
  .p-wroks__side .c-section__ttl {
    font-size: 0.64375rem;
    padding-top: 38px;
    top: 60px;
  }
}
.p-wroks__side .c-section__ttl::before {
  content: "";
  position: absolute;
  width: 1px;
  background-color: #231815;
  height: 27px;
  bottom: calc(100% - 30px);
  left: 50%;
}
@media screen and (max-width: 767px) {
  .p-wroks__side .c-section__ttl::before {
    height: 12px;
  }
}

.p-works__body {
  flex-grow: 1;
  width: calc(100% - 101px);
}
.p-works__body .p-ttl-content.-single {
  padding-top: min(11.8666666667vw, 178px);
  padding-bottom: min(9.3333333333vw, 140px);
}
@media screen and (max-width: 767px) {
  .p-works__body .p-ttl-content.-single {
    padding-top: 52px;
    padding-bottom: 37px;
  }
}

.p-works__content {
  display: flex;
  border-top: 1px solid #231815;
}
@media screen and (max-width: 767px) {
  .p-works__content {
    display: block;
    flex-grow: 1;
  }
}
.p-works__content p {
  font-size: 0.875rem;
  font-family: zen-kaku-gothic-antique, sans-serif;
  line-height: 2.2857142857;
  letter-spacing: 0.04em;
  text-align: justify;
}
@media screen and (max-width: 767px) {
  .p-works__content p {
    font-size: 0.75rem;
    line-height: 2;
    letter-spacing: 0;
  }
}
.p-works__content .p-txt-content {
  padding: min(5.8666666667vw, 88px) clamp(18px, 3.6666666667vw, 55px);
  display: grid;
  place-content: center;
  width: 66.4285714286%;
  flex-shrink: 0;
}
@media screen and (max-width: 767px) {
  .p-works__content .p-txt-content {
    padding: 32px 19px;
  }
}
.p-works__content .p-img-content {
  border-left: 1px solid #231815;
  display: grid;
  place-content: center;
  flex-shrink: 0;
  padding: min(4.6666666667vw, 70px) min(5.6vw, 84px) min(2.9333333333vw, 44px);
  width: 33.5714285714%;
  flex-shrink: 0;
}
@media screen and (max-width: 767px) {
  .p-works__content .p-img-content {
    padding: 33px 56px;
    border-top: 1px solid #231815;
    border-left: none;
    width: auto;
  }
}
.p-works__content .p-img-content .p-img-wrapper {
  width: 21.3333333333vw;
}
@media screen and (max-width: 767px) {
  .p-works__content .p-img-content .p-img-wrapper {
    width: auto;
  }
}
.p-works__content .p-img-content .p-img-wrapper img {
  width: 100%;
}
.p-works__content.content01 .p-txt-content {
  flex-shrink: 0;
}
@media screen and (max-width: 767px) {
  .p-works__content.content01 .p-txt-content {
    width: auto;
  }
}
.p-works__content.content01 .p-txt-wrapper {
  max-width: 686px;
}
@media screen and (max-width: 767px) {
  .p-works__content.content01 .p-txt-wrapper {
    max-width: inherit;
  }
}
.p-works__content.content02 .p-ttl-content,
.p-works__content.content02 .p-txt-content {
  width: 50%;
}
@media screen and (max-width: 767px) {
  .p-works__content.content02 .p-ttl-content,
  .p-works__content.content02 .p-txt-content {
    width: auto;
  }
}
.p-works__content.content02 .p-ttl-content {
  display: grid;
  place-content: center;
  border-right: 1px solid #231815;
}
@media screen and (max-width: 767px) {
  .p-works__content.content02 .p-ttl-content {
    border-right: none;
    padding-top: 38px;
    padding-bottom: 31px;
  }
}
.p-works__content.content02 .p-txt-content .p-txt-wrapper {
  max-width: 456px;
}
@media screen and (max-width: 767px) {
  .p-works__content.content02 .p-txt-content .p-txt-wrapper {
    max-width: inherit;
  }
}
@media screen and (max-width: 767px) {
  .p-works__content.content02 .p-txt-content {
    border-top: 1px solid #231815;
  }
}
.p-works__content.content03 .p-txt-content {
  width: 40%;
  background-color: #3e3a39;
  color: #fff;
  padding: min(4.4vw, 66px) 18px;
  display: grid;
  justify-content: center;
  flex-shrink: 0;
}
@media screen and (max-width: 767px) {
  .p-works__content.content03 .p-txt-content {
    width: auto;
    padding: 40px 20px 30px;
    display: block;
  }
}
.p-works__content.content03 .p-txt-wrapper {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  font-family: zen-kaku-gothic-antique, sans-serif;
}
.p-works__content.content03 .p-txt-wrapper .c-ttl {
  font-weight: 700;
  font-size: 1.3125rem;
}
@media screen and (max-width: 767px) {
  .p-works__content.content03 .p-txt-wrapper .c-ttl {
    font-size: 0.9375rem;
  }
}
.p-works__content.content03 .p-txt-wrapper .c-list {
  font-size: 0.96875rem;
  line-height: 2.064516129;
  margin-top: 18px;
}
@media screen and (max-width: 767px) {
  .p-works__content.content03 .p-txt-wrapper .c-list {
    font-size: 0.7875rem;
    line-height: 1.9285714286;
  }
}
.p-works__content.content03 .p-txt-wrapper .c-list.-indent li {
  padding-left: 1em;
  text-indent: -1em;
}
.p-works__content.content03 .p-link-content {
  color: currentColor;
  text-decoration: none;
  position: relative;
  width: 60%;
  display: grid;
  place-content: center;
  padding: min(3.0666666667vw, 46px) min(3.3333333333vw, 50px);
}
@media screen and (max-width: 767px) {
  .p-works__content.content03 .p-link-content {
    width: auto;
    padding: 28px 18px 50px;
  }
}
.p-works__content.content03 .p-link-content .c-link-txt {
  position: absolute;
  bottom: 16px;
  right: 50px;
  font-size: 1rem;
}
@media screen and (max-width: 767px) {
  .p-works__content.content03 .p-link-content .c-link-txt {
    font-size: 0.875rem;
    bottom: 18px;
  }
}
.p-works__content.content03 .p-link-inner {
  max-width: min(42.5333333333vw, 638px);
}
@media screen and (max-width: 767px) {
  .p-works__content.content03 .p-link-inner {
    max-width: inherit;
  }
}
.p-works__content.content03 .p-link-inner .p-ttl-wrapper {
  position: relative;
}
.p-works__content.content03 .p-link-inner .p-ttl-wrapper .c-blank {
  width: 1em;
  height: 1em;
  display: inline-block;
  position: relative;
  left: 0.05em;
  top: 0.2em;
}
@media screen and (max-width: 767px) {
  .p-works__content.content03 .p-link-inner .p-ttl-wrapper .c-blank {
    left: 0.05em;
  }
}
.p-works__content.content03 .p-link-inner .p-ttl-wrapper .c-blank.u-ml {
  margin-left: -0.8em;
}
.p-works__content.content03 .p-link-inner .p-ttl-wrapper .c-img {
  width: min(3.6666666667vw, 55px);
  height: min(3.6666666667vw, 55px);
  position: absolute;
  overflow: clip;
  line-height: 0;
}
@media screen and (max-width: 767px) {
  .p-works__content.content03 .p-link-inner .p-ttl-wrapper .c-img {
    width: 35px;
    height: 35px;
  }
}
.p-works__content.content03 .p-link-inner .p-ttl-wrapper .c-link-ttl {
  font-size: min(4.2vw, 3.9375rem);
  font-weight: 500;
  line-height: 1.0476190476 !important;
  display: inline;
}
@media screen and (max-width: 767px) {
  .p-works__content.content03 .p-link-inner .p-ttl-wrapper .c-link-ttl {
    font-size: 2.45625rem;
    line-height: 1.0254452926 !important;
  }
}

.l-apply-content {
  border-top: 1px solid #231815;
  padding-inline: 100px;
}
@media screen and (max-width: 767px) {
  .l-apply-content {
    padding-inline: 18px;
  }
}

.c-apply-btn {
  display: grid;
  min-height: 180px;
  background-color: #3e3a39;
  color: #fff;
  text-decoration: none;
  place-content: center;
  font-size: 1.75rem;
  letter-spacing: 0.04em;
  border-left: 1px solid #231815;
  border-right: 1px solid #231815;
  transition:
    0.3s color,
    0.3s background-color;
  position: relative;
}
.c-apply-btn::after {
  width: 19px;
  height: 19px;
  position: absolute;
  content: "";
  background-color: #fefff7;
  -webkit-mask-image: url('data:image/svg+xml;utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20.61 19.91"><title>arrow</title><polygon class="cls-1" points=".71 19.91 0 19.2 18.2 1 9.88 1 9.88 0 20.61 0 .71 19.91"/></svg>');
  mask-image: url('data:image/svg+xml;utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20.61 19.91"><title>arrow</title><polygon class="cls-1" points=".71 19.91 0 19.2 18.2 1 9.88 1 9.88 0 20.61 0 .71 19.91"/></svg>');
  display: block;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  bottom: 26px;
  right: 44px;
  transition: 0.3s background-color;
}
@media screen and (max-width: 767px) {
  .c-apply-btn {
    font-size: 1.1125rem;
    min-height: 84px;
  }
}
@media (any-hover: hover) {
  .c-apply-btn:hover {
    background-color: transparent;
    color: #000;
  }
  .c-apply-btn:hover::after {
    background-color: #3e3a39;
  }
}

.l-content__nav {
  border-top: 1px solid #231815;
  padding-inline: 100px;
}
@media screen and (max-width: 767px) {
  .l-content__nav {
    padding-inline: 0;
  }
}

.l-content__nav-list {
  display: flex;
  border-left: 1px solid #231815;
  border-right: 1px solid #231815;
}
@media screen and (max-width: 767px) {
  .l-content__nav-list {
    display: block;
    border: none;
  }
}

.l-content__nav-item {
  width: 33.333%;
}
@media screen and (max-width: 767px) {
  .l-content__nav-item {
    width: auto;
  }
}
.l-content__nav-item:not(:last-of-type) {
  border-right: 1px solid #231815;
}
@media screen and (max-width: 767px) {
  .l-content__nav-item:not(:last-of-type) {
    border-right: none;
    border-bottom: 1px solid #231815;
  }
}
.l-content__nav-item a {
  display: block;
  color: currentColor;
  text-decoration: none;
  height: 100%;
}

.l-content__nav-inner {
  padding: min(7.6666666667vw, 115px) min(3.3333333333vw, 50px) min(7.3333333333vw, 110px);
  /* display: grid;
  place-content: center; */
}
@media screen and (max-width: 767px) {
  .l-content__nav-inner {
    display: flex;
    align-items: center;
    flex-direction: row-reverse;
    padding: 26px 32px;
    justify-content: flex-end;
    -moz-column-gap: 25px;
    column-gap: 25px;
  }
}
.l-content__nav-inner .c-ttl {
  font-size: min(2.4666666667vw, 2.3rem);
  line-height: 1.3043478261;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  font-weight: 500;
}
@media screen and (max-width: 767px) {
  .l-content__nav-inner .c-ttl {
    margin-inline: 0;
    flex-grow: 1;
    font-size: 1.40625rem;
  }
}
.l-content__nav-inner .p-img-wrapper {
  margin-top: 37px;
  aspect-ratio: 240/200;
  width: 100%;
  overflow: clip;
  border-radius: 10px;
  width: 16vw;
  margin-inline: auto;
}
@media screen and (max-width: 767px) {
  .l-content__nav-inner .p-img-wrapper {
    margin-top: 0;
    width: 29.8666666667vw;
    border-radius: 5px;
  }
}
.l-content__nav-inner .p-img-wrapper img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

.c-arrow-link {
  color: currentColor;
  text-decoration: none;
  position: relative;
  display: block;
  transition:
    0.3s background-color,
    0.3s color;
}
@media (any-hover: hover) {
  .c-arrow-link:hover {
    background-color: #3e3a39;
    color: #fff !important;
  }
  .c-arrow-link:hover::before {
    background-color: #fefff7;
  }
}
.c-arrow-link::before {
  width: 19px;
  height: 19px;
  position: absolute;
  content: "";
  background-color: #3e3a39;
  -webkit-mask-image: url('data:image/svg+xml;utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20.61 19.91"><title>arrow</title><polygon class="cls-1" points=".71 19.91 0 19.2 18.2 1 9.88 1 9.88 0 20.61 0 .71 19.91"/></svg>');
  mask-image: url('data:image/svg+xml;utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20.61 19.91"><title>arrow</title><polygon class="cls-1" points=".71 19.91 0 19.2 18.2 1 9.88 1 9.88 0 20.61 0 .71 19.91"/></svg>');
  display: block;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  bottom: 23px;
  right: 23px;
  transition: 0.3s background-color;
}
@media screen and (max-width: 767px) {
  .c-arrow-link::before {
    width: 15px;
    height: 15px;
  }
}

.win .c-frame-ttl .p-wrap span {
  padding-bottom: 0.2em;
}

.c-frame-ttl {
  font-size: min(3.1333333333vw, 2.93125rem);
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  font-weight: 500;
}
@media screen and (max-width: 767px) {
  .c-frame-ttl {
    font-size: 1.75rem;
  }
}
.c-frame-ttl .p-wrap {
  display: flex;
}
.c-frame-ttl .p-wrap:not(:first-of-type) {
  margin-top: -1px;
}
.c-frame-ttl .p-wrap span {
  overflow: clip;
  position: relative;
  z-index: 2;
  line-height: 1;
  border: 1px solid #3e3a39;
  aspect-ratio: 1/1;
  height: min(4vw, 60px);
  width: min(4vw, 60px);
  display: grid;
  place-content: center;
  background-color: #fefff7;
}
.c-frame-ttl .p-wrap span:not(:first-of-type) {
  margin-left: -1px;
}
.c-frame-ttl .p-wrap span:has(img) {
  display: block;
  padding-bottom: 0 !important;
}
.c-frame-ttl .p-wrap span img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 2px;
}
@media screen and (max-width: 767px) {
  .c-frame-ttl .p-wrap span {
    width: 35px;
    height: 35px;
    border-color: #9e9c9c;
  }
}

/* ----------------------------------------------------------------------------------------------------
*	メッセージ
* --------------------------------------------------------------------------------------------------*/
.win .p-message__content .p-ttl-content .p-ttl-wrapper .c-ttl span {
  padding-block: 0.05em;
}

.p-message__content {
  display: flex;
  flex-direction: row-reverse;
}
@media screen and (max-width: 767px) {
  .p-message__content {
    display: block;
  }
}
.p-message__content:not(:first-of-type) {
  border-top: 1px solid #231815;
}
.p-message__content .p-ttl-content {
  padding: min(6.4666666667vw, 97px) min(3.3333333333vw, 50px);
  width: 32.6666666667%;
  flex-shrink: 0;
}
@media screen and (max-width: 767px) {
  .p-message__content .p-ttl-content {
    width: auto;
    padding: 26px 5px 26px 18px;
  }
}
.p-message__content .p-ttl-content .p-ttl-wrapper {
  position: -webkit-sticky;
  position: sticky;
  top: 50px;
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: min(2.4vw, 36px);
}
@media screen and (max-width: 767px) {
  .p-message__content .p-ttl-content .p-ttl-wrapper {
    flex-direction: row;
    gap: 0 18px;
  }
}
.p-message__content .p-ttl-content .p-ttl-wrapper .p-img-wrapper {
  width: 17.3333333333vw;
  height: 17.3333333333vw;
}
.p-message__content .p-ttl-content .p-ttl-wrapper .p-img-wrapper img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}
@media screen and (max-width: 767px) {
  .p-message__content .p-ttl-content .p-ttl-wrapper .p-img-wrapper {
    width: 105px;
    height: 105px;
    flex-shrink: 0;
  }
}
.p-message__content .p-ttl-content .p-ttl-wrapper .c-ttl {
  writing-mode: vertical-rl;
  font-size: 1.5rem;
  line-height: 1.5;
  font-weight: 500;
}
@media screen and (max-width: 767px) {
  .p-message__content .p-ttl-content .p-ttl-wrapper .c-ttl {
    writing-mode: horizontal-tb;
    font-size: 0.9375rem;
    line-height: 1.56;
    flex-grow: 1;
  }
}
.p-message__content .p-ttl-content .p-ttl-wrapper .c-ttl span {
  border: 1px solid #231815;
  display: inline-block;
  line-height: 1;
}
.p-message__content .p-ttl-content .p-ttl-wrapper .c-ttl span.u-noframe {
  border: none;
}
.p-message__content .p-ttl-content .p-ttl-wrapper .c-ttl span:not(:first-of-type) {
  margin-top: -1px;
}
@media screen and (max-width: 767px) {
  .p-message__content .p-ttl-content .p-ttl-wrapper .c-ttl span:not(:first-of-type) {
    margin: 0 0 0 -1px;
  }
}
.p-message__content .p-txt-content {
  width: 67.3333333333%;
  border-right: 1px solid #231815;
  display: grid;
  place-content: center;
  padding: min(7.3333333333vw, 110px) min(3.3333333333vw, 50px);
}
@media screen and (max-width: 767px) {
  .p-message__content .p-txt-content {
    width: 100%;
    border-right: none;
    border-top: 1px solid #231815;
    padding: 32px 18px;
  }
}
.p-message__content .p-txt-content .p-txt-wrapper {
  max-width: 800px;
  position: relative;
}
.p-message__content .p-txt-content .p-txt-wrapper .p-txt-inner.-front {
  position: absolute;
  top: 0;
  left: 0;
}
.p-message__content .p-txt-content .p-txt-wrapper .p-txt-inner p {
  text-indent: 1em;
}
@media screen and (max-width: 767px) {
  .p-message__content .p-txt-content .p-txt-wrapper .p-txt-inner p {
    font-size: 0.99375rem;
    line-height: 2.1194968553;
  }
}

.js-split {
  font-size: 1.75rem;
  line-height: 2.3571428571;
  color: #b4b4b5;
  text-align: justify;
}

/* ----------------------------------------------------------------------------------------------------
*	募集要項・応募フォーム
* --------------------------------------------------------------------------------------------------*/
.p-cotanct__content {
  padding-top: min(8.6666666667vw, 130px);
}
@media screen and (max-width: 767px) {
  .p-cotanct__content {
    padding-top: 30px;
  }
}
.p-cotanct__content .c-heading__txt {
  text-align: center;
  font-size: 0.875rem;
  font-family: zen-kaku-gothic-antique, sans-serif;
  margin-top: min(1.3333333333vw, 20px);
}
@media screen and (max-width: 767px) {
  .p-cotanct__content .c-heading__txt {
    font-size: 0.6875rem;
  }
}
.p-cotanct__content:not(:first-of-type) {
  border-top: 1px solid #231815;
}
.p-cotanct__content .c-section__ttl {
  text-align: center;
  font-weight: 500;
  font-size: 2.25rem;
}
@media screen and (max-width: 767px) {
  .p-cotanct__content .c-section__ttl {
    font-size: 1.5625rem;
  }
}

.p-job-description {
  display: flex;
  margin-top: min(5.8666666667vw, 88px);
  border-top: 1px solid #231815;
}

.p-job-description__side {
  width: 240px;
  flex-shrink: 0;
  border-right: 1px solid #231815;
  padding-block: 30px;
}
@media screen and (max-width: 900px) {
  .p-job-description__side {
    width: 100px;
  }
}
@media screen and (max-width: 767px) {
  .p-job-description__side {
    width: 40px;
    padding-block: 10px;
  }
}
.p-job-description__side .p-btn-wrapper {
  top: 100px;
  position: -webkit-sticky;
  position: sticky;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
}
@media screen and (max-width: 767px) {
  .p-job-description__side .p-btn-wrapper {
    margin-left: 0;
  }
}

.p-job-description__body {
  flex-grow: 1;
}

.p-job-description__table > div {
  display: flex;
}
.p-job-description__table > div:not(:first-of-type) {
  border-top: 1px solid #231815;
}
.p-job-description__table dt {
  writing-mode: vertical-rl;
  font-size: 1rem;
  width: 100px;
  border-right: 1px solid #231815;
  vertical-align: middle;
  padding-top: 40px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  flex-shrink: 0;
}
@media screen and (max-width: 767px) {
  .p-job-description__table dt {
    width: 40px;
    font-size: 0.75rem;
    padding-top: 18px;
    letter-spacing: 0;
  }
}
.p-job-description__table dd {
  flex-grow: 1;
  font-size: 0.875rem;
  line-height: 2.5714285714;
  padding: 50px;
}
@media screen and (max-width: 767px) {
  .p-job-description__table dd {
    font-size: 0.6875rem;
    padding: 25px 15px;
  }
}
.p-job-description__table dd * {
  font-size: 0.875rem;
  line-height: 2.5714285714;
}
@media screen and (max-width: 767px) {
  .p-job-description__table dd * {
    font-size: 0.6875rem;
    line-height: 1.7;
  }
}
@media screen and (max-width: 767px) {
  .p-job-description__table dd p {
    line-height: 1.7;
  }
}
.p-job-description__table dd ul + p,
.p-job-description__table dd ol + p {
  margin-top: 1em;
}
.p-job-description__table dd ol li {
  text-indent: -1.3em;
  padding-left: 1.3em;
}
.p-job-description__table dd ul li {
  padding-left: 1em;
  text-indent: -1em;
}
.p-job-description__table .p-company {
  line-height: 1.4;
}
.p-job-description__table .p-company .u-txtsize--large {
  font-size: 120%;
}

.p-job-description__table {
  font-family: zen-kaku-gothic-antique, sans-serif;
  width: 100%;
}
.p-job-description__table tr:not(:first-of-type) th,
.p-job-description__table tr:not(:first-of-type) td {
  border-top: 1px solid #231815;
}
.p-job-description__table th {
  font-size: 1rem;
  width: 100px;
  border-right: 1px solid #231815;
  vertical-align: middle;
  /* letter-spacing: -0.4em; */
  padding-top: 40px;
}
.p-job-description__table th p {
  writing-mode: vertical-rl;
  text-orientation: upright;
  display: block;
  font-size: 1rem;
}
@media screen and (max-width: 767px) {
  .p-job-description__table th p {
    font-size: 0.75rem;
  }
}
@media screen and (max-width: 767px) {
  .p-job-description__table th {
    width: 40px;
    font-size: 0.75rem;
    padding-top: 18px;
    letter-spacing: 0;
  }
}
.p-job-description__table td {
  font-size: 0.875rem;
  line-height: 2.5714285714;
  padding: 50px;
}
@media screen and (max-width: 767px) {
  .p-job-description__table td {
    font-size: 0.6875rem;
    padding: 25px 15px;
  }
}
.p-job-description__table td * {
  font-size: 0.875rem;
  line-height: 2.5714285714;
}
@media screen and (max-width: 767px) {
  .p-job-description__table td * {
    font-size: 0.6875rem;
    line-height: 1.7;
  }
}
@media screen and (max-width: 767px) {
  .p-job-description__table td p {
    line-height: 1.7;
  }
}
.p-job-description__table td ul + p,
.p-job-description__table td ol + p {
  margin-top: 1em;
}
.p-job-description__table li {
  line-height: 2;
}
@media screen and (max-width: 767px) {
  .p-job-description__table li {
    line-height: 1.7;
  }
}
.p-job-description__table li + li {
  margin-top: 0.5em;
}
@media screen and (max-width: 767px) {
  .p-job-description__table li + li {
    margin-top: 0.2em;
  }
}
@media screen and (max-width: 767px) {
  .p-job-description__table ol li + li {
    margin-top: 0.5em;
  }
}

.c-application-btn {
  font-size: 1rem;
  text-decoration: none;
  background-color: #3e3a39;
  color: #fff;
  border-radius: 5px;
  display: block;
  padding: 36px 2px;
  width: 120px;
  height: 107px;
  position: relative;
  border: 1px solid #3e3a39;
  text-align: center;
  font-weight: 500;
  transition:
    0.3s background-color,
    0.3s color;
}
@media screen and (max-width: 900px) {
  .c-application-btn {
    writing-mode: vertical-rl;
    height: auto;
    width: 80px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-top: 20px;
  }
}
@media screen and (max-width: 767px) {
  .c-application-btn {
    width: 32px;
    left: 0;
    font-size: 0.6875rem;
    border-radius: 0 3px 3px 0;
    padding-inline: 10px 24px;
    height: auto;
  }
}
@media (any-hover: hover) {
  .c-application-btn:hover {
    background-color: transparent;
    color: #000;
  }
  .c-application-btn:hover::after {
    background-color: #3e3a39;
  }
}
.c-application-btn::after {
  transition: 0.3s background-color;
  content: "";
  position: absolute;
  bottom: 25px;
  width: 28px;
  height: 7px;
  background-color: #fefff7;
  -webkit-mask-image: url('data:image/svg+xml;utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 28.45 8.04"><title>arrow</title><polygon class="cls-1" points="14.22 8.04 0 .89 .45 0 14.22 6.92 28 0 28.45 .89 14.22 8.04"/></svg>');
  mask-image: url('data:image/svg+xml;utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 28.45 8.04"><title>arrow</title><polygon class="cls-1" points="14.22 8.04 0 .89 .45 0 14.22 6.92 28 0 28.45 .89 14.22 8.04"/></svg>');
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  left: 50%;
  transform: translateX(-50%);
}
@media screen and (max-width: 900px) {
  .c-application-btn::after {
    bottom: 15px;
  }
}
@media screen and (max-width: 767px) {
  .c-application-btn::after {
    width: 11px;
    height: 4px;
    bottom: 10px;
  }
}

.p-cotanct__content.content02 {
  padding-inline: 240px;
}
@media screen and (max-width: 1199px) {
  .p-cotanct__content.content02 {
    padding-inline: 100px;
  }
}
@media screen and (max-width: 767px) {
  .p-cotanct__content.content02 {
    padding-inline: 0;
    padding-top: 50px;
  }
}

.p-form__wrapper {
  border-left: 1px solid #231815;
  border-right: 1px solid #231815;
  max-width: 1024px;
  margin-inline: auto;
}

.p-contact__inner {
  margin-top: min(4vw, 60px);
  padding-bottom: min(11.3333333333vw, 170px);
  width: 100%;
  font-family: zen-kaku-gothic-antique, sans-serif;
  /* inputの位置と枠　*/
  /*　チェックマーク　*/
  /* ラジオボタンのチェック　*/
}
@media screen and (max-width: 767px) {
  .p-contact__inner {
    margin-top: 34px;
    padding-bottom: 0;
  }
}
.p-contact__inner .p-btn-unit {
  max-width: 1024px;
  margin-inline: auto;
}
.p-contact__inner input,
.p-contact__inner button,
.p-contact__inner select,
.p-contact__inner textarea {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: transparent;
  border: none;
  border-radius: 0;
  font: inherit;
  outline: none;
}
.p-contact__inner textarea {
  resize: vertical;
}
.p-contact__inner input[type="checkbox"],
.p-contact__inner input[type="radio"] {
  visibility: hidden;
  width: 1px;
  position: absolute;
  top: 0;
  left: 0;
  /* IE11だとクリックでページがうごくからIE11のみ position: static;*/
}
.p-contact__inner input[type="submit"],
.p-contact__inner input[type="button"],
.p-contact__inner label,
.p-contact__inner button,
.p-contact__inner select {
  cursor: pointer;
}
.p-contact__inner select::-ms-expand {
  display: none;
}
.p-contact__inner input[type="text"] {
  line-height: normal;
}
.p-contact__inner input[type="checkbox"],
.p-contact__inner input[type="radio"] {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  border: 0;
  clip: rect(0 0 0 0); /* 古いブラウザ対応 */
  -webkit-clip-path: inset(50%);
  clip-path: inset(50%); /* モダンブラウザ用 */
  overflow: hidden;
  white-space: nowrap;
}
.p-contact__inner input + span {
  display: inline-block;
  position: relative;
  padding-left: 25px;
  cursor: pointer;
}
@media screen and (max-width: 767px) {
  .p-contact__inner input + span {
    padding-left: 22px;
  }
}
.p-contact__inner input + span:before {
  display: block;
  position: absolute;
  border: 1px solid #333333;
  content: "";
}
.p-contact__inner input[type="checkbox"] + span:before {
  top: 3px;
  left: 0;
  width: 18px;
  height: 18px;
}
@media screen and (max-width: 767px) {
  .p-contact__inner input[type="checkbox"] + span:before {
    width: 14px;
    height: 14px;
    top: 4px;
  }
}
.p-contact__inner input[type="checkbox"]:checked + span:after {
  display: block;
  position: absolute;
  top: 2px;
  left: 4px;
  width: 10px;
  height: 14px;
  transform: rotate(45deg);
  border-right: 2px solid #231815;
  border-bottom: 2px solid #231815;
  content: "";
}
@media screen and (max-width: 767px) {
  .p-contact__inner input[type="checkbox"]:checked + span:after {
    top: 5px;
    left: 4px;
    width: 6px;
    height: 9px;
  }
}
.p-contact__inner input[type="radio"] + span:before {
  top: 4px;
  left: 0;
  width: 16px;
  height: 16px;
  border-radius: 8px;
  transform: translateY(-50%);
}
.p-contact__inner input[type="radio"]:checked + span:after {
  display: block;
  position: absolute;
  top: 4px;
  left: 4px;
  width: 8px;
  height: 8px;
  border-radius: 4px;
  background-color: #e462d3;
  content: "";
}
.p-contact__inner input[type="text"],
.p-contact__inner input[type="email"],
.p-contact__inner input[type="number"],
.p-contact__inner textarea {
  width: 100%;
}
.p-contact__inner .p-checkbox-wrapper {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}
@media screen and (max-width: 767px) {
  .p-contact__inner .p-checkbox-wrapper {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    display: grid;
    grid-template-columns: repeat(2, auto);
    gap: 10px 20px;
    padding-inline: 10px;
  }
}
.p-contact__inner input.c-btn-submit {
  font-size: 1.5rem;
  color: #fefff7;
  font-family: dnp-shuei-mincho-pr6n, sans-serif;
  background-color: #3e3a39;
  width: 100%;
  min-height: 115px;
  display: grid;
  place-content: center;
  cursor: pointer;
  border-left: 1px solid #231815;
  border-right: 1px solid #231815;
  transition:
    0.3s background-color,
    0.3s color;
}
@media screen and (max-width: 767px) {
  .p-contact__inner input.c-btn-submit {
    font-size: 1.1875rem;
    min-height: 70px;
  }
}
.p-contact__inner ::-moz-placeholder {
  color: #c8c9ca;
}
.p-contact__inner ::placeholder {
  color: #c8c9ca;
}
@media screen and (max-width: 767px) {
  .p-contact__inner ::-moz-placeholder {
    color: #c9caca;
  }
  .p-contact__inner ::placeholder {
    color: #c9caca;
  }
}
.p-contact__inner input.c-btn-return {
  color: #fff;
  font-size: 1.25rem;
  min-height: 70px;
  font-family: dnp-shuei-mincho-pr6n, sans-serif;
  display: grid;
  place-content: center;
  border-left: 1px solid #231815;
  border-right: 1px solid #231815;
  width: 100%;
  background-color: #9e9e9f;
  cursor: pointer;
  transition:
    0.3s background-color,
    0.3s color;
}
@media screen and (max-width: 767px) {
  .p-contact__inner input.c-btn-return {
    font-size: 1.1875rem;
    min-height: 50px;
  }
}

.p-field {
  display: flex;
  border-top: 1px solid #231815;
}
@media screen and (max-width: 767px) {
  .p-field {
    padding-left: 40px;
    display: block;
  }
}

.p-label_container,
.c-label {
  font-size: 1rem;
  font-weight: 500;
}
@media screen and (max-width: 767px) {
  .p-label_container,
  .c-label {
    font-size: 0.75rem;
  }
}

.c-label {
  line-height: 1.5625;
}
.c-label .u-txtsize--small {
  font-size: 0.75rem;
}

.-job .p-label_container {
  padding-block: 15px 10px;
}
@media screen and (max-width: 767px) {
  .-job .p-label_container {
    padding-block: 15px;
  }
}

.p-label_container {
  border-right: 1px solid #231815;
  width: 234px;
  flex-shrink: 0;
  padding: 25px;
  display: flex;
  align-items: flex-start;
  -moz-column-gap: 10px;
  column-gap: 10px;
}
@media screen and (max-width: 767px) {
  .p-label_container {
    width: auto;
    border-left: 1px solid #231815;
    padding: 15px;
    -moz-column-gap: 4px;
    column-gap: 4px;
    border-right: none;
  }
}
.p-label_container .c-mark {
  font-size: 0.6875rem;
  padding: 4px 5px 5px;
  background-color: #9e9e9f;
  display: inline-block;
  line-height: 1;
  color: #fff;
  flex-shrink: 0;
  position: relative;
  top: 3px;
}
@media screen and (max-width: 767px) {
  .p-label_container .c-mark {
    font-size: 0.5625rem;
    top: 1px;
  }
}
.-required .p-label_container .c-mark {
  background-color: #000;
}

.p-content_container {
  position: relative;
  flex-grow: 1;
  font-size: 0.875rem;
}
@media screen and (max-width: 767px) {
  .p-content_container {
    border-left: 1px solid #231815;
    border-top: 1px solid #231815;
    font-size: 0.75rem;
  }
}
.p-content_container:has(.p-unit) {
  padding: 0;
}
.p-content_container .p-unit {
  display: flex;
  height: 100%;
}
@media screen and (max-width: 900px) {
  .p-content_container .p-unit {
    display: block;
    height: auto;
  }
}
.p-content_container .u-flex {
  display: flex;
  -moz-column-gap: 10px;
  column-gap: 10px;
  align-items: center;
}
.p-content_container .-zip {
  width: 31.8007662835%;
  border-right: 1px solid #231815;
  flex-shrink: 0;
}
@media screen and (max-width: 900px) {
  .p-content_container .-zip {
    width: auto;
    border-right: none;
  }
}
.p-content_container .-add {
  flex-grow: 1;
}
@media screen and (max-width: 900px) {
  .p-content_container .-add {
    border-top: 1px solid #231815;
  }
}
.p-content_container p {
  font-size: 1rem;
}
@media screen and (max-width: 767px) {
  .p-content_container p {
    font-size: 0.875rem;
  }
}

.p-input_text {
  width: 100%;
  padding: 25px;
  position: relative;
}
@media screen and (max-width: 767px) {
  .p-input_text {
    padding: 13px 15px;
  }
}
.p-input_text textarea {
  min-height: 125px;
}
@media screen and (max-width: 767px) {
  .p-input_text textarea {
    min-height: 215px;
  }
}

.p-btn-submit-warpper {
  position: relative;
  border-top: 1px solid #231815;
  border-bottom: 1px solid #231815;
}
@media screen and (max-width: 767px) {
  .p-btn-submit-warpper {
    padding-inline: 20px;
    border-bottom: none;
  }
}
@media (any-hover: hover) {
  .p-btn-submit-warpper:hover::before {
    background-color: #3e3a39;
  }
  .p-btn-submit-warpper:hover .c-btn-submit {
    background-color: #fefff7 !important;
    color: #000 !important;
  }
}
.p-btn-submit-warpper::before {
  width: 19px;
  height: 19px;
  position: absolute;
  content: "";
  background-color: #fefff7;
  -webkit-mask-image: url('data:image/svg+xml;utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20.61 19.91"><title>arrow</title><polygon class="cls-1" points=".71 19.91 0 19.2 18.2 1 9.88 1 9.88 0 20.61 0 .71 19.91"/></svg>');
  mask-image: url('data:image/svg+xml;utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20.61 19.91"><title>arrow</title><polygon class="cls-1" points=".71 19.91 0 19.2 18.2 1 9.88 1 9.88 0 20.61 0 .71 19.91"/></svg>');
  display: block;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  bottom: 23px;
  right: 23px;
  transition: 0.3s background-color;
}
@media screen and (max-width: 767px) {
  .p-btn-submit-warpper::before {
    width: 11px;
    height: 11px;
    bottom: 6px;
    right: 30px;
  }
}

.p-btn-return-warpper {
  position: relative;
  border-bottom: 1px solid #231815;
}
@media screen and (max-width: 767px) {
  .p-btn-return-warpper {
    padding-inline: 20px;
    border-bottom: none;
  }
}
@media (any-hover: hover) {
  .p-btn-return-warpper:hover::before {
    background-color: #3e3a39;
  }
  .p-btn-return-warpper:hover .c-btn-return {
    background-color: #fefff7 !important;
    color: #000 !important;
  }
}
.p-btn-return-warpper::before {
  width: 19px;
  height: 19px;
  position: absolute;
  content: "";
  background-color: #fefff7;
  -webkit-mask-image: url('data:image/svg+xml;utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20.61 19.91"><title>arrow</title><polygon class="cls-1" points=".71 19.91 0 19.2 18.2 1 9.88 1 9.88 0 20.61 0 .71 19.91"/></svg>');
  mask-image: url('data:image/svg+xml;utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20.61 19.91"><title>arrow</title><polygon class="cls-1" points=".71 19.91 0 19.2 18.2 1 9.88 1 9.88 0 20.61 0 .71 19.91"/></svg>');
  display: block;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  bottom: 23px;
  left: 23px;
  transition: 0.3s background-color;
  transform: scale(-1, 1);
}
@media screen and (max-width: 767px) {
  .p-btn-return-warpper::before {
    width: 11px;
    height: 11px;
    bottom: 6px;
    left: 30px;
  }
}

.p-thanks {
  padding-bottom: min(8.6666666667vw, 130px);
}
@media screen and (max-width: 767px) {
  .p-thanks {
    padding-bottom: 60px;
  }
}
.p-thanks .p-btn-wrapper {
  max-width: 450px;
  margin: min(7.3333333333vw, 110px) auto 0;
}
@media screen and (max-width: 767px) {
  .p-thanks .p-btn-wrapper {
    margin-top: 40px;
    max-width: 260px;
  }
}
.p-thanks .p-btn-wrapper .c-btn-thanks {
  text-decoration: none;
  color: currentColor;
  border: 1px solid #231815;
  min-height: 60px;
  display: grid;
  place-content: center;
  transition:
    0.3s color,
    0.3s background-color;
  font-size: 1rem;
}
@media screen and (max-width: 767px) {
  .p-thanks .p-btn-wrapper .c-btn-thanks {
    min-height: 40px;
    font-size: 0.875rem;
  }
}
@media (any-hover: hover) {
  .p-thanks .p-btn-wrapper .c-btn-thanks:hover {
    background-color: #3e3a39;
    color: #fefff7;
  }
}

p.error {
  color: red;
  font-size: 80% !important;
  margin-left: 0.5em;
}

/* ----------------------------------------------------------------------------------------------------
*	魅力
* --------------------------------------------------------------------------------------------------*/
.p-challenge .p-content__heading {
  padding: min(12.6666666667vw, 190px) min(3.3333333333vw, 50px);
}
@media screen and (max-width: 767px) {
  .p-challenge .p-content__heading {
    padding: 50px 40px;
  }
}
.p-challenge .p-content__heading .p-txt-wrapper {
  max-width: 930px;
  margin-inline: auto;
}
@media screen and (max-width: 767px) {
  .p-challenge .p-content__heading .p-txt-wrapper p {
    font-size: 1.05rem;
    letter-spacing: 0.12em;
  }
}

.p-page-wrapper {
  height: 238px;
  display: grid;
  place-content: center;
  border-bottom: 1px solid #231815;
}
@media screen and (max-width: 767px) {
  .p-page-wrapper {
    height: auto;
    aspect-ratio: 107/87;
    padding-block: 12px;
  }
}
.p-page-wrapper .c-txt {
  font-size: 0.75rem;
  font-weight: 700;
  text-align: center;
  margin-bottom: 12px;
}
@media screen and (max-width: 767px) {
  .p-page-wrapper .c-txt {
    font-size: 0.625rem;
    margin-bottom: 2px;
  }
}

.p-page-num {
  font-weight: 500;
  position: relative;
  width: 66px;
  height: 63px;
  margin-inline: auto;
}
@media screen and (max-width: 767px) {
  .p-page-num {
    width: 100%;
  }
}
.p-page-num::before {
  content: "";
  position: absolute;
  top: 8px;
  right: 9px;
  height: 1px;
  width: 119%;
  background-color: #000;
  transform: rotate(-45deg);
  transform-origin: top right;
}
.p-page-num .c-num {
  font-size: 2.2125rem;
  display: inline-block;
  position: absolute;
  top: 0;
  left: 0;
  line-height: 1;
}
@media screen and (max-width: 767px) {
  .p-page-num .c-num {
    font-size: 1.5rem;
    top: 5px;
  }
}
.p-page-num .c-total {
  font-size: 1.35rem;
  display: inline-block;
  position: absolute;
  right: 15px;
  bottom: 4px;
  line-height: 1;
}
@media screen and (max-width: 767px) {
  .p-page-num .c-total {
    font-size: 0.9375rem;
    right: 9px;
    bottom: 9px;
  }
}

.p-ttl__content {
  padding-block: 116px;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
}

.c-appeal__ttl {
  font-size: 1.75rem;
  font-weight: 500;
  writing-mode: vertical-rl;
}

/* ----------------------------------------------------------------------------------------------------
*	働くひとたち
* --------------------------------------------------------------------------------------------------*/
.p-people .p-content__heading {
  padding-block: min(5.2vw, 78px);
  border-top: 1px solid #231815;
}

.p-people__heading {
  display: flex;
  min-height: 683px;
  max-height: 800px;
}
@media screen and (max-width: 900px) {
  .p-people__heading {
    max-height: 860px;
  }
}
@media screen and (max-width: 767px) {
  .p-people__heading {
    height: auto;
    display: block;
    min-height: inherit;
    max-height: inherit;
  }
}
.p-people__heading .p-txt__content {
  width: 53.3333333333%;
  flex-shrink: 0;
  display: grid;
  place-content: center;
  padding: min(5.3333333333vw, 80px) min(3.3333333333vw, 50px);
}
@media screen and (max-width: 767px) {
  .p-people__heading .p-txt__content {
    width: auto;
    padding: 60px 40px;
  }
}
.p-people__heading p {
  font-size: 1.125rem;
  font-weight: 500;
  word-break: keep-all;
  line-height: 2.3333333333;
}
@media screen and (max-width: 767px) {
  .p-people__heading p {
    word-break: break-all;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .p-people__heading p {
    font-size: 0.875rem;
    line-height: 2.2142857143;
  }
}
.p-people__heading p + p {
  margin-top: 2em;
}
.p-people__heading .p-img__content {
  width: 46.6666666667%;
  overflow: clip;
}
@media screen and (max-width: 767px) {
  .p-people__heading .p-img__content {
    width: auto;
    height: 445px;
    border-top: 1px solid #231815;
  }
}

.p-img__block {
  display: grid;
  grid-auto-columns: 1fr;
  grid-auto-rows: 1fr;
  grid-template-columns: auto auto;
  grid-template-rows: auto auto auto auto auto auto auto auto;
  height: -webkit-max-content;
  height: -moz-max-content;
  height: max-content;
}
@media screen and (max-width: 767px) {
  .p-img__block {
    padding-inline: 18px;
  }
}
.p-img__block img {
  border-radius: 5px;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}
.p-img__block .img01,
.p-img__block .img06 {
  width: 18vw;
  margin-left: 2.1333333333vw;
}
@media screen and (max-width: 767px) {
  .p-img__block .img01,
  .p-img__block .img06 {
    width: 46.9333333333vw;
    margin-left: 0;
  }
}
.p-img__block .img02,
.p-img__block .img07 {
  width: 11.5333333333vw;
  margin-left: min(8.3333333333vw, 125px);
  margin-bottom: min(3.0666666667vw, 46px);
  margin-top: min(2.9333333333vw, 44px);
}
@media screen and (max-width: 767px) {
  .p-img__block .img02,
  .p-img__block .img07 {
    padding-top: 0;
    width: 30.1333333333vw;
    margin-left: 16vw;
    margin-bottom: 7.4666666667vw;
  }
}
.p-img__block .img03,
.p-img__block .img08 {
  width: 13vw;
  margin-left: min(3.7333333333vw, 56px);
  margin-top: min(2.9333333333vw, 44px);
}
@media screen and (max-width: 767px) {
  .p-img__block .img03,
  .p-img__block .img08 {
    width: 33.8666666667vw;
    margin-left: 5.3333333333vw;
    margin-top: 2.6666666667vw;
  }
}
.p-img__block .img04,
.p-img__block .img11 {
  width: 13.4vw;
  margin-top: min(8.0666666667vw, 121px);
}
@media screen and (max-width: 767px) {
  .p-img__block .img04,
  .p-img__block .img11 {
    width: 34.9333333333vw;
    margin-left: auto;
    margin-top: 29.3333333333vw;
  }
}
.p-img__block .img05,
.p-img__block .img09 {
  width: 16.0666666667vw;
}
@media screen and (max-width: 767px) {
  .p-img__block .img05,
  .p-img__block .img09 {
    width: 41.8666666667vw;
  }
}
.p-img__block .img10,
.p-img__block .img12 {
  width: 27.3333333333vw;
  margin-top: min(4.8666666667vw, 73px);
  margin-left: min(5.8666666667vw, 88px);
  margin-bottom: min(5.8666666667vw, 88px);
}
@media screen and (max-width: 767px) {
  .p-img__block .img10,
  .p-img__block .img12 {
    margin-left: 10.6666666667vw;
    width: 72vw;
    margin-bottom: 10.6666666667vw;
    margin-top: 10.6666666667vw;
  }
}
.p-img__block .img01 {
  grid-column: 1;
  grid-row: 1;
}
.p-img__block .img02 {
  grid-column: 1;
  grid-row: 2;
}
.p-img__block .img03 {
  grid-column: 1;
  grid-row: 3;
}
.p-img__block .img04 {
  grid-column: 2;
  grid-row: 1;
}
.p-img__block .img05 {
  grid-column: 2;
  grid-row: 3;
}
.p-img__block .img06 {
  grid-row: 5;
  grid-column: 1;
}
.p-img__block .img07 {
  grid-row: 7;
  grid-column: 1;
}
.p-img__block .img08 {
  grid-row: 8;
  grid-column: 1;
}
.p-img__block .img09 {
  grid-row: 8;
  grid-column: 2;
}
.p-img__block .img10 {
  grid-column: 1/3;
  grid-row: 4;
}
.p-img__block .img11 {
  grid-row: 5;
  grid-column: 2;
}
.p-img__block .img12 {
  grid-row: 9;
  grid-column: 1/3;
}

.p-img__block-wrapper {
  -webkit-animation: carousel-y 40s linear infinite;
  animation: carousel-y 40s linear infinite;
}

@-webkit-keyframes carousel-y {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-50%);
  }
}

@keyframes carousel-y {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-50%);
  }
}
.p-menber__content {
  padding-inline: 100px;
  border-top: 1px solid #231815;
}
@media screen and (max-width: 767px) {
  .p-menber__content {
    padding-inline: 0;
  }
}

.p-member__list {
  display: flex;
  border-left: 1px solid #231815;
  border-right: 1px solid #231815;
}
@media screen and (max-width: 767px) {
  .p-member__list {
    display: block;
    border: none;
  }
}

.p-member__item {
  width: 33.333%;
}
@media screen and (max-width: 767px) {
  .p-member__item {
    width: auto;
    padding-inline: 18px;
  }
  .p-member__item + .p-member__item {
    border-top: 1px solid #231815;
  }
}
.p-member__item:not(:last-of-type) {
  border-right: 1px solid #231815;
}
@media screen and (max-width: 767px) {
  .p-member__item:not(:last-of-type) {
    border-right: none;
  }
}
.p-member__item .p-img-wrapper {
  width: 18vw;
  margin-inline: auto;
}
.p-member__item .p-img-wrapper img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}
@media screen and (max-width: 767px) {
  .p-member__item .p-img-wrapper {
    margin: 0;
    width: 32vw;
  }
}
.p-member__item .p-member__body {
  padding-top: min(4.3333333333vw, 65px);
}
@media screen and (max-width: 767px) {
  .p-member__item .p-member__body {
    padding-top: 0;
    flex-grow: 1;
    text-align: center;
  }
}
.p-member__item .c-name {
  font-weight: 500;
  font-size: 1.75rem;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .p-member__item .c-name {
    font-size: 1.1125rem;
  }
}
.p-member__item .c-name .u-en {
  display: block;
  font-size: 0.625rem;
}
@media screen and (max-width: 767px) {
  .p-member__item .c-name .u-en {
    font-size: 0.58125rem;
  }
}
.p-member__item .c-prof {
  font-family: zen-kaku-gothic-antique, sans-serif;
  font-size: 0.75rem;
  text-align: center;
  word-break: keep-all;
  margin-top: 0.5em;
}
@media screen and (max-width: 767px) {
  .p-member__item .c-prof {
    font-size: 0.58125rem;
  }
}

.p-member__inner {
  padding: min(4vw, 60px) 18px min(5.3333333333vw, 80px);
}
@media screen and (max-width: 767px) {
  .p-member__inner {
    border-left: 1px solid #231815;
    border-right: 1px solid #231815;
    display: flex;
    padding: 20px;
    align-items: center;
  }
}

.p-interview {
  display: flex;
  align-items: flex-start;
}
@media screen and (max-width: 767px) {
  .p-interview {
    display: block;
  }
}

.p-interview__side {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  padding-bottom: 35.3333333333vw;
  flex-grow: 1;
  padding-top: min(11vw, 165px);
  border-top: 1px solid #231815;
}
@media screen and (max-width: 767px) {
  .p-interview__side {
    position: static;
    display: none;
  }
}

.p-interview__wrapper {
  width: 58.5333333333%;
  margin-left: auto;
  border-left: 1px solid #231815;
}
@media screen and (max-width: 767px) {
  .p-interview__wrapper {
    width: auto;
    margin-left: 0;
    border-left: none;
  }
}
.p-interview__wrapper .p-interview__ttl {
  display: none;
}
@media screen and (max-width: 767px) {
  .p-interview__wrapper .p-interview__ttl {
    display: block;
  }
}

.p-interview__txt-wrapper {
  max-width: 680px;
  margin-inline: auto;
  width: 100%;
}
@media screen and (max-width: 767px) {
  .p-interview__txt-wrapper {
    max-width: inherit;
  }
}
.p-interview__txt-wrapper > div + div {
  margin-top: 4em;
}
@media screen and (max-width: 767px) {
  .p-interview__txt-wrapper > div + div {
    margin-top: 2em;
  }
}
.p-interview__txt-wrapper p {
  font-size: 1rem;
  line-height: 2.125;
  letter-spacing: 0;
  text-align: justify;
}
@media screen and (max-width: 767px) {
  .p-interview__txt-wrapper p {
    font-size: 0.75625rem;
    line-height: 2.3333333333;
  }
}
.p-interview__txt-wrapper .c-name {
  font-weight: 700;
  position: relative;
  display: inline-block;
}
.p-interview__txt-wrapper .c-name::after {
  content: "";
  width: 32px;
  height: 1px;
  background-color: #000;
  position: absolute;
  left: calc(100% + 5px);
  top: 1em;
}

.p-interview__answer {
  background-color: #fff;
  width: 100%;
  min-height: 227px;
  display: grid;
  align-items: center;
  padding: min(5.3333333333vw, 80px) min(3.3333333333vw, 50px);
  border-top: 1px solid #231815;
}
@media screen and (max-width: 767px) {
  .p-interview__answer {
    padding: 50px 40px;
    min-height: 120px;
  }
}

.p-interview__ttl-wrapper {
  position: relative;
  width: 100%;
}

.p-interview__ttl {
  padding-inline: min(4vw, 80px);
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  opacity: 0;
  transition: 0.3s opacity;
}
.p-interview__ttl.is-show {
  opacity: 1;
}
@media screen and (max-width: 767px) {
  .p-interview__ttl {
    opacity: 1 !important;
    position: static;
    padding-top: 60px;
    border-top: 1px solid #231815;
    padding-bottom: 50px;
  }
}
.p-interview__ttl .c-ttl {
  font-size: min(1.8666666667vw, 1.75rem);
}
@media screen and (max-width: 767px) {
  .p-interview__ttl .c-ttl {
    font-size: 1.125rem;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin-inline: auto;
  }
}
.p-interview__ttl .p-img-wrapper {
  width: 18.6666666667vw;
  margin: min(8vw, 120px) auto 0;
}
@media screen and (max-width: 767px) {
  .p-interview__ttl .p-img-wrapper {
    width: 47.4666666667vw;
    margin-top: 20px;
  }
}
.p-interview__ttl .p-img-wrapper img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

.p-interview__question {
  border-top: 1px solid #231815;
  text-align: center;
  padding: min(2.6666666667vw, 40px) min(1.3333333333vw, 20px);
}
@media screen and (max-width: 767px) {
  .p-interview__question {
    padding: 30px 10px;
  }
}
.p-interview__question p {
  font-weight: 700;
  font-size: 1rem;
  line-height: 2.0625;
  letter-spacing: 0;
  word-break: keep-all;
}
@media screen and (max-width: 767px) {
  .p-interview__question p {
    font-size: 0.81875rem;
    word-break: break-all;
    line-height: 2;
  }
}

.p-challenge__content {
  display: flex;
  flex-direction: row-reverse;
  align-items: flex-start;
}
@media screen and (max-width: 767px) {
  .p-challenge__content {
    display: block;
  }
}
.p-challenge__content.-gsap {
  display: block;
}
.p-challenge__content.-gsap.is-bgcolor {
  background-color: transparent;
}
.p-challenge__content.-gsap .p-challenge__body {
  height: 100vh;
  width: 100%;
  position: relative;
}
@media screen and (max-width: 767px) {
  .p-challenge__content.-gsap .p-challenge__body {
    height: auto;
  }
}
.p-challenge__content.-gsap .p-challenge__body .p-challenge__ttl-wrapper,
.p-challenge__content.-gsap .p-challenge__body .p-challenge__img-wrapper {
  display: block;
}
.p-challenge__content.-gsap .p-challenge__body .p-challenge__block-ttl-wrapper {
  display: grid;
  justify-content: center;
  padding-top: 20%;
  height: calc(100% - 238px);
}
@media screen and (max-width: 767px) {
  .p-challenge__content.-gsap .p-challenge__body .p-challenge__block-ttl-wrapper {
    height: auto;
    padding-top: 0;
    justify-content: start;
  }
}
.p-challenge__content.-gsap .p-challenge__body .p-challenge__block-ttl-wrapper .c-ttl {
  writing-mode: vertical-rl;
  font-size: min(1.8666666667vw, 1.75rem);
}
@media screen and (max-width: 900px) {
  .p-challenge__content.-gsap .p-challenge__body .p-challenge__block-ttl-wrapper .c-ttl {
    font-size: 1.25rem;
  }
}
@media screen and (max-width: 767px) {
  .p-challenge__content.-gsap .p-challenge__body .p-challenge__block-ttl-wrapper .c-ttl {
    writing-mode: horizontal-tb;
    font-size: 0.99375rem;
  }
}
@media screen and (max-width: 900px) {
  .p-challenge__content.-gsap .p-challenge__body .p-challenge__ttl-wrapper {
    width: 220px;
  }
}
@media screen and (max-width: 767px) {
  .p-challenge__content.-gsap .p-challenge__body .p-challenge__ttl-wrapper {
    width: auto;
  }
}
.p-challenge__content.-gsap .p-challenge__body .p-challenge__block {
  position: absolute;
  height: 100vh;
  display: grid;
  grid-template-columns: 1fr auto auto;
  grid-template-rows: auto;
  width: 100%;
  opacity: 0;
}
@media screen and (max-width: 767px) {
  .p-challenge__content.-gsap .p-challenge__body .p-challenge__block {
    position: static;
    height: auto;
    opacity: 1;
    grid-template-columns: auto;
    grid-template-rows: auto auto auto;
  }
}
.p-challenge__content.-gsap .p-challenge__body .p-challenge__block:first-of-type {
  opacity: 1;
}
.p-challenge__content.-gsap .p-challenge__body .p-challenge__block[data-bgcolor="brown"] {
  background-color: #3e3a39;
}
.p-challenge__content.-gsap .p-challenge__body .p-challenge__block[data-bgcolor="brown"] .p-challenge__ttl-wrapper {
  color: #fefff7;
  border-left-color: #fefff7;
}
.p-challenge__content.-gsap .p-challenge__body .p-challenge__block[data-bgcolor="brown"] .p-page-wrapper {
  border-bottom-color: #fefff7;
}
.p-challenge__content.-gsap
  .p-challenge__body
  .p-challenge__block[data-bgcolor="brown"]
  .p-page-wrapper
  .p-page-num::before {
  background-color: #fefff7;
}
.p-challenge__content.-gsap .p-challenge__body .p-challenge__ttl-wrapper {
  grid-column: 3;
  grid-row: 1;
}
@media screen and (max-width: 767px) {
  .p-challenge__content.-gsap .p-challenge__body .p-challenge__ttl-wrapper {
    grid-area: 1;
    grid-column: 1;
    display: flex;
  }
}
.p-challenge__content.-gsap .p-challenge__body .p-challenge__img-wrapper {
  grid-column: 2;
  grid-row: 1;
  display: grid;
  place-content: center;
  padding-inline: min(3.3333333333vw, 50px);
}
@media screen and (max-width: 767px) {
  .p-challenge__content.-gsap .p-challenge__body .p-challenge__img-wrapper {
    grid-row: 2;
    grid-column: 1;
  }
}
.p-challenge__content.-gsap .p-challenge__body .p-challenge__txt-content {
  grid-column: 1;
  grid-row: 1;
  padding: 0;
  display: grid;
  align-items: center;
  padding-inline: min(3.3333333333vw, 50px);
}
@media screen and (max-width: 767px) {
  .p-challenge__content.-gsap .p-challenge__body .p-challenge__txt-content {
    grid-row: 3;
    grid-column: 1;
    padding: 42px 36px;
  }
}
.p-challenge__content.-gsap .p-challenge__body .p-challenge__txt-content .p-txt-wrapper {
  max-width: 800px;
}
@media screen and (max-width: 767px) {
  .p-challenge__content.-gsap .p-challenge__body .p-challenge__txt-content .p-txt-wrapper {
    max-width: inherit;
  }
}
.p-challenge__content.-gsap .p-challenge__body .p-challenge__txt-content .p-txt-wrapper p {
  font-size: min(1.4666666667vw, 1.375rem);
}
@media screen and (max-width: 900px) {
  .p-challenge__content.-gsap .p-challenge__body .p-challenge__txt-content .p-txt-wrapper p {
    font-size: 1rem;
  }
}
@media screen and (max-width: 767px) {
  .p-challenge__content.-gsap .p-challenge__body .p-challenge__txt-content .p-txt-wrapper p {
    font-size: 0.7875rem;
  }
}

.p-challenge__side {
  width: 46.6666666667%;
  min-height: 100vh;
}
@media screen and (max-width: 767px) {
  .p-challenge__side {
    display: none;
  }
}

.p-challenge__content {
  transition: 0.5s background-color;
  border-top: 1px solid #231815;
}
.p-challenge__content.is-bgcolor {
  background-color: #3e3a39;
}

.p-challenge__ttl-img-wrapper {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  flex-direction: row-reverse;
  justify-content: space-between;
  height: 100vh;
  width: 100%;
  opacity: 0;
  transition: 0.3s opacity;
}
.p-challenge__ttl-img-wrapper.is-show {
  opacity: 1;
}
.p-challenge__ttl-img-wrapper.u-color--white {
  color: #fefff7;
}
.p-challenge__ttl-img-wrapper.u-color--white .p-page-wrapper {
  border-bottom-color: #fefff7;
}
.p-challenge__ttl-img-wrapper.u-color--white .p-page-num::before {
  background-color: #fefff7;
}
.p-challenge__ttl-img-wrapper.u-color--white .p-challenge__ttl-wrapper {
  border-left-color: #fefff7;
}

.p-challenge__ttl-wrapper {
  width: 320px;
  border-left: 1px solid #231815;
}
@media screen and (max-width: 767px) {
  .p-challenge__ttl-wrapper {
    min-height: 100px;
    width: auto;
    border-left: none;
    display: flex;
    border-bottom: 1px solid #231815;
  }
}
@media screen and (max-width: 767px) {
  .p-challenge__ttl-wrapper .p-page-wrapper {
    border-bottom: none;
    border-right: 1px solid #231815;
    width: 28.5333333333vw;
    aspect-ratio: inherit;
  }
}
@media screen and (max-width: 767px) {
  .p-challenge__ttl-wrapper .p-page-wrapper .p-page-num .c-num {
    left: -12px;
  }
  .p-challenge__ttl-wrapper .p-page-wrapper .p-page-num .c-total {
    right: -7px;
    bottom: 14px;
  }
  .p-challenge__ttl-wrapper .p-page-wrapper .p-page-num::before {
    top: 4px;
    right: -11px;
    height: 1px;
    width: 60px;
  }
}

@media screen and (max-width: 767px) {
  .p-challenge__block-ttl-wrapper {
    flex-grow: 1;
    display: grid;
    align-items: center;
    padding-left: 30px;
  }
  .p-challenge__block-ttl-wrapper .c-ttl {
    writing-mode: horizontal-tb;
  }
}

.p-challenge__img-wrapper {
  display: grid;
  align-items: center;
  padding: 18px;
}
.p-challenge__img-wrapper .p-img-wrapper {
  width: 17.3333333333vw;
  aspect-ratio: 220/280;
  margin-left: auto;
}
.p-challenge__img-wrapper .p-img-wrapper img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}
@media screen and (max-width: 767px) {
  .p-challenge__img-wrapper .p-img-wrapper {
    margin: 30px auto 43px;
    width: 74.6666666667vw;
    height: 49.8666666667vw;
  }
}

.p-challenge__body {
  width: 53.3333333333%;
  flex-shrink: 0;
}
@media screen and (max-width: 767px) {
  .p-challenge__body {
    width: auto;
  }
}
.p-challenge__body .p-challenge__ttl-wrapper {
  display: none;
}
@media screen and (max-width: 767px) {
  .p-challenge__body .p-challenge__ttl-wrapper {
    display: flex;
  }
}
.p-challenge__body .p-challenge__img-wrapper {
  display: none;
}
@media screen and (max-width: 767px) {
  .p-challenge__body .p-challenge__img-wrapper {
    display: grid;
  }
}
@media screen and (max-width: 767px) {
  .p-challenge__body .p-page-num {
    width: 28px;
  }
}

.p-challenge__block[data-bgcolor="white"] .p-challenge__txt-content p {
  color: #3e3a39;
}

@media screen and (max-width: 767px) {
  .p-challenge__block[data-bgcolor="brown"] {
    background-color: #3e3a39;
  }
  .p-challenge__block[data-bgcolor="brown"] .p-challenge__ttl-wrapper {
    color: #fff;
    border-bottom-color: #fefff7;
  }
  .p-challenge__block[data-bgcolor="brown"] .p-page-wrapper {
    border-right-color: #fefff7;
  }
  .p-challenge__block[data-bgcolor="brown"] .p-page-wrapper .p-page-num::before {
    background-color: #fefff7;
  }
}
.p-challenge__block[data-bgcolor="brown"] .p-challenge__txt-content {
  color: #fefff7;
}
@media screen and (max-width: 767px) {
  .p-challenge__block[data-bgcolor="brown"] .p-challenge__txt-content {
    border-top-color: #fefff7;
  }
}

/* .p-challenge__block {
	&:first-of-type {
		.p-challenge__txt-content {
			padding-top: 8vh;
			@include mq(m) {
				padding-top: 0;
			}
		}
	}
}
 */
.p-challenge__txt-content {
  padding: 0 18px;
  min-height: 100vh;
  display: grid;
  place-content: center;
}
@media screen and (max-width: 767px) {
  .p-challenge__txt-content {
    display: block;
    border-top: 1px solid #231815;
    padding: 42px 36px;
    min-height: inherit;
  }
}
.p-challenge__txt-content .p-txt-wrapper {
  max-width: 530px;
  margin-inline: auto;
  display: grid;
  place-content: center;
}
@media screen and (max-width: 767px) {
  .p-challenge__txt-content .p-txt-wrapper {
    display: block;
    max-width: inherit;
  }
}
.p-challenge__txt-content .p-txt-wrapper p {
  text-align: justify;
}
@media screen and (max-width: 767px) {
  .p-challenge__txt-content .p-txt-wrapper p {
    font-size: 0.7875rem;
    line-height: 2.3015873016;
  }
}
/*# sourceMappingURL=style1125.css.map */