@charset "UTF-8";

/* =============================================================================

Custom Properties CSS

・カスタムプロパティ

上記はここに記述する

============================================================================= */

/* Custom Properties
============================================================================= */
:root {
  --pc-size:767px;

	/* ScrollBar Width *JavascriptOverwrite */
	--scrollbar-w:0px;

  /* Color Code * rgba Example green-A/50% : rgb(from var(--cc-green-A) r g b / .5) */
  --cc-black-A:#282828;
  --cc-white-A:#fff;
  --cc-gray-A:#E0E6E6;
  --cc-gray-B:#EEF0F0;
  --cc-gray-C:#f3fafb;
  --cc-blue-A:#00A5D5;
  --cc-blue-B:#4FB5B7;
  --cc-blue-C:#4fb5b7;

  /* Font Family */
  --ff-zen:"Zen Kaku Gothic New", sans-serif;
  --ff-os:"Open Sans", sans-serif;

  /* Typography Set */
  /* text level */
  --tg-text-A-fs:1.6rem;
  --tg-text-A-fw:500;
  --tg-text-A-lh:2;
  --tg-text-A-ls:0;
  @media (width <= 767px) {
    --tg-text-A-fs:2.4rem;
    --tg-text-A-lh:calc(46/24);
  }

  /* Topicpath Height */
  --topicpath-height:0;

  /* Transition Duration */
  --duration-hover-A:.5s;
  --duration-parallax-A:1.5s;

  /* Base Variable Width */
  --pc-min-size:1000;
  --base-size:1440;
  --variable-length:var(--base-size) * 100vw;

  /* Header Height */
  --header-height-base:68;
  --header-height-base-scrolled:68;
  --header-height:calc(var(--header-height-base) * .1rem);
  --header-height-scrolled:calc(var(--header-height-base) * .1rem);

  @media (width <= 767px) {
    --header-height-base:50;
    --header-height-base-scrolled:var(--header-height-base);
  }
  &:has(body.is-scrolled) {
    --header-height-scrolled:calc(var(--header-height-base-scrolled) * .1rem);
    @media (width <= 767px) {
    }
  }

  /* Color Base */
  --base-color:var(--cc-black-A);
  --base-bg:var(--cc-white-A);

  /* Reverse Color Base */
  --base-color-reverse:var(--cc-white-A);
  --base-bg-reverse:var(--cc-black-A);

  /* Topicpath Height */
  --topicpath-height:0;
  @media (width <= 767px) {
    --topicpath-height:0;
  }

  /* Body Padding Block */
  --body-pd:2.4rem;
  @media (width <= 767px) {
    --body-pd:1.2rem;
  }

  /* PC Min Width */
  --pc-min-width:1000px;

  /* Timing Function */
  --ttf-linear:cubic-bezier(0.250, 0.250, 0.750, 0.750);
  --ttf-default:cubic-bezier(0.250, 0.100, 0.250, 1.000);

  --ttf-ei:cubic-bezier(0.420, 0.000, 1.000, 1.000);
  --ttf-eo:cubic-bezier(0.000, 0.000, 0.580, 1.000);
  --ttf-eio:cubic-bezier(0.420, 0.000, 0.580, 1.000);

  --ttf-ei-quad:cubic-bezier(0.550, 0.085, 0.680, 0.530);
  --ttf-eo-quad:cubic-bezier(0.250, 0.460, 0.450, 0.940);
  --ttf-eio-quad:cubic-bezier(0.455, 0.030, 0.515, 0.955);

  --ttf-ei-cubic:cubic-bezier(0.550, 0.055, 0.675, 0.190);
  --ttf-eo-cubic:cubic-bezier(0.215, 0.610, 0.355, 1.000);
  --ttf-eio-cubic:cubic-bezier(0.645, 0.045, 0.355, 1.000);

  --ttf-ei-quart:cubic-bezier(0.895, 0.030, 0.685, 0.220);
  --ttf-eo-quart:cubic-bezier(0.165, 0.840, 0.440, 1.000);
  --ttf-eio-quart:cubic-bezier(0.770, 0.000, 0.175, 1.000);

  --ttf-ei-quint:cubic-bezier(0.755, 0.050, 0.855, 0.060);
  --ttf-eo-quint:cubic-bezier(0.230, 1.000, 0.320, 1.000);
  --ttf-eio-quint:cubic-bezier(0.860, 0.000, 0.070, 1.000);

  --ttf-ei-sine:cubic-bezier(0.470, 0.000, 0.745, 0.715);
  --ttf-eo-sine:cubic-bezier(0.390, 0.575, 0.565, 1.000);
  --ttf-eio-sine:cubic-bezier(0.445, 0.050, 0.550, 0.950);

  --ttf-ei-expo:cubic-bezier(0.950, 0.050, 0.795, 0.035);
  --ttf-eo-expo:cubic-bezier(0.190, 1.000, 0.220, 1.000);
  --ttf-eio-expo:cubic-bezier(1.000, 0.000, 0.000, 1.000);

  --ttf-ei-circ:cubic-bezier(0.600, 0.040, 0.980, 0.335);
  --ttf-eo-circ:cubic-bezier(0.075, 0.820, 0.165, 1.000);
  --ttf-eio-circ:cubic-bezier(0.785, 0.135, 0.150, 0.860);

  --ttf-ei-back:cubic-bezier(0.600, -0.280, 0.735, 0.045);
  --ttf-eo-back:cubic-bezier(0.175, 0.885, 0.320, 1.275);
  --ttf-eio-back:cubic-bezier(0.680, -0.550, 0.265, 1.550);

  @media (width <= 767px) {

    /* Base Variable Width */
    --base-size:750;
    --variable-length:var(--base-size) * 100vw;

    /* Navigation Button Size */
    --navigation-button-size:var(--header-height);

    /* SP fixed conversion Height */
    --sp-fixed-height:calc(0rem + env(safe-area-inset-bottom));
  }

  --radius-A:5.0rem;
  --radius-B:4.0rem;
  --radius-C:1.2rem;
}