@charset "UTF-8";

/* サイト全体の共通CSS */
/* =========================================
/* SVGファイル 画面に出さない、スペース取らない設定 */
.u-svg-sprite {
  display: none !important;
  visibility: hidden !important;
  width: 0 !important;
  height: 0 !important;
  position: absolute !important;
  overflow: hidden !important;
}

/*   変数定義
========================================= */
:root {
  /*   ROOT: COLORS
  ========================================= */
  --color-main: #F88000;

  --color-text-base: #282328;
  --color-text-black: #000;
  --color-text-gray: #999;
  --color-text-muted: #707070;
  --color-text-light: #FFFFFF;

  --color-breadcrumb-active: #282328;
  --color-breadcrumb-base: #999;
  --color-breadcrumb-arrow: #CCC;

  --color-border-base: #282328;
  --color-border-white: #FFF;
  --color-border-gray: #BCBCBC;
  --color-border-gray-light: #D9D9D9;

  --color-bg-white: #FFFFFF;
  --color-bg-dark: #282328;
  --color-bg-dark-alpha50: rgba(40, 35, 40, .5);
  --color-bg-dark-alpha85: rgba(40, 35, 40, .85);
  --color-bg-dark-alpha95: rgba(40, 35, 40, .95);
  --color-bg-soft: #F6F6F6;
  --color-bg-gry: #CCC;
  --color-bg-gry-light: #E9E9E9;
  --color-bg-gry-light-f3: #F3F3F3;
  --color-bg-beige: #F5EFE5;

  --color-bg-header: #FFFFFF;
  --color-bg-footer: #FFFFFF;

  --color-orange: #F88000;
  --color-orange-dark: #F05533;
  --color-mint: #9EFFCC;
  --color-lime: #F0FFA6;
  --color-blue-light2: #DFF5FF;
  --color-blue-light: #6699FF;
  --color-blue: #3776FF;
  --color-cyan: #00CCFF;
  --color-aqua: #99FFFF;
  --color-yellow-light: #FFFF66;
  --color-yellow: #FDD000;
  --color-purple: #8C4AFF;
  --color-purple-light: #E5CCFF;
  --color-pink: #FF7DCB;
  --color-pink-light: #FFE8EC;
  --color-pinkred: #FF6666;
  --color-green: #33CC66;
  --color-green-2: #99CC00;
  --color-beige: #F9F4EC;
  --color-white: #FFFFFF;
  --color-cream: #FFFCE1;

  --color-cell-th: #FFF;
  --color-cell-white: #FFF;
  --color-cell-empty: #F2F2F2;
  --color-cell-gray: #F2F2F2;
  --color-cell-compulsory: #FEEDD5;
  --color-cell-free: #E5F0FD;
  --color-cell-elective: #FFE787;
  --color-cell-blue: #DFF5FF;
  --color-cell-blue-dark: #6699FF;
  --color-cell-cream: #FFFCE1;
  --color-cell-yellow: #FFFCA6;
  --color-cell-pink: #FFE8EC;
  --color-cell-pinkred: #FF6666;

  --grad-orange: linear-gradient(180deg, #F88000 0%, #F8B600 100%);
  --grad-white-soft: linear-gradient(180deg, #FFFFFF 0%, #FFFFFF 50%, #F6F6F6 100%);

  /* FORM */
  --form-color-input-text: #282328;
  --form-color-placeholder: #BCBCBC;
  --form-color-field-bg: #FFF;
  --form-color-border: #282328;
  --form-errmsg: #DC143C;

  /* SUBJECT */
  /* __VISUAL DESIGN */
  --subject-vd-color-main: #EF8888;
  --subject-vd-color-main-text: #FFFFFF;
  --subject-vd-color-sub: #5CC547;
  --subject-vd-color-sub-text: #FFFFFF;
  --subject-vd-color-bg-texture-fill: #FCC1C9;
  --subject-vd-color-bg-texture: var(--subject-vd-color-bg-texture-fill) url(./../img/subject/subject-texture-vd.webp) repeat;
  --subject-vd-color-bg-texture-text: #FFFFFF;
  --subject-vd-border: var(--subject-vd-color-main);

  /* __CREATIVE ILLUST */
  --subject-ci-color-main: #EE806F;
  --subject-ci-color-main-text: #FFFFFF;
  --subject-ci-color-sub: #92CC2A;
  --subject-ci-color-sub-text: #FFFFFF;
  --subject-ci-color-bg-texture-fill: #F68375;
  --subject-ci-color-bg-texture: var(--subject-ci-color-bg-texture-fill) url(./../img/subject/subject-texture-ci.webp) repeat;
  --subject-ci-color-bg-texture-text: #FFFFFF;
  --subject-ci-border: var(--subject-ci-color-main);

  /* __CREATIVE ART */
  --subject-ca-color-main: #22BDCC;
  --subject-ca-color-main-text: #FFFFFF;
  --subject-ca-color-sub: #EA5E63;
  --subject-ca-color-sub-text: #FFFFFF;
  --subject-ca-color-bg-texture-fill: #70D0DD;
  --subject-ca-color-bg-texture: var(--subject-ca-color-bg-texture-fill) url(./../img/subject/subject-texture-ca.webp) repeat;
  --subject-ca-color-bg-texture-text: #FFFFFF;
  --subject-ca-border: var(--subject-ca-color-main);

  /* __GRAPHIC DESIGN */
  --subject-g-color-main: #F09000;
  --subject-g-color-main-text: #FFFFFF;
  --subject-g-color-sub: #38B9B9;
  --subject-g-color-sub-text: #FFFFFF;
  --subject-g-color-bg-texture-fill: #FDBE76;
  --subject-g-color-bg-texture: var(--subject-g-color-bg-texture-fill) url(./../img/subject/subject-texture-g.webp) repeat;
  --subject-g-color-bg-texture-text: #FFFFFF;
  --subject-g-border: var(--subject-g-color-main);

  /* __ILLUSTRATION */
  --subject-il-color-main: #5CC79D;
  --subject-il-color-main-text: #FFFFFF;
  --subject-il-color-sub: #EC7AA1;
  --subject-il-color-sub-text: #FFFFFF;
  --subject-il-color-bg-texture-fill: #95D5AE;
  --subject-il-color-bg-texture: var(--subject-il-color-bg-texture-fill) url(./../img/subject/subject-texture-il.webp) repeat;
  --subject-il-color-bg-texture-text: #FFFFFF;
  --subject-il-border: var(--subject-il-color-main);

  /* __MANGA */
  --subject-m-color-main: #FF806F;
  --subject-m-color-main-text: #FFFFFF;
  --subject-m-color-sub: #9AD52F;
  --subject-m-color-sub-text: #FFFFFF;
  --subject-m-color-bg-texture-fill: #F4806D;
  --subject-m-color-bg-texture: var(--subject-m-color-bg-texture-fill) url(./../img/subject/subject-texture-m.webp) repeat;
  --subject-m-color-bg-texture-text: #FFFFFF;
  --subject-m-border: var(--subject-m-color-main);

  /* __ANIMATION */
  --subject-a-color-main: #6688DD;
  --subject-a-color-main-text: #FFFFFF;
  --subject-a-color-sub: #F6A822;
  --subject-a-color-sub-text: #FFFFFF;
  --subject-a-color-bg-texture-fill: #8FB3E0;
  --subject-a-color-bg-texture: var(--subject-a-color-bg-texture-fill) url(./../img/subject/subject-texture-a.webp) repeat;
  --subject-a-color-bg-texture-text: #FFFFFF;
  --subject-a-border: var(--subject-a-color-main);

  /* __INTERIOR DESIGN */
  --subject-id-color-main: #FFB500;
  --subject-id-color-main-text: #282328;
  --subject-id-color-sub: #997DB7;
  --subject-id-color-sub-text: #FFFFFF;
  --subject-id-color-bg-texture-fill: #FFCB0B;
  --subject-id-color-bg-texture: var(--subject-id-color-bg-texture-fill) url(./../img/subject/subject-texture-id.webp) repeat;
  --subject-id-color-bg-texture-text: #FFFFFF;
  --subject-id-border: var(--subject-id-color-main);

  /* __SPACE DISPLAY DESIGN */
  --subject-d-color-main: #88BB00;
  --subject-d-color-main-text: #FFFFFF;
  --subject-d-color-sub: #EE764B;
  --subject-d-color-sub-text: #FFFFFF;
  --subject-d-color-bg-texture-fill: #D3E221;
  --subject-d-color-bg-texture: var(--subject-d-color-bg-texture-fill) url(./../img/subject/subject-texture-d.webp) repeat;
  --subject-d-color-bg-texture-text: #FFFFFF;
  --subject-d-border: var(--subject-idd-color-main);

  /* __JEWELRY DESIGN */
  --subject-j-color-main: #9988DD;
  --subject-j-color-main-text: #FFFFFF;
  --subject-j-color-sub: #6FC6C9;
  --subject-j-color-sub-text: #FFFFFF;
  --subject-j-color-bg-texture-fill: #D9BCD9;
  --subject-j-color-bg-texture: var(--subject-j-color-bg-texture-fill) url(./../img/subject/subject-texture-j.webp) repeat;
  --subject-j-color-bg-texture-text: #FFFFFF;
  --subject-j-border: var(--subject-j-color-main);

  /* __DESIGN COMMUNICATION */
  --subject-dc-color-main: #8798C7;
  --subject-dc-color-main-text: #FFFFFF;
  --subject-dc-color-sub: #DE82B2;
  --subject-dc-color-sub-text: #FFFFFF;
  --subject-dc-color-bg-texture-fill: #B1BFE1;
  --subject-dc-color-bg-texture: var(--subject-dc-color-bg-texture-fill) url(./../img/subject/subject-texture-dc.webp) repeat;
  --subject-dc-color-bg-texture-text: #FFFFFF;
  --subject-dc-border: var(--subject-dc-color-main);

  /* CATEGORY */
  /* about */
  --cat-color-about: #F88000;
  /* entrance */
  --cat-color-entrance: #6699FF;
  /* career */
  --cat-color-career: #99CC00;
  /* access */
  --cat-color-access: #FFFF66;
  /* entry */
  --cat-color-entry: #FF7DCB;

  /* ROOT_: TYPOGRAPHY
  ========================================= */
  --font-family: 'Noto Sans JP', sans-serif;
  --font-family-en: 'Montserrat', 'Noto Sans JP', sans-serif;

  /* Font Weights */
  /* --fw-thin: 100; */
  /* --fw-light: 300; */
  --fw-regular: 400;
  --fw-medium: 500;
  /* --fw-semibold: 600; */
  --fw-bold: 700;
  --fw-extrabold: 800;
  --fw-black: 900;

  /* Font Height */
  --lh-100: 1;
  --lh-120: 1.2;
  --lh-140: 1.4;
  --lh-160: 1.6;
  --lh-180: 1.8;
  --lh-200: 2.0;
  --lh-220: 2.2;
  --lh-260: 2.6;
  --lh-300: 3.0;

  /* Letter Spacing */
  --ls-0: 0;
  --ls-2: 0.02em;
  --ls-4: 0.04em;
  --ls-6: 0.06em;
  --ls-10: 0.1em;

  /* Font Size *clamp(最小, 推奨値, 最大) */
  --fs-10: 0.625rem;
  /* 10px */
  --fs-11: 0.6875rem;
  /* 11px */
  --fs-12: 0.75rem;
  /* 12px */
  --fs-13: 0.8125rem;
  /* 13px */
  --fs-14: 0.875rem;
  /* 14px */
  --fs-15: 0.9375rem;
  /* 15px */
  --fs-16: 1rem;
  /* 16px */
  --fs-18: 1.125rem;
  /* 18px */
  --fs-20: 1.25rem;
  /* 20px */
  --fs-22: 1.375rem;
  /* 22px */
  --fs-24: 1.5rem;
  /* 24px */
  --fs-26: 1.625rem;
  /* 26px */
  --fs-28: 1.75rem;
  /* 28px */
  --fs-30: 1.875rem;
  /* 30px */
  --fs-32: 2rem;
  /* 32px */
  --fs-34: 2.125rem;
  /* 34px */
  --fs-36: 2.25rem;
  /* 36px */
  --fs-38: 2.375rem;
  /* 38px */
  --fs-40: 2.5rem;
  /* 40px */
  --fs-42: 2.625rem;
  /* 42px */
  --fs-50: 3.125rem;
  /* 50px */

  /* ROOT: SPACING（余白）
  ========================================= */
  --space--30: -2.1875rem;
  /* -30px */
  --space--3: -0.188rem;
  /* -3px */
  --space--2: -0.125rem;
  /* -2px */
  --space--1: -0.063rem;
  /* -1px */
  --space-0: 0;
  /* 0 */
  --space-3: 0.188rem;
  /* 3px */
  --space-5: 0.3125rem;
  /* 5px */
  --space-6: 0.375rem;
  /* 6px */
  --space-10: 0.625rem;
  /* 10px */
  --space-15: 0.9375rem;
  /* 15px */
  --space-20: 1.25rem;
  /* 20px */
  --space-25: 1.5625rem;
  /* 25px */
  --space-30: 1.875rem;
  /* 30px */
  --space-35: 2.1875rem;
  /* 35px */
  --space-40: 2.5rem;
  /* 40px */
  --space-45: 2.8125rem;
  /* 45px */
  --space-50: 3.125rem;
  /* 50px */
  --space-60: 3.75rem;
  /* 60px */
  --space-80: 5rem;
  /* 80px */
  --space-100: 6.25rem;
  /* 100px */
  --space-120: 7.5rem;
  /* 120px */
  --space-160: 10rem;
  /* 160px */
  --space-180: 11.25rem;
  /* 180px */

  /* ROOT: UI DETAILS
  ========================================= */
  --radius-s: 4px;
  --radius-m: 10px;
  --radius-l: 24px;
  --radius-round: 9999px;
  --radius-ellipse: 50%;

  --shadow-s: 0 2px 4px rgba(0, 0, 0, 0.1);
  --shadow-m: 0 4px 12px rgba(0, 0, 0, 0.1);
  --shadow-soft: 2px 2px 6px rgba(40, 35, 40, 0.15);
  --shadow-l-bottom: 0 15px 10px rgba(0, 0, 0, 0.1);
  --shadow-hard-light: 4px 4px 0 var(--color-bg-gry-light-f3);
  --shadow-hard: 1px 1px 0px 0px var(--color-text-base);

  --border-default: 1px solid transparent;
  --border-base: 1px solid var(--color-border-base);
  --border-white: 1px solid var(--color-border-white);

  --transition: 0.3s ease;

  /* ROOT: LAYOUT
  ========================================= */
  --height-header-pc: 80px;
  --height-header-tbsp: 60px;

  --w-full: 100%;
  --w-fhd: 1920px;
  --w-xl: 1440px;
  --w-l: 1280px;
  --w-m: 960px;

  --w-max-auto-btn: auto;
  --w-max-btn: 300px;

  --w-tabs: 240px;

  /* Z-INDEX */
  /* ※4桁は重要な要素のため数値に注意！ */
  --z-header: 5000;
  --z-header-dropdown: 5500;
  --z-overlay: 6000;
  /* ヘッダより上で設定 */
  --z-modal: 9000;
  /* オーバーレイより上で設定 */
  --z-float: 5000;
  --z-drawer: 9000;
  --z-float-bnr: 9500;

  --z-footer: 500;
  --z-contents: 100;

  --z-element: 10;
  --z-decor-cloud: 10;

  --z-ajust-9: 9;
  --z-ajust-5: 5;
  --z-ajust-2: 2;
  --z-ajust--2: -2;
  --z-ajust--5: -5;
  --z-ajust--9: -9;

  /* RESPONSIVE */
  --bp-sp: 390px;
  --bp-tb: 768px;
  --bp-pc: 1024px;

  /* _OTHER  */
  --opacity-hover: 0.7;

}

/* --- 学科ごとの色の流し込み --- */
.u-subject--vd {
  --subject-color: var(--subject-vd-color-main);
  --subject-text-color: var(--subject-vd-color-main-text);
  --subject-year-text-color: var(--subject-vd-color-main);
}

.u-subject--ci {
  --subject-color: var(--subject-ci-color-main);
  --subject-text-color: var(--subject-ci-color-main-text);
  --subject-year-text-color: var(--subject-ci-color-main);
}

.u-subject--ca {
  --subject-color: var(--subject-ca-color-main);
  --subject-text-color: var(--subject-ca-color-main-text);
  --subject-year-text-color: var(--subject-ca-color-main);
}

.u-subject--g {
  --subject-color: var(--subject-g-color-main);
  --subject-text-color: var(--subject-g-color-main-text);
  --subject-year-text-color: var(--subject-g-color-main);
}

.u-subject--il {
  --subject-color: var(--subject-il-color-main);
  --subject-text-color: var(--subject-il-color-main-text);
  --subject-year-text-color: var(--subject-il-color-main);
}

.u-subject--m {
  --subject-color: var(--subject-m-color-main);
  --subject-text-color: var(--subject-m-color-main-text);
  --subject-year-text-color: var(--subject-m-color-main);
}

.u-subject--a {
  --subject-color: var(--subject-a-color-main);
  --subject-text-color: var(--subject-a-color-main-text);
  --subject-year-text-color: var(--subject-a-color-main);
}

.u-subject--id {
  --subject-color: var(--subject-id-color-main);
  --subject-text-color: var(--subject-id-color-main-text);
  --subject-year-text-color: var(--subject-id-color-main-text);
}

.u-subject--d {
  --subject-color: var(--subject-d-color-main);
  --subject-text-color: var(--subject-d-color-main-text);
  --subject-year-text-color: var(--subject-d-color-main);
}

.u-subject--j {
  --subject-color: var(--subject-j-color-main);
  --subject-text-color: var(--subject-j-color-main-text);
  --subject-year-text-color: var(--subject-j-color-main);
}

.u-subject--dc {
  --subject-color: var(--subject-dc-color-main);
  --subject-text-color: var(--subject-dc-color-main-text);
  --subject-year-text-color: var(--subject-dc-color-main);
}

/* =========================================
RESET
========================================= */
*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
  padding: 0;
  background-color: var(--color-bg-white);
  color: var(--color-text-base);
  font-family: var(--font-family);
  font-weight: var(--fw-regular);
  line-height: var(--lh-160);
  letter-spacing: var(--ls-2);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-wrap: break-word;
  /* 単語の区切りを優先 */
  word-break: normal;
  /* 日本語はどこでも、英語は単語単位 */
  scrollbar-gutter: stable;
}

h1,
h2,
h3,
h4,
h5,
h6,
p {
  margin: 0;
  padding: 0;
  font-weight: inherit;
}

ul,
ol {
  margin: 0;
  padding: 0;
  list-style: none;
}

small {
  font-size: 0.875em;
}

a {
  color: inherit;
  text-decoration: none;
  transition: opacity var(--transition);
}

a:hover,
button:hover {
  opacity: var(--opacity-hover);
}

img,
svg {
  max-width: 100%;
  height: auto;
  display: block;
}

button,
input,
select,
textarea {
  font: inherit;
  color: inherit;
  background: transparent;
  border: none;
  border-radius: 0;
  outline: none;
  appearance: none;
  -webkit-appearance: none;
}

button {
  cursor: pointer;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
  width: 100%;
}

/* =========================================
UTILITIES
========================================= */
.u-rel {
  position: relative;
}

.u-before::before,
.u-after::after {
  content: '';
  position: absolute;
  display: block;
  pointer-events: none;
}

.u-pe-none {
  pointer-events: none;
}

.u-overflow-hidden {
  overflow: hidden;
}

.u-shadow-soft {
  box-shadow: var(--shadow-soft);
}

/* FONT CONTROL
========================================= */
.u-f-en {
  font-family: var(--font-family-en);
}

/* 長い英数字を枠の右端で強制的に折り返すユーティリティ */
.u-break-all {
  overflow-wrap: break-word;
  word-break: break-all;
}

.u-white-space {
  white-space: nowrap !important;
}

/* Font Size  */
.u-fs-10 {
  font-size: var(--fs-10) !important;
}

.u-fs-11 {
  font-size: var(--fs-11) !important;
}

.u-fs-12 {
  font-size: var(--fs-12) !important;
}

.u-fs-13 {
  font-size: var(--fs-13) !important;
}

.u-fs-14 {
  font-size: var(--fs-14) !important;
}

.u-fs-15 {
  font-size: var(--fs-15) !important;
}

.u-fs-16 {
  font-size: var(--fs-16) !important;
}

.u-fs-18 {
  font-size: var(--fs-18) !important;
}

.u-fs-20 {
  font-size: var(--fs-20) !important;
}

.u-fs-22 {
  font-size: var(--fs-22) !important;
}

.u-fs-24 {
  font-size: var(--fs-24) !important;
}

.u-fs-26 {
  font-size: var(--fs-26) !important;
}

.u-fs-30 {
  font-size: var(--fs-30) !important;
}

.u-fs-32 {
  font-size: var(--fs-32) !important;
}

.u-fs-34 {
  font-size: var(--fs-34) !important;
}

.u-fs-36 {
  font-size: var(--fs-36) !important;
}

.u-fs-38 {
  font-size: var(--fs-38) !important;
}

.u-fs-40 {
  font-size: var(--fs-40) !important;
}

.u-fs-42 {
  font-size: var(--fs-42) !important;
}

.u-fs-50 {
  font-size: var(--fs-50) !important;
}

.u-fs-f18-20 {
  font-size: clamp(var(--fs-18), 1.06rem + 0.3vw, var(--fs-20)) !important;
}

/* Font Weight  */
.u-fw-reg {
  font-weight: var(--fw-regular) !important;
}

.u-fw-med {
  font-weight: var(--fw-medium) !important;
}

.u-fw-bold {
  font-weight: var(--fw-bold) !important;
}

.u-fw-exb {
  font-weight: var(--fw-extrabold) !important;
}

.u-fw-black {
  font-weight: var(--fw-black) !important;
}

/* Line Height */
.u-lh-100 {
  line-height: var(--lh-100) !important;
}

.u-lh-120 {
  line-height: var(--lh-120) !important;
}

.u-lh-140 {
  line-height: var(--lh-140) !important;
}

.u-lh-160 {
  line-height: var(--lh-160) !important;
}

.u-lh-180 {
  line-height: var(--lh-180) !important;
}

.u-lh-200 {
  line-height: var(--lh-200) !important;
}

.u-lh-260 {
  line-height: var(--lh-260) !important;
}

.u-lh-300 {
  line-height: var(--lh-300) !important;
}

/* Letter Spacing */
.u-ls-0 {
  letter-spacing: var(--ls-0) !important;
}

.u-ls-2 {
  letter-spacing: var(--ls-2) !important;
}

.u-ls-4 {
  letter-spacing: var(--ls-4) !important;
}

.u-ls-6 {
  letter-spacing: var(--ls-6) !important;
}

.u-ls-10 {
  letter-spacing: var(--ls-10) !important;
}

/* Text Align  */
.u-ta-left {
  text-align: left !important;
}

.u-ta-center {
  text-align: center !important;
}

.u-ta-right {
  text-align: right !important;
}

.u-note {
  margin-top: 1em;
  font-size: var(--fs-12);
  line-height: var(--lh-140);
}

.u-td-underline {
  text-decoration: underline;
}

/* List Design */
.u-list-basic li {
  position: relative;
  padding-left: 1em;
}

.u-list-basic li::before {
  position: absolute;
  top: 0;
  left: 0;
  color: var(--color-text-base);
  content: '・';
}

.u-list-basic li.--orange::before {
  color: var(--color-main);
}

.u-list-basic li+li {
  margin-top: var(--space-5);
}

.u-list-style1 li {
  position: relative;
  padding-left: 1em;
}

.u-list-style1 li::before {
  position: absolute;
  top: 0.6em;
  left: 0;
  width: var(--space-6);
  height: var(--space-6);
  background-color: var(--color-main);
  border-radius: var(--radius-round);
  content: '';
}

.u-list-style1 li.--black::before {
  background-color: var(--color-text-base);
}

.u-list-style1 li+li {
  margin-top: var(--space-5);
}

.u-list-o-style1 {
  list-style-type: decimal;
}

.u-list-o-style1 li+li {
  margin-top: var(--space-5);
}


/* Ellipsis  */
.u-ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Underline */
.u-tdeco-underline-orange {
  display: inline;
  line-height: var(--lh-200);
  border-bottom: 1px solid var(--color-orange);
  padding-bottom: var(--space-5);
}

/* Color */
.u-fc-white {
  color: var(--color-white) !important;
}

.u-fc-orange {
  color: var(--color-orange) !important;
}

.u-fc-pink {
  color: var(--color-pink) !important;
}

.u-fc-gray {
  color: var(--color-text-gray) !important;
}

.u-fc-pinkred {
  color: var(--color-pinkred) !important;
}

/* Marker */
.u-marker {
  --marker-size: 30%;
  background-image: linear-gradient(to top, var(--color-yellow-light) 30%, transparent 30%);
  background-repeat: no-repeat;
  background-size: 0 100%;
  background-size: 100% 100%;
  display: inline;
}

/* Link */
.c-link-basic {
  color: var(--color-blue) !important;
}

.c-link-basic svg {
  color: var(--color-blue);
  fill: var(--color-blue);
}

.c-link-basic.--underline {
  border-bottom: 1px solid var(--color-blue);
}

.c-link-basic.--underline:hover {
  border: none;
}

/*  BLOCK
========================================= */
.u-block {
  display: block;
}

.u-inline-block {
  display: inline-block;
}

/* IMAGE CAPTURE
========================================= */
/* 画像の外枠を強制的に正方形（1:1）にする */
.u-img-square {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1;
  overflow: hidden;
}

.u-img-square img {
  width: 100%;
  height: auto;
  object-fit: cover;
  object-position: center;
}

/* 写真の上端を基準にして切り抜く */
.u-img-square.--top img {
  object-position: top;
}

/*  SPACING
========================================= */
/*  Margin */
.u-m-0 {
  margin: var(--space-0) !important;
}

.u-m-5 {
  margin: var(--space-5) !important;
}

.u-m-10 {
  margin: var(--space-10) !important;
}

.u-m-15 {
  margin: var(--space-15) !important;
}

.u-m-20 {
  margin: var(--space-20) !important;
}

.u-m-25 {
  margin: var(--space-25) !important;
}

.u-m-30 {
  margin: var(--space-30) !important;
}

.u-m-40 {
  margin: var(--space-40) !important;
}

.u-m-60 {
  margin: var(--space-60) !important;
}

.u-m-80 {
  margin: var(--space-80) !important;
}

.u-m-100 {
  margin: var(--space-100) !important;
}

.u-m-120 {
  margin: var(--space-120) !important;
}

/*  Margin Top */
.u-mt--30 {
  margin-top: var(--space--30) !important;
}

.u-mt--3 {
  margin: var(--space--3) !important;
}

.u-mt--2 {
  margin: var(--space--2) !important;
}

.u-mt--1 {
  margin: var(--space--1) !important;
}

.u-mt-0 {
  margin-top: var(--space-0) !important;
}

.u-mt-6 {
  margin-top: var(--space-6) !important;
}

.u-mt-10 {
  margin-top: var(--space-10) !important;
}

.u-mt-15 {
  margin-top: var(--space-15) !important;
}

.u-mt-20 {
  margin-top: var(--space-20) !important;
}

.u-mt-25 {
  margin-top: var(--space-25) !important;
}

.u-mt-30 {
  margin-top: var(--space-30) !important;
}

.u-mt-40 {
  margin-top: var(--space-40) !important;
}

.u-mt-60 {
  margin-top: var(--space-60) !important;
}

.u-mt-80 {
  margin-top: var(--space-80) !important;
}

.u-mt-100 {
  margin-top: var(--space-100) !important;
}

.u-mt-120 {
  margin-top: var(--space-120) !important;
}

/*  Margin Right */
.u-mr-0 {
  margin-right: var(--space-0) !important;
}

.u-mr-5 {
  margin-right: var(--space-5) !important;
}

.u-mr-10 {
  margin-right: var(--space-10) !important;
}

.u-mr-15 {
  margin-right: var(--space-15) !important;
}

.u-mr-20 {
  margin-right: var(--space-20) !important;
}

.u-mr-25 {
  margin-right: var(--space-25) !important;
}

.u-mr-30 {
  margin-right: var(--space-30) !important;
}

.u-mr-40 {
  margin-right: var(--space-40) !important;
}

.u-mr-60 {
  margin-right: var(--space-60) !important;
}

.u-mr-80 {
  margin-right: var(--space-80) !important;
}

.u-mr-100 {
  margin-right: var(--space-100) !important;
}

.u-mr-120 {
  margin-right: var(--space-120) !important;
}

/*  Margin Bottom  */
.u-mb-0 {
  margin-bottom: var(--space-0) !important;
}

.u-mb-5 {
  margin-bottom: var(--space-5) !important;
}

.u-mb-10 {
  margin-bottom: var(--space-10) !important;
}

.u-mb-15 {
  margin-bottom: var(--space-15) !important;
}

.u-mb-20 {
  margin-bottom: var(--space-20) !important;
}

.u-mb-25 {
  margin-bottom: var(--space-25) !important;
}

.u-mb-30 {
  margin-bottom: var(--space-30) !important;
}

.u-mb-40 {
  margin-bottom: var(--space-40) !important;
}

.u-mb-60 {
  margin-bottom: var(--space-60) !important;
}

.u-mb-80 {
  margin-bottom: var(--space-80) !important;
}

.u-mb-100 {
  margin-bottom: var(--space-100) !important;
}

.u-mb-120 {
  margin-bottom: var(--space-120) !important;
}

/*  Margin Left */
.u-ml-0 {
  margin-left: var(--space-0) !important;
}

.u-ml-5 {
  margin-left: var(--space-5) !important;
}

.u-ml-10 {
  margin-left: var(--space-10) !important;
}

.u-ml-15 {
  margin-left: var(--space-15) !important;
}

.u-ml-20 {
  margin-left: var(--space-20) !important;
}

.u-ml-25 {
  margin-left: var(--space-25) !important;
}

.u-ml-30 {
  margin-left: var(--space-30) !important;
}

.u-ml-40 {
  margin-left: var(--space-40) !important;
}

.u-ml-60 {
  margin-left: var(--space-60) !important;
}

.u-ml-80 {
  margin-left: var(--space-80) !important;
}

.u-ml-100 {
  margin-left: var(--space-100) !important;
}

.u-ml-120 {
  margin-left: var(--space-120) !important;
}

/*  Margin Left/Right Auto */
.u-mr-auto {
  margin-right: auto !important;
}

.u-ml-auto {
  margin-left: auto !important;
}

.u-mx-auto {
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Margin All */
.u-m-10 {
  margin: var(--space-10) !important;
  margin: var(--space-10) !important;
}

.u-m-15 {
  margin: var(--space-15) !important;
  margin: var(--space-15) !important;
}

.u-m-20 {
  margin: var(--space-20) !important;
  margin: var(--space-20) !important;
}

.u-m-40 {
  margin: var(--space-40) !important;
  margin: var(--space-40) !important;
}

.u-m-60 {
  margin: var(--space-60) !important;
  margin: var(--space-60) !important;
}

.u-m-80 {
  margin: var(--space-80) !important;
  margin: var(--space-80) !important;
}

.u-m-100 {
  margin: var(--space-100) !important;
  margin: var(--space-100) !important;
}

.u-m-120 {
  margin: var(--space-120) !important;
  margin: var(--space-120) !important;
}

/* Padding Left/Right */
.u-px-5 {
  padding-left: var(--space-5) !important;
  padding-right: var(--space-5) !important;
}

.u-px-10 {
  padding-left: var(--space-10) !important;
  padding-right: var(--space-10) !important;
}

.u-px-15 {
  padding-left: var(--space-15) !important;
  padding-right: var(--space-15) !important;
}

.u-px-20 {
  padding-left: var(--space-20) !important;
  padding-right: var(--space-20) !important;
}

.u-px-30 {
  padding-left: var(--space-30) !important;
  padding-right: var(--space-30) !important;
}

.u-px-40 {
  padding-left: var(--space-40) !important;
  padding-right: var(--space-40) !important;
}

.u-px-60 {
  padding-left: var(--space-60) !important;
  padding-right: var(--space-60) !important;
}

/* Padding Top/Bottom */
.u-py-10 {
  padding-top: var(--space-10) !important;
  padding-bottom: var(--space-10) !important;
}

.u-py-15 {
  padding-top: var(--space-15) !important;
  padding-bottom: var(--space-15) !important;
}

.u-py-20 {
  padding-top: var(--space-20) !important;
  padding-bottom: var(--space-20) !important;
}

.u-py-30 {
  padding-top: var(--space-30) !important;
  padding-bottom: var(--space-30) !important;
}

.u-py-40 {
  padding-top: var(--space-40) !important;
  padding-bottom: var(--space-40) !important;
}

.u-py-60 {
  padding-top: var(--space-60) !important;
  padding-bottom: var(--space-60) !important;
}

.u-py-80 {
  padding-top: var(--space-80) !important;
  padding-bottom: var(--space-80) !important;
}

.u-py-100 {
  padding-top: var(--space-100) !important;
  padding-bottom: var(--space-100) !important;
}

.u-py-120 {
  padding-top: var(--space-120) !important;
  padding-bottom: var(--space-120) !important;
}

/* Padding All */
.u-p-0 {
  padding: 0 !important;
  padding: 0 !important;
}

.u-p-5 {
  padding: var(--space-5) !important;
}

.u-p-10 {
  padding: var(--space-10) !important;
}

.u-p-15 {
  padding: var(--space-15) !important;
}

.u-p-20 {
  padding: var(--space-20) !important;
}

.u-p-30 {
  padding: var(--space-30) !important;
}

.u-p-40 {
  padding: var(--space-40) !important;
}

.u-p-60 {
  padding: var(--space-60) !important;
}

.u-p-80 {
  padding: var(--space-80) !important;
}

.u-p-100 {
  padding: var(--space-100) !important;
}

.u-p-120 {
  padding: var(--space-120) !important;
}

@media (min-width: 768px) {

  /*  Margin */
  .u-m-tbpc-0 {
    margin: var(--space-0) !important;
  }

  .u-m-tbpc-5 {
    margin: var(--space-5) !important;
  }

  .u-m-tbpc-10 {
    margin: var(--space-10) !important;
  }

  .u-m-tbpc-15 {
    margin: var(--space-15) !important;
  }

  .u-m-tbpc-20 {
    margin: var(--space-20) !important;
  }

  .u-m-tbpc-25 {
    margin: var(--space-25) !important;
  }

  .u-m-tbpc-30 {
    margin: var(--space-30) !important;
  }

  .u-m-tbpc-40 {
    margin: var(--space-40) !important;
  }

  .u-m-tbpc-60 {
    margin: var(--space-60) !important;
  }

  .u-m-tbpc-80 {
    margin: var(--space-80) !important;
  }

  .u-m-tbpc-100 {
    margin: var(--space-100) !important;
  }

  .u-m-tbpc-120 {
    margin: var(--space-120) !important;
  }

  /*  Margin Top */
  .u-mt-tbpc-0 {
    margin-top: var(--space-0) !important;
  }

  .u-mt-tbpc-6 {
    margin-top: var(--space-6) !important;
  }

  .u-mt-tbpc-10 {
    margin-top: var(--space-10) !important;
  }

  .u-mt-tbpc-15 {
    margin-top: var(--space-15) !important;
  }

  .u-mt-tbpc-20 {
    margin-top: var(--space-20) !important;
  }

  .u-mt-tbpc-25 {
    margin-top: var(--space-25) !important;
  }

  .u-mt-tbpc-30 {
    margin-top: var(--space-30) !important;
  }

  .u-mt-tbpc-40 {
    margin-top: var(--space-40) !important;
  }

  .u-mt-tbpc-60 {
    margin-top: var(--space-60) !important;
  }

  .u-mt-tbpc-80 {
    margin-top: var(--space-80) !important;
  }

  .u-mt-tbpc-100 {
    margin-top: var(--space-100) !important;
  }

  .u-mt-tbpc-120 {
    margin-top: var(--space-120) !important;
  }

  /*  Margin Right */
  .u-mr-tbpc-0 {
    margin-right: var(--space-0) !important;
  }

  .u-mr-tbpc-5 {
    margin-right: var(--space-5) !important;
  }

  .u-mr-tbpc-10 {
    margin-right: var(--space-10) !important;
  }

  .u-mr-tbpc-15 {
    margin-right: var(--space-15) !important;
  }

  .u-mr-tbpc-20 {
    margin-right: var(--space-20) !important;
  }

  .u-mr-tbpc-25 {
    margin-right: var(--space-25) !important;
  }

  .u-mr-tbpc-30 {
    margin-right: var(--space-30) !important;
  }

  .u-mr-tbpc-40 {
    margin-right: var(--space-40) !important;
  }

  .u-mr-tbpc-60 {
    margin-right: var(--space-60) !important;
  }

  .u-mr-tbpc-80 {
    margin-right: var(--space-80) !important;
  }

  .u-mr-tbpc-100 {
    margin-right: var(--space-100) !important;
  }

  .u-mr-tbpc-120 {
    margin-right: var(--space-120) !important;
  }

  /*  Margin Bottom  */
  .u-mb-tbpc-0 {
    margin-bottom: var(--space-0) !important;
  }

  .u-mb-tbpc-5 {
    margin-bottom: var(--space-5) !important;
  }

  .u-mb-tbpc-10 {
    margin-bottom: var(--space-10) !important;
  }

  .u-mb-tbpc-15 {
    margin-bottom: var(--space-15) !important;
  }

  .u-mb-tbpc-20 {
    margin-bottom: var(--space-20) !important;
  }

  .u-mb-tbpc-25 {
    margin-bottom: var(--space-25) !important;
  }

  .u-mb-tbpc-30 {
    margin-bottom: var(--space-30) !important;
  }

  .u-mb-tbpc-40 {
    margin-bottom: var(--space-40) !important;
  }

  .u-mb-tbpc-60 {
    margin-bottom: var(--space-60) !important;
  }

  .u-mb-tbpc-80 {
    margin-bottom: var(--space-80) !important;
  }

  .u-mb-tbpc-100 {
    margin-bottom: var(--space-100) !important;
  }

  .u-mb-tbpc-120 {
    margin-bottom: var(--space-120) !important;
  }

  /*  Margin Left */
  .u-ml-tbpc-0 {
    margin-left: var(--space-0) !important;
  }

  .u-ml-tbpc-5 {
    margin-left: var(--space-5) !important;
  }

  .u-ml-tbpc-10 {
    margin-left: var(--space-10) !important;
  }

  .u-ml-tbpc-15 {
    margin-left: var(--space-15) !important;
  }

  .u-ml-tbpc-20 {
    margin-left: var(--space-20) !important;
  }

  .u-ml-tbpc-25 {
    margin-left: var(--space-25) !important;
  }

  .u-ml-tbpc-30 {
    margin-left: var(--space-30) !important;
  }

  .u-ml-tbpc-40 {
    margin-left: var(--space-40) !important;
  }

  .u-ml-tbpc-60 {
    margin-left: var(--space-60) !important;
  }

  .u-ml-tbpc-80 {
    margin-left: var(--space-80) !important;
  }

  .u-ml-tbpc-100 {
    margin-left: var(--space-100) !important;
  }

  .u-ml-tbpc-120 {
    margin-left: var(--space-120) !important;
  }

  /* Padding All */
  .u-p-tbpc-5 {
    padding: var(--space-5) !important;
    padding: var(--space-5) !important;
  }

  .u-p-tbpc-10 {
    padding: var(--space-10) !important;
    padding: var(--space-10) !important;
  }

  .u-p-tbpc-15 {
    padding: var(--space-15) !important;
    padding: var(--space-15) !important;
  }

  .u-p-tbpc-20 {
    padding: var(--space-20) !important;
    padding: var(--space-20) !important;
  }

  .u-p-tbpc-30 {
    padding: var(--space-30) !important;
    padding: var(--space-30) !important;
  }

  .u-p-tbpc-40 {
    padding: var(--space-40) !important;
    padding: var(--space-40) !important;
  }

  .u-p-tbpc-60 {
    padding: var(--space-60) !important;
    padding: var(--space-60) !important;
  }

  .u-p-tbpc-80 {
    padding: var(--space-80) !important;
    padding: var(--space-80) !important;
  }

  .u-p-tbpc-100 {
    padding: var(--space-100) !important;
    padding: var(--space-100) !important;
  }

  .u-p-tbpc-120 {
    padding: var(--space-120) !important;
    padding: var(--space-120) !important;
  }

  .u-py-tbpc-10 {
    padding-top: var(--space-10) !important;
    padding-bottom: var(--space-10) !important;
  }

  .u-py-tbpc-15 {
    padding-top: var(--space-15) !important;
    padding-bottom: var(--space-15) !important;
  }

  .u-py-tbpc-20 {
    padding-top: var(--space-20) !important;
    padding-bottom: var(--space-20) !important;
  }

  .u-py-tbpc-30 {
    padding-top: var(--space-30) !important;
    padding-bottom: var(--space-20) !important;
  }

  .u-py-tbpc-40 {
    padding-top: var(--space-40) !important;
    padding-bottom: var(--space-40) !important;
  }

  .u-py-tbpc-60 {
    padding-top: var(--space-60) !important;
    padding-bottom: var(--space-60) !important;
  }

  .u-py-tbpc-80 {
    padding-top: var(--space-80) !important;
    padding-bottom: var(--space-80) !important;
  }

  .u-py-tbpc-100 {
    padding-top: var(--space-100) !important;
    padding-bottom: var(--space-100) !important;
  }

  .u-py-tbpc-120 {
    padding-top: var(--space-120) !important;
    padding-bottom: var(--space-120) !important;
  }

  .u-px-tbpc-0 {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .u-px-tbpc-10 {
    padding-left: var(--space-10) !important;
    padding-right: var(--space-10) !important;
  }

  .u-px-tbpc-15 {
    padding-left: var(--space-15) !important;
    padding-right: var(--space-15) !important;
  }

  .u-px-tbpc-20 {
    padding-left: var(--space-20) !important;
    padding-right: var(--space-20) !important;
  }

  .u-px-tbpc-30 {
    padding-left: var(--space-30) !important;
    padding-right: var(--space-20) !important;
  }

  .u-px-tbpc-40 {
    padding-left: var(--space-40) !important;
    padding-right: var(--space-40) !important;
  }

  .u-px-tbpc-60 {
    padding-left: var(--space-60) !important;
    padding-right: var(--space-60) !important;
  }

  .u-px-tbpc-80 {
    padding-left: var(--space-80) !important;
    padding-right: var(--space-80) !important;
  }

  .u-px-tbpc-100 {
    padding-left: var(--space-100) !important;
    padding-right: var(--space-100) !important;
  }

  .u-px-tbpc-120 {
    padding-left: var(--space-120) !important;
    padding-right: var(--space-120) !important;
  }
}

@media (min-width: 1024px) {

  /*  Margin */
  .u-m-pc-0 {
    margin: var(--space-0) !important;
  }

  .u-m-pc-5 {
    margin: var(--space-5) !important;
  }

  .u-m-pc-10 {
    margin: var(--space-10) !important;
  }

  .u-m-pc-15 {
    margin: var(--space-15) !important;
  }

  .u-m-pc-20 {
    margin: var(--space-20) !important;
  }

  .u-m-pc-25 {
    margin: var(--space-25) !important;
  }

  .u-m-pc-30 {
    margin: var(--space-30) !important;
  }

  .u-m-pc-40 {
    margin: var(--space-40) !important;
  }

  .u-m-pc-60 {
    margin: var(--space-60) !important;
  }

  .u-m-pc-80 {
    margin: var(--space-80) !important;
  }

  .u-m-pc-100 {
    margin: var(--space-100) !important;
  }

  .u-m-pc-120 {
    margin: var(--space-120) !important;
  }

  /*  Margin Top */
  .u-mt-pc-0 {
    margin-top: var(--space-0) !important;
  }

  .u-mt-pc-6 {
    margin-top: var(--space-6) !important;
  }

  .u-mt-pc-10 {
    margin-top: var(--space-10) !important;
  }

  .u-mt-pc-15 {
    margin-top: var(--space-15) !important;
  }

  .u-mt-pc-20 {
    margin-top: var(--space-20) !important;
  }

  .u-mt-pc-25 {
    margin-top: var(--space-25) !important;
  }

  .u-mt-pc-30 {
    margin-top: var(--space-30) !important;
  }

  .u-mt-pc-40 {
    margin-top: var(--space-40) !important;
  }

  .u-mt-pc-60 {
    margin-top: var(--space-60) !important;
  }

  .u-mt-pc-80 {
    margin-top: var(--space-80) !important;
  }

  .u-mt-pc-100 {
    margin-top: var(--space-100) !important;
  }

  .u-mt-pc-120 {
    margin-top: var(--space-120) !important;
  }

  /*  Margin Right */
  .u-mr-pc-0 {
    margin-right: var(--space-0) !important;
  }

  .u-mr-pc-5 {
    margin-right: var(--space-5) !important;
  }

  .u-mr-pc-10 {
    margin-right: var(--space-10) !important;
  }

  .u-mr-pc-15 {
    margin-right: var(--space-15) !important;
  }

  .u-mr-pc-20 {
    margin-right: var(--space-20) !important;
  }

  .u-mr-pc-25 {
    margin-right: var(--space-25) !important;
  }

  .u-mr-pc-30 {
    margin-right: var(--space-30) !important;
  }

  .u-mr-pc-40 {
    margin-right: var(--space-40) !important;
  }

  .u-mr-pc-60 {
    margin-right: var(--space-60) !important;
  }

  .u-mr-pc-80 {
    margin-right: var(--space-80) !important;
  }

  .u-mr-pc-100 {
    margin-right: var(--space-100) !important;
  }

  .u-mr-pc-120 {
    margin-right: var(--space-120) !important;
  }

  /*  Margin Bottom  */
  .u-mb-pc-0 {
    margin-bottom: var(--space-0) !important;
  }

  .u-mb-pc-5 {
    margin-bottom: var(--space-5) !important;
  }

  .u-mb-pc-10 {
    margin-bottom: var(--space-10) !important;
  }

  .u-mb-pc-15 {
    margin-bottom: var(--space-15) !important;
  }

  .u-mb-pc-20 {
    margin-bottom: var(--space-20) !important;
  }

  .u-mb-pc-25 {
    margin-bottom: var(--space-25) !important;
  }

  .u-mb-pc-30 {
    margin-bottom: var(--space-30) !important;
  }

  .u-mb-pc-40 {
    margin-bottom: var(--space-40) !important;
  }

  .u-mb-pc-60 {
    margin-bottom: var(--space-60) !important;
  }

  .u-mb-pc-80 {
    margin-bottom: var(--space-80) !important;
  }

  .u-mb-pc-100 {
    margin-bottom: var(--space-100) !important;
  }

  .u-mb-pc-120 {
    margin-bottom: var(--space-120) !important;
  }

  /*  Margin Left */
  .u-ml-pc-0 {
    margin-left: var(--space-0) !important;
  }

  .u-ml-pc-5 {
    margin-left: var(--space-5) !important;
  }

  .u-ml-pc-10 {
    margin-left: var(--space-10) !important;
  }

  .u-ml-pc-15 {
    margin-left: var(--space-15) !important;
  }

  .u-ml-pc-20 {
    margin-left: var(--space-20) !important;
  }

  .u-ml-pc-25 {
    margin-left: var(--space-25) !important;
  }

  .u-ml-pc-30 {
    margin-left: var(--space-30) !important;
  }

  .u-ml-pc-40 {
    margin-left: var(--space-40) !important;
  }

  .u-ml-pc-60 {
    margin-left: var(--space-60) !important;
  }

  .u-ml-pc-80 {
    margin-left: var(--space-80) !important;
  }

  .u-ml-pc-100 {
    margin-left: var(--space-100) !important;
  }

  .u-ml-pc-120 {
    margin-left: var(--space-120) !important;
  }

  .u-my-pc-10 {
    margin-top: var(--space-10) !important;
    margin-bottom: var(--space-10) !important;
  }

  .u-my-pc-15 {
    margin-top: var(--space-15) !important;
    margin-bottom: var(--space-15) !important;
  }

  .u-my-pc-20 {
    margin-top: var(--space-20) !important;
    margin-bottom: var(--space-20) !important;
  }

  .u-my-pc-40 {
    margin-top: var(--space-40) !important;
    margin-bottom: var(--space-40) !important;
  }

  .u-my-pc-60 {
    margin-top: var(--space-60) !important;
    margin-bottom: var(--space-60) !important;
  }

  .u-my-pc-80 {
    margin-top: var(--space-80) !important;
    margin-bottom: var(--space-80) !important;
  }

  .u-my-pc-100 {
    margin-top: var(--space-100) !important;
    margin-bottom: var(--space-100) !important;
  }

  .u-my-pc-120 {
    margin-top: var(--space-120) !important;
    margin-bottom: var(--space-120) !important;
  }

  .u-mx-pc-10 {
    margin-left: var(--space-10) !important;
    margin-right: var(--space-10) !important;
  }

  .u-mx-pc-15 {
    margin-left: var(--space-15) !important;
    margin-right: var(--space-15) !important;
  }

  .u-mx-pc-20 {
    margin-left: var(--space-20) !important;
    margin-right: var(--space-20) !important;
  }

  .u-mx-pc-40 {
    margin-left: var(--space-40) !important;
    margin-right: var(--space-40) !important;
  }

  .u-mx-pc-60 {
    margin-left: var(--space-60) !important;
    margin-right: var(--space-60) !important;
  }

  .u-mx-pc-80 {
    margin-left: var(--space-80) !important;
    margin-right: var(--space-80) !important;
  }

  .u-mx-pc-100 {
    margin-left: var(--space-100) !important;
    margin-right: var(--space-100) !important;
  }

  .u-mx-pc-120 {
    margin-left: var(--space-120) !important;
    margin-right: var(--space-120) !important;
  }

  .u-py-pc-10 {
    padding-top: var(--space-10) !important;
    padding-bottom: var(--space-10) !important;
  }

  .u-py-pc-15 {
    padding-top: var(--space-15) !important;
    padding-bottom: var(--space-15) !important;
  }

  .u-py-pc-20 {
    padding-top: var(--space-20) !important;
    padding-bottom: var(--space-20) !important;
  }

  .u-py-pc-40 {
    padding-top: var(--space-40) !important;
    padding-bottom: var(--space-40) !important;
  }

  .u-py-pc-60 {
    padding-top: var(--space-60) !important;
    padding-bottom: var(--space-60) !important;
  }

  .u-py-pc-80 {
    padding-top: var(--space-80) !important;
    padding-bottom: var(--space-80) !important;
  }

  .u-py-pc-100 {
    padding-top: var(--space-100) !important;
    padding-bottom: var(--space-100) !important;
  }

  .u-py-pc-120 {
    padding-top: var(--space-120) !important;
    padding-bottom: var(--space-120) !important;
  }

  .u-px-pc-10 {
    padding-left: var(--space-10) !important;
    padding-right: var(--space-10) !important;
  }

  .u-px-pc-15 {
    padding-left: var(--space-15) !important;
    padding-right: var(--space-15) !important;
  }

  .u-px-pc-20 {
    padding-left: var(--space-20) !important;
    padding-right: var(--space-20) !important;
  }

  .u-px-pc-40 {
    padding-left: var(--space-40) !important;
    padding-right: var(--space-40) !important;
  }

  .u-px-pc-60 {
    padding-left: var(--space-60) !important;
    padding-right: var(--space-60) !important;
  }

  .u-px-pc-80 {
    padding-left: var(--space-80) !important;
    padding-right: var(--space-80) !important;
  }

  .u-px-pc-100 {
    padding-left: var(--space-100) !important;
    padding-right: var(--space-100) !important;
  }

  .u-px-pc-120 {
    padding-left: var(--space-120) !important;
    padding-right: var(--space-120) !important;
  }
}

/*  BORDERS
========================================= */
.u-bdr-t {
  border-top: 1px solid var(--color-border-base);
}

.u-bdr-r {
  border-right: 1px solid var(--color-border-base);
}

.u-bdr-b {
  border-bottom: 1px solid var(--color-border-base);
}

.u-bdr-l {
  border-left: 1px solid var(--color-border-base);
}

/*  IMAGES
========================================= */
.u-img-responsive {
  max-width: 100%;
  height: auto;
  display: block;
}

/*  FLEXBOX
========================================= */
.u-flex {
  display: flex !important;
}

.u-flex-center {
  display: flex;
  align-items: center;
  justify-content: center;
}

.u-flex-between {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.u-flex-v-normal {
  align-items: normal;
}

.u-flex-v-start {
  align-items: start;
}

.u-flex-v-center {
  align-items: center;
}

.u-flex-v-baseline {
  align-items: baseline;
}

.u-flex-justify-center {
  justify-content: center;
}

.u-flex-justify-start {
  justify-content: start;
}

.u-flex-justify-end {
  justify-content: end;
}

.u-flex-wrap {
  flex-wrap: wrap;
}

.u-flex-col {
  display: flex;
  flex-direction: column;
}

.u-flex-stretch {
  display: flex;
  align-items: stretch;
}

.u-flex-item-stretch {
  flex: 1 1 auto;
}

.u-gap-0 {
  gap: 0 !important;
}

.u-gap-5 {
  gap: var(--space-5) !important;
}

.u-gap-10 {
  gap: var(--space-10) !important;
}

.u-gap-15 {
  gap: var(--space-15) !important;
}

.u-gap-20 {
  gap: var(--space-20) !important;
}

.u-gap-25 {
  gap: var(--space-25) !important;
}

.u-gap-30 {
  gap: var(--space-30) !important;
}

.u-gap-35 {
  gap: var(--space-35) !important;
}

.u-gap-40 {
  gap: var(--space-40) !important;
}

.u-gap-45 {
  gap: var(--space-45) !important;
}

.u-gap-60 {
  gap: var(--space-60) !important;
}

.u-gap-100 {
  gap: var(--space-100) !important;
}

@media (max-width: 767px) {
  .u-flex-sp-flex {
    display: flex !important;
    flex-wrap: wrap;
    gap: var(--space-6);
    width: 100%;
  }

  .u-flex-sp-flex>* {
    width: calc(50% - var(--space-3));
  }

  .u-flex-sp-block {
    display: block !important;
  }

  .u-gap-sp-15 {
    gap: var(--space-15) !important;
  }

  .u-gap-sp-30 {
    gap: var(--space-30) !important;
  }
}

@media (min-width: 768px) {
  .u-flex-tbpc-nowrap {
    flex-wrap: nowrap !important;
  }

  .u-gap-tbpc-10 {
    gap: var(--space-10) !important;
  }

  .u-gap-tbpc-15 {
    gap: var(--space-15) !important;
  }

  .u-gap-tbpc-20 {
    gap: var(--space-20) !important;
  }

  .u-gap-tbpc-25 {
    gap: var(--space-25) !important;
  }

  .u-gap-tbpc-30 {
    gap: var(--space-30) !important;
  }

  .u-gap-tbpc-35 {
    gap: var(--space-35) !important;
  }

  .u-gap-tbpc-40 {
    gap: var(--space-40) !important;
  }

  .u-gap-tbpc-45 {
    gap: var(--space-45) !important;
  }

  .u-gap-tbpc-60 {
    gap: var(--space-60) !important;
  }

  .u-gap-tbpc-100 {
    gap: var(--space-100);
  }
}

@media (min-width: 1024px) {
  .u-flex-pc-v-normal {
    align-items: normal;
  }

  .u-flex-pc-nowrap {
    flex-wrap: nowrap !important;
  }

  .u-gap-pc-10 {
    gap: var(--space-10) !important;
  }

  .u-gap-pc-15 {
    gap: var(--space-15) !important;
  }

  .u-gap-pc-20 {
    gap: var(--space-20) !important;
  }

  .u-gap-pc-25 {
    gap: var(--space-25) !important;
  }

  .u-gap-pc-30 {
    gap: var(--space-30) !important;
  }

  .u-gap-pc-35 {
    gap: var(--space-35) !important;
  }

  .u-gap-pc-40 {
    gap: var(--space-40) !important;
  }

  .u-gap-pc-45 {
    gap: var(--space-45) !important;
  }

  .u-gap-pc-60 {
    gap: var(--space-60) !important;
  }

  .u-gap-pc-100 {
    gap: var(--space-100);
  }
}

/*  GRID COLUMN
========================================= */
.u-grid {
  display: grid;
  gap: var(--space-20);
}

.u-grid.--gap-40 {
  gap: var(--space-40);
}

.u-grid.--gap-60 {
  gap: var(--space-60);
}

.c-grid-item.--span-2 {
  grid-column: span 2;
}

.c-grid-item.--span-3 {
  grid-column: span 3;
}

.c-grid-item.--span-4 {
  grid-column: span 4;
}

.c-grid-item.--span-5 {
  grid-column: span 5;
}

.c-grid-item.--span-6 {
  grid-column: span 6;
}

@media (min-width: 768px) {
  .u-grid-2 {
    grid-template-columns: repeat(2, 1fr);
  }

  .u-grid-3 {
    grid-template-columns: repeat(3, 1fr);
  }

  .u-grid-4 {
    grid-template-columns: repeat(4, 1fr);
  }

  .u-grid-5 {
    grid-template-columns: repeat(5, 1fr);
  }

  .u-grid-6 {
    grid-template-columns: repeat(6, 1fr);
  }
}

@media (max-width: 767px) {
  .u-grid {
    grid-template-columns: 1fr !important;
  }

  .u-grid-sp2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  .c-grid-item.--span-2 {
    grid-column: auto;
  }

  .c-grid-item.--span-3 {
    grid-column: auto;
  }

  .c-grid-item.--span-4 {
    grid-column: auto;
  }

  .c-grid-item.--span-5 {
    grid-column: auto;
  }

  .c-grid-item.--span-6 {
    grid-column: auto;
  }
}

/* RESPONSIVE BREAK (改行コントロール)
========================================= */
.u-view-pc,
.u-view-tb,
.u-view-sp,
.u-view-tbpc,
.u-view-tbsp {
  display: none !important;
}

/* PCサイズのみ (1024px以上) */
@media (min-width: 1024px) {
  .u-view-pc {
    display: block !important;
  }
}

/* タブレットサイズのみ (768px〜1023px) */
@media (min-width: 768px) and (max-width: 1023px) {
  .u-view-tb {
    display: block !important;
  }
}

/* スマホサイズのみ (767px以下) */
@media (max-width: 767px) {
  .u-view-sp {
    display: block !important;
  }
}

/* PC ＋ タブレット (768px以上) */
@media (min-width: 768px) {
  .u-view-tbpc {
    display: block !important;
  }
}

/* タブレット ＋ スマホ (1023px以下) */
@media (max-width: 1023px) {
  .u-view-tbsp {
    display: block !important;
  }
}

/* BUTTON BASE
========================================= */
.u-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--w-full);
  border-radius: var(--radius-m);
  border: var(--border-default);
  cursor: pointer;
  user-select: none;
  transition: all var(--transition);
  text-align: center;
  vertical-align: middle;
  line-height: var(--lh-100);
}

.u-btn:hover {
  opacity: var(--opacity-hover);
  transform: translateY(-2px);
  box-shadow: var(--shadow-m);
}

.u-btn.--disabled {
  pointer-events: none !important;
  background-color: var(--color-bg-gry-light) !important;
}

/* Shiryou + OC */
.u-btn-shiryou,
.u-btn-oc {
  color: var(--color-bg-white);
  border: 2px solid var(--color-text-base);
  padding: var(--space-30) var(--space-15);
  box-shadow: var(--shadow-hard);
  font-size: var(--fs-18);
  font-weight: var(--fw-medium);
}

.u-btn-shiryou {
  background: var(--color-pink);
}

.u-btn-oc {
  background: var(--color-main);
}

.u-btn-shiryou:hover,
.u-btn-oc:hover {
  opacity: var(--opacity-hover);
  transform: translateY(2px);
  box-shadow: none;
}

.u-btn-shiryou-icon,
.u-btn-oc-icon {
  width: 1.111em;
  height: 1.111em;
  fill: var(--color-white);
  color: var(--color-white);
}

/* Outline */
.u-btn-outline {
  max-width: var(--w-max-btn);
  padding: var(--space-25) var(--space-30);
  background: var(--color-bg-white);
  border: var(--border-base);
  color: var(--color-text-base);
  font-weight: var(--fw-medium);
  line-height: var(--lh-120);
}

.u-btn-outline-icon {
  width: 1.25em;
  height: 1.25em;
  color: var(--color-main);
  fill: var(--color-main);
}

/* Outline-between */
.u-btn-outline-between {
  justify-content: space-between;
  max-width: var(--w-max-btn);
  padding: var(--space-25) var(--space-30);
  background: var(--color-bg-white);
  border: var(--border-base);
  color: var(--color-text-base);
  font-weight: var(--fw-medium);
  line-height: var(--lh-120);
}

.u-btn-outline-between-icon {
  width: 0.75em;
  min-width: 0.75em;
  height: 0.75em;
  min-height: 0.75em;
}

.u-btn-outline-between-icon.--w {
  width: 1.5em;
  min-width: 1.5em;
  height: 1.5em;
  min-height: 1.5em;
}

.u-btn-outline-between-icon.--w2 {
  width: 1em;
  min-width: 1em;
  height: 1em;
  min-height: 1em;
}

/* Outline + Shadow */
.u-btn-outline-shadow {
  max-width: var(--w-max-btn);
  padding: var(--space-25) var(--space-30);
  background: var(--color-bg-white);
  border: var(--border-base);
  box-shadow: var(--shadow-hard);
  color: var(--color-text-base);
  font-weight: var(--fw-medium);
}

.u-btn-outline-shadow-icon {
  width: 1.25em;
  height: 1.25em;
  color: var(--color-main);
  fill: var(--color-main);
}

/* Entry AO */
.u-btn-entry-ao {
  max-width: var(--w-max-btn);
  min-height: 65px;
  padding: var(--space-10) var(--space-30);
  background: var(--color-purple);
  border: var(--color-purple);
  color: var(--color-text-light);
  font-weight: var(--fw-medium);
  line-height: var(--lh-120);
}

.u-btn-entry-ao-icon {
  width: 0.75em;
  height: 0.75em;
  color: var(--color-text-light);
  fill: var(--color-text-light);
  margin-left: auto;
}

/* Entry COMMON */
.u-btn-entry-common {
  max-width: var(--w-max-btn);
  min-height: 65px;
  padding: var(--space-10) var(--space-30);
  background: var(--color-blue);
  border: var(--color-blue);
  color: var(--color-text-light);
  font-weight: var(--fw-medium);
  line-height: var(--lh-120);
}

.u-btn-entry-common-icon {
  width: 0.75em;
  height: 0.75em;
  color: var(--color-text-light);
  fill: var(--color-text-light);
  margin-left: auto;
}

/* More */
.u-button-more {
  display: inline-block;
  max-width: var(--w-max-btn);
  padding: var(--space-10) var(--space-25);
  background: var(--color-bg-white);
  border: var(--border-base);
  border-radius: var(--radius-round);
  color: var(--color-text-base);
  font-weight: var(--fw-medium);
  font-size: var(--fs-14);
}

.u-btn-more-icon {
  display: inline-block;
  width: 0.857em;
  height: 0.857em;
  color: var(--color-text-base);
  fill: var(--color-text-base);
}

/* Search */
.u-button-search {
  display: block;
  margin: auto;
  width: 100%;
  max-width: var(--w-max-btn);
  padding: var(--space-15) var(--space-25);
  background: var(--color-blue);
  border: none;
  border-radius: var(--radius-m);
  color: var(--color-text-light);
  font-weight: var(--fw-medium);
  font-size: var(--fs-18);
}

.u-btn-search-icon {
  display: inline-block;
  width: 0.857em;
  height: 0.857em;
  color: var(--color-text-light);
  fill: var(--color-text-light);
}

/* Form Entry */
.u-btn-form-next {
  width: 80%;
  max-width: var(--w-max-btn);
  min-height: 65px;
  padding: var(--space-10) var(--space-30);
  background: var(--color-orange);
  border: var(--border-base);
  color: var(--color-text-light);
  font-weight: var(--fw-medium);
  line-height: var(--lh-120);
}

.u-btn-form-next-icon {
  width: 0.75em;
  height: 0.75em;
  color: var(--color-text-light);
  fill: var(--color-text-light);
}

.u-btn-form-back {
  width: 80%;
  max-width: var(--w-max-btn);
  min-height: 65px;
  padding: var(--space-10) var(--space-30);
  background: var(--color-white);
  border: var(--border-base);
  color: var(--color-text-base);
  font-weight: var(--fw-medium);
  line-height: var(--lh-120);
}

.u-btn-form-back-icon {
  width: 0.75em;
  height: 0.75em;
  color: var(--color-text-base);
  fill: var(--color-text-base);
}

.u-btn-form-submit {
  width: 80%;
  max-width: var(--w-max-btn);
  min-height: 65px;
  padding: var(--space-10) var(--space-30);
  background: var(--color-pinkred);
  border: var(--border-base);
  color: var(--color-text-light);
  font-weight: var(--fw-medium);
  line-height: var(--lh-120);
  box-shadow: var(--shadow-hard);
}

.u-btn-form-submit-icon {
  width: 0.75em;
  height: 0.75em;
  color: var(--color-text-light);
  fill: var(--color-text-light);
}


/* Header */
.u-h-btn-icon-l {
  display: inline-block;
  vertical-align: middle;
  width: 1.077em;
  height: 1.077em;
}

.u-h-btn-icon {
  display: inline-block;
  width: 0.75em;
  height: 0.75em;
}

/* Float to Top */
.u-float-totop {
  width: 50px;
  height: 50px;
  padding: calc(25px - 0.625em);
  background: var(--color-bg-white);
  border: var(--border-base);
  border-radius: var(--radius-ellipse);
  color: var(--color-text-base);
  font-weight: var(--fw-medium);
}

.u-float-totop-icon {
  width: 1.25em;
  height: 1.25em;
}

@media (min-width: 768px) {
  .u-float-totop {
    width: 40px;
    height: 40px;
    padding: calc(20px - 0.375em);
  }

  .u-float-totop-icon {
    width: 0.75em;
    height: 0.75em;
  }
}

/* BUTTON BOX
========================================= */
.u-btns-flex {
  display: flex;
  justify-content: center;
  align-items: stretch;
  flex-wrap: wrap;
  gap: var(--space-10);
  width: 100%;
  margin: 0 auto;
  grid-template-columns: repeat(2, 1fr);
}

.u-btns-flex>* {
  margin-right: auto;
  margin-left: auto;
  width: calc(50% - var(--space-5));
  max-width: none;
}

.u-btns-flex .u-btn {
  padding: var(--space-15);
  min-height: 60px;
}

@media screen and (max-width: 767px) {
  .u-btns-flex.--col-sp-1>* {
    width: 100%;
  }
}

@media screen and (min-width: 768px) {
  .u-btns-flex>* {
    margin-right: auto;
    margin-left: auto;
    width: calc(25% - var(--space-15));
  }

  .u-btns-flex.--col-pc-3>* {
    width: calc(33.333% - var(--space-15));
  }

  .u-btns-flex.--col-pc-2>* {
    width: calc(50% - var(--space-15));
  }

  .u-btns-flex.--col-pc-1>* {
    width: 100%;
  }
}

/* ANCHOR LINK
========================================= */
.c-anchorlink-grid {
  display: grid;
  gap: var(--space-10);
  width: 100%;
  margin: 0 auto;
  grid-template-columns: repeat(2, 1fr);
}

@media screen and (min-width: 768px) {
  .c-anchorlink-grid {
    grid-template-columns: repeat(4, 1fr);
    gap: 15px;
  }
}

@media screen and (min-width: 1024px) {
  .c-anchorlink-grid {
    grid-template-columns: repeat(5, 1fr);
  }
}

.c-anchorlink-button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 60px;
  padding: var(--space-10) var(--space-15);
  background-color: var(--color-bg-white);
  border: 1px solid var(--color-border-gray);
  border-radius: var(--radius-m);
  transition: background-color 0.3s, border-color 0.3s;
  color: var(--color-text-base);
  text-decoration: none;
}

.c-anchorlink-button:hover {
  background-color: var(--color-bg-soft);
  border-color: var(--color-border-gray-light);
}

.c-anchorlink-button span {
  font-size: var(--fs-14);
  text-align: left;
  line-height: var(--lh-120);
  padding-right: var(--space-10);
}

.c-anchorlink-icon {
  width: 8px;
  min-width: 8px;
  height: 8px;
  min-height: 8px;
}

@media screen and (max-width: 767px) {
  .c-anchorlink-button {
    padding: var(--space-6) var(--space-10);
    min-height: 44px;
  }

  .c-anchorlink-button span {
    font-size: var(--fs-12);
  }
}


/* ACCORDION
========================================= */
.c-accordion+.c-accordion {
  margin-top: var(--space-10);
}

.c-accordion__title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-15);
  min-height: 60px;
  padding: var(--space-15);
  border: 1px solid var(--color-border-gray-light);
  border-radius: var(--radius-m);
  box-shadow: var(--shadow-s);
  background-color: var(--color-bg-white);
  cursor: pointer;
  user-select: none;
  font-family: var(--font-family-en);
  font-weight: var(--fw-medium);
  transition: box-shadow 0.3s, opacity 0.3s;
}

.c-accordion__title:hover {
  opacity: var(--opacity-hover);
  box-shadow: none;
}

.c-accordion__title-text {
  display: flex;
  gap: var(--space-6);
}

.c-accordion__title-mark {
  display: block;
  font-size: var(--fs-18);
  font-weight: var(--fw-bold);
  line-height: var(--lh-120);
}

.c-accordion__title::-webkit-details-marker {
  display: none;
  /* Safariのデフォルト矢印を非表示 */
}

.c-accordion__icon {
  position: relative;
  width: 18px;
  height: 18px;
  flex-shrink: 0;
}

.c-accordion__icon svg {
  display: block !important;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100%;
  transform: translate(-50%, -50%);
  transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s;
}

.icon-plus {
  opacity: 1 !important;
  transform: scale(1);
  visibility: visible;
}

.icon-minus {
  opacity: 0 !important;
  transform: scale(0.6);
  visibility: hidden;
}

.c-accordion[open] .icon-plus {
  opacity: 0 !important;
  transform: translate(-50%, -50%) scale(0.6);
  visibility: hidden;
}

.c-accordion[open] .icon-minus {
  opacity: 1 !important;
  transform: translate(-50%, -50%) scale(1);
  visibility: visible;
}

.c-accordion__st {
  font-size: var(--fs-16);
  font-weight: var(--fw-bold);
}

.c-accordion__content {
  overflow: hidden;
  transition: max-height 0.6s cubic-bezier(0.4, 0, 0.2, 1);
  max-height: 0;
}

.c-accordion[open] .c-accordion__content {
  max-height: 600%;
}

.c-accordion__content-inner {
  margin-top: var(--space-10);
  padding: var(--space-15);
  border-radius: var(--radius-m);
  background-color: var(--color-bg-gry-light-f3);
  opacity: 0;
  transition: opacity 0.5s ease, transform 0.5s ease;
  transform-origin: top;
  transform: scaleY(0.95) translateY(-10px);
}

.c-accordion__content-inner p+p {
  margin-top: 1em;
}

.c-accordion[open] .c-accordion__content-inner {
  opacity: 1;
  transform: scaleY(1) translateY(0);
  transition-delay: 0.1s;
}

@media screen and (max-width: 767px) {
  .c-accordion__content-inner {
    font-size: var(--fs-14);
  }
}

/* TABS
========================================= */
.c-tabs-container {
  position: relative;
  display: flex;
  gap: var(--space-40);
  align-items: flex-start;
}

.c-tabs-nav {
  width: var(--w-tabs);
  flex-shrink: 0;
  /* position: sticky; */
}

.c-tabs-nav__inner {
  display: flex;
  flex-direction: column;
}

.c-tabs-nav__btn {
  padding: var(--space-30) var(--space-15);
  text-align: left;
  background: var(--color-bg-white);
  border: 1px solid var(--color-border-gray-light);
  margin-bottom: -1px;
  cursor: pointer;
  font-weight: var(--fw-bold);
  transition: all 0.3s ease;
  line-height: var(--lh-120);
}

.c-tabs-nav__btn.is-active {
  border-left: 4px solid var(--color-main);
  color: var(--color-main);
}

.c-tabs-content {
  flex-grow: 1;
  background-color: var(--color-bg-white);
  padding: var(--space-30);
  border: var(--border-base);
}

.c-tabs-content__panel {
  display: none;
  animation: panel_fadeIn 0.4s ease forwards;
}

.c-tabs-content__panel.is-show {
  display: block;
}

@keyframes panel_fadeIn {
  from {
    opacity: 0;
    transform: translateY(10px);
  }

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

@media (max-width: 767px) {
  .c-tabs-container {
    flex-direction: column;
    gap: 0;
  }

  .c-tabs-content {
    width: 100%;
    min-width: 0;
  }

  .c-tabs-nav {
    width: 100%;
    position: relative;
    top: 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .c-tabs-nav__inner {
    flex-direction: row;
  }

  .c-tabs-content {
    padding: var(--space-15);
    border-top: none;
  }

  .c-tabs-nav__btn {
    flex: 1;
    min-width: 25%;
    text-align: center;
    padding: var(--space-15);
    border: none;
    border-bottom: var(--border-base);
    border-radius: var(--radius-m) var(--radius-m) 0 0;
    margin-bottom: 0;
  }

  .c-tabs-nav__btn.is-active {
    background: transparent;
    border-left: none;
    border: var(--border-base);
    border-bottom-color: var(--color-white);
  }
}

/* Sticky */
@media (min-width: 768px) {
  .js-sticky-content {
    width: var(--w-tabs);
  }

  .--is-sticky {
    position: fixed;
    top: var(--height-header-pc);
    z-index: var(--z-contents);
  }

  .--is-bottom {
    position: absolute;
    top: auto;
    bottom: 0;
    left: 0;
  }
}

@media (max-width: 1023px) {
  .--is-sticky {
    top: var(--height-header-tbsp);
  }
}

/* 
  Contact Card
  ========================================================================== */
.c-contact-card {
  background-color: var(--color-bg-white);
  border: var(--border-base);
  border-radius: var(--radius-m);
  padding: var(--space-25);
  box-shadow: var(--shadow-hard);
}

.c-contact-card__title {
  font-size: var(--fs-20);
  font-weight: var(--fw-bold);
  margin-top: 0;
  margin-bottom: var(--space-15);
  border-bottom: 2px solid var(--color-green);
  padding-bottom: var(--space-10);
}

.c-contact-card__body {
  display: flex;
  flex-wrap: wrap;
  margin: 0;
}

.c-contact-card__label {
  width: 25%;
  font-weight: var(--fw-bold);
  padding: var(--space-6) 0;
  margin: 0;
  border-bottom: 1px solid var(--color-border-gray-light);
}

.c-contact-card__data {
  width: 70%;
  padding: var(--space-6) 0;
  margin: 0;
  border-bottom: 1px solid var(--color-border-gray-light);
}

.c-contact-card__label--sub {
  position: relative;
  padding-right: var(--space-15);
  font-weight: var(--fw-medium);
  text-align: right;
}

.c-contact-card__label--sub::before {
  content: "└ ";
  position: absolute;
  color: var(--color-text-gray);
}

/* リンク */
.c-contact-card__body a {
  color: #005bac;
  text-decoration: none;
}

.c-contact-card__body a:hover {
  text-decoration: underline;
}

/* PCでの電話発信無効化 */
@media (min-width: 768px) {
  .c-contact-card__body a[href^="tel:"] {
    pointer-events: none;
    cursor: default;
    color: inherit;
    text-decoration: none;
  }
}

/* NEWS LIST
========================================= */
.c-news-list-link {
  position: relative;
  display: block;
  width: 100%;
  padding: var(--space-15);
  border: var(--border-base);
  opacity: 0;
  transform: perspective(1000px) rotateY(-90deg);
  transition: transform 1.5s cubic-bezier(0.2, 1, 0.3, 1), opacity 0.8s ease;
  backface-visibility: hidden;
  overflow: hidden;
}

.c-news-list-link.is-active {
  opacity: 1;
  transform: perspective(1000px) rotateY(0);
}

.c-news-list__badge-new {
  position: absolute;
  top: -15px;
  left: -30px;
  width: 60px;
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--color-aqua);
  border-radius: var(--radius-round);
  border: var(--border-base);
  font-family: var(--font-family-en);
  font-weight: var(--fw-extrabold);
  font-size: var(--fs-13);
  z-index: var(--z-ajust-5);
  pointer-events: none;
  opacity: 1;
}

.c-news-list__img {
  position: relative;
}

.c-news-list__img img {
  width: 100%;
  height: auto;
}

.c-news-list__meta {
  margin-left: 0;
}

.c-news-list__date {
  margin-top: var(--space-10);
  color: var(--color-text-gray);
  font-size: var(--fs-14);
}

.c-news-list__title {
  margin-top: var(--space-5);
  font-weight: var(--fw-bold);
  font-size: var(--fs-16);
}

.c-news-list__department {
  margin-top: var(--space-5);
  font-size: var(--fs-12);
}

.c-news-list__excerpt {
  word-break: break-all;
  overflow-wrap: break-word;
  margin-top: var(--space-10);
  font-size: var(--fs-11);
}

.c-news-list__excerpt img {
  margin: auto;
}

@media (max-width: 767px) {
  .c-news-list__img {
    width: 65%;
    margin: auto;
  }
}

@media (min-width: 768px) {
  .c-news-list-group {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-30);
  }

  .c-news-list-link {
    padding: 0 var(--space-15) var(--space-15);
  }

  .c-news-list__badge-new {
    top: -10px;
    left: -10px;
  }
}

@media (min-width: 1024px) {
  .c-news-list-group {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-40);
  }
}

.c-news-list__arrow {
  position: absolute;
  right: var(--space-10);
  bottom: var(--space-10);
}

.c-news-list__arrow svg {
  width: .75em;
  height: .75em;
}

.c-article-box p+p {
  margin-top: 1em;
}

/* ICONS
========================================= */
.u-icon-angle-up {
  transform: rotate(-90deg);
}

.u-icon-angle-down {
  transform: rotate(90deg);
}

.u-icon-angle-left {
  transform: rotate(180deg);
}

.u-icon-angle-right {
  transform: rotate(-180deg);
}

.u-flip-x {
  transform: scaleX(-1);
}

.u-flip-y {
  transform: scaleY(-1);
}

.u-flip-both {
  transform: scale(-1, -1);
}

.u-icon-basic {
  display: inline-block;
  width: 0.75em;
  height: 0.75em;
  vertical-align: middle;
}

.u-icon-arrow {
  display: inline-block;
  width: 0.75em;
  height: 0.75em;
  vertical-align: middle;
}

.u-icon-download {
  display: inline-block;
  width: 1em;
  height: 1em;
  vertical-align: middle;
}

.u-icon-window {
  display: inline-block;
  width: 0.875em;
  height: 0.875em;
  vertical-align: middle;
}

.u-icon-pdf {
  display: inline-block;
  width: 2em;
  height: 1.4em;
  vertical-align: middle;
}

.u-icon-doc {
  display: inline-block;
  width: 2em;
  height: 1.4em;
  vertical-align: middle;
}

/* BORDER
========================================= */
.u-border-none {
  border: none !important;
}

.u-border-basic {
  border: var(--border-base) !important;
}

.u-border-slim-gray {
  border: 1px solid var(--color-border-gray) !important;
}

.u-border-bold-orange {
  border: 2px solid var(--color-orange) !important;
}

.u-border-bold-pinkred {
  border: 2px solid var(--color-pinkred) !important;
}

.u-border-bold-green {
  border: 2px solid var(--color-green) !important;
}

/* RADIUS
========================================= */
.u-border-radius-m {
  border-radius: var(--radius-m);
}

.u-border-radius-round {
  border-radius: var(--radius-round);
}

/* BACKGROUD
========================================= */
.u-bg-fill-white {
  background: var(--color-bg-white);
}

.u-bg-fill-yellow {
  background: var(--color-yellow);
}

.u-bg-fill-yellow-light {
  background: var(--color-yellow-light);
}

.u-bg-fill-lime {
  background: var(--color-lime);
}

.u-bg-fill-cream {
  background: var(--color-cream);
}

.u-bg-fill-pink {
  background: var(--color-pink-light);
}

.u-bg-fill-pinkred {
  background: var(--color-pinkred) !important;
}

.u-bg-fill-purple-light {
  background: var(--color-purple-light);
}

.u-bg-fill-gray {
  background: var(--color-bg-gry-light-f3);
}

.u-bg-fill-blue {
  background: var(--color-blue-light2);
}

.u-bg-fill-blue-dark {
  background: var(--color-blue-light) !important;
}

.u-bg-fill-green-dark {
  background: var(--color-green-2) !important;
}

.u-bg-grad-grylight {
  background: var(--grad-white-soft);
}

.u-bg-grid-gry {
  background: url(./../img/common/u-pattern-grid.webp) top left / 13px 13px repeat;
}

.u-bg-dots-gry {
  background: url(./../img/common/u-pattern-dots.webp) top left / 48px 48px repeat;
}

/* TABLE
/* -- Nomal */
/* ========================================*/
.c-table-grid {
  position: relative;
  width: 100%;
  border-left: var(--border-base);
  border-top: var(--border-base);
}

.c-table-grid__inner {
  width: 100%;
}

.c-table-grid__table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
}

.c-table-grid__table th,
.c-table-grid__table td {
  border-right: var(--border-base);
  border-bottom: var(--border-base);
  padding: var(--space-10);
  vertical-align: middle;
  word-break: break-all;
  font-weight: var(--fw-regular);
  text-align: left;
}

.c-table-grid__table td {
  background-color: var(--color-bg-white);
}

/* SP 1ROW */
@media (max-width: 767px) {

  .c-table-grid.--col-sp-1 th,
  .c-table-grid.--col-sp-1 td {
    display: block;
    width: 100%;
  }

  .c-table-grid.--col-sp-1 tr.--col-sp__flex {
    display: flex;
    flex-wrap: wrap;
  }

  .c-table-grid.--col-sp-1 tr.--col-sp__flex .--col-sp__flex-w100 {
    width: 100%;
  }

  .c-table-grid.--col-sp-1 tr.--col-sp__flex .--col-sp__flex-w50 {
    width: 50%;
  }
}

/* -- Nomal Wide */
/* ========================================*/
.c-table {
  position: relative;
  width: 100%;
  border-left: var(--border-base);
  border-bottom: var(--border-base);
}

.c-table__inner {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.c-table__table {
  width: 100%;
  min-width: 700px;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
  border: none;
}

.c-table__table.--min-w-auto {
  min-width: auto;
}

.c-table__table th,
.c-table__table td {
  border-top: var(--border-base);
  border-right: var(--border-base);
  margin-top: -1px;
  vertical-align: middle;
}

.c-table__table th {
  padding: var(--space-10) var(--space-5);
  background-color: var(--color-cell-th);
  font-weight: var(--fw-medium);
  text-align: center;
  line-height: var(--lh-120);
}

.c-table__table td {
  padding: var(--space-5) var(--space-10);
  text-align: left;
  line-height: var(--lh-140);
}

.c-table__table thead th {
  background-color: var(--color-bg-white);
  font-weight: var(--fw-medium);
}

.c-table__table th:first-child {
  width: 80px;
  background-color: var(--color-bg-white);
  position: sticky;
  left: 0;
  z-index: 2;
}

.c-table__table th .label {
  display: inline-block;
  padding: 4px 10px;
  margin-bottom: var(--space-5);
  background: var(--color-bg-dark);
  color: var(--color-text-light);
  border-radius: var(--radius-round);
  font-weight: var(--fw-medium);
  font-size: var(--fs-14);
  line-height: var(--lh-100);
}

.c-table__legend {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-15) var(--space-10);
  margin-top: var(--space-20);
}

.c-table__legend-item {
  display: flex;
  align-items: center;
  gap: var(--space-10);
  font-size: var(--fs-14);
}

.c-table__legend-item::before {
  content: '';
  flex-shrink: 0;
  width: 30px;
  height: 30px;
  border: var(--border-base);
  border-radius: var(--radius-m);
}

.is-white {
  background-color: var(--color-cell-white) !important;
}

.is-blue {
  background-color: var(--color-cell-blue) !important;
}

.is-blue-dark {
  background-color: var(--color-cell-blue-dark) !important;
}

.is-yellow {
  background-color: var(--color-cell-yellow) !important;
}

.is-pink {
  background-color: var(--color-cell-pink) !important;
}

.is-pinkred {
  background-color: var(--color-cell-pinkred) !important;
}

.is-cream {
  background-color: var(--color-cell-cream) !important;
}

.is-gray {
  background-color: var(--color-cell-gray) !important;
}

.c-table__table .--w-50 {
  width: 50% !important;
}

.c-table__note {
  margin-top: var(--space-5);
  font-size: var(--fs-12);
  line-height: var(--lh-140);
}

@media (max-width: 767px) {
  .c-table__legend-item {
    width: calc(50% - var(--space-5));
  }
}

@media (min-width: 768px) {
  .c-table__table th:first-child {
    width: 145px;
  }

  .c-table__table th {
    padding: var(--space-10) var(--space-15);
  }

  .c-table__table td {
    padding: var(--space-15);
    text-align: center;
  }

  .c-table__legend-item {
    width: auto;
  }

  .c-table__legend {
    gap: var(--space-15) var(--space-30);
  }
}

/* --- Hint --- */
.c-table__hint {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--color-bg-dark-alpha50);
  z-index: var(--z-ajust-5);
  pointer-events: none;
  transition: opacity 0.4s ease, visibility 0.4s;
}

.c-table__hint.is-hidden {
  opacity: 0;
  visibility: hidden;
}

.c-table__hint-icon {
  width: 100px;
  height: 100px;
  background-color: var(--color-bg-white);
  border-radius: var(--radius-m);
  display: flex;
  align-items: center;
  justify-content: center;
  animation: hint-swipe 1.8s ease-in-out infinite;
  will-change: transform;
}

.c-table__hint-icon svg {
  width: 50px;
  height: 40px;
}

.c-table__hint-text {
  color: var(--color-text-light);
  font-size: var(--fs-11);
  font-weight: var(--fw-bold);
  margin-top: var(--space-10);
  text-align: center;
}

@keyframes hint-swipe {
  0% {
    transform: translateX(25px);
    opacity: 0.8;
  }

  50% {
    transform: translateX(-25px);
    opacity: 1;
  }

  100% {
    transform: translateX(25px);
    opacity: 0.8;
  }
}

/* 1列目を固定しないパターン*/
.c-table.--no-sticky .c-table__table th:first-child {
  position: static;
  left: auto;
  z-index: auto;
  width: auto;
}

@media (min-width: 768px) {
  .c-table.--no-sticky .c-table__table th:first-child {
    width: auto;
  }
}

/*スマホの時にスクロールさせないパターン */
@media (max-width: 767px) {
  .c-table.--no-scroll .c-table__inner {
    overflow-x: visible;
  }

  .c-table.--no-scroll .c-table__table {
    min-width: auto !important;
    width: 100% !important;
    table-layout: auto;
  }

  .c-table.--no-scroll .c-table__table th:first-child {
    position: static !important;
    width: auto !important;
  }

  .c-table.--no-scroll .c-table__hint {
    display: none !important;
  }
}

/* 時間割テーブル */
.c-timetable {
  position: relative;
  width: 100%;
  border-left: var(--border-base);
  border-bottom: var(--border-base);
}

.c-timetable__inner {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.c-timetable__table {
  width: 100%;
  min-width: 700px;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
  border: none;
}

.c-timetable__table th,
.c-timetable__table td {
  border-top: var(--border-base);
  border-right: var(--border-base);
  margin-top: -1px;
  vertical-align: middle;
}

.c-timetable__table th {
  padding: var(--space-10) var(--space-5);
  background-color: var(--color-cell-th);
  font-weight: var(--fw-medium);
  text-align: center;
  line-height: var(--lh-120);
}

.c-timetable__table td {
  padding: var(--space-5) var(--space-10);
  text-align: left;
  line-height: var(--lh-140);
}

.c-timetable__table thead th {
  background-color: var(--color-bg-white);
  font-weight: var(--fw-medium);
}

.c-timetable__table th:first-child {
  width: 80px;
  background-color: var(--color-bg-white);
  position: sticky;
  left: 0;
  z-index: 2;
}

.c-timetable__table th .label {
  display: inline-block;
  padding: 4px 10px;
  margin-bottom: var(--space-5);
  background: var(--color-bg-dark);
  color: var(--color-text-light);
  border-radius: var(--radius-round);
  font-weight: var(--fw-medium);
  font-size: var(--fs-14);
  line-height: var(--lh-100);
}

.is-compulsory {
  background-color: var(--color-cell-compulsory);
}

/* 必修 */
.is-elective {
  background-color: var(--color-cell-elective);
}

/* 必修選択 */
.is-free {
  background-color: var(--color-cell-free);
}

/* 自由選択 */
.is-empty {
  background-color: var(--color-cell-empty);
}

/* 空き */

.c-timetable__legend {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-15) var(--space-10);
  margin-top: var(--space-20);
}

.c-timetable__legend-item {
  display: flex;
  align-items: center;
  gap: var(--space-10);
  font-size: var(--fs-14);
}

.c-timetable__legend-item::before {
  content: '';
  flex-shrink: 0;
  width: 30px;
  height: 30px;
  border: var(--border-base);
  border-radius: var(--radius-m);
}

.c-timetable__legend-item.--is-compulsory::before {
  background-color: var(--color-cell-compulsory);
}

.c-timetable__legend-item.--is-elective::before {
  background-color: var(--color-cell-elective);
}

.c-timetable__legend-item.--is-free::before {
  background-color: var(--color-cell-free);
}

@media (max-width: 767px) {
  .c-timetable__legend-item {
    width: calc(50% - var(--space-5));
  }
}

@media (min-width: 768px) {
  .c-timetable__table th:first-child {
    width: 145px;
  }

  .c-timetable__table th {
    padding: var(--space-10) var(--space-15);
  }

  .c-timetable__table td {
    padding: var(--space-15);
    text-align: center;
  }

  .c-timetable__legend-item {
    width: auto;
  }

  .c-timetable__legend {
    gap: var(--space-15) var(--space-30);
  }
}

/* --- Hint --- */
.c-timetable__hint {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--color-bg-dark-alpha50);
  z-index: var(--z-ajust-5);
  pointer-events: none;
  transition: opacity 0.4s ease, visibility 0.4s;
}

.c-timetable__hint.is-hidden {
  opacity: 0;
  visibility: hidden;
}

.c-timetable__hint-icon {
  width: 100px;
  height: 100px;
  background-color: var(--color-bg-white);
  border-radius: var(--radius-m);
  display: flex;
  align-items: center;
  justify-content: center;
  animation: hint-swipe 1.8s ease-in-out infinite;
  will-change: transform;
}

.c-timetable__hint-icon svg {
  width: 50px;
  height: 40px;
}

.c-timetable__hint-text {
  color: var(--color-text-light);
  font-size: var(--fs-11);
  font-weight: var(--fw-bold);
  margin-top: var(--space-10);
  text-align: center;
}

@keyframes hint-swipe {
  0% {
    transform: translateX(25px);
    opacity: 0.8;
  }

  50% {
    transform: translateX(-25px);
    opacity: 1;
  }

  100% {
    transform: translateX(25px);
    opacity: 0.8;
  }
}

/* フォーム用テーブル */
.c-formtable {
  position: relative;
  width: 100%;
  border-left: 1px solid var(--color-border-gray);
  border-top: 1px solid var(--color-border-gray);
  border-spacing: 0;
  border-collapse: separate;
  border-spacing: 0;
}

.c-formtable th,
.c-formtable td {
  border-right: 1px solid var(--color-border-gray);
  border-bottom: 1px solid var(--color-border-gray);
  padding: var(--space-15);
  vertical-align: middle;
  word-break: break-all;
  font-weight: var(--fw-regular);
  text-align: left;
}

.c-formtable th.-v-top,
.c-formtable td.-v-top {
  vertical-align: top;
}

.c-formtable th {
  font-weight: var(--fw-bold);
  background-color: var(--color-cell-gray);
  vertical-align: top;
}

.c-formtable td {
  background-color: var(--color-bg-white);
}

.c-formtable td.err {
  background-color: var(--color-cell-pink);
}

@media (max-width: 767px) {

  .c-formtable th,
  .c-formtable td {
    display: block;
    width: 100%;
  }
}


/* STEP
========================================= */
/* 通常 */
.c-step-list__item+.c-step-list__item {
  margin-top: var(--space-30);
}

.c-step-list__head {
  display: flex;
  align-items: center;
  min-height: 3em;
  padding-bottom: var(--space-15);
  border-bottom: 2px dotted var(--color-main);
}

.c-step-list__badge-num {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  width: 60px;
  min-width: 60px;
  height: 60px;
  background-color: var(--color-main);
  border-radius: var(--radius-ellipse);
  border: var(--border-base);
  color: var(--color-text-light);
  text-align: center;
  font-weight: var(--fw-black);
  font-size: var(--fs-20);
  line-height: var(--lh-100);
  letter-spacing: var(--ls-10);
}

.c-step-list.--badge-small .c-step-list__badge-num {
  width: 40px;
  min-width: 40px;
  height: 40px;
}

.c-step-list__badge-text {
  margin-top: auto;
  font-weight: var(--fw-bold);
  font-size: var(--fs-11);
  letter-spacing: var(--ls-0);
}

.c-step-list__badge-num-num {
  margin-bottom: auto;
}

.c-step-list__head-text {
  font-weight: var(--fw-bold);
  font-size: var(--fs-20);
}

.c-step-list.--badge-small .c-step-list__head-text {
  font-size: var(--fs-18);
}

.c-step-list__body {
  margin-top: var(--space-15);
  margin-left: 70px;
}

.c-step-list.--badge-small .c-step-list__body {
  margin-left: 40px;
}

.c-text-step-badge-num {
  display: inline-block;
  width: 1.6em;
  height: 1.6em;
  margin: 2px;
  background-color: var(--color-main);
  border-radius: var(--radius-ellipse);
  border: var(--border-base);
  color: var(--color-text-light);
  text-align: center;
  vertical-align: middle;
  font-weight: var(--fw-black);
  line-height: 1.4em;
}

/* Pattern 2 */
.c-step-list2__item {
  padding: var(--space-15);
  background-color: var(--color-blue-light2);
  border: var(--border-base);
  border-radius: var(--radius-s);
}

.c-step-list2__item+.c-step-list2__item {
  margin-top: var(--space-30);
}

.c-step-list2__head {
  display: flex;
  align-items: center;
  min-height: 3em;
}

.c-step-list2__badge-num {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  width: 60px;
  min-width: 60px;
  height: 60px;
  background-color: var(--color-blue-light);
  border-radius: var(--radius-ellipse);
  border: var(--border-base);
  color: var(--color-text-light);
  text-align: center;
  font-weight: var(--fw-black);
  font-size: var(--fs-20);
  line-height: var(--lh-100);
  letter-spacing: var(--ls-10);
}

.c-step-list2__badge-text {
  margin-top: auto;
  font-weight: var(--fw-bold);
  font-size: var(--fs-11);
}

.c-step-list2__badge-num-num {
  margin-bottom: auto;
}

.c-step-list2__head-text {
  font-weight: var(--fw-bold);
  font-size: var(--fs-20);
}

.c-step-list2__body {
  margin-top: var(--space-15);
  margin-left: 70px;
}

.c-step-list2__item+.c-step-list2__item {
  position: relative;
  margin-top: var(--space-40);
}

.c-step-list2__item+.c-step-list2__item::before {
  content: '';
  position: absolute;
  top: var(--space--30);
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: var(--space-15) solid transparent;
  border-right: var(--space-15) solid transparent;
  border-top: var(--space-15) solid var(--color-blue-light);
}

@media (max-width: 767px) {
  .c-step-list2__head-text {
    font-size: var(--fs-18);
  }
}

/* SEPARATOR
========================================= */
.u-separator {
  width: 100%;
  overflow: hidden;
  line-height: 0;
  pointer-events: none;
  margin-top: -1px;
  margin-bottom: -1px;
}

.u-separator.--float-l {
  float: left;
}

.u-separator.--float-l+* {
  clear: both;
}

.separator-wave {
  width: 100% !important;
  height: 60px;
}

.separator-wave--white {
  color: var(--color-white);
  fill: var(--color-white);
}

.separator-wave--orange {
  color: var(--color-main);
  fill: var(--color-main);
}

.separator-wave--lightgry {
  color: var(--color-bg-soft);
  fill: var(--color-bg-soft);
}

.separator-wave--lime {
  color: var(--color-lime);
  fill: var(--color-lime);
}

.separator-wave--beige {
  color: var(--color-bg-beige);
  fill: var(--color-bg-beige);
}

.separator-wave--beige2 {
  color: var(--color-beige);
  fill: var(--color-beige);
}

.separator-wave img,
.separator-wave svg {
  display: inline;
}

/* 雲 */
.u-decor-layer {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 0;
  overflow: visible;
  z-index: var(--z-decor-cloud);
  pointer-events: none;
}

.u-cloud {
  position: absolute;
  top: -60px;
  pointer-events: none;
  opacity: 0;
  transition: transform 1.5s cubic-bezier(0.22, 1, 0.36, 1), opacity 1.5s;
}

.u-cloud.--left {
  left: -90px;
  transform: translate(-40px, 40px);
}

.u-cloud.--right {
  top: -100px;
  right: -100px;
  transform: translate(40px, 40px);
}

.u-cloud.is-active {
  opacity: 1;
  transform: translate(0, 0) !important;
}

.u-cloud.--size-m {
  width: clamp(160px, 15vw, 230px);
}

.u-cloud.--float svg.dcor-cloud {
  display: block;
  animation: u-anime-float 6s ease-in-out infinite alternate;
}

.u-footer-decor-wrapper {
  overflow: hidden;
  position: absolute;
  top: -180px;
  right: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.u-footer-decor {
  position: absolute;
  z-index: 1000;
  top: 150px;
  right: -100px;
}

.u-footer-decor .u-cloud {
  top: 0;
  right: 0px;
}

.u-footer-decor-bottom {
  z-index: var(--z-ajust--2);
}

@media (max-width: 767px) {
  .u-footer-decor-bottom {
    top: 30px;
  }
}

.u-cloud.--float svg.dcor-cloud.u-flip-x {
  animation-name: u-anime-float-flip;
}

.u-flip-x.dcor-cloud {
  animation-name: u-anime-float-flip;
}

.u-cloud.--top--30 {
  top: -30px;
}

.u-cloud.--top-40 {
  top: 40px;
}

@keyframes u-anime-float {
  0% {
    transform: translateY(0);
  }

  100% {
    transform: translateY(-20px);
  }
}

@keyframes u-anime-float-flip {
  0% {
    transform: scaleX(-1) translateY(0);
  }

  100% {
    transform: scaleX(-1) translateY(-30px);
  }
}

@keyframes u-anime-float-flip {
  0% {
    transform: scaleX(-1) translateY(0);
  }

  100% {
    transform: scaleX(-1) translateY(-30px);
  }
}

/* Ribbon (共通リボンパーツ)
========================================= */
.u-ribbon {
  display: inline-block;
  position: relative;
  z-index: var(--z-ajust-2);
  height: 34px;
  padding: 0 30px;
  background-color: var(--color-cyan);
  color: var(--color-text-light);
  font-weight: var(--fw-bold);
  font-size: var(--fs-18);
  text-align: center;
  line-height: var(--lh-100);
}

.u-ribbon::before,
.u-ribbon::after {
  position: absolute;
  content: '';
  width: 0px;
  height: 0px;
  z-index: 1;
}

.u-ribbon::before {
  top: 0;
  left: 0;
  border-width: 17px 0px 17px 8px;
  border-color: transparent transparent transparent var(--color-white);
  border-style: solid;
}

.u-ribbon::after {
  top: 0;
  right: 0;
  border-width: 17px 8px 17px 0px;
  border-color: transparent var(--color-white) transparent transparent;
  border-style: solid;
}

.u-ribbon span {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
}

.u-webentry__start {
  position: absolute;
  top: -6px;
  right: 10px;
  width: 80px;
  height: 100px;
  padding: var(--space-20) var(--space-10);
  background: var(--color-main) url(./../img/common/u-webentry__start-wave.webp) bottom left / contain repeat-x;
  color: var(--color-text-light);
  font-weight: var(--fw-medium);
  text-align: center;
  letter-spacing: var(--ls-6);
}

.u-webentry__start-date {
  display: block;
  margin: auto;
  font-size: var(--fs-30);
  line-height: var(--lh-100);
}

.u-webentry__start-text {
  display: block;
  margin: var(--space-5) auto auto;
  font-size: var(--fs-14);
  line-height: var(--lh-100);
}

@media (min-width: 1024px) {
  .u-webentry__start {
    margin-right: 100px;
  }
}

/* WHIDTH
========================================= */
.u-w-full {
  width: 100%;
}

@media (min-width: 768px) {
  .u-w-tbpc-auto {
    width: auto !important;
  }

  .u-w-tbpc-full {
    width: 100% !important;
  }
}

@media (max-width: 1023px) {
  .u-w-tbsp-auto {
    width: auto !important;
  }

  .u-w-tbsp-full {
    width: 100% !important;
  }
}

@media (min-width: 1024px) {
  .u-w-pc-auto {
    width: auto !important;
  }

  .u-w-pc-full {
    width: 100% !important;
  }
}

.u-w-px-50 {
  width: 50px !important;
}

.u-w-px-100 {
  width: 100px !important;
}

.u-w-px-150 {
  width: 150px !important;
}

.u-w-px-200 {
  width: 200px !important;
}

.u-w-100 {
  width: 100% !important;
}

.u-w-50 {
  width: 50% !important;
}

.u-w-30 {
  width: 30% !important;
}

@media (max-width: 767px) {
  .u-w-px-sp-50 {
    width: 50px !important;
  }

  .u-w-px-sp-100 {
    width: 100px !important;
  }

  .u-w-px-sp-150 {
    width: 150px !important;
  }

  .u-w-px-sp-200 {
    width: 200px !important;
  }

  .u-w-sp-100 {
    width: 100% !important;
  }

  .u-w-sp-50 {
    width: 50% !important;
  }

  .u-w-sp-30 {
    width: 30% !important;
  }
}

@media (min-width: 768px) {
  .u-w-px-pc-50 {
    width: 50px !important;
  }

  .u-w-px-pc-100 {
    width: 100px !important;
  }

  .u-w-px-pc-150 {
    width: 150px !important;
  }

  .u-w-px-pc-200 {
    width: 200px !important;
  }

  .u-w-pc-100 {
    width: 100% !important;
  }

  .u-w-pc-50 {
    width: 50% !important;
  }

  .u-w-pc-30 {
    width: 30% !important;
  }
}

.u-w-min-unset {
  min-width: unset !important;
}

.u-w-max-unset {
  max-width: unset !important;
}


/* Marquee (無限ループ)
========================================= */
.u-marquee {
  overflow: hidden;
  display: flex;
  width: 100%;
}

.u-marquee__inner {
  display: flex;
  width: fit-content;
  animation: marquee-loop var(--marquee-speed, 30s) linear infinite;
}

.u-marquee:hover .u-marquee__inner {
  animation-play-state: paused;
}

.u-marquee__content {
  display: flex;
  white-space: nowrap;
}

@keyframes marquee-loop {
  0% {
    transform: translateX(0);
  }

  100% {
    transform: translateX(-50%);
  }
}

/* CONTAINER (コンテンツ幅の制御)
========================================= */
.l-container {
  width: 100%;
  margin-right: auto;
  margin-left: auto;
  padding-right: var(--space-15);
  padding-left: var(--space-15);
}

.l-container-m {
  width: 100%;
  max-width: 960px;
  margin-right: auto;
  margin-left: auto;
  padding-right: var(--space-15);
  padding-left: var(--space-15);
}

.l-container-l {
  width: 100%;
  max-width: 1270px;
  margin-right: auto;
  margin-left: auto;
  padding-right: var(--space-15);
  padding-left: var(--space-15);
}

.l-container-full {
  width: 100%;
}

.l-container-tbpc-full {
  width: 100%;
}

.l-container-narrow {
  max-width: 750px !important;
  margin: auto;
}

.l-container-inner-p15 {
  padding: var(--space-15);
}

.l-container-inner-p30 {
  padding: var(--space-30);
}

@media (max-width: 767px) {
  .l-container-tbpc-full {
    padding-right: var(--space-15);
    padding-left: var(--space-15);
    margin-right: auto;
    margin-left: auto;
  }

  .l-container-sp-full {
    padding: 0 !important;
  }
}

@media (min-width: 768px) {
  .l-container {
    max-width: var(--w-m);
    /* 960px */
  }
}

@media (min-width: 1024px) {
  .l-container {
    max-width: var(--w-l);
    /* 1280px */
  }
}

@media (min-width: 1440px) {
  .l-container {
    max-width: var(--w-xl);
    /* 1440px */
  }
}

/* CARD
========================================= */
.c-card__img {
  overflow: hidden;
  border-radius: var(--radius-m);
}

.c-card__title {
  font-size: var(--fs-16);
  margin-top: 0;
}

/* Animation */
/* 横からスライドイン */
.u-anime-slide-in {
  opacity: 0;
  transform: translateX(-40px);
  transition: transform 1.2s cubic-bezier(0.22, 1, 0.36, 1), opacity 1.2s;
  will-change: transform, opacity;
}

.u-anime-slide-in.is-active {
  opacity: 1;
  transform: translateX(0);
}

.u-anime-slide-in-reverse {
  opacity: 0;
  transform: translateX(40px);
  transition: transform 1.2s cubic-bezier(0.22, 1, 0.36, 1), opacity 1.2s;
  will-change: transform, opacity;
}

.u-anime-slide-in-reverse.is-active {
  opacity: 1;
  transform: translateX(0);
}

.u-hover-zoom-sync {
  transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1) !important;
  position: relative;
  z-index: 1;
}

.u-hover-zoom-sync .p-home-info__img-wrap img {
  transform: scale(1);
  transition: transform 0.6s cubic-bezier(0.25, 1, 0.5, 1) !important;
}

@media (hover: hover) {
  .u-hover-zoom-sync:hover .p-home-info__img-wrap img {
    transform: scale(1.1);
  }
}

/* 順番に表示 */
.u-anime-card-step {
  opacity: 0;
  transform: translateY(50px);
  transition: transform 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), opacity 1.2s linear;
  will-change: transform, opacity;
}

.u-anime-card-step-parent.is-active .u-anime-card-step {
  opacity: 1;
  transform: translateY(0);
}

/* 表示領域に達したら */
.u-anime-card {
  opacity: 0;
  transform: translateY(30px);
  transition: transform 1.0s cubic-bezier(0.22, 1, 0.36, 1), opacity 1.0s;
}

.u-anime-card.is-active {
  opacity: 1;
  transform: translateY(0);
}


/* SLIDER
========================================= */
.c-swiper-arrows .c-swiper-arrow-btn {
  pointer-events: auto;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: absolute !important;
  width: 44px !important;
  height: 44px !important;
  background: var(--color-bg-white);
  border: 2px solid var(--color-border-base);
  border-radius: var(--radius-round);
}

.c-swiper-arrows .c-swiper-arrow-btn:hover {
  opacity: 1;
}

.c-swiper-arrows .c-swiper-arrow-btn::after {
  display: none !important;
}

.c-swiper-arrows .c-swiper-arrow-icon {
  width: 20px !important;
  height: 20px !important;
  color: var(--color-text-base);
  fill: var(--color-text-base);
  transition: fill 0.3s;
}

.c-swiper-arrows .swiper-pagination {
  position: relative !important;
}

.c-swiper-arrows .swiper-pagination-bullet {
  width: 10px !important;
  height: 10px !important;
  border: var(--border-base) !important;
  background: var(--color-bg-white) !important;
  opacity: 1 !important;
  margin: 0 5px !important;
  transition: all 0.3s ease;
}

.c-swiper-arrows .swiper-pagination-bullet-active {
  border-color: var(--color-main) !important;
  background: var(--color-main) !important;
}

@media (hover: hover) {
  .c-swiper-arrows .c-swiper-arrow-btn:hover {
    background-color: var(--color-main);
    transition: opacity var(--transition);
  }
}

.c-swiper-arrows .c-swiper-arrow-btn:active {
  background-color: var(--color-main);
  transition: opacity var(--transition);
}

@media (max-width: 767px) {
  .c-swiper-arrows .c-swiper-arrow-btn {
    top: calc(50% - 44px) !important;
  }

  .c-swiper-arrows .swiper-pagination {
    margin-top: var(--space-30);
  }

  .c-swiper-arrows .swiper-button-prev {
    left: 8vw !important;
  }

  .c-swiper-arrows .swiper-button-next {
    right: 8vw !important;
  }
}

@media (min-width: 768px) {
  .c-swiper-arrows {
    position: relative !important;
    top: auto !important;
    left: 50%;
    transform: translateX(-50%);
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    pointer-events: auto;
    margin-top: var(--space-40);
    padding: 0 var(--space-30);
  }

  .c-swiper-arrows .c-swiper-arrow-btn {
    position: relative !important;
    left: auto !important;
    right: auto !important;
    margin-top: 0 !important;
  }

  .c-swiper-arrows .swiper-pagination {
    position: relative !important;
    top: auto !important;
    bottom: auto !important;
    width: auto !important;
    margin: 0 var(--space-10);
  }
}

@media (min-width: 1024px) {
  .c-swiper-arrows .swiper-pagination-bullet:hover {
    background: var(--color-main);
    opacity: 0.7;
  }
}

/* subject-course */
.j-slider-section {
  padding: var(--space-60) 0 var(--space-100);
  overflow: hidden;
}

.j-card-link {
  display: block;
  height: 100%;
  will-change: transform;
  -webkit-user-drag: none;
  pointer-events: auto;
}

.j-card {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  position: relative;
  aspect-ratio: 2 / 3;
  border-radius: var(--radius-m);
  background-size: cover;
  background-position: center;
  box-sizing: border-box;
  overflow: hidden;
  transition: transform .2s ease, box-shadow .2s ease;
  box-shadow: var(--shadow-m);
}

.j-card:hover {
  transform: translateY(-5px);
  box-shadow: none;
}

.splide__track {
  overflow: visible !important;
  cursor: grab;
  user-select: none;
  -webkit-user-drag: none;
}

.splide__track:active {
  cursor: grabbing;
}

.j-card-content {
  position: relative;
  z-index: 0;
  width: 100%;
  padding: var(--space-5);
  background-color: var(--subject-color);
  color: var(--subject-text-color);
}

.j-new-badge {
  position: absolute;
  z-index: var(--z-ajust-2);
  top: 0;
  left: 0;
  width: 100%;
  padding: 4px;
  background: var(--color-bg-dark);
  color: var(--color-text-light);
  font-size: var(--fs-11);
  text-align: center;
  line-height: var(--lh-100);
}

.j-dept-name {
  margin: 0;
  line-height: var(--lh-140);
  font-size: var(--fs-13);
}

.j-dept-name span {
  display: inline-block;
  margin-left: var(--space-5);
  padding: 2px var(--space-5);
  border-radius: var(--radius-s);
  background-color: var(--color-bg-white);
  font-size: var(--fs-10);
  line-height: var(--lh-100);
  color: var(--subject-color);
}

.j-dept-note {
  margin-top: var(--space-5);
  font-size: var(--fs-10);
  line-height: var(--lh-120);
}

@media (min-width: 768px) {
  .j-card-content {
    padding: var(--space-10);
  }
}

#j-zigzag-slider .splide__list {
  transition-timing-function: cubic-bezier(0.25, 1, 0.5, 1) !important;
}

#j-zigzag-slider .j-card-link {
  display: block;

  transition: none !important;
  transition-duration: 0s !important;
  transition-delay: 0s !important;

  will-change: transform !important;
  backface-visibility: hidden !important;
  -webkit-backface-visibility: hidden !important;
}

/* WEB ENTRY Group
============================================================ */
.c-webentry {
  position: relative;
  border-radius: var(--radius-m);
  background-color: var(--color-yellow);
  padding: var(--space-60) var(--space-30);
  /* overflow: hidden; */
}

.c-webentry-inner {
  position: relative;
  padding: var(--space-20) var(--space-30) var(--space-30) var(--space-30);
  border-radius: var(--radius-m);
  background-color: var(--color-white);
  text-align: center;
}

.c-webentry__title {
  max-width: 12em;
  text-align: left !important;
}

.c-webentry__title-main {
  text-align: left !important;
  font-weight: var(--fw-bold);
}

.c-webentry__title-main-l {
  line-height: var(--lh-120);
  font-size: var(--fs-34);
}

.c-webentry__title-main-s {
  font-size: var(--fs-22);
  line-height: var(--lh-120);
}

.c-webentry__text {
  font-size: var(--fs-15);
  text-align: center;
  letter-spacing: var(--ls-0);
}

.c-webentry__text span {
  line-height: var(--lh-140);
}

.c-webentry__btn-outline {
  min-height: 65px;
  padding: var(--space-10) var(--space-30);
  line-height: var(--lh-120);
}

.c-webentry__btn-outline-icon {
  width: 0.75em;
  height: 0.75em;
  color: var(--color-text-base);
  fill: var(--color-text-base);
  margin-left: auto !important;
}

.c-webentry__btn-new {
  position: absolute;
  top: -10px;
  left: -20px;
}

.c-webentry__btn-new-badge {
  display: flex !important;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  border-radius: var(--radius-round);
  border: var(--border-base);
  background-color: var(--color-pinkred);
  color: var(--color-text-light);
  font-weight: var(--fw-bold);
  font-size: var(--fs-11);
}

@media (min-width: 768px) {
  .c-webentry-inner {
    padding-bottom: var(--space-80);
  }

  .c-webentry__title {
    max-width: 30em;
    margin: var(--space-30) auto var(--space-40) auto;
    text-align: center !important;
  }

  .c-webentry__title-main {
    font-weight: var(--fw-extrabold);
  }

  .c-webentry__title-main-s {
    display: inline-block;
    margin-right: var(--space-10);
    font-size: var(--fs-38);
    line-height: var(--lh-100);
  }

  .c-webentry__title-main-l {
    display: inline-block;
    font-size: var(--fs-40);
    line-height: var(--lh-100);
  }

  .c-webentry__text {
    font-size: var(--fs-16);
  }
}

.c-webentry__decor-container {
  position: relative;
  pointer-events: none;
  z-index: var(--z-ajust-5);
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  max-width: 960px;
  height: 100%;
  padding: var(--space-20) var(--space-30) var(--space-30) var(--space-30);
}

.c-webentry__decor-human1,
.c-webentry__decor-human2 {
  position: absolute;
  z-index: var(--z-ajust-5);
}

.c-webentry__decor-human1 {
  top: -20px;
  left: 30px;
}

.c-webentry__decor-human2 {
  bottom: 10px;
  right: -10px;
}

@media (min-width: 1024px) {
  .c-webentry__decor-human1 {
    top: -10px;
    left: 16.25%;
  }

  .c-webentry__decor-human2 {
    bottom: 30px;
    right: 20px;
  }
}

/* HEADING (各ページ見出し)
========================================= */
.c-section-title {
  position: relative;
  margin-bottom: var(--space-40);
  text-align: center;
}

.c-section-title__inner {
  position: relative;
  display: inline-block;
  line-height: 1;
}

.c-section-title__decor {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
}

@media (min-width: 768px) {
  .c-section-title {
    margin-bottom: var(--space-60);
  }
}

/* Top Page */
/* h2(EN) SP 30px / PC 40px */
.c-fs-home-main-en {
  display: block;
  font-family: var(--font-family-en);
  font-weight: var(--fw-extrabold);
  font-size: clamp(var(--fs-30), 1.45rem + 2.1vw, 2.5rem);
  text-align: center;
}

.c-fs-home-main-en>span {
  display: inline-block;
}

/* h2 SP 16px / PC 16px */
.c-fs-home-main {
  display: block;
  font-weight: var(--fw-medium);
  font-size: var(--fs-16);
  text-align: center;
  letter-spacing: var(--ls-10);
  line-height: var(--lh-140);
}

.c-fs-home-main>span {
  display: inline-block;
}

.c-fs-home-main-en+.c-fs-home-main {
  margin-top: 6px;
}

@media (min-width: 768px) {
  .c-fs-home-main-en+.c-fs-home-main {
    margin-top: 15px;
  }
}

/* h3 SP 20px / PC 20px */
.c-fs-home-sub {
  font-size: var(--fs-20);
}

/* Subject Page */
/* PAGE TITLE SP 30px / PC 36px */
.c-fs-subjects-main {
  display: block;
  font-size: clamp(var(--fs-30));
  font-weight: var(--fw-black);
  text-align: center;
  letter-spacing: var(--ls-0);
}

@media (min-width: 768px) {
  .c-fs-subjects-main {
    font-size: var(--fs-36);
  }
}

/* SECTION TITLE (EN) SP 34px / PC 42px */
.c-fs-subjects-sub-en {
  display: block;
  font-family: var(--font-family-en);
  font-weight: var(--fw-black);
  font-size: clamp(var(--fs-34), 1.875rem + 1.25vw, var(--fs-42));
  color: var(--color-text-light);
  text-shadow: var(--color-border-base) 1px 0 0, var(--color-border-base) 1px 1px 0, var(--color-border-base) 0 1px 0, var(--color-border-base) -1px 0 0, var(--color-border-base) -1px -1px 0, var(--color-border-base) 0 -1px 0, var(--color-border-base) 1px 0 0;
  letter-spacing: var(--ls-6);
}

@media (max-width: 767px) {
  .c-fs-subjects-sub-en>span {
    display: block;
  }
}

@media (min-width: 768px) {
  .c-fs-subjects-sub-en>span+span {
    margin-left: .6em;
  }
}

/* SECTION TITLE (JP) SP 18px / PC 20px */
.c-fs-subjects-sub {
  display: block;
  font-family: var(--font-family-en);
  font-weight: var(--fw-bold);
  color: var(--color-text-base);
  font-size: clamp(var(--fs-18), 1.06rem + 0.3vw, var(--fs-20));
  line-height: var(--lh-120);
  letter-spacing: var(--ls-10);
}

.c-fs-subjects-sub-inner {
  display: inline-block;
  padding: var(--space-5) var(--space-10);
  background-color: var(--color-bg-white);
  line-height: var(--lh-120);
  font-weight: var(--fw-medium);
}

/* SECTION TITLE2 SP/PC 16px */
.c-fs-subjects-sub2 {
  margin-bottom: var(--space-40);
  font-weight: var(--fw-bold);
  font-size: var(--fs-16);
  text-align: center;
}

@media (max-width: 767px) {
  .c-fs-subjects-sub2 {
    position: relative;
    z-index: 0;
  }

  .c-fs-subjects-sub2::before {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: var(--z-ajust--2);
    transform: translate(-50%, -50%);
    width: calc(100% - var(--space-30));
    height: 1px;
    background-color: var(--color-border-gray);
    content: '';
  }

  .c-fs-subjects-sub2>span {
    display: inline-block;
    z-index: var(--z-ajust-2);
    background-color: var(--color-bg-white);
    padding: var(--space-5) var(--space-30);
  }
}

/* CONTENTS TITLE SP/PC 20px */
.c-fs-subjects-sub-sub {
  font-size: var(--fs-20);
  font-weight: var(--fw-bold);
  text-align: left;
  margin-bottom: var(--space-15);
}

.c-fs-subjects-sub3 {
  position: relative;
  z-index: 0;
  margin-bottom: var(--space-30);
  text-align: center;
  letter-spacing: var(--ls-6);
  line-height: var(--lh-120);
}

.c-fs-subjects-sub3-inner {
  display: flex;
  justify-content: center;
  align-items: center;
  max-width: 120px;
  min-height: 40px;
  margin: auto;
  border: var(--border-base);
  border-radius: var(--radius-round);
  font-weight: var(--fw-bold);
  font-size: var(--fs-16);
  background-color: var(--border-white);
}

.c-fs-subjects-sub3::before {
  position: absolute;
  top: 50%;
  left: 0;
  z-index: var(--z-ajust--2);
  width: 100%;
  height: 30px;
  border: 1px dotted var(--color-border-base);
  border-bottom: none;
  content: '';
}

/* Common Pages */
/* Page Title SP 30px / PC 36px */
.c-fs-page-main {
  font-size: clamp(var(--fs-30), 1.69rem + 0.9vw, var(--fs-36))
}

/* Page Title sub SP 12px / PC 16px */
.c-fs-page-sub {
  font-size: clamp(var(--fs-12), 0.625rem + 0.6vw, var(--fs-16));
}

/* Content Title Primary SP 30px / PC 36px */
.c-fs-content-title-primary {
  margin-top: var(--space-60);
  margin-bottom: var(--space-30);
}

.c-fs-content-title-primary-main {
  display: block;
  font-family: var(--font-family-en);
  font-weight: var(--fw-bold);
  font-size: var(--fs-30);
  line-height: var(--lh-140);
  color: var(--color-text-base);
}

.c-fs-content-title-primary-sub {
  display: block;
  margin-top: var(--space-5);
  font-weight: var(--fw-medium);
  font-size: var(--fs-16);
}

@media (min-width: 768px) {
  .c-fs-content-title-primary {
    margin-top: var(--space-100);
    margin-bottom: var(--space-60);
  }

  .c-fs-content-title-primary-main {
    font-size: var(--fs-36);
    text-align: center;
  }

  .c-fs-content-title-primary-sub {
    text-align: center;
  }
}

/* Content Title Secondary SP 24px / PC 30px */
.c-fs-content-title-secondary {
  margin-top: var(--space-60);
  margin-bottom: var(--space-30);
}

.c-fs-content-title-secondary-main {
  position: relative;
  display: block;
  padding-bottom: var(--space-15);
  padding-left: var(--space-5);
  font-family: var(--font-family-en);
  font-weight: var(--fw-bold);
  font-size: var(--fs-24);
  line-height: var(--lh-140);
  color: var(--color-text-base);
}

.c-fs-content-title-secondary-main::before,
.c-fs-content-title-secondary-main::after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 120px;
  height: 6px;
  background-color: var(--color-main);
  content: '';
}

.c-fs-content-title-secondary-main::after {
  width: 30px;
  background-color: var(--color-yellow);
}

.c-fs-content-title-secondary-sub {
  display: block;
  margin-top: var(--space-10);
  font-weight: var(--fw-medium);
  font-size: var(--fs-16);
}

@media (min-width: 768px) {
  .c-fs-content-title-secondary {
    margin-top: var(--space-60);
    margin-bottom: var(--space-30);
  }

  .c-fs-content-title-secondary-main {
    font-size: var(--fs-30);
  }
}

/*  Content Title Tertiary SP 20px / PC 26px */
.c-fs-content-title-tertiary {
  margin-top: var(--space-60);
  margin-bottom: var(--space-30);
}

.c-fs-content-title-tertiary-main {
  position: relative;
  display: block;
  padding-left: 1.6em;
  font-family: var(--font-family-en);
  font-weight: var(--fw-bold);
  font-size: var(--fs-20);
  line-height: var(--lh-140);
  color: var(--color-text-base);
}

.c-fs-content-title-tertiary-main::before {
  position: absolute;
  top: .16em;
  left: 0;
  width: 1em;
  height: 1em;
  border-radius: var(--radius-round);
  background-color: var(--color-pink);
  border: var(--border-base);
  content: '';
}

.c-fs-content-title-tertiary-sub {
  display: block;
  margin-top: var(--space-10);
  font-weight: var(--fw-medium);
  font-size: var(--fs-16);
}

@media (min-width: 768px) {
  .c-fs-content-title-tertiary {
    margin-top: var(--space-60);
    margin-bottom: var(--space-30);
  }
}

/* コンテンツ見出し4 SP/PC 20px */
.c-fs-content-title-sub-sub {
  margin-top: var(--space-60);
  margin-bottom: var(--space-30);
  font-size: var(--fs-20);
  font-weight: var(--fw-bold);
  text-align: left;
  margin-bottom: var(--space-15);
}


/* =========================================
Animation 
========================================= */
/* Section Title */
.u-anime-title .c-fs-home-main>span,
.u-anime-title .c-fs-home-main-en>span {
  display: inline-block;
  opacity: 0;
  transition: transform 0.8s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.8s;
}

.u-anime-title .c-fs-home-main>span {
  transform: translateX(-30px);
}

.u-anime-title .c-fs-home-main-en>span {
  transform: translateY(100%);
}

.u-anime-title.is-active .c-fs-home-main>span {
  opacity: 1;
  transform: translateX(0);
  transition-delay: 0.1s;
}

.u-anime-title.is-active .c-fs-home-main-en>span {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 0.5s;
}

.u-anime-title .c-fs-subjects-sub>span,
.u-anime-title .c-fs-subjects-sub-en>span {
  display: inline-block;
  opacity: 0;
  transition: transform 0.8s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.8s;
}

.u-anime-title .c-fs-subjects-sub>span {
  transform: translateX(-30px);
}

.u-anime-title .c-fs-subjects-sub-en>span {
  transform: translateY(100%);
}

.u-anime-title.is-active .c-fs-subjects-sub>span {
  opacity: 1;
  transform: translateX(0);
  transition-delay: 0.1s;
}

.u-anime-title.is-active .c-fs-subjects-sub-en>span {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 0.5s;
}

/* Common Pages */
.u-anime-title .c-fs-content-title-primary-main>span,
.u-anime-title .c-fs-content-title-secondary-main>span,
.u-anime-title .c-fs-content-title-tertiary-main>span,
.u-anime-title .c-fs-content-title-primary-sub>span,
.u-anime-title .c-fs-content-title-secondary-sub>span,
.u-anime-title .c-fs-content-title-tertiary-sub>span {
  display: inline-block;
  opacity: 0;
  transition: transform 0.8s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.8s;
}

.u-anime-title .c-fs-content-title-primary-main>span,
.u-anime-title .c-fs-content-title-secondary-main>span,
.u-anime-title .c-fs-content-title-tertiary-main>span {
  transform: translateX(-30px);
}

.u-anime-title.is-active .c-fs-content-title-primary-main>span,
.u-anime-title.is-active .c-fs-content-title-secondary-main>span,
.u-anime-title.is-active .c-fs-content-title-tertiary-main>span {
  opacity: 1;
  transform: translateX(0);
  transition-delay: 0.1s;
}

.u-anime-title .c-fs-content-title-primary-sub>span,
.u-anime-title .c-fs-content-title-secondary-sub>span,
.u-anime-title .c-fs-content-title-tertiary-sub>span {
  transform: translateY(100%);
}

.u-anime-title.is-active .c-fs-content-title-primary-sub>span,
.u-anime-title.is-active .c-fs-content-title-secondary-sub>span,
.u-anime-title.is-active .c-fs-content-title-tertiary-sub>span {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 0.5s;
}


/* 中心から出現 */
.u-anime-pop {
  display: inline-block;
  opacity: 0;
  transform: scale(0.2);
  transition: transform 0.6s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.4s ease-out;
  transform-origin: center;
}

.is-active .u-anime-pop {
  opacity: 1;
  transform: scale(1);
}

.u-anime-pop.--delay-100 {
  transition-delay: 0.1s;
}

.u-anime-pop.--delay-200 {
  transition-delay: 0.2s;
}

.u-anime-pop.--delay-300 {
  transition-delay: 0.3s;
}

.u-anime-pop.--delay-400 {
  transition-delay: 0.4s;
}

.u-anime-pop.--delay-500 {
  transition-delay: 0.5s;
}

.u-anime-pop.--delay-700 {
  transition-delay: 0.7s;
}

/* ぴこぴこ */
.u-anime-piko-shake,
.u-anime-piko-jump {
  display: inline-block;
  transform-origin: bottom center;
}

.is-active .u-anime-piko-shake.--loop {
  animation: piko-shake-loop 5s ease-in-out infinite;
}

.is-active .u-anime-piko-jump.--loop {
  animation: piko-jump-loop 5s ease-out infinite;
}

.--piko-delay-1 {
  animation-delay: 1.0s !important;
}

.--piko-delay-2 {
  animation-delay: 2.5s !important;
}

.--piko-delay-3 {
  animation-delay: 4.0s !important;
}

.--piko-fast {
  animation-duration: 3s !important;
}

.--piko-slow {
  animation-duration: 7s !important;
}

@keyframes piko-shake {

  0%,
  100% {
    transform: rotate(0deg);
  }

  25% {
    transform: rotate(-12deg);
  }

  75% {
    transform: rotate(12deg);
  }
}

@keyframes piko-jump {

  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-6px);
  }
}

@keyframes piko-shake-loop {

  0%,
  15%,
  100% {
    transform: rotate(0deg);
  }

  3%,
  9% {
    transform: rotate(-12deg);
  }

  6%,
  12% {
    transform: rotate(12deg);
  }
}

@keyframes piko-jump-loop {

  0%,
  15%,
  100% {
    transform: translateY(0);
  }

  4%,
  12% {
    transform: translateY(-8px);
  }

  8% {
    transform: translateY(0);
  }
}

/* ふわふわ */
.u-anime-fuwa-float {
  display: inline-block;
  will-change: transform;
  animation: fuwa-float-loop 4s ease-in-out infinite;
}

.u-anime-fuwa-float.--fuwa-fast {
  animation-duration: 3s !important;
}

.u-anime-fuwa-float.--fuwa-slow {
  animation-duration: 6s !important;
}

.u-anime-fuwa-float.--fuwa-delay-1 {
  animation-delay: -1.0s !important;
}

.u-anime-fuwa-float.--fuwa-delay-2 {
  animation-delay: -2.5s !important;
}

.u-anime-fuwa-float.--fuwa-delay-3 {
  animation-delay: -4.0s !important;
}

.u-anime-fuwa-float.--fuwa-small {
  --fuwa-range: -6px;
  --fuwa-deg: -1deg;
}

@keyframes fuwa-float-loop {

  0%,
  100% {
    transform: translateY(0) rotate(0);
  }

  50% {
    transform: translateY(-12px) rotate(-3deg);
  }
}

/* ちらちら */
.u-anime-flip-chira {
  display: inline-block;
  will-change: transform;
}

.is-active .u-anime-flip-chira {
  animation: anime-flip-chira 4s ease-in-out infinite;
}

@keyframes anime-flip-chira {

  0%,
  100% {
    transform: scaleX(1);
  }

  5%,
  15% {
    transform: scaleX(-1);
  }

  10%,
  20% {
    transform: scaleX(1);
  }
}

/* ちかちか反転 */
.u-anime-flip-chika {
  display: inline-block;
  will-change: transform;
  opacity: 0;
  transform: translateY(20px) scaleX(1);
  transition: transform 0.8s ease-out, opacity 0.8s ease-out;
}

.is-active .u-anime-flip-chika {
  opacity: 1;
  transform: translateY(0) scaleX(1);
}

.is-active .u-anime-flip-chika {
  animation: anime-flip-chika 3s step-end infinite;
  animation-delay: 1s;
}

@keyframes anime-flip-chika {

  0%,
  10%,
  100% {
    transform: scaleX(1);
  }

  3%,
  7% {
    transform: scaleX(-1);
  }
}

/* ふわっと出現 */
.u-anime-fade {
  opacity: 0;
  transition: transform 1.2s cubic-bezier(0.22, 1, 0.36, 1), opacity 1.2s;
  will-change: transform, opacity;
}

.is-active .u-anime-fade,
.u-anime-fade.is-active {
  opacity: 1;
  transform: translate(0, 0) !important;
}

/* 下から上へ */
.u-anime-fade.--up {
  transform: translateY(30px);
}

/* 上から下へ */
.u-anime-fade.--down {
  transform: translateY(-60px);
}

/* 左から右へ */
.u-anime-fade.--left {
  transform: translateX(-30px);
}

/* 右から左へ */
.u-anime-fade.--right {
  transform: translateX(30px);
}

/* その場（移動なし、フェードのみ） */
.u-anime-fade.--none {
  transform: none;
}

.u-anime-fade.--fast {
  transition-duration: 0.6s;
}

.u-anime-fade.--slow {
  transition-duration: 2.0s;
}

/* 下線と時差アニメーション */
.u-tdeco-anime {
  position: relative;
  border-color: var(--color-white);
}

.u-tdeco-anime::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: 0;
  height: 1px;
  background-color: var(--color-orange);
  transition: width 0.5s cubic-bezier(0.33, 1, 0.68, 1);
}

.u-tdeco-anime>span {
  display: inline-block;
  opacity: 0;
  transform: translateY(10px);
  transition: transform 0.6s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.6s ease-out;
}

.u-tdeco-anime.is-active::after {
  width: 100%;
}

.u-tdeco-anime.is-active>span {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 0.3s;
}

/* 回転 */
.u-anime-rotate {
  opacity: 0;
  will-change: transform;
  transition: transform 1.0s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.8s ease;
}

.u-anime-rotate.--x {
  transform: perspective(400px) rotateX(-90deg);
}

.u-anime-rotate.--y {
  transform: perspective(400px) rotateY(-90deg);
}

.u-anime-rotate.--z {
  transform: scale(0) rotate(-360deg);
}

.is-active .u-anime-rotate {
  opacity: 1;
  transform: perspective(400px) rotateX(0) rotateY(0) rotateZ(0) scale(1);
}

/* ゆらゆら */
@keyframes anime-yura {
  0% {
    transform: rotate(15deg);
  }

  50% {
    transform: rotate(0);
  }

  100% {
    transform: rotate(15deg);
  }
}

.u-anime-yura.--loop {
  display: inline-block;
  animation: anime-yura 2s ease-in-out infinite;
  transform-origin: center;
}

/* 円グラフ */
@property --p {
  syntax: '<number>';
  inherits: false;
  initial-value: 0;
}

.c-chart-pie {
  --p: 0;
  --chart-color: var(--color-main);
  --chart-target: 0;
  width: 250px;
  aspect-ratio: 1;
  border-radius: 50%;
  background: conic-gradient(var(--chart-color) calc(var(--p) * 1%), var(--color-bg-white) 0);
  display: grid;
  place-items: center;
  position: relative;
  opacity: 0;
  transform: scale(0.9);
  transition: opacity 0.8s ease, transform 0.8s ease;
}

@media (max-width: 767px) {
  .c-chart-pie {
    width: 200px;
  }
}

.c-chart-pie.is-active {
  opacity: 1;
  transform: scale(1);
  animation: chart-pie-ani 2.5s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

@keyframes chart-pie-ani {
  to {
    --p: var(--chart-target);
  }
}

.c-chart-pie__inner {
  text-align: center;
  color: var(--color-text-light);
  margin-top: auto;
  margin-bottom: var(--space-20);
}

.c-chart-pie__title {
  font-weight: var(--fw-bold);
  letter-spacing: var(--ls-6);
}

.c-chart-pie__numset {
  display: block;
  line-height: var(--lh-100);
  letter-spacing: 0;
}

.c-chart-pie__num {
  display: inline-block;
  font-size: var(--fs-50);
  font-weight: var(--fw-bold);
}

.c-chart-pie__unit {
  display: inline-block;
  font-size: var(--fs-20);
  font-weight: var(--fw-black);
  margin-left: .1em;
}

.c-chart-pie__inner {
  text-align: center;
  color: var(--color-text-light);
  margin-top: auto;
  margin-bottom: 20px;
}

@media (min-width: 768px) {
  .c-chart-pie__inner {
    margin-bottom: var(--space-30);
  }
}

/* 無限回転アニメーション */
.u-anime-rotate-infinite {
  animation: anime-rotate-infinite 15s linear infinite;
  display: inline-block;
  transform-origin: center center;
}

@keyframes anime-rotate-infinite {
  0% {
    transform: rotate(360deg);
  }

  100% {
    transform: rotate(0deg);
  }
}

/* =========================================
   モーダル
   ========================================= */
.c-modal {
  position: fixed;
  inset: 0;
  background: var(--color-bg-dark-alpha95, rgba(0, 0, 0, 0.95));
  z-index: var(--z-overlay, 9999);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.4s ease;
}

.c-modal.is-open {
  opacity: 1;
  pointer-events: auto;
}

.c-modal__inner {
  position: relative;
  width: 100%;
  max-width: 800px;
  max-height: 80vh;
  padding: 60px 0 0;
  margin: auto;
  display: flex;
  flex-direction: column;
  transform: translateY(20px);
  transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}

.c-modal.is-open .c-modal__inner {
  transform: translateY(0);
}

.c-modal__counter {
  position: absolute;
  top: 20px;
  left: 0;
  color: #fff;
  font-size: 14px;
  font-weight: bold;
  font-family: sans-serif;
}

.c-modal__content {
  position: relative;
  width: 100%;
  max-height: calc(80vh - 180px);
  aspect-ratio: 1 / 1;
  background: #000;
  box-sizing: border-box;
  flex-shrink: 1;
}

#js-modal-swiper {
  position: absolute;
  /* 親 .c-modal__content を基準にする */
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

#js-modal-swiper .swiper-slide {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}

#js-modal-swiper img {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

#js-modal-swiper img,
#js-modal-swiper video {
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

.c-modal__thumbnails {
  margin-top: 15px;
  width: 100%;
  height: 60px;
  flex-shrink: 0;
}

#js-modal-thumbs .swiper-slide {
  height: 100%;
  aspect-ratio: 1 / 1;
  cursor: pointer;
  opacity: 0.4;
  transition: opacity 0.3s;
  background-color: #000;
  border-radius: 2px;
}

#js-modal-thumbs .swiper-slide img,
#js-modal-thumbs .swiper-slide video {
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

#js-modal-thumbs .swiper-slide-thumb-active {
  opacity: 1;
}

.c-modal__close {
  position: absolute;
  top: 0;
  right: 0;
  width: 50px;
  height: 50px;
  background: rgba(255, 255, 255, 0.1);
  border: none;
  border-radius: 50%;
  cursor: pointer;
  z-index: 100;
  transition: all 0.3s ease;
}

.c-modal__close:hover {
  background: rgba(255, 255, 255, 0.25);
  transform: rotate(90deg);
}

.c-modal__close::before,
.c-modal__close::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 20px;
  height: 2px;
  background: #fff;
}

.c-modal__close::before {
  transform: translate(-50%, -50%) rotate(45deg);
}

.c-modal__close::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}

.js-modal-open {
  position: relative;
  display: block;
  overflow: hidden;
}

.js-modal-open.is-multiple::before,
.js-modal-open.is-multiple::after {
  content: '';
  position: absolute;
  width: 30px;
  height: 30px;
  pointer-events: none;
}

.js-modal-open.is-multiple::before {
  z-index: 1;
  right: 10px;
  bottom: 10px;
  background: var(--color-bg-dark-alpha50);
  opacity: 0.9;
  border-radius: var(--radius-s);
}

.js-modal-open.is-multiple::after {
  right: 15px;
  bottom: 15px;
  z-index: 2;
  width: 20px;
  height: 20px;
  background: url(./../img/common/icon-multiple.webp) center / 16px 16px no-repeat;
}

.js-modal-open:hover img {
  transform: scale(1.05);
  transition: transform 0.3s ease;
}

@media (max-width: 767px) {
  .c-modal {
    padding: 10px;
  }

  .c-modal__inner {
    max-height: 85vh;
  }

  .c-modal__content {
    max-height: calc(85vh - 140px);
  }

  .c-modal__thumbnails {
    height: 50px;
  }
}

/* =========================================
   確認用ダイアログモーダル
   ========================================= */
.c-modal-confirm {
  position: fixed;
  inset: 0;
  background: var(--color-bg-dark-alpha95, rgba(0, 0, 0, 0.95));
  z-index: var(--z-overlay, 9999);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.4s ease;
}

.c-modal-confirm.is-open {
  opacity: 1;
  pointer-events: auto;
}

.c-modal-confirm__bg {
  position: absolute;
  inset: 0;
  cursor: pointer;
}

.c-modal-confirm__content {
  position: relative;
  width: 100%;
  max-width: 540px;
  background: var(--color-bg-white);
  border-radius: var(--radius-m);
  padding: 40px 30px 30px;
  box-shadow: var(--shadow-soft);
  transform: translateY(20px);
  transition: transform 0.4s ease;
}

.c-modal-confirm.is-open .c-modal-confirm__content {
  transform: translateY(0);
}

.c-modal-confirm__close-icon {
  position: absolute;
  top: 15px;
  right: 15px;
  width: 30px;
  height: 30px;
  cursor: pointer;
  opacity: 0.5;
}

.c-modal-confirm__close-icon::before,
.c-modal-confirm__close-icon::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 15px;
  height: 2px;
  background: var(--color-bg-dark);
}

.c-modal-confirm__close-icon::before {
  transform: translate(-50%, -50%) rotate(45deg);
}

.c-modal-confirm__close-icon::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}

.c-modal-confirm__text {
  color: var(--color-text-base);
  font-size: var(--fs-16);
  line-height: var(--lh-160);
  text-align: center;
  margin-bottom: var(--space-30);
}

.c-modal-confirm__text strong {
  color: var(--color-pinkred)
}

.c-modal-confirm__buttons {
  display: flex;
  gap: var(--space-15);
  justify-content: center;
}

.c-modal-confirm__btn-cancel,
.c-modal-confirm__btn-ok a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 160px;
  height: 48px;
  border-radius: var(--radius-m);
  font-weight: var(--fw-bold);
  cursor: pointer;
  text-decoration: none;
  transition: background 0.2s;
}

.c-modal-confirm__btn-cancel {
  background: var(--color-bg-gry-light);
  color: var(--color-text-gray);
}

.c-modal-confirm__btn-cancel:hover {
  background: var(--color-bg-gry);
}

.c-modal-confirm__btn-ok a {
  background: var(--color-blue);
  color: var(--color-text-light);
}

.c-modal-confirm__btn-ok a:hover {
  opacity: 0.85;
}

@media (max-width: 767px) {
  .c-modal-confirm__content {
    padding: 35px 20px 20px;
  }

  .c-modal-confirm__text {
    font-size: var(--fs-14);
  }

  .c-modal-confirm__buttons {
    flex-direction: column-reverse;
    gap: var(--space-10);
  }

  .c-modal-confirm__btn-cancel,
  .c-modal-confirm__btn-ok a {
    width: 100%;
  }
}

/* =========================================
YOUTUBE 
========================================= */
.u-aspect-16-9 {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
}

.u-aspect-16-9>* {
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
  border: none;
}

/* =========================================
HEADER
========================================= */
.l-header {
  position: sticky;
  top: 0;
  left: 0;
  right: 0;
  z-index: var(--z-header);
  height: var(--height-header-pc);
  background-color: var(--color-bg-white);
}

.c-h-nav__sub-list-child li a {
  padding-top: 0;
}

.c-h-nav__sub-list-child li a::before {
  display: inline-block;
  margin-right: .2em;
  content: "－";
  color: var(--color-text-muted);
}

.c-h-nav__icon {
  display: inline-block;
  width: 1em;
  min-width: 12px;
  height: 1em;
  padding-top: .3em;
}

.c-h-nav__icon.--w {
  width: 2em;
  height: 1.4em;
}

@media (max-width: 1023px) {
  .l-header {
    height: var(--height-header-tbsp);
  }
}

@media (min-width: 768px) {
  .l-header {
    padding-right: var(--space-30);
  }
}

/* H__Logo Area
========================================= */
.h-logo img {
  width: auto;
  height: 60px;
}

@media (max-width: 1023px) {
  .h-logo img {
    height: 40px;
  }
}

/* H__Nav (SP/TB)
========================================= */
.u-hamburger {
  height: var(--height-header-tbsp);
}

/* Hamburger */
.u-hamburger {
  width: var(--height-header-tbsp);
  height: var(--height-header-tbsp);
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: var(--space-5);
}

.u-hamburger-line {
  display: block;
  width: 20px;
  height: 3px;
  border-radius: var(--radius-round);
  background-color: var(--color-text-base);
  transition: var(--transition);
}

/* Drawer Menu */
.h-nav-drawer {
  position: fixed;
  top: 0;
  right: 0;
  width: calc(100% - 30px);
  height: 100%;
  background-color: #fff;
  z-index: var(--z-drawer);
  transform: translateX(100%);
  transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.h-nav-drawer.is-active {
  transform: translateX(0);
}

.h-nav-drawer__inner {
  position: relative;
  height: 100%;
  display: flex;
  flex-direction: column;
}

.h-nav-drawer__inner::after {
  content: "";
  position: absolute;
  bottom: 80px;
  /* SNSエリアの高さ */
  left: 0;
  width: 100%;
  height: 60px;
  background: linear-gradient(to top, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
  pointer-events: none;
  z-index: var(--z-element);
}

.h-nav-drawer__header {
  width: 100%;
  height: var(--height-header-tbsp);
  display: flex;
  justify-content: flex-end;
  align-items: center;
}

.h-nav-drawer__close {
  position: relative;
  cursor: pointer;
  width: var(--height-header-tbsp);
  height: var(--height-header-tbsp);
}

.h-nav-drawer__close span {
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 20px;
  height: 3px;
  background-color: var(--color-text-base);
  border-radius: var(--radius-round);
}

.h-nav-drawer__close span:nth-child(1) {
  transform: translate(-50%, -50%) rotate(45deg);
}

.h-nav-drawer__close span:nth-child(2) {
  transform: translate(-50%, -50%) rotate(-45deg);
}

.h-nav-drawer__btns {
  padding: 0 var(--space-20) var(--space-20);
}

.h-nav-drawer__nav {
  flex: 1;
  overflow-y: auto;
  padding: 0 var(--space-20) var(--space-60);
}

.h-nav-drawer__action-btn {
  min-height: var(--height-header-tbsp);
  padding: var(--space-10);
  font-size: var(--fs-16);
  text-align: left;
  letter-spacing: var(--ls-0);
}

.h-nav-drawer__action-btn .u-btn-shiryou-icon,
.h-nav-drawer__action-btn .u-btn-oc-icon {
  width: 1.25em;
  height: 1.25em;
}

.h-nav-drawer__footer {
  padding: var(--space-20) var(--space-20);
  background-color: #fff;
}

.h-nav-drawer-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--color-bg-dark-alpha50);
  z-index: var(--z-overlay);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.4s ease, visibility 0.4s;
}

.h-nav-drawer.is-active+.h-nav-drawer-overlay {
  opacity: 1;
  visibility: visible;
}

/* H__Nav (PC Only) 
========================================= */
.h-nav-pc {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}

.h-nav-pc__sub {
  justify-content: flex-end;
}

.h-nav-pc__main {
  justify-content: flex-end;
  line-height: var(--lh-100);
}

.h-nav-pc__sub-top {
  padding: 6px 12px;
  font-size: var(--fs-14);
  line-height: var(--lh-100);
  border-radius: 0 0 var(--radius-m) var(--radius-m);
}

.h-nav-pc__sub-btn-visit {
  background-color: var(--color-bg-gry-light);
}

.h-nav-pc__sub-btn-lang {
  background-color: var(--color-bg-dark);
  color: var(--color-text-light);
}

.h-btn-main-icon {
  color: var(--color-text-muted);
  fill: var(--color-text-muted);
}

.h-nav-pc__main-item:hover .h-btn-main-icon {
  color: var(--color-main);
  fill: var(--color-main);
  ;
}

/* Sub Menu */
.h-nav-pc__dropdown-content {
  display: none;
  position: absolute;
  top: calc(100% + var(--space-10));
  left: 0;
  z-index: var(--z-header-dropdown);
  width: 100%;
  padding: var(--space-10);
  border-radius: var(--radius-m);
}

.h-nav-pc__dropdown-content li a {
  font-size: var(--fs-14);
  line-height: var(--lh-140);
}

.h-nav-pc__sub-btn-visit .h-nav-pc__dropdown-content {
  width: 330px;
  background-color: var(--color-bg-gry-light);
}

.h-nav-pc__sub-btn-visit .h-nav-pc__dropdown-content li a {
  display: block;
  padding: var(--space-5) 0;
}

.h-nav-pc__sub-btn-lang .h-nav-pc__dropdown-content {
  background-color: var(--color-bg-dark);
}

.h-nav-pc__sub-btn-lang .h-nav-pc__dropdown-content li a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: var(--space-5) var(--space-10);
}

.h-nav-pc__dropdown-active {
  color: var(--color-main);
}

.js-dropdown.is-active .h-nav-pc__dropdown-content {
  display: block;
}

.js-dropdown.is-active .u-icon-angle-down {
  transform: rotate(-90deg);
}

/* Main Menu */
.h-nav-pc__main-item {
  position: static;
}

.h-nav-pc__main-item>a {
  display: flex;
  height: 3.125em;
  align-items: center;
}

.h-nav-pc__main-item:hover .arrow-triangle {
  transform: rotate(-90deg);
  transition: transform 0.3s ease, color 0.3s ease;
}

/* └ Mega Menu */
.h-nav-pc__main-item:hover .h-nav-pc__mega {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
}

.h-nav-pc__mega {
  /* Hidden by default */
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  position: absolute;
  top: var(--height-header-pc);
  left: 0;
  width: 100%;
  max-height: calc(100vh - 200px);
  overflow-y: auto;
  background-color: var(--color-bg-white);
  box-shadow: var(--shadow-l-bottom);
  z-index: var(--z-header);
  transform: translateY(-20px);
  transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s;
}

/* └ Scrollbar*/
/* Firefox用 */
.h-nav-pc__mega {
  scrollbar-width: thin;
}

/* Chrome, Safari, Edge用 */
.h-nav-pc__mega::-webkit-scrollbar {
  width: 6px;
}

.h-nav-pc__mega::-webkit-scrollbar-thumb {
  background-color: var(--color-border-gray-light);
  border-radius: 10px;
}

.h-nav-pc__mega-head {
  width: 25%;
}

.h-nav-pc__mega-head-inner {
  font-weight: var(--fw-bold);
  font-size: var(--fs-26);
}

.h-nav-pc__mega-head-icon {
  position: relative;
  display: inline-block;
  padding-left: 1.2em;
}

.h-nav-pc__mega-head-icon::before {
  position: absolute;
  top: .3em;
  left: 0;
  width: 1rem;
  height: 1rem;
  border-radius: var(--radius-round);
  background-color: var(--color-main);
  content: '';
}

.h-nav-pc__mega-content {
  flex: 1;
}

.h-nav-pc__mega-menu {
  line-height: var(--lh-120);
  border-left: 1px solid var(--color-border-base);
}

.h-nav-pc__mega-menu-head {
  padding: var(--space-15) var(--space-50) var(--space-15) var(--space-30);

}

.h-nav-pc__mega-menu .c-h-nav__sub-list-child li a {
  display: inline-block;
  padding: var(--space-10) var(--space-50) var(--space-10) var(--space-30);
  font-size: var(--fs-14);
}

/* =========================================
MAIN
========================================= */
.l-main {
  overflow: hidden;
}

/* =========================================
BREADCRUMB
========================================= */
.l-breadcrumb {
  padding: var(--space-15);
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.l-breadcrumb ol {
  display: flex;
  flex-wrap: nowrap;
  margin: 0;
  padding: 0;
  white-space: nowrap;
  list-style: none;
}

.l-breadcrumb li {
  display: flex;
  align-items: center;
  font-size: var(--fs-11);
  line-height: var(--lh-100);
  color: var(--color-breadcrumb-base);
}

.l-breadcrumb li a {
  color: inherit;
  text-decoration: none;
  transition: opacity 0.3s;
}

.l-breadcrumb li:not(:last-child)::after {
  content: ">";
  margin: 0 var(--space-10);
  color: var(--color-breadcrumb-arrow);
  font-weight: normal;
}

.l-breadcrumb li:last-child {
  padding-right: var(--space-15);
  color: var(--color-breadcrumb-active);
  font-weight: var(--fw-medium);
}

.l-breadcrumb::-webkit-scrollbar {
  display: none;
}

@media screen and (min-width: 768px) {
  .l-breadcrumb::-webkit-scrollbar {
    display: none;
  }

  .l-breadcrumb {
    scrollbar-width: none;
  }

  .l-breadcrumb ol {
    flex-wrap: wrap;
    overflow-x: visible;
    white-space: normal;
  }

  .l-breadcrumb li {
    font-size: var(--fs-12);
    line-height: var(--lh-140);
  }
}

/* =========================================
PAGE TITLE
========================================= */
/* ページ別の色設定 */
.c-pagetitle.--cat-about .c-pagetitle__label {
  color: var(--cat-color-about);
}

.c-pagetitle.--cat-about .c-pagetitle__inner::before {
  background: var(--cat-color-about);
}

.c-pagetitle.--cat-entrance .c-pagetitle__label {
  color: var(--cat-color-entrance);
}

.c-pagetitle.--cat-entrance .c-pagetitle__inner::before {
  background: var(--cat-color-entrance);
}

.c-pagetitle.--cat-career .c-pagetitle__label {
  color: var(--cat-color-career);
}

.c-pagetitle.--cat-career .c-pagetitle__inner::before {
  background: var(--cat-color-career);
}

.c-pagetitle.--cat-access .c-pagetitle__label {
  color: var(--cat-color-access);
}

.c-pagetitle.--cat-access .c-pagetitle__inner::before {
  background: var(--cat-color-access);
}

.c-pagetitle.--cat-entry .c-pagetitle__label {
  color: var(--cat-color-entry);
}

.c-pagetitle.--cat-entry .c-pagetitle__inner::before {
  background: var(--cat-color-entry);
}

.c-pagetitle {
  position: relative;
  margin-bottom: var(--space-30);
}

.c-pagetitle__inner {
  position: relative;
  z-index: 0;
}

.c-pagetitle-decor-layer-bottom {
  top: auto;
  bottom: 0;
}

.c-pagetitle__inner::before {
  position: absolute;
  bottom: var(--space-30);
  width: 100%;
  height: 200px;
  content: '';
  pointer-events: none;
  background-color: var(--color-bg-soft);
}

.c-pagetitle__content {
  position: relative;
  width: calc(100% - var(--space-30));
  padding: var(--space-30);
  background-color: var(--color-bg-white);
  z-index: var(--z-ajust-5);
  border: var(--border-base);
  border-left: none;
}

.c-pagetitle__label {
  display: block;
  width: 100%;
  margin-bottom: var(--space-10);
  font-size: var(--fs-12);
}

.c-pagetitle__title {
  font-weight: var(--fw-medium);
  font-size: var(--fs-30);
  line-height: var(--lh-140);
}

.c-pagetitle__title small {
  font-size: var(--fs-20);
}

.c-pagetitle__date {
  display: block;
  width: 100%;
  font-size: var(--fs-11);
  margin-top: var(--space-15);
  color: var(--color-text-gray);
}

.c-pagetitle__img-wrap {
  position: relative;
  width: calc(100% - var(--space-10));
  margin-top: -15px;
  margin-left: var(--space-20);
  z-index: var(--z-ajust-2);
}

.c-pagetitle__img {
  display: flex;
  justify-content: end;
  align-items: center;
}

.c-pagetitle__img-wrap img {
  width: auto;
  height: auto;
  object-fit: contain;
  max-width: 100%;
  max-height: 100%;
  border-radius: var(--radius-l) 0 0 var(--radius-l);
}

@media (max-width: 767px) {
  .c-pagetitle-decor-layer-top {
    display: none;
  }

  .c-pagetitle__title_decor {
    display: none;
  }
}

@media (min-width: 768px) {
  .c-pagetitle {
    margin-bottom: var(--space-40);
  }

  .c-pagetitle-decor-layer-top {
    top: 8em;
    z-index: var(--z-ajust--2);
    pointer-events: none;
  }

  .c-pagetitle__content {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 37.708%;
    top: 50%;
    transform: translateY(-50%);
  }

  .c-pagetitle__content::before {
    position: absolute;
    left: 0;
    bottom: -11px;
    z-index: var(--z-ajust--5);
    width: 100%;
    height: 10px;
    background: url(./../img/common/c-pagetitle__title-lineshadow.webp) top left / contain repeat-x;
    content: '';
  }

  .c-pagetitle__title_decor {
    position: absolute;
    left: 40px;
    bottom: -50px;
    pointer-events: none;
  }

  .c-pagetitle__img-wrap {
    width: 66.6666%;
    margin: 0 0 0 auto;
  }

  .c-pagetitle__inner::before {
    bottom: -10px;
  }
}

@media (min-width: 1024px) {
  .c-pagetitle__content {
    min-height: 300px;
  }
}

/* 画像がない場合 */
.c-pagetitle.--noimg .c-pagetitle__img {
  display: none;
}

@media (min-width: 768px) and (max-width: 1023px) {
  .c-pagetitle.--noimg .c-pagetitle__content {
    position: relative;
    top: 0;
    transform: translateY(0);
    text-align: center;
  }
}

@media (min-width: 768px) {
  .c-pagetitle.--noimg .c-pagetitle__content {
    width: 83.3333%;
    justify-content: start;
    padding: var(--space-30) var(--space-100);
    min-height: 140px;
  }
}

@media (max-width: 1023px) {
  .c-pagetitle.--noimg .c-pagetitle-decor-layer-top {
    display: none;
  }

  .c-pagetitle.--noimg .c-pagetitle-decor-layer {
    display: none;
  }

  .c-pagetitle.--noimg .c-pagetitle__content {
    width: 100%;
    border: none;
    background-color: var(--color-bg-soft);
  }

  .c-pagetitle.--noimg .c-pagetitle__inner::before {
    content: none;
  }

  .c-pagetitle.--noimg .c-pagetitle__title {
    line-height: var(--lh-120);
  }
}

@media (min-width: 1024px) {
  .c-pagetitle.--noimg .c-pagetitle__img-wrap {
    min-height: 300px;
  }
}

/* Animation */
.c-pagetitle__content-inner,
.c-pagetitle__title_decor,
.c-pagetitle__img-wrap {
  opacity: 0;
  transform: translateX(-30px);
  transition: all 1.0s cubic-bezier(0.22, 1, 0.36, 1);
}

.c-pagetitle.is-active .c-pagetitle__content-inner,
.c-pagetitle.is-active .c-pagetitle__title_decor,
.c-pagetitle.is-active .c-pagetitle__img-wrap {
  opacity: 1;
  transform: translateX(0);
}

.c-pagetitle.is-active .c-pagetitle__content-inner {
  transition-delay: 0.1s;
}

.c-pagetitle.is-active .c-pagetitle__title_decor {
  transition-delay: 0.3s;
}

.c-pagetitle.is-active .c-pagetitle__img-wrap {
  transition-delay: 0.5s;
}


/* HEAD DESIGN : 画像の上にテキスト配置 
========================================= */
.c-hero-title {
  position: relative;
  width: 100%;
  overflow: hidden;
}

.c-hero-title__img {
  width: 100%;
}

.c-hero-title__img img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}

.c-hero-title__content {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--color-bg-dark-alpha50);
  padding: var(--space-20);
}

.c-hero-title__text {
  color: var(--color-white);
  font-family: var(--font-family-en);
  font-weight: var(--fw-bold);
  font-size: var(--fs-30);
  line-height: var(--lh-140);
  text-align: center;
  text-shadow: var(--shadow-m);
}

@media (min-width: 768px) {
  .c-hero-title__text {
    font-size: 36px;
  }
}

/* =========================================
MAIN CONTENT
========================================= */
.l-content-innner {
  padding: 0 var(--space-30) var(--space-30) var(--space-30);
}

@media (min-width: 768px) {
  .l-content-innner {
    padding: var(--space-30) var(--space-60) var(--space-60) var(--space-60);
  }
}

/* =========================================
FLOATHING
========================================= */
.floating-controls {
  position: fixed;
  bottom: var(--space-0);
  left: var(--space-0);
  right: var(--space-0);
  z-index: var(--z-float);
  opacity: 0;
  visibility: hidden;
  transform: translateY(20px);
  transition: all 0.4s ease;
}

.floating-controls.is-show {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.fc-action-btn {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  width: 100px;
  height: 80px;
  padding: var(--space-5);
  font-size: var(--fs-16);
  letter-spacing: var(--ls-0);
}

.fc-action-btn .u-btn-shiryou-icon,
.fc-action-btn .u-btn-oc-icon {
  width: 100%;
  height: 1.563em;
  margin: auto;
}

@media (max-width: 767px) {
  .floating-controls {
    margin: 0 var(--space-15) var(--space-20);
    align-items: flex-end;
  }

  .fc-floating__right {
    gap: var(--space-10);
  }
}

@media (min-width: 768px) {
  .fc-floating__left {
    position: fixed;
    left: var(--space-0);
    bottom: var(--space-20);
    gap: var(--space-20);
  }

  .fc-floating__sns {
    padding: var(--space-10);
    background-color: var(--color-bg-white);
    border: var(--border-base);
    border-left: none;
    border-radius: 0 var(--radius-m) var(--radius-m) 0;
  }

  .fc-floating__sns .fc-sns-img {
    margin: 20px 0;
  }

  .fc-floating__right {
    position: fixed;
    right: var(--space-0);
    bottom: var(--space-20);
    display: flex;
    flex-direction: column;
    gap: var(--space-20);
  }

  .fc-action-btn {
    width: calc(100px + var(--space-40));
    padding: var(--space-5) var(--space-20);
    border-radius: var(--radius-m) 0 0 var(--radius-m);
    border-right: none;
    letter-spacing: var(--ls-2);
  }

}

/* =========================================
FLOATING BANNER
========================================= */
.fc-pr-banner {
  position: fixed;
  bottom: -450px;
  /* 最初は画面外に隠す */
  right: 160px;
  width: 400px;
  z-index: var(--z-float-bnr);
  transition: bottom 0.6s cubic-bezier(0.25, 1, 0.5, 1);
}

.fc-pr-banner.is-active {
  bottom: 20px;
}

.fc-pr-banner img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--radius-m);
  box-shadow: var(--shadow-soft);
}

.fc-pr-banner-close-btn {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  top: -22px;
  right: -10px;
  width: 44px;
  height: 44px;
  background: var(--color-bg-dark-alpha85);
  color: #fff;
  border-radius: 50%;
  text-align: center;
  cursor: pointer;
  font-family: sans-serif;
  border: 2px solid var(--color-border-white);
  z-index: var(--z-ajust-9);
  line-height: var(--lh-100);
}

@media (max-width: 767px) {
  .fc-pr-banner {
    width: 200px;
    right: 20px;
  }

  .fc-pr-banner.is-active {
    bottom: 120px;
  }

}

/* =========================================
FOOTER
========================================= */
.l-footer {
  position: relative;
  z-index: var(--z-footer);
}

.u-bottom-ajust .l-footer {
  margin-top: -60px;
}

/* F__Contact & F__PageTop
========================================= */
.f-pagetop-wrapper {
  position: relative;
  z-index: 0;
}

.footer-contact-section,
.f-pagetop-wrapper {
  background-color: var(--color-lime);
}

.f-tel-label {
  margin-right: var(--space-20);
  color: var(--color-main);
}

.f-tel-number {
  color: var(--color-main);
  font-size: clamp(var(--fs-36), 1.925rem + 1.33vw, var(--fs-50));
  line-height: var(--lh-100);
}

.btn-pagetop {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--color-main);
  color: var(--color-text-light);
}

.btn-pagetop-icon {
  width: 0.857em;
  height: 0.857em;
}

@media (max-width: 767px) {
  .btn-pagetop {
    width: 50%;
    margin-left: auto;
    border-radius: var(--radius-m) var(--radius-m) 0 0;
  }
}

/* F__Action
========================================= */
.f-action-section {
  position: relative;
  background-color: var(--color-bg-white);
}

@media (max-width: 767px) {
  .f-sns-img {
    width: 40px;
  }
}

@media (min-width: 1204px) {
  .f-action-btn {
    width: 375px;
  }
}

/* F__Navigation
========================================= */
.c-accordion-nav__list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 40px;
}

.c-accordion-nav__head,
.c-accordion-nav__head-link {
  margin-bottom: 1.5em;
  font-weight: var(--fw-medium);
}

.c-accordion-nav__head-link a {
  display: block;
  width: 100%;
}

.c-accordion-nav__sub-list li a {
  display: block;
}

.c-accordion-nav__sub-list li a {
  padding: var(--space-10) 0;
}

.c-accordion-nav__sub-list-child li a::before {
  display: inline-block;
  margin-right: .2em;
  content: "－";
  color: var(--color-text-muted);
}

.f-nav-others {
  margin-top: 1em;
}

.f-nav-others li a {
  display: block;
  padding: var(--space-10) 0;
}

.c-accordion-nav__sub-list,
.f-nav-others,
.c-accordion-nav__visitor .c-accordion-nav__head {
  font-size: var(--fs-14);
}

/* Icons */
.c-accordion-nav__toggle svg {
  width: 1em;
  height: 1em;
  fill: currentColor;
}

.icon-plus,
.icon-minus {
  display: none !important;
}

.c-accordion-nav__icon {
  display: inline-block;
  width: 0.625em;
  height: 0.625em;
  vertical-align: middle;
}

.c-accordion-nav__icon.--w {
  width: 2em;
  height: 1.4em;
}

@media (max-width: 1023px) {
  .c-accordion-nav__list {
    display: block;
  }

  .c-accordion-nav__head,
  .c-accordion-nav__head-link {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 0;
    margin-bottom: 0;
  }

  .js-accordion .c-accordion-nav__head {
    cursor: pointer;
  }

  .icon-plus {
    display: block !important;
  }

  .is-open .icon-plus {
    display: none !important;
  }

  .is-open .icon-minus {
    display: block !important;
  }

  .c-accordion-nav__sub-list {
    display: none;
    overflow: hidden;
    padding-bottom: 20px;
  }
}

@media (min-width: 1024px) {
  .c-accordion-nav__head {
    color: var(--color-text-muted);
  }

  .c-accordion-nav__head::before {
    content: '●';
  }

  .c-accordion-nav__visitor {
    border-bottom: 1px solid var(--color-border-gray-light);
    padding-bottom: 1em;
  }

  .c-accordion-nav__visitor .c-accordion-nav__head {
    position: relative;
  }

  .c-accordion-nav__visitor .c-accordion-nav__head::after {
    display: block;
    position: absolute;
    top: 50%;
    right: 0;
    width: 30%;
    border-top: 1px solid var(--color-border-gray-light);
    content: '';
  }

  .c-accordion-nav__visitor .c-accordion-nav__head span {
    background-color: var(--color-bg-soft);
  }

  .c-accordion-nav__list {
    grid-template-columns: repeat(5, 1fr);
  }
}

/* F__Information
========================================= */
.f-links-section {
  background-color: var(--color-bg-soft);
}

.f-info__logo {
  width: 330px;
}

.f-info__access {
  font-size: var(--fs-13);
}

.f-info__anniversary {
  width: 250px;
}

.f-info__copyright {
  text-align: right;
}

@media (max-width: 1023px) {

  .f-info__main,
  .f-info__left,
  .f-info__address-group {
    flex-direction: column !important;
    align-items: center !important;
    text-align: center;
  }

  .f-info__logo {
    width: 300px;
    margin-bottom: 20px;
  }

  .f-info__anniversary {
    margin: 40px auto 0;
  }

  .f-info__copyright {
    text-align: center;
    margin-top: 40px;
  }
}

@media (min-width: 1024px) and (max-width: 1600px) {
  .f-info {
    padding-right: 140px;
    /* 追従ボタンと重なるため余白をとる */
  }
}

/* =========================================
/*   FORM
========================================= */
/* .form-container {
    display: flex;
    overflow: hidden;
    position: relative;
    height: auto;
}
.form-step {
    position: absolute;
    width: 100%;
    transition: right 0.5s ease;
    background-color: #FFF;
}
    */

input::placeholder {
  color: var(--form-color-placeholder);
}

input:focus,
textarea:focus,
select:focus {
  border: 1px solid var(--color-orange) !important;
  outline: 1px solid var(--color-orange) !important;
}

input[type="text"],
input[type="number"],
input[type="email"],
input[type="mobile"],
select,
textarea {
  width: 100%;
  font-size: var(--fs-16);
  min-height: 50px;
  padding: 10px 15px;
  border: 1px solid var(--form-color-border);
  border-radius: var(--radius-s);
  background-color: var(--form-color-field-bg);
  color: var(--form-color-input-text);
  line-height: 1;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
}

textarea {
  line-height: 1.6;
}

/* ⎿ CheckBox */
input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  width: 30px;
  min-width: 30px;
  height: 30px;
  min-height: 30px;
  background-color: var(--color-white);
  border-radius: var(--radius-s);
  border: var(--border-base);
  margin: 0;
  position: relative;
  cursor: pointer;
  flex-shrink: 0;
}

input[type="checkbox"]:checked {
  background-color: var(--color-orange);
}

input[type="checkbox"]:checked::after {
  content: '';
  position: absolute;
  top: 5px;
  left: 9px;
  transform: rotate(45deg);
  width: 10px;
  height: 15px;
  border: solid var(--color-white);
  border-width: 0 3px 3px 0;
}

input[type="checkbox"]+label {
  display: flex;
  align-items: center;
  min-height: 50px;
  cursor: pointer;
  user-select: none;
}

/* ⎿ RadioButton */
input[type="radio"] {
  appearance: none;
  -webkit-appearance: none;
  width: 30px;
  min-width: 30px;
  height: 30px;
  min-height: 30px;
  border: var(--border-base);
  border-radius: var(--radius-round);
  background-color: var(--color-white);
  cursor: pointer;
  margin: 0;
  position: relative;
}

input[type="radio"]:checked::after {
  content: "";
  display: block;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: var(--color-orange);
}

input[type="radio"]+label {
  cursor: pointer;
  padding-left: 8px;
  font-size: 16px;
  user-select: none;
}

@keyframes anim-reserve-answer-radiobox {
  0% {
    box-shadow: 0 0 0 1px transparent;
  }

  50% {
    box-shadow: 0 0 0 10px #6699ff33;
  }

  100% {
    box-shadow: 0 0 0 10px transparent;
  }
}

/* ⎿ Selectbox */
select {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><polygon points='0,0 12,0 6,8' fill='%333333'/></svg>");
  background-repeat: no-repeat;
  background-position: right 15px center;
  background-size: 12px 8px;
}

/* ⎿ Error */
.error-message {
  color: var(--form-errmsg);
}

.error-message+.error-message {
  margin-top: var(--space-5);
}

@media (min-width: 768px) {
  /* .sec-reserve {
        padding:80px 15px 30px;
    }
    .reserve-row {
        display: flex;
    }
    .reserve-row + .reserve-row {
        margin-top: -1px;
    }
    .reserve-item {
        display: block;
        width: 33.3333%;
        padding: 20px;
    }
    .reserve-answer {
        width: 66.6666%;
        padding: 20px 0 20px 30px;
    }
    .reserve-answer > .error-message {
        margin-top: 10px;
    }
    .reserve-main {
        margin: 10px auto 80px;
    }
    .reserve-campaign {
        margin: 0 0 40px;
    }
    .reserve-answer-lists {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
    }
    .reserve-answer-list {
        width: 50%;
        margin-top: -1px;
    }
    .reserve-answer-list:nth-child(even) {
        margin-left: -1px;
    }
    .reserve-item,
    .reserve-answer {
        border-top: 1px solid #CCC;
        border-bottom: 1px solid  #CCC;
    }
    .button-form-next-wrap, 
    .button-form-back-wrap, 
    .button-form-submit-wrap {
        margin-top: 60px;
    }
    .reserve-note-pc-center {
        text-align: center;
    }
    .reserve-note-block {
        margin-top: 40px;
        padding: 20px;
    }
    .reserve-answer-radio {
        width: calc(50% - 10px);
    }
    .reserve-answer-col2 {
        display: flex;
        justify-content: space-between;
    }
    .reserve-answer-col2 > *{
        width: calc(50% - 10px);
    }
    .reserve-answer-radio:nth-child(odd) {
        margin-right: 20px;
    }
    .reserve-answer-birthday {
        display: flex;
        justify-content: space-between;
    }
    .reserve-answer-birthday > *{
        width: 33.3333%;
        margin-right: 20px;
    }
    .reserve-answer-birthday > *:last-child{
        margin-right: 0;
    }
    .reserve-row input,
    .reserve-row select {
        margin-bottom: 0;
    }
    .reserve-answer-addr .reserve-answer-inner:first-child .reserve-answer-inner-sub{
        margin-top: 0;
    }
    .reserve-answer-addr .reserve-answer-inner-sub {
        width: 17.2955%;
        min-width: 110px;
        margin-top: 0;
    }
    .reserve-answer-col2 + .error-message,
    .reserve-answer-inner-wrap + .error-message {
        margin-top: 10px;
    }
    .reserve-answer-addr .reserve-answer-inner-wrap,
    .reserve-answer-addr .reserve-answer-selectbox {
        width: 100%;
    }
    .reserve-answer-addr .reserve-answer-inner .reserve-answer-inner-sub{
        margin-top: 10px;
    } */
  /* Form */
  /* .reserve-answer-selectbox::after {
        top: calc(50% - 3px);
    }
    .error-message {
        margin-bottom: 0;
    }
    .error-message + .error-message {
        margin-top: 10px;
    }    
    .form-step > .error-message {
        margin-bottom: 10px;
    }     */
}

/* .button-form-next-wrap ,
.button-form-back-wrap ,
.button-form-submit-wrap {
    margin-top: 40px;
    text-align: center;
}
.button-form-next ,
.button-form-submit {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 90.4761%;
    max-width: 400px;
    min-height: 70px;
    margin: auto;
    padding: 20px 30px;
    border: none;
    border-radius: 100vh;
    background-color: #FF6699;
    box-shadow: 0 2pt 4pt rgba(0, 0, 0, .16);
    color: #FFF;
    font-weight: 700;
    font-size: 1.25rem;
    cursor: pointer;
}
.button-form-next {
    background-color: #FF8066;
}
.button-form-next.disabled ,
.button-form-submit.disabled {
    background-color: #EEE;
    color: #A9A9A9;
    box-shadow: none;
}
.button-form-next::after ,
.button-form-submit::after {
    position: absolute;
    right: calc(6px + 6px);
    z-index: 1;
    width: 0;
    height: 0;
    margin-top: 1px;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
    border-left: 6px solid #FFF;
    content: '';
}
.button-form-back {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 63.492%;
    max-width: 300px;
    min-height: 60px;
    margin: 0 auto 1px;
    padding: 20px 30px;
    border: 1px solid #D2D2D2;
    border-radius: 100vh;
    background-color: #FFF;
    box-shadow: none;
    color: #121212;
    font-weight: 700;
    font-size: 1rem;
    cursor: pointer;
}
.button-form-back-icon {
    position: relative;
}
.button-form-back-icon::before {
    position: absolute;
    top: 50%;
    left: -20px;
    z-index: 1;
    transform: translateY(-50%);
    width: 0;
    height: 0;
    margin-top: 1px;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
    border-right: 6px solid #CCC;
    content: '';
}
.reserve-answer-inner-row {
    display: flex;
    align-items: center;
}
.agree-check-text {
    line-height: 1.4;
}
 */
.required-mark {
  display: inline-block;
  margin: var(--space-5);
  padding: var(--space-5);
  border-radius: var(--radius-s);
  background-color: var(--color-pinkred);
  color: var(--color-text-light);
  font-size: var(--fs-13);
  line-height: var(--lh-100);
}

/* =========================================
/*   STEP BAR
========================================= */
.c-step-bar-wrap {
  width: 100%;
}

.c-step-bar {
  display: flex;
  justify-content: space-between;
  list-style: none;
  padding: 0;
  margin: 0;
  width: 100%;
}

.c-step-bar__item {
  flex: 1;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.c-step-bar__item:not(:last-child)::after {
  content: '';
  position: absolute;
  top: 15px;
  left: 50%;
  width: 100%;
  height: 20px;
  border-bottom: 2px solid var(--color-bg-gry);
  z-index: 1;
}

.c-step-bar__item.--is-complete:not(:last-child)::after {
  border-bottom-color: var(--color-main);
}

.c-step-bar__number {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: var(--radius-round);
  background-color: var(--color-bg-gry);
  color: var(--color-text-light);
  font-size: var(--fs-14);
  font-weight: bold;
  font-family: var(--font-family-en);
  position: relative;
  z-index: 2;
  transition: background-color 0.3s;
}

.c-step-bar__label {
  margin-top: 8px;
  font-size: var(--fs-14);
  color: var(--color-text-gray);
  font-weight: var(--fw-medium);
  line-height: var(--lh-120);
}

.c-step-bar__item.--is-active .c-step-bar__number {
  background-color: var(--color-main);
}

.c-step-bar__item.--is-active .c-step-bar__label {
  color: var(--color-main);
  font-weight: bold;
}

.c-step-bar__item.--is-complete .c-step-bar__number {
  background-color: var(--color-bg-dark);
}

.c-step-bar__item.--is-complete .c-step-bar__label {
  color: var(--color-bg-dark);
}

@media (max-width: 767px) {
  .c-step-bar__label {
    font-size: var(--fs-12);
    transform: scale(0.9);
  }
}

/* =========================================
/*   PRINT
========================================= */
@media print {

  html,
  body {
    width: 1440px !important;
    /* PCレイアウトが出る幅に固定 */
    min-width: 1440px !important;
    zoom: 0.75;
  }

  /* CONTAINER (コンテンツ幅の制御) */
  .l-main,
  .l-container,
  .l-container-m,
  .l-container-l,
  .l-container-full,
  .l-container-tbpc-full {
    width: 1000px !important;
    max-width: 1000px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  /* セパレーター装飾を非表示 */
  .u-separator {
    display: none !important;
  }

  /* ヘッダーを非表示 */
  header,
  .l-header {
    display: none !important;
  }

  /* フローティングボタン（追従ボタン）を非表示 */
  .floating-controls {
    display: none !important;
  }

  /* ホーム画面メインビジュアル */
  .p-home-mv {
    display: none !important;
  }

}