@charset "UTF-8";
/* ========================================
  共通
======================================== */
:root {
  /* color */
  --color-main: #000;
  --color-dgray: #333;
  --color-text-invert: #fff;
  --color-accent-light: #B6336B; /*rgba(179,50,103,1) */
  --color-accent-dark: #661116; /*rgba(179,50,103,1) */
  --color-accent-yellow: #FFE343;
  --color-bg-beige: #FBF9F3;

  /* font size */
  --fs-ms: clamp(1.4rem, 0.9rem + 1vw, 1.8rem);
  --fs-mm: clamp(1.6rem, 1rem + .8vw, 2.4rem);
  --fs-ml: clamp(1.6rem, 0.7rem + 1.25vw, 3.2rem);
  --fs-ls: clamp(2.2rem, 1rem + 1.8vw, 4rem);
    
  --fs-hero-catch: clamp(3rem, 0.2rem + 4.5vw, 7rem);
  --fs-hero-sub: clamp(1.2rem, 0.4rem + 1.1vw, 2rem);

  --fs-site-main-title-sub: clamp(1.6rem, 0.95rem + 1.25vw, 3rem);
  
  --common-pad-m: clamp(1.6rem, 1.11rem + 1.31vw, 3.2rem);
  --common-pad-ml: clamp(3rem, 1rem + 3vw, 6rem);
  
  /* font weight */
  --font-weight-sbold: 600;
  --font-weight-bold: 700;

  /* headerhight */
  --headerhight: 100px;

  /* filter */
  --filter-invert-to-white: brightness(0) invert(1);

  /* narrow-contents */
  --width-narrow: 900px;

  /* shadow */
  --com-shadow: 0px 1px 8px 0px rgba(0, 0, 0, 0.35);

  /* BG切り替え */
  --edge-height: 6rem;

  /* border */
  --base-border-thickness: 3px;
}

@media (max-width: 959px) {
  :root {
    --edge-height: clamp(2rem, 6.25vw, 6rem);
  }
}
@media (max-width: 768px) {
  :root {
    /* font size */
   --fs-ll-upper-chatch: clamp(22px, 22px + 16px * pow((100vw - 375px) / (768px - 375px), 0.4), 38px);

    /* headerhight */
    --headerhight: 60px;

    /* border */
    --base-border-thickness: 2px;  
  }
 
}

/* ========================================
  共通
======================================== */
html {
  scroll-behavior: auto;
  scroll-padding-top: var(--headerhight);
}
body {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
  font-style: normal;
  color: var(--color-main);
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
}
body.is-menu-open {
  overflow: hidden;
}

/* フォント：IBM Plex Sans */
.-ibm {
  font-family: "IBM Plex Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-variation-settings:
    "wdth" 75;
}
/* フォント：Bebas Neue */
.-bebas {
  font-family: "Bebas Neue", sans-serif;
  font-weight: 400;
  font-style: normal;
}
/* フォント：Noto Sans JP */
.-noto {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
  font-style: normal;
}

img {
  display: block;
  max-width: 100%;
  height: auto;
  object-fit: contain;
}

a {
  color: var(--color-main);
  text-decoration: none;
  transition:
    color .5s ease,
    opacity .5s ease,
    background-color .5s ease;
}

.--top-1col:not(:has(.--top-2col)) p + p {
  margin-block-start: 2em;
}

/* 切り替え */
.pc-only {
  display: inline;
}
.sp-only {
  display: none;
}
.sp-only-m,
.sp-only-s {
  display: none;
}
@media (max-width: 959px) {
  .sp-only-m {
    display: inline;
  }
}
@media (max-width: 768px) {
  .pc-only {
    display: none;
  }
  .sp-only {
    display: inline;
  }
}
@media (max-width: 640px) {
  .sp-only-s {
    display: inline;
  }
}
.nowrap {
	white-space: nowrap;
}
 
/* テキスト装飾：BOX */
.deco-border-box {
  color: var(--color-accent-light);
  display: inline-block;
  white-space: nowrap;
  padding: .6rem .8rem;
  margin: .4rem .6rem;
  border: var(--base-border-thickness) solid var(--color-accent-light);
}

/* BG */
.__bg-beige {
  background-color: var(--color-bg-beige);
  background-image: url(../img/0701BF_inshoku.consulting_Used_Creative_bg-block.webp);
  background-position: left -36px;
  background-repeat: repeat;
  background-size: clamp(60px, 8vw, 120px) auto;
}
.__bg-grad {
  background-image:
  url(../img/0701BF_inshoku.consulting_Used_Creative_bg-dots.png),
  linear-gradient(
    90deg,
    var(--color-accent-dark) 0%,
    var(--color-accent-light) 100%
  );
  background-position:
    center center,
    center center;
  background-repeat:
    repeat,
    no-repeat;
  background-size:
    45px 47px,
    100% 100%;
}
@media (max-width: 959px) {
  .__bg-grad {
    background-size:
      36px 38px,
      100% 100%;
  }
}
.__bg-dgray {
  background-color: var(--color-dgray);
}


/* ========================================
  下からフェードイン
======================================== */
.fade-up {
	opacity: 0;
	transform: translateY(60px);
	transition:
		opacity 1s ease,
		transform 1s ease;
}

.fade-up.is-show {
	opacity: 1;
	transform: translateY(0);
}

/* ========================================
  動画ベース
======================================== */
.video-wrap {
  position: relative;
  aspect-ratio: 16 / 9;
  overflow: hidden;
}
.video-wrap video {
  display: block;
  width: 100%;
  height: calc(100% + 1px);
  object-fit: cover;
}


/* ========================================
  Header
======================================== */
.l-header {
  position: sticky;
  top: 0;
  left: 0;
  right: 0;
  height: var(--headerhight);
  background: var(--color-text-invert);
  z-index: 999;
}
.l-header-container {
  height: 100%;
  padding-block: 1rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 3rem;
}

/* ロゴ回り */
.site-title {
 flex-shrink: 0;
 width: 40%;
 max-width: 321px;
 margin-right: auto;
}
.site-title a:hover {
  opacity: .7;
}

/* ナビ */
.global-nav ul {
  display: flex;
  align-items: center;
  gap: 3rem;
}
.global-nav ul li {
  flex-shrink: 0;
}
.global-nav ul li a {
  font-size: var(--fs-ms);
  text-align: center;
  line-height: 1.2;
  font-weight: var(--font-weight-sbold);
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 2rem;
}
.global-nav ul li a:hover {
  opacity: .7;
  color: var(--color-accent-light);
}
.global-nav .about-br {
  display: block;
}

/* メニューのクローズ状態 */
.global-nav.is-no-transition {
  transition: none !important;
}

/* 問い合わせ */
.header-contact-wrap {
  width:320px;
}
.contactBtn {
  color: var(--color-text-invert);
  font-size: 2rem;
  font-weight: var(--font-weight-sbold);
  width: 100%;
  height: 70px;
  padding-inline: 3rem 1.5rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: var(--color-accent-light);
  border-radius: 60rem;
  margin-inline: auto;
}
.contactBtn__icon {
  position: relative;
  width: 54px;
  height: 30px;
  flex-shrink: 0;
}
.contactBtn__circle {
  position: absolute;
  top: 50%;
  left: 0;
  width: 2.4rem;
  height: 2.4rem;
  border: 2px solid currentColor;
  border-radius: 50%;
  transform: translateY(-50%);
}
.contactBtn__line {
  position: absolute;
  top: 50%;
  left: 12px;
  width: 30px;
  height: 2px;
  background: currentColor;
  transform: translateY(-50%);
  transition: width .3s ease;
}
.contactBtn__arrow {
  position: absolute;
  top: 50%;
  left: 30px;
  width: 14px;
  height: 2px;
  background: currentColor;
  transform: rotate(45deg);
  transform-origin: right center;
  transition: left .3s ease;
}
.contactBtn:hover .contactBtn__line {
  width: 40px;
}
.contactBtn:hover .contactBtn__arrow {
  left: 40px;
}

@media (min-width: 1421px){
  /* ナビ */
  .global-nav .about-br {
    display: none;
  }
}
@media (max-width: 1280px){
  /* 問い合わせ */
  .header-contact-wrap {
    position: fixed;
    right: 2rem;
    bottom: 2rem;
    z-index: 9999;
  }
}
@media (min-width: 769px) and (max-width: 1280px){
  /* ロゴ回り */
  .site-title {
    width: 30%;
  }
  /* ナビ */
  .global-nav ul li a {
    font-size: 1.6rem;
  }
}
@media (max-width: 768px){
  .header-contact-wrap {
    width: 100%;
    right: 0;
  }
  /* 問い合わせ */
  .contactBtn {
    width: calc(100% - (var(--content-padding)*2) );
  }
}

/* ハンバーガーボタン */
.menu-toggle__button {
  appearance: none;
  border: 0;
  background: transparent;
  padding: 0;
  color: var(--color-accent-light);
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
}
.menu-toggle__icon {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .8rem;
  width: 42px;
  height: 10px;
}
.menu-toggle__icon span {
  display: block;
  width: 6px;
  aspect-ratio: 1/1;
  border-radius: 50%;
  background: var(--color-accent-light);
  transition:
    transform 0.3s ease,
    opacity 0.2s ease,
    border-radius 0.3s ease;
}
.menu-toggle__text {
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0;
  text-align: center;
  display: block;
  width: 100%;
}
.menu-toggle.is-open .menu-toggle__icon span {
  position: absolute;
  width: 30px;
  height: 2px;
  border-radius: 2px;
}
.menu-toggle.is-open .menu-toggle__icon span:nth-child(1) {
  transform: rotate(30deg);
}
.menu-toggle.is-open .menu-toggle__icon span:nth-child(2) {
  opacity: 0;
}
.menu-toggle.is-open .menu-toggle__icon span:nth-child(3) {
  transform: rotate(-30deg);
}

/* SP Gナビ */
@media (max-width: 768px) {

  .l-header-container {
    padding-inline: 1.7rem;
  }
  .site-title {
    width: min(54%, 240px);
  }
  .menu-toggle {
    display: block;
    position: relative;
    z-index: 1001;
  }
  .global-nav {
    position: fixed;
    top: var(--headerhight);
    left: 0;
    width: 100%;
    height: calc(100dvh - var(--headerhight));
    background: #fff;
    z-index: 9000;
    display: flex;
    justify-content: center;
    /* align-items: center; */
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition:
      opacity .3s ease,
      visibility .3s ease;
    overflow-y: auto;
  }
  .global-nav.is-open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }
  .global-nav ul {
    width: 100%;
    padding-inline: 3rem;
    margin-block-start: 3rem;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
  }

  .global-nav ul li {
    width: 100%;
    border: 1px solid var(--color-main);
  }
  .global-nav ul li:not(:last-child) {
    border-bottom: 0;
  }
  .global-nav ul li a {
    width: 100%;
    min-height: 80px;
    padding: 2rem 1rem;
    font-size: 1.8rem;
    line-height: 1.5;
    text-align: center;
  }

}

/* ========================================
  Footer
======================================== */
footer {
  padding-block: calc(var(--section-gap) * .5);
}
footer .footer-logo {
  width: 50%;
  max-width: 360px;
  margin-inline: auto;
}

.pagetopbtn {
  font-size: 1px;
  text-indent: 110%;
  overflow: hidden;
  position: fixed;
  right: 2rem;
  bottom: 10rem;
  width: 6rem;
  aspect-ratio: 1/1;
  background: var(--color-accent-light);
  border-radius: 50%;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .5s ease, visibility .5s ease, background-color .5s ease;
}
.pagetopbtn::before {
  content: "";
  position: absolute;
  inset: 15%;
  background: url(../img/0701BF_inshoku.consulting_Used_Creative_pagetop-arrow.svg) center / contain no-repeat;
  background-size: auto 60%;
}
.pagetopbtn.is-show {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  z-index: 9000;
}
.pagetopbtn:hover {
  background-color: var(--color-accent);
}
body.is-menu-open .pagetopbtn {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
body:has(.page-contact):not(:has(.page-contact.--contact-thanks)) .pagetopbtn {
  bottom: 2rem;
}
@media (min-width: 1281px) {
  .pagetopbtn {
    bottom:2rem;
  }
}
@media (max-width: 768px) {
  footer {
    padding-block: calc(var(--section-gap) * .5) calc(var(--section-gap) * 1.4);
  }
  body:has(.page-contact):not(:has(.page-contact.--contact-thanks)) footer {
    padding-block: calc(var(--section-gap) * .5);
  }
}

/* ========================================
  Contents - top
======================================== */
/* MV */
.hero {
  overflow: hidden;
  position: relative;
}
.hero__lead {
  position: absolute;
  top: 3rem;
  left: calc(6vw - 2px);
  z-index: 10;
}
.hero__lead p {
  color: var(--color-text-invert);
  font-size: clamp(1.8rem, 0.2rem + 2.5vw, 4rem);
  font-weight: var(--font-weight-bold);
  width: fit-content;
  padding: var(--fs-ms) var(--fs-mm);
  background: linear-gradient(
  90deg,
  var(--color-accent-dark) 0%,
  var(--color-accent-light) 100%);
  border: 2px solid var(--color-text-invert);
}
.hero__lead p.upper {
  padding-inline-end: 1rem;
}
.hero__lead p.lower {
  margin-top: -2px;
}
.hero__columns {
  display: flex;
  width: max-content;
  left: 50%;
  transform: translateX(-50%);
  position: relative;
}
.hero__columns::after {
  content: "";
  position: absolute;
  inset: 0;
  background: url(../img/0701BF_inshoku.consulting_Used_Creative_bg-dots.png) center center repeat;
  pointer-events: none;
  z-index: 5;
}
@media (max-width: 959px) {
  .hero__columns::after {
    background-size: 36px 36px;
  }
}
@media (min-width: 1680px) {
  .hero__lead {
    top: 4rem;
  }
}
@media (max-width: 1280px) {
  .hero__lead {
    top: 2rem;
    left: -2px;
  }
}
.hero__columns .hero__column {
  width: 22vw;
  aspect-ratio: 420/880;
  flex-shrink: 0;
  padding-block: 18rem 2rem;
  display: flex;
  justify-content: center;
  align-items: end;
  position: relative;
}
@media (min-width: 1680px) {
  .hero__columns .hero__column {
    padding-block-end: 6rem;
    aspect-ratio: 420/820;
  }
}
@media (max-width: 1280px) {
  .hero__column.__column_leftside,
  .hero__column.__column_rightside {
    display: none;
  }
  .hero__columns {
    width: 100%;
    transform: none;
    left: 0;
  }
  .hero__columns .hero__column {
    width: 25%;
  }
}
.hero__column.__column_leftside {
  background: linear-gradient(rgba(0, 0, 0, .35), rgba(0, 0, 0, .35)),
  url(../img/0701BF_inshoku.consulting_Used_Creative_mvbg01.webp) center center no-repeat;
  background-size: cover;
}
.hero__column.__column_restaurant {
  background: linear-gradient(rgba(0, 0, 0, .35), rgba(0, 0, 0, .35)),
  url(../img/0701BF_inshoku.consulting_Used_Creative_mvbg02.webp) center center no-repeat;
  background-size: cover;
}
.hero__column.__column_dining {
  background: linear-gradient(rgba(0, 0, 0, .35), rgba(0, 0, 0, .35)),
  url(../img/0701BF_inshoku.consulting_Used_Creative_mvbg03.webp) center center no-repeat;
  background-size: cover;
}
.hero__column.__column_kitchen {
  background: linear-gradient(rgba(0, 0, 0, .35), rgba(0, 0, 0, .35)),
  url(../img/0701BF_inshoku.consulting_Used_Creative_mvbg04.webp) center center no-repeat;
  background-size: cover;
}
.hero__column.__column_fandb {
  background: linear-gradient(rgba(0, 0, 0, .35), rgba(0, 0, 0, .35)),
  url(../img/0701BF_inshoku.consulting_Used_Creative_mvbg05.webp) center center no-repeat;
  background-size: cover;
}
.hero__column.__column_rightside {
  background: linear-gradient(rgba(0, 0, 0, .35), rgba(0, 0, 0, .35)),
  url(../img/0701BF_inshoku.consulting_Used_Creative_mvbg06.webp) center center no-repeat;
  background-size: cover;
}
.hero__column-content {
  color: var(--color-text-invert);
  width: 100%;
  padding: 2rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2.4rem;
  z-index: 2;
}
@media (min-width: 1921px) {
  .hero__lead p {
    font-size: 4.6rem;
  }
  .hero__column-content {
    gap: 3.4rem;
  }
}
.hero__column-content img {
  width: 46%;
  order: 1;
}
.hero__column-content::after {
  display: block;
  content: "";
  width: 20%;
  max-width: 5rem;
  min-width: 3rem;
  aspect-ratio: 1/1; 
  background: url(../img/0701BF_inshoku.consulting_Used_Creative_icon_multiply.svg) center center no-repeat;
  background-size: cover;
  filter: var(--filter-invert-to-white);
  order: 3;
}
.hero__column-content .txt_kind {
  font-size: var(--fs-hero-sub);
  font-weight: var(--font-weight-sbold);
  text-align: center;
  order: 2;
  width: 100%;
}
.hero__column-content .txt_kind span {
  font-size: var(--fs-hero-catch);
  letter-spacing: -1px;
  line-height: 1;
  display: block;
  padding: .5rem 1rem 0;
  margin-block-start: 1rem;
  width: 100%;
  border: 2px solid var(--color-text-invert);
}
.hero__column-content .txt_tech {
  order: 4;
  font-size: calc(var(--fs-hero-catch) * .8);
  text-align: center;
  width: 100%;
  margin-block-start: -1rem;
}
.hero__column-content .txt_tech span {
  display: block;
  font-size: var(--fs-hero-sub);
  font-weight: var(--font-weight-sbold);
  text-align: center;
}
/* 959以下レイアウト */
@media (max-width: 959px) {

  .hero__lead {
    position: static;
    top: 0;
    width: 100%;
  }
  .hero__columns {
    width: 100%;
    left: auto;
    transform: none;
    flex-wrap: wrap;
  }
  .hero__columns .hero__column {
    width: 50%;
    aspect-ratio: 1 / 1;
    padding: 1.7rem 1.2rem;
        align-items: center;
  }
  .hero__column-content {
    color: var(--color-text-invert);
    padding: 0;
    gap: 1.2rem;
  }  
  .hero__column-content::after {
    width: 10%;
    min-width: 2rem;
  }
  .hero__column-content img {
    width: 43%;
  }  
  .hero__column-content .txt_kind span {
    margin-block-start: .5rem;
    letter-spacing: 0;
  }  
}


/* ========================================
  MV animation
======================================== */
/* 文字 */
.hero__lead p {
  opacity: 0;
  transform: translateY(15px);
}
.hero.is-animated .hero__lead p:nth-child(1) {
  animation: heroLeadIn .4s ease .2s forwards;
}
.hero.is-animated .hero__lead p:nth-child(2) {
  animation: heroLeadIn .4s ease .4s forwards;
}
@keyframes heroLeadIn {
  from {
    opacity: 0;
    transform: translateY(15px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* 白線 */
.hero__line {
  position: absolute;
  top: 0;
  right: 0;
  width: 2px;
  height: 100%;
  background: var(--color-text-invert);
  z-index: 8;
  pointer-events: none;

  transform: scaleY(0);
  transform-origin: top;
}
.hero.is-animated .hero__line {
  animation: heroLineIn .3s ease forwards;
}
.hero.is-animated .hero__column:nth-child(1) .hero__line {
  animation-delay: .8s;
}
.hero.is-animated .hero__column:nth-child(2) .hero__line {
  animation-delay: .86s;
}
.hero.is-animated .hero__column:nth-child(3) .hero__line {
  animation-delay: .92s;
}
.hero.is-animated .hero__column:nth-child(4) .hero__line {
  animation-delay: .98s;
}
.hero.is-animated .hero__column:nth-child(5) .hero__line {
  animation-delay: 1.04s;
}
.hero.is-animated .hero__column:nth-child(6) .hero__line {
  animation-delay: 1.1s;
}
@keyframes heroLineIn {
  from {
    transform: scaleY(0);
  }

  to {
    transform: scaleY(1);
  }
}

/* 959以下レイアウト */
@media (max-width: 959px) {

  .__column_dining .hero__line,
  .__column_fandb .hero__line {
    display: none;
  }
  .hero__columns::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    height: 2px;
    background: var(--color-text-invert);
    z-index: 8;
    pointer-events: none;

    transform: scaleX(0);
    transform-origin: left;
  }
  .hero.is-animated .hero__columns::before {
    animation: heroLineHorizontalSp .3s ease 1.05s forwards;
  }
  .hero.is-animation-complete .hero__columns::before {
    transform: scaleX(1);
    animation: none;
  }  
  @keyframes heroLineHorizontalSp {
    from {
      transform: scaleX(0);
    }

    to {
      transform: scaleX(1);
    }
  }

}

/* 赤グラデ */
.hero__column::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 4;
  pointer-events: none;

  background-image: linear-gradient(
    90deg,
    var(--color-accent-dark) 0%,
    var(--color-accent-light) 100%
  );
  background-size: 126vw 100%;
  background-repeat: no-repeat;
}
.hero__column:nth-child(1)::after {
  background-position: 0 0;
}
.hero__column:nth-child(2)::after {
  background-position: -21vw 0;
}
.hero__column:nth-child(3)::after {
  background-position: -42vw 0;
}
.hero__column:nth-child(4)::after {
  background-position: -63vw 0;
}
.hero__column:nth-child(5)::after {
  background-position: -84vw 0;
}
.hero__column:nth-child(6)::after {
  background-position: -105vw 0;
}

/* 959以下レイアウト */
@media (max-width: 959px) {
  .hero__column::after {
    background-size: 200% 100%;
  }

  .hero__column.__column_restaurant::after,
  .hero__column.__column_kitchen::after {
    background-position: left top;
  }

  .hero__column.__column_dining::after,
  .hero__column.__column_fandb::after {
    background-position: right top;
  }
}

/* 黒柱 */
.hero__column::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 7;
  background: #000;
  pointer-events: none;

  clip-path: inset(0 0 100% 0);
}

.hero.is-animated .hero__column::before {
  animation: heroBlackColumn .9s cubic-bezier(.76, 0, .24, 1) forwards;
}
.hero.is-animated .hero__column:nth-child(1)::before {
  animation-delay: 1.3s;
}
.hero.is-animated .hero__column:nth-child(2)::before {
  animation-delay: 1.42s;
}
.hero.is-animated .hero__column:nth-child(3)::before {
  animation-delay: 1.54s;
}
.hero.is-animated .hero__column:nth-child(4)::before {
  animation-delay: 1.66s;
}
.hero.is-animated .hero__column:nth-child(5)::before {
  animation-delay: 1.78s;
}
.hero.is-animated .hero__column:nth-child(6)::before {
  animation-delay: 1.9s;
}

@keyframes heroBlackColumn {
  0% {
    clip-path: inset(0 0 100% 0);
  }
  40% {
    clip-path: inset(0 0 0 0);
  }
  65% {
    clip-path: inset(0 0 0 0);
  }
  100% {
    clip-path: inset(100% 0 0 0);
  }
}

.hero.is-animated .hero__column::after {
  animation: heroRedOut 0s forwards;
}
.hero.is-animated .hero__column:nth-child(1)::after {
  animation-delay: 1.70s;
}
.hero.is-animated .hero__column:nth-child(2)::after {
  animation-delay: 1.82s;
}
.hero.is-animated .hero__column:nth-child(3)::after {
  animation-delay: 1.94s;
}
.hero.is-animated .hero__column:nth-child(4)::after {
  animation-delay: 2.06s;
}
.hero.is-animated .hero__column:nth-child(5)::after {
  animation-delay: 2.18s;
}
.hero.is-animated .hero__column:nth-child(6)::after {
  animation-delay: 2.30s;
}

@keyframes heroRedOut {
  to {
    visibility: hidden;
  }
}

/* アニメ終了処理*/
/* リード文字は表示済みに固定 */
.hero.is-animation-complete .hero__lead p {
  opacity: 1;
  transform: none;
  animation: none;
}
/* 白線は表示済みに固定 */
.hero.is-animation-complete .hero__line {
  transform: scaleY(1);
  animation: none;
}
/* 赤グラデは消した状態 */
.hero.is-animation-complete .hero__column::after {
  visibility: hidden;
  animation: none;
}
/* 黒柱も消した状態 */
.hero.is-animation-complete .hero__column::before {
  clip-path: inset(100% 0 0 0);
  animation: none;
}

/* h１ライン */
.site-title-line {
  padding-block: var(--section-gap);
  background: var(--color-accent-dark);
  border-top: 2px solid var(--color-text-invert);
}
@media (max-width: 959px) {
  .site-title-line {
    padding-block: calc(var(--section-gap) * .8);
  }
}

.site-main-title {
  color: var(--color-text-invert);
  font-size: var(--fs-site-main-title-sub);
  text-align: center;
}
.site-main-title span {
  display: flex;
  align-items: center;
  gap: clamp(1.6rem, 0.95rem + 1.25vw, 3rem);
  white-space: nowrap;
}
.site-main-title span::before,
.site-main-title span::after {
  content: "";
  width: 100%;
  height: 1px;
  background: var(--color-text-invert);
}
.site-main-title img {
  margin: var(--common-pad-ml) auto 0;
  width: 84%;
  max-width: 820px;
}

.site-title-line .-sitecatch {
  color: var(--color-text-invert);
}
.site-title-line .-sitecatch p {
  font-size: clamp(2.1rem, 0.7rem + 1.6vw, 3.2rem);
  text-align: center;
  font-weight: var(--font-weight-bold);
  line-height: 1.8;
}

.site-title-line .-sitecatch p + p {
  margin-block-start: var(--fs-ms);
}
.site-title-line .-sitecatch ul {
  font-size: var(--fs-mm);
  width: fit-content;
  margin: calc(var(--section-gap) * .8) auto;
}
.site-title-line .-sitecatch ul li {
  line-height: 1.6;
}
.site-title-line .-sitecatch ul li + li {
  margin-block-start: 3rem;
}

@media (min-width: 960px) {
  .site-title-line .-sitecatch p,
  .site-title-line .-sitecatch ul li {
    margin-inline-end: -0.5em;
  } 
}


/* 共通見出し */
.com-heading.--level2 {
  --heading-icon-width: 100px;
  display: block;
  color: var(--color-accent-dark);
  font-size: var(--fs-ml);
  text-align: center;
  font-weight: var(--font-weight-bold);
  line-height: 1.3;
  position: relative;
  margin-block: -.5rem calc(
    (var(--common-pad-ml) * 1.1) * 2 + var(--heading-icon-width) * 0.51
  );
}
.section-heading__en {
  display: block;
  font-size: clamp(5rem, 1rem + 7vw, 12.8rem);
  text-align: center;
  opacity: .2;
}
.com-heading.--level2.-fs-l {
  font-size: calc(var(--fs-mm) * 2);
  letter-spacing: -1px;
}

.com-heading.--level2::after {
  display: block;
  content: "";
  width: 100px;
  aspect-ratio: 100/51;
  background: url(../img/0701BF_inshoku.consulting_Used_Creative_logo-icon.svg) center center no-repeat;
  background-size: cover;
  position: absolute;
  top: calc(100% + var(--common-pad-ml));
  left: 0;
  right: 0;
  margin: auto;  
}

.com-heading.--level2.no-icon {
  margin-bottom: var(--common-pad-ml);
}
.com-heading.--level2.no-icon::after {
  display: none;
}

@media (max-width: 959px) {
  .com-heading.--level2 {
    line-height: 1.3;
    --heading-icon-width: min(15%, 80px);
    margin-block-start: 1rem;
  }  
  .com-heading.--level2::after {
    width:15%;
    max-width: 80px;
  }
  .section-heading__en {
    font-size: clamp(5rem, 3rem + 8vw, 10rem);
  }
  .com-heading.--level2.-fs-l {
    font-size: calc(var(--fs-mm) * 1.5);
  }
}
@media (max-width: 520px) {
  .section-heading__en {
    font-size: 5rem;
  }
}
/* レストラン サイエンス */
.l-section.has-bg.sec-science {
  padding-block-end: 0;
}

/* 強調テキスト */
.sec-catch {
  font-size: clamp(2.1rem, 0.7rem + 1.6vw, 3.2rem);
  font-weight: var(--font-weight-bold);
  text-align: center;
  line-height: 1.2;
}
.sec-catch .notdeco {
  display: inline-block;
  margin-block: 1rem;
}

/* アイコンリスト */
.synergy-5icon {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.synergy-5icon li {
  position: relative;
  flex: 1;
  min-width: 0;
}
.synergy-5icon figure {
  width: 100%;
  text-align: center;
}
.synergy-5icon figure img {
  width: clamp(8rem, 11vw, 15rem);
  height: auto;
  margin-inline: auto;
}
.synergy-5icon figcaption {
  margin-top: 1rem;
  white-space: nowrap;
}

/* × */
.synergy-5icon li:not(:first-child)::before {
  content: "";
  position: absolute;
  top: 50%;
  right: 100%;
  width: clamp(3rem, 3.5vw, 5.4rem);
  aspect-ratio: 1 / 1;
  background: url(../img/0701BF_inshoku.consulting_Used_Creative_icon_multiply.svg) center / contain no-repeat;
  transform: translate(50%, -50%);
}

@media (max-width: 959px) {
  .synergy-5icon {
    flex-wrap: wrap;
    row-gap: 3rem;
  }
  /* 上段2つ */
  .synergy-5icon li:nth-child(-n + 2) {
    flex: 0 0 50%;
  }
  /* 下段3つ */
  .synergy-5icon li:nth-child(n + 3) {
    flex: 0 0 calc(100% / 3);
  }
  /* 下段先頭×を消す */
  .synergy-5icon li:nth-child(3)::before {
    display: none;
  }
  .synergy-5icon figure img {
    width: clamp(8rem, 18vw, 15rem);
  }
}
@media (max-width: 439px) {
  .l-inner:has(.synergy-5icon) {
    padding-inline: 0;
  }
}

/* CASE */
.sec-case {
  padding-block: var(--section-gap);
}
.sec-case h3 {
  text-align: center;
}
.sec-case .section-heading__en,
.case-head .section-heading__en {
  font-size: calc(clamp(5rem, 1rem + 7vw, 12.8rem) * .6);
  text-align: center;
}
.sec-case .section-heading.catch-grad {
  display: block;
  font-size: clamp(1.8rem, 0.7rem + 1.6vw, 3.2rem);
  color: var(--color-text-invert);
  line-height: 1.3;
  width: 100%;
  padding: 1rem;
  margin: var(--common-pad-m) auto;
  background: linear-gradient(90deg, var(--color-accent-dark) 0%, var(--color-accent-light) 100%);
}
.sec-case p {
  font-size: calc(var(--fs-ms) * 1.12);
  text-align: center;
  font-weight: var(--font-weight-bold);
}

.sec-case dl > div {
  border: 3px solid var(--color-accent-light);
}
.sec-case dl dt {
    font-size: calc(var(--fs-ms) * 1.12);
    font-weight: var(--font-weight-bold);
    text-align: center;
    line-height: 1.3;
    padding: calc(var(--common-pad-m) * .8);
    border-block-end: 3px solid var(--color-accent-light);
    display: grid;
    place-items: center;
    text-align: center;
}
.sec-case dl dd {
  padding: var(--fs-mm);
}
.sec-case dl dd ul {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.sec-case dl dd ul > li {
  width: calc((100% - 1rem) * .5);
}
.sec-case dl dd ul > li > img {
  margin: auto;
}
@media (max-width: 959px) {
  .sec-case > .l-inner {
    max-width: 640px;
  }
  .sec-case dl dd ul {
    flex-direction: column;
  }
  .sec-case dl dd ul > li {
    width: 100%;
  }  
}


.case-head p {
  color: var(--color-text-invert);
  font-size: calc(var(--fs-ms) * 1.12);
  text-align: center;
  font-weight: var(--font-weight-bold);
  line-height: 1.6;
}
.case-head h3 {
  color: var(--color-text-invert);
  text-align: center;
}
.case-head .section-heading.catch-grad {
  display: block;
  font-size: clamp(1.8rem, 0.7rem + 1.6vw, 3.2rem);
  color: var(--color-text-invert);
  line-height: 1.3;
  width: 100%;
  padding: 1rem;
  margin: var(--common-pad-m) auto;
  background: linear-gradient(90deg, var(--color-accent-dark) 0%, var(--color-accent-light) 100%);
  border: 3px solid var(--color-text-invert);
}



/* 8つのシナジー */
.l-inner.case-head + .l-inner {
  margin-top: calc(var(--section-gap) * 1);
}

.sec-s8synergy .section-heading__en,
.sec-s8synergy .com-heading {
  color: var(--color-text-invert);
}
.sec-s8synergy .com-heading span.sub {
  display: block;
  font-size: clamp(1.4rem, 0.4rem + 1.1vw, 2rem);
  margin-block-start: 1rem;
}
.sec-s8synergy dl.synergy8-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: clamp(2rem, 3vw, 4rem);
  row-gap: 3rem;
}
.synergy8-list > div {
  min-width: 0;
  background: var(--color-text-invert);
  box-shadow: var(--com-shadow);
}
.synergy8-list dt {
  color: var(--color-accent-dark);
  font-size: var(--fs-ms);
  font-weight: var(--font-weight-bold);
  line-height: 1.3;
  display: flex;
  align-items: stretch;
  gap: 1.5rem;
  background: #fff;
  border-block-end: 2px solid var(--color-main);
}
.synergy8-list dt > span.num {
  font-size: clamp(2.4rem, 1.5rem + 3.5vw, 6.4rem);
  flex-shrink: 0;
  line-height: 1;
  width: 1.4em;
  padding: 1.2rem 1rem 0;
  border-right: 2px solid var(--color-main);
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
.synergy8-list dt > span.txt {
  padding: .6rem 1rem .6rem 0;
  display: block;
  align-self: center;
}
.synergy8-list dd {
  min-width: 0;
  position: relative;
}
.synergy8-list .slider-wrap {
  width: 100%;
}
.synergy8-list .slider-item img {
  width: 100%;
  height: auto;
}

@media (max-width: 959px) {
  .sec-s8synergy dl.synergy8-list {
    grid-template-columns: 1fr;
    width: 100%;
    max-width: 640px;
    margin-inline: auto;
  }
}

/* スライダーコントロール */
.synergy8-list .slider-arrows {
  width: 100%;
  height: 5rem;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border: 3px solid var(--color-text-invert);
}
.synergy8-list .slider-arrows button.slick-arrow {
  appearance: none;
  width: calc(5rem - 6px);
  height: calc(5rem - 6px);
  padding: 0;
  border: 0;
  background: var(--color-accent-dark);
  cursor: pointer;
  position: relative;
  transition: background-color .3s ease;
}
.synergy8-list .slider-arrows button.slick-arrow:hover {
  background: var(--color-accent-light);
}
.synergy8-list button.slick-arrow.slick-prev {
  order: 1;
}
.synergy8-list button.slick-arrow.slick-next {
  order: 3;
}
.synergy8-list button.slick-arrow::before {
  content: "";
  position: absolute;
  top: 50%;
  width: 1.5rem;
  height: 1.5rem;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
}
.synergy8-list button.slick-prev::before {
  left: 62%;
  transform: translate(-50%, -50%) scaleX(1.5) rotate(-135deg);
}
.synergy8-list button.slick-next::before {
  left: 39%;
  transform: translate(-50%, -50%) scaleX(1.5) rotate(45deg);
}

.synergy8-list .slick-dots {
  display: flex !important;
  justify-content: center;
  align-items: center;
  gap: .8rem;
  margin: 0;
  padding: 0;
  list-style: none;
  order: 2;
}
.synergy8-list .slick-dots li {
  width: .8rem;
  height: .8rem;
  margin: 0;
  padding: 0;
  line-height: 0;
  flex: none;
}
.synergy8-list .slick-dots button {
  appearance: none;
  display: block;
  width: .8rem;
  height: .8rem;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: #ccc;
  font-size: 0;
  line-height: 0;
  cursor: pointer;
}
.synergy8-list .slick-dots .slick-active button {
  background: var(--color-accent-light);
}

/* 支援実績 */
.l-section.has-bg.sec-track-record {
  padding-block-end: 0;
}
.record-total {
  border-block: var(--base-border-thickness) solid var(--color-main);
  padding-block-end: 0;
  margin-block-end: calc(var(--section-gap) * .5);
}
.record-total dl {
  display: flex;
}
.record-total dl > div {
  border-inline-end: var(--base-border-thickness) solid var(--color-main);
  width: 25%;
  padding: 4rem 1rem 3rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2rem;
}
.record-total dl > div:first-child {
  border-inline: var(--base-border-thickness) solid var(--color-main);
}
.record-total dl dt {
  font-size: clamp(1.8rem, 1rem + .8vw, 2.4rem);
  font-weight: var(--font-weight-bold);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2rem;
}
.record-total dt img {
  width: clamp(8rem, 11vw, 15rem);
  height: auto;
  aspect-ratio: 1/1;
}
.record-total dl dd {
  display: flex;
  justify-content: space-between;
  align-items:center;
  gap: 1rem;
}
.record-total .totalnum {
  color: var(--color-accent-light);
  font-family: "Bebas Neue", sans-serif;
  font-size: clamp(6rem, 3rem + 4vw, 10rem);
  letter-spacing: -1px;
}
.record-total .unit {
  font-weight: var(--font-weight-bold);
  font-size: clamp(1.8rem, 1rem + 1.6vw, 3.6rem);
}
.record-total dl > div:not(:nth-child(2)) .unit {
  margin-bottom: -.7em;
}
.record-total .higher {
  font-size: var(--fs-mm);
}
.record-total dl > div:nth-child(2) .higher {
  display: block;
  line-height: 1.6;
}

@media (max-width: 959px) {
  .record-total dl {
    flex-wrap: wrap;
  }
  .record-total dl > div {
    width: 50%;
  }
  .record-total dl > div:nth-child(3) {
    border-inline: var(--base-border-thickness) solid var(--color-main);
  }
  .record-total dl > div:nth-child(-n+2) {
    border-block-end: var(--base-border-thickness) solid var(--color-main);
  }
  .record-total dl dt {
    font-size: clamp(1.6rem, 1.05rem + 1.5vw, 2.4rem);
  }
  .record-total dt img {
    width: clamp(8rem, 13vw, 17rem);
  }
  .record-total .totalnum {
    font-size: clamp(6rem, 3rem + 7vw, 12rem);
  }
  .record-total .unit {
    font-size: clamp(2rem, 0.9rem + 3vw, 3.6rem);
  }  
}

@media (max-width: 640px) {
  .record-total dl {
    flex-wrap: wrap;
    padding-inline: calc(var(--content-padding) * .5);
  }
  .record-total dl dt {
    letter-spacing: -1px;
  }
  .record-total dl dd {
      gap: .6rem;
  }  
}

/* 経営戦略 / 事業戦略 */
.sec-strategy .__bg-dgray {
  position: relative;
}
.sec-strategy .__bg-dgray::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: calc(100% - 1px);
  width: 100%;
  height: var(--edge-height);
  background: #333;

  clip-path: polygon(
    0 0,
    18% 0,
    26% 100%,
    56% 100%,
    60% 0,
    100% 0,
    100% 100%,
    0 100%
  );
}
@media (max-width: 768px) {
  .sec-strategy .__bg-dgray::before {
    clip-path: polygon(
      0 0,
      32% 0,
      50% 100%,
      100% 100%,
      0 100%
    );
  }
}
.sec-strategy .__bg-dgray::after {
  content: "";
  position: absolute;
  left: 0;
  top: calc(100% - 1px);
  width: 100%;
  height: var(--edge-height);
  background: var(--color-dgray);
  z-index: 2;
  clip-path: polygon(
    0 0,
    68% 0,
    76% 100%,
    100% 100%,
    100% 0
  );
}

.sec-strategy .sub-strategy.--h3 {
  color: var(--color-text-invert);
  font-size: var(--fs-ls);
  padding-inline-start: 2rem;
  margin-block-end: calc(var(--section-gap) * .5);
  border-left: 9px solid var(--color-accent-light);
}
.sec-strategy .-bg-icon {
  position: relative;
  overflow: clip;
  padding-block: var(--section-gap);
}
.sec-strategy .-bg-icon::before {
  display: block;
  content: "";
  width: 86vw;
  height: auto;
  aspect-ratio: 100 / 51;
  background: url(../img/0701BF_inshoku.consulting_Used_Creative_logo-icon.svg) center center no-repeat;
  background-size: cover;
  position: absolute;
  left: -13%;
  top: calc(var(--section-gap)* 2);
  filter: var(--filter-invert-to-white);
  opacity: .05;
  transform: rotate(-146deg);
  transform-origin: center;
}
@media (min-width: 1921px) {
  .sec-strategy .-bg-icon::before {
    width: 80vw;
    top: calc(var(--section-gap)* 3);
  }
}
@media (min-width: 769px) and (max-width: 1280px) {
  .sec-strategy .-bg-icon::before {
    top: calc(var(--section-gap)* 2);
    width: 96vw;
  }
}
@media (max-width: 768px) {
  .sec-strategy .-bg-icon {
  padding-block: var(--section-gap);
}
  .sec-strategy .-bg-icon::before {
    transform: rotate(-146deg);
    top: calc(var(--section-gap)* 2.2);
    width: 140vw;
  }
}

/* ループスライダー */
.js-loop-slick figure {
  margin: 0;
}
.__loop-client .img-wrap {
  position: relative;
}
.__loop-client .img-wrap::after {
  content: "";
  position: absolute;
  inset: 0;
  border-block: var(--base-border-thickness) solid var(--color-text-invert);
  border-inline-end: 3px solid var(--color-text-invert);
  pointer-events: none;
}
.__loop-client .img-wrap img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1;
}
.js-loop-slick figure figcaption {
  color: var(--color-text-invert);
  font-size: clamp(1.3rem, 0.8rem + 1vw, 1.6rem);
  font-weight: var(--font-weight-sbold);
  line-height: 1.2;
  border-left: 8px solid var(--color-accent-light);
  padding-left: 1rem;
  margin-block-start: 1.5rem;
}
.js-loop-slick figure figcaption span {
  display: block;
}
.__loop-client + .__loop-client {
  margin-block-start: calc(var(--section-gap)* .5);
}

@media (min-width: 1280px) {
  .js-loop-slick figure figcaption {
    font-size: 1.8rem;
  }
}


/* 出店戦略 / 不動産戦略 */
.sec-strategy.--estate {
  padding-block: var(--section-gap);
  background: var(--color-text-invert);
  position: relative;
}
.sec-strategy.--estate .sub-strategy.--h3 {
  color: var(--color-main);
}
.sec-strategy.--estate::after {
    content: "";
    position: absolute;
    left: 0;
    top: calc(100% - 1px);
    width: 100%;
    height: var(--edge-height);
    background: var(--color-text-invert);
    clip-path: polygon(
      0 0,
      40% 0,
      48% 100%,
      100% 100%,
      100% 0
    );
}

/* ループスライダー */
.sec-strategy.--estate .__loop-client .img-wrap::after {
  border-block: var(--base-border-thickness) solid var(--color-main);
  border-inline-end: var(--base-border-thickness) solid var(--color-main);
}
.sec-strategy.--estate .js-loop-slick figure figcaption {
  color: var(--color-main);
}
@media (max-width: 959px) {
  .sec-strategy.--estate {
    padding-block: calc(var(--section-gap) + var(--edge-height)) var(--section-gap);
  }
}
@media (max-width: 768px) {
  .sec-strategy.--estate::after {
    clip-path: polygon(
      0 0,
      50% 0,
      68% 100%,
      100% 100%,
      100% 0
    );
  }
}


/* 出店戦略 / 不動産戦略 */
.sec-strategy.--promotion {
  padding-block-start: 0;
}
.sec-strategy.--promotion .has-bg.__bg-beige {
  padding-block-end: calc(var(--section-gap) + var(--edge-height));
}
.sec-strategy.--promotion .sub-strategy.--h3 {
  color: var(--color-main);
}

/* 集客戦略 / 販促戦略 */
.sec-strategy.--promotion .ad {
  display: grid;
  grid-template-columns: repeat(2, minmax(0px, 1fr));
  column-gap: clamp(2rem, 3vw, 4rem);
  row-gap: 3rem;
}
.sec-strategy.--promotion .ad > div {
  background: var(--color-text-invert);
  border: 3px solid var(--color-accent-light);
}
.sec-strategy.--promotion .ad dt {
  font-size: calc(var(--fs-ms) * 1.12);
  font-weight: var(--font-weight-bold);
  text-align: center;
  line-height: 1.3;
  padding: calc(var(--common-pad-m) * .8);
  border-block-end: 3px solid var(--color-accent-light);display: grid;
  place-items: center;
  text-align: center;
}
.sec-strategy.--promotion .ad dd {
  padding: 1rem;
}
@media (max-width: 959px) {
  .sec-strategy.--promotion .ad {
    grid-template-columns: 1fr;
    width: 100%;
    max-width: 640px;
    margin-inline: auto;
  }
}

.sec-strategy.--promotion .platform {
  margin-block-start: clamp(2rem, 3vw, 4rem); 
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.sec-strategy.--promotion .platform > div {
  display: grid;
  grid-template-rows: auto 1fr;
}
.sec-strategy.--promotion .platform > div:nth-child(n + 5) {
  margin-block-start: var(--common-pad-ml);
}
.sec-strategy.--promotion .platform dt {
  grid-row: 2;
  height: 100%;
  margin-block-start: 1rem;
}
.sec-strategy.--promotion .platform dt p {
  font-size: var(--fs-mm);
  font-weight: var(--font-weight-sbold);
  line-height: 1.2;
  border-left: 8px solid var(--color-accent-light);
  padding: .7rem 0 .7rem 1rem;
}
.sec-strategy.--promotion .platform dt span {
  font-size: calc(clamp(1.3rem, 0.8rem + 1vw, 1.8rem) * .7);
}
.sec-strategy.--promotion .platform dd {
  position: relative;
  grid-row: 1;
}
.sec-strategy.--promotion .platform dd::after {
  content: "";
  position: absolute;
  inset: 0;
  border-block: 3px solid var(--color-accent-light);
  border-right: 3px solid var(--color-accent-light);
  pointer-events: none;
}
.sec-strategy.--promotion .platform > div:nth-child(4n + 1) dd::after {
  border-left: 3px solid var(--color-accent-light);
}
.sec-strategy.--promotion .platform dd img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1/1;
}

@media (max-width: 959px) {
  .sec-strategy.--promotion .platform {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
    max-width: 640px;
    margin-inline: auto;
  }
  .sec-strategy.--promotion .platform > div:nth-child(n + 3) {
      margin-block-start: var(--common-pad-ml);
  }  
  .sec-strategy.--promotion .platform > div:nth-child(odd) dd::after {
    border-left: 3px solid var(--color-accent-light);
  }
}
@media (max-width: 768px) {
  .sec-strategy.--promotion .platform dt p {
    border-left: 6px solid var(--color-accent-light);
    padding: .7rem 0 .7rem .6rem;
    white-space: nowrap;
  }
  .sec-strategy.--promotion .platform dt p span {
    display: inline-block;
    margin-inline-start: -.4rem;
  }

}

/* ご支援形態・料金形態 */
.sec-pricing .has-bg.__bg-dgray {
  position: relative;
  background-image: url(../img/0701BF_inshoku.consulting_Used_Creative_bg-dots.png);
  background-repeat: repeat;
  background-size: 45px 47px;
  background-position: left top;
  padding-block: var(--section-gap);
}
.sec-pricing .has-bg.__bg-dgray::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: calc(100% - 1px);
  width: 100%;
  height: var(--edge-height);

  background-color: var(--color-dgray);
  background-image: url(../img/0701BF_inshoku.consulting_Used_Creative_bg-dots.png);
  background-repeat: repeat;
  background-size: 45px 47px;
  background-position: left 90%;

  clip-path: polygon(
    0 0,
    18% 0,
    26% 100%,
    56% 100%,
    60% 0,
    100% 0,
    100% 100%,
    0 100%
  );
}

@media (max-width: 959px) {
  .sec-pricing .has-bg.__bg-dgray,
  .sec-pricing .has-bg.__bg-dgray::before {
    background-size: 36px 38px;
  }
  .sec-pricing .has-bg.__bg-dgray::before {
    background-position: left 17%;
  }
}
@media (max-width: 768px) {
  .sec-pricing .has-bg.__bg-dgray::before {
    clip-path: polygon(
      0 100%,
      30% 100%,
      44% 0,
      100% 0,
      100% 100%
    );
  }
}

.sec-pricing .section-heading__en,
.sec-pricing .com-heading {
  color: var(--color-text-invert);
}
.sec-pricing .sec-catch {
  color: var(--color-text-invert);
  line-height: 1.6;
}

.sec-pricing .intro-img {
  display: flex;
  border: var(--base-border-thickness) solid var(--color-text-invert);
  margin-block: var(--common-pad-ml);
}
.sec-pricing .intro-img li {
  width: 50%;
  position: relative;
}
.sec-pricing .intro-img li:first-child:after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-right: var(--base-border-thickness) solid var(--color-text-invert)
}
.sec-pricing .sec-catch {
  font-weight: var(--font-weight-sbold);
}
.sec-pricing .sec-catch .deco-wrap {
  display: inline-block;
  margin-block: 2rem;
}
.sec-pricing .sec-catch .deco-wrap .deco-border-box {
  color: var(--color-text-invert);
  border: var(--base-border-thickness) solid var(--color-text-invert);
}
.sec-pricing .consulting {
  display: grid;
  grid-template-columns: repeat(2, minmax(0px, 1fr));
  column-gap: clamp(2rem, 3vw, 4rem);
  row-gap: 3rem;
  margin-block-start: var(--common-pad-ml);
}
@media (max-width: 959px) {
  .sec-pricing .sec-catch {
    font-size: calc(clamp(2.1rem, 0.7rem + 1.6vw, 3.2rem) * .9);
  }
  .sec-pricing .consulting {
    grid-template-columns: 1fr;
    width: 100%;
    max-width: 640px;
    margin-inline: auto;
  }
}

.sec-pricing .consulting-card__lead {
  color: var(--color-text-invert);
  font-size: var(--fs-ms);
  font-weight: var(--font-weight-sbold);
  text-align: center;
  margin-block-end: 1rem;
}
.sec-pricing .consulting-card__wrap {
  color: var(--color-text-invert);
  border: var(--base-border-thickness) solid var(--color-text-invert);
}

.sec-pricing .consulting-card .consulting-card__heading {
  font-size: var(--fs-ml);
  font-weight: var(--font-weight-bold);
  line-height: 1.3;
  display: flex;
  align-items: stretch;
  gap: 1rem;
  border-block-end: var(--base-border-thickness) solid var(--color-text-invert);
}

.sec-pricing .consulting-card .consulting-card__heading > span.consulting-card__num {
  font-family: "Bebas Neue", sans-serif;
  font-size: clamp(2.4rem, 1.5rem + 3.5vw, 6.4rem);
  font-weight: 400;
  flex-shrink: 0;
  line-height: 1;
  width: 1.4em;
  padding: 1.6rem 1rem .6rem;
  border-right: var(--base-border-thickness) solid var(--color-text-invert);
  display: flex;
  justify-content: flex-end;
  align-items: center;
}

.sec-pricing .consulting-card .consulting-card__heading .card-title {
  flex-grow: 1;
  text-align: center;
  padding: .8rem 1rem .8rem 0;
  align-self: center;
}
@media (min-width: 1800px) {
  .sec-pricing .consulting-card:nth-child(3) .consulting-card__heading .card-title {
    letter-spacing: -3px;
  }
}

.sec-pricing .consulting-card .consulting-card__catch {
  font-size: var(--fs-ml);
  font-weight: var(--font-weight-sbold);
  text-align: center;
  padding: 1.8rem 1rem;
  align-self: center;
  background: var(--color-accent-dark);
  border-bottom: var(--base-border-thickness) solid var(--color-text-invert);
}
.sec-pricing .consulting-card .consulting-card__price {
  color: var(--color-accent-yellow);
  font-size: var(--fs-ml);
  font-weight: var(--font-weight-sbold);
  text-align: center;
  line-height: 1.4;
  padding: 2rem 1rem;
  position: relative;
}
.sec-pricing .consulting-card .consulting-card__price::after {
  display: block;
  content: "";
  width: calc(100% - (var(--content-padding)*2));
  height: var(--base-border-thickness);
  background: var(--color-text-invert);
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}
.sec-pricing .consulting-card .consulting-card__content{
  font-size: var(--fs-ms);
  font-weight: var(--font-weight-sbold);
  padding: calc(var(--content-padding)* 1.3) 1rem;
}

.sec-pricing .consulting-card .consulting-card__content > p {
  text-align: center;
  line-height: 1.6;
}
.sec-pricing .consulting-card .consulting-card__list {
  margin-block-start: calc(var(--content-padding)* 1.3);
  width: fit-content;
  margin-inline: auto ;
}
.sec-pricing .consulting-card .consulting-card__list > div {
  display: flex;
  gap: 2rem;
}
.sec-pricing .consulting-card .consulting-card__list > div + div {
  margin-block-start: 1rem;
}
.sec-pricing .consulting-card .consulting-card__list dt {
  text-align: center;
  width: 5em;
  padding: 1rem .5rem;
  border: var(--base-border-thickness) solid var(--color-text-invert);
}
.sec-pricing .consulting-card:nth-child(n+3) .consulting-card__list dt {
  color: var(--color-accent-yellow);
  border: var(--base-border-thickness) solid var(--color-accent-yellow);
}
.sec-pricing .consulting-card .consulting-card__list dd {
  align-self: center;
}

@media (max-width: 768px) {
  .sec-pricing .consulting-card .consulting-card__list > div {
    gap: 1rem;
  }
}

/* CTA */
.cta {
  --corner-size: 6rem;
  --corner-width: 5px;
  position: relative;
  background: var(--color-text-invert);
  padding: var(--common-pad-ml) var(--common-pad-m);
  margin-block-start: var(--common-pad-ml);
  display: flex;
}

/* 四隅の縦線 */
.cta::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;

  background:
    linear-gradient(var(--color-accent-light), var(--color-accent-light))
      left top / var(--corner-width) var(--corner-size) no-repeat,
    linear-gradient(var(--color-accent-light), var(--color-accent-light))
      right top / var(--corner-width) var(--corner-size) no-repeat,
    linear-gradient(var(--color-accent-light), var(--color-accent-light))
      left bottom / var(--corner-width) var(--corner-size) no-repeat,
    linear-gradient(var(--color-accent-light), var(--color-accent-light))
      right bottom / var(--corner-width) var(--corner-size) no-repeat;
}
/* 四隅の横線 */
.cta::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;

  background:
    linear-gradient(var(--color-accent-light), var(--color-accent-light))
      left top / var(--corner-size) var(--corner-width) no-repeat,
    linear-gradient(var(--color-accent-light), var(--color-accent-light))
      right top / var(--corner-size) var(--corner-width) no-repeat,
    linear-gradient(var(--color-accent-light), var(--color-accent-light))
      left bottom / var(--corner-size) var(--corner-width) no-repeat,
    linear-gradient(var(--color-accent-light), var(--color-accent-light))
      right bottom / var(--corner-size) var(--corner-width) no-repeat;
}
.cta > div {
  width: 50%;
}
.cta > div:first-child {
  padding-inline-end: var(--common-pad-m);
  border-right: 4px solid var(--color-accent-light);
}
.cta > div:last-child {
  padding-inline-start: var(--common-pad-m);
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 3rem;
}
@media (max-width: 959px) {
  .cta{
    width: 100%;
    max-width: 640px;
    margin-inline: auto;
    flex-direction: column;
  }
  .cta > div {
    width: 100%;
  }
  .cta > div:first-child {
    padding-inline-end:0;
    padding-block-end: var(--common-pad-m);
    border-right: 0;
    border-bottom: 2px solid var(--color-accent-light);
  }
  .cta > div:last-child {
    padding-inline-start: 0;
    padding-block-start: var(--common-pad-m);
  }
}

.cta .cta-title {
  font-size: calc(var(--fs-hero-catch) * 1.4);
  text-align: center;
  font-weight: var(--font-weight-bold);
}
.cta .cta-title .-initialprice {
  color: var(--color-accent-light);
  font-size: calc(var(--fs-hero-catch) * 2);
  padding-inline: 1rem;
}
.cta .cta-title .unit {
  color: var(--color-accent-light);
  font-size: calc(var(--fs-ml) * 2);
}
.cta ul {
  width: fit-content;
  margin-inline: auto;
  text-align: left;
}
.cta ul li {
  font-size: var(--fs-ml);
  font-weight: var(--font-weight-bold);
  white-space: nowrap;
  display: flex; 
  align-items: center;
  gap: 1.5rem;
}
@media (max-width: 959px) {
  .cta ul li {
    white-space: revert;
    line-height: 1.2;
  }
}
.cta ul li::before {
  display: block;
  content: "";
  width: var(--common-pad-ml);
  height: auto;
  aspect-ratio: 1/1;
  flex-shrink: 0;
}
.cta ul.outline {
  margin-block-start: 2rem;
}
.cta ul.outline li:first-child::before {
  background: url(../img/0701BF_inshoku.consulting_Used_Creative_ico-clock.svg) center center no-repeat;
  background-size: contain;
}
.cta ul.outline li:nth-child(2)::before {
  background: url(../img/0701BF_inshoku.consulting_Used_Creative_ico_calender.svg) center center no-repeat;
  background-size: contain;
}
.cta ul li + li {
  margin-block-start: 1rem;
}
.cta ul.outline li p {
  display: flex;
  align-items: center;
}
.cta ul.outline li p span {
  display: inline-block;
  color: var(--color-accent-light);
  text-align: right;
  font-size: calc(var(--fs-ml) * 2);
  margin-inline: calc(var(--common-pad-m) * .5);
  width: 2.5em;
}
.cta ul.support {
  justify-content: flex-start;
}
@media (min-width: 1501px){
  .cta ul.support li {
    font-size: calc(var(--fs-ml) * .9);
  }
}
@media (min-width: 1801px){
  .cta ul.support li {
    font-size: calc(var(--fs-ml) * .8);
  }
}
.cta ul.support li::before {
  background: url(../img/0701BF_inshoku.consulting_Used_Creative_ico_check.svg) center center no-repeat;
  background-size: contain;
}

.cta .contactBtn {
  font-size: var(--fs-ml);
  background: linear-gradient(
    90deg,
    var(--color-accent-dark) 0%,
    var(--color-accent-light) 100%
  );
  padding-block: calc(var(--common-pad-m)* 1.5);
  min-height: 70px;
}
@media (max-width: 768px) {
  .cta .contactBtn {
      width: 100%;
  }
}

/* “8”（エイト）シナジーとは？ */
.sec-whatis .com-heading span.sub {
  display: block;
  font-size: clamp(1.4rem, 0.4rem + 1.1vw, 2rem);
  letter-spacing: 0;
  margin-block-start: 1rem;
}
.sec-whatis.--synergy .sec-catch {
  line-height: 1.6;
}
.sec-whatis.--synergy .sec-catch.catch-grad span {
  color: var(--color-text-invert);
  width: fit-content;
}
@media (min-width: 641px) {
  .sec-whatis.--synergy .sec-catch.catch-grad {
    text-align: center;
  }
  .sec-whatis.--synergy .sec-catch.catch-grad span.pcwrap {
    display: block;
    padding: 1rem 3rem;
    margin-inline: auto;
    background: linear-gradient(
      90deg,
      var(--color-accent-dark) 0%,
      var(--color-accent-light) 100%
    );
  }
  .sec-whatis.--synergy .sec-catch.catch-grad span.pcwrap + .pcwrap {
    margin-block-start: 1rem;
  }
  .sec-whatis.--synergy .sec-catch.catch-grad span.pcwrap.-adjust-punctuation {
    padding-inline-end: 1rem;
    display: flex;
  }
}
@media (max-width: 640px) {
  .sec-whatis.--synergy .sec-catch {
    width: fit-content;
    margin-inline: auto;
  }
  .sec-whatis.--synergy .sec-catch.catch-grad span.spwrap {
    display: block;
    padding: 1rem 2rem;
    background: linear-gradient(
      90deg,
      var(--color-accent-dark) 0%,
      var(--color-accent-light) 100%
    );
  }
  .sec-whatis.--synergy .sec-catch.catch-grad span.pcwrap + .pcwrap,
  .sec-whatis.--synergy .sec-catch.catch-grad span.spwrap + .spwrap {
    display: block;
    margin-block-start: 1rem;
  }
  .sec-whatis.--synergy .sec-catch.catch-grad span.spwrap.-adjust-punctuation {
    padding-inline-end: 1rem;
  }
}

/* コンサルティング サイエンスの違い */
/* 共通部分 */
.sec-whatis.--science {
  padding-block: 0;
} 
.--science-contents {
  margin-block-start: calc(var(--section-gap) * .5);
  display: flex;
  align-items: center;
  gap: 4%;
}
.--science-contents > div.flow {
  width: 54%;
  padding-inline-start: calc(var(--common-pad-m) * .8);
}
.--science-contents  div.flow-figure-box {
  width: 100%;
  height: auto;
  position: relative;
}
.--science-contents > div.list-box {
  width: 42%;
}
.--science-contents  div.flow-figure-box > img {
  width: 100%;
  height: auto;
  object-fit: cover;
}
.--science-contents > div.flow ul li {
  position: absolute;
}
@media (max-width:959px) {
  .--science-contents {
    margin-block-start: calc(var(--section-gap) * .8);
    flex-direction: column;
    gap: calc(var(--common-pad-ml) * 1.5);
  }
  .--science-contents > div.flow,
  .--science-contents > div.list-box {
    width: 100%;
    max-width: 640px;
    padding-inline-start: 0;
    margin-inline: auto;
  }
}
.flow__list {
  counter-reset: flow-num;
  list-style: none;
}
.flow__list li {
  counter-increment: flow-num;
  display: flex;
  align-items: center;
  gap: 1rem;
  position: absolute;
}
.flow__list li::before {
  font-family: "Bebas Neue", sans-serif;
  font-size: 3.4rem;
  font-weight: 500;
  line-height: 3.4rem;
  content: counter(flow-num);
  display: grid;
  place-items: center;
  width: 3.2rem;
  height: 3.2rem;
  border-radius: 50%;
}
.flow__list li p {
  font-size: var(--fs-ms);
  font-size: clamp(1.4rem, 0.4rem + 1.1vw, 2rem);
  font-weight: var(--font-weight-sbold);
  line-height: 1.4;
  letter-spacing: -1px;
}
.list-box {
  width: 100%;
}
.list-box .list-title {
  font-family: "Bebas Neue", sans-serif;
  color: var(--color-text-invert);
  font-size: calc(var(--fs-mm) * 2.1);
  font-weight: 400;
  letter-spacing: 1px;
  background: var(--color-accent-dark);
  display: flex;
  align-items: center;
  padding: .8rem var(--fs-ml) .4rem;
  margin-bottom: 1rem;
}
.list-box .list-title .ruby {
  font-family: "Noto Sans JP", sans-serif;
  font-size: var(--fs-mm);
  letter-spacing: -1px;
}
.list-box .list-content {
  padding-inline: var(--fs-ms);
  border: var(--base-border-thickness) solid var(--color-main);
}
.list-box .list-content li {
  font-size: var(--fs-ms);
  line-height: 1;
  padding: 1.6rem 0 1.6rem 2.55rem;
  position: relative;
}
.list-box .list-content li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  width: 1.2rem;
  height: 1.2rem;
  border-radius: 50%;
  background: var(--color-accent-dark);
}
.list-box .list-content li:not(:last-child) {
  border-bottom: 2px dotted var(--color-dgray);
}
@media (min-width: 1201px) {
  .uptonow .flow__list li:first-child {
    top: -1rem;
    right: 29%;
  }
}
@media (max-width: 959px) {
  .flow__list li::before {
    font-size: 3.2rem;
    width: 3rem;
    height: 3rem;
  }  
}
@media (max-width: 640px) {
  .flow__list li {
    gap: .5rem;
  }  
  .flow__list li::before {
    font-size: 2.8rem;
    line-height: 2.8rem;
    width: 2.5rem;
    height: 2.5rem;
  } 
}

/* 従来のコンサルティング */
.uptonow .seb-title {
    font-size: var(--fs-ls);
    padding-inline-start: 2rem;
    margin-block-end: var(--common-pad-ml);
    border-left: 9px solid var(--color-accent-light);
}
.uptonow .seb-title + p {
  font-size: var(--fs-ms);
  font-weight: var(--font-weight-sbold);
  line-height: 1.6;
}
.uptonow .flow__list li::before {
  color: var(--color-accent-dark);
  border: 1px solid var(--color-accent-dark);
}
.uptonow .flow__list li:first-child {
  top: -2rem;
  right: 27%;
}
.uptonow .flow__list li:nth-child(2) {
  top: 44%;
  left: 28%;
}
.uptonow .flow__list li:nth-child(3) {
  bottom: -1.5rem;
  left: 35%;
}
.uptonow .flow__list li:first-child::before {
  padding-right: 2px;
}
@media (min-width: 1201px) {
  .uptonow .flow__list li:first-child {
    top: -1rem;
    right: 29%;
  }
}
@media (max-width: 959px) {
  .uptonow .flow__list li:first-child {
    top: 0rem;
    right: 34%;
  }  
  .uptonow .flow__list li:nth-child(2) {
    top: 46%;
    left: 32%;
  }  
  .uptonow .flow__list li:nth-child(3) {
    bottom: 0;
  }
}
@media (max-width: 640px) {
  .uptonow .flow__list li:first-child::before {
    padding-right: 0;
    padding-bottom: 2px;
  }  
  .uptonow .flow__list li:first-child {
    top: -1rem;
    right:32%;
  }
  .uptonow .flow__list li:nth-child(2) {
    top: 45%;
    left: 32%;
  }  
  .uptonow .flow__list li:nth-child(3) {
    bottom: -1rem;
    left: 32%;
  }  
}
@media (max-width: 520px) {
  .uptonow .flow__list li:first-child {
    top: -1.5rem;
    right: 26%;
  }
}

/* コンサルティング サイエンス */
.c-science {
  padding-block-end: var(--section-gap);
 margin-block-start: calc(var(--section-gap) + (var(--fs-hero-catch) *.8));
 background: var(--color-text-invert);
}
.c-science .c-science-title {
  color: var(--color-text-invert);
  font-size: var(--fs-ls);
  letter-spacing: -1px;
  background: linear-gradient(90deg, var(--color-accent-dark) 0%, var(--color-accent-light) 100%);
  padding: var(--fs-ms) 1rem;
  transform: translateY(-50%);
  margin-block-end: calc(var(--fs-ls) * -1);
}
.c-science .c-science-title span {
  text-align: center;
  line-height: 1.3;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 2rem;
}
.c-science .c-science-title span::before {
  display: block;
  content: "";
  width: clamp(5rem, 3rem + 2.5vw, 10rem);
  height: auto;
  aspect-ratio: 100 / 51;
  background: url(../img/0701BF_inshoku.consulting_Used_Creative_logo-icon.svg) center center no-repeat;
  background-size: cover;
  filter: var(--filter-invert-to-white);
}
.c-science .c-science-title + .sec-catch {
  margin-block-start: var(--common-pad-ml);
  font-size: var(--fs-mm);
}
.c-science .list-box .list-title {
  background: var(--color-accent-light);
}
.c-science .flow__list li::before {
  color: var(--color-text-invert);
  background: var(--color-accent-light);
}
.c-science .flow__list li:first-child {
  top: -3rem;
  right: 30%;
}
.c-science .flow__list li:first-child::before {
  padding-right: 1px;
}
.c-science .flow__list li:nth-child(2) {
  top: 29%;
  left: -1.5%;
} 
.c-science .flow__list li:nth-child(3) {
  top: 69%;
  left: -1.5%;
} 
.c-science .flow__list li:nth-child(4) {
  top: 63%;
  right: 0%;
} 
.c-science .flow__list li:nth-child(5) {
  top: 23%;
  right: 2.5%;
} 
.c-science .flow__list li:nth-child(6) {
  color: var(--color-text-invert);
  line-height: 1.3;
  width: fit-content;
  top: 18%;
  right: 34.5%;
  padding: 1rem 1.6rem 1rem 1rem;
  border-radius: var(--fs-ms);
  background: var(--color-accent-light);
  gap: .5rem;
} 

@media (max-width: 959px) {
  .c-science .flow__list li:first-child {
    top: -2rem;
    right: 33%;
  }
  .c-science .flow__list li:nth-child(2) {
    top: 30%;
    left: 0;
  } 
  .c-science .flow__list li:nth-child(3) {
    top: 70%;
    left: 0;
  } 
  .c-science .flow__list li:nth-child(4) {
    top: 64%;
    right: 0%;
  } 
  .c-science .flow__list li:nth-child(5) {
    top: 24%;
    right: 2.5%;
  }
  .c-science .flow__list li:nth-child(6) {
    right: 37.5%;
  }
}

@media (max-width: 600px) {
  .flow__list li p {
    font-size: 1.3rem;
    line-height: 1.2;
  }
  .c-science .flow__list li:nth-child(6) {
    top: 17%;
  }  
}
@media (max-width: 520px) {
  .c-science .c-science-title span {
    font-size: 1.8rem;
    gap: 1rem;
  }
  .c-science .flow__list li:first-child {
    right: 25%;
  }  
  .c-science .flow__list li:nth-child(6) {
    padding:.5rem 1rem .5rem .5rem;
    top: 16.5%;
    right: 28.5%;
  }
  .c-science .flow__list li:nth-child(2) {
    top: 28.5%;
    left: -1rem;
  }
  .c-science .flow__list li:nth-child(3) {
    top: 68.5%;
    left: -1rem;
  }
  .c-science .flow__list li:nth-child(4) {
    top: 62.2%;
    right: -1rem;
  }
  .c-science .flow__list li:nth-child(5) {
    top: 23%;
    right: -.5rem;
  }  
}

/* 必要な理由 */
.l-section.has-bg.sec-reason {
  padding-block-end: 0;
}
.sec-reason .com-heading span.sub {
    display: block;
    font-size: clamp(1.4rem, 0.4rem + 1.1vw, 2rem);
    margin-block-start: 1rem;
}
.sec-reason .sub-heading {
  font-size: var(--fs-ls);
  text-align: center;
  padding: 1.6rem 1rem 1.8rem;
  background: var(--color-text-invert);
  border: calc(var(--base-border-thickness) * 2) solid var(--color-main);
}
.sec-reason .sub-heading span {
  font-size: calc(var(--fs-mm) * 1.8);
  color: var(--color-accent-light);
  display: inline-block;
  margin-inline-start: 1rem;
}
@media (max-width: 959px) {
 .sec-reason .sub-heading span {
    margin-inline-start: 0;
  }
}

.l-inner:has(.data-statistics) {
  position: relative;
  z-index: 1
}
.data-statistics {
  display: flex;
  margin-block-start: 2rem;
  background: var(--color-text-invert);
  border: var(--base-border-thickness) solid var(--color-main);
}
.data-statistics > div:first-child {
  border-right: var(--base-border-thickness) solid var(--color-main);
}
.data-statistics .data-heading {
  font-size: var(--fs-mm);
  text-align: center;
  font-weight: var(--font-weight-bold);
  padding: 2.2rem 1rem;
  border-bottom: var(--base-border-thickness) solid var(--color-main);
}
.data-statistics .data-heading:has(span) {
  padding: 1.5rem 1rem;
}
.data-statistics .data-heading > span {
  display: block;
  font-size: var(--fs-ms);
  font-weight: 400;
  letter-spacing: -1px;
  margin-block-end: .8rem;
}

.data-statistics figure {
  padding: 1rem;
}
.data-statistics figure figcaption {
  font-size: var(--fs-ms);
  text-align: right;
  margin-block-start: 1rem;
}

@media (max-width: 959px) {
  .sec-reason .sub-heading {
    font-size: calc(var(--fs-ls) * .9);
    width: 100%;
    max-width: 640px;
    padding: 1.2rem .5rem;
    margin-inline: auto;
    line-height: 1.3;
  }
  .data-statistics {
    display: block;
    width: 100%;
    max-width: 640px;
    margin: 1rem auto 0;
  }
  .data-statistics > div:first-child {
    border-right: 0;
    border-bottom: var(--base-border-thickness) solid var(--color-main);
  }
}

.data-summary {
  position: relative;
  background-image: url(../img/0701BF_inshoku.consulting_Used_Creative_bg-dots.png);
  background-repeat: repeat;
  background-size: 45px 47px;
  background-position: left top;
  padding-block: var(--section-gap);
  z-index: 0;
}
.data-summary::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 100%;
  height: 10rem;

  background-color: var(--color-dgray);
  background-image: url(../img/0701BF_inshoku.consulting_Used_Creative_bg-dots.png);
  background-repeat: repeat;
  background-size: 45px 47px;
  background-position: left 99%;
  z-index: -1;
}
@media (max-width: 959px) {
  .data-summary,
  .data-summary::before {
      background-size: 36px 38px;
  }
}

.stores-wrap {
  display: flex;
}
.stores-wrap .summary-heading {
  color: var(--color-text-invert);
  font-size: var(--fs-ml);
  font-weight: var(--font-weight-bold);
  text-align: center;
  margin-block: 0 var(--fs-mm);
}
.stores-wrap .summary-heading span {
  display: block;
  font-size: var(--fs-ms);
  font-weight: 400;
  margin-block-end: .8rem;  
}

@media (min-width: 960px) {
 .stores-wrap > div:first-child .data-statistics {
    border-right: var(--base-border-thickness) solid var(--color-main);
 }
}
@media (max-width: 959px) {
  .among-stores + .among-stores {
    margin-top: calc(var(--section-gap) * .5);
  }
  .stores-wrap {
      display: block;
      width: 100%;
      max-width: 640px;
      margin: 1rem auto 0;
  }
}

.among-stores .data-statistics,
.among-stores .data-statistics > div {
  border: 0;
}
.data-statistics .data-heading span.sub {
  line-height: 1.2;
}
.data-statistics .data-heading span.main {
  display: inline-block;
  font-size: var(--fs-mm);
  text-align: center;
  font-weight: var(--font-weight-bold);
  margin-block: 0;
}
.data-statistics .data-heading span.main > span {
  display: inline-block;
  color: var(--color-accent-light);
  font-size: calc(var(--fs-mm) * 1.4);
  font-weight: var(--font-weight-bold);
  margin: 0 0 0 1rem;
}

/* 「出会えたら“奇跡”」 */
.shortage-title {
  color: var(--color-text-invert);
  font-size: var(--fs-ls);
  text-align: center;
  line-height: 1.3;
}
.shortage-title span.deco {
  color: var(--color-text-invert);
  display: block;
  width: fit-content;
  padding: 1.5rem 1rem;
  margin: var(--fs-ls) auto 0;
  border: 2px solid var(--color-text-invert);
  background: linear-gradient(90deg, var(--color-accent-dark) 0%, var(--color-accent-light) 100%);
}

.shortage-flow {
  margin-block-start: var(--common-pad-ml);
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 var(--fs-mm);
}
.shortage-flow > ul {
  display: grid;
  grid-template-rows: subgrid;
  grid-row: span 3;
  gap: calc(var(--common-pad-ml) * 72 / 45 + 2rem) 0;
}

.shortage-flow > ul > li {
  color: var(--color-text-invert);
  display: flex;
  justify-content: center;
  align-items: center;
  border: 2px solid var(--color-text-invert);
  position: relative;
  padding: var(--fs-mm) 1rem;
}
.shortage-flow > ul > li:not(:last-child)::after {
  content: "";
  width: var(--common-pad-ml);
  aspect-ratio: 45/72;
  background: url(../img/0701BF_inshoku.consulting_Used_Creative_icon_arrow.svg) center center no-repeat;
  background-size: contain;
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  margin: auto;
}
.shortage-flow li:has(.result) {
  border: 2px solid var(--color-accent-yellow);
}

.shortage-flow > ul > li p {
  font-size: calc(var(--fs-mm) * .83);
  font-weight: var(--font-weight-bold);
  line-height: 1.6;
  text-align: center;
}
@media (max-width: 959px) {
  .shortage-flow {
    grid-template-columns: 1fr;
    gap: calc(var(--common-pad-ml) * 72 / 45 + 2rem) 0;
    width: 100%;
    max-width: 640px;
    margin-inline: auto;
  }
  .shortage-flow > ul {
    grid-template-rows: none;
    grid-row: auto;
  }
}        

.shortage-flow ul.result li {
  color: var(--color-accent-yellow);
  display: flex;
  align-items: center;
  gap: calc(var(--fs-ms * .5));
}
.shortage-flow ul.result li::before {
  display: block;
  content: "\2605";
  font-size: var(--fs-mm);
}

.l-section.has-bg.next-gen {
  padding-block-end: 0;
}
.next-gen .next-gen-title {
  font-size: var(--fs-ml);
  text-align: center;
}
.next-gen .sub-box {
  display: flex;
  justify-content: center;
  gap: var(--common-pad-ml);
  margin-block-start: calc(var(--fs-mm) * 2);
}
.next-gen .sub-1 {
  color: var(--color-accent-dark);
  font-size: calc(var(--fs-mm) * 2);
  line-height: 1.4;
  padding-block: var(--common-pad-ml);
  background: url(../img/0701BF_inshoku.consulting_Used_Creative_icon_multiply-bold.svg) center center no-repeat;
  background-size: auto 100%;
}
.next-gen .sub-2 {
  color: var(--color-accent-light);
  font-size: calc(var(--fs-ml) * 2);
  text-align: left;
  line-height: 1.4;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.next-gen .sub-2 .marker {
  display: block;
  font-size: calc(var(--fs-ml) * 3);
  width: fit-content;
  background:linear-gradient(transparent 70%, var(--color-accent-yellow) 70%);
}
.next-gen .c-science {
  border-bottom: calc(var(--base-border-thickness) * 2) solid var(--color-accent-light);
}

@media (max-width: 959px) {
  .next-gen .sub-box {
    flex-direction: column;
  }
  .next-gen .sub-2 {
    align-items: center;
  }
}

.next-gen .-expansion p {
  color: var(--color-text-invert);
  font-size: var(--fs-ls);
  font-weight: var(--font-weight-bold);
  text-align: center;
  line-height: 1.2;
  width: fit-content;
  margin-inline: auto;
  background: linear-gradient(90deg, var(--color-accent-dark) 0%, var(--color-accent-light) 100%);
  padding: var(--fs-ms) 4rem;
}

@media (max-width: 959px) {
  .next-gen .-expansion p {
    padding: var(--fs-ms) var(--fs-ml);
  }
}
@media (max-width: 640px) {
  .next-gen .-expansion p {
    font-size: 1.7rem;
    line-height: 1.4;
    padding: 1rem 2rem;
  }
}

/* コンサルタント */
.directors ul {
  display: flex;
  flex-wrap: wrap;
  gap: 3rem 3rem;
}
.directors ul li {
  width: calc((100% - 3rem) * .5);
  border: 3px solid var(--color-accent-light);
}
.directors .profile-content {
  padding: 3rem 2rem;
  width: fit-content;
  margin-inline: auto;
}
.directors .profile-content .prof-heading {
  font-weight: var(--font-weight-sbold);
}
.directors .profile-content .prof-heading .position {
  color: var(--color-accent-light);
  font-weight: 400;
  margin-block-end: 1rem;
  display: block;
}
.directors .profile-content .prof-heading .name {
  font-size: calc(var(--fs-mm) * 1.12);
}
.directors .profile-content .prof-heading .ruby {
  font-size: var(--fs-ms);
  padding-inline-start: 1rem;
}

.directors .profile-content .record {
  font-size: var(--fs-ms);
  padding-block-start: 2rem;
  margin-block-start: 2rem;
  border-block-start: 3px solid var(--color-accent-light);
}
.directors .profile-content .record p {
  line-height: 1.6;
}
.directors .profile-content .record p + p {
  margin-block-start: 2rem;
}

@media (max-width: 959px) {
  .directors ul {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 640px;
    margin-inline: auto;
  }
  .directors ul li {
    width: 100%;
  }
}
@media (max-width: 768px) {
  .directors .profile-content {
    padding: 3rem 1rem;
    width: 100%;
  }
}

/* 参考事例 */
.l-section.has-bg.used-case {
  padding-block-end: calc(var(--section-gap) + var(--edge-height));
  background: 
  linear-gradient(90deg, var(--color-accent-dark) 0%, var(--color-accent-light) 100%);
}
.used-case .section-heading__en,
.used-case .com-heading {
  color: var(--color-text-invert);
}
.used-case .sec-catch {
  color: var(--color-text-invert);
  line-height: 1.6;
}
.used-case .sec-catch + .sec-catch {
  margin-block-start: 2rem;
}
@media (max-width: 768px) {
  .used-case .sec-catch {
    font-size: calc(clamp(2.1rem, 0.7rem + 1.6vw, 3.2rem) * .876);
  }
  .used-case .sec-catch .sp-p {
    display: block;
    margin-block-start: 2rem;
  }
}

.used-case ul {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  padding: 0;
  margin-block: 4rem;
  list-style: none;
  border-top: var(--base-border-thickness) solid var(--color-accent-light);
  border-left: var(--base-border-thickness) solid var(--color-accent-light);
}
.used-case ul > li {
  margin: 0;
  padding: 2rem;
  background: var(--color-text-invert);
  border-right: var(--base-border-thickness) solid var(--color-accent-light);
  border-bottom: var(--base-border-thickness) solid var(--color-accent-light);
}

.used-case .data-list + p {
  margin-block-start: var(--section-gap);
}
@media (max-width: 959px) {
  .used-case ul {
    grid-template-columns: 1fr;
    width: 100%;
    max-width: 640px;
    margin-inline: auto;
  }
}


/* 切り替えライン */
.sec-pricing .pricing-edge {
  position: absolute;
  left: 0;
  bottom: calc(100% - 1px);
  width: 100%;
  height: var(--edge-height);
  z-index: 2;
  pointer-events: none;
  overflow: visible;
}
.sec-pricing .pricing-edge polyline {
  fill: none;
  stroke: var(--color-text-invert);
  stroke-width: 2;
  vector-effect: non-scaling-stroke;
}
.sec-pricing .pricing-edge__sp {
  display: none;
}
@media (max-width: 768px) {
  .sec-pricing .pricing-edge__pc {
    display: none;
  }

  .sec-pricing .pricing-edge__sp {
    display: block;
  }
}


/* ========================================
  会社概要
======================================== */
.page-company .l-section.has-bg.sec-science {
  padding-block: var(--section-gap);
}

.page-company .com-info .section-heading__en, 
.page-company .com-info .com-heading {
  color: var(--color-text-invert);
}

.page-company .info-contents {
  width: 100%;
  max-width: 900px;
  margin-block: auto;
}
.page-company .info-contents + .info-contents {
  margin-block-start: 3rem;
}
.page-company .info-contents .outline-heading {
  color: var(--color-text-invert);
  font-size: var(--fs-mm);
  padding: 2rem;
  width: 100%;
  margin-block: auto;
  border: 2px solid var(--color-text-invert);
}
.page-company .info-contents dl {
  color: var(--color-text-invert);
  font-size: var(--fs-ms);
  border-inline: 2px solid var(--color-text-invert);
}
.page-company .info-contents dl > div {
  display: flex;
}
.page-company .info-contents dt,
.page-company .info-contents dd {
  line-height: 1.3;
  padding: 2rem;
  border-block-end: 2px solid var(--color-text-invert);
}
.page-company .info-contents dt {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 10em;
}
.page-company .info-contents dd {
  flex: 1;
  padding-inline-start: 3rem;
}
.page-company .l-section.has-bg.directors {
  padding-block-end: calc(var(--section-gap) + var(--edge-height));
}
 
@media (max-width: 768px) {
  .page-company .info-contents .outline-heading {
    padding: 1rem;
  }  
  .page-company .info-contents dt,
  .page-company .info-contents dd {
    padding: 1rem;
  }
  .page-company .info-contents dt {
    width: 7em;
  }  
}

/* ========================================
  問い合わせ・404
======================================== */
.page-contact .contact-sec-heading,
.page-404 .contact-sec-heading {
    margin-block-end: var(--section-heading-l);
}
.page-contact .site-main-title,
.page-404 .site-main-title {
    font-size: calc(var(--fs-btn-txt) * 1.05);
}
.page-contact .-bebas,
.page-404 .-bebas {
  display: block;
  position: relative;
  color: var(--color-main);
  font-size: calc(var(--fs-hero-catch) * 1.2);
  opacity: .2;
}
.page-contact h1 {
  color: var(--color-accent-dark);
  font-size: var(--fs-mm);
  margin-block-end: 1rem;  
}

.page-contact > .l-container {
  padding-inline: 12rem;
  margin-block-start: 0;
}
.page-contact.--contact-thanks > .l-container,
.page-404 > .l-container {
  padding-inline: 12rem;
  margin-block-start: 6rem;
}
.page-contact p,
.page-404 p {
  font-size: var(--fs-mm);
  line-height: 1.8;
}
.page-contact .contact-wrap {
  margin-block-start: 6rem;
}
.page-contact .form-list .form-item dt {
  font-size: var(--fs-mm);
  font-weight: var(--font-weight-bold);
  margin-block-end: 1rem;
  display: flex;
  align-items: center;
  gap: 1rem;
}
.page-contact .required {
  color: var(--color-text-invert);
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  padding: 5px 8px;
  border-radius: 6px;
  background: var(--color-accent-light);
}
.page-contact .form-list .form-item dd {
  font-size: var(--fs-mm);
  padding-block-start: 1px;
}
.page-contact .form-list .form-item + .form-item {
  margin-block-start: var(--common-pad-ml);
}

.page-contact .contact-note {
  font-size: 2rem;
  font-weight: var(--font-weight-bold);
  text-align: center;
  line-height: 1.6;
  margin-block-start: 5rem;
}

.page-contact .form-submit > div {
  position: relative;
}
.page-contact .form-submit, 
.page-contact .back-btn {
  width: 100%;
  max-width: 500px;
  margin-inline: auto;
  margin-block-start: 3rem;
}
.page-contact .wpcf7-form-control.wpcf7-submit {
  color: var(--color-text-invert);
  font-size: 2rem;
  font-weight: var(--font-weight-bold);
  letter-spacing: .06em;
  white-space: nowrap;

  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  height: 8rem;
  padding: 0 4rem;
  border-radius: 600px;
  background: var(--color-main);
  
  margin-inline: auto;
  border: 0;
  cursor: pointer;
  transition: background-color .5s ease;
}
.page-contact .wpcf7-form-control.wpcf7-submit:hover {
  background-color: var(--color-accent-light);
}
.page-contact .back-btn input {
  border-radius: 60px;
  cursor: pointer;
}
.page-contact .wpcf7-spinner {
  visibility: hidden;
  display: inline-block;
  background-color: transparent;
  border: 1px solid var(--color-bg-blue);
  opacity: 0.75;
  width: 24px;
  height: 24px;
  border-radius: 100%;
  padding: 0;
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  right: 28px;
}

.page-contact .contact-confirm .form-list .form-item {
  border-bottom: 1px solid var(--color-main);
}
.page-contact .contact-confirm .form-list .form-item {
  display: flex;
  gap: 4rem;
  padding-block-end: 3rem;
}
.page-contact .contact-confirm .form-list .form-item + .form-item {
  margin-block-start: 3rem;
}

.page-contact .contact-confirm .form-list .form-item dt {
  width: 18em;
  justify-content: space-between;
  margin-bottom: 0;
  flex-shrink: 0;
}

.page-contact .back-sitetop,
.page-404 .back-sitetop {
  margin-block: 5rem 10rem;
}
.page-contact .back-sitetop .sitetop_btn,
.page-404 .back-sitetop .sitetop_btn {
  color: var(--color-text-invert);
  background: var(--color-main);
  border-radius: 500px;
  padding: 1rem 2rem;
}
.page-contact .back-sitetop .sitetop_btn:hover,
.page-404 .back-sitetop .sitetop_btn:hover {
  background: var(--color-accent-light);
}
.wpcf7-not-valid-tip {
  color: var(--color-accent-light);
  font-size: var(--fs-ms);
  font-weight: var(--font-weight-sbold);
  margin-top: .5rem;
}
.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output, .wpcf7 form.payment-required .wpcf7-response-output {
  color: var(--color-text-invert);
  font-size: var(--fs-ms);
  font-weight: var(--font-weight-sbold);
  border: 0;
  background: var(--color-accent-dark);
}

@media (max-width: 768px) {
  .page-contact .-bebas,
  .page-404 .-bebas {
    font-size: calc(var(--fs-ls)* 2);
  }  
  .page-contact .contact-confirm .form-list .form-item {
    display: block;
    padding-block-end: 2rem
  }
  .page-contact .contact-confirm .form-list .form-item dt {
    width: fit-content;
    margin-bottom: 1rem;
  }
}

.page-contact .wpcf7-checkbox {
  display: flex;
  flex-wrap: wrap;
  gap: 1.6rem 2.4rem;
}
.page-contact .wpcf7-checkbox .wpcf7-list-item {
  display: inline-flex;
  align-items: center;
  gap: 1rem;
  margin: 0;
}
.page-contact .wpcf7-checkbox .wpcf7-list-item > label {
  display: inline-flex;
  align-items: center;
  gap: 1rem;
  cursor: pointer;
}
.page-contact .wpcf7-checkbox input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  display: inline-grid;
  place-content: center;
  flex: 0 0 22px;
  width: 22px;
  height: 22px;
  margin: 0;
  padding: 0;
  border: 1px solid #aaa;
  border-radius: 3px;
  background: #fff;
  cursor: pointer;
  transition: border-color .2s ease, background-color .2s ease;
}
/* チェックマーク */
.page-contact .wpcf7-checkbox input[type="checkbox"]::before {
  content: "";
  width: 6px;
  height: 11px;
  border: solid var(--color-text-invert, #fff);
  border-width: 0 2px 2px 0;
  transform: translateY(-1px) rotate(45deg);
  visibility: hidden;
}
/* 選択時 */
.page-contact .wpcf7-checkbox input[type="checkbox"]:checked {
  border-color: var(--color-main);
  background: var(--color-main);
}
.page-contact .wpcf7-checkbox input[type="checkbox"]:checked::before {
  visibility: visible;
}
/* キーボード操作時 */
.page-contact .wpcf7-checkbox input[type="checkbox"]:focus-visible {
  outline: 2px solid var(--color-main);
  outline-offset: 3px;
}
.page-contact .wpcf7-checkbox .wpcf7-list-item-label {
  font-size: var(--fs-mm);
  line-height: 1.5;
}

@media (max-width: 768px) {
  .page-contact .wpcf7-checkbox {
    flex-direction: column;
    align-items: flex-start;
  }
}

.page-contact .date-wrap {
  display: flex;
  gap: 3rem;
  margin-block-start: .5rem;
}
.page-contact .date-wrap select,
.page-contact .date-wrap input {
  height: 60px;
}

@media (max-width: 768px) {
  .page-contact .date-wrap {
    flex-direction: column;
    gap: 2rem;
  }
}
@media (max-width: 640px) {
  .wpcf7-form-control-wrap:has(.select-short),
  .page-contact .date-wrap {
    width: 100%;
  }
}

/* 問い合わせHero */
.contact-hero {
  margin-block-end: var(--section-gap)
}
.contact-hero-catch li {
  color: var(--color-text-invert);
  font-size: clamp(1.8rem, 0.2rem + 2.5vw, 4rem);
  font-weight: var(--font-weight-bold);
  width: fit-content;
  padding: var(--fs-ms) var(--fs-mm);
  background: linear-gradient(90deg, var(--color-accent-dark) 0%, var(--color-accent-light) 100%);
  border: 2px solid var(--color-text-invert);
}
.contact-5icon {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--fs-ls);
  width: 80%;
  margin: var(--fs-hero-catch) auto;
}
.contact-5icon li {
  flex: 1;
}
.contact-5icon li::before {
  display: none;
}
.contact-5icon figure img {
  width: clamp(8rem, 18vw, 15rem);
  margin-inline: auto;
}
.contact-5icon figcaption {
  font-size: clamp(1.8rem, 1.589rem + 0.563vw, 2.4rem);
  text-align: center;
  font-weight: var(--font-weight-sbold);
  display: block;
  margin-block-start: 1rem;
}

@media (max-width: 959px) {
  .contact-5icon li {
    flex: 0 0 calc((100% - var(--fs-ls) - var(--fs-ls)) / 3);
  }
  .contact-5icon figure img {
    width: clamp(8rem, 18vw, 15rem);
  }  
}
@media (max-width: 768px) {
  .contact-5icon {
    width: 100%;
  }
}

.-contactcatch p {
  font-size: clamp(1.8rem, 0.7rem + 1.6vw, 3.2rem);
  text-align: center;
  font-weight: var(--font-weight-bold);
  line-height: 1.6;
}
.-contactcatch p + p {
  margin-block-start: 2rem;
}
.-contactcatch ul {
  font-size: var(--fs-mm);
  width: fit-content;
  margin: calc(var(--section-gap) * .4) auto;
}
.-contactcatch ul li {
  line-height: 1.6;
}
.-contactcatch p,
.-contactcatch ul li {
  margin-inline-end: -0.5em;
}
.-contactcatch ul li + li {
    margin-block-start: 2rem;
}