@charset "UTF-8";
/* CSS Document */
/* ============================================
  Font
============================================  */
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@200..900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap");
/* ============================================
  reset
============================================  */
*,
*::before,
*::after {
  margin: 0; /* マージンは0に */
  padding: 0; /* パディングも常に0に */
  -webkit-box-sizing: border-box;
          box-sizing: border-box; /* もちろん、より直感的なbox-sizingに設定 */
}

:where([hidden]:not([hidden=until-found])) {
  display: none !important; /* hiddenは非表示を意味します */
}

:where(html) {
  -webkit-text-size-adjust: none; /* iOSのランドスケープでテキストが調整されないようにする */
  color-scheme: dark light; /* ユーザーがダークテーマを好む場合、自動的にダークテーマになる */
}

@supports not (min-block-size: 100dvb) {
  :where(html) {
    block-size: 100%;
  }
}
@media (prefers-reduced-motion: no-preference) {
  :where(html:focus-within) {
    scroll-behavior: smooth; /* 何かにフォーカスがある場合のみスムーズスクロール */
  }
}
:where(body) {
  block-size: 100%; /* サファリ以外のブラウザのフォールバック */
  block-size: 100dvb; /* 1dvbは動的ビューポートの長さの1%、100dvbで高さいっぱいに */
  line-height: 1.5; /* アクセシブルな行の高さ */
  font-family: system-ui, sans-serif; /* timeの代わりにシステムフォントを使用 */
  -webkit-font-smoothing: antialiased; /* テキストのレンダリングを改善 */
}

:where(input, button, textarea, select) {
  font: inherit; /* フォーム コントロールは親フォントを継承 */
  color: inherit; /* カラーも継承 */
}

:where(textarea) {
  resize: vertical; /* テキストエリアの水平リサイズを無効に */
  resize: block;
}

:where(button, label, select, summary, [role=button], [role=option]) {
  cursor: pointer; /* インタラクティブなものにカーソルを合わせる */
}

:where(:disabled) {
  cursor: not-allowed; /* フォームコントロール無効時のカーソルを許可しない */
}

:where(label:has(> input:disabled), label:has(+ input:disabled)) {
  cursor: not-allowed; /* ラベルにもカーソルを許可しない */
}

:where(button) {
  border-style: solid; /* ボタンのボーダーのスタイルを設定しやすくする */
}

:where(a) {
  text-underline-offset: 0.2ex; /* 下線の上にスペースを追加する */
}

:where(ul, ol) {
  list-style: none; /* ビュレットを削除、必要に応じて手動で追加する */
}

:where(img, svg, video, canvas, audio, iframe, embed, object) {
  display: block; /* 置換された要素をより予測可能にする */
}

:where(img, picture, svg) {
  max-inline-size: 100%; /* images should never overflow past the available space */
  block-size: auto; /* アスペクト比を保持 */
}

:where(p, h1, h2, h3, h4, h5, h6) {
  overflow-wrap: break-word; /* 長い単語は改行 */
}

:where(h1, h2, h3) {
  line-height: calc(1em + 0.5rem); /* 見出しの行の高さを減らす */
}

:where(hr) { /* より一貫性のある、スタイリッシュなhr */
  border: none;
  -webkit-border-before: 1px solid;
          border-block-start: 1px solid;
  color: inherit;
  block-size: 0;
  overflow: visible;
}

:where(:focus-visible) { /* より一貫性のある、カスタマイズ可能なフォーカスのアウトライン */
  outline: 2px solid var(--focus-color, Highlight);
  outline-offset: 2px;
}

/* .visually-hiddenは後のカスケードレイヤーを上書きするために!importantを使用 */
:where(.visually-hidden:not(:focus, :active, :focus-within, .not-visually-hidden)) {
  clip-path: inset(50%) !important;
  height: 1px !important;
  width: 1px !important;
  overflow: hidden !important;
  position: absolute !important;
  white-space: nowrap !important;
  border: 0 !important;
}

:root {
  --color-base: #000;
  --color-primary: #033794;
  --color-secondary: #FF8900;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  --container-margin: auto;
}

/* ============================================
  base
============================================  */
html {
  font-size: 62.5% !important; /* 62.5%を指定すると「1.0 rem = 10px」 */
  -webkit-text-size-adjust: 100%;
  overflow: auto;
  scroll-behavior: smooth;
  scroll-padding-top: 110px;
}
@media screen and (max-width: 767px) {
  html {
    scroll-padding-top: 60px;
  }
}

body {
  width: 100%;
  color: var(--color-base);
  font-family: "Noto Sans JP", "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Arial, Verdana, sans-serif;
  line-height: 1;
  letter-spacing: 0.05em;
  background-color: #fff;
  overscroll-behavior-y: none;
}
@media screen and (max-width: 767px) {
  body {
    overflow-x: none;
  }
}
body {
  padding-top: 110px;
}
@media screen and (max-width: 767px) {
  body {
    padding-top: 60px;
  }
}
body.front {
  padding-top: 0;
}
@media screen and (max-width: 767px) {
  body.front {
    padding-top: 0;
  }
}

p:not([class]) {
  font-size: 1.6rem;
  line-height: 1.8;
}
@media screen and (max-width: 767px) {
  p:not([class]) {
    font-size: 1.4rem;
  }
}

sup {
  vertical-align: super;
}

a {
  color: inherit;
}
a:hover {
  text-decoration: none;
}

img {
  max-width: 100%;
  vertical-align: top;
  height: auto;
}

img[src$=".svg"] {
  max-width: 100%;
}

/*  pc表示時に電話発信させない
------------------------- */
a[href^="tel:"] {
  text-decoration: none;
}
@media screen and (min-width: 768px) {
  a[href^="tel:"] {
    pointer-events: none;
  }
}

/*  メールリンクの装飾を削除
------------------------- */
a[href^="mailto:"] {
  text-decoration: none;
}

/* ============================================
  header
============================================  */
.l-header {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 50;
  padding-left: 50px;
  height: 110px;
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: left;
      -ms-flex-pack: left;
          justify-content: left;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 4rem;
  background-color: #fff;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
@media screen and (max-width: 767px) {
  .l-header {
    padding-left: 20px;
    height: 60px;
  }
}
.l-header ._logo {
  width: 280px;
}
@media screen and (max-width: 767px) {
  .l-header ._logo {
    width: 45%;
  }
}
.l-header ._panNav {
  font-family: "garamond-atf-subhead", serif;
  font-weight: 500;
  font-size: 3rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 1.5rem;
}
@media only screen and (max-width: 1000px) {
  .l-header ._panNav {
    display: none !important;
  }
}
.l-header ._panNav::before, .l-header ._panNav::after {
  content: "/";
}
.l-header ._panNav a {
  position: relative;
  text-decoration: none;
  display: inline-block;
}
.l-header ._panNav a::after {
  position: absolute;
  bottom: -2px;
  left: 0;
  content: "";
  width: 100%;
  height: 2px;
  background: var(--color-base);
  opacity: 0;
  -webkit-transition: 0.3s ease-out;
  transition: 0.3s ease-out;
}
.l-header ._panNav a:hover::after {
  opacity: 1;
}

body.front .l-header {
  background-color: unset;
}

.header-active .l-header {
  background-color: rgba(255, 255, 255, 0.9) !important;
}

/* ============================================
  エントリーボタン
============================================  */
.l-entrybtn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  position: fixed;
  top: 20px;
  right: 100px;
  z-index: 101;
  height: 70px;
  width: 190px;
  color: #fff;
  border-radius: 35px 0 0 35px;
  background-color: var(--color-secondary);
  font-size: 1.8rem;
  font-weight: 600;
  text-decoration: none;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
@media screen and (max-width: 767px) {
  .l-entrybtn {
    font-size: 1.2rem;
    top: 10px;
    right: 55px;
    height: 40px;
    width: 100px;
  }
}
.l-entrybtn:hover {
  background-color: hsl(41, 100%, 50%);
}
.l-entrybtn:hover span {
  -webkit-animation-name: fade-entrybtn;
          animation-name: fade-entrybtn;
  -webkit-animation-duration: 0.4s;
          animation-duration: 0.4s;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}

@-webkit-keyframes fade-entrybtn {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
  50% {
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
    opacity: 0;
  }
  51% {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}

@keyframes fade-entrybtn {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
  50% {
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
    opacity: 0;
  }
  51% {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
/* ============================================

hamburger

============================================  */
.l-hamburger ._nav {
  position: fixed;
  right: -100%;
  top: 0;
  z-index: 99;
  width: 100%;
  max-width: 425px;
  height: 100vh;
  height: calc(var(--vh, 1vh) * 100);
  padding: 130px 40px 60px;
  background-color: rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(10px);
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  overflow-y: auto; /* メニューが多くなったらスクロールできるように */
  visibility: hidden;
  opacity: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 60px;
}
@media screen and (max-width: 767px) {
  .l-hamburger ._nav {
    gap: 40px;
    padding-top: 90px;
  }
}
.l-hamburger ._nav ._list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  font-size: 2rem;
  font-weight: 600;
  line-height: 1.5;
  gap: 1em;
}
@media screen and (max-width: 767px) {
  .l-hamburger ._nav ._list {
    font-size: 1.6rem;
  }
}
.l-hamburger ._nav ._list li:not(:first-child) {
  font-size: 1.8rem;
  font-weight: 400;
  margin-left: 1em;
  padding-left: 1em;
  position: relative;
}
@media screen and (max-width: 767px) {
  .l-hamburger ._nav ._list li:not(:first-child) {
    font-size: 1.4rem;
    text-align: left;
  }
}
.l-hamburger ._nav ._list li:not(:first-child)::before {
  content: "・";
  color: #000;
  position: absolute;
  left: 0;
}
.l-hamburger ._nav ._list li:first-child {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5em;
}
.l-hamburger ._nav ._list li:first-child::after {
  content: "";
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  height: 1px;
  background-color: #000;
}
.l-hamburger ._nav ._list a {
  color: var(--color-base);
  text-decoration: none;
  position: relative;
  display: inline-block;
  text-decoration: none;
}
.l-hamburger ._nav ._list a::after {
  position: absolute;
  bottom: -2px;
  left: 0;
  content: "";
  width: 100%;
  height: 2px;
  background: var(--color-primary);
  opacity: 0;
  -webkit-transition: 0.3s ease-out;
  transition: 0.3s ease-out;
}
.l-hamburger ._nav ._list a:hover::after {
  opacity: 1;
}
.l-hamburger ._line {
  position: fixed;
  right: 25px;
  top: 20px;
  width: 70px;
  height: 70px;
  cursor: pointer;
  z-index: 100;
  border-radius: 0 35px 35px 0;
  background-color: var(--color-primary);
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
@media screen and (max-width: 767px) {
  .l-hamburger ._line {
    top: 10px;
    right: 10px;
    width: 40px;
    height: 40px;
  }
}
.l-hamburger ._line:hover {
  background-color: #0792D5;
}
.l-hamburger ._line ._item {
  position: absolute;
  left: 14px;
  width: 32px;
  height: 2px;
  background-color: #fff;
  -webkit-transition: all 0.6s;
  transition: all 0.6s;
}
@media screen and (max-width: 767px) {
  .l-hamburger ._line ._item {
    left: 7px;
    width: 22px;
  }
}
.l-hamburger ._line ._item--1 {
  top: 30px;
}
@media screen and (max-width: 767px) {
  .l-hamburger ._line ._item--1 {
    top: 15px;
  }
}
.l-hamburger ._line ._item--2 {
  top: 39px;
  width: 24px;
}
@media screen and (max-width: 767px) {
  .l-hamburger ._line ._item--2 {
    top: 23px;
    width: 16px;
  }
}

/* 表示された時用のCSS */
.is-open ._nav {
  opacity: 1;
  visibility: visible;
  right: 0;
}
.is-open ._item--1 {
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
  top: 32px !important;
}
@media screen and (max-width: 767px) {
  .is-open ._item--1 {
    top: 18px !important;
  }
}
.is-open ._item--2 {
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
  top: 32px !important;
  width: 32px !important;
}
@media screen and (max-width: 767px) {
  .is-open ._item--2 {
    top: 18px !important;
    width: 22px !important;
  }
}

.header-active .l-header {
  background-color: rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(10px);
  height: 90px;
  -webkit-transition-delay: 0s;
          transition-delay: 0s;
}
@media screen and (max-width: 767px) {
  .header-active .l-header {
    height: 50px;
  }
}
.header-active .l-entrybtn {
  top: 10px;
}
@media screen and (max-width: 767px) {
  .header-active .l-entrybtn {
    top: 5px;
  }
}
.header-active .l-hamburger ._line {
  top: 10px;
}
@media screen and (max-width: 767px) {
  .header-active .l-hamburger ._line {
    top: 5px;
  }
}

/* ============================================
  subvisual
============================================  */
.l-subvisual .l-inner {
  position: relative;
  height: 50rem;
}
@media screen and (max-width: 767px) {
  .l-subvisual .l-inner {
    height: 25rem;
  }
}
.l-subvisual .l-inner::before, .l-subvisual .l-inner::after {
  content: "";
  display: block;
  width: 625px;
  height: 807px;
  clip-path: polygon(370px 0, 100% 0, calc(100% - 370px) 100%, 0 100%);
  position: absolute;
  z-index: 4;
}
@media screen and (max-width: 767px) {
  .l-subvisual .l-inner::before, .l-subvisual .l-inner::after {
    width: 312.5px;
    height: 403.5px;
    clip-path: polygon(185px 0, 100% 0, calc(100% - 185px) 100%, 0 100%);
  }
}
.l-subvisual .l-inner::before {
  background-color: #D8E3F1;
  top: -30px;
  left: -640px;
}
@media screen and (max-width: 767px) {
  .l-subvisual .l-inner::before {
    top: -15px;
    left: -320px;
  }
}
.l-subvisual .l-inner::after {
  background-color: #E3E3E3;
  top: 150px;
  left: -453px;
}
@media screen and (max-width: 767px) {
  .l-subvisual .l-inner::after {
    top: 75px;
    left: -226px;
  }
}
.l-subvisual ._title {
  position: absolute;
  top: 2rem;
  left: 0;
  width: 30rem;
  z-index: 4;
}
@media screen and (max-width: 767px) {
  .l-subvisual ._title {
    width: 15rem;
    top: 1rem;
  }
}
.l-subvisual ._title ._en {
  font-family: "Noto Serif JP", serif;
  color: var(--color-primary);
  font-size: 4rem;
  font-weight: 700;
  text-transform: uppercase;
  margin-bottom: 2rem;
}
@media screen and (max-width: 767px) {
  .l-subvisual ._title ._en {
    font-size: 2rem;
    margin-bottom: 1rem;
  }
}
.l-subvisual ._title ._jp {
  font-family: "Noto Serif JP", serif;
  font-size: 2.4rem;
  font-weight: 600;
}
@media screen and (max-width: 767px) {
  .l-subvisual ._title ._jp {
    font-size: 1.2rem;
  }
}
.l-subvisual ._img {
  position: absolute;
  right: calc(-1 * var(--container-margin));
  top: 0;
  width: calc(100% - 100px + var(--container-margin));
  height: 100%;
}
@media screen and (max-width: 767px) {
  .l-subvisual ._img {
    width: calc(100% - 50px + var(--container-margin));
  }
}
.l-subvisual ._img img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
}
.l-subvisual ._img::after {
  content: "";
  display: block;
  position: absolute;
  width: 2000px;
  height: 2000px;
  bottom: 0;
  right: calc(100vw - var(--container-margin) - 480px);
  z-index: 1;
  background-color: #fff;
  -webkit-transform: rotate(25deg);
          transform: rotate(25deg);
}
@media screen and (max-width: 767px) {
  .l-subvisual ._img::after {
    right: calc(100vw - var(--container-margin) - 428px);
  }
}

/* ============================================
  panNav
============================================  */
.l-panNav {
  max-width: 1300px;
  width: 88%;
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  .l-panNav {
    width: 88%;
  }
}
.l-panNav {
  padding: 2rem 0 6rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: right;
      -ms-flex-pack: right;
          justify-content: right;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  position: relative;
  z-index: 2;
}
@media screen and (max-width: 767px) {
  .l-panNav {
    padding: 1rem 0 3rem;
  }
}
.l-panNav ._item {
  font-size: 1.4rem;
  line-height: 1.4;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media screen and (max-width: 767px) {
  .l-panNav ._item {
    font-size: 1.2rem;
  }
}
.l-panNav ._item::after {
  content: "";
  display: block;
  width: 5px;
  height: 5px;
  border-top: solid 1px #707070;
  border-right: solid 1px #707070;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
  margin: 0 0.5em;
}
.l-panNav ._item:last-child::after {
  display: none;
}
.l-panNav ._item a {
  color: #999;
  text-decoration: none;
}
.l-panNav ._item a:hover {
  text-decoration: underline;
}

main {
  position: relative;
  z-index: 1;
}

/* ============================================
  section
============================================  */
.l-wrapper {
  overflow: hidden;
}

.l-section {
  padding: 0 0 80px;
}
@media screen and (max-width: 767px) {
  .l-section {
    padding: 0 0 40px;
  }
}
.l-section:last-child {
  padding-bottom: 0;
}

/* ============================================
  inner
============================================  */
.l-inner {
  max-width: 1300px;
  width: 88%;
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  .l-inner {
    width: 88%;
  }
}

/* ============================================
  h
============================================  */
.l-h3group {
  font-family: "Noto Serif JP", serif;
}
.l-h3group ._eng {
  color: var(--color-primary);
  font-size: 3rem;
  font-weight: 700;
  margin-bottom: 0.5em;
}
@media screen and (max-width: 767px) {
  .l-h3group ._eng {
    font-size: 1.5rem;
  }
}
.l-h3group ._jp {
  font-size: 4rem;
  font-weight: 700;
  margin-bottom: 1em;
}
@media screen and (max-width: 767px) {
  .l-h3group ._jp {
    font-size: 2rem;
  }
}

/* ============================================
  エントリーエリア
============================================  */
.l-entry {
  background-image: url(../img/entry_bg.jpg);
  background-size: cover;
  background-position: center;
  padding: 8rem 0;
  position: relative;
  z-index: 11;
  margin-top: 100px;
}
@media screen and (max-width: 767px) {
  .l-entry {
    padding: 6rem 0;
    margin-top: 80px;
  }
}
.l-entry ._title {
  font-family: "dnp-shuei-mincho-pr6n", sans-serif;
  font-size: 5rem;
  font-weight: 600;
  text-align: center;
  margin-bottom: 3rem;
}
@media screen and (max-width: 767px) {
  .l-entry ._title {
    font-size: 2.4rem;
  }
}
.l-entry ._text {
  font-size: 1.8rem;
  line-height: 2.5;
}
@media screen and (max-width: 767px) {
  .l-entry ._text {
    font-size: 1.4rem;
  }
}
.l-entry ._btn {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 14rem;
  width: 88%;
  max-width: 70rem;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  background-color: var(--color-secondary);
  color: #fff;
  font-size: 3.6rem;
  font-weight: 600;
  border-radius: 9999px;
  text-decoration: none;
  margin: 5rem auto 0;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}
@media screen and (max-width: 767px) {
  .l-entry ._btn {
    font-size: 2.4rem;
    height: 8rem;
  }
}
.l-entry ._btn::before {
  content: "";
  position: absolute;
  right: 4rem;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  width: 5rem;
  height: 5rem;
  border-radius: 50%;
  border: solid 3px #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
@media screen and (max-width: 767px) {
  .l-entry ._btn::before {
    width: 3rem;
    height: 3rem;
    right: 2rem;
    border: 2px solid #fff;
  }
}
.l-entry ._btn::after {
  content: "";
  position: absolute;
  right: 6rem;
  top: 50%;
  -webkit-transform: translateY(-50%) rotate(45deg);
          transform: translateY(-50%) rotate(45deg);
  width: 1.5rem;
  height: 1.5rem;
  border-top: solid 3px #fff;
  border-right: solid 3px #fff;
}
@media screen and (max-width: 767px) {
  .l-entry ._btn::after {
    width: 1rem;
    height: 1rem;
    right: 3.2rem;
    border-top: solid 2px #fff;
    border-right: solid 2px #fff;
  }
}
.l-entry ._btn:hover {
  -webkit-box-shadow: 0 0 0 10px rgba(0, 0, 0, 0.16);
          box-shadow: 0 0 0 10px rgba(0, 0, 0, 0.16);
}
.l-entry ._btn:hover::after {
  -webkit-animation-name: fade-arrow;
          animation-name: fade-arrow;
  -webkit-animation-duration: 0.6s;
          animation-duration: 0.6s;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}

body.front .l-entry {
  margin-top: 0;
}

/* ============================================
  footer
============================================  */
.l-footer {
  background-color: #fff;
  padding: 10rem 0 8rem;
  position: relative;
  z-index: 11;
}
@media screen and (max-width: 767px) {
  .l-footer {
    padding: 6rem 0 4rem;
  }
}
.l-footer ._col-group {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 5rem 0;
  margin-bottom: 6rem;
}
@media only screen and (max-width: 1000px) {
  .l-footer ._col-group {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}
@media screen and (max-width: 767px) {
  .l-footer ._col-group {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: 3rem 0;
  }
}
.l-footer ._col-group ._col {
  width: 30%;
}
@media only screen and (max-width: 1000px) {
  .l-footer ._col-group ._col {
    width: 50%;
  }
}
@media screen and (max-width: 767px) {
  .l-footer ._col-group ._col {
    border-left: 0;
    width: 100%;
  }
}
.l-footer ._col-group ._col:nth-child(2) {
  width: 40%;
}
@media only screen and (max-width: 1000px) {
  .l-footer ._col-group ._col:nth-child(2) {
    width: 50%;
  }
}
@media screen and (max-width: 767px) {
  .l-footer ._col-group ._col:nth-child(2) {
    width: 100%;
  }
}
.l-footer ._col-group ._col:nth-child(3) {
  width: 40%;
}
@media only screen and (max-width: 1000px) {
  .l-footer ._col-group ._col:nth-child(3) {
    width: 100%;
  }
}
.l-footer ._col-group ._col {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 7rem;
  border-left: solid 1px #D9D9D9;
  padding-right: 2rem;
  padding-left: 2rem;
  padding-top: 1rem;
  padding-bottom: 1rem;
}
@media screen and (max-width: 767px) {
  .l-footer ._col-group ._col {
    gap: 3rem;
  }
}
@media screen and (max-width: 767px) {
  .l-footer ._col-group ._col:nth-child(1) {
    padding-top: 3rem;
    border-top: solid 1px #D9D9D9;
  }
}
.l-footer ._col-group ._col:nth-child(3) {
  padding-right: 0;
  padding-left: 5rem;
  padding-top: 0;
}
@media only screen and (max-width: 1000px) {
  .l-footer ._col-group ._col:nth-child(3) {
    padding-left: 0;
    border-left: 0;
    padding-top: 4rem;
  }
}
@media screen and (max-width: 767px) {
  .l-footer ._col-group ._col:nth-child(3) {
    padding-top: 3rem;
    border-top: solid 1px #D9D9D9;
    margin-top: 3rem;
  }
}
@media screen and (max-width: 767px) {
  .l-footer ._col-group ._col {
    border-left: 0;
    padding-bottom: 0;
    padding-left: 6%;
    padding-right: 6%;
    padding-top: 0;
  }
}
.l-footer ._col-group ._col ._nav {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  color: #999;
  font-size: 2rem;
  font-weight: 600;
  line-height: 1.5;
  gap: 1.5em;
}
@media screen and (max-width: 767px) {
  .l-footer ._col-group ._col ._nav {
    font-size: 1.6rem;
    gap: 1em;
  }
}
.l-footer ._col-group ._col ._nav li:not(:first-child) {
  font-size: 1.8rem;
  font-weight: 400;
  margin-left: 1em;
  padding-left: 1em;
  position: relative;
}
@media screen and (max-width: 767px) {
  .l-footer ._col-group ._col ._nav li:not(:first-child) {
    font-size: 1.4rem;
    text-align: left;
  }
}
.l-footer ._col-group ._col ._nav li:not(:first-child)::before {
  content: "・";
  color: var(--color-base);
  position: absolute;
  left: 0;
}
.l-footer ._col-group ._col ._nav a {
  color: var(--color-base);
  text-decoration: none;
  position: relative;
  display: inline-block;
  text-decoration: none;
}
.l-footer ._col-group ._col ._nav a::after {
  position: absolute;
  bottom: -2px;
  left: 0;
  content: "";
  width: 100%;
  height: 2px;
  background: var(--color-primary);
  opacity: 0;
  -webkit-transition: 0.3s ease-out;
  transition: 0.3s ease-out;
}
.l-footer ._col-group ._col ._nav a:hover::after {
  opacity: 1;
}
@media only screen and (max-width: 1000px) {
  .l-footer ._col-group ._col ._company-info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
  }
}
.l-footer ._col-group ._col ._company-info ._logo {
  width: 100%;
  max-width: 314px;
  margin-bottom: 5rem;
}
@media screen and (max-width: 767px) {
  .l-footer ._col-group ._col ._company-info ._logo {
    width: 80%;
    margin-bottom: 3rem;
  }
}
.l-footer ._col-group ._col ._company-info ._manager {
  font-size: 1.8rem;
  font-weight: 600;
  margin-bottom: 2.5rem;
}
@media screen and (max-width: 767px) {
  .l-footer ._col-group ._col ._company-info ._manager {
    font-size: 1.6rem;
    margin-bottom: 2rem;
  }
}
.l-footer ._col-group ._col ._company-info ._address {
  font-size: 1.6rem;
  line-height: 2.5;
}
@media screen and (max-width: 767px) {
  .l-footer ._col-group ._col ._company-info ._address {
    font-size: 1.4rem;
  }
}
.l-footer ._copyright {
  font-size: 1.6rem;
  text-align: center;
  line-height: 2;
}
@media screen and (max-width: 767px) {
  .l-footer ._copyright {
    font-size: 1.2rem;
  }
}

/* ============================================
  pagetop
============================================  */
.l-pagetop {
  position: fixed;
  bottom: 33px;
  right: 33px;
  z-index: 20;
  width: 50px;
  height: 50px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  background-color: rgba(0, 0, 0, 0.8);
  cursor: pointer;
  -webkit-transform: rotate(-90deg);
          transform: rotate(-90deg);
  -webkit-transition: 0.3s;
  transition: 0.3s;
  /* 非表示にする */
  opacity: 0;
  visibility: hidden;
}
@media screen and (max-width: 767px) {
  .l-pagetop {
    bottom: 10px;
    right: 10px;
  }
}
.l-pagetop svg {
  fill: #fff;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
.l-pagetop:hover {
  background-color: var(--color-primary);
}

.l-pagetop.is-active {
  /* 表示する */
  opacity: 1;
  visibility: visible;
}

/* ============================================
  共通
============================================  */
.f-h2group {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
.f-h2group ._h2 {
  font-family: "garamond-atf-subhead", serif;
  font-weight: 500;
  color: var(--color-primary);
  font-size: 10rem;
  position: relative;
  line-height: 1;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding-right: 75px;
}
@media screen and (max-width: 767px) {
  .f-h2group ._h2 {
    font-size: 5rem;
    padding-right: 50px;
  }
}
.f-h2group ._h2::after {
  position: absolute;
  top: 50%;
  right: 0;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  content: "";
  display: block;
  height: 80px;
  width: 50px;
  clip-path: polygon(calc(100% - 15px) 0, 100% 0, 15px 100%, 0 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#0792D5), to(#033794));
  background-image: linear-gradient(#0792D5, #033794);
}
@media screen and (max-width: 767px) {
  .f-h2group ._h2::after {
    height: 50px;
    width: 35px;
  }
}
.f-h2group ._text {
  font-family: "dnp-shuei-mincho-pr6n", sans-serif;
  font-size: 3rem;
  font-weight: 400;
}
@media screen and (max-width: 767px) {
  .f-h2group ._text {
    font-size: 2rem;
  }
}

.f-section:nth-child(even) .f-h2group {
  margin-right: 0;
  margin-left: auto;
}

/* ============================================
  メインビジュアル
============================================  */
.f-mainvisual {
  width: 100%;
  height: 100vh;
  height: calc(var(--vh, 1vh) * 100);
  position: relative;
  overflow: hidden;
}
@media only screen and (min-width: 1350px) {
  .f-mainvisual {
    min-height: 800px;
  }
}
@media only screen and (max-width: 1349px) {
  .f-mainvisual {
    min-height: 700px;
  }
}
@media only screen and (max-width: 1250px) {
  .f-mainvisual {
    min-height: 600px;
  }
}
@media screen and (max-width: 767px) {
  .f-mainvisual {
    background-position: center;
    min-height: auto;
    max-height: 600px;
  }
}
.f-mainvisual ._mvslide {
  width: 100%;
  height: 100%;
}
.f-mainvisual ._mvslide ._list ._item {
  position: relative;
  overflow: hidden;
}
.f-mainvisual ._mvslide ._list ._item ._mv {
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  opacity: 0;
  -webkit-transition: opacity 0.6s ease;
  transition: opacity 0.6s ease;
}
.f-mainvisual ._mvslide ._list ._item ._mv.--1 {
  background-image: url(../../img/front/mv01.jpg);
}
@media screen and (max-width: 767px) {
  .f-mainvisual ._mvslide ._list ._item ._mv.--1 {
    background-image: url(../../img/front/mv01-sp.jpg);
  }
}
.f-mainvisual ._mvslide ._list ._item ._mv.--2 {
  background-image: url(../../img/front/mv02.jpg);
}
@media screen and (max-width: 767px) {
  .f-mainvisual ._mvslide ._list ._item ._mv.--2 {
    background-image: url(../../img/front/mv02-sp.jpg);
  }
}
.f-mainvisual ._mvslide ._list ._item ._mv.--3 {
  background-image: url(../../img/front/mv03.jpg);
}
@media screen and (max-width: 767px) {
  .f-mainvisual ._mvslide ._list ._item ._mv.--3 {
    background-image: url(../../img/front/mv03-sp.jpg);
  }
}
.f-mainvisual ._mvslide ._list ._item::after {
  content: "";
  position: absolute;
  top: 0;
  left: -50%;
  z-index: 10;
  background-color: var(--color-primary);
  width: 200%;
  height: 100%;
  -webkit-transform: skewX(-25deg) scaleX(0);
          transform: skewX(-25deg) scaleX(0);
  opacity: 0;
}
.f-mainvisual ._mvslide ._list ._item.swiper-slide-active::after {
  -webkit-animation: maskAnim 1.2s cubic-bezier(0.8, 0, 0.2, 0.5) forwards;
          animation: maskAnim 1.2s cubic-bezier(0.8, 0, 0.2, 0.5) forwards;
}
.f-mainvisual ._mvslide ._list ._item.swiper-slide-active ._mv {
  opacity: 1;
  -webkit-transition: opacity 0s 0.6s;
  transition: opacity 0s 0.6s;
}
.f-mainvisual ._mvslide ._list ._item.swiper-slide-duplicate-active::after {
  -webkit-animation: maskAnim 1.2s cubic-bezier(0.8, 0, 0.2, 0.5) forwards;
          animation: maskAnim 1.2s cubic-bezier(0.8, 0, 0.2, 0.5) forwards;
}
.f-mainvisual ._mvslide ._list ._item.swiper-slide-duplicate-active ._mv {
  opacity: 1;
  -webkit-transition: opacity 0s 0.6s;
  transition: opacity 0s 0.6s;
}
.f-mainvisual ._copy {
  position: absolute;
  left: 50%;
  margin-left: 90px;
  bottom: 220px;
  z-index: 10;
}
@media only screen and (max-width: 1350px) {
  .f-mainvisual ._copy {
    margin-left: 25px;
    bottom: 100px;
  }
}
@media screen and (max-width: 767px) {
  .f-mainvisual ._copy {
    margin-left: -85px;
    bottom: 20px;
    width: 80%;
  }
}
.f-mainvisual ._copy ._main {
  width: 552px;
  opacity: 0;
  -webkit-transform: translateX(20px);
          transform: translateX(20px);
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
@media only screen and (max-width: 1250px) {
  .f-mainvisual ._copy ._main {
    width: 460px;
  }
}
@media only screen and (max-width: 1050px) {
  .f-mainvisual ._copy ._main {
    width: 420px;
  }
}
@media only screen and (max-width: 950px) {
  .f-mainvisual ._copy ._main {
    width: 380px;
  }
}
@media screen and (max-width: 767px) {
  .f-mainvisual ._copy ._main {
    width: 260px;
    padding-left: 50px;
    margin-bottom: 20px;
  }
}
.f-mainvisual ._copy ._main img {
  width: 100%;
  height: auto;
}
.f-mainvisual ._copy ._sub {
  font-size: 2rem;
  line-height: 2.2em;
  padding-left: 100px;
}
@media only screen and (max-width: 1250px) {
  .f-mainvisual ._copy ._sub {
    font-size: 1.6rem;
  }
}
@media only screen and (max-width: 1050px) {
  .f-mainvisual ._copy ._sub {
    font-size: 1.4rem;
  }
}
@media only screen and (max-width: 950px) {
  .f-mainvisual ._copy ._sub {
    font-size: 1.2rem;
  }
}
@media screen and (max-width: 767px) {
  .f-mainvisual ._copy ._sub {
    padding-left: 0;
    font-size: 1.1rem;
  }
}
.f-mainvisual ._copy ._sub span {
  display: block;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
.f-mainvisual ._copy ._sub .--1 {
  opacity: 0;
  -webkit-transform: translateX(20px);
          transform: translateX(20px);
  padding-left: 3em;
}
.f-mainvisual ._copy ._sub .--2 {
  opacity: 0;
  -webkit-transform: translateX(20px);
          transform: translateX(20px);
  padding-left: 2em;
}
.f-mainvisual ._copy ._sub .--3 {
  opacity: 0;
  -webkit-transform: translateX(20px);
          transform: translateX(20px);
  padding-left: 1em;
}
.f-mainvisual ._copy ._sub .--4 {
  opacity: 0;
  -webkit-transform: translateX(20px);
          transform: translateX(20px);
}
.f-mainvisual ._line01 {
  position: absolute;
  bottom: -1598px;
  left: 50%;
  z-index: 5;
  margin-left: 487px;
  width: 5000px;
  height: 5000px;
  background-color: rgba(255, 255, 255, 0.4);
  -webkit-transform: rotate(25deg) translateX(100vw);
          transform: rotate(25deg) translateX(100vw);
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
@media screen and (max-width: 767px) {
  .f-mainvisual ._line01 {
    margin-left: 561px;
  }
}
.f-mainvisual ._line02 {
  position: absolute;
  bottom: -1598px;
  left: 50%;
  z-index: 6;
  margin-left: 737px;
  width: 5000px;
  height: 5000px;
  background-color: #fff;
  -webkit-transform: rotate(25deg) translateX(100vw);
          transform: rotate(25deg) translateX(100vw);
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
@media screen and (max-width: 767px) {
  .f-mainvisual ._line02 {
    margin-left: 714px;
  }
}
.f-mainvisual ._line03 {
  position: absolute;
  bottom: -1598px;
  left: 50%;
  z-index: 7;
  margin-left: 981px;
  width: 5000px;
  height: 5000px;
  background-color: #fff;
  -webkit-transform: rotate(25deg) translateX(100vw);
          transform: rotate(25deg) translateX(100vw);
  border-left: solid 1px #D9D9D9;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
@media screen and (max-width: 767px) {
  .f-mainvisual ._line03 {
    margin-left: 862px;
  }
}

.is-loaded.active .f-mainvisual ._copy ._main {
  -webkit-transform: translateX(0);
          transform: translateX(0);
  opacity: 1;
  -webkit-transition-delay: 2s;
          transition-delay: 2s;
}
.is-loaded.active .f-mainvisual ._copy ._sub .--1 {
  -webkit-transform: translateX(0);
          transform: translateX(0);
  opacity: 1;
  -webkit-transition-delay: 2.4s;
          transition-delay: 2.4s;
}
.is-loaded.active .f-mainvisual ._copy ._sub .--2 {
  -webkit-transform: translateX(0);
          transform: translateX(0);
  opacity: 1;
  -webkit-transition-delay: 2.6s;
          transition-delay: 2.6s;
}
.is-loaded.active .f-mainvisual ._copy ._sub .--3 {
  -webkit-transform: translateX(0);
          transform: translateX(0);
  opacity: 1;
  -webkit-transition-delay: 2.8s;
          transition-delay: 2.8s;
}
.is-loaded.active .f-mainvisual ._copy ._sub .--4 {
  -webkit-transform: translateX(0);
          transform: translateX(0);
  opacity: 1;
  -webkit-transition-delay: 3s;
          transition-delay: 3s;
}
.is-loaded.active .f-mainvisual ._line01 {
  -webkit-transform: rotate(25deg);
          transform: rotate(25deg);
  -webkit-transition-delay: 1s;
          transition-delay: 1s;
}
.is-loaded.active .f-mainvisual ._line02 {
  -webkit-transform: rotate(25deg);
          transform: rotate(25deg);
  -webkit-transition-delay: 1.2s;
          transition-delay: 1.2s;
}
.is-loaded.active .f-mainvisual ._line03 {
  -webkit-transform: rotate(25deg);
          transform: rotate(25deg);
  -webkit-transition-delay: 1.4s;
          transition-delay: 1.4s;
}

/* ============================================
  line
============================================  */
.f-line {
  background-image: url(../../img/front/line.png);
  background-position: center top;
  background-repeat: no-repeat;
  position: relative;
  z-index: 10;
  background-color: #fff;
}
@media screen and (max-width: 767px) {
  .f-line {
    background-size: auto 3200px;
  }
}
.f-line ._material-group {
  position: absolute;
}
@media screen and (max-width: 767px) {
  .f-line ._material-group {
    display: none;
  }
}
.f-line ._material-group ._material {
  width: 626px;
  height: 808px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  overflow: hidden;
  position: absolute;
}
.f-line ._material-group ._material.--A {
  background-color: #E3E3E3;
}
.f-line ._material-group ._material.--B {
  background-color: #D8E3F1;
}
.f-line ._material-group ._material.--1 {
  background-image: url(../../img/front/material01.png);
}
.f-line ._material-group ._material.--2 {
  background-image: url(../../img/front/material02.png);
}
.f-line ._material-group ._material.--5 {
  background-image: url(../../img/front/material05.png);
}
.f-line ._material-group ._material.--6 {
  background-image: url(../../img/front/material06.png);
}
.f-line ._material-group ._material.--1 {
  top: 100px;
  left: 0;
}
.f-line ._material-group ._material.--2 {
  top: 0;
  left: 304px;
}
.f-line ._material-group ._material.--3 {
  top: 0;
  left: 0;
}
.f-line ._material-group ._material.--4 {
  top: 100px;
  left: 304px;
}
.f-line ._material-group ._material.--5 {
  top: 100px;
  left: 0;
}
.f-line ._material-group ._material.--6 {
  top: 0;
  left: 304px;
}
.f-line ._material-group.--1 ._material, .f-line ._material-group.--3 ._material {
  clip-path: polygon(calc(100% - 248px) 0, 100% 0, 248px 100%, 0 100%);
}
.f-line ._material-group.--2 ._material {
  clip-path: polygon(0 0, 248px 0, 100% 100%, calc(100% - 248px) 100%);
}
.f-line ._material-group.--1 {
  top: -193px;
  left: 50%;
  margin-left: -29px;
}
.f-line ._material-group.--2 {
  top: 1038px;
  right: 50%;
  margin-right: 790px;
}
.f-line ._material-group.--3 {
  top: 3090px;
  left: 50%;
  margin-left: -142px;
}

/* ============================================
  About
============================================  */
.f-about {
  padding-top: 170px;
  position: relative;
  z-index: 2;
}
@media screen and (max-width: 767px) {
  .f-about {
    padding-top: 100px;
  }
}
.f-about ._list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 30px;
  margin-top: 90px;
}
@media screen and (max-width: 767px) {
  .f-about ._list {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    margin-top: 60px;
    width: 80%;
    margin-left: auto;
    margin-right: auto;
  }
}
.f-about ._list ._item {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  text-decoration: none;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
}
.f-about ._list ._item:nth-child(2) {
  margin-top: 100px;
}
@media screen and (max-width: 767px) {
  .f-about ._list ._item:nth-child(2) {
    margin-top: 0;
  }
}
.f-about ._list ._item:nth-child(3) {
  margin-top: 200px;
}
@media screen and (max-width: 767px) {
  .f-about ._list ._item:nth-child(3) {
    margin-top: 0;
  }
}
.f-about ._list ._item ._thumb {
  width: 100%;
  padding-top: 56%;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  position: relative;
  background-color: #000;
  overflow: hidden;
}
@media screen and (max-width: 767px) {
  .f-about ._list ._item ._thumb {
    padding-top: 70%;
  }
}
.f-about ._list ._item ._thumb img {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%) scale(1.01);
          transform: translate(-50%, -50%) scale(1.01);
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
.f-about ._list ._item ._title {
  height: 100px;
  padding: 25px;
  color: #fff;
  font-size: 2rem;
  font-weight: 600;
  line-height: 1.6;
  background-color: var(--color-primary);
  background-size: auto 200%;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#0792D5), color-stop(51%, #033794), to(#0792D5));
  background-image: linear-gradient(to bottom, #0792D5 0%, #033794 51%, #0792D5 100%);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
  padding-right: 8rem;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
@media screen and (max-width: 767px) {
  .f-about ._list ._item ._title {
    font-size: 1.6rem;
    height: 50px;
    padding-right: 4rem;
  }
}
.f-about ._list ._item ._title::before {
  content: "";
  position: absolute;
  right: 2.5rem;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  width: 3.6rem;
  height: 3.6rem;
  border-radius: 50%;
  border: solid 2px #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
@media screen and (max-width: 767px) {
  .f-about ._list ._item ._title::before {
    right: 2rem;
    width: 2.4rem;
    height: 2.4rem;
  }
}
.f-about ._list ._item ._title::after {
  content: "";
  position: absolute;
  right: 4rem;
  top: 50%;
  -webkit-transform: translateY(-50%) rotate(45deg);
          transform: translateY(-50%) rotate(45deg);
  width: 1rem;
  height: 1rem;
  border-top: solid 2px #fff;
  border-right: solid 2px #fff;
}
@media screen and (max-width: 767px) {
  .f-about ._list ._item ._title::after {
    right: 3rem;
    width: 0.6rem;
    height: 0.6rem;
  }
}
.f-about ._list ._item:hover ._thumb img {
  -webkit-transform: translate(-50%, -50%) scale(1.1);
          transform: translate(-50%, -50%) scale(1.1);
  opacity: 0.8;
}
.f-about ._list ._item:hover ._title {
  background-position: bottom center;
}
.f-about ._list ._item:hover ._title::after {
  -webkit-animation-name: fade-arrow;
          animation-name: fade-arrow;
  -webkit-animation-duration: 0.6s;
          animation-duration: 0.6s;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}

/* ============================================
  Works
============================================  */
.f-works {
  padding-top: 140px;
  position: relative;
  z-index: 2;
}
@media screen and (max-width: 767px) {
  .f-works {
    padding-top: 100px;
  }
}
.f-works ._list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 30px;
  margin-top: 130px;
}
@media screen and (max-width: 767px) {
  .f-works ._list {
    margin-top: 60px;
    width: 80%;
    margin-left: auto;
    margin-right: auto;
  }
}
.f-works ._list ._item {
  width: 100%;
  height: 320px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  text-decoration: none;
}
@media screen and (max-width: 767px) {
  .f-works ._list ._item {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    height: auto;
  }
}
.f-works ._list ._item ._thumb {
  position: absolute;
  width: calc(100% - 320px);
  height: 100%;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  position: relative;
  background-color: #000;
  overflow: hidden;
}
@media screen and (max-width: 767px) {
  .f-works ._list ._item ._thumb {
    height: auto;
    padding-top: 70%;
    width: 100%;
  }
}
.f-works ._list ._item ._thumb img {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%) scale(1.01);
          transform: translate(-50%, -50%) scale(1.01);
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
.f-works ._list ._item ._title {
  height: 100%;
  width: 320px;
  padding: 25px;
  color: #fff;
  font-size: 2rem;
  font-weight: 600;
  line-height: 1.6;
  background-color: var(--color-primary);
  background-size: auto 200%;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#0792D5), color-stop(51%, #033794), to(#0792D5));
  background-image: linear-gradient(to bottom, #0792D5 0%, #033794 51%, #0792D5 100%);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
  padding-right: 8rem;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
@media screen and (max-width: 767px) {
  .f-works ._list ._item ._title {
    width: 100%;
    height: 50px;
    font-size: 1.6rem;
    padding-right: 4rem;
  }
}
.f-works ._list ._item ._title::before {
  content: "";
  position: absolute;
  right: 2.5rem;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  width: 3.6rem;
  height: 3.6rem;
  border-radius: 50%;
  border: solid 2px #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
@media screen and (max-width: 767px) {
  .f-works ._list ._item ._title::before {
    right: 2rem;
    width: 2.4rem;
    height: 2.4rem;
  }
}
.f-works ._list ._item ._title::after {
  content: "";
  position: absolute;
  right: 4rem;
  top: 50%;
  -webkit-transform: translateY(-50%) rotate(45deg);
          transform: translateY(-50%) rotate(45deg);
  width: 1rem;
  height: 1rem;
  border-top: solid 2px #fff;
  border-right: solid 2px #fff;
}
@media screen and (max-width: 767px) {
  .f-works ._list ._item ._title::after {
    right: 3rem;
    width: 0.6rem;
    height: 0.6rem;
  }
}
.f-works ._list ._item:hover ._thumb img {
  -webkit-transform: translate(-50%, -50%) scale(1.1);
          transform: translate(-50%, -50%) scale(1.1);
  opacity: 0.8;
}
.f-works ._list ._item:hover ._title {
  background-position: bottom center;
}
.f-works ._list ._item:hover ._title::after {
  -webkit-animation-name: fade-arrow;
          animation-name: fade-arrow;
  -webkit-animation-duration: 0.6s;
          animation-duration: 0.6s;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}

/* ============================================
  Conditions
============================================  */
.f-conditions {
  padding-top: 390px;
  position: relative;
  z-index: 2;
}
@media screen and (max-width: 767px) {
  .f-conditions {
    padding-top: 100px;
  }
}
.f-conditions ._list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 30px;
  margin-top: 100px;
}
@media screen and (max-width: 767px) {
  .f-conditions ._list {
    margin-top: 60px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    width: 80%;
    margin-left: auto;
    margin-right: auto;
  }
}
.f-conditions ._list ._item {
  width: 100%;
  height: 320px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
  text-decoration: none;
}
@media screen and (max-width: 767px) {
  .f-conditions ._list ._item {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    height: auto;
  }
}
.f-conditions ._list ._item ._thumb {
  position: absolute;
  width: calc(100% - 320px);
  height: 100%;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  position: relative;
  background-color: #000;
  overflow: hidden;
}
@media screen and (max-width: 767px) {
  .f-conditions ._list ._item ._thumb {
    height: auto;
    padding-top: 70%;
    width: 100%;
  }
}
.f-conditions ._list ._item ._thumb img {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%) scale(1.01);
          transform: translate(-50%, -50%) scale(1.01);
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
.f-conditions ._list ._item ._title {
  height: 100%;
  width: 320px;
  padding: 25px;
  color: #fff;
  font-size: 2rem;
  font-weight: 600;
  line-height: 1.6;
  background-color: var(--color-primary);
  background-size: auto 200%;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#0792D5), color-stop(51%, #033794), to(#0792D5));
  background-image: linear-gradient(to bottom, #0792D5 0%, #033794 51%, #0792D5 100%);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
  padding-right: 8rem;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
@media screen and (max-width: 767px) {
  .f-conditions ._list ._item ._title {
    width: 100%;
    height: 50px;
    font-size: 1.6rem;
    padding-right: 4rem;
  }
}
.f-conditions ._list ._item ._title::before {
  content: "";
  position: absolute;
  right: 2.5rem;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  width: 3.6rem;
  height: 3.6rem;
  border-radius: 50%;
  border: solid 2px #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
@media screen and (max-width: 767px) {
  .f-conditions ._list ._item ._title::before {
    right: 2rem;
    width: 2.4rem;
    height: 2.4rem;
  }
}
.f-conditions ._list ._item ._title::after {
  content: "";
  position: absolute;
  right: 4rem;
  top: 50%;
  -webkit-transform: translateY(-50%) rotate(45deg);
          transform: translateY(-50%) rotate(45deg);
  width: 1rem;
  height: 1rem;
  border-top: solid 2px #fff;
  border-right: solid 2px #fff;
}
@media screen and (max-width: 767px) {
  .f-conditions ._list ._item ._title::after {
    right: 3rem;
    width: 0.6rem;
    height: 0.6rem;
  }
}
.f-conditions ._list ._item:hover ._thumb img {
  -webkit-transform: translate(-50%, -50%) scale(1.1);
          transform: translate(-50%, -50%) scale(1.1);
  opacity: 0.8;
}
.f-conditions ._list ._item:hover ._title {
  background-position: bottom center;
}
.f-conditions ._list ._item:hover ._title::after {
  -webkit-animation-name: fade-arrow;
          animation-name: fade-arrow;
  -webkit-animation-duration: 0.6s;
          animation-duration: 0.6s;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}

/* ============================================
  Recruit
============================================  */
.f-recruit {
  padding-top: 170px;
  padding-bottom: 400px;
  position: relative;
  z-index: 2;
}
@media screen and (max-width: 767px) {
  .f-recruit {
    padding-top: 100px;
    padding-bottom: 100px;
  }
}
.f-recruit ._list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 30px;
  margin-top: 160px;
}
@media screen and (max-width: 767px) {
  .f-recruit ._list {
    margin-top: 60px;
  }
}
.f-recruit ._list ._item {
  width: 100%;
  max-width: 900px;
  height: 120px;
  text-decoration: none;
  background-color: rgba(255, 255, 255, 0.8);
  border: solid 2px var(--color-primary);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
  padding: 2.5rem 10rem 2.5rem 5rem;
  -webkit-transition: 0.3s;
  transition: 0.3s;
  border-radius: 9999px;
}
@media screen and (max-width: 767px) {
  .f-recruit ._list ._item {
    height: 80px;
    padding: 1.5rem 5rem 1.5rem 3rem;
  }
}
.f-recruit ._list ._item::before {
  content: "";
  position: absolute;
  right: 4rem;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  width: 3.6rem;
  height: 3.6rem;
  border-radius: 50%;
  border: solid 2px var(--color-primary);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
@media screen and (max-width: 767px) {
  .f-recruit ._list ._item::before {
    right: 2rem;
    width: 2.4rem;
    height: 2.4rem;
  }
}
.f-recruit ._list ._item::after {
  content: "";
  position: absolute;
  right: 5.5rem;
  top: 50%;
  -webkit-transform: translateY(-50%) rotate(45deg);
          transform: translateY(-50%) rotate(45deg);
  width: 1rem;
  height: 1rem;
  border-top: solid 2px var(--color-primary);
  border-right: solid 2px var(--color-primary);
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
@media screen and (max-width: 767px) {
  .f-recruit ._list ._item::after {
    right: 3rem;
    width: 0.6rem;
    height: 0.6rem;
  }
}
.f-recruit ._list ._item ._icon {
  width: 50px;
  height: 50px;
  -webkit-mask-size: contain;
          mask-size: contain;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  background-color: var(--color-primary);
  margin-right: 5rem;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
@media screen and (max-width: 767px) {
  .f-recruit ._list ._item ._icon {
    width: 30px;
    height: 30px;
    margin-right: 2rem;
  }
}
.f-recruit ._list ._item ._icon.--massage {
  -webkit-mask-image: url(../../img/front/icon_message.svg);
          mask-image: url(../../img/front/icon_message.svg);
}
.f-recruit ._list ._item ._icon.--flow {
  -webkit-mask-image: url(../../img/front/icon_flow.svg);
          mask-image: url(../../img/front/icon_flow.svg);
}
.f-recruit ._list ._item ._icon.--faq {
  -webkit-mask-image: url(../../img/front/icon_faq.svg);
          mask-image: url(../../img/front/icon_faq.svg);
}
.f-recruit ._list ._item ._title {
  color: var(--color-primary);
  font-size: 2.2rem;
  line-height: 1.6;
  font-weight: 600;
  border-left: solid 2px var(--color-primary);
  padding-left: 10rem;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
@media screen and (max-width: 767px) {
  .f-recruit ._list ._item ._title {
    font-size: 1.6rem;
    padding-left: 2rem;
  }
}
.f-recruit ._list ._item:hover {
  background-color: var(--color-primary);
}
.f-recruit ._list ._item:hover::before {
  border: solid 2px #fff;
}
.f-recruit ._list ._item:hover::after {
  -webkit-animation-name: fade-arrow;
          animation-name: fade-arrow;
  -webkit-animation-duration: 0.6s;
          animation-duration: 0.6s;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  border-top: solid 2px #fff;
  border-right: solid 2px #fff;
}
.f-recruit ._list ._item:hover ._icon {
  background-color: #fff;
}
.f-recruit ._list ._item:hover ._title {
  color: #fff;
  border-left: solid 2px #fff;
}

/* ============================================
  text
============================================  */
.c-read {
  font-size: 1.8rem;
  line-height: 1.8;
}
@media screen and (max-width: 767px) {
  .c-read {
    font-size: 1.4rem;
  }
}

/* ============================================
  col
============================================  */
.col_box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.col_box > .col2 {
  width: 48%;
}

.col_box > .col3 {
  width: 32%;
}

.col_box > .col4 {
  width: 23.5%;
}

@media only screen and (max-width: 767px) {
  .col_box > .col2 {
    width: 100%;
    margin-bottom: 40px;
  }
  .col_box > .col2:last-child {
    margin-bottom: 0;
  }
  .col_box > .col3,
  .col_box > .col4 {
    width: 48%;
    margin-top: 20px;
  }
  .col_box > .col3:nth-child(1),
  .col_box > .col3:nth-child(2),
  .col_box > .col4:nth-child(1),
  .col_box > .col4:nth-child(2) {
    margin-top: 0;
  }
}
/* ============================================
  ul
============================================  */
ul.c-list li {
  font-size: 1.6rem;
  line-height: 1.8;
  text-indent: -1em;
  padding-left: 1em;
}
ul.c-list li::before {
  content: "●";
}
ul.c-list--other li {
  font-size: 1.6rem;
  line-height: 1.8;
  padding-left: 1em;
  position: relative;
}
ul.c-list--other li span {
  position: absolute;
  top: 0;
  left: 0;
}

/* ============================================
  dl
============================================  */
dl.list {
  width: 100%;
  border-bottom: solid 1px #ccc;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: left;
      -ms-flex-pack: left;
          justify-content: left;
}

dl.list dt,
dl.list dd {
  padding: 20px;
  line-height: 1.6;
}

dl.list dt {
  width: 180px;
  font-size: 1.8rem;
  font-weight: bold;
}

dl.list dd {
  width: calc(100% - 180px);
  font-size: 1.6rem;
}

@media only screen and (max-width: 767px) {
  dl.list {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  dl.list dt {
    width: 100%;
    font-size: 1.6rem;
    padding: 20px 20px 10px 20px;
  }
  dl.list dd {
    width: 100%;
    font-size: 1.5rem;
    padding: 0 20px 20px 20px;
  }
}
.c-note {
  font-size: 1.4rem;
  line-height: 1.8;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.c-note__ttl {
  width: 1.5em;
}
.c-note__txt {
  width: calc(100% - 1.5em);
}

/* ============================================
  btn
============================================  */
.c-btn {
  display: block;
  height: 7rem;
  min-width: 30rem;
  padding: 1rem 6rem 1rem 2.5rem;
  color: #fff;
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.6;
  text-decoration: none;
  background-color: var(--color-primary);
  background-size: auto 200%;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#0792D5), color-stop(51%, #033794), to(#0792D5));
  background-image: linear-gradient(to bottom, #0792D5 0%, #033794 51%, #0792D5 100%);
  border-radius: 9999px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
@media screen and (max-width: 767px) {
  .c-btn {
    font-size: 1.6rem;
    height: 4rem;
    min-width: auto;
    padding: 1rem 5rem 1rem 2.5rem;
  }
}
.c-btn::before {
  content: "";
  position: absolute;
  right: 3rem;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  width: 3.6rem;
  height: 3.6rem;
  border-radius: 50%;
  border: solid 2px #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
@media screen and (max-width: 767px) {
  .c-btn::before {
    right: 1.5rem;
    width: 2.4rem;
    height: 2.4rem;
  }
}
.c-btn::after {
  content: "";
  position: absolute;
  right: 4.5rem;
  top: 50%;
  -webkit-transform: translateY(-50%) rotate(45deg);
          transform: translateY(-50%) rotate(45deg);
  width: 1rem;
  height: 1rem;
  border-top: solid 2px #fff;
  border-right: solid 2px #fff;
}
@media screen and (max-width: 767px) {
  .c-btn::after {
    right: 2.5rem;
    width: 0.6rem;
    height: 0.6rem;
  }
}
.c-btn:hover {
  background-position: bottom center;
}
.c-btn:hover::after {
  -webkit-animation-name: fade-arrow;
          animation-name: fade-arrow;
  -webkit-animation-duration: 0.6s;
          animation-duration: 0.6s;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}

/* ============================================
  name
============================================  */
.sub .l-wrapper {
  opacity: 0;
  -webkit-transition: 1s ease;
  transition: 1s ease;
}
.sub .l-wrapper.active {
  opacity: 1;
}

/* ============================================
  検索欄
============================================  */
.p-searchform {
  background-color: #fff;
  -webkit-box-shadow: 0 10px 50px rgba(0, 0, 0, 0.16);
          box-shadow: 0 10px 50px rgba(0, 0, 0, 0.16);
  padding: 3.5rem 5rem;
  margin-top: 4rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 4rem 6rem;
}
@media screen and (max-width: 767px) {
  .p-searchform {
    padding: 2rem;
    gap: 2rem;
  }
}
@media only screen and (max-width: 1200px) {
  .p-searchform {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
.p-searchform ._searcharea {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
.p-searchform ._searcharea ._block {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding-bottom: 2rem;
  border-bottom: solid 1px #ccc;
  margin-bottom: 2rem;
}
@media screen and (max-width: 767px) {
  .p-searchform ._searcharea ._block {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 1.5rem;
  }
}
.p-searchform ._searcharea ._block:last-child {
  padding-bottom: 0;
  border-bottom: 0px;
  margin-bottom: 0;
}
.p-searchform ._searcharea ._block ._title {
  -ms-flex-negative: 0;
      flex-shrink: 0;
  color: var(--color-primary);
  font-size: 2rem;
  font-weight: 700;
  width: 15rem;
  padding-right: 2em;
}
@media screen and (max-width: 767px) {
  .p-searchform ._searcharea ._block ._title {
    font-size: 1.6rem;
    width: 12rem;
  }
}
.p-searchform ._searcharea ._block ._list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  font-size: 1.8rem;
  gap: 0.5em 2em;
}
@media screen and (max-width: 767px) {
  .p-searchform ._searcharea ._block ._list {
    font-size: 1.4rem;
    gap: 0.5em 1.5em;
  }
}
.p-searchform ._searcharea ._block ._list label {
  -ms-flex-negative: 0;
      flex-shrink: 0;
  display: block;
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5em;
}
.p-searchform ._searcharea ._block ._list label span {
  position: relative;
  display: block;
  width: 3rem;
  height: 3rem;
  border-radius: 4px;
  background-color: #fff;
  border: solid 1px #CDD6DD;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
@media screen and (max-width: 767px) {
  .p-searchform ._searcharea ._block ._list label span {
    width: 2rem;
    height: 2rem;
  }
}
.p-searchform ._searcharea ._block ._list label span::after {
  opacity: 0;
  content: "";
  width: 16px;
  height: 12px;
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  -webkit-mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxMS4wMzQiIHZpZXdCb3g9IjAgMCAxNiAxMS4wMzQiPjxkZWZzPjxzdHlsZT4uYXtmaWxsOiMxNzkwMmY7fTwvc3R5bGU+PC9kZWZzPjxwYXRoIGNsYXNzPSJhIiBkPSJNNi4zNDUsMTEuMDM0LDAsNC42OSwxLjI4NywzLjQsNi4zNDUsOC4zNjgsMTQuNzEzLDAsMTYsMS4yODdaIi8+PC9zdmc+");
          mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxMS4wMzQiIHZpZXdCb3g9IjAgMCAxNiAxMS4wMzQiPjxkZWZzPjxzdHlsZT4uYXtmaWxsOiMxNzkwMmY7fTwvc3R5bGU+PC9kZWZzPjxwYXRoIGNsYXNzPSJhIiBkPSJNNi4zNDUsMTEuMDM0LDAsNC42OSwxLjI4NywzLjQsNi4zNDUsOC4zNjgsMTQuNzEzLDAsMTYsMS4yODdaIi8+PC9zdmc+");
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: contain;
          mask-size: contain;
  -webkit-mask-position: center;
          mask-position: center;
  background-color: var(--color-primary);
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
@media screen and (max-width: 767px) {
  .p-searchform ._searcharea ._block ._list label span::after {
    width: 12px;
    height: 8px;
  }
}
.p-searchform ._searcharea ._block ._list label input[type=checkbox] {
  display: none;
}
.p-searchform ._searcharea ._block ._list label input[type=checkbox]:checked + span::after {
  opacity: 1;
}
.p-searchform input[type=reset] {
  width: 180px;
  height: 50px;
  border: none;
  cursor: pointer;
  color: #fff;
  font-size: 1.8rem;
  font-weight: 700;
  background-color: #999;
  border-radius: 9999px;
  -webkit-transform: translateY(-1rem);
          transform: translateY(-1rem);
  -webkit-transition: 0.3s ease;
  transition: 0.3s ease;
}
.p-searchform input[type=reset]:hover {
  background-color: #333;
}
@media only screen and (max-width: 1200px) {
  .p-searchform input[type=reset] {
    margin-left: 15rem;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@media screen and (max-width: 767px) {
  .p-searchform input[type=reset] {
    width: 12rem;
    margin: 0 auto;
    font-size: 1.4rem;
    height: 40px;
  }
}

/* ============================================
  インタビューリスト
============================================  */
.p-interviewList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 4rem;
  margin-top: 8rem;
}
@media screen and (max-width: 767px) {
  .p-interviewList {
    gap: 2rem;
    margin-top: 4rem;
  }
}
.p-interviewList ._item {
  width: calc(33.33% - 2.7rem);
  -webkit-box-shadow: 0 10px 50px rgba(0, 0, 0, 0.16);
          box-shadow: 0 10px 50px rgba(0, 0, 0, 0.16);
  position: relative;
  -webkit-transition: opacity 0.5s ease, -webkit-transform 0.5s ease;
  transition: opacity 0.5s ease, -webkit-transform 0.5s ease;
  transition: opacity 0.5s ease, transform 0.5s ease;
  transition: opacity 0.5s ease, transform 0.5s ease, -webkit-transform 0.5s ease;
}
@media only screen and (max-width: 1000px) {
  .p-interviewList ._item {
    width: calc(50% - 2rem);
  }
}
@media screen and (max-width: 767px) {
  .p-interviewList ._item {
    width: calc(50% - 1rem);
  }
}
.p-interviewList ._item a {
  text-decoration: none;
}
.p-interviewList ._item a::before {
  content: "";
  width: 3.6rem;
  height: 3.6rem;
  border-radius: 50%;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#0792D5), to(#033794));
  background-image: linear-gradient(#0792D5, #033794);
  position: absolute;
  right: 1rem;
  bottom: 1rem;
}
@media screen and (max-width: 767px) {
  .p-interviewList ._item a::before {
    width: 1.8rem;
    height: 1.8rem;
    right: 0.5rem;
    bottom: 0.5rem;
  }
}
.p-interviewList ._item a::after {
  content: "";
  position: absolute;
  right: 2.5rem;
  bottom: 1.8rem;
  -webkit-transform: translateY(-50%) rotate(45deg);
          transform: translateY(-50%) rotate(45deg);
  width: 1rem;
  height: 1rem;
  border-top: solid 2px #fff;
  border-right: solid 2px #fff;
}
@media screen and (max-width: 767px) {
  .p-interviewList ._item a::after {
    width: 0.5rem;
    height: 0.5rem;
    right: 1.25rem;
    bottom: 0.9rem;
    border-top: solid 1px #fff;
    border-right: solid 1px #fff;
  }
}
.p-interviewList ._item a:hover::after {
  -webkit-animation-name: fade-arrow;
          animation-name: fade-arrow;
  -webkit-animation-duration: 0.6s;
          animation-duration: 0.6s;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}
.p-interviewList ._item ._thumb {
  position: relative;
  width: 100%;
  padding-top: 109%;
  background-color: var(--color-primary);
  overflow: hidden;
}
.p-interviewList ._item ._thumb img {
  position: absolute;
  top: 0;
  left: 0;
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
  -webkit-transition: 0.3s ease;
  transition: 0.3s ease;
}
.p-interviewList ._item ._thumb ._copy {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  padding: 1rem 3rem;
  background-color: rgba(3, 55, 148, 0.7);
  color: #fff;
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.8;
}
@media screen and (max-width: 767px) {
  .p-interviewList ._item ._thumb ._copy {
    font-size: 1rem;
    padding: 0.5rem 1rem;
    line-height: 1.4;
  }
}
.p-interviewList ._item ._contents {
  padding: 2rem 3rem 6rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 1rem;
  -webkit-transition: 0.3s ease;
  transition: 0.3s ease;
}
@media screen and (max-width: 767px) {
  .p-interviewList ._item ._contents {
    padding: 1rem 1rem 3rem;
    gap: 0.5rem;
  }
}
.p-interviewList ._item ._contents ._name {
  font-size: 2rem;
  font-weight: 700;
  line-height: 1;
}
@media screen and (max-width: 767px) {
  .p-interviewList ._item ._contents ._name {
    font-size: 1.4rem;
  }
}
.p-interviewList ._item ._contents ._name span {
  font-size: 1.6rem;
  padding-left: 0.25em;
}
@media screen and (max-width: 767px) {
  .p-interviewList ._item ._contents ._name span {
    font-size: 1rem;
  }
}
.p-interviewList ._item ._contents ._type {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 1;
  border-radius: 0.5rem;
  background-color: #D8E3F1;
  padding: 0.5rem 1rem;
}
@media screen and (max-width: 767px) {
  .p-interviewList ._item ._contents ._type {
    font-size: 1rem;
  }
}
.p-interviewList ._item ._contents ._department {
  font-size: 1.6rem;
  font-weight: 500;
  line-height: 1.2;
}
@media screen and (max-width: 767px) {
  .p-interviewList ._item ._contents ._department {
    font-size: 1rem;
  }
}
.p-interviewList ._item ._contents ._join {
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 1.4;
}
@media screen and (max-width: 767px) {
  .p-interviewList ._item ._contents ._join {
    font-size: 1rem;
  }
}
.p-interviewList ._item:hover ._thumb img {
  opacity: 0.8;
  -webkit-transform: scale(1.1);
          transform: scale(1.1);
}
.p-interviewList ._item:hover ._contents {
  color: var(--color-primary);
}
.p-interviewList ._item.is-hidden {
  display: none;
}
.p-interviewList ._item.is-animating {
  -webkit-transition: none;
  transition: none;
}

/* ============================================
  インタビュー詳細
============================================  */
.interviewDetails ._shapes {
  position: relative;
}
.interviewDetails ._shapes ._line {
  width: 1px;
  height: 10000px;
  background-color: #D9D9D9;
  position: absolute;
  top: 0;
  z-index: -1;
}
.interviewDetails ._shapes ._line.--1 {
  left: calc(50% - 1745px);
  -webkit-transform: rotate(25deg);
          transform: rotate(25deg);
}
.interviewDetails ._shapes ._line.--2 {
  left: calc(50% - 1495px);
  -webkit-transform: rotate(25deg);
          transform: rotate(25deg);
}
.interviewDetails ._shapes ._line.--3 {
  left: calc(50% - 1245px);
  -webkit-transform: rotate(25deg);
          transform: rotate(25deg);
}
.interviewDetails ._shapes ._triangle {
  width: 283px;
  height: 245px;
  position: absolute;
  z-index: -1;
  clip-path: polygon(50% 0, 100% 100%, 0 100%);
  -webkit-transform: rotate(0) scale(0);
          transform: rotate(0) scale(0);
  -webkit-transition: -webkit-transform 0.5s;
  transition: -webkit-transform 0.5s;
  transition: transform 0.5s;
  transition: transform 0.5s, -webkit-transform 0.5s;
}
@media screen and (max-width: 767px) {
  .interviewDetails ._shapes ._triangle {
    width: 140px;
    height: 120px;
  }
}
.interviewDetails ._shapes ._triangle.--1 {
  top: 1250px;
  right: calc(var(--container-margin) - 200px);
  background-color: #E3E3E3;
}
@media screen and (max-width: 767px) {
  .interviewDetails ._shapes ._triangle.--1 {
    right: calc(var(--container-margin) - 80px);
  }
}
.interviewDetails ._shapes ._triangle.--1.is-active {
  -webkit-transform: rotate(55deg) scale(1);
          transform: rotate(55deg) scale(1);
}
.interviewDetails ._shapes ._triangle.--2 {
  top: 2356px;
  left: calc(var(--container-margin) - 140px);
  background-color: #D8E3F1;
}
@media screen and (max-width: 767px) {
  .interviewDetails ._shapes ._triangle.--2 {
    left: calc(var(--container-margin) - 56px);
  }
}
.interviewDetails ._shapes ._triangle.--2.is-active {
  -webkit-transform: rotate(115deg) scale(1);
          transform: rotate(115deg) scale(1);
}
.interviewDetails ._shapes ._rectangle {
  width: 2370px;
  height: 400px;
  position: absolute;
  z-index: -1;
  -webkit-transition: -webkit-transform 1s;
  transition: -webkit-transform 1s;
  transition: transform 1s;
  transition: transform 1s, -webkit-transform 1s;
}
@media screen and (max-width: 767px) {
  .interviewDetails ._shapes ._rectangle {
    height: 200px;
    -webkit-transition: -webkit-transform 2s;
    transition: -webkit-transform 2s;
    transition: transform 2s;
    transition: transform 2s, -webkit-transform 2s;
  }
}
.interviewDetails ._shapes ._rectangle.--1 {
  top: 1880px;
  left: 50%;
  background-color: #ECF3FC;
  -webkit-transform: rotate(25deg) translateX(-50%) scaleX(0);
          transform: rotate(25deg) translateX(-50%) scaleX(0);
  -webkit-transform-origin: left center;
          transform-origin: left center;
}
.interviewDetails ._shapes ._rectangle.--1.is-active {
  -webkit-transform: rotate(25deg) translateX(-50%) scaleX(1);
          transform: rotate(25deg) translateX(-50%) scaleX(1);
}
.interviewDetails ._shapes ._rectangle.--2 {
  top: 3345px;
  right: 50%;
  background-color: #F5F5F5;
  -webkit-transform: rotate(335deg) translateX(50%) scaleX(0);
          transform: rotate(335deg) translateX(50%) scaleX(0);
  -webkit-transform-origin: right center;
          transform-origin: right center;
}
.interviewDetails ._shapes ._rectangle.--2.is-active {
  -webkit-transform: rotate(335deg) translateX(50%) scaleX(1);
          transform: rotate(335deg) translateX(50%) scaleX(1);
}
.interviewDetails .l-subvisual .l-inner {
  height: auto !important;
  padding-bottom: 10rem;
}
@media screen and (max-width: 767px) {
  .interviewDetails .l-subvisual .l-inner {
    padding-bottom: 2rem;
  }
}
.interviewDetails .l-subvisual ._img {
  width: calc(100% - 5px + var(--container-margin));
}
@media screen and (max-width: 767px) {
  .interviewDetails .l-subvisual ._img {
    width: calc(100% - 3px + var(--container-margin));
  }
}
.interviewDetails .l-subvisual ._img::after {
  right: calc(100vw - var(--container-margin) - 382px);
}
@media screen and (max-width: 767px) {
  .interviewDetails .l-subvisual ._img::after {
    right: calc(100vw - var(--container-margin) - 380px);
  }
}
.interviewDetails .l-subvisual ._interviewArea {
  padding-top: 18rem;
  position: relative;
  z-index: 5;
  -webkit-transform: translateX(calc(-1 * var(--container-margin)));
          transform: translateX(calc(-1 * var(--container-margin)));
  max-width: 46vw;
}
@media screen and (max-width: 767px) {
  .interviewDetails .l-subvisual ._interviewArea {
    padding-top: 9rem;
  }
}
.interviewDetails .l-subvisual ._interviewArea ._maincopy ._clone {
  color: var(--color-primary);
  font-size: 4rem;
  font-weight: 700;
  background-color: #fff;
  line-height: 2.2;
  padding: 1rem 2rem 1rem 6rem;
  -webkit-box-decoration-break: clone;
          box-decoration-break: clone;
  display: inline;
}
@media only screen and (max-width: 1000px) {
  .interviewDetails .l-subvisual ._interviewArea ._maincopy ._clone {
    font-size: 3rem;
    padding: 0.75rem 2rem 0.75rem 6rem;
  }
}
@media screen and (max-width: 767px) {
  .interviewDetails .l-subvisual ._interviewArea ._maincopy ._clone {
    font-size: 1.6rem;
    padding: 0.5rem 1rem 0.5rem 2rem;
    line-height: 2.4;
  }
}
@media only screen and (max-width: 375px) {
  .interviewDetails .l-subvisual ._interviewArea ._maincopy ._clone {
    font-size: 1.4rem;
  }
}
@media only screen and (max-width: 300px) {
  .interviewDetails .l-subvisual ._interviewArea ._maincopy ._clone {
    font-size: 1.2rem;
  }
}
.interviewDetails .l-subvisual ._interviewArea ._profile {
  padding: 3rem 4rem;
  color: #fff;
  background-color: var(--color-primary);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 2rem;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  min-width: 41rem;
  margin-left: 6rem;
  margin-top: 2rem;
}
@media screen and (max-width: 767px) {
  .interviewDetails .l-subvisual ._interviewArea ._profile {
    padding: 1.5rem;
    gap: 0.5rem;
    margin-left: 2rem;
    min-width: 24rem;
    max-width: 24rem;
  }
}
.interviewDetails .l-subvisual ._interviewArea ._profile ._name {
  font-size: 3rem;
  font-weight: 700;
  line-height: 1;
}
@media screen and (max-width: 767px) {
  .interviewDetails .l-subvisual ._interviewArea ._profile ._name {
    font-size: 1.4rem;
  }
}
.interviewDetails .l-subvisual ._interviewArea ._profile ._name span {
  font-size: 1.6rem;
  padding-left: 0.25em;
}
@media screen and (max-width: 767px) {
  .interviewDetails .l-subvisual ._interviewArea ._profile ._name span {
    font-size: 1rem;
  }
}
.interviewDetails .l-subvisual ._interviewArea ._profile ._type {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  color: var(--color-primary);
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 1;
  border-radius: 0.5rem;
  background-color: #D8E3F1;
  padding: 1rem;
}
@media screen and (max-width: 767px) {
  .interviewDetails .l-subvisual ._interviewArea ._profile ._type {
    font-size: 1rem;
    padding: 0.5rem 1rem;
  }
}
.interviewDetails .l-subvisual ._interviewArea ._profile ._department {
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.2;
}
@media screen and (max-width: 767px) {
  .interviewDetails .l-subvisual ._interviewArea ._profile ._department {
    font-size: 1rem;
  }
}
.interviewDetails .l-subvisual ._interviewArea ._profile ._join {
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 1.2;
}
@media screen and (max-width: 767px) {
  .interviewDetails .l-subvisual ._interviewArea ._profile ._join {
    font-size: 1rem;
  }
}

.p-interviewDetails ._title {
  margin-bottom: 3rem;
}
@media screen and (max-width: 767px) {
  .p-interviewDetails ._title {
    margin-bottom: 2rem;
  }
}
.p-interviewDetails ._title ._no {
  font-family: "Noto Serif JP", serif;
  color: var(--color-primary);
  font-size: 3rem;
  line-height: 1;
  font-weight: 700;
  text-transform: uppercase;
  margin-bottom: 1rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5em;
}
@media screen and (max-width: 767px) {
  .p-interviewDetails ._title ._no {
    font-size: 2rem;
  }
}
.p-interviewDetails ._title ._no span {
  font-size: 6rem;
  font-weight: 700;
  line-height: 1;
  -webkit-transform: translateY(-0.05em);
          transform: translateY(-0.05em);
}
@media screen and (max-width: 767px) {
  .p-interviewDetails ._title ._no span {
    font-size: 4rem;
  }
}
.p-interviewDetails ._title ._copy {
  font-family: "Noto Serif JP", serif;
  font-size: 4rem;
  font-weight: 600;
  line-height: 1.5;
}
@media screen and (max-width: 767px) {
  .p-interviewDetails ._title ._copy {
    font-size: 2.4rem;
  }
}
.p-interviewDetails ._title_q {
  color: var(--color-primary);
  font-family: "Noto Serif JP", serif;
  font-size: 3rem;
  font-weight: 700;
  line-height: 1.5;
  margin-top: 3rem;
  margin-bottom: 1.5rem;
}
@media screen and (max-width: 767px) {
  .p-interviewDetails ._title_q {
    font-size: 2rem;
  }
}
.p-interviewDetails ._title_q span {
  padding-right: 0.5em;
}
.p-interviewDetails ._text {
  font-size: 1.8rem;
  line-height: 1.8;
}
@media screen and (max-width: 767px) {
  .p-interviewDetails ._text {
    font-size: 1.6rem;
  }
}
.p-interviewDetails ._colSection {
  max-width: 1300px;
  width: 88%;
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  .p-interviewDetails ._colSection {
    width: 88%;
  }
}
.p-interviewDetails ._colSection {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 8rem;
  margin-bottom: 8rem;
}
@media only screen and (max-width: 1100px) {
  .p-interviewDetails ._colSection {
    gap: 6rem;
    margin-bottom: 6rem;
  }
}
@media screen and (max-width: 767px) {
  .p-interviewDetails ._colSection {
    gap: 4rem;
    margin-bottom: 4rem;
  }
}
.p-interviewDetails ._colSection ._article {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 4rem 8rem;
}
@media only screen and (max-width: 1100px) {
  .p-interviewDetails ._colSection ._article {
    gap: 4rem;
  }
}
@media screen and (max-width: 767px) {
  .p-interviewDetails ._colSection ._article {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
.p-interviewDetails ._colSection ._article:nth-child(even) {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
}
@media screen and (max-width: 767px) {
  .p-interviewDetails ._colSection ._article:nth-child(even) {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
.p-interviewDetails ._colSection ._article ._contents {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
.p-interviewDetails ._colSection ._article ._img {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
.p-interviewDetails ._boxSection {
  max-width: 1300px;
  width: 88%;
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  .p-interviewDetails ._boxSection {
    width: 88%;
  }
}
.p-interviewDetails ._boxSection {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 8rem;
  margin-bottom: 8rem;
}
@media only screen and (max-width: 1100px) {
  .p-interviewDetails ._boxSection {
    gap: 6rem;
    margin-bottom: 6rem;
  }
}
@media screen and (max-width: 767px) {
  .p-interviewDetails ._boxSection {
    gap: 4rem;
    margin-bottom: 4rem;
  }
}
.p-interviewDetails ._boxSection ._article {
  width: calc(50% - 4rem);
  padding: 3rem;
  border: solid 1px var(--color-primary);
  background-color: #fff;
}
@media only screen and (max-width: 900px) {
  .p-interviewDetails ._boxSection ._article {
    width: 100%;
    padding: 2rem;
  }
}
.p-interviewDetails ._boxSection ._article.--one-column {
  width: 100%;
}
.p-interviewDetails ._endSection {
  max-width: 1300px;
  width: 88%;
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  .p-interviewDetails ._endSection {
    width: 88%;
  }
}
.p-interviewDetails ._endSection {
  position: relative;
}
.p-interviewDetails ._endSection ._img img {
  width: 100%;
}
.p-interviewDetails ._endSection ._material-group {
  position: absolute;
  top: -120px;
  left: 50%;
  margin-left: 80px;
  z-index: -1;
}
@media screen and (max-width: 767px) {
  .p-interviewDetails ._endSection ._material-group {
    top: -60px;
    margin-left: -100px;
  }
}
.p-interviewDetails ._endSection ._material-group ._material {
  width: 626px;
  height: 808px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  overflow: hidden;
  position: absolute;
  clip-path: polygon(0 0, 248px 0, 100% 100%, calc(100% - 248px) 100%);
}
@media screen and (max-width: 767px) {
  .p-interviewDetails ._endSection ._material-group ._material {
    width: 313px;
    height: 404px;
    clip-path: polygon(0 0, 124px 0, 100% 100%, calc(100% - 124px) 100%);
  }
}
.p-interviewDetails ._endSection ._material-group ._material.--1 {
  top: 0;
  left: 0;
  background-color: #E3E3E3;
}
.p-interviewDetails ._endSection ._material-group ._material.--2 {
  top: 80px;
  left: 295px;
  background-color: #D8E3F1;
}
@media screen and (max-width: 767px) {
  .p-interviewDetails ._endSection ._material-group ._material.--2 {
    top: 40px;
    left: 148px;
  }
}
.p-interviewDetails ._btnArea {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: 100px auto 0;
}
@media screen and (max-width: 767px) {
  .p-interviewDetails ._btnArea {
    margin-top: 50px;
  }
}

/* ============================================
  データで見る
============================================  */
.p-data {
  margin-bottom: 8rem;
}
@media screen and (max-width: 767px) {
  .p-data {
    margin-bottom: 4rem;
  }
}
.p-data:last-child {
  margin-bottom: 0;
}
.p-data ._list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 40px;
}
@media screen and (max-width: 767px) {
  .p-data ._list {
    gap: 20px;
  }
}
.p-data ._list ._item {
  width: calc(33.33% - 27px);
  background-color: #E3E3E3;
  padding: 3rem 1rem 4rem;
  position: relative;
  overflow: hidden;
}
@media only screen and (max-width: 1200px) {
  .p-data ._list ._item {
    padding: 3rem 1rem 3rem;
  }
}
@media only screen and (max-width: 1000px) {
  .p-data ._list ._item {
    width: calc(50% - 20px);
    padding: 3rem 1rem 3rem;
  }
}
@media screen and (max-width: 767px) {
  .p-data ._list ._item {
    width: 100%;
    padding: 2rem 2rem 3rem;
  }
}
.p-data ._list ._item::before {
  content: "";
  display: block;
  width: 1000px;
  height: 1000px;
  background-color: #BCD3F0;
  -webkit-transform: rotate(25deg);
          transform: rotate(25deg);
  position: absolute;
  top: 100%;
  right: -800px;
  z-index: 0;
  -webkit-transition: 0.5s;
  transition: 0.5s;
}
@media screen and (max-width: 767px) {
  .p-data ._list ._item::before {
    left: 50%;
    -webkit-transform: rotate(25deg) translateX(-10%);
            transform: rotate(25deg) translateX(-10%);
  }
}
.p-data ._list ._item ._title {
  font-size: 3rem;
  font-weight: var(--font-weight-bold);
  text-align: center;
  margin-bottom: 1em;
  position: relative;
  z-index: 1;
}
@media only screen and (max-width: 1200px) {
  .p-data ._list ._item ._title {
    font-size: 2.4rem;
  }
}
@media screen and (max-width: 767px) {
  .p-data ._list ._item ._title {
    font-size: 2rem;
  }
}
.p-data ._list ._item ._contents {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 1.5rem;
  position: relative;
  z-index: 1;
}
@media screen and (max-width: 767px) {
  .p-data ._list ._item ._contents {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    gap: 0;
  }
}
.p-data ._list ._item ._contents ._icon {
  height: 13rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
@media only screen and (max-width: 1200px) {
  .p-data ._list ._item ._contents ._icon {
    height: 11rem;
  }
}
@media screen and (max-width: 767px) {
  .p-data ._list ._item ._contents ._icon {
    height: 7rem;
    width: 40%;
    -ms-flex-negative: 0;
        flex-shrink: 0;
  }
}
.p-data ._list ._item ._contents ._icon img {
  height: 100%;
}
.p-data ._list ._item ._contents ._number {
  color: var(--color-secondary);
  font-size: 8rem;
  font-weight: var(--font-weight-bold);
  line-height: 1.2;
  text-align: center;
}
@media only screen and (max-width: 1200px) {
  .p-data ._list ._item ._contents ._number {
    font-size: 7rem;
  }
}
@media screen and (max-width: 767px) {
  .p-data ._list ._item ._contents ._number {
    font-size: 5rem;
  }
}
.p-data ._list ._item ._contents ._number ._count {
  display: inline-block;
  -webkit-transform: translateY(0.05em);
          transform: translateY(0.05em);
  text-shadow: 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff;
}
.p-data ._list ._item ._contents ._number ._small {
  color: var(--color-base);
  font-size: 3rem;
  font-weight: var(--font-weight-medium);
}
@media only screen and (max-width: 1200px) {
  .p-data ._list ._item ._contents ._number ._small {
    font-size: 2rem;
  }
}
@media screen and (max-width: 767px) {
  .p-data ._list ._item ._contents ._number ._small {
    font-size: 1.5rem;
  }
}
.p-data ._list ._item ._contents ._number ._number-note {
  color: var(--color-base);
  font-size: 2rem;
  font-weight: 500;
  line-height: 1.5;
  text-align: left;
  margin-top: 0.25em;
}
@media only screen and (max-width: 1200px) {
  .p-data ._list ._item ._contents ._number ._number-note {
    font-size: 1.6rem;
  }
}
@media screen and (max-width: 767px) {
  .p-data ._list ._item ._contents ._number ._number-note {
    font-size: 1.2rem;
  }
}
.p-data ._list ._item ._contents ._doughnut {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
}
.p-data ._list ._item ._contents ._doughnut canvas {
  width: 250px;
  height: 250px;
}
@media only screen and (max-width: 1200px) {
  .p-data ._list ._item ._contents ._doughnut canvas {
    -webkit-transform: scale(0.8);
            transform: scale(0.8);
  }
}
.p-data ._list ._item ._contents ._doughnut.--sex-ratio {
  position: relative;
}
.p-data ._list ._item ._contents ._doughnut.--sex-ratio::before, .p-data ._list ._item ._contents ._doughnut.--sex-ratio::after {
  content: "";
  display: block;
  width: 78px;
  height: 92px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  position: absolute;
  z-index: 1;
  opacity: 0;
  -webkit-transition: 0.5s;
  transition: 0.5s;
  -webkit-transition-delay: 1s;
          transition-delay: 1s;
}
@media only screen and (max-width: 1200px) {
  .p-data ._list ._item ._contents ._doughnut.--sex-ratio::before, .p-data ._list ._item ._contents ._doughnut.--sex-ratio::after {
    -webkit-transform: scale(0.8);
            transform: scale(0.8);
  }
}
.p-data ._list ._item ._contents ._doughnut.--sex-ratio::before {
  background-image: url(../../about/data/img/icon_ratio-man.svg);
  right: -20px;
  bottom: -30px;
}
@media only screen and (max-width: 1200px) {
  .p-data ._list ._item ._contents ._doughnut.--sex-ratio::before {
    right: 0;
    bottom: -10px;
  }
}
.p-data ._list ._item ._contents ._doughnut.--sex-ratio::after {
  background-image: url(../../about/data/img/icon_ratio-woman.svg);
  left: -20px;
  top: -20px;
}
@media only screen and (max-width: 1200px) {
  .p-data ._list ._item ._contents ._doughnut.--sex-ratio::after {
    left: 0;
    top: 0;
  }
}
.p-data ._list ._item ._contents ._doughnut.--sex-ratio.is-active::before, .p-data ._list ._item ._contents ._doughnut.--sex-ratio.is-active::after {
  opacity: 1;
}
.p-data ._list ._item ._contents ._ageBar {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  .p-data ._list ._item ._contents ._ageBar {
    margin: 0;
  }
}
@media only screen and (max-width: 1200px) {
  .p-data ._list ._item ._contents ._ageBar canvas {
    -webkit-transform: scale(0.8);
            transform: scale(0.8);
  }
}
@media only screen and (max-width: 1000px) {
  .p-data ._list ._item ._contents ._ageBar canvas {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
@media screen and (max-width: 767px) {
  .p-data ._list ._item ._contents ._ageBar canvas {
    -webkit-transform: scale(0.8);
            transform: scale(0.8);
  }
}
.p-data ._list ._item.--col2 {
  width: calc(67.33% - 22px);
}
@media only screen and (max-width: 1000px) {
  .p-data ._list ._item.--col2 {
    width: 100%;
  }
}
.p-data ._list ._item.--col2::before {
  left: 50%;
  -webkit-transform: rotate(25deg) translateX(-10%);
          transform: rotate(25deg) translateX(-10%);
}
.p-data ._list ._item.--col2 ._contents {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  gap: 0;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
@media screen and (max-width: 767px) {
  .p-data ._list ._item.--col2 ._contents {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
}
.p-data ._list ._item.--col2 ._contents ._agenum {
  width: 40%;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
@media screen and (max-width: 767px) {
  .p-data ._list ._item.--col2 ._contents ._agenum {
    width: 100%;
    margin-top: 2rem;
  }
}
.p-data ._list ._item.--col2 ._contents ._agenum ._titleChild {
  font-size: 2.4rem;
  font-size: 700;
  text-align: center;
  margin-bottom: 0.5em;
}
@media screen and (max-width: 767px) {
  .p-data ._list ._item.--col2 ._contents ._agenum ._titleChild {
    font-size: 1.8rem;
  }
}
.p-data ._list.--two-column ._item {
  width: calc(50% - 20px);
}
@media screen and (max-width: 767px) {
  .p-data ._list.--two-column ._item {
    width: 100%;
  }
}
.p-data ._list.--two-column ._item::before {
  left: 50%;
  -webkit-transform: rotate(25deg) translateX(-10%);
          transform: rotate(25deg) translateX(-10%);
}
.p-data ._list.--two-column ._item ._contents {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  gap: 0;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: calc(100% - 70px);
}
@media screen and (max-width: 767px) {
  .p-data ._list.--two-column ._item ._contents {
    height: auto;
  }
}
.p-data ._list.--two-column ._item ._contents ._icon {
  width: 40%;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
.p-data ._list.--two-column ._item ._contents:not(:has(._icon)) ._number {
  width: 100%;
}
.p-data.is-active ._list ._item::before {
  top: -50px;
}
.p-data ._note {
  font-size: 1.8rem;
  line-height: 1.6;
  text-indent: -1em;
  padding-left: 1em;
  margin-top: 5rem;
}
@media screen and (max-width: 767px) {
  .p-data ._note {
    font-size: 1.4rem;
    margin-top: 2.5rem;
  }
}

/* ============================================
  福利厚生／社内制度
============================================  */
.p-welfareList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 4rem;
}
@media screen and (max-width: 767px) {
  .p-welfareList {
    gap: 2rem;
  }
}
.p-welfareList ._item {
  width: calc(33.33% - 27px);
  padding: 3rem;
  background-color: #EFF3FC;
  border: solid 1px var(--color-primary);
}
@media only screen and (max-width: 1000px) {
  .p-welfareList ._item {
    width: calc(50% - 20px);
  }
}
@media screen and (max-width: 767px) {
  .p-welfareList ._item {
    width: 100%;
    padding: 2rem;
  }
}
.p-welfareList ._item ._icon {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 7rem;
  margin: 0 auto 3rem;
}
@media screen and (max-width: 767px) {
  .p-welfareList ._item ._icon {
    height: 5rem;
    margin-bottom: 2rem;
  }
}
.p-welfareList ._item ._icon img {
  max-height: 100%;
}
.p-welfareList ._item ._title {
  color: var(--color-primary);
  font-size: 2.4rem;
  text-align: center;
  line-height: 1.4;
  margin-bottom: 1rem;
}
@media screen and (max-width: 767px) {
  .p-welfareList ._item ._title {
    font-size: 1.8rem;
    margin-bottom: 0.5rem;
  }
}
.p-welfareList ._item ._title .u-small {
  font-size: max(0.8em, 1.4rem);
}

/* ============================================
  募集要項
============================================  */
.recruit-list_title {
  font-family: "Noto Serif JP", serif;
  font-size: 4rem;
  font-weight: 600;
  line-height: 1.5;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: left;
      -ms-flex-pack: left;
          justify-content: left;
  gap: 0.5em;
  margin-bottom: 1em;
}
.recruit-list_title::before, .recruit-list_title::after {
  content: "";
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  height: 2px;
  background-color: var(--color-primary);
}

.hs .recruit-list_title::before, .hs .recruit-list_title::after {
  background-color: #00A9E0;
}

@media only screen and (max-width: 767px) {
  .recruit-list_title {
    font-size: 2rem;
  }
}
.recruit-list {
  width: 100%;
  border-top: 1px solid #fff;
}

.recruit-item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 4px;
  border-bottom: 1px solid #fff;
}

.recruit-item:first-child dd {
  border-top: 1px solid #ccc;
}

.recruit-item dt {
  width: 230px;
  font-weight: bold;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  background: var(--color-primary);
  color: #fff;
  padding: 20px;
  font-size: 1.8rem;
  line-height: 1.8;
  font-weight: bold;
}

.hs .recruit-item dt {
  background: #00A9E0;
}

.recruit-item dd {
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  padding: 20px;
  font-size: 1.8rem;
  line-height: 1.8;
  border-bottom: 1px solid #ccc;
}

.recruit-item p {
  margin: 0 0 8px;
  line-height: 1.6;
}

.recruit-item p:last-child {
  margin-bottom: 0;
}

.flex-row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 8px;
  line-height: 1.6;
}

.flex-row:last-child {
  margin-bottom: 0;
}

.flex-row .label {
  width: 190px;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  background: #f1f1f1;
  padding: 8px 0px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.flex-row .label-long {
  width: 380px;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  background: #f1f1f1;
  padding: 8px 0px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.flex-row .text {
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  padding: 8px 12px;
}

.link-text {
  color: var(--color-primary);
  text-decoration: underline !important;
  display: inline-block;
}

.link-text:hover {
  text-decoration: none !important;
}

.title-line {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 10px;
  font-size: 2rem;
  font-weight: bold;
  margin-bottom: 10px !important;
}

.title-line::before {
  content: "";
  display: block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #666;
  -ms-flex-negative: 1;
      flex-shrink: 1;
}

@media (max-width: 768px) {
  .recruit-item dt {
    font-size: 1.4rem;
    width: 150px;
  }
  .recruit-item dd {
    font-size: 1.4rem;
  }
  .flex-row {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .flex-row + .flex-row {
    margin-top: 20px;
  }
  .flex-row .label, .flex-row .label-long {
    width: 100%;
  }
  .title-line {
    font-size: 1.6rem;
  }
}
@media (max-width: 480px) {
  .recruit-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 30px;
  }
  .recruit-item {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .recruit-item dt {
    width: 100%;
    padding: 15px;
  }
  .recruit-item:first-child dd {
    border: 0;
  }
  .recruit-item:first-child dd {
    padding: 20px 0;
  }
  .recruit-item dd {
    padding: 20px 0;
    border-bottom: 0;
  }
}
.selection-flow {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 50px;
  margin: 0 auto;
}

.flow-step {
  width: 23%;
  position: relative;
  border: 2px solid var(--color-primary);
  padding: 45px 20px 45px;
  background-color: #EFF3FC;
  text-align: center;
}

.flow-step .step-label {
  display: block;
  color: var(--color-primary);
  font-size: 4rem;
  font-family: "Noto Serif JP", serif;
  font-weight: bold;
  margin-bottom: 20px !important;
}

.flow-step .step-title {
  font-size: 2.2rem;
  font-weight: bold;
  margin: 0 0 20px;
  line-height: 1.4;
}

.flow-step .step-svg-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 80px;
  height: 80px;
  margin: 0 auto 20px;
}

.flow-step .step-svg-area img {
  width: 80px;
  height: 80px;
}

.flow-step .svg_step2 img {
  height: 66px;
}

.flow-step .step-desc {
  font-size: 1.8rem;
  line-height: 1.4;
  text-align: left;
  margin: 0;
}

.flow-step:not(:last-child)::after {
  content: "";
  position: absolute;
  right: -40px;
  top: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 14px 12px 0 12px;
  border-color: var(--color-primary) transparent transparent transparent;
  -webkit-transform: rotate(-90deg);
          transform: rotate(-90deg);
}

@media (max-width: 1200px) {
  .flow-step .step-label {
    font-size: 3rem;
  }
  .flow-step .step-title {
    font-size: 1.8rem;
  }
  .flow-step .step-desc {
    font-size: 1.6rem;
  }
}
@media (max-width: 1000px) {
  .selection-flow {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .flow-step {
    width: 100%;
    padding: 30px 20px;
  }
  .flow-step:not(:last-child)::after {
    content: "";
    position: absolute;
    right: 0px;
    left: 0;
    margin: auto;
    top: auto;
    bottom: -36px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 14px 12px 0 12px;
    border-color: var(--color-primary) transparent transparent transparent;
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  .flow-step .step-title {
    font-size: 1.6rem;
  }
  .flow-step .step-desc {
    font-size: 1.4rem;
  }
}
@media (min-width: 768px) {
  .sp-only {
    display: none;
  }
}
.flow_entrybtn {
  display: block;
  height: 7rem;
  width: 50rem;
  padding: 1rem 6rem 1rem 2.5rem;
  margin: 60px auto 0;
  color: #fff;
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.6;
  text-decoration: none;
  background-color: var(--color-secondary);
  border-radius: 9999px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}

@media only screen and (max-width: 767px) {
  .flow_entrybtn {
    font-size: 1.6rem;
    height: 4rem;
    width: 28rem;
    padding: 1rem 5rem 1rem 2.5rem;
    margin-top: 4rem;
  }
}
.flow_entrybtn:hover {
  -webkit-box-shadow: 0 0 0 10px rgba(0, 0, 0, 0.16);
          box-shadow: 0 0 0 10px rgba(0, 0, 0, 0.16);
}

.flow_entrybtn:hover::after {
  -webkit-animation-name: fade-arrow;
          animation-name: fade-arrow;
  -webkit-animation-duration: 0.6s;
          animation-duration: 0.6s;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}

.flow_entrybtn::before {
  content: "";
  position: absolute;
  right: 3rem;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  width: 3.6rem;
  height: 3.6rem;
  border-radius: 50%;
  border: solid 2px #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

@media only screen and (max-width: 767px) {
  .flow_entrybtn::before {
    right: 1.5rem;
    width: 2.4rem;
    height: 2.4rem;
  }
}
.flow_entrybtn::after {
  content: "";
  position: absolute;
  right: 4.5rem;
  top: 50%;
  -webkit-transform: translateY(-50%) rotate(45deg);
          transform: translateY(-50%) rotate(45deg);
  width: 1rem;
  height: 1rem;
  border-top: solid 2px #fff;
  border-right: solid 2px #fff;
}

@media only screen and (max-width: 767px) {
  .flow_entrybtn::after {
    right: 2.5rem;
    width: 0.6rem;
    height: 0.6rem;
  }
}
.recruit-contact {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 20px 40px;
}
@media only screen and (max-width: 1000px) {
  .recruit-contact {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
.recruit-contact ._item {
  color: #fff;
  width: calc(50% - 20px);
  text-align: center;
  background-color: var(--color-primary);
  padding: 59px 1.6rem 45px;
  position: relative;
  border-radius: 30px;
}
@media only screen and (max-width: 1000px) {
  .recruit-contact ._item {
    width: 100%;
    padding: 40px 20px;
  }
}
.recruit-contact ._item::before {
  content: "";
  display: block;
  position: absolute;
  top: 0px;
  left: 50%;
  width: 206px;
  height: 5px;
  background: var(--color-secondary);
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  border-radius: 0 0 5px 5px;
}
@media screen and (max-width: 767px) {
  .recruit-contact ._item::before {
    width: 150px;
  }
}
.recruit-contact ._item ._title {
  font-size: 2.8rem;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.08em;
  margin-bottom: 21px;
}
@media screen and (max-width: 767px) {
  .recruit-contact ._item ._title {
    font-size: 2rem;
  }
}
.recruit-contact ._item ._title span {
  display: block;
  font-size: 2.4rem;
}
@media screen and (max-width: 767px) {
  .recruit-contact ._item ._title span {
    font-size: 1.8rem;
  }
}
.recruit-contact ._item ._address {
  font-size: 1.6rem;
  line-height: 2;
  letter-spacing: 0.08em;
}
@media screen and (max-width: 767px) {
  .recruit-contact ._item ._address {
    font-size: 1.4rem;
  }
}

.hs .recruit-contact ._item {
  background-color: #00A9E0;
}

.recruit-contact_text {
  font-size: 2rem;
  font-weight: 700;
  line-height: 2.25;
  color: #00A9E0;
  margin-top: 40px;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .recruit-contact_text {
    font-size: 1.6rem;
    margin-top: 20px;
  }
}
.recruit-contact_text ._inner {
  border-bottom: dotted 4px #00A9E0;
  padding-bottom: 0.3em;
}
@media screen and (max-width: 767px) {
  .recruit-contact_text ._inner {
    padding-bottom: 0.2em;
  }
}

.recruit-contact_note {
  padding-top: 13px;
  font-size: 1.4rem;
  line-height: 2;
  letter-spacing: 0.08em;
  padding-left: 1em;
  text-indent: -1em;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
@media screen and (max-width: 767px) {
  .recruit-contact_note {
    font-size: 1.2rem;
  }
}
.recruit-contact_note ._inner {
  text-align: left;
}
@media screen and (max-width: 767px) {
  .recruit-contact_note ._inner {
    text-align: center;
  }
}

/* ============================================
  よくある質問
============================================  */
.anchor-link-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 20px;
  list-style: none;
  padding: 0;
  margin: 0 0 40px;
}

.anchor-link-list li {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  max-width: 240px;
}

.anchor-link-list a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 100%;
  padding: 16px 20px;
  background-color: var(--color-primary);
  border: 2px solid var(--color-primary);
  color: #fff;
  font-size: 1.6rem;
  text-decoration: none;
  font-weight: bold;
  text-align: center;
  -webkit-transition: background-color 0.3s ease, opacity 0.3s ease;
  transition: background-color 0.3s ease, opacity 0.3s ease;
  position: relative;
}

.anchor-link-list a::before {
  content: "";
  position: absolute;
  right: 20px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 2.6rem;
  height: 2.6rem;
  border-radius: 50%;
  border: 2px solid #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}

.anchor-link-list a::after {
  content: "";
  position: absolute;
  right: 29px;
  top: 48%;
  -webkit-transform: translateY(-50%) rotate(135deg);
  transform: translateY(-50%) rotate(135deg);
  width: 0.8rem;
  height: 0.8rem;
  border-top: solid 2px #fff;
  border-right: solid 2px #fff;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}

.anchor-link-list a:hover {
  background-color: #fff;
  color: var(--color-primary);
  opacity: 0.8;
}

.anchor-link-list a:hover::before, .anchor-link-list a:hover::after {
  border-color: var(--color-primary);
}

.anchor-link-list a:hover::after {
  -webkit-animation-name: fade-arrow;
  animation-name: fade-arrow;
  -webkit-animation-duration: 0.6s;
  animation-duration: 0.6s;
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  top: 41%;
}

@-webkit-keyframes fade-arrow {
  0% {
    -webkit-transform: translateX(0%) translateY(0) rotate(135deg);
    transform: translateX(0%) translateY(0) rotate(135deg);
    opacity: 1;
  }
  50% {
    -webkit-transform: translateX(0%) translateY(100%) rotate(135deg);
    transform: translateX(0%) translateY(100%) rotate(135deg);
    opacity: 0;
  }
  51% {
    -webkit-transform: translateX(0%) translateY(-100%) rotate(135deg);
    transform: translateX(0%) translateY(-100%) rotate(135deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0%) translateY(0) rotate(135deg);
    transform: translateX(0%) translateY(0) rotate(135deg);
    opacity: 1;
  }
}
@keyframes fade-arrow {
  0% {
    -webkit-transform: translateX(0%) translateY(0) rotate(135deg);
    transform: translateX(0%) translateY(0) rotate(135deg);
    opacity: 1;
  }
  50% {
    -webkit-transform: translateX(0%) translateY(100%) rotate(135deg);
    transform: translateX(0%) translateY(100%) rotate(135deg);
    opacity: 0;
  }
  51% {
    -webkit-transform: translateX(0%) translateY(-100%) rotate(135deg);
    transform: translateX(0%) translateY(-100%) rotate(135deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0%) translateY(0) rotate(135deg);
    transform: translateX(0%) translateY(0) rotate(135deg);
    opacity: 1;
  }
}
@media (max-width: 768px) {
  .anchor-link-list {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: 15px;
  }
  .anchor-link-list li {
    width: 100%;
    max-width: 320px;
  }
}
.qa_item {
  border: 1px solid var(--color-primary);
  background: #fff;
  margin-bottom: 20px;
  overflow: hidden;
}
.qa_item:last-child {
  margin-bottom: 0;
}

.qa_q {
  position: relative;
  cursor: pointer;
  padding: 25px 60px 25px 30px;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  font-size: 2.2rem;
  line-height: 1.8;
  font-weight: bold;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 23px;
}

.qa_q::before,
.qa_a_inner::before {
  content: "Q";
  display: grid;
  place-items: center;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  width: 44px;
  height: 44px;
  padding-bottom: 5px;
  border-radius: 4px;
  font-size: 2.4rem;
  font-weight: bold;
  color: #fff;
  background: var(--color-primary);
}

.qa_a_inner::before {
  position: absolute;
  left: 0;
  content: "A";
  background: #111;
}

.qa_q::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 30px;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  width: 20px;
  height: 20px;
  -webkit-transition: -webkit-transform 0.3s ease;
  transition: -webkit-transform 0.3s ease;
  transition: transform 0.3s ease;
  transition: transform 0.3s ease, -webkit-transform 0.3s ease;
  background: -webkit-gradient(linear, left top, left bottom, from(var(--color-primary)), to(var(--color-primary))) no-repeat center/100% 2px, -webkit-gradient(linear, left top, left bottom, from(var(--color-primary)), to(var(--color-primary))) no-repeat center/2px 100%;
  background: linear-gradient(var(--color-primary), var(--color-primary)) no-repeat center/100% 2px, linear-gradient(var(--color-primary), var(--color-primary)) no-repeat center/2px 100%;
}

.qa_item.open .qa_q::after {
  -webkit-transform: translateY(-50%) rotate(-180deg);
          transform: translateY(-50%) rotate(-180deg);
  background-size: 100% 2px, 0% 100%;
}

.qa_a {
  display: grid;
  grid-template-rows: 0fr;
  -webkit-transition: grid-template-rows 0.3s ease-out;
  transition: grid-template-rows 0.3s ease-out;
  transition: grid-template-rows 0.3s ease-out, -ms-grid-rows 0.3s ease-out;
}

.qa_item.open .qa_a {
  grid-template-rows: 1fr;
}

.qa_a_inner {
  overflow: hidden;
  min-height: 0;
  color: #111;
  padding: 0 0 0 65px;
  margin: 0 30px;
  position: relative;
  text-align: center;
  -webkit-transition: padding 0.3s, margin 0.3s, border 0.3s;
  transition: padding 0.3s, margin 0.3s, border 0.3s;
  border-top: 1px solid transparent;
}

.qa_item.open .qa_a_inner {
  padding: 25px 0px 32px 65px;
  border-top: 1px solid #CCCCCC;
}

.qanda_lead {
  color: var(--color-primary);
  font-size: 1.8rem;
  font-weight: bold;
  margin-bottom: 10px;
}

.qa_a_inner p {
  text-align: left;
  line-height: 1.6;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

.qa_a_inner p:last-child {
  margin-bottom: 0;
}

.qa_a_inner a {
  color: var(--color-primary);
  text-decoration: underline;
}

.qa_a_inner a:hover {
  text-decoration: none;
}

.bold_blue {
  color: var(--color-primary);
  font-weight: bold;
}

@media (max-width: 768px) {
  .qa_q {
    font-size: 1.8rem;
  }
  .qanda_lead {
    font-size: 1.6rem;
  }
  .qa_q::before,
  .qa_a_inner::before {
    width: 38px;
    height: 38px;
    padding-bottom: 4px;
    font-size: 2rem;
  }
  .qa_a_inner {
    padding-left: 55px;
  }
  .qa_item.open .qa_a_inner {
    padding: 25px 0px 32px 55px;
  }
}
/* ============================================
  事業について
============================================  */
.p-anchorList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 20px;
  margin-top: 40px;
}
@media screen and (max-width: 767px) {
  .p-anchorList {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    gap: 10px;
  }
}
.p-anchorList ._item {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  max-width: 166px;
  text-align: center;
  padding: 25px 10px 35px;
  background-color: #D8E3F1;
  font-size: 1.7rem;
  line-height: 1.5;
  text-decoration: none;
  font-weight: bold;
  -webkit-transition: 0.3s ease, opacity 0.3s ease;
  transition: 0.3s ease, opacity 0.3s ease;
  position: relative;
}
@media screen and (max-width: 767px) {
  .p-anchorList ._item {
    -webkit-box-flex: 0;
        -ms-flex: none;
            flex: none;
    width: calc(50% - 5px);
    font-size: 1.4rem;
    padding: 20px 10px 30px;
  }
}
.p-anchorList ._item::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 18px;
  -webkit-transform: translateX(-50%) rotate(135deg);
          transform: translateX(-50%) rotate(135deg);
  width: 1rem;
  height: 1rem;
  border-top: solid 2px var(--color-primary);
  border-right: solid 2px var(--color-primary);
  -webkit-transition: 0.3s ease;
  transition: 0.3s ease;
}
@media screen and (max-width: 767px) {
  .p-anchorList ._item::after {
    width: 0.75rem;
    height: 0.75rem;
  }
}
.p-anchorList ._item ._no {
  font-family: "Roboto";
  color: var(--color-primary);
  font-size: 3rem;
  font-weight: 500;
  line-height: 1;
  margin-bottom: 5px;
  -webkit-transition: 0.3s ease;
  transition: 0.3s ease;
}
@media screen and (max-width: 767px) {
  .p-anchorList ._item ._no {
    font-size: 2.4rem;
  }
}
.p-anchorList ._item:hover {
  background-color: var(--color-primary);
  color: #fff;
}
.p-anchorList ._item:hover::after {
  border-color: #fff;
  -webkit-transform: translateX(-50%) translateY(3px) rotate(135deg);
          transform: translateX(-50%) translateY(3px) rotate(135deg);
}
.p-anchorList ._item:hover ._no {
  color: #fff;
}

.p-about_h3Group {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-family: "Noto Serif JP";
  font-size: 4rem;
  font-weight: bold;
  gap: 1em;
  margin-bottom: 20px;
}
@media screen and (max-width: 767px) {
  .p-about_h3Group {
    font-size: 2rem;
  }
}
.p-about_h3Group ._no {
  color: var(--color-primary);
  font-size: 6rem;
}
@media screen and (max-width: 767px) {
  .p-about_h3Group ._no {
    font-size: 3rem;
  }
}
.p-about_h3Group h3 {
  line-height: 1.4;
}

.p-about_figure {
  margin-top: 40px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
@media screen and (max-width: 767px) {
  .p-about_figure {
    margin-top: 20px;
  }
}
.p-about_figure img {
  width: 100%;
  max-width: 1000px;
  height: auto;
}

.p-about_articlelList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 20px 40px;
  margin-top: 50px;
}
@media screen and (max-width: 767px) {
  .p-about_articlelList {
    margin-top: 20px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
.p-about_articlelList article {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  background-color: #D8E3F1;
  padding: 30px 30px 50px;
}
@media screen and (max-width: 767px) {
  .p-about_articlelList article {
    padding: 20px 20px 30px;
  }
}
.p-about_articlelList article h4 {
  font-size: 2rem;
  font-weight: bold;
  margin-bottom: 30px;
  position: relative;
}
@media screen and (max-width: 767px) {
  .p-about_articlelList article h4 {
    font-size: 1.8rem;
    margin-bottom: 20px;
  }
}
.p-about_articlelList article h4::before {
  content: "";
  position: absolute;
  left: -30px;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  width: 23px;
  height: 4px;
  background-color: var(--color-primary);
}
@media screen and (max-width: 767px) {
  .p-about_articlelList article h4::before {
    height: 3px;
    left: -20px;
    width: 16px;
  }
}
.p-about_articlelList.--gray article {
  background-color: #E3E3E3;
}
.p-about_articlelList.--gray h4 {
  color: var(--color-primary);
}

.p-about_productList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 10px 20px;
  margin-top: 20px;
}
@media screen and (max-width: 767px) {
  .p-about_productList {
    margin-top: 10px;
  }
}
.p-about_productList ._item {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  font-size: 1.7rem;
  font-weight: bold;
  text-decoration: none;
  background-color: #fff;
  -webkit-box-shadow: 0 10px 50px rgba(0, 0, 0, 0.16);
          box-shadow: 0 10px 50px rgba(0, 0, 0, 0.16);
  -webkit-transition: 0.3s ease;
  transition: 0.3s ease;
}
@media screen and (max-width: 767px) {
  .p-about_productList ._item {
    font-size: 1.2rem;
  }
}
.p-about_productList ._item ._thumb {
  overflow: hidden;
}
.p-about_productList ._item ._thumb img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
  -webkit-transition: -webkit-transform 0.3s ease;
  transition: -webkit-transform 0.3s ease;
  transition: transform 0.3s ease;
  transition: transform 0.3s ease, -webkit-transform 0.3s ease;
}
.p-about_productList ._item ._title {
  padding: 15px 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 10px;
  line-height: 1.4;
}
@media screen and (max-width: 767px) {
  .p-about_productList ._item ._title {
    padding: 10px 5px;
    gap: 5px;
  }
}
.p-about_productList ._item ._title ._icon-blank {
  -ms-flex-negative: 0;
      flex-shrink: 0;
  display: inline-block;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background-size: auto 200%;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#0792D5), color-stop(51%, #033794), to(#0792D5));
  background-image: linear-gradient(to bottom, #0792D5 0%, #033794 51%, #0792D5 100%);
  position: relative;
  -webkit-transition: background-position 0.3s ease;
  transition: background-position 0.3s ease;
}
@media screen and (max-width: 767px) {
  .p-about_productList ._item ._title ._icon-blank {
    width: 24px;
    height: 24px;
  }
}
.p-about_productList ._item ._title ._icon-blank::before {
  content: "";
  display: block;
  -webkit-mask-image: url(../img/icon_blank.svg);
          mask-image: url(../img/icon_blank.svg);
  -webkit-mask-size: contain;
          mask-size: contain;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-position: center;
          mask-position: center;
  width: 12px;
  height: 12px;
  background-color: #fff;
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
@media screen and (max-width: 767px) {
  .p-about_productList ._item ._title ._icon-blank::before {
    width: 8px;
    height: 8px;
  }
}
.p-about_productList ._item:hover {
  color: #fff;
  background-color: var(--color-primary);
}
.p-about_productList ._item:hover ._thumb img {
  -webkit-transform: scale(1.1);
          transform: scale(1.1);
  opacity: 0.8;
}
.p-about_productList ._item:hover ._title ._icon-blank {
  background-position: 0 100%;
}

.p-about_note {
  font-size: 1.6rem;
  line-height: 1.8;
  margin-top: 20px;
}
@media screen and (max-width: 767px) {
  .p-about_note {
    font-size: 1.4rem;
    margin-top: 10px;
  }
}

.p-about_video {
  margin-top: 40px;
}
.p-about_video ._thumb {
  display: block;
  width: 100%;
  max-width: 800px;
  margin: 0 auto;
  position: relative;
  background-color: #000;
}
.p-about_video ._thumb img {
  opacity: 0.9;
  -webkit-transition: 0.3s ease;
  transition: 0.3s ease;
}
.p-about_video ._thumb::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: 74px;
  height: 52px;
  -webkit-mask-image: url(../img/icon_play.svg);
          mask-image: url(../img/icon_play.svg);
  -webkit-mask-size: contain;
          mask-size: contain;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-position: center;
          mask-position: center;
  background-color: #fff;
  -webkit-box-shadow: 0 10px 50px rgba(0, 0, 0, 0.16);
          box-shadow: 0 10px 50px rgba(0, 0, 0, 0.16);
  -webkit-transition: 0.3s ease;
  transition: 0.3s ease;
}
@media screen and (max-width: 767px) {
  .p-about_video ._thumb::after {
    width: 60px;
    height: 42px;
  }
}
.p-about_video ._thumb:hover img {
  opacity: 0.7;
}
.p-about_video ._thumb:hover::after {
  -webkit-transform: translate(-50%, -50%) scale(1.1);
          transform: translate(-50%, -50%) scale(1.1);
}

/* 左右のナビゲーション（矢印）を非表示にする */
.gnext, .gprev {
  display: none !important;
}

/* ついでに下部のカウンター（1/1 などの表示）も消したい場合 */
.gcounter {
  display: none !important;
}

/* ポップアップが開いている間、勝手に最上部へ飛ばないようにする */
html.glightbox-open,
body.glightbox-open {
  /* overflow: hidden が原因でトップに戻る場合があるため、固定を解除 */
  height: auto !important;
  overflow: visible !important;
  position: static !important;
}

/* その代わり、ポップアップ自体が画面中央に固定されるように担保 */
.gcontainer {
  position: fixed !important;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 999999;
}

/* ============================================
  PC／SPのみ表示
============================================  */
@media screen and (max-width: 767px) {
  .u-pc {
    display: none;
  }
}

@media screen and (min-width: 768px) {
  .u-sp {
    display: none;
  }
}

/* ============================================
  font
============================================  */
.u-bold {
  font-weight: bold !important;
}

.u-normal {
  font-weight: normal !important;
}

.u-lighter {
  font-weight: 200 !important;
}

.u-left {
  text-align: left !important;
}

.u-right {
  text-align: right !important;
}

.u-center {
  text-align: center !important;
}

.u-cap {
  font-size: 1.5rem;
}

.u-small {
  font-size: max(0.5em, 1.2rem);
}

.u-highlight {
  text-decoration: underline; /* 下線 */
  text-decoration-thickness: 0.5em; /* 線の太さ */
  text-decoration-color: rgb(255, 255, 65); /* 線の色 */
  text-underline-offset: -0.2em; /* 線の位置。テキストに重なるようにやや上部にする */
  -webkit-text-decoration-skip-ink: none;
          text-decoration-skip-ink: none; /* 下線と文字列が重なる部分でも下線が省略されない（線が途切れない） */
}

.u-indent {
  text-indent: -1.5em;
  padding-left: 1.5em;
}

.u-inlineblock {
  display: inline-block;
}

.u-textlink {
  color: var(--color-primary);
}

/* ============================================
  icon
============================================  */
.u-blank::after {
  content: "";
  width: 12px;
  height: 12px;
  -webkit-mask-image: url(../img/icon_blank.svg);
          mask-image: url(../img/icon_blank.svg);
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask-size: contain;
          mask-size: contain;
  background-color: var(--color-primary);
  margin-left: 5px;
  display: inline-block;
}

/* ============================================
  margin/padding
============================================  */
.u-mt0 {
  margin-top: 0 !important;
}

.u-pt0 {
  padding-top: 0 !important;
}

.u-mr0 {
  margin-right: 0 !important;
}

.u-pr0 {
  padding-right: 0 !important;
}

.u-mb0 {
  margin-bottom: 0 !important;
}

.u-pb0 {
  padding-bottom: 0 !important;
}

.u-ml0 {
  margin-left: 0 !important;
}

.u-pl0 {
  padding-left: 0 !important;
}

.u-mt5 {
  margin-top: 5px !important;
}

.u-pt5 {
  padding-top: 5px !important;
}

.u-mr5 {
  margin-right: 5px !important;
}

.u-pr5 {
  padding-right: 5px !important;
}

.u-mb5 {
  margin-bottom: 5px !important;
}

.u-pb5 {
  padding-bottom: 5px !important;
}

.u-ml5 {
  margin-left: 5px !important;
}

.u-pl5 {
  padding-left: 5px !important;
}

.u-mt10 {
  margin-top: 10px !important;
}

.u-pt10 {
  padding-top: 10px !important;
}

.u-mr10 {
  margin-right: 10px !important;
}

.u-pr10 {
  padding-right: 10px !important;
}

.u-mb10 {
  margin-bottom: 10px !important;
}

.u-pb10 {
  padding-bottom: 10px !important;
}

.u-ml10 {
  margin-left: 10px !important;
}

.u-pl10 {
  padding-left: 10px !important;
}

.u-mt15 {
  margin-top: 15px !important;
}

.u-pt15 {
  padding-top: 15px !important;
}

.u-mr15 {
  margin-right: 15px !important;
}

.u-pr15 {
  padding-right: 15px !important;
}

.u-mb15 {
  margin-bottom: 15px !important;
}

.u-pb15 {
  padding-bottom: 15px !important;
}

.u-ml15 {
  margin-left: 15px !important;
}

.u-pl15 {
  padding-left: 15px !important;
}

.u-mt20 {
  margin-top: 20px !important;
}

.u-pt20 {
  padding-top: 20px !important;
}

.u-mr20 {
  margin-right: 20px !important;
}

.u-pr20 {
  padding-right: 20px !important;
}

.u-mb20 {
  margin-bottom: 20px !important;
}

.u-pb20 {
  padding-bottom: 20px !important;
}

.u-ml20 {
  margin-left: 20px !important;
}

.u-pl20 {
  padding-left: 20px !important;
}

.u-mt25 {
  margin-top: 25px !important;
}

.u-pt25 {
  padding-top: 25px !important;
}

.u-mr25 {
  margin-right: 25px !important;
}

.u-pr25 {
  padding-right: 25px !important;
}

.u-mb25 {
  margin-bottom: 25px !important;
}

.u-pb25 {
  padding-bottom: 25px !important;
}

.u-ml25 {
  margin-left: 25px !important;
}

.u-pl25 {
  padding-left: 25px !important;
}

.u-mt30 {
  margin-top: 30px !important;
}

.u-pt30 {
  padding-top: 30px !important;
}

.u-mr30 {
  margin-right: 30px !important;
}

.u-pr30 {
  padding-right: 30px !important;
}

.u-mb30 {
  margin-bottom: 30px !important;
}

.u-pb30 {
  padding-bottom: 30px !important;
}

.u-ml30 {
  margin-left: 30px !important;
}

.u-pl30 {
  padding-left: 30px !important;
}

.u-mt35 {
  margin-top: 35px !important;
}

.u-pt35 {
  padding-top: 35px !important;
}

.u-mr35 {
  margin-right: 35px !important;
}

.u-pr35 {
  padding-right: 35px !important;
}

.u-mb35 {
  margin-bottom: 35px !important;
}

.u-pb35 {
  padding-bottom: 35px !important;
}

.u-ml35 {
  margin-left: 35px !important;
}

.u-pl35 {
  padding-left: 35px !important;
}

.u-mt40 {
  margin-top: 40px !important;
}

.u-pt40 {
  padding-top: 40px !important;
}

.u-mr40 {
  margin-right: 40px !important;
}

.u-pr40 {
  padding-right: 40px !important;
}

.u-mb40 {
  margin-bottom: 40px !important;
}

.u-pb40 {
  padding-bottom: 40px !important;
}

.u-ml40 {
  margin-left: 40px !important;
}

.u-pl40 {
  padding-left: 40px !important;
}

.u-mt45 {
  margin-top: 45px !important;
}

.u-pt45 {
  padding-top: 45px !important;
}

.u-mr45 {
  margin-right: 45px !important;
}

.u-pr45 {
  padding-right: 45px !important;
}

.u-mb45 {
  margin-bottom: 45px !important;
}

.u-pb45 {
  padding-bottom: 45px !important;
}

.u-ml45 {
  margin-left: 45px !important;
}

.u-pl45 {
  padding-left: 45px !important;
}

.u-mt50 {
  margin-top: 50px !important;
}

.u-pt50 {
  padding-top: 50px !important;
}

.u-mr50 {
  margin-right: 50px !important;
}

.u-pr50 {
  padding-right: 50px !important;
}

.u-mb50 {
  margin-bottom: 50px !important;
}

.u-pb50 {
  padding-bottom: 50px !important;
}

.u-ml50 {
  margin-left: 50px !important;
}

.u-pl50 {
  padding-left: 50px !important;
}

.u-mt55 {
  margin-top: 55px !important;
}

.u-pt55 {
  padding-top: 55px !important;
}

.u-mr55 {
  margin-right: 55px !important;
}

.u-pr55 {
  padding-right: 55px !important;
}

.u-mb55 {
  margin-bottom: 55px !important;
}

.u-pb55 {
  padding-bottom: 55px !important;
}

.u-ml55 {
  margin-left: 55px !important;
}

.u-pl55 {
  padding-left: 55px !important;
}

.u-mt60 {
  margin-top: 60px !important;
}

.u-pt60 {
  padding-top: 60px !important;
}

.u-mr60 {
  margin-right: 60px !important;
}

.u-pr60 {
  padding-right: 60px !important;
}

.u-mb60 {
  margin-bottom: 60px !important;
}

.u-pb60 {
  padding-bottom: 60px !important;
}

.u-ml60 {
  margin-left: 60px !important;
}

.u-pl60 {
  padding-left: 60px !important;
}

.u-mt65 {
  margin-top: 65px !important;
}

.u-pt65 {
  padding-top: 65px !important;
}

.u-mr65 {
  margin-right: 65px !important;
}

.u-pr65 {
  padding-right: 65px !important;
}

.u-mb65 {
  margin-bottom: 65px !important;
}

.u-pb65 {
  padding-bottom: 65px !important;
}

.u-ml65 {
  margin-left: 65px !important;
}

.u-pl65 {
  padding-left: 65px !important;
}

.u-mt70 {
  margin-top: 70px !important;
}

.u-pt70 {
  padding-top: 70px !important;
}

.u-mr70 {
  margin-right: 70px !important;
}

.u-pr70 {
  padding-right: 70px !important;
}

.u-mb70 {
  margin-bottom: 70px !important;
}

.u-pb70 {
  padding-bottom: 70px !important;
}

.u-ml70 {
  margin-left: 70px !important;
}

.u-pl70 {
  padding-left: 70px !important;
}

.u-mt75 {
  margin-top: 75px !important;
}

.u-pt75 {
  padding-top: 75px !important;
}

.u-mr75 {
  margin-right: 75px !important;
}

.u-pr75 {
  padding-right: 75px !important;
}

.u-mb75 {
  margin-bottom: 75px !important;
}

.u-pb75 {
  padding-bottom: 75px !important;
}

.u-ml75 {
  margin-left: 75px !important;
}

.u-pl75 {
  padding-left: 75px !important;
}

.u-mt80 {
  margin-top: 80px !important;
}

.u-pt80 {
  padding-top: 80px !important;
}

.u-mr80 {
  margin-right: 80px !important;
}

.u-pr80 {
  padding-right: 80px !important;
}

.u-mb80 {
  margin-bottom: 80px !important;
}

.u-pb80 {
  padding-bottom: 80px !important;
}

.u-ml80 {
  margin-left: 80px !important;
}

.u-pl80 {
  padding-left: 80px !important;
}

.u-mt85 {
  margin-top: 85px !important;
}

.u-pt85 {
  padding-top: 85px !important;
}

.u-mr85 {
  margin-right: 85px !important;
}

.u-pr85 {
  padding-right: 85px !important;
}

.u-mb85 {
  margin-bottom: 85px !important;
}

.u-pb85 {
  padding-bottom: 85px !important;
}

.u-ml85 {
  margin-left: 85px !important;
}

.u-pl85 {
  padding-left: 85px !important;
}

.u-mt90 {
  margin-top: 90px !important;
}

.u-pt90 {
  padding-top: 90px !important;
}

.u-mr90 {
  margin-right: 90px !important;
}

.u-pr90 {
  padding-right: 90px !important;
}

.u-mb90 {
  margin-bottom: 90px !important;
}

.u-pb90 {
  padding-bottom: 90px !important;
}

.u-ml90 {
  margin-left: 90px !important;
}

.u-pl90 {
  padding-left: 90px !important;
}

.u-mt95 {
  margin-top: 95px !important;
}

.u-pt95 {
  padding-top: 95px !important;
}

.u-mr95 {
  margin-right: 95px !important;
}

.u-pr95 {
  padding-right: 95px !important;
}

.u-mb95 {
  margin-bottom: 95px !important;
}

.u-pb95 {
  padding-bottom: 95px !important;
}

.u-ml95 {
  margin-left: 95px !important;
}

.u-pl95 {
  padding-left: 95px !important;
}

.u-mt100 {
  margin-top: 100px !important;
}

.u-pt100 {
  padding-top: 100px !important;
}

.u-mr100 {
  margin-right: 100px !important;
}

.u-pr100 {
  padding-right: 100px !important;
}

.u-mb100 {
  margin-bottom: 100px !important;
}

.u-pb100 {
  padding-bottom: 100px !important;
}

.u-ml100 {
  margin-left: 100px !important;
}

.u-pl100 {
  padding-left: 100px !important;
}

/* ============================================
  name
============================================  */
/* ============================================
  Hover Animation
============================================  */
/* underline
------------------------- */
.a-underline {
  position: relative;
  display: inline-block;
  text-decoration: none;
}
.a-underline::after {
  position: absolute;
  bottom: 0;
  left: 0;
  content: "";
  width: 100%;
  height: 1px;
  background: #333;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: 0.3s ease-out;
  transition: 0.3s ease-out;
}
.a-underline:hover::after {
  bottom: 0;
  opacity: 1;
  visibility: visible;
}

/* ============================================
  Scroll Animation
============================================  */
/* fadeUp
------------------------- */
.a-fadeUp {
  opacity: 0;
}
.a-fadeUp.is-active {
  -webkit-animation-name: fade-up;
          animation-name: fade-up;
  -webkit-animation-duration: 0.6s;
          animation-duration: 0.6s;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}

@-webkit-keyframes fade-up {
  0% {
    -webkit-transform: translateY(20px);
            transform: translateY(20px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}

@keyframes fade-up {
  0% {
    -webkit-transform: translateY(20px);
            transform: translateY(20px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
/* fadeDown
------------------------- */
.a-fadeDown {
  opacity: 0;
}
.a-fadeDown.is-active {
  -webkit-animation-name: fade-down;
          animation-name: fade-down;
  -webkit-animation-duration: 0.6s;
          animation-duration: 0.6s;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}

@-webkit-keyframes fade-down {
  0% {
    -webkit-transform: translateY(-20px);
            transform: translateY(-20px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}

@keyframes fade-down {
  0% {
    -webkit-transform: translateY(-20px);
            transform: translateY(-20px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
/* fadeRight
------------------------- */
.a-fadeRight {
  opacity: 0;
}
.a-fadeRight.is-active {
  -webkit-animation-name: fade-right;
          animation-name: fade-right;
  -webkit-animation-duration: 0.6s;
          animation-duration: 0.6s;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  /* animation-delay: .0s; */
}

@-webkit-keyframes fade-right {
  0% {
    -webkit-transform: translateX(20px);
            transform: translateX(20px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
  }
}

@keyframes fade-right {
  0% {
    -webkit-transform: translateX(20px);
            transform: translateX(20px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
  }
}
/* fadeLeft
------------------------- */
.a-fadeLeft {
  opacity: 0;
}
.a-fadeLeft.is-active {
  -webkit-animation-name: fade-left;
          animation-name: fade-left;
  -webkit-animation-duration: 0.6s;
          animation-duration: 0.6s;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  /* animation-delay: .0s; */
}

@-webkit-keyframes fade-left {
  0% {
    -webkit-transform: translateX(-20px);
            transform: translateX(-20px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
  }
}

@keyframes fade-left {
  0% {
    -webkit-transform: translateX(-20px);
            transform: translateX(-20px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
  }
}
@keyframes fade-arrow {
  0% {
    -webkit-transform: translateX(0) translateY(-50%) rotate(45deg);
            transform: translateX(0) translateY(-50%) rotate(45deg);
    opacity: 1;
  }
  50% {
    -webkit-transform: translateX(100%) translateY(-50%) rotate(45deg);
            transform: translateX(100%) translateY(-50%) rotate(45deg);
    opacity: 0;
  }
  51% {
    -webkit-transform: translateX(-100%) translateY(-50%) rotate(45deg);
            transform: translateX(-100%) translateY(-50%) rotate(45deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0) translateY(-50%) rotate(45deg);
            transform: translateX(0) translateY(-50%) rotate(45deg);
    opacity: 1;
  }
}
@-webkit-keyframes maskAnim {
  0% {
    -webkit-transform: skewX(-25deg) scaleX(0);
            transform: skewX(-25deg) scaleX(0);
    -webkit-transform-origin: left;
            transform-origin: left;
    opacity: 1;
  }
  50% {
    -webkit-transform: skewX(-25deg) scaleX(1);
            transform: skewX(-25deg) scaleX(1);
    -webkit-transform-origin: left;
            transform-origin: left;
    opacity: 1;
  }
  50.1% {
    -webkit-transform: skewX(-25deg) scaleX(1);
            transform: skewX(-25deg) scaleX(1);
    -webkit-transform-origin: right;
            transform-origin: right;
    opacity: 1;
  }
  100% {
    -webkit-transform: skewX(-25deg) scaleX(0);
            transform: skewX(-25deg) scaleX(0);
    -webkit-transform-origin: right;
            transform-origin: right;
    opacity: 1;
  }
}
@keyframes maskAnim {
  0% {
    -webkit-transform: skewX(-25deg) scaleX(0);
            transform: skewX(-25deg) scaleX(0);
    -webkit-transform-origin: left;
            transform-origin: left;
    opacity: 1;
  }
  50% {
    -webkit-transform: skewX(-25deg) scaleX(1);
            transform: skewX(-25deg) scaleX(1);
    -webkit-transform-origin: left;
            transform-origin: left;
    opacity: 1;
  }
  50.1% {
    -webkit-transform: skewX(-25deg) scaleX(1);
            transform: skewX(-25deg) scaleX(1);
    -webkit-transform-origin: right;
            transform-origin: right;
    opacity: 1;
  }
  100% {
    -webkit-transform: skewX(-25deg) scaleX(0);
            transform: skewX(-25deg) scaleX(0);
    -webkit-transform-origin: right;
            transform-origin: right;
    opacity: 1;
  }
}
/* ============================================
  swiper
============================================  *//*# sourceMappingURL=style.css.map */