@charset "UTF-8";
/* ============================================================
   AOCのエンジニアクリエイト（/engineer-create/）
   背景動画固定＋文字スクロールはコンセプト（style_concept.scss）と同型
   ※ まずは「エンジニアクリエイトを支えるシステム」の上（KV〜ADVANTAGE 01-04）まで
   ============================================================ */
.ecreate {
  position: relative;
  z-index: 0;
  clip-path: inset(0);
  background-color: #000000;
  color: #ffffff;
}
.ecreate::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  background: url("../../img_engineer-create/page-bg.webp") center center/cover no-repeat;
  pointer-events: none;
}
@media (max-width: 768px) {
  .ecreate {
    padding: 100px 0 0;
  }
}

/* 共通：セクションラベル（AOC ADVANTAGE など小さめ英字） */
.ecreate__label {
  display: block;
  font-size: clamp(13px, 10.8888888889px + 0.0055555556 * 100vw, 18px);
  font-weight: 500;
  letter-spacing: 0.08em;
  font-family: gotham, sans-serif;
}

/* ---- KV（静止画の通常セクション。動画・sticky なし） ---- */
.ecreate-kv {
  position: relative;
  height: clamp(420px, 44vw, 900px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 20px;
  overflow: hidden;
  background: url("../../img_engineer-create/kv.webp") center center/cover no-repeat;
}
@media (max-width: 768px) {
  .ecreate-kv {
    height: clamp(360px, 85vw, 560px);
    background: url("../../img_engineer-create/kv-sp.webp") center center/cover no-repeat;
  }
}
.ecreate-kv__copy {
  position: relative;
  z-index: 1;
  margin: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  text-align: center;
}
.ecreate-kv__en {
  font-family: gotham, sans-serif;
  font-weight: 700;
  letter-spacing: 0.03em;
  line-height: 1.2;
  font-size: clamp(24px, 17.2444444444px + 0.0177777778 * 100vw, 40px);
  color: #000;
}
@media (max-width: 768px) {
  .ecreate-kv__en {
    color: #fff;
    letter-spacing: 0;
  }
}
.ecreate-kv__ja {
  font-family: gotham, "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
  font-size: clamp(14px, 12.3111111111px + 0.0044444444 * 100vw, 18px);
  font-weight: 600;
  color: #000;
}
@media (max-width: 768px) {
  .ecreate-kv__ja {
    color: #fff;
  }
}

/* ---- 黒ベタセクション共通の頭（マーク＋見出し＋英字ラベル） ---- */
.ecreate-sechead {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(16px, 11.7777777778px + 0.0111111111 * 100vw, 26px);
  text-align: center;
}
.ecreate-sechead__mark {
  width: clamp(40px, 5vw, 66px);
  height: auto;
}
.ecreate-sechead__title {
  font-family: gotham, "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0.1em;
  margin: 0;
  font-size: clamp(23px, 15.8222222222px + 0.0188888889 * 100vw, 40px);
}
@media (max-width: 640px) {
  .ecreate-sechead__title {
    word-break: auto-phrase;
  }
}

/* ---- ADVANTAGE リード（黒ベタの通常セクション） ---- */
.ecreate-advantage-head {
  padding: clamp(110px, 15vw, 190px) 20px;
}

/* ---- ADVANTAGE（背景固定＋文字スクロール。コンセプトの .concept-scene と同型）---- */
.ecreate-scene {
  position: relative;
  background-color: #111111;
}
.ecreate-scene__bg {
  position: sticky;
  top: 0;
  height: 100vh;
  overflow: hidden;
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
  z-index: 0;
}
.ecreate-scene__bg::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: rgba(0, 0, 0, 0.5);
}
.ecreate-scene__video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}
.ecreate-scene__inner {
  position: relative;
  margin-top: -100vh;
  z-index: 1;
  color: #ffffff;
  padding-bottom: 20vh;
}
.ecreate-scene.is-pinned {
  height: 100vh;
  overflow: hidden;
}
.ecreate-scene.is-pinned .ecreate-scene__bg {
  position: absolute;
  inset: 0;
  height: 100%;
}
.ecreate-scene.is-pinned .ecreate-scene__inner {
  height: 100%;
  margin-top: 0;
  padding-bottom: 0;
}
.ecreate-scene.is-pinned .ecreate-adv {
  position: absolute;
  inset: 0;
  min-height: 0;
  opacity: 0;
}

.ecreate-advantage .ecreate-scene__bg {
  background-image: url(../../img_engineer-create/advantage.webp);
}
.ecreate-advantage .ecreate-scene__bg::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 2;
  width: min(80vh, 85vw);
  aspect-ratio: 1;
  transform: translate(-50%, -50%);
  background: url("../svg/top_mark.svg") center center/contain no-repeat;
  opacity: 0.4;
  mix-blend-mode: overlay;
  pointer-events: none;
}

/* ---- ADVANTAGE 01-04 の各パネル（1画面ぶんずつスクロールで流れる） ---- */
.ecreate-adv {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 90px 0;
  margin-inline: auto;
  text-align: center;
}
@media (max-width: 640px) {
  .ecreate-adv {
    padding: 80px 0 30px;
  }
}
.ecreate-adv__head {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 34px;
  margin-bottom: clamp(30px, 5vw, 40px);
}
.ecreate-adv__label {
  display: inline-block;
  font-family: gotham, sans-serif;
  font-size: clamp(14px, 12.3111111111px + 0.0044444444 * 100vw, 18px);
  font-weight: 500;
  letter-spacing: 0.1em;
}
.ecreate-adv__title {
  font-weight: 600;
  line-height: 1.6;
  letter-spacing: 0.06em;
  margin: 0;
  font-size: clamp(22px, -4px + 0.040625 * 100vw, 48px);
}
.ecreate-adv__circles {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0 clamp(16px, 14.3111111111px + 0.0044444444 * 100vw, 20px);
  margin: clamp(50px, 7vw, 90px) auto 0;
  padding: 0;
  max-width: 1456px;
}
@media (max-width: 768px) {
  .ecreate-adv__circles {
    max-width: 410px;
  }
}
.ecreate-adv__circles li {
  display: flex;
  align-items: center;
  justify-content: center;
  width: clamp(100px, 14vw, 130px);
  aspect-ratio: 1;
  border-radius: 50%;
  background-color: rgba(0, 0, 0, 0.18);
  color: #ffffff;
  font-size: clamp(14px, 12.7333333333px + 0.0033333333 * 100vw, 17px);
  font-weight: 600;
  line-height: 1.6;
  letter-spacing: 0.05em;
  text-align: center;
  border: 1px solid #ffffff;
}
@media (max-width: 768px) {
  .ecreate-adv__circles--four {
    max-width: 300px;
    gap: clamp(16px, 14.3111111111px + 0.0044444444 * 100vw, 20px);
  }
}
.ecreate-adv__circles--four li {
  width: clamp(100px, 14vw, 130px);
  font-size: clamp(14px, 12.7333333333px + 0.0033333333 * 100vw, 17px);
}

/* ---- ENGINEER CREATE SYSTEM（黒ベタ：ATC紹介〜CHANGE THE CREATE） ---- */
.ecreate-system {
  padding: clamp(110px, 15vw, 190px) 20px 0;
  text-align: center;
}
.ecreate-system__atc {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(28px, 4vw, 40px);
  margin-top: clamp(80px, 13vw, 125px);
}
.ecreate-system__atc-label {
  font-family: gotham, "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
  font-size: clamp(12px, 7.7777777778px + 0.0111111111 * 100vw, 22px);
  font-weight: 600;
  letter-spacing: 0.15em;
}
.ecreate-system__atc-logo {
  width: clamp(170px, 30vw, 290px);
  height: auto;
}
.ecreate-system__about {
  position: relative;
  max-width: 680px;
  margin: clamp(55px, 10vw, 90px) auto 0;
  padding: clamp(36px, 5vw, 50px) clamp(16px, 4vw, 40px) clamp(28px, 4.5vw, 44px);
  border: 1px solid #ffffff;
  border-top: 0;
}
.ecreate-system__about-title {
  font-family: gotham, "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
  position: absolute;
  top: 0;
  left: -1px;
  right: -1px;
  transform: translateY(-50%);
  display: flex;
  align-items: center;
  gap: clamp(14px, 2.5vw, 26px);
  white-space: nowrap;
}
.ecreate-system__about-title::before, .ecreate-system__about-title::after {
  content: "";
  flex: 1;
  height: 1px;
  background-color: #ffffff;
}
.ecreate-system__about-title {
  font-size: clamp(16px, 13.8888888889px + 0.0055555556 * 100vw, 21px);
  font-weight: 600;
  letter-spacing: 0.1em;
}
.ecreate-system__about-text {
  font-size: clamp(14px, 12.3111111111px + 0.0044444444 * 100vw, 18px);
  font-weight: 500;
  line-height: 2.2;
  letter-spacing: 0.08em;
}
.ecreate-system__change {
  position: relative;
  margin: clamp(90px, 13vw, 170px) -20px 0;
  padding-bottom: clamp(24px, 4vw, 50px);
  overflow: hidden;
}
.ecreate-system__change-en {
  display: block;
  font-family: gotham, sans-serif;
  font-weight: 500;
  line-height: 1;
  white-space: nowrap;
  font-size: clamp(60px, 2.8571428571px + 0.0744047619 * 100vw, 110px);
  color: #3c3c3c;
}
@media (max-width: 640px) {
  .ecreate-system__change-en {
    font-size: clamp(50px, 26.4948453608px + 0.0618556701 * 100vw, 74px);
    white-space: normal;
    line-height: 1.05;
    word-break: keep-all;
  }
}
.ecreate-system__change-ja {
  font-family: gotham, "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
  display: block;
  position: relative;
  margin-top: -1em;
  font-size: clamp(26px, 20.0888888889px + 0.0155555556 * 100vw, 40px);
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.1em;
}
@media (max-width: 768px) {
  .ecreate-system__change-ja {
    margin-top: -1.5em;
  }
}

/* ---- CHANGE THE CREATE パネル（これまで/これから ×4段。段ごとにpin→右スライド） ---- */
.ecreate-cc {
  position: relative;
}
.ecreate-cc__row {
  position: relative;
}
.ecreate-cc__row.is-switchable {
  overflow: hidden;
}
.ecreate-cc__row.is-switchable .ecreate-cc__slider {
  display: flex;
  width: 200%;
  transition: transform 800ms cubic-bezier(0.65, 0, 0.35, 1);
  will-change: transform;
}
@media (prefers-reduced-motion: reduce) {
  .ecreate-cc__row.is-switchable .ecreate-cc__slider {
    transition: none;
  }
}
.ecreate-cc__row.is-switchable .ecreate-cc__panel {
  width: 50%;
  flex: none;
}
.ecreate-cc__row.is-switchable .ecreate-cc__btn {
  display: inline-flex;
}
.ecreate-cc__row.is-changed .ecreate-cc__slider {
  transform: translateX(-50%);
}
.ecreate-cc__slider {
  position: relative;
}
.ecreate-cc__panel {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: clamp(28px, 4vw, 42px);
  padding: 90px 0;
  text-align: center;
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
  background-color: #000000;
}
.ecreate-cc__panel--01 {
  background-image: url(../../img_engineer-create/past_future1-1.webp);
}
@media (max-width: 768px) {
  .ecreate-cc__panel--01 {
    background-image: url(../../img_engineer-create/past_future1-1-sp.webp);
  }
}
.ecreate-cc__panel--02 {
  background-image: url(../../img_engineer-create/past_future1-2.webp);
}
@media (max-width: 768px) {
  .ecreate-cc__panel--02 {
    background-image: url(../../img_engineer-create/past_future1-2-sp.webp);
  }
}
.ecreate-cc__panel--03 {
  background-image: url(../../img_engineer-create/past_future2-1.webp);
}
@media (max-width: 768px) {
  .ecreate-cc__panel--03 {
    background-image: url(../../img_engineer-create/past_future2-1-sp.webp);
  }
}
.ecreate-cc__panel--04 {
  background-image: url(../../img_engineer-create/past_future2-2.webp);
}
@media (max-width: 768px) {
  .ecreate-cc__panel--04 {
    background-image: url(../../img_engineer-create/past_future2-2-sp.webp);
  }
}
.ecreate-cc__panel--05 {
  background-image: url(../../img_engineer-create/past_future3-1.webp);
}
@media (max-width: 768px) {
  .ecreate-cc__panel--05 {
    background-image: url(../../img_engineer-create/past_future3-1-sp.webp);
  }
}
.ecreate-cc__panel--06 {
  background-image: url(../../img_engineer-create/past_future3-2.webp);
}
@media (max-width: 768px) {
  .ecreate-cc__panel--06 {
    background-image: url(../../img_engineer-create/past_future3-2-sp.webp);
  }
}
.ecreate-cc__panel--07 {
  background-image: url(../../img_engineer-create/past_future4-1.webp);
}
@media (max-width: 768px) {
  .ecreate-cc__panel--07 {
    background-image: url(../../img_engineer-create/past_future4-1-sp.webp);
  }
}
.ecreate-cc__panel--08 {
  background-image: url(../../img_engineer-create/past_future4-2.webp);
}
@media (max-width: 768px) {
  .ecreate-cc__panel--08 {
    background-image: url(../../img_engineer-create/past_future4-2-sp.webp);
  }
}
.ecreate-cc__label {
  position: relative;
  z-index: 2;
  display: inline-block;
  font-size: clamp(16px, 15.1555555556px + 0.0022222222 * 100vw, 18px);
  font-weight: 600;
  letter-spacing: 0.1em;
  padding: 8px 18px;
  background-color: #000000;
}
.ecreate-cc__label-num {
  font-size: clamp(17px, 15.7333333333px + 0.0033333333 * 100vw, 20px);
  font-family: gotham, sans-serif;
  margin-left: 4px;
  font-weight: 500;
}
.ecreate-cc__label.label--white {
  background-color: #ffffff;
  color: #000000;
}
.ecreate-cc__label.label--white .ecreate-cc__label-num {
  color: #000000;
}
.ecreate-cc__title {
  position: relative;
  z-index: 2;
  margin: 0;
  font-weight: 600;
  line-height: 1.6;
  letter-spacing: 0.08em;
  font-size: clamp(34px, -5px + 0.05078125 * 100vw, 60px);
}
@media (max-width: 768px) {
  .ecreate-cc__title {
    font-size: clamp(28px, 16.2474226804px + 0.0309278351 * 100vw, 40px);
    word-break: auto-phrase;
  }
}
.ecreate-cc__text {
  position: relative;
  z-index: 2;
  font-size: clamp(16px, 13.4666666667px + 0.0066666667 * 100vw, 22px);
  font-weight: 500;
  line-height: 1.8;
  letter-spacing: 0.08em;
}
.ecreate-cc__btn {
  position: relative;
  z-index: 2;
  display: none;
  align-items: center;
  justify-content: center;
  gap: clamp(20px, 3vw, 36px);
  min-width: clamp(200px, 20vw, 250px);
  margin-top: clamp(4px, 1.5vw, 20px);
  padding: clamp(12px, 1.4vw, 16px) clamp(24px, 3vw, 40px);
  border: 1px solid #ffffff;
  background-color: rgba(0, 0, 0, 0.2);
  color: #ffffff;
  font-family: gotham, sans-serif;
  font-size: clamp(20px, 16.6222222222px + 0.0088888889 * 100vw, 28px);
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0.02em;
  cursor: pointer;
  transition: background-color 300ms, color 300ms;
}
.ecreate-cc__btn::after {
  content: "";
  position: absolute;
  top: 50%;
  width: 0.8em;
  height: 0.8em;
  background-color: currentColor;
  -webkit-mask: url(../../common/svg/aoc_arrow.svg) no-repeat center/contain;
  mask: url(../../common/svg/aoc_arrow.svg) no-repeat center/contain;
}
.ecreate-cc__btn--change {
  padding-right: clamp(36px, 7vw, 70px);
}
.ecreate-cc__btn--change::after {
  right: clamp(14px, 1.6vw, 20px);
  transform: translateY(-50%) rotate(90deg);
}
.ecreate-cc__btn--back::after {
  left: clamp(14px, 1.6vw, 20px);
  transform: translateY(-50%) rotate(-90deg);
}
@media (hover: hover) {
  .ecreate-cc__btn:hover {
    background-color: #ffffff;
    color: #000000;
  }
}

/* 本文 */
.ecreate-body {
  width: 90%;
  max-width: 1000px;
  margin: 0 auto;
  text-align: center;
  font-size: clamp(14px, 9.0967741935px + 0.0129032258 * 100vw, 22px);
  line-height: 2;
  letter-spacing: 0.15em;
}
@media screen and (max-width: 640px) {
  .ecreate-body {
    text-align: justify;
    line-height: 2;
  }
}
.ecreate-body br {
  display: none;
}
@media screen and (min-width: 641px) {
  .ecreate-body br {
    display: block;
  }
}

/* ---- ATCバナー（さらに詳しく知りたい方はこちら） ---- */
.ecreate-atcbanner {
  padding: clamp(90px, 12vw, 150px) 0 0;
  text-align: center;
}
.ecreate-atcbanner__lead {
  font-size: clamp(16px, 12.6222222222px + 0.0088888889 * 100vw, 24px);
  font-weight: 600;
  letter-spacing: 0.1em;
}
.ecreate-atcbanner__chev {
  display: block;
  width: clamp(26px, 22.2px + 0.01 * 100vw, 35px);
  height: clamp(26px, 22.2px + 0.01 * 100vw, 35px);
  margin: 24px auto clamp(32px, 4.5vw, 50px);
  border-right: 1px solid #ffffff;
  border-bottom: 1px solid #ffffff;
  transform: rotate(45deg);
}
.ecreate-atcbanner__banner {
  container-type: inline-size;
  position: relative;
  max-width: 1200px;
  width: 90%;
  margin: 0 auto;
  aspect-ratio: 2412/848;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2.5cqw;
  background: #000000 url("../../img_engineer-create/atc-banner.webp") center center/cover no-repeat;
}
@media (max-width: 768px) {
  .ecreate-atcbanner__banner {
    aspect-ratio: 1/1;
    gap: 7cqw;
    background-image: url("../../img_engineer-create/atc-banner-sp.webp");
  }
}
.ecreate-atcbanner__logo {
  width: 11.5cqw;
  height: auto;
}
@media (max-width: 768px) {
  .ecreate-atcbanner__logo {
    width: 23cqw;
  }
}
.ecreate-atcbanner__copy {
  font-size: 6.6cqw;
  font-weight: 900;
  font-style: italic;
  line-height: 1.3;
  letter-spacing: 0.04em;
  white-space: nowrap;
}
@media (max-width: 768px) {
  .ecreate-atcbanner__copy {
    font-size: 11cqw;
    line-height: 1.35;
  }
}
.ecreate-atcbanner__btn {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30cqw;
  min-width: 240px;
  padding: clamp(12px, 1.6cqw, 22px) 3cqw;
  border: 1px solid #ffffff;
  color: #ffffff;
  font-family: gotham, "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
  font-size: clamp(14px, 1.7cqw, 21px);
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 1.4;
  transition: background-color 300ms, color 300ms;
}
@media (max-width: 768px) {
  .ecreate-atcbanner__btn {
    width: 72cqw;
    min-width: 0;
    padding: 4cqw;
    font-size: 4cqw;
  }
}
.ecreate-atcbanner__btn::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 2.5cqw;
  width: 0.6em;
  height: 0.6em;
  border-top: 1px solid currentColor;
  border-right: 1px solid currentColor;
  transform: translateY(-50%) rotate(45deg);
}
@media (max-width: 768px) {
  .ecreate-atcbanner__btn::after {
    right: 6cqw;
  }
}
@media (hover: hover) {
  .ecreate-atcbanner__btn:hover {
    background-color: #ffffff;
    color: #000000;
  }
}

/* ---- これまでの実績 ---- */
.ecreate-achievement {
  padding: clamp(100px, 14vw, 170px) 20px clamp(90px, 12vw, 140px);
  text-align: center;
}
.ecreate-achievement__lead {
  margin-top: clamp(50px, 26.7777777778px + 0.0611111111 * 100vw, 105px);
  font-size: clamp(16px, 12.6222222222px + 0.0088888889 * 100vw, 24px);
  font-weight: 600;
  letter-spacing: 0.08em;
  line-height: 1.8;
}
.ecreate-achievement__toggle {
  display: none;
}
@media (max-width: 768px) {
  .ecreate-achievement__toggle {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    max-width: 410px;
    margin: 30px auto 0;
    padding: 14px 18px;
    border: 0;
    background-color: #ffffff;
    color: #1b1b1b;
    font-family: inherit;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.08em;
  }
  .ecreate-achievement__toggle::before {
    content: "";
    flex-shrink: 0;
    width: 17px;
    height: 17px;
    background-color: currentColor;
    transform: rotate(90deg);
    -webkit-mask: url(../../common/svg/aoc_arrow.svg) no-repeat center/contain;
    mask: url(../../common/svg/aoc_arrow.svg) no-repeat center/contain;
  }
  .ecreate-achievement__toggle::after {
    content: "";
    margin-left: auto;
    width: 9px;
    height: 9px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg) translateY(-2px);
    transition: transform 300ms;
  }
}
.ecreate-achievement .is-open .ecreate-achievement__toggle::after {
  transform: rotate(-135deg) translateY(-2px);
}
.ecreate-achievement__list {
  list-style: none;
  max-width: 1200px;
  margin: clamp(40px, 6vw, 60px) auto 0;
  padding: 0;
  text-align: left;
  display: grid;
  grid-auto-flow: column;
  grid-template-rows: repeat(6, auto);
  grid-auto-columns: auto;
  justify-content: space-between;
  gap: 1.1em clamp(30px, 4vw, 60px);
}
@media (max-width: 768px) {
  .ecreate-achievement__list {
    display: block;
    max-width: 410px;
    columns: 2;
    column-gap: 24px;
  }
}
.ecreate-achievement__list li {
  font-size: clamp(14px, 10.6222222222px + 0.0088888889 * 100vw, 22px);
  line-height: 1.7;
  letter-spacing: 0.06em;
}
@media (max-width: 768px) {
  .ecreate-achievement__list li {
    margin-bottom: 1.1em;
    break-inside: avoid;
  }
}
.ecreate-achievement__list li.is-colstart {
  grid-row-start: 1;
}
.ecreate-achievement__list li.is-2line {
  grid-row-end: span 2;
}
@media (max-width: 768px) {
  .ecreate-achievement__listwrap:not(.is-open) .ecreate-achievement__list {
    display: none;
  }
}

/* ---- 認証ロゴ帯 ---- */
.ecreate-certs {
  padding: clamp(50px, 7vw, 80px) 20px clamp(60px, 8vw, 90px);
  text-align: center;
  background-color: #d6d6d6;
}
.ecreate-certs__lead {
  font-family: gotham, "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
  color: #1b1b1b;
  font-size: clamp(16px, 12.6222222222px + 0.0088888889 * 100vw, 24px);
  font-weight: 600;
  letter-spacing: 0.08em;
  line-height: 1.8;
}
.ecreate-certs__logos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: clamp(20px, 5vw, 70px);
  margin-top: clamp(32px, 4.5vw, 48px);
}
@media (max-width: 768px) {
  .ecreate-certs__logos {
    gap: clamp(10px, 2vw, 30px);
  }
}
.ecreate-certs__logos img {
  height: clamp(105px, 13vw, 185px);
  width: auto;
  mix-blend-mode: multiply;
}