@charset "utf-8";

@import url("https://fonts.googleapis.com/css2?family=Akshar:wght@300..700&family=Inder&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Noto+Sans+JP:wght@100..900&family=Noto+Serif+JP:wght@200..900&display=swap");

/* .akshar-<uniquifier> {
  font-family: "Akshar", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}

.inder-regular {
  font-family: "Inder", sans-serif;
  font-weight: 400;
  font-style: normal;
} */

/* 変数 */
:root {
  /* 色 */
  --font_color: #000;
  --thin_font-color: #505050;
  --red: #f00;
  --blue: #00f;
  --blue02: #007bab;
  --light-blue: #00dae8;
  --light-blue02: #03a3ff;
  --green: #00b0a8;

  --bg_white: #f3f6f7;

  /* フォント */
  --font_primary:
    "Noto Sans JP", "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体",
    "YuGothic", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ",
    "Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  --yu-gothic:
    "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", "YuGothic",
    sans-serif;
  --mincho:
    "游明朝 Medium", "Yu Mincho Medium", "游明朝", "YuMincho",
    hiragino-mincho-pron, "ヒラギノ明朝 ProN", "Hiragino Mincho ProN",
    "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  --en:
    "Inter", "Noto Sans JP", Helvetica, "Helvetica Neue", Arial, Verdana,
    "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "游ゴシック体",
    "Yu Gothic", "YuGothic", "Meiryo UI", "メイリオ", "Meiryo",
    "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  --inder:
    "Inder", "Inter", "Noto Sans JP", Helvetica, "Helvetica Neue", Arial,
    Verdana, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "游ゴシック体",
    "Yu Gothic", "YuGothic", "Meiryo UI", "メイリオ", "Meiryo",
    "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;

  /* グラデーション */
  --blue_grada_w: -webkit-linear-gradient(90deg, #3c7df4 0%, #0014ff 100%);
  --blue_grada: linear-gradient(180deg, #3c7df4 0%, #0014ff 100%);
  --light-blue_grada_w: -webkit-linear-gradient(
    90deg,
    #afe2ff 0%,
    var(--light-blue02) 88.28%
  );
  --light-blue_grada: linear-gradient(
    180deg,
    #afe2ff 0%,
    var(--light-blue02) 88.28%
  );

  /* ボックスシャドウ */
  --shadow_primary: 0 0.2rem 1.4rem -0.4rem rgba(0, 0, 0, 0.2);
  --text_shadow_primary:
    0 0 0.3em rgba(0, 0, 0, 0.2), 0 0 0.3em rgba(0, 0, 0, 0.2);

  /* vwの値をスクロールバーを含めて考慮 */
  --js_windowWidth: 100vw; /* JSで書き換え。（ウインドウ幅-スクロールバー）px */
  --js_vw: 1vw; /* JSで書き換え。(（ウインドウ幅-スクロールバー）/100)pxで、vwのように使用する。 */
  /* marjin-inline: calc(50% - 50wv); をスクロールバー考慮できるように。 */
  --breack_through: calc(50% - var(--js_windowWidth) / 2);
  --breack_through_half: calc(25% - var(--js_windowWidth) / 4);
}

@media screen and (max-width: 768px) {
  :root {
    --shadow_primary: 0 0.1rem 1.2rem -0.6rem rgba(0, 0, 0, 0.2);
  }
}

/* =====
	base
======================================================== */
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  font-size: 100%;
  vertical-align: baseline;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
menu,
nav,
section {
  display: block;
}
html {
  line-height: 1;
}
ul,
ol,
summary {
  list-style-type: none;
}
summary::-webkit-details-marker {
  /* Safari-デフォルトの三角形を削除*/
  display: none;
}
table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
}
caption,
th,
td {
  text-align: left;
  font-weight: normal;
  vertical-align: middle;
}
q,
blockquote {
  quotes: none;
}

q:before,
q:after,
blockquote:before,
blockquote:after {
  content: "";
  content: none;
}

a img {
  border: none;
}
img {
  vertical-align: bottom;
  border: none;
  max-width: 100%;
  height: auto;
}
img[src*=".svg"] {
  width: 100%;
}
picture {
  display: block;
  width: 100%;
  height: 100%;
}
video {
  max-width: 100%;
}
a {
  cursor: pointer;
  color: inherit;
  text-decoration: none;
  transition: 0.4s;
}
table a,
article a {
  word-break: break-all;
}
button {
  color: var(--font_color);
  transition: 0.4s;
}
*,
:before,
:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
input,
button,
select,
textarea {
  -o-appearance: none; /*Opera対応*/
  -webkit-appearance: none; /*Google Chrome/Safari対応*/
  -moz-appearance: none; /*Firefox対応*/
  appearance: none;
  font: inherit;
  border: none;
  border-radius: 0;
  outline: none;
}
input::-webkit-calendar-picker-indicator {
  /* datalistタグの矢印 （たぶん消えない） */
  display: none; /* iOS対策 */
  appearance: none; /* SafariやChrome用 */
  -webkit-appearance: none; /* Safari用 */
  opacity: 0; /* 念のため */
  pointer-events: none; /* 矢印がクリックできないようにする */
}
input::-webkit-list-button {
  /* datalistタグの矢印iOS（これで消える） */
  content: none;
}

textarea {
  resize: none;
}
input[type="checkbox"],
input[type="radio"] {
  display: none;
}
input[type="submit"],
input[type="button"],
label,
button,
select,
summary {
  cursor: pointer;
}

select::-ms-expand {
  display: none;
}

/************************************************************************
	PC/SP
**************************************************************************/
.sp {
  display: none;
}

@media screen and (max-width: 768px) {
  .pc {
    display: none;
  }
  .sp {
    display: block;
  }
}

/************************************************************************
	フォント関係
**************************************************************************/
html {
  font-size: 62.5%; /* 1.6remで16px */
}
/* 以降 (XXpx/16)×0.625 */
@media screen and (max-width: 1200px) {
  html {
    font-size: 58.59%; /* 1.6remで15px */
  }
}
@media screen and (max-width: 1024px) {
  html {
    font-size: 54.69%; /* 1.6remで14px */
  }
}
/* 以降、350pxで14pxにしたいので1.4remで指定 */
/* font-size100%時、1.4rem=22.4pxなので、XXpx/22.4=目的の％ */
@media screen and (max-width: 768px) {
  html {
    font-size: 93.75%; /* 1.4remで21px */
  }
}
@media screen and (max-width: 530px) {
  /* 350px*1.5 */
  html {
    font-size: calc(
      2.564 * var(--js_vw)
    ); /* 390pxで10px 1.4remで14px 2.667vwの代わり */
  }
}

/* =====
	body
======================================================== */
body {
  font-family: var(--font_primary);
  color: var(--font_color);
  font-size: 1.6rem;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 2;
  word-wrap: normal;
  background-color: var(--bg_white);
}

@media screen and (max-width: 768px) {
  body {
    /* 350pxのとき14px */
    font-size: 1.4rem;
  }
}

/* =====
	字体
======================================================== */
.yu-gothic {
  font-family: var(--yu-gothic);
}

.mincho {
  font-family: var(--mincho);
  font-weight: 500;
}

.en {
  font-family: var(--en);
}

/* =====
	文字サイズ
======================================================== */
.fz12 {
  font-size: 1.2rem;
}
.fz14 {
  font-size: 1.4rem;
}
.fz15 {
  font-size: 1.5rem;
}
.fz16 {
  font-size: 1.6rem;
}
.fz18 {
  font-size: 1.8rem;
}
.fz20 {
  font-size: 2rem;
}
.fz23 {
  font-size: 2.3rem;
}
.fz24 {
  font-size: 2.4rem;
}
.fz25 {
  font-size: 2.5rem;
}
.fz26 {
  font-size: 2.6rem;
}
.fz28 {
  font-size: 2.8rem;
}
.fz30 {
  font-size: 3rem;
}
.fz34 {
  font-size: 3.4rem;
}
.fz35 {
  font-size: 3.5rem;
}
.fz36 {
  font-size: 3.6rem;
}
.fz40 {
  font-size: 4rem;
}
.fz42 {
  font-size: 4.2rem;
}
.fz48 {
  font-size: 4.8rem;
}
.fz51 {
  font-size: 5.1rem;
}
.fz54 {
  font-size: 5.4rem;
}
.fz56 {
  font-size: 5.6rem;
}

.fz70 {
  font-size: 7rem;
}
.fz75 {
  font-size: 7.5rem;
}

.fz80 {
  font-size: 8rem;
}

.fz108 {
  font-size: 10.8rem;
}

@media screen and (max-width: 768px) {
  /* SPデザインなければ×0.66とか */
  .fz16 {
    font-size: 1.4rem;
  }
  .fz18 {
    font-size: 1.4rem;
  }
  .fz20 {
    font-size: 1.5rem;
  }
  .fz23 {
    font-size: 1.6rem;
  }
  .fz24 {
    font-size: 1.65rem;
  }
  .fz25 {
    font-size: 1.65rem;
  }
  .fz26 {
    font-size: 1.72rem;
  }
  .fz28 {
    font-size: 1.85rem;
  }
  .fz30 {
    font-size: 2rem;
  }
  .fz34 {
    font-size: 2.24rem;
  }
  .fz35 {
    font-size: 2.31rem;
  }
  .fz36 {
    font-size: 2.37rem;
  }
  .fz40 {
    font-size: 2.64rem;
  }
  .fz42 {
    font-size: 2.77rem;
  }
  .fz48 {
    font-size: 3.16rem;
  }
  .fz51 {
    font-size: 3.36rem;
  }
  .fz54 {
    font-size: 3.56rem;
  }
  .fz56 {
    font-size: 3.68rem;
  }

  .fz70 {
    font-size: 4.62rem;
  }
  .fz75 {
    font-size: 4.95rem;
  }

  .fz80 {
    font-size: 5.28rem;
  }

  .fz108 {
    font-size: 7.12rem;
  }

  .fz12sp {
    font-size: 1.2rem;
  }
  .fz13sp {
    font-size: 1.3rem;
  }
  .fz14sp {
    font-size: 1.4rem;
  }
  .fz15sp {
    font-size: 1.5rem;
  }
  .fz16sp {
    font-size: 1.6rem;
  }
  .fz18sp {
    font-size: 1.8rem;
  }
  .fz20sp {
    font-size: 2rem;
  }
  .fz21sp {
    font-size: 2.1rem;
  }
  .fz22sp {
    font-size: 2.2rem;
  }
  .fz24sp {
    font-size: 2.4rem;
  }
  .fz25sp {
    font-size: 2.5rem;
  }
  .fz27sp {
    font-size: 2.7rem;
  }
  .fz28sp {
    font-size: 2.8rem;
  }
  .fz30sp {
    font-size: 3rem;
  }
  .fz45sp {
    font-size: 4.5rem;
  }

  .fz84sp {
    font-size: 8.4rem;
  }
}

/* =====
	文字色
======================================================== */
.white {
  color: #fff;
}
.red {
  color: var(--red);
}
.blue {
  color: var(--blue);
}
.light-blue {
  color: var(--light-blue);
}
.green {
  color: var(--green);
}

/* =====
	文字太さ 装飾
======================================================== */
.font-smooth {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
}

.bold {
  font-weight: 700;
}
.fw400 {
  font-weight: 400;
}
.fw500 {
  font-weight: 500;
}
.fw600 {
  font-weight: 600;
}
.fw900 {
  font-weight: 900;
}

.italic {
  font-style: italic;
}
.underline,
.u_trance {
  text-decoration: underline;
}
.u_trance:hover {
  text-decoration: none;
}

/* =====
	並び 間隔
======================================================== */
.tal {
  text-align: left;
}
.tac,
.tac_pc {
  text-align: center;
}
.tar,
.tar_pc {
  text-align: right;
}
.taj {
  text-align: justify;
}

.ls0 {
  letter-spacing: 0;
}
.ls1 {
  letter-spacing: 0.1em;
}
.ls05 {
  letter-spacing: 0.05em;
}
.ls025 {
  letter-spacing: 0.025em;
}

.lh14 {
  line-height: 1.4;
}
.lh15 {
  line-height: 1.5;
}
.lh175 {
  line-height: 1.75;
}
.lh1875 {
  line-height: 1.875;
}
.lh2 {
  line-height: 2;
}
.lh225 {
  line-height: 2.25;
}

@media screen and (max-width: 768px) {
  .tac_pc {
    text-align: left;
  }
  .tar_pc {
    text-align: left;
  }
  .lh14sp {
    line-height: 1.4;
  }
  .lh15sp {
    line-height: 1.5;
  }
  .lh175sp {
    line-height: 1.75;
  }
  .lh1875sp {
    line-height: 1.875;
  }
  .lh2sp {
    line-height: 2;
  }
  .lh225sp {
    line-height: 2.25;
  }
}

/* =====
	文字関係その他
======================================================== */
.v-rl {
  writing-mode: vertical-rl;
}
.upright {
  text-orientation: upright;
}

.indent {
  text-indent: 1em;
}
span.indent {
  display: inline-block;
}

.palt {
  font-feature-settings: "palt";
}

.capitalize {
  text-transform: capitalize;
}
.no_capitalize {
  text-transform: none;
}
.uppercase {
  text-transform: uppercase;
}

.t-shadow {
  text-shadow:
    0 0.8rem 1.6rem rgba(0, 0, 0, 0.08),
    0 0.8rem 1.6rem rgba(0, 0, 0, 0.08);
}

.marker {
  background: linear-gradient(transparent 75%, #fff100 75%);
}

/************************************************************************
	リストなど　擬似要素装飾
**************************************************************************/
/* 「※」 */
.attention-mark {
  position: relative;
  padding-left: 1.1em;
}
.attention-mark::before {
  content: "\0203B";
  position: absolute;
  left: 0;
}
span.attention-mark {
  display: inline-block;
}

/* 「・」 */
.disc li,
.disc-mark {
  padding-left: 1.33em;
  position: relative;
}
.disc li::before,
.disc-mark::before {
  content: "・";
  position: absolute;
  left: 0.25em;
}
span.disc-mark {
  display: inline-block;
}

/* 「⚫︎」 */
.circle li,
.circle-mark {
  padding-left: 1.33em;
  position: relative;
}
.circle li::before,
.circle-mark::before {
  content: "";
  display: block;
  width: 0.625em;
  height: 0.625em;
  background-color: #0079c2;
  border-radius: 50%;
  position: absolute;
  left: 0;
  top: 0.4em;
}

/* 「01.」 */
.num-list {
  counter-reset: num-list;
}
.num-list li {
  counter-increment: num-list;
  padding-left: 1.5em;
  position: relative;
}
.num-list li::before {
  content: counter(num-list, decimal-leading-zero) ".";
  position: absolute;
  left: 0;
}

@media screen and (max-width: 768px) {
}

/************************************************************************
	インナー　その他余白
**************************************************************************/
.inner {
  margin: auto;
}
.inner.primary {
  max-width: 100rem;
  width: 92%;
}
.inner.secondary {
  max-width: 120rem;
  width: 93.75%;
}
.inner.tertiary {
  max-width: 80rem;
  width: 90%;
}

@media screen and (max-width: 768px) {
  .inner.primary,
  .inner.secondary {
    width: 90%;
  }
}

/* =====
	padding ⚪︎⚪︎px/1600px
======================================================== */
.pt20 {
  padding-top: 2rem;
}
.pb20 {
  padding-bottom: 2rem;
}

.pt30 {
  padding-top: 3rem;
}
.pb30 {
  padding-bottom: 3rem;
}

.pt40 {
  padding-top: 4rem;
}
.pb40 {
  padding-bottom: 4rem;
}

.pt50 {
  padding-top: 5rem;
}
.pb50 {
  padding-bottom: 5rem;
}

.pt60 {
  padding-top: 6rem;
}
.pb60 {
  padding-bottom: 6rem;
}

.pt70 {
  padding-top: 7rem;
}
.pb70 {
  padding-bottom: 7rem;
}

.pt80 {
  padding-top: 8rem;
}
.pb80 {
  padding-bottom: 8rem;
}

.pt90 {
  padding-top: 9rem;
}
.pb90 {
  padding-bottom: 9rem;
}

.pt100 {
  padding-top: 10rem;
}
.pb100 {
  padding-bottom: 10rem;
}

.pt110 {
  padding-top: 11rem;
}
.pb110 {
  padding-bottom: 11rem;
}

.pt120 {
  padding-top: 12rem;
}
.pb120 {
  padding-bottom: 12rem;
}

.pt130 {
  padding-top: 13rem;
}
.pb130 {
  padding-bottom: 13rem;
}

.pt140 {
  padding-top: 14rem;
}
.pb140 {
  padding-bottom: 14rem;
}

.pt150 {
  padding-top: 15rem;
}
.pb150 {
  padding-bottom: 15rem;
}

.pt160 {
  padding-top: 16rem;
}
.pb160 {
  padding-bottom: 16rem;
}

.pt170 {
  padding-top: 17rem;
}
.pb170 {
  padding-bottom: 17rem;
}

.pt180 {
  padding-top: 18rem;
}
.pb180 {
  padding-bottom: 18rem;
}

.pt190 {
  padding-top: 19rem;
}
.pb190 {
  padding-bottom: 19rem;
}

.pt200 {
  padding-top: 20rem;
}
.pb200 {
  padding-bottom: 20rem;
}

.pt210 {
  padding-top: 21rem;
}
.pb210 {
  padding-bottom: 21rem;
}

.pt220 {
  padding-top: 22rem;
}
.pb220 {
  padding-bottom: 22rem;
}

@media screen and (max-width: 768px) {
  /* pcの数字×0.5 */
  .pt20 {
    padding-top: 1rem;
  }
  .pb20 {
    padding-bottom: 1rem;
  }

  .pt30 {
    padding-top: 1.5rem;
  }
  .pb30 {
    padding-bottom: 1.5rem;
  }

  .pt40 {
    padding-top: 2rem;
  }
  .pb40 {
    padding-bottom: 2rem;
  }

  .pt50 {
    padding-top: 2.5rem;
  }
  .pb50 {
    padding-bottom: 2.5rem;
  }

  .pt60 {
    padding-top: 3rem;
  }
  .pb60 {
    padding-bottom: 3rem;
  }

  .pt70 {
    padding-top: 3.5rem;
  }
  .pb70 {
    padding-bottom: 3.5rem;
  }

  .pt80 {
    padding-top: 5rem;
  }
  .pb80 {
    padding-bottom: 5rem;
  }

  .pt90 {
    padding-top: 4.5rem;
  }
  .pb90 {
    padding-bottom: 4.5rem;
  }

  .pt100 {
    padding-top: 5rem;
  }
  .pb100 {
    padding-bottom: 5rem;
  }

  .pt110 {
    padding-top: 5.5rem;
  }
  .pb110 {
    padding-bottom: 5.5rem;
  }

  .pt120 {
    padding-top: 6rem;
  }
  .pb120 {
    padding-bottom: 6rem;
  }

  .pt130 {
    padding-top: 6.5rem;
  }
  .pb130 {
    padding-bottom: 6.5rem;
  }

  .pt140 {
    padding-top: 7rem;
  }
  .pb140 {
    padding-bottom: 7rem;
  }

  .pt150 {
    padding-top: 7.5rem;
  }
  .pb150 {
    padding-bottom: 7.5rem;
  }

  .pt160 {
    padding-top: 8rem;
  }
  .pb160 {
    padding-bottom: 8rem;
  }

  .pt170 {
    padding-top: 8.5rem;
  }
  .pb170 {
    padding-bottom: 8.5rem;
  }

  .pt180 {
    padding-top: 9rem;
  }
  .pb180 {
    padding-bottom: 9rem;
  }

  .pt190 {
    padding-top: 9.5rem;
  }
  .pb190 {
    padding-bottom: 9.5rem;
  }

  .pt200 {
    padding-top: 10rem;
  }
  .pb200 {
    padding-bottom: 10rem;
  }

  .pt210 {
    padding-top: 10.5rem;
  }
  .pb210 {
    padding-bottom: 10.5rem;
  }

  .pt220 {
    padding-top: 11rem;
  }
  .pb220 {
    padding-bottom: 11rem;
  }

  /* sp デザイン350px時 */
  .pt0sp {
    padding-top: 0;
  }
  .pb0sp {
    padding-bottom: 0;
  }
  .pt20sp {
    padding-top: 2rem;
  }
  .pb20sp {
    padding-bottom: 2rem;
  }

  .pt30sp {
    padding-top: 3rem;
  }
  .pb30sp {
    padding-bottom: 3rem;
  }

  .pt40sp {
    padding-top: 4rem;
  }
  .pb40sp {
    padding-bottom: 4rem;
  }

  .pt50sp {
    padding-top: 5rem;
  }
  .pb50sp {
    padding-bottom: 5rem;
  }

  .pt60sp {
    padding-top: 6rem;
  }
  .pb60sp {
    padding-bottom: 6rem;
  }

  .pt70sp {
    padding-top: 7rem;
  }
  .pb70sp {
    padding-bottom: 7rem;
  }

  .pt80sp {
    padding-top: 8rem;
  }
  .pb80sp {
    padding-bottom: 8rem;
  }

  .pt90sp {
    padding-top: 9rem;
  }
  .pb90sp {
    padding-bottom: 9rem;
  }

  .pt100sp {
    padding-top: 10rem;
  }
  .pb100sp {
    padding-bottom: 10rem;
  }

  .pt110sp {
    padding-top: 11rem;
  }
  .pb110sp {
    padding-bottom: 11rem;
  }

  .pt120sp {
    padding-top: 12rem;
  }
  .pb120sp {
    padding-bottom: 12rem;
  }

  .pt130sp {
    padding-top: 13rem;
  }
  .pb130sp {
    padding-bottom: 13rem;
  }

  .pt140sp {
    padding-top: 14rem;
  }
  .pb140sp {
    padding-bottom: 14rem;
  }
}

/* (主に文字上下余白) */
.pt025em {
  padding-top: 0.25em;
}
.pt033em {
  padding-top: 0.33em;
}
.pt05em {
  padding-top: 0.5em;
}
.pt066em {
  padding-top: 0.66em;
}
.pt075em {
  padding-top: 0.75em;
}
.pt1em {
  padding-top: 1em;
}
.pt125em {
  padding-top: 1.25em;
}
.pt133em {
  padding-top: 1.33em;
}
.pt15em {
  padding-top: 1.5em;
}
.pt166em {
  padding-top: 1.66em;
}
.pt175em {
  padding-top: 1.75em;
}
.pt2em {
  padding-top: 2em;
}
.pt225em {
  padding-top: 2.25em;
}
.pt233em {
  padding-top: 2.33em;
}
.pt25em {
  padding-top: 2.5em;
}
.pt266em {
  padding-top: 2.66em;
}
.pt275em {
  padding-top: 2.75em;
}
.pt3em {
  padding-top: 3em;
}
.pt35em {
  padding-top: 3.5em;
}
.pt4em {
  padding-top: 4em;
}
.pt45em {
  padding-top: 4.5em;
}
.pt5em {
  padding-top: 5em;
}

.m_a {
  margin: auto;
}
.mi_a {
  margin-inline: auto;
}
.mb025em {
  margin-bottom: 0.25em;
}
.mb033em {
  margin-bottom: 0.33em;
}
.mb05em {
  margin-bottom: 0.5em;
}
.mb066em {
  margin-bottom: 0.66em;
}
.mb075em {
  margin-bottom: 0.75em;
}
.mb1em {
  margin-bottom: 1em;
}
.mb125em {
  margin-bottom: 1.25em;
}
.mb133em {
  margin-bottom: 1.33em;
}
.mb15em {
  margin-bottom: 1.5em;
}
.mb166em {
  margin-bottom: 1.66em;
}
.mb175em {
  margin-bottom: 1.75em;
}
.mb2em {
  margin-bottom: 2em;
}
.mb225em {
  margin-bottom: 2.25em;
}
.mb233em {
  margin-bottom: 2.33em;
}
.mb25em {
  margin-bottom: 2.5em;
}
.mb266em {
  margin-bottom: 2.66em;
}
.mb275em {
  margin-bottom: 2.75em;
}
.mb3em {
  margin-bottom: 3em;
}
.mb35em {
  margin-bottom: 3.5em;
}
.mb4em {
  margin-bottom: 4em;
}
.mb45em {
  margin-bottom: 4.5em;
}
.mb5em {
  margin-bottom: 5em;
}

@media screen and (max-width: 768px) {
  /* pcの数字×0.8 */
  .pt025em {
    padding-top: 0.2em;
  }
  .pt033em {
    padding-top: 0.264em;
  }
  .pt05em {
    padding-top: 0.4em;
  }
  .pt066em {
    padding-top: 0.528em;
  }
  .pt075em {
    padding-top: 0.6em;
  }
  .pt1em {
    padding-top: 0.8em;
  }
  .pt125em {
    padding-top: 1em;
  }
  .pt133em {
    padding-top: 1.064em;
  }
  .pt15em {
    padding-top: 1.2em;
  }
  .pt166em {
    padding-top: 1.328em;
  }
  .pt175em {
    padding-top: 1.4em;
  }
  .pt2em {
    padding-top: 1.6em;
  }
  .pt225em {
    padding-top: 1.8em;
  }
  .pt233em {
    padding-top: 1.864em;
  }
  .pt25em {
    padding-top: 2em;
  }
  .pt266em {
    padding-top: 2.128em;
  }
  .pt275em {
    padding-top: 2.2em;
  }
  .pt3em {
    padding-top: 2.4em;
  }
  .pt35em {
    padding-top: 2.8em;
  }
  .pt4em {
    padding-top: 3.2em;
  }
  .pt45em {
    padding-top: 3.6em;
  }
  .pt5em {
    padding-top: 4em;
  }

  .pt025em_sp {
    padding-top: 0.25em;
  }
  .pt033em_sp {
    padding-top: 0.33em;
  }
  .pt05em_sp {
    padding-top: 0.5em;
  }
  .pt066em_sp {
    padding-top: 0.66em;
  }
  .pt075em_sp {
    padding-top: 0.75em;
  }
  .pt1em_sp {
    padding-top: 1em;
  }
  .pt125em_sp {
    padding-top: 1.25em;
  }
  .pt133em_sp {
    padding-top: 1.33em;
  }
  .pt15em_sp {
    padding-top: 1.5em;
  }
  .pt166em_sp {
    padding-top: 1.66em;
  }
  .pt175em_sp {
    padding-top: 1.75em;
  }
  .pt2em_sp {
    padding-top: 2em;
  }
  .pt225em_sp {
    padding-top: 2.25em;
  }
  .pt233em_sp {
    padding-top: 2.33em;
  }
  .pt25em_sp {
    padding-top: 2.5em;
  }
  .pt266em_sp {
    padding-top: 2.66em;
  }
  .pt275em_sp {
    padding-top: 2.75em;
  }
  .pt3em_sp {
    padding-top: 3em;
  }
  .pt35em_sp {
    padding-top: 3.5em;
  }
  .pt4em_sp {
    padding-top: 4em;
  }
  .pt45em_sp {
    padding-top: 4.5em;
  }
  .pt5em_sp {
    padding-top: 5em;
  }

  .mb025em {
    margin-bottom: 0.2em;
  }
  .mb033em {
    margin-bottom: 0.264em;
  }
  .mb05em {
    margin-bottom: 0.4em;
  }
  .mb066em {
    margin-bottom: 0.528em;
  }
  .mb075em {
    margin-bottom: 0.6em;
  }
  .mb1em {
    margin-bottom: 0.8em;
  }
  .mb125em {
    margin-bottom: 1em;
  }
  .mb133em {
    margin-bottom: 1.064em;
  }
  .mb15em {
    margin-bottom: 1.2em;
  }
  .mb166em {
    margin-bottom: 1.328em;
  }
  .mb175em {
    margin-bottom: 1.4em;
  }
  .mb2em {
    margin-bottom: 1.6em;
  }
  .mb225em {
    margin-bottom: 1.8em;
  }
  .mb233em {
    margin-bottom: 1.864em;
  }
  .mb25em {
    margin-bottom: 2em;
  }
  .mb266em {
    margin-bottom: 2.128em;
  }
  .mb275em {
    margin-bottom: 2.2em;
  }
  .mb3em {
    margin-bottom: 2.4em;
  }
  .mb35em {
    margin-bottom: 2.8em;
  }
  .mb4em {
    margin-bottom: 3.2em;
  }
  .mb45em {
    margin-bottom: 3.6em;
  }
  .mb5em {
    margin-bottom: 4em;
  }

  .mb025em_sp {
    margin-bottom: 0.25em;
  }
  .mb033em_sp {
    margin-bottom: 0.33em;
  }
  .mb05em_sp {
    margin-bottom: 0.5em;
  }
  .mb066em_sp {
    margin-bottom: 0.66em;
  }
  .mb075em_sp {
    margin-bottom: 0.75em;
  }
  .mb1em_sp {
    margin-bottom: 1em;
  }
  .mb125em_sp {
    margin-bottom: 1.25em;
  }
  .mb133em_sp {
    margin-bottom: 1.33em;
  }
  .mb15em_sp {
    margin-bottom: 1.5em;
  }
  .mb166em_sp {
    margin-bottom: 1.66em;
  }
  .mb175em_sp {
    margin-bottom: 1.75em;
  }
  .mb2em_sp {
    margin-bottom: 2em;
  }
  .mb225em_sp {
    margin-bottom: 2.25em;
  }
  .mb233em_sp {
    margin-bottom: 2.33em;
  }
  .mb25em_sp {
    margin-bottom: 2.5em;
  }
  .mb266em_sp {
    margin-bottom: 2.66em;
  }
  .mb275em_sp {
    margin-bottom: 2.75em;
  }
  .mb3em_sp {
    margin-bottom: 3em;
  }
  .mb35em_sp {
    margin-bottom: 3.5em;
  }
  .mb4em_sp {
    margin-bottom: 4em;
  }
  .mb45em_sp {
    margin-bottom: 4.5em;
  }
  .mb5em_sp {
    margin-bottom: 5em;
  }
}

/* (主に文字左右余白) */
.pl025em {
  padding-left: 0.25em;
}
.pl033em {
  padding-left: 0.33em;
}
.pl05em {
  padding-left: 0.5em;
}
.pl066em {
  padding-left: 0.66em;
}
.pl075em {
  padding-left: 0.75em;
}
.pl1em {
  padding-left: 1em;
}
.pl125em {
  padding-left: 1.25em;
}
.pl133em {
  padding-left: 1.33em;
}
.pl15em {
  padding-left: 1.5em;
}
.pl166em {
  padding-left: 1.66em;
}
.pl175em {
  padding-left: 1.75em;
}
.pl2em {
  padding-left: 2em;
}
.pl225em {
  padding-left: 2.25em;
}
.pl233em {
  padding-left: 2.33em;
}
.pl25em {
  padding-left: 2.5em;
}
.pl266em {
  padding-left: 2.66em;
}
.pl275em {
  padding-left: 2.75em;
}
.pl3em {
  padding-left: 3em;
}
.pl35em {
  padding-left: 3.5em;
}
.pl4em {
  padding-left: 4em;
}
.pl45em {
  padding-left: 4.5em;
}
.pl5em {
  padding-left: 5em;
}

.pr025em {
  padding-right: 0.25em;
}
.pr033em {
  padding-right: 0.33em;
}
.pr05em {
  padding-right: 0.5em;
}
.pr066em {
  padding-right: 0.66em;
}
.pr075em {
  padding-right: 0.75em;
}
.pr1em {
  padding-right: 1em;
}
.pr125em {
  padding-right: 1.25em;
}
.pr133em {
  padding-right: 1.33em;
}
.pr15em {
  padding-right: 1.5em;
}
.pr166em {
  padding-right: 1.66em;
}
.pr175em {
  padding-right: 1.75em;
}
.pr2em {
  padding-right: 2em;
}
.pr225em {
  padding-right: 2.25em;
}
.pr233em {
  padding-right: 2.33em;
}
.pr25em {
  padding-right: 2.5em;
}
.pr266em {
  padding-right: 2.66em;
}
.pr275em {
  padding-right: 2.75em;
}
.pr3em {
  padding-right: 3em;
}
.pr35em {
  padding-right: 3.5em;
}
.pr4em {
  padding-right: 4em;
}
.pr45em {
  padding-right: 4.5em;
}
.pr5em {
  padding-right: 5em;
}

@media screen and (max-width: 768px) {
  /* pcの数字×0.8 */
  .pl025em {
    padding-left: 0.2em;
  }
  .pl033em {
    padding-left: 0.264em;
  }
  .pl05em {
    padding-left: 0.4em;
  }
  .pl066em {
    padding-left: 0.528em;
  }
  .pl075em {
    padding-left: 0.6em;
  }
  .pl1em {
    padding-left: 0.8em;
  }
  .pl125em {
    padding-left: 1em;
  }
  .pl133em {
    padding-left: 1.064em;
  }
  .pl15em {
    padding-left: 1.2em;
  }
  .pl166em {
    padding-left: 1.328em;
  }
  .pl175em {
    padding-left: 1.4em;
  }
  .pl2em {
    padding-left: 1.6em;
  }
  .pl225em {
    padding-left: 1.8em;
  }
  .pl233em {
    padding-left: 1.864em;
  }
  .pl25em {
    padding-left: 2em;
  }
  .pl266em {
    padding-left: 2.128em;
  }
  .pl275em {
    padding-left: 2.2em;
  }
  .pl3em {
    padding-left: 2.4em;
  }
  .pl35em {
    padding-left: 2.8em;
  }
  .pl4em {
    padding-left: 3.2em;
  }
  .pl45em {
    padding-left: 3.6em;
  }
  .pl5em {
    padding-left: 4em;
  }

  .pl025em_sp {
    padding-left: 0.25em;
  }
  .pl033em_sp {
    padding-left: 0.33em;
  }
  .pl05em_sp {
    padding-left: 0.5em;
  }
  .pl066em_sp {
    padding-left: 0.66em;
  }
  .pl075em_sp {
    padding-left: 0.75em;
  }
  .pl1em_sp {
    padding-left: 1em;
  }
  .pl125em_sp {
    padding-left: 1.25em;
  }
  .pl133em_sp {
    padding-left: 1.33em;
  }
  .pl15em_sp {
    padding-left: 1.5em;
  }
  .pl166em_sp {
    padding-left: 1.66em;
  }
  .pl175em_sp {
    padding-left: 1.75em;
  }
  .pl2em_sp {
    padding-left: 2em;
  }
  .pl225em_sp {
    padding-left: 2.25em;
  }
  .pl233em_sp {
    padding-left: 2.33em;
  }
  .pl25em_sp {
    padding-left: 2.5em;
  }
  .pl266em_sp {
    padding-left: 2.66em;
  }
  .pl275em_sp {
    padding-left: 2.75em;
  }
  .pl3em_sp {
    padding-left: 3em;
  }
  .pl35em_sp {
    padding-left: 3.5em;
  }
  .pl4em_sp {
    padding-left: 4em;
  }
  .pl45em_sp {
    padding-left: 4.5em;
  }
  .pl5em_sp {
    padding-left: 5em;
  }

  .pr025em {
    padding-right: 0.2em;
  }
  .pr033em {
    padding-right: 0.264em;
  }
  .pr05em {
    padding-right: 0.4em;
  }
  .pr066em {
    padding-right: 0.528em;
  }
  .pr075em {
    padding-right: 0.6em;
  }
  .pr1em {
    padding-right: 0.8em;
  }
  .pr125em {
    padding-right: 1em;
  }
  .pr133em {
    padding-right: 1.064em;
  }
  .pr15em {
    padding-right: 1.2em;
  }
  .pr166em {
    padding-right: 1.328em;
  }
  .pr175em {
    padding-right: 1.4em;
  }
  .pr2em {
    padding-right: 1.6em;
  }
  .pr225em {
    padding-right: 1.8em;
  }
  .pr233em {
    padding-right: 1.864em;
  }
  .pr25em {
    padding-right: 2em;
  }
  .pr266em {
    padding-right: 2.128em;
  }
  .pr275em {
    padding-right: 2.2em;
  }
  .pr3em {
    padding-right: 2.4em;
  }
  .pr35em {
    padding-right: 2.8em;
  }
  .pr4em {
    padding-right: 3.2em;
  }
  .pr45em {
    padding-right: 3.6em;
  }
  .pr5em {
    padding-right: 4em;
  }

  .pr025em_sp {
    padding-right: 0.25em;
  }
  .pr033em_sp {
    padding-right: 0.33em;
  }
  .pr05em_sp {
    padding-right: 0.5em;
  }
  .pr066em_sp {
    padding-right: 0.66em;
  }
  .pr075em_sp {
    padding-right: 0.75em;
  }
  .pr1em_sp {
    padding-right: 1em;
  }
  .pr125em_sp {
    padding-right: 1.25em;
  }
  .pr133em_sp {
    padding-right: 1.33em;
  }
  .pr15em_sp {
    padding-right: 1.5em;
  }
  .pr166em_sp {
    padding-right: 1.66em;
  }
  .pr175em_sp {
    padding-right: 1.75em;
  }
  .pr2em_sp {
    padding-right: 2em;
  }
  .pr225em_sp {
    padding-right: 2.25em;
  }
  .pr233em_sp {
    padding-right: 2.33em;
  }
  .pr25em_sp {
    padding-right: 2.5em;
  }
  .pr266em_sp {
    padding-right: 2.66em;
  }
  .pr275em_sp {
    padding-right: 2.75em;
  }
  .pr3em_sp {
    padding-right: 3em;
  }
  .pr35em_sp {
    padding-right: 3.5em;
  }
  .pr4em_sp {
    padding-right: 4em;
  }
  .pr45em_sp {
    padding-right: 4.5em;
  }
  .pr5em_sp {
    padding-right: 5em;
  }
}

/************************************************************************
	リンク
**************************************************************************/
.a_brightness:hover {
  -webkit-filter: brightness(110%);
  filter: brightness(110%);
}
.a_opacity:hover {
  opacity: 0.7;
}

a.no_anchor {
  pointer-events: none;
  text-decoration: none;
}

@media screen and (max-width: 768px) {
}

@media (min-width: 769px) {
  a[href*="tel:"] {
    pointer-events: none;
    text-decoration: none;
  }
}

/************************************************************************
	画像
**************************************************************************/
.img img,
.img picture {
  /* .imgで囲んでいないimgは、元画像の大きさ準拠にしたいので */
  width: 100%;
}

.img_bg {
  position: relative;
  background: url(../img/cmn/dummy.png) no-repeat center/cover;
}
.img_bg::before {
  content: "";
  display: block;
  padding-top: 75%;
}

.img_ab {
  position: relative;
}
.img_ab::before {
  content: "";
  display: block;
  padding-top: 75%;
}
.img_ab img {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/************************************************************************
	タイトル
**************************************************************************/
/* =====
	
======================================================== */

@media screen and (max-width: 768px) {
}

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

@media screen and (max-width: 768px) {
}

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

@media screen and (max-width: 768px) {
}
/************************************************************************
	文字送りアニメーション
**************************************************************************/
/* =====
	灰色→青に変化していく
======================================================== */
.text_fader_primary {
  background: linear-gradient(90deg, #ccc 0%, #ccc 100%) no-repeat 0 0 / 100%
    100%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  text-fill-color: transparent;
}
.animation .text_fader_primary {
  background: linear-gradient(90deg, #00f 0%, #00f 0.5%, #ccc 0.5%, #ccc 100%)
    no-repeat 0 0 / 100% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  text-fill-color: transparent;
  animation: text_fader_primary 6s linear 0.1s both;
}
@keyframes text_fader_primary {
  0% {
    background-size: 100% 100%;
  }
  100% {
    background-size: 20000% 100%;
  }
}
@media screen and (max-width: 768px) {
}

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

@media screen and (max-width: 768px) {
}

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

@media screen and (max-width: 768px) {
}

/************************************************************************
	ボタン
**************************************************************************/
/* =====
	primary
======================================================== */
.btn_primary {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  align-items: center;
  font-size: 2rem;
  color: #fff;
  line-height: 1.5;
  letter-spacing: -0.03em;
  max-width: 38.4rem;
  width: 92%;
  min-height: 3.3em; /* 66/20 */
  padding: 0.25em 2.85em 0.25em 1.5em;
  border-radius: 5em;
  background-image: var(--blue_grada_w);
  background-image: var(--blue_grada);
  position: relative;
  z-index: 0;
}

.btn_primary::before {
  content: "";
  display: block;
  width: calc(100% + 2px);
  height: calc(100% + 2px);
  border-radius: 5em;
  background-image: var(--light-blue_grada_w);
  background-image: var(--light-blue_grada);
  position: absolute;
  left: -1px;
  top: -1px;
  z-index: 1;
  opacity: 0;
  transition: opacity 0.4s;
}
.btn_primary:hover::before {
  opacity: 1;
}

.btn_primary::after {
  content: "";
  display: block;
  width: 1.2em;
  height: 1.2em;
  background: url(../img/cmn/btn-arrow_wh.svg) no-repeat center/contain;
  position: absolute;
  right: 1.5em;
  top: calc(50% - 0.6em);
  z-index: 2;
}

.btn_primary > p {
  position: relative;
  z-index: 2;
}

@media screen and (max-width: 768px) {
  .btn_primary {
    font-size: 1.6rem;
  }
}

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

@media screen and (max-width: 768px) {
}

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

@media screen and (max-width: 768px) {
}

/************************************************************************
	フレックス
**************************************************************************/
.flex {
  display: -webkit-box;
  display: flex;
  flex-wrap: wrap;
}

.flex_pc {
  /* 768以下block */
  display: -webkit-box;
  display: flex;
  flex-wrap: wrap;
}

.nowrap {
  flex-wrap: nowrap;
}

.fd_rr {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
  flex-direction: row-reverse;
}

.fd_c {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  flex-direction: column;
}

.fd_cr {
  -webkit-box-orient: vertical;
  -webkit-box-direction: reverse;
  flex-direction: column-reverse;
}

.ai_fs {
  -webkit-box-align: start;
  align-items: flex-start;
}
.ai_fe {
  -webkit-box-align: end;
  align-items: flex-end;
}
.ai_c {
  -webkit-box-align: center;
  align-items: center;
}

.jc_fs {
  -webkit-box-pack: start;
  justify-content: flex-start;
}
.jc_fe {
  -webkit-box-pack: end;
  justify-content: flex-end;
}
.jc_c {
  -webkit-box-pack: center;
  justify-content: center;
}
.jc_sb {
  -webkit-box-pack: justify;
  justify-content: space-between;
}
.jc_sa {
  justify-content: space-around;
}
.order1 {
  -ms-flex-order: 1;
  -webkit-order: 1;
  order: 1;
}
.order2 {
  -ms-flex-order: 2;
  -webkit-order: 2;
  order: 2;
}

.fl-g {
  -webkit-box-flex: 1;
  flex-grow: 1;
}

@media screen and (max-width: 768px) {
  .flex_pc {
    display: block;
  }
}

/************************************************************************
	その他
**************************************************************************/

.block {
  display: block;
}
.block {
  display: block;
}
.dib,
.dib_pc {
  display: inline-block;
}

.fit {
  width: fit-content;
}

.z1 {
  position: relative;
  z-index: 1;
}
.z2 {
  position: relative;
  z-index: 2;
}
.z3 {
  position: relative;
  z-index: 3;
}

@media screen and (max-width: 768px) {
  .dib_pc {
    display: inline;
  }
  .dib_sp {
    display: inline-block;
  }
}

/* =====
	ボックスシャドウ
======================================================== */
.shadow,
.shadow_trance {
  box-shadow: var(--shadow_primary);
}
a.shadow:hover,
.shadow_trance:hover {
  box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.08);
  transform: translateY(0.2rem);
}

/* =====
	ドラッグでテキスト選択した時の色
======================================================== */
/* ::-moz-selection {
	color: #fff;
	background: #1a1a1a;
}
::selection {
	color: #fff;
	background: #1a1a1a;
} */

/************************************************************************
	アニメーション
**************************************************************************/
/* =====
	フェードイン
======================================================== */
.fade,
.fade-down,
.fade-right,
.fade-left {
  opacity: 0;
}

.animation.fade {
  /* 下から上へ */
  animation: fade-up 0.8s ease forwards;
}

.animation.fade-down {
  /* 上から下へ */
  animation: fade-down 0.8s ease forwards;
}
.animation.fade-right {
  /* 左から右へ */
  animation: fade-right 0.8s ease forwards;
}
.animation.fade-left {
  /* 右から左へ */
  animation: fade-left 0.8s ease forwards;
}

/* フェード移動量少なく */
.animation.few.fade {
  /* 下から上へ */
  animation: fade-up_few 0.8s ease forwards;
}

.animation.few.fade-down {
  /* 上から下へ */
  animation: fade-down_few 0.8s ease forwards;
}
.animation.few.fade-right {
  /* 左から右へ */
  animation: fade-right_few 0.8s ease forwards;
}
.animation.few.fade-left {
  /* 右から左へ */
  animation: fade-left_few 0.8s ease forwards;
}

@keyframes fade-up {
  from {
    opacity: 0;
    transform: translateY(2em);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes fade-down {
  from {
    opacity: 0;
    transform: translateY(-2em);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes fade-right {
  from {
    opacity: 0;
    transform: translateX(-2em);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}
@keyframes fade-left {
  from {
    opacity: 0;
    transform: translateX(2em);
  }

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

@keyframes fade-up_few {
  from {
    opacity: 0;
    transform: translateY(0.75em);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes fade-down_few {
  from {
    opacity: 0;
    transform: translateY(-0.75em);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes fade-right_few {
  from {
    opacity: 0;
    transform: translateX(-0.75em);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}
@keyframes fade-left_few {
  from {
    opacity: 0;
    transform: translateX(0.75em);
  }

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

/* =====
	スライドイン
======================================================== */
.slide-left {
  transform: translateX(-200vw);
}
.animation.slide-left {
  animation: slide-left 1s ease forwards;
}
.animation.slide-left.fast {
  animation-duration: 0.6s;
}
.animation.slide-left.slow {
  animation-duration: 1.5s;
}

.slide-right {
  transform: translateX(200vw);
}
.animation.slide-right {
  animation: slide-right 1s ease forwards;
}
.animation.slide-right.fast {
  animation-duration: 0.6s;
}
.animation.slide-right.slow {
  animation-duration: 1.5s;
}

/* 
<p class="trigger slide-down"><span class="slide_child">上からスライド</span></p>
*/
.slide_child {
  display: inline-block;
}

.slide-up .slide_child {
  transform: translateY(200vh);
}
.animation.slide-up .slide_child {
  animation: slide-up 1s ease forwards;
}
.animation.slide-up.fast .slide_child {
  animation-duration: 0.6s;
}
.animation.slide-up.slow .slide_child {
  animation-duration: 1.5s;
}

.slide-down .slide_child {
  transform: translateY(-200vh);
}
.animation.slide-down .slide_child {
  animation: slide-down 1s ease forwards;
}
.animation.slide-down.fast .slide_child {
  animation-duration: 0.6s;
}
.animation.slide-down.slow .slide_child {
  animation-duration: 1.5s;
}

@keyframes slide-left {
  from {
    transform: translateX(-200vw);
  }

  to {
    transform: translateX(0);
  }
}
@keyframes slide-right {
  from {
    transform: translateX(200vw);
  }

  to {
    transform: translateX(0);
  }
}
@keyframes slide-up {
  from {
    transform: translateY(200vh);
  }

  to {
    transform: translateY(0);
  }
}
@keyframes slide-down {
  from {
    transform: translateY(-200vw);
  }

  to {
    transform: translateY(0);
  }
}

/* =====
	黒背景スライドしてから本来の要素がスライド
======================================================== */
.black-slide,
.black-slide_wrap {
  position: relative;
}
.black-slide_wrap.fit {
  width: fit-content;
}
.black-slide::after,
.black-slide_wrap::after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  z-index: 2;
  width: 0;
  background-color: var(--green);
}

.black-slide.both::after,
.black-slide_wrap.both::after {
  /* 両方向から用 */
  top: auto;
  height: 60%;
}
.black-slide.both::before,
.black-slide_wrap::before {
  /* 両方向から用 */
  content: "";
  display: block;
  position: absolute;
  top: 0;
  width: 0;
  height: 60%;
  background-color: var(--green);
  z-index: 2;
}

.animation.black-slide::after,
.animation.black-slide_wrap::after {
  animation: black-slide 1.2s ease-in-out forwards;
}
.animation.black-slide.reverse::after,
.animation.black-slide_wrap.reverse::after {
  animation: black-slide_reverse 1.2s ease-in-out forwards;
}
.animation.black-slide.both::before,
.animation.black-slide_wrap.both::before {
  /* 両方向から用 */
  animation: black-slide 1.2s ease-in-out forwards;
}
.animation.black-slide.both::after,
.animation.black-slide_wrap.both::after {
  /* 両方向から用 */
  animation: black-slide_reverse 1.2s ease-in-out forwards;
}

.black-slide > *,
.black-slide_wrap > * {
  opacity: 0;
}
.animation.black-slide > *,
.animation.black-slide_wrap > * {
  animation: black_fade 1.2s ease forwards;
}

.black-slide.animation.delay01::after,
.black-slide_wrap.animation.delay01::after,
.black-slide.both.animation.delay01::before,
.black-slide_wrap.animation.delay01::before,
.black-slide.animation.delay01 > *,
.black-slide_wrap.animation.delay01 > * {
  animation-delay: 0.1s !important;
}
.black-slide.animation.delay02::after,
.black-slide_wrap.animation.delay02::after,
.black-slide.both.animation.delay02::before,
.black-slide_wrap.animation.delay02::before,
.black-slide.animation.delay02 > *,
.black-slide_wrap.animation.delay02 > * {
  animation-delay: 0.2s !important;
}
.black-slide.animation.delay03::after,
.black-slide_wrap.animation.delay03::after,
.black-slide.both.animation.delay03::before,
.black-slide_wrap.animation.delay03::before,
.black-slide.animation.delay03 > *,
.black-slide_wrap.animation.delay03 > * {
  animation-delay: 0.3s !important;
}
.black-slide.animation.delay04::after,
.black-slide_wrap.animation.delay04::after,
.black-slide.both.animation.delay04::before,
.black-slide_wrap.animation.delay04::before,
.black-slide.animation.delay04 > *,
.black-slide_wrap.animation.delay04 > * {
  animation-delay: 0.4s !important;
}
.black-slide.animation.delay05::after,
.black-slide_wrap.animation.delay05::after,
.black-slide.both.animation.delay05::before,
.black-slide_wrap.animation.delay05::before,
.black-slide.animation.delay05 > *,
.black-slide_wrap.animation.delay05 > * {
  animation-delay: 0.5s !important;
}
.black-slide.animation.delay06::after,
.black-slide_wrap.animation.delay06::after,
.black-slide.both.animation.delay06::before,
.black-slide_wrap.animation.delay06::before,
.black-slide.animation.delay06 > *,
.black-slide_wrap.animation.delay06 > * {
  animation-delay: 0.6s !important;
}
.black-slide.animation.delay07::after,
.black-slide_wrap.animation.delay07::after,
.black-slide.both.animation.delay07::before,
.black-slide_wrap.animation.delay07::before,
.black-slide.animation.delay07 > *,
.black-slide_wrap.animation.delay07 > * {
  animation-delay: 0.7s !important;
}
.black-slide.animation.delay08::after,
.black-slide_wrap.animation.delay08::after,
.black-slide.both.animation.delay08::before,
.black-slide_wrap.animation.delay08::before,
.black-slide.animation.delay08 > *,
.black-slide_wrap.animation.delay08 > * {
  animation-delay: 0.8s !important;
}
.black-slide.animation.delay09::after,
.black-slide_wrap.animation.delay09::after,
.black-slide.both.animation.delay09::before,
.black-slide_wrap.animation.delay09::before,
.black-slide.animation.delay09 > *,
.black-slide_wrap.animation.delay09 > * {
  animation-delay: 0.9s !important;
}
.black-slide.animation.delay10::after,
.black-slide_wrap.animation.delay10::after,
.black-slide.both.animation.delay10::before,
.black-slide_wrap.animation.delay10::before,
.black-slide.animation.delay10 > *,
.black-slide_wrap.animation.delay10 > * {
  animation-delay: 1s !important;
}
.black-slide.animation.delay11::after,
.black-slide_wrap.animation.delay11::after,
.black-slide.both.animation.delay11::before,
.black-slide_wrap.animation.delay11::before,
.black-slide.animation.delay11 > *,
.black-slide_wrap.animation.delay11 > * {
  animation-delay: 1.1s !important;
}
.black-slide.animation.delay12::after,
.black-slide_wrap.animation.delay12::after,
.black-slide.both.animation.delay12::before,
.black-slide_wrap.animation.delay12::before,
.black-slide.animation.delay12 > *,
.black-slide_wrap.animation.delay12 > * {
  animation-delay: 1.2s !important;
}
.black-slide.animation.delay13::after,
.black-slide_wrap.animation.delay13::after,
.black-slide.both.animation.delay13::before,
.black-slide_wrap.animation.delay13::before,
.black-slide.animation.delay13 > *,
.black-slide_wrap.animation.delay13 > * {
  animation-delay: 1.3s !important;
}
.black-slide.animation.delay14::after,
.black-slide_wrap.animation.delay14::after,
.black-slide.both.animation.delay14::before,
.black-slide_wrap.animation.delay14::before,
.black-slide.animation.delay14 > *,
.black-slide_wrap.animation.delay14 > * {
  animation-delay: 1.4s !important;
}
.black-slide.animation.delay15::after,
.black-slide_wrap.animation.delay15::after,
.black-slide.both.animation.delay15::before,
.black-slide_wrap.animation.delay15::before,
.black-slide.animation.delay15 > *,
.black-slide_wrap.animation.delay15 > * {
  animation-delay: 1.5s !important;
}
.black-slide.animation.delay16::after,
.black-slide_wrap.animation.delay16::after,
.black-slide.both.animation.delay16::before,
.black-slide_wrap.animation.delay16::before,
.black-slide.animation.delay16 > *,
.black-slide_wrap.animation.delay16 > * {
  animation-delay: 1.6s !important;
}
.black-slide.animation.delay17::after,
.black-slide_wrap.animation.delay17::after,
.black-slide.both.animation.delay17::before,
.black-slide_wrap.animation.delay17::before,
.black-slide.animation.delay17 > *,
.black-slide_wrap.animation.delay17 > * {
  animation-delay: 1.7s !important;
}
.black-slide.animation.delay18::after,
.black-slide_wrap.animation.delay18::after,
.black-slide.both.animation.delay18::before,
.black-slide_wrap.animation.delay18::before,
.black-slide.animation.delay18 > *,
.black-slide_wrap.animation.delay18 > * {
  animation-delay: 1.8s !important;
}
.black-slide.animation.delay19::after,
.black-slide_wrap.animation.delay19::after,
.black-slide.both.animation.delay19::before,
.black-slide_wrap.animation.delay19::before,
.black-slide.animation.delay19 > *,
.black-slide_wrap.animation.delay19 > * {
  animation-delay: 1.9s !important;
}
.black-slide.animation.delay20::after,
.black-slide_wrap.animation.delay20::after,
.black-slide.both.animation.delay20::before,
.black-slide_wrap.animation.delay20::before,
.black-slide.animation.delay20 > *,
.black-slide_wrap.animation.delay20 > * {
  animation-delay: 2s !important;
}
.black-slide.animation.delay21::after,
.black-slide_wrap.animation.delay21::after,
.black-slide.both.animation.delay21::before,
.black-slide_wrap.animation.delay21::before,
.black-slide.animation.delay21 > *,
.black-slide_wrap.animation.delay21 > * {
  animation-delay: 2.1s !important;
}
.black-slide.animation.delay22::after,
.black-slide_wrap.animation.delay22::after,
.black-slide.both.animation.delay22::before,
.black-slide_wrap.animation.delay22::before,
.black-slide.animation.delay22 > *,
.black-slide_wrap.animation.delay22 > * {
  animation-delay: 2.2s !important;
}
.black-slide.animation.delay23::after,
.black-slide_wrap.animation.delay23::after,
.black-slide.both.animation.delay23::before,
.black-slide_wrap.animation.delay23::before,
.black-slide.animation.delay23 > *,
.black-slide_wrap.animation.delay23 > * {
  animation-delay: 2.3s !important;
}
.black-slide.animation.delay24::after,
.black-slide_wrap.animation.delay24::after,
.black-slide.both.animation.delay24::before,
.black-slide_wrap.animation.delay24::before,
.black-slide.animation.delay24 > *,
.black-slide_wrap.animation.delay24 > * {
  animation-delay: 2.4s !important;
}
.black-slide.animation.delay25::after,
.black-slide_wrap.animation.delay25::after,
.black-slide.both.animation.delay25::before,
.black-slide_wrap.animation.delay25::before,
.black-slide.animation.delay25 > *,
.black-slide_wrap.animation.delay25 > * {
  animation-delay: 2.5s !important;
}
.black-slide.animation.delay26::after,
.black-slide_wrap.animation.delay26::after,
.black-slide.both.animation.delay26::before,
.black-slide_wrap.animation.delay26::before,
.black-slide.animation.delay26 > *,
.black-slide_wrap.animation.delay26 > * {
  animation-delay: 2.6s !important;
}
.black-slide.animation.delay27::after,
.black-slide_wrap.animation.delay27::after,
.black-slide.both.animation.delay27::before,
.black-slide_wrap.animation.delay27::before,
.black-slide.animation.delay27 > *,
.black-slide_wrap.animation.delay27 > * {
  animation-delay: 2.7s !important;
}
.black-slide.animation.delay28::after,
.black-slide_wrap.animation.delay28::after,
.black-slide.both.animation.delay28::before,
.black-slide_wrap.animation.delay28::before,
.black-slide.animation.delay28 > *,
.black-slide_wrap.animation.delay28 > * {
  animation-delay: 2.8s !important;
}
.black-slide.animation.delay29::after,
.black-slide_wrap.animation.delay29::after,
.black-slide.both.animation.delay29::before,
.black-slide_wrap.animation.delay29::before,
.black-slide.animation.delay29 > *,
.black-slide_wrap.animation.delay29 > * {
  animation-delay: 2.9s !important;
}
.black-slide.animation.delay30::after,
.black-slide_wrap.animation.delay30::after,
.black-slide.both.animation.delay30::before,
.black-slide_wrap.animation.delay30::before,
.black-slide.animation.delay30 > *,
.black-slide_wrap.animation.delay30 > * {
  animation-delay: 3s !important;
}
.black-slide.animation.delay31::after,
.black-slide_wrap.animation.delay31::after,
.black-slide.both.animation.delay31::before,
.black-slide_wrap.animation.delay31::before,
.black-slide.animation.delay31 > *,
.black-slide_wrap.animation.delay31 > * {
  animation-delay: 3.1s !important;
}
.black-slide.animation.delay32::after,
.black-slide_wrap.animation.delay32::after,
.black-slide.both.animation.delay32::before,
.black-slide_wrap.animation.delay32::before,
.black-slide.animation.delay32 > *,
.black-slide_wrap.animation.delay32 > * {
  animation-delay: 3.2s !important;
}
.black-slide.animation.delay33::after,
.black-slide_wrap.animation.delay33::after,
.black-slide.both.animation.delay33::before,
.black-slide_wrap.animation.delay33::before,
.black-slide.animation.delay33 > *,
.black-slide_wrap.animation.delay33 > * {
  animation-delay: 3.3s !important;
}
.black-slide.animation.delay34::after,
.black-slide_wrap.animation.delay34::after,
.black-slide.both.animation.delay34::before,
.black-slide_wrap.animation.delay34::before,
.black-slide.animation.delay34 > *,
.black-slide_wrap.animation.delay34 > * {
  animation-delay: 3.4s !important;
}
.black-slide.animation.delay35::after,
.black-slide_wrap.animation.delay35::after,
.black-slide.both.animation.delay35::before,
.black-slide_wrap.animation.delay35::before,
.black-slide.animation.delay35 > *,
.black-slide_wrap.animation.delay35 > * {
  animation-delay: 3.5s !important;
}
.black-slide.animation.delay36::after,
.black-slide_wrap.animation.delay36::after,
.black-slide.both.animation.delay36::before,
.black-slide_wrap.animation.delay36::before,
.black-slide.animation.delay36 > *,
.black-slide_wrap.animation.delay36 > * {
  animation-delay: 3.6s !important;
}
.black-slide.animation.delay37::after,
.black-slide_wrap.animation.delay37::after,
.black-slide.both.animation.delay37::before,
.black-slide_wrap.animation.delay37::before,
.black-slide.animation.delay37 > *,
.black-slide_wrap.animation.delay37 > * {
  animation-delay: 3.7s !important;
}
.black-slide.animation.delay38::after,
.black-slide_wrap.animation.delay38::after,
.black-slide.both.animation.delay38::before,
.black-slide_wrap.animation.delay38::before,
.black-slide.animation.delay38 > *,
.black-slide_wrap.animation.delay38 > * {
  animation-delay: 3.8s !important;
}
.black-slide.animation.delay39::after,
.black-slide_wrap.animation.delay39::after,
.black-slide.both.animation.delay39::before,
.black-slide_wrap.animation.delay39::before,
.black-slide.animation.delay39 > *,
.black-slide_wrap.animation.delay39 > * {
  animation-delay: 3.9s !important;
}
.black-slide.animation.delay40::after,
.black-slide_wrap.animation.delay40::after,
.black-slide.both.animation.delay40::before,
.black-slide_wrap.animation.delay40::before,
.black-slide.animation.delay40 > *,
.black-slide_wrap.animation.delay40 > * {
  animation-delay: 4s !important;
}

@keyframes black_fade {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 0;
  }
  51% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}
@keyframes black-slide {
  0% {
    left: 0;
    width: 0;
  }

  50% {
    left: 0;
    width: 100%;
  }
  51% {
    left: 0;
    width: 100%;
  }
  100% {
    left: 100%;
    width: 0;
  }
}
@keyframes black-slide_reverse {
  0% {
    left: 100%;
    width: 0;
  }

  50% {
    left: 0;
    width: 100%;
  }
  51% {
    left: 0;
    width: 100%;
  }
  100% {
    left: 0;
    width: 0;
  }
}

/* =====
	clip-path
======================================================== */
.clip {
  -webkit-clip-path: inset(0 100% 0 0);
  clip-path: inset(0 100% 0 0);
  transition:
    -webkit-clip-path 1s ease-out,
    clip-path 1s ease-out;
}
.clip.fast {
  transition-duration: 0.6s;
}
.clip.late {
  transition-duration: 1.5s;
}
.clip.left {
  -webkit-clip-path: inset(0 0 0 100%);
  clip-path: inset(0 0 0 100%);
}
.clip.down {
  -webkit-clip-path: inset(0 0 100% 0);
  clip-path: inset(0 0 100% 0);
}
.clip.up {
  -webkit-clip-path: inset(100% 0 0 0);
  clip-path: inset(100% 0 0 0);
}

.clip.animation {
  -webkit-clip-path: inset(0);
  clip-path: inset(0);
}

/* =====
	回転
======================================================== */
.rotate {
  animation: 6s linear infinite rotate;
}

@keyframes rotate {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
  }
}

/* =====
	アニメーション時間差
======================================================== */
.animation.delay01 {
  animation-delay: 0.1s !important;
}
.animation.clip.delay01 {
  transition-delay: 0.1s !important;
}
.animation.delay02 {
  animation-delay: 0.2s !important;
}
.animation.clip.delay02 {
  transition-delay: 0.2s !important;
}
.animation.delay03 {
  animation-delay: 0.3s !important;
}
.animation.clip.delay03 {
  transition-delay: 0.3s !important;
}
.animation.delay04 {
  animation-delay: 0.4s !important;
}
.animation.clip.delay04 {
  transition-delay: 0.4s !important;
}
.animation.delay05 {
  animation-delay: 0.5s !important;
}
.animation.clip.delay05 {
  transition-delay: 0.5s !important;
}
.animation.delay06 {
  animation-delay: 0.6s !important;
}
.animation.clip.delay06 {
  transition-delay: 0.6s !important;
}
.animation.delay07 {
  animation-delay: 0.7s !important;
}
.animation.clip.delay07 {
  transition-delay: 0.7s !important;
}
.animation.delay08 {
  animation-delay: 0.8s !important;
}
.animation.clip.delay08 {
  transition-delay: 0.8s !important;
}
.animation.delay09 {
  animation-delay: 0.9s !important;
}
.animation.clip.delay09 {
  transition-delay: 0.9s !important;
}
.animation.delay10 {
  animation-delay: 1s !important;
}
.animation.clip.delay10 {
  transition-delay: 1s !important;
}
.animation.delay11 {
  animation-delay: 1.1s !important;
}
.animation.clip.delay11 {
  transition-delay: 1.1s !important;
}
.animation.delay12 {
  animation-delay: 1.2s !important;
}
.animation.clip.delay12 {
  transition-delay: 1.2s !important;
}
.animation.delay13 {
  animation-delay: 1.3s !important;
}
.animation.clip.delay13 {
  transition-delay: 1.3s !important;
}
.animation.delay14 {
  animation-delay: 1.4s !important;
}
.animation.clip.delay14 {
  transition-delay: 1.4s !important;
}
.animation.delay15 {
  animation-delay: 1.5s !important;
}
.animation.clip.delay15 {
  transition-delay: 1.5s !important;
}
.animation.delay16 {
  animation-delay: 1.6s !important;
}
.animation.clip.delay16 {
  transition-delay: 1.6s !important;
}
.animation.delay17 {
  animation-delay: 1.7s !important;
}
.animation.clip.delay17 {
  transition-delay: 1.7s !important;
}
.animation.delay18 {
  animation-delay: 1.8s !important;
}
.animation.clip.delay18 {
  transition-delay: 1.8s !important;
}
.animation.delay19 {
  animation-delay: 1.9s !important;
}
.animation.clip.delay19 {
  transition-delay: 1.9s !important;
}
.animation.delay20 {
  animation-delay: 2s !important;
}
.animation.clip.delay20 {
  transition-delay: 2s !important;
}
.animation.delay21 {
  animation-delay: 2.1s !important;
}
.animation.clip.delay21 {
  transition-delay: 2.1s !important;
}
.animation.delay22 {
  animation-delay: 2.2s !important;
}
.animation.clip.delay22 {
  transition-delay: 2.2s !important;
}
.animation.delay23 {
  animation-delay: 2.3s !important;
}
.animation.clip.delay23 {
  transition-delay: 2.3s !important;
}
.animation.delay24 {
  animation-delay: 2.4s !important;
}
.animation.clip.delay24 {
  transition-delay: 2.4s !important;
}
.animation.delay25 {
  animation-delay: 2.5s !important;
}
.animation.clip.delay25 {
  transition-delay: 2.5s !important;
}
.animation.delay26 {
  animation-delay: 2.6s !important;
}
.animation.clip.delay26 {
  transition-delay: 2.6s !important;
}
.animation.delay27 {
  animation-delay: 2.7s !important;
}
.animation.clip.delay27 {
  transition-delay: 2.7s !important;
}
.animation.delay28 {
  animation-delay: 2.8s !important;
}
.animation.clip.delay28 {
  transition-delay: 2.8s !important;
}
.animation.delay29 {
  animation-delay: 2.9s !important;
}
.animation.clip.delay29 {
  transition-delay: 2.9s !important;
}
.animation.delay30 {
  animation-delay: 3s !important;
}
.animation.clip.delay30 {
  transition-delay: 3s !important;
}
.animation.delay31 {
  animation-delay: 3.1s !important;
}
.animation.clip.delay31 {
  transition-delay: 3.1s !important;
}
.animation.delay32 {
  animation-delay: 3.2s !important;
}
.animation.clip.delay32 {
  transition-delay: 3.2s !important;
}
.animation.delay33 {
  animation-delay: 3.3s !important;
}
.animation.clip.delay33 {
  transition-delay: 3.3s !important;
}
.animation.delay34 {
  animation-delay: 3.4s !important;
}
.animation.clip.delay34 {
  transition-delay: 3.4s !important;
}
.animation.delay35 {
  animation-delay: 3.5s !important;
}
.animation.clip.delay35 {
  transition-delay: 3.5s !important;
}
.animation.delay36 {
  animation-delay: 3.6s !important;
}
.animation.clip.delay36 {
  transition-delay: 3.6s !important;
}
.animation.delay37 {
  animation-delay: 3.7s !important;
}
.animation.clip.delay37 {
  transition-delay: 3.7s !important;
}
.animation.delay38 {
  animation-delay: 3.8s !important;
}
.animation.clip.delay38 {
  transition-delay: 3.8s !important;
}
.animation.delay39 {
  animation-delay: 3.9s !important;
}
.animation.clip.delay39 {
  transition-delay: 3.9s !important;
}
.animation.delay40 {
  animation-delay: 4s !important;
}
.animation.clip.delay40 {
  transition-delay: 4s !important;
}

.animation.duration06 {
  animation-duration: 0.6s;
}
.animation.duration10 {
  animation-duration: 1s;
}

/* animation-delay PCだけ */
@media screen and (max-width: 768px) {
  .animation.delay_pc {
    animation-delay: 0s !important;
  }
  .animation.clip.delay_pc {
    transition-delay: 0s !important;
  }

  .animation.delay01sp {
    animation-delay: 0.1s !important;
  }
  .animation.clip.delay01sp {
    transition-delay: 0.1s !important;
  }
  .animation.delay02sp {
    animation-delay: 0.2s !important;
  }
  .animation.clip.delay02sp {
    transition-delay: 0.2s !important;
  }
  .animation.delay03sp {
    animation-delay: 0.3s !important;
  }
  .animation.clip.delay03sp {
    transition-delay: 0.3s !important;
  }
  .animation.delay04sp {
    animation-delay: 0.4s !important;
  }
  .animation.clip.delay04sp {
    transition-delay: 0.4s !important;
  }
  .animation.delay05sp {
    animation-delay: 0.5s !important;
  }
  .animation.clip.delay05sp {
    transition-delay: 0.5s !important;
  }
  .animation.delay06sp {
    animation-delay: 0.6s !important;
  }
  .animation.clip.delay06sp {
    transition-delay: 0.6s !important;
  }
  .animation.delay07sp {
    animation-delay: 0.7s !important;
  }
  .animation.clip.delay07sp {
    transition-delay: 0.7s !important;
  }
  .animation.delay08sp {
    animation-delay: 0.8s !important;
  }
  .animation.clip.delay08sp {
    transition-delay: 0.8s !important;
  }
  .animation.delay09sp {
    animation-delay: 0.9s !important;
  }
  .animation.clip.delay09sp {
    transition-delay: 0.9s !important;
  }
  .animation.delay10sp {
    animation-delay: 1s !important;
  }
  .animation.clip.delay10sp {
    transition-delay: 1s !important;
  }
  .animation.delay11sp {
    animation-delay: 1.1s !important;
  }
  .animation.clip.delay11sp {
    transition-delay: 1.1s !important;
  }
  .animation.delay12sp {
    animation-delay: 1.2s !important;
  }
  .animation.clip.delay12sp {
    transition-delay: 1.2s !important;
  }
  .animation.delay13sp {
    animation-delay: 1.3s !important;
  }
  .animation.clip.delay13sp {
    transition-delay: 1.3s !important;
  }
  .animation.delay14sp {
    animation-delay: 1.4s !important;
  }
  .animation.clip.delay14sp {
    transition-delay: 1.4s !important;
  }
  .animation.delay15sp {
    animation-delay: 1.5s !important;
  }
  .animation.clip.delay15sp {
    transition-delay: 1.5s !important;
  }
  .animation.delay16sp {
    animation-delay: 1.6s !important;
  }
  .animation.clip.delay16sp {
    transition-delay: 1.6s !important;
  }
  .animation.delay17sp {
    animation-delay: 1.7s !important;
  }
  .animation.clip.delay17sp {
    transition-delay: 1.7s !important;
  }
  .animation.delay18sp {
    animation-delay: 1.8s !important;
  }
  .animation.clip.delay18sp {
    transition-delay: 1.8s !important;
  }
  .animation.delay19sp {
    animation-delay: 1.9s !important;
  }
  .animation.clip.delay19sp {
    transition-delay: 1.9s !important;
  }
  .animation.delay20sp {
    animation-delay: 2s !important;
  }
  .animation.clip.delay20sp {
    transition-delay: 2s !important;
  }
  .animation.delay21sp {
    animation-delay: 2.1s !important;
  }
  .animation.clip.delay21sp {
    transition-delay: 2.1s !important;
  }
  .animation.delay22sp {
    animation-delay: 2.2s !important;
  }
  .animation.clip.delay22sp {
    transition-delay: 2.2s !important;
  }
  .animation.delay23sp {
    animation-delay: 2.3s !important;
  }
  .animation.clip.delay23sp {
    transition-delay: 2.3s !important;
  }
  .animation.delay24sp {
    animation-delay: 2.4s !important;
  }
  .animation.clip.delay24sp {
    transition-delay: 2.4s !important;
  }
  .animation.delay25sp {
    animation-delay: 2.5s !important;
  }
  .animation.clip.delay25sp {
    transition-delay: 2.5s !important;
  }
  .animation.delay26sp {
    animation-delay: 2.6s !important;
  }
  .animation.clip.delay26sp {
    transition-delay: 2.6s !important;
  }
  .animation.delay27sp {
    animation-delay: 2.7s !important;
  }
  .animation.clip.delay27sp {
    transition-delay: 2.7s !important;
  }
  .animation.delay28sp {
    animation-delay: 2.8s !important;
  }
  .animation.clip.delay28sp {
    transition-delay: 2.8s !important;
  }
  .animation.delay29sp {
    animation-delay: 2.9s !important;
  }
  .animation.clip.delay29sp {
    transition-delay: 2.9s !important;
  }
  .animation.delay30sp {
    animation-delay: 3s !important;
  }
  .animation.clip.delay30sp {
    transition-delay: 3s !important;
  }
  .animation.delay31sp {
    animation-delay: 3.1s !important;
  }
  .animation.clip.delay31sp {
    transition-delay: 3.1s !important;
  }
  .animation.delay32sp {
    animation-delay: 3.2s !important;
  }
  .animation.clip.delay32sp {
    transition-delay: 3.2s !important;
  }
  .animation.delay33sp {
    animation-delay: 3.3s !important;
  }
  .animation.clip.delay33sp {
    transition-delay: 3.3s !important;
  }
  .animation.delay34sp {
    animation-delay: 3.4s !important;
  }
  .animation.clip.delay34sp {
    transition-delay: 3.4s !important;
  }
  .animation.delay35sp {
    animation-delay: 3.5s !important;
  }
  .animation.clip.delay35sp {
    transition-delay: 3.5s !important;
  }
  .animation.delay36sp {
    animation-delay: 3.6s !important;
  }
  .animation.clip.delay36sp {
    transition-delay: 3.6s !important;
  }
  .animation.delay37sp {
    animation-delay: 3.7s !important;
  }
  .animation.clip.delay37sp {
    transition-delay: 3.7s !important;
  }
  .animation.delay38sp {
    animation-delay: 3.8s !important;
  }
  .animation.clip.delay38sp {
    transition-delay: 3.8s !important;
  }
  .animation.delay39sp {
    animation-delay: 3.9s !important;
  }
  .animation.clip.delay39sp {
    transition-delay: 3.9s !important;
  }
  .animation.delay40sp {
    animation-delay: 4s !important;
  }
  .animation.clip.delay40sp {
    transition-delay: 4s !important;
  }
}

/************************************************************************
	クッキー
**************************************************************************/
#cookie-notice {
  font-size: 1.8rem;
  z-index: 999;
}
#cookie-notice .cn-button {
  color: #1a1a1a;
  background: #00ff00;
  border-radius: 0.6rem;
  line-height: 1;
  padding: 1rem 1.5rem;
}
.cn-close-icon {
  opacity: 1;
}
.cn-close-icon:before,
.cn-close-icon:after {
  background: #fff;
}
@media screen and (max-width: 768px) {
  .page_content {
    padding: 6rem 0;
  }
  .c_section {
    padding: 4rem 0;
  }
  #cookie-notice {
    font-size: 1.4rem;
  }
}

/************************************************************************
	ローダー
**************************************************************************/
#loader {
  --loader_time: 3600ms; /* JS showLoaderWithDelay(); で更新 */
  --loader_logo_time: calc(var(--loader_time) / 10);
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  align-items: center;
  background-color: #f3f6f7;
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 999;
}

#loader .logo_wrapper {
  max-width: 17rem;
  width: 60%;
  margin: auto;
  position: relative;
}

#loader .logo_box {
  margin-bottom: 2rem;
  position: relative;
}
#loader .logo_box img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  opacity: 0;
  position: absolute;
  left: 0;
  top: 0;
  animation: loader_logo var(--loader_logo_time) ease-in both;
}
#loader .logo_box img:nth-of-type(1) {
  height: auto;
  position: static;
  animation-duration: calc(var(--loader_logo_time) * 1);
  animation-delay: calc(var(--loader_logo_time) * 1);
}
#loader .logo_box img:nth-of-type(2) {
  animation-delay: calc(var(--loader_logo_time) * 2);
}
#loader .logo_box img:nth-of-type(3) {
  animation-delay: calc(var(--loader_logo_time) * 3);
}
#loader .logo_box img:nth-of-type(4) {
  animation-delay: calc(var(--loader_logo_time) * 4);
}
#loader .logo_box img:nth-of-type(5) {
  animation-delay: calc(var(--loader_logo_time) * 5);
}
#loader .logo_box img:nth-of-type(6) {
  animation-duration: calc(var(--loader_logo_time) * 2);
  animation-delay: calc(var(--loader_logo_time) * 6);
}
#loader .logo_box img:nth-of-type(7) {
  animation-duration: calc(var(--loader_logo_time) * 2);
  animation-delay: calc(var(--loader_logo_time) * 8);
}
#loader .logo_box img:nth-of-type(8) {
  animation: loader_logo_last var(--loader_logo_time) ease-in
    calc(var(--loader_logo_time) * 10) both;
}

@keyframes loader_logo {
  0% {
    opacity: 0;
  }
  .001% {
    opacity: 1;
  }
  99.999% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes loader_logo_last {
  0% {
    opacity: 0;
  }
  .1% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}

#loader_count {
  font-family: "Akshar", sans-serif;
  font-size: 3rem;
  font-weight: 300;
  color: #505050;
  text-align: center;
}
@media (max-width: 768px) {
  #loader .logo_wrapper {
    max-width: 14rem;
  }
  #loader_count {
    font-size: 2rem;
  }
}

/************************************************************************
	ページ全体
**************************************************************************/
body {
  overflow: hidden auto;
}
.hidden,
.not_scroll {
  overflow: hidden;
}
body.hmb_open,
body.modal_open {
  overflow: hidden !important;
}

main {
  overflow: hidden;
}

@media screen and (max-width: 768px) {
}

@media screen and (min-width: 769px) {
  body.hmb_open {
    overflow: visible !important;
  }
  body.hmb_open.modal_open {
    overflow: hidden !important;
  }
}

/* =====
	固定お問い合わせ
======================================================== */
#fix_contact_btn_area {
  pointer-events: none;
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: end;
  justify-content: flex-end;
  width: 96%;
  max-width: 180rem;
  margin-inline: auto;
  position: fixed;
  bottom: 2rem;
  left: 0;
  right: 0;
  z-index: 10;
}
#fix_contact_btn {
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  display: -webkit-box;
  display: flex;
  border-radius: 0.8rem;
  box-shadow: var(--shadow_primary);
  transition:
    opacity 0.4s,
    visibility 0.4s;
}
.mv_complete #fix_contact_btn,
.lower + #fix_contact_btn_area #fix_contact_btn {
  pointer-events: all;
  opacity: 1;
  visibility: visible;
}
.arrive_ft #fix_contact_btn {
  pointer-events: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
}

#fix_contact_btn .icon_wrapper {
  width: 5.8rem;
  border-radius: 0.8rem 0 0 0.8rem;
  background-color: var(--blue);
  position: relative;
}
#fix_contact_btn .icon_wrapper::after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background: url(../img/cmn/fix_contact_icon.svg) no-repeat center/60%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 2;
}

#fix_contact_btn .text_wrapper {
  font-weight: 500;
  line-height: 1;
  padding: 0.85em 3.5em 1em 1em;
  background-color: #fff;
  border-radius: 0 0.8rem 0.8rem 0;
  position: relative;
  overflow: hidden;
}

#fix_contact_btn .text_wrapper::before {
  content: "";
  display: block;
  width: 0;
  height: 100%;
  background-color: var(--blue);
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
  transition: width 0.4s;
}
#fix_contact_btn:hover .text_wrapper::before {
  width: 100%;
}

#fix_contact_btn .text_wrapper::after {
  content: "";
  display: block;
  width: 2.2em;
  height: 2.2em;
  border-radius: 50%;
  border: 2px solid #fff;
  background: var(--blue) url(../img/cmn/arrow01_wh.svg) no-repeat center/60%;
  position: absolute;
  right: 0.6em;
  top: calc(50% - 1.1em);
  z-index: 2;
}

#fix_contact_btn .text_wrapper .sub {
  font-size: 0.9rem;
  letter-spacing: 0.24em;
  text-transform: capitalize;
  margin-bottom: 0.5em;
  position: relative;
  z-index: 2;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  text-fill-color: transparent;
  background-image: linear-gradient(
    90deg,
    #fff 50%,
    var(--thin_font-color) 50%
  );
  background-position-x: 100%;
  background-size: 200%;
  transition: background-position-x 0.2s 0.1s;
}
#fix_contact_btn:hover .text_wrapper .sub {
  background-position-x: 0;
  transition: background-position-x 0.2s 0.02s;
}
#fix_contact_btn .text_wrapper .main {
  letter-spacing: 0.05em;
  position: relative;
  z-index: 2;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  text-fill-color: transparent;
  background-image: linear-gradient(
    90deg,
    #fff 50%,
    var(--thin_font-color) 50%
  );
  background-position-x: 100%;
  background-size: 200%;
  transition: background-position-x 0.2s 0.1s;
}
#fix_contact_btn:hover .text_wrapper .main {
  background-position-x: 0;
  transition: background-position-x 0.2s 0.02s;
}

@media screen and (max-width: 768px) {
  #fix_contact_btn_area {
    width: 90%;
    bottom: 2.5rem;
  }
  #fix_contact_btn {
    border-radius: 0.5rem;
  }

  #fix_contact_btn .icon_wrapper {
    width: 4.7rem;
    border-radius: 0.5rem 0 0 0.5rem;
  }

  #fix_contact_btn .text_wrapper {
    padding: 0.9em 3.5em 0.9em 1em;
    border-radius: 0 0.5rem 0.5rem 0;
  }

  #fix_contact_btn .text_wrapper .sub {
    font-size: 0.8rem;
  }
  #fix_contact_btn .text_wrapper .main {
    font-size: 1.3rem;
  }
}

/* ---

-------------------------------------------------------- */

@media screen and (max-width: 768px) {
}

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

@media screen and (max-width: 768px) {
}

/* ---

-------------------------------------------------------- */

@media screen and (max-width: 768px) {
}

/************************************************************************
	ヘッダー
**************************************************************************/
header {
  width: 93.75%;
  max-width: 160rem;
  padding: 1.4rem 1.5%;
  margin-inline: auto;
  background-color: #fff;
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
  position: fixed;
  top: 2rem;
  left: 0;
  right: 0;
  z-index: 50;
  transition: background-color 0.4s;
}
.hmb_open header {
  background-color: rgba(255, 255, 255, 0.4);
}

header .hd_logo {
  flex-shrink: 0;
  width: 14rem;
  margin-right: auto;
}
header .hd_logo a {
  display: block;
}
header .hd_logo a:hover {
  opacity: 0.7;
}
header .hd_logo a img {
  vertical-align: middle;
}

@media screen and (max-width: 768px) {
  header {
    width: 90%;
    padding: 0.8rem 0;
  }

  header .hd_logo {
    width: 10.5rem;
    margin-left: 5%;
  }
}

/* =====
	ナビ
======================================================== */
#hd_nav {
  --current_width: 0;
  --current_left: 0;
  --prev_width: 0;
  --prev_left: 0;
  -webkit-box-flex: 1;
  flex-grow: 1;
  font-family: var(--en);
  font-size: 1.4rem;
  font-weight: 700;
  color: var(--blue02);
  line-height: 1;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-right: -0.5em;
  position: relative;
}
#hd_nav::before {
  pointer-events: none;
  content: "";
  display: block;
  width: var(--prev_width); /* JSで書き換え */
  height: 2px;
  background-color: var(--blue02);
  position: absolute;
  bottom: 0.25em;
  left: var(--prev_left); /* JSで書き換え */
}
.has_prev_nav #hd_nav::before {
  animation: hd_nav_line 0.5s ease-in-out 0.4s forwards;
}

@keyframes hd_nav_line {
  0% {
    width: var(--prev_width);
    left: var(--prev_left);
  }
  60% {
    width: calc(var(--prev_width) / 1.5);
  }
  100% {
    width: var(--current_width);
    left: var(--current_left);
  }
}

#hd_nav > ul > li {
  margin-left: 0.35em;
}
#hd_nav > ul > li a {
  display: block;
  padding: 0.8em 0.5em;
}
#hd_nav > ul > li a > p {
  overflow: hidden;
}
#hd_nav > ul > li a > p > span {
  display: inline-block;
}
#hd_nav > ul > li a:hover > p > span {
  animation: nav_roll 0.3s linear;
}
@keyframes nav_roll {
  0% {
    opacity: 1;
    transform: translateY(0);
  }
  49% {
    opacity: 1;
    transform: translateY(-120%);
  }
  49.5% {
    opacity: 0;
  }
  50.5% {
    opacity: 0;
    transform: translateY(120%);
  }
  51% {
    opacity: 1;
  }
  100% {
    transform: translateY(0);
  }
}

@media screen and (max-width: 1024px) {
  #hd_nav > ul > li {
    margin-left: 0.2em;
  }
}

@media screen and (max-width: 768px) {
  #hd_nav {
    display: none;
  }
}

/* =====
	ハンバーガー
======================================================== */
#hmb {
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  flex-direction: column;
  -webkit-box-pack: center;
  justify-content: center;
  width: 4.4rem;
  height: 3.2rem;
  padding: 0;
  margin-right: 2%;
  background-color: transparent;
}

.hmb_bar {
  display: block;
  width: 50%;
  height: 50%;
  margin: auto;
  position: relative;
  transition: 0.4s;
}

.hmb_bar span {
  display: inline-block;
  width: 100%;
  height: 2px;
  background-color: var(--green);
  position: absolute;
  right: 0;
  transition: 0.4s;
}
.hmb_bar span::after {
  content: "";
  display: block;
  width: 100%;
  height: 2px;
  background-color: var(--green);
  position: absolute;
  right: 0;
  top: 0;
  transform: rotate(-18deg);
  transform-origin: right top;
  transition: transform 0.2s;
}
.hmb_bar span:nth-last-of-type(1)::after {
  display: none;
}

.hmb_open .hmb_bar span::after {
  display: none;
}

.hmb_bar span:nth-of-type(1) {
  top: 0;
}
.hmb_bar span:nth-of-type(2) {
  top: calc(50% - 1px);
}
.hmb_bar span:nth-of-type(3) {
  bottom: 0;
}

.hmb_open .hmb_bar span:nth-of-type(1) {
  top: 44%;
  transform: rotate(-24deg);
}
.hmb_open .hmb_bar span:nth-of-type(2) {
  opacity: 0;
}
.hmb_open .hmb_bar span:nth-of-type(3) {
  width: 100%;
  bottom: 44%;
  transform: rotate(24deg);
}

@media screen and (min-width: 769px) {
  #hmb {
    display: none;
  }
}

/************************************************************************
	グローバル
**************************************************************************/
#gl_close_area {
  pointer-events: none;
  cursor: pointer;
  width: 100%;
  height: 100vh;
  background-color: #f3f6f7;
  opacity: 0;
  position: fixed;
  top: -50vh;
  left: 0;
  z-index: 40;
  transition:
    opacity 0.4s,
    top 0.4s;
}
.hmb_open #gl_close_area {
  pointer-events: all;
  opacity: 0.8;
  top: 0;
}

#global {
  --sb-track-color: transparent;
  --sb-thumb-color: #d9d9d9;
  --sb-size: 6px;
  --sb-border-radius: 3px;

  overflow: auto;
  display: none;
  max-height: calc(100vh - 9rem);
  padding: 4rem 6%;
}
#global::-webkit-scrollbar {
  width: var(--sb-size);
}

#global::-webkit-scrollbar-track {
  background: var(--sb-track-color);
  border-radius: var(--sb-border-radius);
}

#global::-webkit-scrollbar-thumb {
  background: var(--sb-thumb-color);
  border-radius: var(--sb-border-radius);
}

@supports not selector(::-webkit-scrollbar) {
  #global {
    scrollbar-color: var(--sb-thumb-color) var(--sb-track-color);
  }
}

#global .wrapper .inner {
  max-width: 23.5rem;
  width: 92%;
  margin-inline: auto;
}

#global .top_wrapper {
  padding-bottom: 5rem;
  border-bottom: 1px solid rgba(0, 0, 255, 0.15);
}

#gl_nav {
  font-size: 1.4rem;
  font-weight: 700;
  color: var(--blue02);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-bottom: 2.5em;
}
#gl_nav .parent_list > li {
  margin-bottom: 1.25em;
}
#gl_nav .parent_list > li:nth-last-of-type(1) {
  margin-bottom: 0;
}

#gl_nav .parent_list > li > a,
#gl_nav .parent_list > li > .acc_trigger {
  display: block;
  font-family: var(--en);
  padding: 0.75em 0;
  position: relative;
}

#gl_nav .parent_list > li > a:hover,
#gl_nav .parent_list > li > .acc_trigger:hover,
#gl_nav .child_list > li > a:hover {
  opacity: 0.7;
  transition: opacity 0.4s;
}

#gl_nav .parent_list > li > a.blank {
  padding-right: 1em;
}
#gl_nav .parent_list > li > a.blank::after {
  content: "";
  display: block;
  width: 1em;
  height: 1em;
  background: url(../img/cmn/blank_arrow01.svg) no-repeat center/contain;
  position: absolute;
  right: 0;
  top: calc(50% - 0.5em);
}

#gl_nav .parent_list > li > .acc_trigger {
  cursor: pointer;
  padding-right: 1em;
}
#gl_nav .parent_list > li > .acc_trigger::before,
#gl_nav .parent_list > li > .acc_trigger::after {
  content: "";
  display: block;
  width: 1em;
  height: 2px;
  background-color: currentColor;
  position: absolute;
  right: 0;
  top: calc(50% - 1px);
}
#gl_nav .parent_list > li > .acc_trigger::after {
  transform: rotate(90deg);
  transition: transform 0.4s;
}
#gl_nav .parent_list > li > .acc_trigger.acc_open::after {
  transform: rotate(0);
}

#gl_nav .child_list {
  display: none;
  padding-top: 0.25em;
}
#gl_nav .child_list > li {
  font-size: 0.9286; /* 13/14 */
}
#gl_nav .child_list > li > a {
  display: block;
  padding: 0.4em 0;
}

#gl_contact_btn {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  align-items: center;
  font-family: var(--en);
  font-weight: 700;
  color: #fff;
  line-height: 1.5;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  max-width: 23.6rem;
  width: 100%;
  padding: 0.7em 2em 0.7em 1.5em;
  border-radius: 5em;
  background-image: var(--blue_grada_w);
  background-image: var(--blue_grada);
  position: relative;
  z-index: 0;
}

#gl_contact_btn::before {
  content: "";
  display: block;
  width: calc(100% + 2px);
  height: calc(100% + 2px);
  border-radius: 5em;
  background-image: var(--light-blue_grada_w);
  background-image: var(--light-blue_grada);
  position: absolute;
  left: -1px;
  top: -1px;
  z-index: 1;
  opacity: 0;
  transition: opacity 0.4s;
}
#gl_contact_btn:hover::before {
  opacity: 1;
}

#gl_contact_btn::after {
  content: "";
  display: block;
  width: 1.8em;
  height: 1.8em;
  background: url(../img/cmn/gl_contact_arrow.svg) no-repeat center/contain;
  position: absolute;
  right: 0.75em;
  top: calc(50% - 0.9em);
  z-index: 2;
}

#gl_contact_btn > p {
  position: relative;
  z-index: 2;
}

#global .bottom_wrapper {
  padding-top: 3rem;
}

#global .sub_nav {
  font-size: 1.3rem;
  letter-spacing: 0.1em;
  color: var(--blue02);
}

#global .sub_nav > li a {
  display: block;
  padding: 0.5em 0;
}
#global .sub_nav > li a:hover {
  opacity: 0.7;
}

#global .sub_nav > li a.blank {
  position: relative;
  padding-right: 1em;
}
#global .sub_nav > li a.blank::after {
  content: "";
  display: block;
  width: 0.9em;
  height: 0.9em;
  background: url(../img/cmn/blank_arrow01thin.svg) no-repeat center/contain;
  position: absolute;
  right: 0;
  top: calc(50% - 0.45em);
}

@media screen and (min-width: 769px) {
  #global {
    display: none !important;
  }
}

/************************************************************************
	フッター
**************************************************************************/
footer {
  color: #fff;
  background-image: -webkit-linear-gradient(90deg, #00b3ab 0%, #006a7f 89.25%);
  background-image: linear-gradient(180deg, #00b3ab 0%, #006a7f 89.25%);
  position: relative;
  z-index: 1;
}

footer .inner {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 27.2rem min(42rem, calc(89% - 27.2rem));
  grid-template-columns: 27.2rem min(42rem, calc(89% - 27.2rem));
  grid-column-gap: 11%;
  grid-row-gap: 3rem;
  width: 93.75%;
  max-width: 160rem;
  padding: 4rem 0 2.5rem;
  margin-inline: auto;
  position: relative;
}

.ft_logo {
  display: block;
  -ms-grid-column: 1;
  -ms-grid-column-span: 1;
  grid-column: 1/ 2;
  -ms-grid-row: 1;
  -ms-grid-row-span: 2;
  grid-row: 1/ 3;
  max-width: 10rem;
}
.ft_logo img {
  width: 100%;
}

#ft_nav {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: justify;
  justify-content: space-between;
  -ms-grid-column: 2;
  -ms-grid-column-span: 1;
  grid-column: 2/ 3;
  -ms-grid-row: 2;
  -ms-grid-row-span: 2;
  grid-row: 2/ 4;
  font-size: 1.4rem;
  line-height: 1.5;
  letter-spacing: 0.1em;
}

#ft_nav > ul {
  flex-shrink: 0;
}

#ft_nav > ul > li {
  margin-bottom: 0.1em;
}
#ft_nav > ul > li.en {
  font-weight: 500;
  text-transform: uppercase;
}

#ft_nav > ul > li a {
  display: block;
  padding: 0.5em 0;
}

.ft_address {
  padding-top: 2em;
  -ms-grid-column: 1;
  -ms-grid-column-span: 1;
  grid-column: 1/ 2;
  -ms-grid-row: 4;
  -ms-grid-row-span: 1;
  grid-row: 4/ 5;
  font-size: 1.2rem;
  line-height: 1.5;
  letter-spacing: 0.1em;
  position: relative;
}
.ft_address .list {
  margin-bottom: 0.8em;
}
.ft_address .list > li {
  margin-bottom: 0.55em;
}
.ft_address .list > li:nth-last-of-type(1) {
  margin-bottom: 0;
}
.ft_address .list > li.tel_li a {
  display: inline-block;
  margin-right: 0.75em;
}

footer .icon_privacy.pc {
  display: block;
  -ms-grid-column: 2;
  -ms-grid-column-span: 1;
  grid-column: 2/ 3;
  -ms-grid-row: 4;
  -ms-grid-row-span: 1;
  grid-row: 4/ 5;
  -ms-flex-item-align: end;
  align-self: flex-end;
  width: 5rem;
}
footer .icon_privacy:hover {
  opacity: 0.7;
}
footer .icon_privacy img {
  width: 100%;
}

@media screen and (max-width: 768px) {
  footer .inner {
    display: block;
    width: 90%;
    max-width: none;
    padding: 3.5rem 0 5rem;
  }

  .ft_logo {
    max-width: 6rem;
    margin-bottom: 4rem;
  }
  .ft_logo img {
    width: 100%;
  }

  #ft_nav {
    display: block;
    margin-bottom: 3em;
  }

  #ft_nav .nav01 {
    padding-bottom: 1em;
    border-bottom: 1px solid rgba(75, 204, 190, 0.5);
  }
  #ft_nav .nav02 {
    padding-top: 1.5em;
  }

  #ft_nav > ul > li a {
    padding: 0.4em 0;
  }

  .ft_address {
    padding-top: 0;
  }
  .ft_address .list {
    margin-bottom: 2em;
  }
  footer .ft_address .icon_privacy {
    width: 3rem;
    position: absolute;
    bottom: 0;
    left: 13em;
  }

  footer .icon_privacy.pc {
    display: none;
  }
}

/* =====
	ページトップへ
======================================================== */
#page_top {
  display: block;
  width: 5.4rem;
  height: 5.4rem;
  border-radius: 50%;
  border: 2px solid #fff;
  box-shadow: var(--shadow_primary);
  position: absolute;
  right: 0;
  bottom: 2rem;
  z-index: 50;
}
#page_top:hover {
  background-color: #fff;
}
#page_top::after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  -webkit-mask: url(../img/cmn/page_top_arrow.svg) no-repeat center/50%;
  mask: url(../img/cmn/page_top_arrow.svg) no-repeat center/50%;
  background-color: #fff;
  position: absolute;
  left: -1px;
  top: -1px;
  transition:
    background-color 0.4s,
    transform 0.4s;
}
#page_top:hover::after {
  background-color: var(--blue02);
  transform: rotate(-720deg);
}

@media screen and (max-width: 768px) {
  #page_top {
    width: 4rem;
    height: 4rem;
    bottom: 5rem;
  }
}

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

@media screen and (max-width: 768px) {
}

/* 
-------------------------------------------------------- */

@media screen and (max-width: 768px) {
}

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

@media screen and (max-width: 768px) {
}

/* 
-------------------------------------------------------- */

@media screen and (max-width: 768px) {
}

/************************************************************************
	TOP
**************************************************************************/
/* =====
	MV
======================================================== */
#top {
  background: url(../img/top/mv_bg.png) no-repeat center top/90%;
}

#top_mv_area {
  --disappearMs: 2000ms; /* JSで変更 */
  min-height: 50rem;
  max-height: calc(0.625 * var(--js_windowWidth));
  height: 100vh;
  position: relative;
}

.mv_container {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0;
  visibility: hidden;
}
.mv_container.active {
  opacity: 1;
  visibility: visible;
  transition-property: opacity, visibility;
  transition-duration: 1s;
}

.mv_container .inner {
  height: 100%;
  position: relative;
  z-index: 1;
}

.mv_container .text_wrapper {
  -webkit-filter: blur(0);
  -moz-filter: blur(0);
  filter: blur(0);
  opacity: 1;
  position: absolute;
  left: 0;
  z-index: 5;
  transition-property:
    opacity,
    -webkit-filter,
    -moz-filter,
    filter;
  transition-duration: 1s;
}
.mv_container.disappear .text_wrapper {
  -webkit-filter: blur(5px);
  -moz-filter: blur(5px);
  filter: blur(5px);
  opacity: 0;
}

.mv_container .text_wrapper .sub_text {
  font-family: var(--en);
  font-size: 0.9rem;
  color: var(--blue);
  letter-spacing: 0.11em;
  margin-bottom: 0.5em;
  position: relative;
}
.mv_container .text_wrapper .main_text {
  font-size: 2rem;
  font-weight: 700;
  color: var(--blue);
  line-height: 2.25; /* 45/20 */
  position: relative;
}
.mv_container .text_wrapper .sub_text,
.mv_container .text_wrapper .main_text {
  opacity: 0;
  transition: opacity 0.5s;
}
.mv_container .text_wrapper .sub_text.active,
.mv_container .text_wrapper .main_text.active {
  opacity: 1;
}

#mv01 .text_wrapper .main_text {
  font-size: 3rem;
  line-height: 1.366; /* 41/30 */
}

.mv_container .highlights {
  color: #fff;
  background: linear-gradient(var(--blue) 0 100%) no-repeat 0 0 / 0 100%;
  transition: background-size 0.4s;
}
.mv_container .highlights.active {
  background-size: 100% 100%;
}

/* .mv_container.fast .text_wrapper .char{
	opacity: 1 !important;
} */

.mv_container .svg_wrapper {
  position: absolute;
  transform: translate(-4vw, -2vw);
  transition:
    opacity 1s,
    transform 1s;
}
.mv_container.active .svg_wrapper {
  transform: translate(0, 0);
}

@media screen and (max-width: 1024px) {
  .mv_container .text_wrapper .main_text {
    font-size: 1.8rem;
    line-height: 2.5;
  }
  #mv01 .text_wrapper .main_text {
    font-size: 2.7rem;
    line-height: 1.5;
  }
}

@media screen and (max-width: 768px) {
  #top {
    background: url(../img/top/mv_bg_sp.png) no-repeat center top 25%/100%;
  }
  #top_mv_area {
    min-height: 40rem;
    max-height: calc(2.051 * var(--js_windowWidth)); /* 800/390 */
  }

  .mv_container .inner {
    width: 94%;
  }

  .mv_container .text_wrapper .sub_text {
    font-size: 0.8rem;
  }
}

/* 01
-------------------------------------------------------- */
#mv01 {
  --mvDurations: 9000ms; /* JSで変更 */
  --fastDurations: 5000ms;
}
/* テキスト */
#mv01 .text_wrapper {
  top: 53.5%;
}

@media screen and (max-width: 768px) {
  #mv01 .text_wrapper {
    top: 20.5%;
  }
}

/* イラスト */
#mv01 .svg_wrapper {
  width: 109.856rem;
  height: 52.353rem;
  top: 24.5%;
  left: 24%;
}

.path_shadow {
  opacity: 0;
  position: absolute;
  z-index: 0;
  opacity: 0;
}
.active .path_shadow {
  animation: path-shadow_in 0.4s linear calc(var(--mvDurations) * 0.75) forwards;
  /* --mvDurationsが6000msなら、delay4500ms */
}
.fast .path_shadow {
  animation-delay: calc(var(--fastDurations) * 0.75);
  /* --mvDurationsが6000msなら、delay3000ms */
}

.disappear .path_shadow {
  animation: path-shadow_out calc(var(--disappearMs) * 0.75) linear 0s forwards !important;
  /* --disappearMsが2000msなら、1500msになる */
}
.fast.disappear .path_shadow {
  animation-duration: calc(var(--disappearMs) * 0.25) !important;
}
@keyframes path-shadow_in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes path-shadow_out {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

.path_shadow img {
  width: 100%;
}

#mv01 .svg_wrapper .path_shadow {
  width: 43%;
  top: 1%;
  left: 22.2%;
}

.mv_svg {
  position: absolute;
  z-index: 1;
}
#mv01_01svg {
  width: 44.8%;
  bottom: 0;
  left: 0;
}

.mv_svg path {
  fill: none;
  stroke: #00b0a8;
  stroke-width: 2px;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dashoffset: 0;
}
.active .mv_svg path {
  animation-timing-function: linear;
  animation-fill-mode: forwards;
}

#mv01_01svg path {
  stroke-dasharray: 1066.6px;
  stroke-dashoffset: 3199.8px;
}
.active #mv01_01svg path {
  animation-name: mv01_01svg;
  animation-duration: calc(var(--mvDurations) * 0.75);
}
.fast #mv01_01svg path {
  animation-duration: calc(var(--fastDurations) * 0.75);
}
.disappear #mv01_01svg path {
  animation-name: mv01_01svg_out;
  animation-duration: var(--disappearMs);
}
.fast.disappear #mv01_01svg path {
  animation-duration: calc(var(--disappearMs) / 2);
}

@keyframes mv01_01svg {
  /* stroke-dashoffset: 1066.6px; */
  0% {
    stroke-dashoffset: 3199.8px;
  }
  50% {
    stroke-dashoffset: 2133.2px;
  }
  100% {
    stroke-dashoffset: 2133.2px;
  }
}
@keyframes mv01_01svg_out {
  0% {
    stroke-dashoffset: 2133.2px;
  }
  50% {
    stroke-dashoffset: 1066.6px;
  }
  100% {
    stroke-dashoffset: 1066.6px;
  }
}

#mv01_02svg {
  width: 71.676%;
  top: 0;
  right: 0;
}
#mv01_02svg path {
  stroke-dasharray: 1988.1px;
  stroke-dashoffset: 5964.4px;
}
.active #mv01_02svg path {
  animation-name: mv01_02svg;
  animation-duration: calc(var(--mvDurations) * 0.75);
}
.fast #mv01_02svg path {
  animation-duration: calc(var(--fastDurations) * 0.75);
}
.disappear #mv01_02svg path {
  animation-name: mv01_02svg_out;
  animation-duration: var(--disappearMs);
  animation-delay: 0s;
}
.fast.disappear #mv01_02svg path {
  animation-duration: calc(var(--disappearMs) / 2);
}

@keyframes mv01_02svg {
  /* stroke-dashoffset: 1988.1px; */
  0% {
    stroke-dashoffset: 5964.4px; /* 単純に（1988.1px * 3)だと点が表示されたので.1px伸ばした */
  }
  50% {
    stroke-dashoffset: 5964.4px;
  }
  100% {
    stroke-dashoffset: 3976.2px;
  }
}
@keyframes mv01_02svg_out {
  0% {
    stroke-dashoffset: 3976.2px;
  }
  50% {
    stroke-dashoffset: 3976.2px;
  }
  100% {
    stroke-dashoffset: 1988.1px;
  }
}

@media screen and (max-width: 1024px) {
  /* イラスト */
  #mv01 .svg_wrapper {
    width: 87.885rem;
    height: 41.882rem;
    top: 22%;
    left: 28%;
  }
}

@media screen and (max-width: 768px) {
  #mv01 .svg_wrapper {
    width: 91rem;
    height: 43.367rem;
    top: 41%;
    left: -11rem;
  }
}

/* 02
-------------------------------------------------------- */
#mv02 {
  --mvDurations: 15000ms; /* JSで変更 */
  --fastDurations: 2000ms; /* JSで変更 */
}
/* テキスト */
#mv02 .text_wrapper {
  top: 46%;
}

#mv02 .text_wrapper .main_text01 {
  white-space: nowrap;
  position: absolute;
  left: 0;
  top: 0;
}

@media screen and (max-width: 768px) {
  #mv02 .text_wrapper {
    top: 19.5%;
  }
}

/* イラスト */
#mv02 .svg_wrapper {
  width: 137.29rem;
  height: 38.941rem;
  top: 28%;
  left: -17%;
}

#mv02 .svg_wrapper .path_shadow {
  width: 42.8%;
  bottom: -1%;
  right: 10%;
  transform: rotate(-2deg);
}

#mv02_01svg {
  width: 66.25%;
  bottom: 0;
  left: 0;
}

#mv02_01svg path {
  stroke-dasharray: 1035.2px;
  stroke-dashoffset: 3105.6px;
}
.active #mv02_01svg path {
  animation-name: mv02_01svg;
  animation-duration: calc(var(--mvDurations) * 0.75);
}
.fast #mv02_01svg path {
  animation-duration: calc(var(--fastDurations) * 0.75);
}
.disappear #mv02_01svg path {
  animation-name: mv02_01svg_out;
  animation-duration: var(--disappearMs);
}
.fast.disappear #mv02_01svg path {
  animation-duration: calc(var(--disappearMs) / 2);
}
@keyframes mv02_01svg {
  /* stroke-dashoffset: 1035.2px; */
  0% {
    stroke-dashoffset: 3105.6px;
  }
  33% {
    stroke-dashoffset: 2070.4px;
  }
  60% {
    stroke-dashoffset: 2070.4px;
  }
  80% {
    stroke-dashoffset: 2070.4px;
  }
  100% {
    stroke-dashoffset: 1920.4px; /* (1035.2px * 2) - 150px */
  }
}
@keyframes mv02_01svg_out {
  0% {
    stroke-dashoffset: 1920.4px;
  }
  33% {
    stroke-dashoffset: 1035.2px;
  }
  66% {
    stroke-dashoffset: 1035.2px;
  }
  100% {
    stroke-dashoffset: 1035.2px;
  }
}

#mv02_02svg {
  width: 15.923%;
  top: 3%;
  left: 54%;
}

#mv02_02svg path {
  stroke-dasharray: 885.7px;
  stroke-dashoffset: 2657.1px;
}
.active #mv02_02svg path {
  animation-name: mv02_02svg;
  animation-duration: calc(var(--mvDurations) * 0.75);
}
.fast #mv02_02svg path {
  animation-duration: calc(var(--fastDurations) * 0.75);
}
.disappear #mv02_02svg path {
  animation-name: mv02_02svg_out;
  animation-duration: var(--disappearMs);
  animation-delay: 0s;
}
.fast.disappear #mv02_02svg path {
  animation-duration: calc(var(--disappearMs) / 2);
}
@keyframes mv02_02svg {
  /* stroke-dashoffset: 885.7px; */
  0% {
    stroke-dashoffset: 2657.1px;
  }
  33% {
    stroke-dashoffset: 2657.1px;
  }
  60% {
    stroke-dashoffset: 1771.4px;
  }
  100% {
    stroke-dashoffset: 1771.4px;
  }
}
@keyframes mv02_02svg_out {
  0% {
    stroke-dashoffset: 1771.4px;
  }
  33% {
    stroke-dashoffset: 1771.4px;
  }
  66% {
    stroke-dashoffset: 885.7px;
  }
  100% {
    stroke-dashoffset: 885.7px;
  }
}

#mv02_03svg {
  width: 39.192%;
  top: 0;
  right: 0;
}

#mv02_03svg path {
  stroke-dasharray: 1275.1px;
  stroke-dashoffset: 3825.3px;
}
.active #mv02_03svg path {
  animation-name: mv02_03svg;
  animation-duration: calc(var(--mvDurations) * 0.75);
}
.fast #mv02_03svg path {
  animation-duration: calc(var(--fastDurations) * 0.75);
}
.disappear #mv02_03svg path {
  animation-name: mv02_03svg_out;
  animation-duration: var(--disappearMs);
  animation-delay: 0s;
}
.fast.disappear #mv02_03svg path {
  animation-duration: calc(var(--disappearMs) / 2);
}
@keyframes mv02_03svg {
  /* stroke-dashoffset: 1275.1px; */
  0% {
    stroke-dashoffset: 3825.3px;
  }
  33% {
    stroke-dashoffset: 3825.3px;
  }
  60% {
    stroke-dashoffset: 3825.3px;
  }
  100% {
    stroke-dashoffset: 2550.2px;
  }
}
@keyframes mv02_03svg_out {
  0% {
    stroke-dashoffset: 2550.2px;
  }
  33% {
    stroke-dashoffset: 2550.2px;
  }
  66% {
    stroke-dashoffset: 2550.2px;
  }
  100% {
    stroke-dashoffset: 1275.1px;
  }
}

@media screen and (max-width: 1024px) {
  #mv02 .svg_wrapper {
    width: 109.832rem;
    height: 31.153rem;
    top: 34%;
    left: -8%;
  }
}

@media screen and (max-width: 768px) {
  #mv02 .svg_wrapper {
    width: 103rem;
    height: 29.22rem;
    top: 50.4%;
    left: -50rem;
  }
}

/* 03
-------------------------------------------------------- */
#mv03 {
  --mvDurations: 17000ms; /* JSで変更 */
  --fastDurations: 9000ms; /* JSで変更 */
}

#mv03 .text_wrapper {
  top: 42%;
}
#mv03 .text_wrapper .main_text01 {
  white-space: nowrap;
  position: absolute;
  left: 0;
  top: 0;
}

@media screen and (max-width: 768px) {
  #mv03 .text_wrapper {
    top: 19.5%;
  }
}

/* イラスト */
#mv03 .svg_wrapper {
  width: 136.87rem;
  height: 39.697rem;
  top: 36.5%;
  left: -15%;
}

#mv03 .svg_wrapper .path_shadow {
  width: 22.4%;
  bottom: 2%;
  left: 47.4%;
}

#mv03_01svg {
  width: 74%;
  bottom: 0.5%;
  left: 0;
}

#mv03_01svg path {
  stroke-dasharray: 2633.3px;
  stroke-dashoffset: 7899.9px;
}
.active #mv03_01svg path {
  animation-name: mv03_01svg;
  animation-duration: calc(var(--mvDurations) * 0.75);
}
.fast #mv03_01svg path {
  animation-duration: calc(var(--fastDurations) * 0.75);
}
.disappear #mv03_01svg path {
  animation-name: mv03_01svg_out;
  animation-duration: var(--disappearMs);
}
.fast.disappear #mv03_01svg path {
  animation-duration: calc(var(--disappearMs) / 2);
}

@keyframes mv03_01svg {
  0% {
    stroke-dashoffset: 7899.9px;
  }
  50% {
    stroke-dashoffset: 5266.6px;
  }
  80% {
    stroke-dashoffset: 5266.6px;
  }
  100% {
    stroke-dashoffset: 5066.6px; /* (2633.3px * 2) - 200px */
  }
}
@keyframes mv03_01svg_out {
  0% {
    stroke-dashoffset: 5066.6px;
  }
  50% {
    stroke-dashoffset: 2633.3px;
  }
  100% {
    stroke-dashoffset: 2633.3px;
  }
}

#mv03_02svg {
  width: 50%;
  bottom: 0;
  left: 48%;
}

#mv03_02svg path {
  stroke-dasharray: 2327.3px;
  stroke-dashoffset: 6982px;
}
.active #mv03_02svg path {
  animation-name: mv03_02svg;
  animation-duration: calc(var(--mvDurations) * 0.75);
}
.fast #mv03_02svg path {
  animation-duration: calc(var(--fastDurations) * 0.75);
}
.disappear #mv03_02svg path {
  animation-name: mv03_02svg_out;
  animation-duration: var(--disappearMs);
  animation-delay: 0s;
}
.fast.disappear #mv03_02svg path {
  animation-duration: calc(var(--disappearMs) / 2);
}

@keyframes mv03_02svg {
  0% {
    stroke-dashoffset: 6982px; /* 単純に（2327.3px * 3)だと点が表示されたので.1px伸ばした */
  }
  50% {
    stroke-dashoffset: 6982px;
  }
  100% {
    stroke-dashoffset: 4654.6px;
  }
}
@keyframes mv03_02svg_out {
  0% {
    stroke-dashoffset: 4654.6px;
  }
  50% {
    stroke-dashoffset: 4654.6px;
  }
  100% {
    stroke-dashoffset: 2327.3px;
  }
}

@media screen and (max-width: 1024px) {
  #mv03 .svg_wrapper {
    width: 109.496rem;
    height: 31.758rem;
    top: 40%;
    left: -14%;
  }
}

@media screen and (max-width: 768px) {
  #mv03 .svg_wrapper {
    width: 102rem;
    height: 29.584rem;
    top: 50%;
    left: -40rem;
  }
}

/* 04
-------------------------------------------------------- */
#mv04 {
  --mvDurations: 12000ms; /* JSで変更 */
  --fastDurations: 6000ms; /* JSで変更 */
}
/* テキスト */
#mv04 .text_wrapper {
  top: 46%;
}

@media screen and (max-width: 768px) {
  #mv04 .text_wrapper {
    top: 20%;
  }
}

/* イラスト */
#mv04 .svg_wrapper {
  width: 136.595rem;
  height: 47.595rem;
  top: 28%;
  left: -19.4%;
}

#mv04 .svg_wrapper .path_shadow {
  width: 24.8%;
  bottom: 0;
  left: 62.6%;
}

#mv04_01svg {
  width: 75.2%;
  bottom: 0;
  left: 0;
}

#mv04_01svg path {
  stroke-dasharray: 1865.8px;
  stroke-dashoffset: 5597.4px;
}
.active #mv04_01svg path {
  animation-name: mv04_01svg;
  animation-duration: calc(var(--mvDurations) * 0.75);
}
.fast #mv04_01svg path {
  animation-duration: calc(var(--fastDurations) * 0.75);
}
@keyframes mv04_01svg {
  /* stroke-dashoffset: 1865.8px; */
  0% {
    stroke-dashoffset: 5597.4px;
  }
  50% {
    stroke-dashoffset: 3731.6px;
  }
  75% {
    stroke-dashoffset: 3511.6px; /* (1865.8px * 2) - 220px */
  }
  100% {
    stroke-dashoffset: 3511.6px;
  }
}

#mv04_02svg {
  width: 49.4%;
  bottom: 0;
  left: 51.4%;
}

#mv04_02svg path {
  stroke-dasharray: 2141.3px;
  stroke-dashoffset: 2141.3px;
}
.active #mv04_02svg path {
  animation-name: mv04_02svg;
  animation-duration: calc(var(--mvDurations) * 0.75);
}
.fast #mv04_02svg path {
  animation-duration: calc(var(--fastDurations) * 0.75);
}
@keyframes mv04_02svg {
  0% {
    stroke-dashoffset: 2141.3px;
  }
  50% {
    stroke-dashoffset: 2141.3px;
  }
  100% {
    stroke-dashoffset: 0;
  }
}

@media screen and (max-width: 1024px) {
  #mv04 .svg_wrapper {
    width: 109.276rem;
    height: 38.076rem;
    top: 30%;
    left: -12%;
  }
}

@media screen and (max-width: 768px) {
  #mv04 .svg_wrapper {
    width: 105rem;
    height: 36.586rem;
    top: 49%;
    left: -51rem;
  }
}

/* =====
	FANTASのサービスを見る
======================================================== */
.service_btn_area {
  opacity: 0;
  visibility: hidden;
  transition:
    opacity 0.4s,
    visibility 0.4s;
}
.mv_complete .service_btn_area {
  opacity: 1;
  visibility: visible;
}

/* =====
	TOP NEWS
======================================================== */
#top_news {
  opacity: 0;
  visibility: hidden;
}
.mv_complete #top_news {
  opacity: 1;
  visibility: visible;
  transition:
    opacity 0.4s,
    visibility 0.4s;
}

#top_news h2 {
  width: 14rem;
  line-height: 1;
}

.top_news-list {
  width: calc(97% - 14rem);
  max-width: 79.2rem;
}

.top_news-list > li {
  margin-bottom: 1.5rem;
}
.top_news-list > li:nth-last-of-type(1) {
  margin-bottom: 0;
}

.top_news-list > li a {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
  font-size: 1.4rem;
  line-height: 1.5;
  min-height: 6.57em; /* 92/14 */
  padding: 0.5em calc(5.5% + 2.3em) 0.5em 5.5%;
  border-radius: 1rem;
  background-color: #fff;
  box-shadow: var(--shadow_primary);
  position: relative;
}
.top_news-list > li a:hover {
  opacity: 0.7;
}
.top_news-list > li a::before,
.top_news-list > li a::after {
  content: "";
  display: block;
  width: 2.3em;
  height: 2.3em; /* 32/14 */
  border-radius: 50%;
  position: absolute;
  right: 5.5%;
  top: calc(50% - 1.15em);
}
.top_news-list > li a::before {
  background-color: var(--blue);
  z-index: 0;
  transition: background-color 0.4s;
}
.top_news-list > li a:hover::before {
  background-color: var(--light-blue);
}
.top_news-list > li a::after {
  background: url(../img/cmn/arrow01_wh.svg) no-repeat center/50%;
  z-index: 1;
}

.top_news-list .date_cat_wrap {
  display: -webkit-box;
  display: flex;
  flex-wrap: wrap;
  -webkit-box-align: center;
  align-items: center;
  flex-shrink: 0;
  font-family: var(--en);
  width: 12.5em;
}
.top_news-list .date {
  color: var(--thin_font-color);
  letter-spacing: 0.03em;
  margin-right: 1.5em;
}
.top_news-list .cat {
  color: var(--light-blue);
  letter-spacing: 0.09em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.top_news-list .text {
  width: calc(98% - 12.5em);
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  max-height: 3em; /* 古いSafariで、heightを指定しないとoverflow:hidden;が効かないみたいなので。 */
}

@media screen and (max-width: 768px) {
  #top_news {
    background: url(../img/top/news_bg_sp.png) no-repeat top left/75%;
  }
  #top_news h2 {
    line-height: 1.5;
    width: auto;
    margin-bottom: 1.5em;
  }
  .top_news-list {
    width: 100%;
    max-width: none;
  }

  .top_news-list > li {
    margin-bottom: 1.75rem;
  }

  .top_news-list > li a {
    flex-wrap: wrap;
    min-height: 7.93em; /* 111/14 */
    padding: 1em calc(5.5% + 1.8em) 1em 5.5%;
    border-radius: 0.5rem;
  }
  .top_news-list > li a::before,
  .top_news-list > li a::after {
    width: 1.8em;
    height: 1.8em; /* 25/14 */
    top: 50%;
  }

  .top_news-list .date_cat_wrap {
    flex-wrap: nowrap;
    width: 100%;
  }

  .top_news-list .text {
    width: 100%;
  }
}

/* 
-------------------------------------------------------- */

@media screen and (max-width: 768px) {
}

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

@media screen and (max-width: 768px) {
}

/* 
-------------------------------------------------------- */

@media screen and (max-width: 768px) {
}

/************************************************************************
	下層共通
**************************************************************************/
/* =====
	下層ページ背景
======================================================== */
.lower {
  position: relative;
  z-index: 1;
}
.lower::before {
  content: "";
  display: block;
  max-width: 128rem;
  width: 100%;
  height: 100%;
  margin-inline: auto;
  background: #f3f6f7 url(../img/bg/service_pc.png) repeat-y 0 0/ 100%;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  z-index: -2;
  animation: bg_move 15s ease-in infinite;
}
.lower::after {
  content: "";
  display: block;
  max-width: 138.24rem; /* 128rem * 108% */
  width: 108%;
  height: 100%;
  margin-inline: auto;
  background-image: linear-gradient(
    90deg,
    rgba(243, 246, 247, 1) 0%,
    rgba(243, 246, 247, 1) 4.25%,
    rgba(243, 246, 247, 0) 8%,
    rgba(243, 246, 247, 0) 92%,
    rgba(243, 246, 247, 1) 95.75%,
    rgba(243, 246, 247, 1) 100%
  );
  position: absolute;
  left: -4%;
  right: -4%;
  top: 0;
  z-index: -1;
  animation: bg_move 15s ease-in infinite;
}

@keyframes bg_move {
  0% {
    transform: translate(0, 0);
  }
  25% {
    transform: translate(4%, 0.75%);
  }
  50% {
    transform: translate(0, 1.5%);
  }
  75% {
    transform: translate(-4%, 0.75%);
  }
  100% {
    transform: translate(0, 0);
  }
}

/* 会社概要 */
/* 理念/ビジョン */
/* 役員紹介 */
#company::before,
#about::before,
#officer::before {
  background-image: url(../img/bg/company_pc.png);
}

/* NEWS */
#news::before,
#single::before {
  background-image: url(../img/bg/news_pc.png);
}

/* CONTACT */
#contact::before {
  background-image: url(../img/bg/contact_pc.png);
}
/* フォーム */
#contact-form::before {
  background-image: url(../img/bg/form_pc.png);
}

/* プライバシーポリシー */
/* ポリシー */
/* 金融商品取引法に基づく商号等の明示（FIEA） など */
.lower.other-page::before {
  background-image: url(../img/bg/privacy-policy_pc.png);
}

@media screen and (max-width: 768px) {
  .lower::before {
    background-image: url(../img/bg/service_sp.png);
  }
  /* 会社概要 */
  /* 理念/ビジョン */
  /* 役員紹介 */
  #company::before,
  #about::before,
  #officer::before {
    background-image: url(../img/bg/company_sp.png);
  }

  /* NEWS */
  #news::before,
  #single::before {
    background-image: url(../img/bg/news_sp.png);
  }

  /* CONTACT */
  #contact::before {
    background-image: url(../img/bg/contact_sp.png);
  }
  /* フォーム */
  #contact-form::before {
    background-image: url(../img/bg/form_sp.png);
  }

  /* プライバシーポリシー */
  /* ポリシー */
  /* 金融商品取引法に基づく商号等の明示（FIEA） など */
  .lower.other-page::before {
    background-image: url(../img/bg/privacy-policy_sp.png);
  }
}

/* =====
	ページタイトル
======================================================== */
.lower_head {
  max-width: 100rem;
  width: 92%;
  padding: 18rem 0 8rem;
  margin-inline: auto;
}

.lower_title {
  font-size: 1.4rem;
  color: var(--green);
}
.lower_title.animation {
  --skewX: 0deg;
  --cover-x: 101%;
  --x: 0;
}

.lower_title .main,
.lower_title .sub {
  width: fit-content;
  overflow: hidden;
  position: relative;
}
.lower_title .main {
  font-weight: 700;
  padding-left: 0.25em;
  line-height: 1.5;
  letter-spacing: 0.25em;
}
.lower_title .sub {
  font-family: var(--en);
  font-size: 6.1428em; /* 86/14 */
  font-weight: 300;
  line-height: 1;
  letter-spacing: 0.025em;
  text-transform: uppercase;
}

.lower_title .main::before,
.lower_title .main::after,
.lower_title .sub::before,
.lower_title .sub::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border-radius: 5em;
  transform: translateX(var(--cover-x, -101%));
  transition: transform 0.6s cubic-bezier(0.39, 0.575, 0.565, 1);
}
.lower_title .main::before,
.lower_title .sub::before {
  background-color: var(--bg_white);
}
.lower_title .main::after,
.lower_title .sub::after {
  background-color: var(--green);
  transition-delay: 0.16s;
}

.lower_title .main .in_text,
.lower_title .sub .in_text {
  display: inline-block;
  transform: translateX(var(--x, -110%));
  transition: transform 0.48s cubic-bezier(0.16, 1, 0.3, 1);
  transition-delay: 0.3s;
}

@media screen and (max-width: 768px) {
  .lower_head {
    width: 90%;
    padding: 16rem 0 10.5rem;
  }

  .lower_title .sub {
    font-size: 3.5714em; /* 50/14 */
  }
}

/* =====
	下層ページMV
======================================================== */
.lower_mv {
  max-width: 100rem;
  width: 92%;
  margin-inline: auto;
  margin-bottom: 10rem;
  border-radius: 0.5rem;
  background-color: #fff;
  position: relative;
}
.lower_mv::before {
  content: "";
  display: block;
  padding-top: 36%;
}

.lower_mv .svg_wrapper {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
}
.lower_mv .svg_wrapper .mv_svg {
  position: absolute;
}
.lower_mv .mv_svg path {
  stroke-width: 3px;
}
.lower_mv.animation .mv_svg path {
  animation-timing-function: linear;
  animation-fill-mode: forwards;
}

@media screen and (max-width: 768px) {
  .lower_mv {
    width: 90%;
  }
  .lower_mv::before {
    padding-top: 100%;
  }
}

/* =====
	フッター付近お問い合わせ
======================================================== */
#ft_contact {
  padding: 10rem 0;
  background-color: rgba(224, 242, 255, 0.6);
}

#ft_contact hgroup {
  font-size: 1.4rem;
  text-align: center;
  line-height: 1.25;
  margin-bottom: 2.4em;
}
#ft_contact hgroup .main {
  font-weight: 700;
  color: #1cacff;
  letter-spacing: 0.75em;
}
#ft_contact hgroup .sub {
  font-family: var(--en);
  font-size: 5.143em; /* 72/14 */
  text-transform: uppercase;
  letter-spacing: 0.025em;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  text-fill-color: transparent;
  background-image: var(--light-blue_grada_w);
  background-image: var(--light-blue_grada);
}

#ft_contact .guidance {
  text-align: center;
  letter-spacing: 0.18em;
  line-height: 2.25;
  max-width: 46em;
  margin: 0 auto 2em;
}
#ft_contact .btn_primary {
  padding-left: 2em;
}
@media screen and (max-width: 768px) {
  #ft_contact {
    padding: 10rem 0;
  }

  #ft_contact hgroup {
    margin-bottom: 1.8em;
  }
  #ft_contact hgroup .main {
    margin-bottom: 0.25em;
  }
  #ft_contact hgroup .sub {
    font-size: 3.214em; /* 45/14 */
  }

  #ft_contact .btn_primary {
    max-width: 25rem;
    min-height: 2.75em;
    padding: 0.15em 2.85em 0.15em 2em;
  }
}

/* 
-------------------------------------------------------- */

@media screen and (max-width: 768px) {
}

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

@media screen and (max-width: 768px) {
}

/* 
-------------------------------------------------------- */

@media screen and (max-width: 768px) {
}

/************************************************************************
	SERVICE
**************************************************************************/
/* =====
	MV
======================================================== */
#service_mv01svg {
  width: 59%;
  left: -2%;
  bottom: 3%;
}
#service_mv01svg path {
  stroke-dasharray: 4214.4px;
  stroke-dashoffset: 4214.4px;
}
.animation #service_mv01svg path {
  animation-name: service_mv01svg;
  animation-duration: 10s;
}
#service_mv02svg {
  width: 52.6%;
  left: 49%;
  bottom: 5%;
}
#service_mv02svg path {
  stroke-dasharray: 5185.3px;
  stroke-dashoffset: 5185.3px;
}
.animation #service_mv02svg path {
  animation-name: service_mv02svg;
  animation-duration: 10s;
}

@keyframes service_mv01svg {
  0% {
    stroke-dashoffset: 4214.4px;
  }
  46% {
    stroke-dashoffset: 0;
  }
  100% {
    stroke-dashoffset: 0;
  }
}
@keyframes service_mv02svg {
  0% {
    stroke-dashoffset: 5185.3px;
  }
  42% {
    stroke-dashoffset: 5185.3px;
  }
  100% {
    stroke-dashoffset: 0;
  }
}

@media screen and (max-width: 768px) {
  #service_mv01svg {
    width: 86%;
    left: -25%;
    bottom: 27%;
  }
  #service_mv02svg {
    width: 76%;
    left: 50.4%;
    bottom: 28%;
  }
}

/* =====
	冒頭文
======================================================== */
#service #intro_text_wrapper {
  --half_not_scroll: 2500ms;
  font-family: var(--yu-gothic);
  font-size: 2rem;
  font-weight: 700;
  text-align: center;
  line-height: 2;
}

#service #intro_text_wrapper .intro_text {
  padding-bottom: 5em;
}
#service #intro_text_wrapper .intro_text .text_fader {
  background: linear-gradient(90deg, #ccc 0%, #ccc 100%) no-repeat 0 0 / 100%
    100%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  text-fill-color: transparent;
}
#service #intro_text_wrapper .intro_text.animation .text_fader {
  background: linear-gradient(90deg, #00f 0%, #00f 0.5%, #ccc 0.5%, #ccc 100%)
    no-repeat 0 0 / 100% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  text-fill-color: transparent;
  animation: text_fader_primary 4s linear 0.1s both;
}
#service #intro_text_wrapper.is_time_half .intro_text.animation .text_fader {
  animation-duration: var(--half_not_scroll);
}
@media screen and (max-width: 768px) {
  #service #intro_text_wrapper {
    font-size: 1.8rem;
    line-height: 2.22;
    width: 96%;
    margin-bottom: 1em;
  }
  #service #intro_text_wrapper .intro_text {
    letter-spacing: -0.01em;
  }
}

/* =====
	ウェルス・マネジメント・プラットフォーム事業
======================================================== */
#service .service_sec {
  --sec_color: var(--green);
  max-width: 100rem;
  width: 92%;
  margin-inline: auto;
  position: relative;
}
#service #service01 {
  margin-bottom: 10rem;
}
#service #service02 {
  --sec_color: var(--blue02);
  margin-bottom: 18rem;
}

@media screen and (max-width: 768px) {
  #service .service_sec {
    width: 90%;
  }
  #service #service02 {
    margin-bottom: 10rem;
  }
}

/* 冒頭
-------------------------------------------------------- */
#service .service_sec .intro_container {
  overflow: hidden;
  cursor: pointer;
  max-width: 79.2rem;
  padding: 3.5rem 0 8rem;
  margin: 0 auto 4rem;
  border-radius: 0.5rem;
  box-shadow: var(--shadow_primary);
  background-color: #fff;
  transition: padding 0.4s;
}
#service02.service_sec .intro_container {
  padding: 3.5rem 0;
}
#service .service_sec.is_open .intro_container {
  padding: 3.5rem 0;
}

#service .service_sec .intro_container > * {
  width: 90%; /* 712/792 ~ 89.8989 */
  margin-inline: auto;
}

#service .service_sec .intro_container hgroup {
  font-family: var(--yu-gothic);
  font-size: 3.2rem;
  font-weight: 700;
  color: var(--sec_color);
  line-height: 1.25;
  letter-spacing: 0.05em;
  width: 92%; /* 他コンテンツより少し大きい */
  margin-bottom: 0.9em;
}
#service .service_sec .intro_container hgroup .sub {
  font-family: var(--en);
  font-size: 0.28125em; /* 9/32 */
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: capitalize;
  padding-left: 0.25em;
  margin-bottom: 0.5em;
}
#service .service_sec .intro_container hgroup .main {
  font-feature-settings: "palt";
}

#service .service_sec .intro_container .svg_wrapper {
  width: 100%;
}

#service .service_sec .intro_container .text_wrapper {
  display: none;
  padding-top: 4rem;
}

@media screen and (max-width: 768px) {
  #service .service_sec .intro_container {
    padding: 3rem 0 12rem;
    margin-bottom: 6rem;
  }
  #service02.service_sec .intro_container {
    padding: 3.5rem 0 8rem;
  }
  #service .service_sec.is_open .intro_container {
    padding: 3.5rem 0 4rem !important;
  }

  #service .service_sec .intro_container hgroup {
    font-size: 2.8rem;
    line-height: 1.42;
    width: 90%;
    margin-bottom: 1.5em;
  }
  #service .service_sec .intro_container hgroup .sub {
    font-family: var(--en);
    font-size: 0.3214em; /* 9/28 */
    margin-bottom: 0.75em;
  }

  #service .service_sec .intro_container .svg_wrapper {
    width: 160%;
    margin-left: -26%;
  }
  #service #service02 .intro_container .svg_wrapper {
    margin-left: -40%;
  }

  #service .service_sec .intro_container .text_wrapper {
    padding-top: 3rem;
    font-size: 1.6rem;
  }
}

/* ボタン
-------------------------------------------------------- */
#service .service_sec .close_btn {
  display: block;
  width: 4.2rem;
  height: 4.2rem;
  border-radius: 50%;
  box-shadow: var(--shadow_primary);
  background-color: var(--sec_color);
  position: absolute;
  bottom: 2rem;
  left: calc(50% - 2.1rem);
}
#service .service_sec:has(.intro_container:hover) .close_btn,
#service .service_sec .close_btn:hover {
  -webkit-filter: brightness(110%);
  -moz-filterfilter: brightness(110%);
  filter: brightness(110%);
  transition:
    -webkit-filter 0.4s,
    -moz-filterfilter 0.4s,
    filter 0.4s;
}

#service .service_sec .close_btn .cross {
  display: block;
  width: 45%;
  height: 45%;
  margin: auto;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  transition: transform 0.4s;
}
#service .service_sec:has(.intro_container:hover) .close_btn .cross,
#service .service_sec .close_btn:hover .cross {
  transform: rotate(360deg);
}
#service .service_sec .close_btn .cross::before,
#service .service_sec .close_btn .cross::after {
  content: "";
  display: block;
  width: 100%;
  height: 2px;
  background-color: #fff;
  position: absolute;
  left: 0;
  top: calc(50% - 1px);
}
#service .service_sec .close_btn .cross::after {
  transform: rotate(90deg);
  transition: transform 0.4s;
}
#service .service_sec.is_open .close_btn .cross::after {
  transform: rotate(0);
}

@media screen and (max-width: 768px) {
  #service .service_sec .close_btn {
    width: 4rem;
    height: 4rem;
    left: calc(50% - 2rem);
  }
}

/* 隠し部分
-------------------------------------------------------- */
#service .service_sec .hide_area {
  display: none;
  padding-bottom: 8rem;
}

/* コンテナ
--------------- */
#service .service_sec .details_container {
  font-size: 1.5rem; /* 15/16 */

  display: -webkit-box;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
  flex-direction: row-reverse;
  -webkit-box-pack: justify;
  justify-content: space-between;
  -webkit-box-align: start;
  align-items: flex-start;
  padding: 4.5rem 4% 2.5rem;
  margin-bottom: 4rem;
  border-radius: 1rem;
  background-color: rgba(193, 239, 237, 0.5);
  position: relative;
  transition: background-color 0.4s;
}
#service #service02 .details_container {
  background-color: rgba(192, 234, 251, 0.5);
}
#service .service_sec .details_container:has(.btn:hover) {
  background-color: rgba(193, 239, 237, 0.8);
}
#service #service02 .details_container:has(.btn:hover) {
  background-color: rgba(192, 234, 251, 0.8);
}

@media screen and (max-width: 768px) {
  #service .service_sec .details_container {
    display: block;
    padding: 4.25rem 5% 2.5rem;
    margin-bottom: 5.5rem;
    border-radius: 0.2rem;
  }
}

/* 左
--------------- */
#service .service_sec .details_container .text_wrapper {
  width: 50%;
}

#service .service_sec .details_container hgroup {
  color: var(--blue);
  line-height: 1.25;
  margin-bottom: 6%;
}

#service .service_sec .details_container hgroup .main {
  font-family: var(--en);
  font-size: 2.4267em; /* 36.4/15 */
  font-weight: 300;
  letter-spacing: 0.05em;
  margin-bottom: 0.1em;
}
#service .service_sec .details_container hgroup .sub {
  font-family: var(--yu-gothic);
  font-weight: 700;
  letter-spacing: 0.15em;
}

#service .service_sec .details_container .text {
  margin-bottom: 5.5%;
}

#service .service_sec .details_container .btn {
  display: block;
  margin-bottom: 0.8em;
}

#service .service_sec .details_container .btn::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
}

#service .service_sec .details_container .btn_body {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  align-items: center;
  color: #fff;
  line-height: 1.25;
  letter-spacing: 0.09em;
  width: fit-content;
  padding: 0.4em 3em 0.4em 1.5em;
  border-radius: 5em;
  background-image: var(--blue_grada_w);
  background-image: var(--blue_grada);
  position: relative;
  z-index: 0;
}
#service .service_sec .details_container .btn_body::before {
  content: "";
  display: block;
  width: calc(100% + 2px);
  height: calc(100% + 2px);
  border-radius: 5em;
  background-image: var(--light-blue_grada_w);
  background-image: var(--light-blue_grada);
  position: absolute;
  left: -1px;
  top: -1px;
  z-index: 1;
  opacity: 0;
  transition: opacity 0.4s;
}
#service .service_sec .details_container:has(.btn:hover) .btn_body::before {
  opacity: 1;
}
#service .service_sec .details_container .btn_body::after {
  content: "";
  display: block;
  width: 1.2em;
  height: 1.2em;
  background: url(../img/cmn/btn-arrow_wh.svg) no-repeat center/contain;
  position: absolute;
  right: 1.1em;
  top: calc(50% - 0.6em);
  z-index: 2;
  transform: rotate(-45deg);
}
#service .service_sec .details_container .btn_body > span {
  display: inline-block;
  position: relative;
  z-index: 2;
}

#service .service_sec .details_container .other_link {
  display: inline-block;
  font-size: 0.8667em; /* 13/15 */
  text-decoration: underline;
  padding: 0.75em 0.25em;
  position: relative;
  z-index: 2;
}
#service .service_sec .details_container .other_link:hover {
  text-decoration: none;
}
#service
  .service_sec
  .details_container
  .other_link:not(:nth-child(1 of .other_link)) {
  padding-top: 0;
}
#service
  .service_sec
  .details_container
  .other_link:not(:nth-last-child(1 of .other_link)) {
  padding-bottom: 0;
}

@media screen and (max-width: 768px) {
  #service .service_sec .details_container .text_wrapper {
    width: 100%;
  }

  #service .service_sec .details_container hgroup {
    margin-bottom: 1.5em;
  }

  #service .service_sec .details_container hgroup .main {
    font-size: 2em; /* 30/15 */
    margin-bottom: 0.25em;
  }

  #service .service_sec .details_container .text {
    margin-bottom: 1.25em;
  }

  #service .service_sec .details_container .btn {
    margin-bottom: 0.5em;
  }

  #service .service_sec .details_container .btn_body {
    width: 100%;
    padding: 0.5em 0;
  }
  #service .service_sec .details_container .btn_body.study {
    font-size: 0.9em; /* 14/15 */
    padding: 0.525em 0;
  }

  #service .service_sec .details_container .btn_body::after {
    display: none;
  }
  #service .service_sec .details_container .btn_body > span {
    padding-right: 2em;
  }
  #service .service_sec .details_container .btn_body > span::after {
    content: "";
    display: block;
    width: 1.2em;
    height: 1.2em;
    background: url(../img/cmn/btn-arrow_wh.svg) no-repeat center/contain;
    position: absolute;
    right: 0;
    top: calc(50% - 0.66em);
    z-index: 2;
    transform: rotate(-45deg);
  }
  #service .service_sec .details_container .btn_body.study > span::after {
    width: 1.25em;
    height: 1.25em;
    top: calc(50% - 0.7em);
  }
}

/* 右
--------------- */
#service .service_sec .details_container .img {
  width: 48%;
  max-width: 41rem;
}

@media screen and (max-width: 768px) {
  #service .service_sec .details_container .img {
    width: 100%;
    max-width: none;
    margin-bottom: 3.5rem;
  }
}

/* 
-------------------------------------------------------- */

@media screen and (max-width: 768px) {
}

/************************************************************************
	会社概要
**************************************************************************/
/* =====
	MV
======================================================== */
#company_mv01svg {
  width: 66%;
  left: -4.2%;
  bottom: 7.4%;
}
#company_mv01svg path {
  stroke-dasharray: 1716.6px;
  stroke-dashoffset: 1716.6px;
}
.animation #company_mv01svg path {
  animation-name: company_mv01svg;
  animation-duration: 7s;
}
#company_mv02svg {
  width: 18.6%;
  left: 48%;
  bottom: 23%;
}
#company_mv02svg path {
  stroke-dasharray: 1566.1px;
  stroke-dashoffset: 1566.1px;
}
.animation #company_mv02svg path {
  animation-name: company_mv02svg;
  animation-duration: 7s;
}
#company_mv03svg {
  width: 48%;
  left: 55%;
  bottom: 5%;
}
#company_mv03svg path {
  stroke-dasharray: 2286.6px;
  stroke-dashoffset: 2286.6px;
}
.animation #company_mv03svg path {
  animation-name: company_mv03svg;
  animation-duration: 7s;
}

@keyframes company_mv01svg {
  0% {
    stroke-dashoffset: 1716.6px;
  }
  31% {
    stroke-dashoffset: 0;
  }
  60% {
    stroke-dashoffset: 0;
  }
  100% {
    stroke-dashoffset: 0;
  }
}
@keyframes company_mv02svg {
  0% {
    stroke-dashoffset: 1566.1px;
  }
  31% {
    stroke-dashoffset: 1566.1px;
  }
  60% {
    stroke-dashoffset: 0;
  }
  100% {
    stroke-dashoffset: 0;
  }
}
@keyframes company_mv03svg {
  0% {
    stroke-dashoffset: 2286.6px;
  }
  31% {
    stroke-dashoffset: 2286.6px;
  }
  60% {
    stroke-dashoffset: 2286.6px;
  }
  100% {
    stroke-dashoffset: 0;
  }
}

@media screen and (max-width: 768px) {
  #company_mv01svg {
    width: 104%;
    left: -55.4%;
    bottom: 25.8%;
  }
  #company_mv02svg {
    width: 30.8%;
    left: 26%;
    bottom: 34%;
  }
  #company_mv03svg {
    width: 77.6%;
    left: 37.2%;
    bottom: 23.6%;
  }
}

/* =====
	タブ切替
======================================================== */
.company_tab_list {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: justify;
  justify-content: space-between;
  max-width: 79rem;
  margin-inline: auto;
}
.company_tab_list > li {
  font-size: 1.5rem;
  font-weight: 500;
  width: 33%;
  max-width: 25rem;
}
.company_tab_list > li a,
.company_tab_list > li .current {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  align-items: center;
  min-height: 3.267em; /* 49/15 */
  border-radius: 0.3em;
}
.company_tab_list > li a {
  box-shadow: var(--shadow_primary);
  background-color: rgba(255, 255, 255, 0.8);
}
.company_tab_list > li a:hover {
  background-color: rgba(255, 255, 255, 0.15);
}
.company_tab_list > li .current {
  color: #fff;
  box-shadow: inset 0 0 0.75em 0 rgba(255, 255, 255, 0.4);
  background-color: rgba(0, 0, 255, 0.7);
}

@media screen and (max-width: 768px) {
  .company_tab_list {
    width: 90%;
  }
  .company_tab_list > li {
    font-size: 1.4rem;
    width: 31%;
  }
  .company_tab_list > li.wide {
    width: 34%;
  }
}

/* =====
	数字
======================================================== */
.numbers_list {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: repeat(4, min(20rem, 23.4%));
  grid-template-columns: repeat(4, min(20rem, 23.4%));
  -webkit-box-pack: justify;
  justify-content: space-between;
  max-width: 92rem;
  width: 92%;
  padding: 10rem 0;
  margin-inline: auto;
}
.numbers_list > li {
  display: -ms-grid;
  display: grid;
  -ms-grid-rows: subgrid;
  grid-template-rows: subgrid; /* サブグリッドにすることで高さ調整可能に */
  grid-row: span 4; /* パーツの数 */
  padding: 3rem 0;
  border-radius: 1rem;
  background-color: #fff;
}

.numbers_list > li .img {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
  margin: 0 auto 1.75rem;
}
.numbers_list > li:nth-of-type(1) .img {
  max-width: 8.3rem;
}
.numbers_list > li:nth-of-type(2) .img {
  max-width: 11.3rem;
}
.numbers_list > li:nth-of-type(3) .img {
  max-width: 12.9rem;
}
.numbers_list > li:nth-of-type(4) .img {
  max-width: 11.24rem;
}

.numbers_list > li h3 {
  font-size: 1.5rem;
  font-weight: 500;
  color: var(--light-blue02);
  text-align: center;
  margin-bottom: 1em;
}

.numbers_list > li .time_wrapper {
  font-size: 1.5rem;
  text-align: center;
}
.numbers_list > li .time_wrapper .num_box {
  display: inline-block;
  font-family: "Akshar", sans-serif;
  font-size: 3.133em;
  line-height: 1;
  overflow: hidden;
}
.numbers_list > li .time_wrapper .num_box > span {
  display: inline-block;
  transform: translateY(120%);
}
.numbers_list > li.animation .time_wrapper .num_box > span {
  animation: numbers_animation 0.5s ease-out both;
}
.numbers_list > li .time_wrapper .num_box > span.delay01 {
  animation-delay: 0.1s;
}
.numbers_list > li .time_wrapper .num_box > span.delay02 {
  animation-delay: 0.2s;
}
.numbers_list > li .time_wrapper .num_box > span.delay03 {
  animation-delay: 0.3s;
}
.numbers_list > li .time_wrapper .num_box > span.delay04 {
  animation-delay: 0.4s;
}
.numbers_list > li .time_wrapper .num_box > span.delay05 {
  animation-delay: 0.5s;
}
.numbers_list > li .time_wrapper .num_box > span.delay06 {
  animation-delay: 0.6s;
}
.numbers_list > li .time_wrapper .num_box > span.delay07 {
  animation-delay: 0.7s;
}
.numbers_list > li .time_wrapper .num_box > span.delay08 {
  animation-delay: 0.8s;
}
.numbers_list > li .time_wrapper .num_box > span.delay09 {
  animation-delay: 0.9s;
}
.numbers_list > li .time_wrapper .num_box > span.delay10 {
  animation-delay: 1s;
}
.numbers_list > li .time_wrapper .num_box > span.delay11 {
  animation-delay: 1.1s;
}
.numbers_list > li .time_wrapper .num_box > span.delay12 {
  animation-delay: 1.2s;
}
.numbers_list > li .time_wrapper .num_box > span.delay13 {
  animation-delay: 1.3s;
}
.numbers_list > li .time_wrapper .num_box > span.delay14 {
  animation-delay: 1.4s;
}
.numbers_list > li .time_wrapper .num_box > span.delay15 {
  animation-delay: 1.5s;
}
.numbers_list > li .time_wrapper .num_box > span.delay16 {
  animation-delay: 1.6s;
}
.numbers_list > li .time_wrapper .num_box > span.delay17 {
  animation-delay: 1.7s;
}
.numbers_list > li .time_wrapper .num_box > span.delay18 {
  animation-delay: 1.8s;
}
.numbers_list > li .time_wrapper .num_box > span.delay19 {
  animation-delay: 1.9s;
}
.numbers_list > li .time_wrapper .num_box > span.delay20 {
  animation-delay: 2s;
}
@keyframes numbers_animation {
  0% {
    transform: translateY(120%);
  }
  100% {
    transform: translateY(0);
  }
}

.numbers_list > li .time_wrapper .unit {
  display: inline-block;
  padding-left: 0.5em;
  transform: translateY(-0.75em);
}
.numbers_list > li:nth-of-type(1) .time_wrapper .unit {
  padding-right: 0.2em;
  padding-left: 0.4em;
}

.numbers_list > li .supple {
  font-size: 1rem;
  text-align: center;
  letter-spacing: 0.1em;
  margin-top: -1.5em;
}

@media screen and (max-width: 768px) {
  .numbers_list {
    -ms-grid-columns: repeat(2, 47.2%);
    grid-template-columns: repeat(2, 47.2%);
    grid-row-gap: 3.5rem;
    width: 90%;
  }

  .numbers_list > li {
    grid-row-gap: 0;
    padding: 2rem 0 0.75rem;
    border-radius: 0.5rem;
  }

  .numbers_list > li .img {
    margin: 0 auto 1rem;
  }
  .numbers_list > li:nth-of-type(1) .img {
    max-width: 6.3rem;
  }
  .numbers_list > li:nth-of-type(2) .img {
    max-width: 9.3rem;
  }
  .numbers_list > li:nth-of-type(3) .img {
    max-width: 8.4rem;
  }
  .numbers_list > li:nth-of-type(4) .img {
    max-width: 9.24rem;
  }

  .numbers_list > li h3 {
    font-size: 1.4rem;
    margin-bottom: 0.5em;
  }

  .numbers_list > li .time_wrapper {
    font-size: 1.4rem;
    text-align: center;
  }
  .numbers_list > li .time_wrapper .num_box {
    font-size: 2.64em; /* 37/14 */
  }
}

/* =====
	Tours
======================================================== */
#tours {
  position: relative;
  width: 92%;
  max-width: 100rem;
  height: 36rem;
  margin-inline: auto;
  border-radius: 0.5rem;
  overflow: hidden;
}
#tours iframe {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

@media screen and (max-width: 768px) {
  #tours {
    width: 90%;
    height: 52.5rem;
  }
}

/* =====
	概要テーブル
======================================================== */
.overview_tbl .wrapper {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: justify;
  justify-content: space-between;
  line-height: 1.875;
}

.overview_tbl .wrapper > dt,
.overview_tbl .wrapper > dd {
  padding: 2.15em 0;
  border-top: 1px solid rgba(0, 0, 255, 0.15);
}
/* 下にもボーダー */
.overview_tbl .wrapper.border_bottom > dt,
.overview_tbl .wrapper.border_bottom > dd {
  margin-bottom: 2.75rem;
  border-bottom: 1px solid rgba(0, 0, 255, 0.15);
}
/* ボーダーなし（役員など） */
.overview_tbl .wrapper.no_border > dt,
.overview_tbl .wrapper.no_border > dd {
  padding: 1.75rem 0;
  border: none;
}
.overview_tbl .wrapper.no_border.last > dt,
.overview_tbl .wrapper.no_border.last > dd {
  padding-bottom: 5rem;
}
/* 免許以降　上下padding広め */
.overview_tbl .wrapper.padding_expensive > dt,
.overview_tbl .wrapper.padding_expensive > dd {
  padding: 5.2rem 0;
}

.overview_tbl .wrapper > dt {
  display: -webkit-box;
  display: flex;
  flex-wrap: wrap;
  max-width: 28rem;
  width: 33%;
}
.overview_tbl .wrapper > dt.no_flex {
  display: block;
}

.overview_tbl .wrapper > dt .main {
  width: 9em;
}
.overview_tbl .wrapper > dt.no_flex .main {
  width: 100%;
}
.overview_tbl .wrapper > dt .sub {
  font-family: var(--inder);
  font-size: 0.875em; /* 14/16 */
  color: #9c9999;
}

.overview_tbl .wrapper > dd {
  max-width: 59rem;
  width: 66%;
}

.overview_tbl dd > ul > li {
  line-height: 1.4;
  margin-bottom: 0.25em;
}

/* 役員 加盟団体 */
.overview_tbl .wrapper > dd .child_dl > .box {
  display: -webkit-box;
  display: flex;
  margin-bottom: 0.75em;
}

.overview_tbl .wrapper > dd .child_dl > .box:nth-last-of-type(1) {
  margin-bottom: 0;
}
.overview_tbl .wrapper > dd .child_dl > .box > dt {
  flex-shrink: 0;
  width: 8.5em;
}

.overview_tbl .wrapper > dd .license_list > li {
  margin-bottom: 2.5em;
}
.overview_tbl .wrapper > dd .license_list > li:nth-last-of-type(1) {
  margin-bottom: 0;
}

/* 住所 */
.overview_tbl .wrapper > dd .map_box:nth-of-type(1) {
  padding-bottom: 5rem;
  border-bottom: 1px solid rgba(0, 0, 255, 0.15);
}
.overview_tbl .wrapper > dd .map_box:nth-of-type(2) {
  padding-top: 5rem;
}
.overview_tbl .wrapper > dd .map_box .map {
  max-width: 44.2rem;
  width: 100%;
  height: 15.7rem;
  position: relative;
}
.overview_tbl .wrapper > dd .map_box .map iframe {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

@media screen and (max-width: 768px) {
  .overview_tbl .wrapper {
    display: block;
    line-height: 1.875;
    font-size: 1.6rem;
  }
  .overview_tbl .wrapper .sp_small {
    font-size: 1.25rem;
  }

  .overview_tbl .wrapper > dt {
    max-width: none;
    width: 100%;
    padding: 2.35em 0 0.5em;
  }
  .overview_tbl .wrapper.border_bottom > dt {
    margin-bottom: 0;
    border-bottom: none;
  }
  /* 役員など */
  .overview_tbl .wrapper.no_border > dt {
    padding: 1em 0 0.75em;
  }
  .overview_tbl .wrapper.no_border > dd {
    padding: 0.5em 0 1.5em;
  }
  .overview_tbl .wrapper.no_border.last > dt {
    padding-bottom: 0.75em;
  }
  .overview_tbl .wrapper.no_border.last > dd {
    padding-bottom: 2.5em;
  }
  .overview_tbl .wrapper.no_border.first > dt {
    padding-bottom: 1.5em;
  }

  /* 免許以降　上下padding広め */
  .overview_tbl .wrapper.padding_expensive > dt {
    padding: 2.5em 0 0.5em;
  }
  .overview_tbl .wrapper.padding_expensive > dd {
    padding: 0.5em 0 2.5em;
  }

  .overview_tbl .wrapper > dt .main {
    width: 6em;
  }

  .overview_tbl .wrapper > dd {
    max-width: none;
    width: 100%;
    padding: 0.5em 0 2.35em;
    border-top: none;
  }

  /* 役員 加盟団体 */
  .overview_tbl .wrapper > dd .child_dl > .box {
    margin-bottom: 1.25em;
  }

  .overview_tbl .wrapper > dd .child_dl > .box:nth-last-of-type(1) {
    margin-bottom: 0;
  }
  .overview_tbl .wrapper > dd .child_dl > .box > dt {
    width: 8em;
  }

  /* 免許 */
  .overview_tbl .wrapper > dd .license_list > li {
    margin-bottom: 1.6em;
  }

  /* 住所 */
  .overview_tbl .wrapper > dd .map_box:nth-of-type(1) {
    padding-top: 2.5rem;
    padding-bottom: 0;
    border-bottom: none;
  }
  .overview_tbl .wrapper > dd .map_box:nth-of-type(2) {
    padding-top: 3.5rem;
  }
  .overview_tbl .wrapper > dd .map_box .map {
    max-width: none;
    margin-bottom: 1.5rem;
  }
}

@media screen and (max-width: 530px) {
  .overview_tbl .wrapper .sp_small {
    font-size: 1.35rem;
  }
}

/* 
-------------------------------------------------------- */

@media screen and (max-width: 768px) {
}

/************************************************************************
	理念 / ビジョン
**************************************************************************/
/* =====
	MV
======================================================== */
#about_mv01svg {
  width: 33%;
  left: 18%;
  bottom: -7%;
}
#about_mv01svg path {
  stroke-dasharray: 1719.9px;
  stroke-dashoffset: 1719.9px;
}
.animation #about_mv01svg path {
  animation-name: about_mv01svg;
  animation-duration: 6s;
}
#about_mv02svg {
  width: 66%;
  left: 36.4%;
  bottom: -5.2%;
}
#about_mv02svg path {
  stroke-dasharray: 3281.7px;
  stroke-dashoffset: 3281.7px;
}
.animation #about_mv02svg path {
  animation-name: about_mv02svg;
  animation-duration: 6s;
}

@keyframes about_mv01svg {
  0% {
    stroke-dashoffset: 1719.9px;
  }
  33% {
    stroke-dashoffset: 0;
  }
  100% {
    stroke-dashoffset: 0;
  }
}
@keyframes about_mv02svg {
  0% {
    stroke-dashoffset: 3281.7px;
  }
  33% {
    stroke-dashoffset: 3281.7px;
  }
  100% {
    stroke-dashoffset: 0;
  }
}

@media screen and (max-width: 768px) {
  #about_mv01svg {
    width: 50%;
    left: 0;
    bottom: 20%;
  }

  #about_mv02svg {
    width: 100%;
    left: 28%;
    bottom: 21%;
  }
}

/* =====
	ファンになっていただける企業になる。〜
======================================================== */
.philosophy_sec {
  --sec_color: var(--blue);
  margin-bottom: 3rem;
  position: relative;
}
#philosophy02 {
  --sec_color: var(--green);
}

.philosophy_sec > * {
  position: relative;
  z-index: 1;
}

@media screen and (max-width: 768px) {
  .philosophy_sec {
    margin-bottom: 6rem;
  }
}

/* テキスト
-------------------------------------------------------- */
.philosophy_sec hgroup {
  font-size: 7.2rem;
  font-weight: 700;
  line-height: 1.33; /* 96/72 */
  margin-bottom: 0.6em;
}
.philosophy_sec hgroup .sub {
  font-size: 0.1945em; /* 14/72 */
  color: var(--sec_color);
  line-height: 1;
  letter-spacing: 0.25em;
  text-transform: uppercase;
}

.philosophy_sec hgroup .main {
  width: fit-content;
  position: relative;
}

.philosophy_sec hgroup .main .text_fader {
  background: linear-gradient(var(--sec_color) 0 100%) no-repeat 0 0 / 0 100%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  text-fill-color: transparent;
}
.philosophy_sec hgroup.animation .main .text_fader {
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  text-fill-color: transparent;
  animation: philosophy_text_fader 1.4s linear both;
}

@keyframes philosophy_text_fader {
  0% {
    background-size: 0% 100%;
  }
  100% {
    background-size: 100% 100%;
  }
}

.philosophy_sec hgroup .main picture {
  display: block;
  width: calc(100% - 0.74em);
  position: absolute;
  left: 0.1em;
  top: 0.26em;
  transition: opacity 0.4s 1.2s; /* .text_faderのアニメーション終了間際に透明化 */
}
#philosophy02 hgroup .main picture {
  width: calc(100% - 0.71em);
  left: 0.06em;
  top: 0.24em;
}

.philosophy_sec hgroup.animation picture {
  opacity: 0;
}

@media screen and (max-width: 840px) {
  .philosophy_sec hgroup {
    font-size: 6rem;
  }
  .philosophy_sec hgroup .sub {
    font-size: 0.233em; /* 14/60 */
  }
}

@media screen and (max-width: 768px) {
  .philosophy_sec hgroup {
    font-size: calc(11.54 * var(--js_vw));
    line-height: 1.66;
    margin-bottom: 1.5em;
  }
  .philosophy_sec hgroup .sub {
    font-size: 0.311em; /* 14/45 */
  }

  .philosophy_sec hgroup .main picture {
    width: 6.68em;
    left: -0.01em;
    top: 0.42em;
  }

  #philosophy01 hgroup .main {
    line-height: 1.6608;
  }
  #philosophy01 hgroup .main .control01 {
    letter-spacing: -0.05em;
  }
  #philosophy01 hgroup .main .control02 {
    letter-spacing: 0.01em;
  }
  #philosophy01 hgroup .main .control03 {
    letter-spacing: -0.045em;
  }
  #philosophy01 hgroup .main .control04 {
    letter-spacing: 0.015em;
  }
  #philosophy01 hgroup .main .control05 {
    letter-spacing: 0.05em;
  }
  #philosophy01 hgroup .main .control06 {
    letter-spacing: 0.01em;
  }

  #philosophy02 hgroup .main {
    letter-spacing: 0.1em;
    font-feature-settings: "palt";
  }
  #philosophy02 hgroup .main picture {
    width: 7.45em;
    left: 0;
    top: 0.42em;
  }
  #philosophy02 hgroup .main .control01 {
    letter-spacing: 0.12em;
  }
  #philosophy02 hgroup .main .control02 {
    letter-spacing: 0.04em;
  }
  #philosophy02 hgroup .main .control03 {
    letter-spacing: 0.04em;
  }
  #philosophy02 hgroup .main .control04 {
    letter-spacing: 0.18em;
  }
  #philosophy02 hgroup .main .control05 {
    letter-spacing: 0.11em;
  }
  #philosophy02 hgroup .main .control06 {
    letter-spacing: 0.03em;
  }
  #philosophy02 hgroup .main .control07 {
    letter-spacing: 0.01em;
  }
  #philosophy02 hgroup .main .control08 {
    letter-spacing: 0.01em;
  }
  #philosophy02 hgroup .main .control09 {
    letter-spacing: 0;
  }
  #philosophy02 hgroup .main .control10 {
    letter-spacing: 0.07em;
  }

  .philosophy_sec .text {
    font-size: 1.6rem;
  }
}
/* SVG画像
-------------------------------------------------------- */
.philosophy_sec .svg_img {
  width: 96%;
  margin-left: auto;
  margin-right: max(-14rem, var(--breack_through));
  position: relative;
  z-index: 0;
}
.philosophy_sec .svg_img .base_img {
  width: 100%;
  opacity: 0;
}

.philosophy_svg {
  position: absolute;
  z-index: 1;
}
.philosophy_svg path,
.philosophy_svg line {
  fill: none;
  stroke: #00b0a8;
  stroke-width: 3px;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dashoffset: 0;
}
.animation .philosophy_svg path,
.animation .philosophy_svg line {
  animation-timing-function: linear;
  animation-fill-mode: forwards;
}

@media screen and (max-width: 768px) {
  .philosophy_sec .svg_img {
    width: 168%;
    margin-top: 9rem;
    margin-left: -62%;
    margin-right: 0;
  }
  #philosophy02 .svg_img {
    width: 134%;
    margin-top: 0;
    margin-left: -16%;
  }
}

/* #philosophy01 SVG画像
-------------------------------------------------------- */
#philosophy01_01svg {
  width: 71.8%;
  bottom: 3.4%;
  left: 0;
}
#philosophy01_01svg path {
  stroke-dasharray: 1641.9px;
  stroke-dashoffset: 1641.9px;
}
.animation #philosophy01_01svg path {
  animation-name: philosophy01_01svg;
  animation-duration: 8s;
}
@keyframes philosophy01_01svg {
  0% {
    stroke-dashoffset: 1641.9px;
  }
  33% {
    stroke-dashoffset: 0;
  }
  60% {
    stroke-dashoffset: 0;
  }
  100% {
    stroke-dashoffset: 0;
  }
}
#philosophy01_02svg {
  width: 17.6%;
  bottom: 19.6%;
  left: 59%;
}
#philosophy01_02svg path {
  stroke-dasharray: 1404.7px;
  stroke-dashoffset: 1404.7px;
}
.animation #philosophy01_02svg path {
  animation-name: philosophy01_02svg;
  animation-duration: 8s;
}
@keyframes philosophy01_02svg {
  0% {
    stroke-dashoffset: 1404.7px;
  }
  33% {
    stroke-dashoffset: 1404.7px;
  }
  60% {
    stroke-dashoffset: 0;
  }
  100% {
    stroke-dashoffset: 0;
  }
}
#philosophy01_03svg {
  width: 42.8%;
  bottom: 0;
  left: 65%;
}
#philosophy01_03svg path {
  stroke-dasharray: 2022.4px;
  stroke-dashoffset: 2022.4px;
}
.animation #philosophy01_03svg path {
  animation-name: philosophy01_03svg;
  animation-duration: 8s;
}
@keyframes philosophy01_03svg {
  0% {
    stroke-dashoffset: 2022.4px;
  }
  33% {
    stroke-dashoffset: 2022.4px;
  }
  60% {
    stroke-dashoffset: 2022.4px;
  }
  100% {
    stroke-dashoffset: 0;
  }
}

@media screen and (max-width: 768px) {
}

/* #philosophy03 SVG画像
-------------------------------------------------------- */
#philosophy03_01svg {
  width: 57.4%;
  bottom: 1.1%;
  left: 0;
}
#philosophy03_01svg path {
  stroke-dasharray: 2887.2px;
  stroke-dashoffset: 2887.2px;
}
.animation #philosophy03_01svg path {
  animation-name: philosophy03_01svg;
  animation-duration: 8s;
}
@keyframes philosophy03_01svg {
  0% {
    stroke-dashoffset: 2887.2px;
  }
  43% {
    stroke-dashoffset: 0;
  }
  44.2% {
    stroke-dashoffset: 0;
  }
  52% {
    stroke-dashoffset: 0;
  }
  52.3% {
    stroke-dashoffset: 0;
  }
  70% {
    stroke-dashoffset: 0;
  }
  85% {
    stroke-dashoffset: 0;
  }
  85.4% {
    stroke-dashoffset: 0;
  }
  100% {
    stroke-dashoffset: 0;
  }
}
#philosophy03_02svg {
  width: 10.1%;
  bottom: 2%;
  left: 42%;
}
#philosophy03_02svg line {
  stroke-dasharray: 80.6px;
  stroke-dashoffset: 80.6px;
}
.animation #philosophy03_02svg line {
  animation-name: philosophy03_02svg;
  animation-duration: 8s;
}
@keyframes philosophy03_02svg {
  0% {
    stroke-dashoffset: 80.6px;
  }
  43% {
    stroke-dashoffset: 80.6px;
  }
  44.2% {
    stroke-dashoffset: 0;
  }
  52% {
    stroke-dashoffset: 0;
  }
  52.3% {
    stroke-dashoffset: 0;
  }
  70% {
    stroke-dashoffset: 0;
  }
  85% {
    stroke-dashoffset: 0;
  }
  85.4% {
    stroke-dashoffset: 0;
  }
  100% {
    stroke-dashoffset: 0;
  }
}
#philosophy03_03svg {
  width: 17.9%;
  bottom: 12.5%;
  left: 41.8%;
}
#philosophy03_03svg path {
  stroke-dasharray: 527px;
  stroke-dashoffset: 527px;
}
.animation #philosophy03_03svg path {
  animation-name: philosophy03_03svg;
  animation-duration: 8s;
}
@keyframes philosophy03_03svg {
  0% {
    stroke-dashoffset: 527px;
  }
  43% {
    stroke-dashoffset: 527px;
  }
  44.2% {
    stroke-dashoffset: 527px;
  }
  52% {
    stroke-dashoffset: 0;
  }
  52.3% {
    stroke-dashoffset: 0;
  }
  70% {
    stroke-dashoffset: 0;
  }
  85% {
    stroke-dashoffset: 0;
  }
  85.4% {
    stroke-dashoffset: 0;
  }
  100% {
    stroke-dashoffset: 0;
  }
}
#philosophy03_04svg {
  width: 1.3%;
  bottom: 37%;
  left: 58.2%;
}
#philosophy03_04svg path {
  stroke-dasharray: 18.2px;
  stroke-dashoffset: 18.2px;
}
.animation #philosophy03_04svg path {
  animation-name: philosophy03_04svg;
  animation-duration: 8s;
}
@keyframes philosophy03_04svg {
  0% {
    stroke-dashoffset: 18.2px;
  }
  43% {
    stroke-dashoffset: 18.2px;
  }
  44.2% {
    stroke-dashoffset: 18.2px;
  }
  52% {
    stroke-dashoffset: 18.2px;
  }
  52.3% {
    stroke-dashoffset: 0;
  }
  70% {
    stroke-dashoffset: 0;
  }
  85% {
    stroke-dashoffset: 0;
  }
  85.4% {
    stroke-dashoffset: 0;
  }
  100% {
    stroke-dashoffset: 0;
  }
}
#philosophy03_05svg {
  width: 26.2%;
  bottom: 0%;
  left: 48.9%;
}
#philosophy03_05svg path {
  stroke-dasharray: 1192.8px;
  stroke-dashoffset: 1192.8px;
}
.animation #philosophy03_05svg path {
  animation-name: philosophy03_05svg;
  animation-duration: 8s;
}
@keyframes philosophy03_05svg {
  0% {
    stroke-dashoffset: 1192.8px;
  }
  43% {
    stroke-dashoffset: 1192.8px;
  }
  44.2% {
    stroke-dashoffset: 1192.8px;
  }
  52% {
    stroke-dashoffset: 1192.8px;
  }
  52.3% {
    stroke-dashoffset: 1192.8px;
  }
  70% {
    stroke-dashoffset: 0;
  }
  85% {
    stroke-dashoffset: 0;
  }
  85.4% {
    stroke-dashoffset: 0;
  }
  100% {
    stroke-dashoffset: 0;
  }
}
#philosophy03_06svg {
  width: 21%;
  bottom: 30%;
  left: 48.9%;
}
#philosophy03_06svg path {
  stroke-dasharray: 1006.7px;
  stroke-dashoffset: 1006.7px;
}
.animation #philosophy03_06svg path {
  animation-name: philosophy03_06svg;
  animation-duration: 8s;
}
@keyframes philosophy03_06svg {
  0% {
    stroke-dashoffset: 1006.7px;
  }
  43% {
    stroke-dashoffset: 1006.7px;
  }
  44.2% {
    stroke-dashoffset: 1006.7px;
  }
  52% {
    stroke-dashoffset: 1006.7px;
  }
  52.3% {
    stroke-dashoffset: 1006.7px;
  }
  70% {
    stroke-dashoffset: 1006.7px;
  }
  85% {
    stroke-dashoffset: 0;
  }
  85.4% {
    stroke-dashoffset: 0;
  }
  100% {
    stroke-dashoffset: 0;
  }
}
#philosophy03_07svg {
  width: 1.6%;
  bottom: 43%;
  left: 68.2%;
}
#philosophy03_07svg path {
  stroke-dasharray: 19px;
  stroke-dashoffset: 19px;
}
.animation #philosophy03_07svg path {
  animation-name: philosophy03_07svg;
  animation-duration: 8s;
}
@keyframes philosophy03_07svg {
  0% {
    stroke-dashoffset: 19px;
  }
  43% {
    stroke-dashoffset: 19px;
  }
  44.2% {
    stroke-dashoffset: 19px;
  }
  52% {
    stroke-dashoffset: 19px;
  }
  52.3% {
    stroke-dashoffset: 19px;
  }
  70% {
    stroke-dashoffset: 19px;
  }
  85% {
    stroke-dashoffset: 19px;
  }
  85.4% {
    stroke-dashoffset: 0;
  }
  100% {
    stroke-dashoffset: 0;
  }
}
#philosophy03_08svg {
  width: 34%;
  bottom: 1%;
  left: 65.9%;
}
#philosophy03_08svg path {
  stroke-dasharray: 990.2px;
  stroke-dashoffset: 990.2px;
}
.animation #philosophy03_08svg path {
  animation-name: philosophy03_08svg;
  animation-duration: 8s;
}
@keyframes philosophy03_08svg {
  0% {
    stroke-dashoffset: 990.2px;
  }
  43% {
    stroke-dashoffset: 990.2px;
  }
  44.2% {
    stroke-dashoffset: 990.2px;
  }
  52% {
    stroke-dashoffset: 990.2px;
  }
  52.3% {
    stroke-dashoffset: 990.2px;
  }
  70% {
    stroke-dashoffset: 990.2px;
  }
  85% {
    stroke-dashoffset: 990.2px;
  }
  85.4% {
    stroke-dashoffset: 990.2px;
  }
  100% {
    stroke-dashoffset: 0;
  }
}

@media screen and (max-width: 768px) {
}

/* =====
	CULTURE
======================================================== */
.philosophy_sec02 .lower_title .main {
  margin-bottom: 0.5em;
}
.philosophy_sec02 .lower_title .sub {
  font-size: 4.2857em; /* 60/14 */
}
.philosophy_sec02 h3.animation .text_fader_primary {
  animation-duration: 2s;
}

@media screen and (max-width: 768px) {
}

/* あとひとつを足す。〜 ONE FOR ALLを足す。
-------------------------------------------------------- */
#philosophy_culture .list > li {
  width: 48%;
  max-width: 46rem;
  margin-bottom: 8rem;
}
#philosophy_culture .list > li:nth-last-of-type(-n + 2) {
  margin-bottom: 0;
}

#philosophy_culture .list > li .img {
  margin-bottom: 2.25rem;
}
#philosophy_culture .list > li h3 {
  font-size: 3rem;
  font-weight: 700;
  color: var(--blue);
  line-height: 1.5;
  margin-bottom: 0.25em;
}

@media screen and (max-width: 768px) {
  #philosophy_culture .list > li {
    width: 100%;
    max-width: none;
    margin-bottom: 8rem;
  }
  #philosophy_culture .list > li:nth-last-of-type(-n + 2) {
    margin-bottom: 8rem;
  }
  #philosophy_culture .list > li:nth-last-of-type(1) {
    margin-bottom: 0;
  }

  #philosophy_culture .list > li .img {
    margin-bottom: 3rem;
  }

  #philosophy_culture .list > li h3 {
    font-size: 2.7rem;
    margin-bottom: 0.33em;
  }

  #philosophy_culture .list > li .text {
    font-size: 1.6rem;
  }
}

/* =====
	代表の声
======================================================== */
#president_message .text_container .name {
  text-align: right;
}
#president_message .text_container .name .sub,
#president_message .text_container .name .main {
  display: block;
}

#president_message .text_container .name .main .big {
  display: inline-block;
  font-size: 1.5em;
  margin-left: 0.85em;
}

@media screen and (max-width: 768px) {
  #president_message .lower_title .sub {
    font-size: 3.214em; /* 45/14 */
  }

  #president_message .text_container {
    font-size: 1.6rem;
  }

  #president_message .text_container .name .main .big {
    font-size: 1em;
  }
}

/************************************************************************
	役員紹介
**************************************************************************/
/* =====
	MV
======================================================== */
#officer_mv01svg {
  width: 60%;
  left: -4%;
  bottom: 4%;
}
#officer_mv01svg path {
  stroke-dasharray: 3887.5px;
  stroke-dashoffset: 3887.5px;
}
.animation #officer_mv01svg path {
  animation-name: officer_mv01svg;
  animation-duration: 8s;
}
#officer_mv02svg {
  width: 72.4%;
  left: 31%;
  bottom: 22.4%;
}
#officer_mv02svg path {
  stroke-dasharray: 3146.6px;
  stroke-dashoffset: 3146.6px;
}
.animation #officer_mv02svg path {
  animation-name: officer_mv02svg;
  animation-duration: 8s;
}

@keyframes officer_mv01svg {
  0% {
    stroke-dashoffset: 3887.5px;
  }
  48% {
    stroke-dashoffset: 0;
  }
  100% {
    stroke-dashoffset: 0;
  }
}
@keyframes officer_mv02svg {
  0% {
    stroke-dashoffset: 3146.6px;
  }
  48% {
    stroke-dashoffset: 3146.6px;
  }
  100% {
    stroke-dashoffset: 0;
  }
}

@media screen and (max-width: 768px) {
  #officer_mv01svg {
    width: 110%;
    left: -29%;
    bottom: 20.5%;
  }

  #officer_mv02svg {
    width: 135%;
    left: 36%;
    bottom: 32%;
  }
}

/* =====
	一覧
======================================================== */
#officer_area {
  width: 92%;
  max-width: 92rem;
  padding: 10rem 0;
  margin-inline: auto;
}

.officer_list > li {
  max-width: 29.4rem;
  width: 31%;
  margin: 0 auto 8rem;
}
.officer_list > li:nth-of-type(7) {
  margin: 0 auto;
}

.officer_list > li .img {
  margin-bottom: 2.5rem;
  border-radius: 0.3rem;
  overflow: hidden;
}

.officer_list > li .name_group {
  text-align: center;
  line-height: 1.5;
}
.officer_list > li .name_group .post {
  font-size: 1.4rem;
  color: var(--light-blue02);
  letter-spacing: 0.15em;
  margin-bottom: 0.5em;
}
.officer_list > li .name_group .name {
  font-family: var(--yu-gothic);
  font-size: 2.8rem;
  font-weight: 500;
  letter-spacing: 0.1em;
}
.officer_list > li .name_group .sub {
  font-family: var(--en);
  font-size: 1.2rem;
  color: rgba(0, 0, 0, 0.5);
  letter-spacing: 0.1em;
}

@media screen and (max-width: 768px) {
  #officer_area {
    width: 75%;
    padding: 8rem 0;
  }

  .officer_list > li {
    width: 100%;
    max-width: none;
    margin-bottom: 6rem;
  }

  .officer_list > li .img {
    margin-bottom: 1.5rem;
    border-radius: 0.5rem;
  }

  .officer_list > li .name_group .post {
    margin-bottom: 0;
  }
  .officer_list > li .name_group .name {
    font-size: 2.2rem;
  }
}

/* 
-------------------------------------------------------- */

@media screen and (max-width: 768px) {
}

/* 
-------------------------------------------------------- */

@media screen and (max-width: 768px) {
}

/************************************************************************
	NEWS一覧
**************************************************************************/
/* =====
	タブ切替
======================================================== */
.news_tab_list {
  display: -webkit-box;
  display: flex;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  justify-content: space-between;
  max-width: 80rem;
  margin: 0 auto 10rem;
}
.news_tab_list > li {
  font-family: var(--en);
  font-size: 1.5rem;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  width: 32%;
  max-width: 23rem;
  margin-bottom: 1.5em;
}
.news_tab_list > li:nth-last-of-type(-n + 3) {
  margin-bottom: 0;
}
.news_tab_list > li a,
.news_tab_list > li .current {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  align-items: center;
  min-height: 3.267em; /* 49/15 */
  border-radius: 0.3em;
}
.news_tab_list > li a {
  box-shadow: var(--shadow_primary);
  background-color: rgba(255, 255, 255, 0.8);
}
.news_tab_list > li a:hover {
  background-color: rgba(255, 255, 255, 0.15);
}
.news_tab_list > li .current {
  color: #fff;
  box-shadow: inset 0 0 0.75em 0 rgba(255, 255, 255, 0.4);
  background-color: rgba(0, 0, 255, 0.7);
}

@media screen and (max-width: 768px) {
  .news_tab_list {
    flex-wrap: wrap;
    margin-bottom: 10rem;
  }
  .news_tab_list > li {
    width: 48%;
    max-width: none;
  }
  .news_tab_list > li:nth-last-of-type(-n + 3) {
    margin-bottom: 1.5em;
  }
  .news_tab_list > li:nth-last-of-type(-n + 2) {
    margin-bottom: 0;
  }
}

/* =====
	一覧
======================================================== */
.news-list {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: repeat(3, min(28.2rem, 31.4%));
  grid-template-columns: repeat(3, min(28.2rem, 31.4%));
  grid-row-gap: 5.5rem;
  -webkit-box-pack: justify;
  justify-content: space-between;
  padding-bottom: 10rem;
}

.news-list > li a {
  display: block;
}
.news-list > li .thumb {
  margin-bottom: 0.75rem;
  border-radius: 0.5rem;
  position: relative;
  overflow: hidden;
}
.news-list > li .thumb::before {
  content: "";
  display: block;
  padding-top: 56.25%;
}
.news-list > li .thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  transition: transform 0.4s;
}
.news-list > li a:hover .thumb img {
  transform: scale(1.1);
}

.news-list > li .title {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2; /* 任意の行数を指定 */
  max-height: 3.75em; /* 古いSafariで、heightを指定しないとoverflow:hidden;が効かないみたいなので。 */
  line-height: 1.875;
  transition: color 0.4s;
}
.news-list > li a:hover .title {
  color: #757575;
}
@media screen and (max-width: 768px) {
  .news-list {
    display: block;
    padding-bottom: 8rem;
  }

  .news-list > li {
    margin-bottom: 8rem;
  }
  .news-list > li:nth-last-of-type(1) {
    margin-bottom: 0;
  }

  .news-list > li .thumb {
    margin-bottom: 1.5rem;
  }

  .news-list > li .title {
    font-size: 1.6rem;
  }
}

/* カテゴリ
-------------------------------------------------------- */
.date_cat {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
}
.news-list .date_cat {
  display: block;
  margin-bottom: 1rem;
}

.date_cat .date {
  font-family: var(--inder);
  color: #9c9999;
  margin-right: 1.25em;
}
.news-list .date_cat .date {
  font-size: 1.4rem;
  margin-bottom: 0.3em;
}

.date_cat .cat_box {
  display: -webkit-box;
  display: flex;
}
.date_cat .cat {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  align-items: center;
  font-family: var(--en);
  font-size: 1.2rem;
  font-weight: 500;
  color: #fff;
  line-height: 1.1;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  width: 7.34em; /* 88/12 */
  height: 2.5em; /* 30/12 */
  padding: 0.1em;
  margin-right: 0.5em;
  border-radius: 0.2em;
  overflow: hidden;
  transition:
    -webkit-filter 0.4s,
    -moz-filter 0.4s,
    filter 0.4s;
}
.news-list > li a:hover .date_cat .cat {
  -webkit-filter: brightness(107%);
  -moz-filter: brightness(107%);
  filter: brightness(107%);
}

.date_cat .cat.topics_cat {
  background-image: -webkit-linear-gradient(
    900deg,
    #afe2ff 0%,
    var(--light-blue02) 120%
  );
  background-image: linear-gradient(
    180deg,
    #afe2ff 0%,
    var(--light-blue02) 120%
  );
}
.date_cat .cat.press_cat {
  background-image: -webkit-linear-gradient(90deg, #dbd3e4 0%, #ad92cc 100%);
  background-image: linear-gradient(180deg, #dbd3e4 0%, #ad92cc 100%);
}
.date_cat .cat.media_cat {
  background-image: -webkit-linear-gradient(90deg, #f9ecda 0%, #f9c071 100%);
  background-image: linear-gradient(180deg, #f9ecda 0%, #f9c071 100%);
}
.date_cat .cat.owner_cat {
  background-image: -webkit-linear-gradient(90deg, #8d8d8d 0%, #1a1a1a 100%);
  background-image: linear-gradient(180deg, #8d8d8d 0%, #1a1a1a 100%);
}
.date_cat .cat.career_cat {
  background-image: -webkit-linear-gradient(
    90deg,
    #a5ece9 0%,
    var(--green) 100%
  );
  background-image: linear-gradient(180deg, #a5ece9 0%, var(--green) 100%);
}

@media screen and (max-width: 768px) {
  .news-list .date_cat .date {
    font-size: 1.4rem;
  }
}

/* =====
	ページャー
======================================================== */
.wp-pagenavi {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: center;
  justify-content: center;
  font-family: var(--en);
  font-size: 1.5rem;
  color: rgba(0, 0, 0, 0.5);
  text-align: center;
  position: relative;
  z-index: 1;
}

.wp-pagenavi a,
.wp-pagenavi span {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  align-items: center;
  line-height: 1;
  width: 2.67em; /* 40/16 */
  height: 2.67em;
  border-radius: 50%;
  box-shadow: var(--shadow_primary);
  background-color: #fff;
  position: relative;
}
.wp-pagenavi a:hover {
  opacity: 0.8;
}

.wp-pagenavi a::before,
.wp-pagenavi span::before {
  content: "";
  display: block;
  width: calc(100% + 4px);
  height: calc(100% + 4px);
  border-radius: 50%;
  background-image: -webkit-linear-gradient(
    170deg,
    rgba(156, 153, 153, 0.05) 0%,
    #ffffff 50%,
    rgba(255, 255, 255, 0.05) 100%
  );
  background-image: linear-gradient(
    260deg,
    rgba(156, 153, 153, 0.05) 0%,
    #ffffff 50%,
    rgba(255, 255, 255, 0.05) 100%
  );
  /* background-color: #000; */
  position: absolute;
  left: -2px;
  top: -2px;
  z-index: -1;
}

.wp-pagenavi .current {
  color: #fff;
  background-color: rgba(0, 0, 255, 0.6);
  margin: 0 0.35em;
}
.wp-pagenavi .current::before {
  background-image: linear-gradient(
    170deg,
    rgba(156, 153, 153, 0.05) 0%,
    #ffffff 50%,
    rgba(255, 255, 255, 0.05) 100%
  );
  background-image: linear-gradient(
    260deg,
    rgba(156, 153, 153, 0.05) 0%,
    #ffffff 50%,
    rgba(255, 255, 255, 0.05) 100%
  );
}

.wp-pagenavi .page {
  margin: 0 0.35em;
}

.wp-pagenavi .previouspostslink,
.wp-pagenavi .nextpostslink {
  overflow: hidden;
  text-indent: -999999999999px;
}

.wp-pagenavi .previouspostslink {
  margin-right: 1em;
}

.wp-pagenavi .nextpostslink {
  margin-left: 1em;
}

.wp-pagenavi .previouspostslink::after,
.wp-pagenavi .nextpostslink::after {
  content: "";
  display: block;
  width: 0.6em;
  height: 0.6em;
  -webkit-mask: url(../img/cmn/pager_arrow.svg) no-repeat center/contain;
  mask: url(../img/cmn/pager_arrow.svg) no-repeat center/contain;
  background-color: #000;
  position: absolute;
  left: calc(50% - 0.3em);
  top: calc(50% - 0.3em);
  transition: 0.4s;
}

.wp-pagenavi .nextpostslink::after {
  transform: scale(-1, 1);
}

@media screen and (max-width: 768px) {
  .wp-pagenavi .current {
    margin: 0 0.25em;
  }
  .wp-pagenavi .page {
    margin: 0 0.25em;
  }
  .wp-pagenavi .previouspostslink {
    margin-right: 0.75em;
  }
  .wp-pagenavi .nextpostslink {
    margin-left: 0.75em;
  }
}

/* 
-------------------------------------------------------- */

@media screen and (max-width: 768px) {
}

/************************************************************************
	NEWS詳細
**************************************************************************/
/* =====
	エディター以外の部分
======================================================== */
#single .single_inner {
  padding: 19rem 0 20rem;
}
#single article {
  border-bottom: 1px solid rgba(0, 0, 255, 0.15);
}
#single article .date_cat {
  margin-bottom: 2.5rem;
}
#single article h1 {
  font-size: 2.8rem;
  line-height: 1.357;
  letter-spacing: 0.125em;
}

#single article .content {
  padding: 5rem 0 2rem;
}

#single .single_sns_wrapper {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: end;
  justify-content: flex-end;
  width: 92%;
  padding-top: 2.5rem;
  margin-inline: auto;
}
#single .single_sns_wrapper > a {
  display: block;
  width: 5rem;
  height: 5rem;
  margin-left: 2.5%;
  border-radius: 50%;
}
#single .single_sns_wrapper > a img {
  width: 100%;
}
#single .single_sns_wrapper > a:hover {
  opacity: 0.7;
}

@media screen and (max-width: 768px) {
  #single .single_inner {
    padding: 16rem 0 11rem;
  }
  #single article .date_cat {
    margin-bottom: 4rem;
  }
  #single article .date_cat .date {
    font-size: 1.6rem;
  }

  #single article h1 {
    font-size: 2rem;
    line-height: 1.9;
    letter-spacing: 0.175em;
  }

  #single article .content {
    font-size: 1.6rem;
    padding: 7.5rem 0 1rem;
  }

  #single .single_sns_wrapper {
    padding-top: 3.5rem;
  }
  #single .single_sns_wrapper > a {
    margin-left: 7.5%;
  }
}

/* エディター内
-------------------------------------------------------- */
#single article .content p {
  margin-bottom: 2em;
}

#single article .content h3 {
  font-size: 2rem;
  line-height: 1.5;
  letter-spacing: 0.16em;
  padding: 0.5em 1em 0.5em 2em;
  margin-bottom: 1.5em;
  border-radius: 0.25em;
  background-color: #fff;
  position: relative;
}
#single article .content h3::before {
  content: "";
  display: block;
  width: 0.25em;
  height: calc(100% - 1em);
  border-radius: 1px;
  background-color: var(--blue);
  position: absolute;
  left: 1em;
  top: 0.5em;
}

#single article .content .wp-caption {
  max-width: 100%;
}
#single article .content .wp-caption-text {
  margin-bottom: 0;
}

#single article .content a {
  color: var(--green);
  text-decoration: underline;
}
#single article .content a:visited {
  color: #8f8f8f;
}
#single article .content a:hover {
  color: var(--light-blue02);
  font-weight: 500;
}

@media screen and (max-width: 768px) {
  #single article .content h3 {
    margin-bottom: 1.75em;
  }
}

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

@media screen and (max-width: 768px) {
}

/* 
-------------------------------------------------------- */

@media screen and (max-width: 768px) {
}

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

@media screen and (max-width: 768px) {
}

/* 
-------------------------------------------------------- */

@media screen and (max-width: 768px) {
}

/************************************************************************
	CONTACT一覧
**************************************************************************/
/* =====
	一覧部分
======================================================== */
/* アイコン・タイトル部分
-------------------------------------------------------- */
/* 678　793 */
.contact-list {
  display: -webkit-box;
  display: flex;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  justify-content: space-between;
  width: 86%;
  margin-inline: auto;
}

.contact-list > li {
  --detailHeight: 0;
  width: 48.2%;
  margin-bottom: 3rem;
  position: relative;
  z-index: 1;
  animation: contact_close 0.6s ease-out forwards;
}
.contact-list > li.acc_open {
  z-index: 2;
  animation: contact_acc 0.6s ease-out forwards;
}

@keyframes contact_acc {
  0% {
    margin-bottom: 3rem;
  }
  100% {
    margin-bottom: calc(var(--detailHeight) + 3rem);
  }
}
@keyframes contact_close {
  0% {
    margin-bottom: calc(var(--detailHeight) + 3rem);
  }
  100% {
    margin-bottom: 3rem;
  }
}

.contact-list > li .title_container {
  cursor: pointer;
  height: 38.6rem;
  padding: 5.25rem 2% 4.5rem;
  border-radius: 0.5rem;
  box-shadow: var(--shadow_primary);
  background-color: #fff;
  position: relative;
  z-index: 1;
  transition: background-color 0.4s;
}
.contact-list > li .title_container:hover {
  background-color: rgba(255, 255, 255, 0.8);
}

.contact-list > li .title_container .img {
  width: 17rem;
  height: 18rem;
  margin: 0 auto 4.5rem;
  position: relative;
}
.contact-list > li:nth-of-type(8) .title_container .img {
  width: 18.6rem;
}

.contact-list > li .title_container .img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  margin: auto;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  transition: transform 0.4s;
}
.contact-list > li .title_container:hover .img img {
  transform: scale(1.1);
}

.contact-list > li .title_container .title {
  font-family: var(--yu-gothic);
  font-size: 2rem;
  font-weight: 700;
  color: var(--light-blue02);
  line-height: 1.5;
  text-align: center;
}
.contact-list > li .title_container .title .supple_title {
  font-size: 0.75em; /* 15/20 */
  margin-top: 0.5em;
}

@media screen and (max-width: 768px) {
  .contact-list {
    display: block;
    width: 100%;
  }
  .contact-list > li {
    width: 100%;
  }

  .contact-list > li .title_container {
    display: -webkit-box;
    display: flex;
    -webkit-box-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    align-items: center;
    height: auto;
    padding: 2.25rem 6%;
  }

  .contact-list > li .title_container .img {
    width: 12rem;
    height: 12rem;
    margin: 0;
  }
  .contact-list > li:nth-of-type(8) .title_container .img {
    width: 12rem;
  }

  .contact-list > li .title_container .title {
    font-size: 1.6rem;
    text-align: left;
    width: fit-content;
    max-width: calc(96% - 12rem);
  }
  .contact-list > li .title_container .title .supple_title {
    font-size: 0.875em; /* 14/16 */
    margin-top: 0.5em;
  }
}

/* アコーディオン後部分
-------------------------------------------------------- */
.contact-list > li .detail_container {
  visibility: hidden;
  opacity: 0;
  transform: translateY(-2rem);
  transition:
    visibility 0.6s,
    opacity 0.6s,
    transform 0.6s;
  color: #fff;
  width: calc(
    100% / 0.482 / 0.86
  ); /* (.inner * 86% → .contact-list * 48.2% = li)の逆算 */
  padding: 7.5rem 16.8% 3.5rem;
  background: url(../img/contact/detail_bg.png) no-repeat top left / 100% 100%;
  position: absolute;
  left: calc(100% / 0.482 * (-0.07 * (800 / 688)));
  /* .contact-listの大きさ基準で -7%にしたい。　*.07では足りなかったので、(.inner/.contact-list)の倍率を乗せたらうまくいった。 */
  top: calc(100% - 1rem);
  z-index: 2;
}
.contact-list > li:nth-of-type(2n) .detail_container {
  background: url(../img/contact/detail_bg02.png) no-repeat top right / 100%
    100%;
  left: auto;
  right: calc(100% / 0.482 * (-0.07 * (800 / 688)));
}
.contact-list > li.acc_open .detail_container {
  visibility: visible;
  opacity: 1;
  transform: translateY(0);
}

.contact-list > li .detail_container .detail_title {
  font-size: 1.8rem;
  margin-bottom: 1.25em;
}

.contact-list > li .detail_container .btn_wrapper {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
}
.contact-list > li .detail_container .btn_wrapper .btn_supple {
  font-size: 1.3rem;
  line-height: 1.5;
  letter-spacing: 0.04em;
}
.contact-list > li .detail_container .btn {
  flex-shrink: 0;
  display: block;
  color: var(--light-blue02);
  max-width: 32.7rem;
  width: 100%;
  padding: 0.5em 3em 0.5em 1.25em;
  border-radius: 0.3em;
  box-shadow: var(--shadow_primary);
  background-color: #fff;
  position: relative;
}
.contact-list > li .detail_container .btn_wrapper .btn {
  width: 70%;
  margin-right: 3.5%;
}
.contact-list > li .detail_container .btn:hover {
  background-color: rgba(255, 255, 255, 0.8);
}
.contact-list > li .detail_container .btn::after {
  content: "";
  display: block;
  width: 2em;
  height: 2em;
  border-radius: 50%;
  background: var(--light-blue02) url(../img/cmn/arrow01_wh.svg) no-repeat
    center/50%;
  position: absolute;
  right: 1em;
  top: calc(50% - 1em);
}

.contact-list > li .detail_container .other_contact_wrapper {
  display: -webkit-box;
  display: flex;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  justify-content: space-between;
  font-size: 1.3rem;
  padding-top: 2.5rem;
}

.contact-list > li .detail_container .other_contact_wrapper .time_box {
  width: 50%;
}
.contact-list > li .detail_container .other_contact_wrapper .time {
  line-height: 1.5;
  padding-left: 4.5em;
  position: relative;
}
.contact-list > li .detail_container .other_contact_wrapper .time::before {
  content: "";
  display: block;
  width: 2.84em; /* 37/13 */
  height: 2.84em;
  background: url(../img/contact/icon_time.svg) no-repeat center/contain;
  position: absolute;
  left: 0;
  top: calc(50% - 0.1.42em);
}
.contact-list > li .detail_container .other_contact_wrapper .time .sub {
  margin-right: 1.5em;
}
.contact-list > li .detail_container .other_contact_wrapper .time .main {
  font-family: var(--en);
  font-size: 2.154em; /* 28/13 */
  font-weight: 500;
}
.contact-list
  > li
  .detail_container
  .other_contact_wrapper
  .time_box
  .supple_text {
  font-size: 1.3rem;
  line-height: 1.5;
  padding-top: 0.5em;
}

.contact-list > li .detail_container .other_contact_wrapper .right_box {
  width: 48%;
}

.contact-list > li .detail_container .other_contact_wrapper .right_box > * {
  margin-bottom: 1.5em;
}
.contact-list
  > li
  .detail_container
  .other_contact_wrapper
  .right_box
  > *:nth-last-child(1) {
  margin-bottom: 0;
}

.contact-list > li .detail_container .other_contact_wrapper .line {
  line-height: 1.5;
  padding-left: 4.25em;
  position: relative;
}
.contact-list > li .detail_container .other_contact_wrapper .line::before {
  content: "";
  display: block;
  width: 2.84em; /* 37/13 */
  height: 2.84em;
  background: url(../img/contact/icon_line.svg) no-repeat center/contain;
  position: absolute;
  left: 0;
  top: calc(50% - 1.42em);
}

.contact-list > li .detail_container .other_contact_wrapper .mail {
  font-family: var(--en);
  font-size: 1.23em; /* 16/13 */
  letter-spacing: 0.03em;
  line-height: 1.5;
  width: fit-content;
  padding-left: 3em;
  padding-right: 3.5em;
  position: relative;
}
.contact-list > li .detail_container .other_contact_wrapper .mail::before {
  content: "";
  display: block;
  width: 2.31em; /* 37/16 */
  height: 2.31em;
  background: url(../img/contact/icon_mail.svg) no-repeat center/contain;
  position: absolute;
  left: 0;
  top: calc(50% - 1.155em);
}
.contact-list > li .detail_container .other_contact_wrapper .mail_copy {
  display: block;
  width: 2.2em;
  height: 2.2em;
  padding: 0.2em;
  background: none;
  position: absolute;
  right: 0;
  top: calc(50% - 1.1em);
}
.contact-list > li .detail_container .other_contact_wrapper .mail_copy:hover {
  opacity: 0.8;
}
.contact-list
  > li
  .detail_container
  .other_contact_wrapper
  .mail
  .copy_message {
  display: block;
  font-size: 0.75em;
  font-weight: 500;
  color: var(--light-blue02);
  padding: 0.15em 0.5em;
  background-color: #fff;
  position: absolute;
  top: calc(100% + 0.5em);
  animation: copy_message 0.8s ease-out forwards;
}
@keyframes copy_message {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

.contact-list > li .detail_container .other_contact_wrapper .tel {
  display: block;
  font-family: var(--en);
  font-size: 1.23em; /* 16/13 */
  line-height: 1.5;
  padding-left: 3em;
  position: relative;
}
.contact-list > li .detail_container .other_contact_wrapper .tel::before {
  content: "";
  display: block;
  width: 2.31em; /* 37/16 */
  height: 2.31em;
  background: url(../img/contact/icon_tel.svg) no-repeat center/contain;
  position: absolute;
  left: 0;
  top: calc(50% - 1.155em);
}

.contact-list > li .detail_container .other_contact_wrapper .tel .supple {
  font-size: 0.6875em; /* 11/16 */
  font-family: var(--font_primary);
  display: block;
}

@media screen and (max-width: 768px) {
  .contact-list > li {
    margin-bottom: 50rem;
  }
  .contact-list > li .detail_container {
    width: 100%;
    padding: 5rem 4% 3.5rem;
    background: url(../img/contact/detail_bg_sp.png) no-repeat top center / 100%
      100%;
    left: 0;
    top: calc(100% - 1rem);
    z-index: 0;
  }
  .contact-list > li:nth-of-type(2n) .detail_container {
    background: url(../img/contact/detail_bg_sp.png) no-repeat top center / 100%
      100%;
    left: 0;
    right: auto;
  }

  .contact-list > li .detail_container .detail_title {
    font-size: 1.6rem;
    line-height: 1.875;
  }

  .contact-list > li .detail_container .btn_wrapper {
    display: block;
  }
  .contact-list > li .detail_container .btn {
    max-width: none;
  }
  .contact-list > li .detail_container .btn_wrapper .btn {
    width: 100%;
    margin-right: 0;
    margin-bottom: 0.5em;
  }

  .contact-list > li .detail_container .other_contact_wrapper {
    display: block;
    padding-top: 2rem;
  }

  .contact-list > li .detail_container .other_contact_wrapper .time_box {
    width: 100%;
    margin-bottom: 2rem;
  }

  .contact-list > li .detail_container .other_contact_wrapper .time .main {
    font-size: 1.92em; /* 25/13 */
  }
  .contact-list
    > li
    .detail_container
    .other_contact_wrapper
    .time_box
    .supple_text {
    padding-top: 0.75em;
  }

  .contact-list > li .detail_container .other_contact_wrapper .right_box {
    width: 100%;
  }

  .contact-list > li .detail_container .other_contact_wrapper .right_box > * {
    margin-bottom: 2em;
  }

  .contact-list > li .detail_container .other_contact_wrapper .mail {
    padding-right: 3em;
  }

  .contact-list > li .detail_container .other_contact_wrapper .tel .tel_text {
    text-decoration: underline;
  }
  .contact-list
    > li
    .detail_container
    .other_contact_wrapper
    .tel:hover
    .tel_text {
    text-decoration: none;
  }
}

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

@media screen and (max-width: 768px) {
}

/* 
-------------------------------------------------------- */

@media screen and (max-width: 768px) {
}

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

@media screen and (max-width: 768px) {
}

/* 
-------------------------------------------------------- */

@media screen and (max-width: 768px) {
}

/************************************************************************
	フォーム
**************************************************************************/
.contact-form {
  padding: 10rem 0 14rem;
}

.contact-form a:visited {
  color: #8f8f8f;
}
.contact-form a:hover {
  color: var(--light-blue02);
}

.form-item {
  display: -webkit-box;
  display: flex;
  line-height: 1.875; /* 30/16 */
  margin-bottom: 3.25em;
}

.form-item > dt {
  width: 13em;
  padding-top: 1em;
  padding-left: 2em;
  position: relative;
}
.form-item:has(.is-required) > dt::before {
  content: "\203B";
  color: var(--red);
  position: absolute;
  transform: translateX(-1.5em);
}

.form-item > dd {
  width: calc(100% - 13em);
}

@media screen and (max-width: 768px) {
  .contact-form {
    font-size: 1.6rem;
    padding: 10rem 0 6rem;
  }

  .form-item {
    display: block;
    margin-bottom: 2em;
  }

  .form-item > dt {
    width: 100%;
    padding-top: 0;
    padding-left: 1.5em;
    margin-bottom: 0.75em;
  }

  .form-item > dd {
    width: 100%;
  }
}

/* =====
	inputなどフォーム内要素
======================================================== */
/* input全般
-------------------------------------------------------- */
::placeholder {
  color: #9c9999;
}
.contact-form input[type="text"],
.contact-form input[type="email"],
.contact-form input[type="tel"],
.contact-form textarea {
  width: 100%;
  padding: 1.1em 1.5em;
  border-radius: 0.5rem;
  background-color: #fff;
}

.contact-form textarea {
  height: 12.5em; /* 200px */
}

@media screen and (max-width: 768px) {
  .contact-form input[type="text"],
  .contact-form input[type="email"],
  .contact-form input[type="tel"],
  .contact-form textarea {
    padding: 1em 1.5em;
  }

  .contact-form textarea {
    height: 11.25em; /* 180px */
  }
}

/* select
-------------------------------------------------------- */
.contact-form .your-title-select {
  width: 100%;
  position: relative;
}

.contact-form .your-title-select::after {
  content: "";
  display: block;
  width: 1.2em;
  height: 0.6em;
  background: url(../img/cmn/select_arrow.svg) no-repeat center/contain;
  position: absolute;
  right: 2em;
  top: calc(50% - 0.3em);
}

.contact-form .your-title-select select {
  appearance: base-select; /* optionを装飾するため */
  width: 100%;
  padding: 1.1em 3.4em 1.1em 1em;
  background-color: #fff;
  border-radius: 0.5rem;
  position: relative;
}
.contact-form .your-title-select select::picker-icon {
  display: none; /* appearance: base-select;　にしたら出現したので */
}
.contact-form .your-title-select select::picker(select) {
  appearance: base-select;
  padding: 1rem 0;
  border: none;
  border-radius: 0.5rem;
  box-shadow: 0 0.2rem 1.4rem -0.2rem rgba(0, 0, 0, 0.3);
  background-color: #e3e4e6;
}
.contact-form .your-title-select select option {
  padding: 0.25em 1.5em;
}
.contact-form .your-title-select select option::checkmark {
  content: "";
  display: inline-block;
  width: 0.86em;
  height: 0.7em;
  margin-right: 0.5em;
  background: url(../img/cmn/icon_check_black.svg) no-repeat center/contain;
}

@media screen and (max-width: 768px) {
  .contact-form .your-title-select select {
    padding: 1em 3em 1em 1em;
  }
  .contact-form .your-title-select::after {
    right: 1.6em;
  }

  .contact-form .your-title-select select::picker(select) {
    padding: 0;
  }
  .contact-form .your-title-select select option {
    padding: 0.6em 1.5em;
    border-top: 1px solid #cdced1;
  }
  .contact-form .your-title-select select option:nth-of-type(1) {
    border: none;
  }
}

/* チェック
-------------------------------------------------------- */
.form-check {
  padding: 2.5em 0 3em;
}

.form-check .c-form-checkbox {
  display: block;
  width: fit-content;
  margin-inline: auto;
  position: relative;
  padding-left: 1.5em;
}
.form-check .c-form-checkbox:has(input[type="checkbox"]) {
  padding-left: 2.25em;
}
.form-check .c-form-checkbox a {
  display: inline-block;
  text-decoration: underline;
  position: relative;
  z-index: 1;
}
.form-check .c-form-checkbox a:hover {
  text-decoration: none;
}

.form-check .wpcf7-form-control-wrap {
  position: absolute;
  left: 0;
}
.form-check input[type="checkbox"] {
  cursor: pointer;
  display: inline-block;
  width: 100%;
  height: 100%;
  margin: 0;
  position: absolute;
  left: 0;
  top: 0.33em;
}
.form-check input[type="checkbox"]::before {
  content: "";
  display: block;
  width: 1.5em;
  height: 1.5em;
  border: 1px solid #000;
  background-color: #fff;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
  transition: background-color 0.4s;
}
.form-check input[type="checkbox"]::after {
  content: "";
  display: block;
  width: 1.5em;
  height: 1.5em;
  background: url(../img/cmn/checkbox_icon.svg) no-repeat center/60% 60%;
  opacity: 0;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
  transition: opacity 0.2s;
}
.form-check input[type="checkbox"]:checked::after {
  opacity: 1;
}

.form-check .wpcf7-list-item-label {
  display: none;
}

@media screen and (max-width: 768px) {
  .form-check {
    padding: 0 0 2.5em;
  }
}

/* 送信ボタン
-------------------------------------------------------- */

.contact-form .wpcf7-spinner {
  display: none;
}
.form-action {
  cursor: pointer;
  display: block;
  font-size: 2rem;
  max-width: 38.4rem;
  width: 92%;
  margin: 0 auto 2.75em;
  border-radius: 5em;
  background-image: var(--blue_grada_w);
  background-image: var(--blue_grada);
  position: relative;
  z-index: 0;
}
.form-action::before {
  content: "";
  display: block;
  width: calc(100% + 2px);
  height: calc(100% + 2px);
  border-radius: 5em;
  background-image: var(--light-blue_grada_w);
  background-image: var(--light-blue_grada);
  position: absolute;
  left: -1px;
  top: -1px;
  z-index: 1;
  opacity: 0;
  transition: opacity 0.4s;
}
.form-action:hover::before {
  opacity: 1;
}
.form-action::after {
  content: "";
  display: block;
  width: 1.2em;
  height: 1.2em;
  background: url(../img/cmn/btn-arrow_wh.svg) no-repeat center/contain;
  position: absolute;
  right: 1.5em;
  top: calc(50% - 0.6em);
  z-index: 2;
}

.form-action input {
  cursor: pointer;
  color: #fff;
  line-height: 1.5;
  letter-spacing: -0.03em;
  text-align: center;
  width: 100%;
  min-height: 3.3em; /* 66/20 */
  padding: 0.25em 2.85em 0.25em 1.5em;
  background-color: transparent;
  position: relative;
  z-index: 2;
}
.form-action input:hover {
  color: #fff;
  background-color: var(--btn_color);
}

.contact-form .form-action .ajax-loader {
  display: none;
}

@media screen and (max-width: 768px) {
  .form-action {
    font-size: 1.6rem;
    max-width: 25rem;
    margin-bottom: 2.25em;
  }
  .form-action input {
    min-height: 2.7em; /* 43/16 */
  }
}

/* reCAPTCHA注釈
-------------------------------------------------------- */
.contact-form .recaptcha-content {
  font-size: 1.3rem;
  max-width: 28.2em;
}
.contact-form .recaptcha-content .recaptcha-link {
  text-decoration: underline;
}
.contact-form .recaptcha-content .recaptcha-link:hover {
  text-decoration: none;
}

@media screen and (max-width: 768px) {
  .contact-form .recaptcha-content {
    max-width: 20em;
    margin-inline: auto;
  }
}

/************************************************************************
	プライバシーポリシー
**************************************************************************/
/* =====
	共通
======================================================== */
.other-page .lower_head {
  max-width: 80rem;
  width: 90%;
}
.other-page_section {
  line-height: 1.875; /* 30/16 */
  max-width: 80rem;
  width: 90%;
  padding: 2.5rem 0 10rem;
  margin-inline: auto;
}

.other-page_section > *,
.other-page_section > #privacy-content > * {
  margin-bottom: 2em;
}

.other-page_section a {
  text-decoration: underline;
}
.other-page_section a:hover {
  text-decoration: none;
}

.other-page_section .c-list-decimal {
  counter-reset: c-list-decimal;
}
.other-page_section .c-list-decimal > li {
  counter-increment: c-list-decimal;
  line-height: 1.75;
  padding-left: 1.5em;
  margin-bottom: 2em;
  position: relative;
}
.other-page_section .c-list-decimal > li:nth-last-of-type(1) {
  margin-bottom: 0;
}
.other-page_section .c-list-decimal > li::before {
  content: counter(c-list-decimal) ".";
  position: absolute;
  left: 0;
}

@media screen and (max-width: 768px) {
  .other-page .lower_title .sub {
    font-size: 3.1em;
  }

  .other-page_section {
    font-size: 1.6rem;
    padding: 0 0 10rem;
  }

  .other-page_section > *,
  .other-page_section > #privacy-content > * {
    margin-bottom: 2.5em;
  }
  .other-page_section .c-list-decimal > li {
    margin-bottom: 2.5em;
  }
}

/* =====
	404 NOT FOUND
======================================================== */
#not_found .lower_title .sub .in_text {
  width: 5.8em;
}
#not_found .lower_title .sub img {
  width: 100%;
}

.contents_404 {
  padding: 3rem 0 13rem;
  position: relative;
}
.contents_404 .deco {
  width: 128rem;
  transform: translateX(-18.8%);
}

@media screen and (max-width: 768px) {
  #not_found .lower_title .sub .in_text {
    width: 5.4em;
  }

  .contents_404 {
    padding: 0 0 10rem;
    position: relative;
  }

  .contents_404 .deco {
    width: 260%;
    transform: translateX(-45%);
  }
}

/* 
-------------------------------------------------------- */

@media screen and (max-width: 768px) {
}

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

@media screen and (max-width: 768px) {
}

/* 
-------------------------------------------------------- */

@media screen and (max-width: 768px) {
}

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

@media screen and (max-width: 768px) {
}

/* 
-------------------------------------------------------- */

@media screen and (max-width: 768px) {
}

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

@media screen and (max-width: 768px) {
}

/* 
-------------------------------------------------------- */

@media screen and (max-width: 768px) {
}

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

@media screen and (max-width: 768px) {
}

/* 
-------------------------------------------------------- */

@media screen and (max-width: 768px) {
}

.p-mainVisual .c-filterLayer::before{background-color: #f3f6f7 !important;display: none !important;}
.c-filterLayer.-texture-dot::after{display: none;}
.p-postList.-type-card, .p-postList.-type-thumb{}
#body_wrap{background-image: url(../img/bg/news_pc.png);background-size: 100% auto;background-position: center 100px;}

.l-content.l-container p a,.cap_box_content a {
    color: #007aff;
    text-decoration: underline;
}
.cap_box_content,.p-authorBox{background: #fff;}
.wp-block-table>table{background: #fff !important;}
#content{background: #fff;max-width: 750px;}
.top #content{max-width: 992px;}
.top .l-article{max-width: 992px;}
header{position: static;}
.p-breadcrumb__list.l-container{max-width: 850px;}
@media (min-width:768px){
  .p-postList{display: grid !important;grid-template-columns: repeat(3,1fr);gap:2.5rem;}
  .p-postList .p-postList__item{width:auto !important;}
}
.single .p-breadcrumb__item:last-child>span.p-breadcrumb__text{display: block;}