@charset "UTF-8";
/************************************************
* Library
***********************************************/
/************************************************
* theme
***********************************************/
/*************************************************************
*
* Variables
*
*************************************************************/
/*************************************************************
* デバイスの基準サイズ
*************************************************************/
/*************************************************************
* コンテンツのコンテナ幅
*************************************************************/
/*************************************************************
* Media Query
*************************************************************/
/*************************************************************
* カラーバリエーション
*************************************************************/
/*************************************************************
*
* Function
*
*************************************************************/
/**
 * Line heightの余白を除いたマージンの取得
 *
 * @param px $baseMargin 本来の余白
 * @param px $fontSize フォントサイズ
 * @param float $lineHeight 行間
 **/
/**
 * Fontの上下余白を取得
 *
 * @param float $lineHeight 行間
 * @param float $capitalLetter フォントの上下余白
 * @param float $ratio 取得する余白割合
 **/
/**
 * Pixel => rem変換
 * @param px $pixel
 * @oaram px $fontSize
 * @return rem
 **/
/**
 * Pixel => em変換
 * @param px $pixel
 * @oaram px $fontSize
 * @return rem
 **/
/**
 * Pixel => vw変換
 * @param px $pixel
 * @oaram px $fontSize
 * @return rem
 **/
/**************************************************************
* Media Query
**************************************************************/
/**************************************************************
* Media Query Image Ratio
**************************************************************/
/**************************************************************
* Transition
**************************************************************/
/**************************************************************
* Object Fit
**************************************************************/
/**************************************************************
* カラー設定
**************************************************************/
/**************************************************************
* Swiperスライドボタン設定
**************************************************************/
:root {
  /* Contents */
  --max-width: 1280px;
  --space-inline: 40px;
  --header-height: 5rem;
  --footer-height: 0px;
  /* Color */
  --color-blue: #1E73BE;
  --color-blue-light: #E8F1FC;
  --color-blue-light2: #EDF1F8;
  --color-green: #4CAF50;
  --color-yellow: #FFD700;
  --color-yellow-dark: #FFD700;
  --color-orange: #FF6600;
  --color-gray: #E1E4E5;
  --color-white: #ffffff;
  --color-black: #000000;
  --color-light: #F7F7F7;
  --color-dark: #0A1F44;
  --color-bg: var(--color-white);
  --color-text: #333333;
  --color-primary: var(--color-blue);
  --color-secondary: #003366;
  --color-accent: var(--color-yellow);
  --color-alert: #ff0000;
  --color-hr: #ddd7cf;
  /* Font Family */
  --font-noto-sans-jp: "Noto Sans JP", serif;
  --font-cormorant-garamond: "Cormorant Garamond", serif;
  --font-primary: var(--font-noto-sans-jp);
  --font-secondary: "Roboto";
  --font-en: var(--font-cormorant-garamond);
  /* Line Heigt */
  --line-height: 1.5;
  --line-height-lg: 1.75;
  --letter-spacing: 0.1em;
  /* space */
  --space-xl: 6rem;
  --space-lg: 5rem;
  --space-md: 4rem;
  --space-sm: 2.5rem;
  --space-xs: 2rem;
  --space-grid: var(--space-sm);
  /* Border */
  --border-radius: 1rem;
  /* box shadow */
  --box-shadow: -4px -4px 4px rgba(255, 255, 255, 0.25), 4px 4px 4px rgba(0, 0, 0, 0.25);
  --box-shadow-hover: -2px -2px 2px rgba(255, 255, 255, 0.25), 2px 2px 2px rgba(0, 0, 0, 0.25);
  --box-shadow-light: -4px -4px 4px rgba(255, 255, 255, 0.75), 4px 4px 4px rgba(0, 0, 0, 0.25);
  --box-shadow-light-hover: -2px -2px 2px rgba(255, 255, 255, 0.75), 2px 2px 2px rgba(0, 0, 0, 0.25);
  /* Anime */
  --anime-duration: 500ms;
  --anime-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
@media screen and (max-width: 1279px) {
  :root {
    --header-height: 5rem;
  }
}
@media screen and (max-width: 834px) {
  :root {
    --space-inline: 5vw;
    --header-height: 3.5rem;
    --footer-height: 3.5rem;
  }
}
@media screen and (max-width: 549px) {
  :root {
    --space-inline: 4vw;
  }
}

/************************************************
* Foundation
***********************************************/
/************************************************
/*
/* All Element
/*
/***********************************************/
/************************************************
/*
/* Document
/*
/***********************************************/
/*
 * 2. Prevent adjustments of font size after orientation changes in
 *    IE on Windows Phone and in iOS.
 */
html {
  -webkit-text-size-adjust: 100%; /* 2 */
}

/************************************************
/*
/* Sections
/*
/***********************************************/
/**
 * Remove the margin in all browsers.
 */
body {
  margin: 0;
}

/**
 * Render the `main` element consistently in IE.
 */
main {
  display: block;
}

/************************************************
/*
/* Grouping Content
/*
/***********************************************/
/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
  box-sizing: content-box; /* 1 */
  height: 0; /* 1 */
  overflow: visible; /* 2 */
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

figure {
  margin: 0;
  padding: 0;
}

/************************************************
/*
/* Text Content
/*
/***********************************************/
h1, h2, h3, h4, h5, h6, strong {
  font-weight: normal;
}

h1, h2, h3, h4, h5, h6 {
  font-size: 1em;
  line-height: 1.3;
  font-family: inherit;
  margin: 0;
}

p, li, dt, dd, th, td, pre {
  line-break: strict;
  word-break: break-strict;
  margin: 0;
}

br {
  letter-spacing: 0;
}

/**
 * 1. Remove the gray background on active links in IE 10.
 */
a {
  background-color: transparent; /* 1 */
}

a:focus {
  outline: none;
}

a:hover, a:active {
  outline-width: 0;
}

/**
 * 1. Remove the bottom border in Firefox 39-.
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
  border-bottom: none; /* 1 */
  text-decoration: none; /* 2 */
}

b, strong {
  font-weight: bold;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
samp {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/**
 * Add the correct font style in Android 4.3-.
 */
dfn {
  font-style: normal;
}

/**
 * Add the correct background and color in IE 9-.
 */
mark {
  background-color: #ff0;
  color: #000;
}

em {
  font-style: normal;
}

small {
  font-size: inherit;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub, sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

q {
  quotes: "“" "”" "‘" "’";
}

/************************************************
/*
/* Embedded Content
/*
/***********************************************/
/**
 * Add the correct display in IE 9-.
 */
audio, video {
  display: inline-block;
}

/**
 * Add the correct display in iOS 4-7.
 */
audio:not([controls]) {
  display: none;
  height: 0;
}

/**
 * 1. Remove the border on images inside links in IE 10-.
 */
img {
  border-style: none; /* 1 */
  max-width: 100%;
  vertical-align: middle;
  border: 0;
  width: auto;
  height: auto;
}

/**
 * Hide the overflow in IE.
 */
svg:not(:root) {
  overflow: hidden;
}

/************************************************
/*
/* Scripting Content
/*
/***********************************************/
/**
 * Add the correct display in IE 9-.
 */
canvas {
  display: inline-block;
}

/**
 * Add the correct display in IE.
 */
template {
  display: none;
}

/************************************************
/*
/* Form Content
/*
/***********************************************/
/**
 * 1. Change the font styles in all browsers (opinionated).
 * 2. Remove the margin in Firefox and Safari.
 */
button, input, select, textarea {
  font-family: inherit; /* 1 */
  font-size: 100%; /* 1 */
  line-height: 1.15; /* 1 */
  margin: 0; /* 2 */
}

button, input {
  line-height: normal;
}

button {
  background-color: transparent;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button:focus {
  outline: none;
}

button,
select { /* 1 */
  text-transform: none;
}

button,
input[type=button],
input[type=reset],
input[type=submit] {
  appearance: normal;
  cursor: pointer;
  border: none;
}

button[disabled],
input[disabled] {
  cursor: default;
}

input[type=checkbox],
input[type=radio] {
  box-sizing: border-box;
  padding: 0;
}

input[type=search] {
  box-sizing: content-box;
}

input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
 * Change the border, margin, and padding in all browsers (opinionated).
 */
fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */
legend {
  box-sizing: border-box; /* 1 */
  color: inherit; /* 2 */
  display: table; /* 1 */
  max-width: 100%; /* 1 */
  padding: 0; /* 3 */
  white-space: normal; /* 1 */
}

textarea {
  overflow: auto;
  vertical-align: top;
  resize: none;
}

/************************************************
/*
/* Interactive Content
/*
/***********************************************/
/*
 * Add the correct display in IE 9-.
 * 1. Add the correct display in Edge, IE, and Firefox.
 */
details,
menu {
  display: block;
}

/*
 * Add the correct display in all browsers.
 */
summary {
  display: list-item;
}

/**
 * 1. Add the correct display in IE 9-.
 * 2. Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
  display: inline-block; /* 1 */
  vertical-align: baseline; /* 2 */
}

/************************************************
/*
/* Table Content
/*
/***********************************************/
table {
  border-collapse: collapse;
  border-spacing: 0;
  font-size: inherit;
}

th {
  font-weight: normal;
}

/************************************************
/*
/* List Content
/*
/***********************************************/
ul, ol, dl {
  list-style: none;
  padding: 0;
  margin: 0;
}

dd {
  margin-left: 0px;
}

/************************************************
/*
/* Hidden
/*
/***********************************************/
[hidden] {
  display: none;
}

/*************************************************************
*
* Mocorun Custom Normalize
*
*************************************************************/
* {
  box-sizing: border-box;
  word-break: normal;
  word-wrap: break-word;
  white-space: normal;
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
}
*:before, *:after {
  box-sizing: border-box;
}

/* Retinaモニタの際にfont-smoothingを適用 */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
  html,
  body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }
}
/************************************************
/* Document
/***********************************************/
html {
  overflow: auto; /* iOS用*/
  height: 100%; /* iOS用*/
}

/************************************************
/* Grouping Content
/***********************************************/
address {
  font-style: normal;
}

/************************************************
/* Text Content
/***********************************************/
a {
  text-decoration: none;
  color: inherit;
}
a:focus {
  outline: none;
}
a:hover, a:active {
  outline-width: 0;
}

strong {
  font-weight: normal;
}

button {
  text-align: left;
  padding: 0;
  border-radius: 0;
  border: none;
}

/*************************************************************
*
* Attribute
*
*************************************************************/
[disabled] {
  cursor: not-allowed;
}

/*************************************************************
*
* Status
*
*************************************************************/
:focus:not(:focus-visible) {
  outline: none;
}

/*************************************************************
*
* Typography
*
*************************************************************/
html {
  font-family: var(--font-primary);
  font-size: 16px;
  color: var(--color-text);
  line-height: 1;
  letter-spacing: var(--letter-spacing);
}
@media screen and (max-width: 1279px) {
  html {
    font-size: vw(16px, 1200px);
  }
}
@media screen and (max-width: 834px) {
  html {
    font-size: vw(15px, 768px);
  }
}
@media screen and (max-width: 549px) {
  html {
    font-size: vw(14px, 375px);
  }
}

body {
  font-size: inherit;
  overflow: hidden;
  position: relative;
}
body:has(#cursor) {
  cursor: none;
}
body:has(#cursor) a {
  cursor: none;
}
@media screen and (max-width: 834px) {
  body {
    font-size: 1.953125vw;
  }
}
@media screen and (max-width: 549px) {
  body {
    font-size: 3.7333333333vw;
  }
}

/* テキスト反転色 */
::selection {
  background: var(--color-primary); /*背景色*/
  color: #fff; /*文字色*/
}

/************************************************
/************************************************
* Layout
***********************************************/
/*************************************************************
*
* Content
*
*************************************************************/
/*************************************************************
* Page Container
*************************************************************/
/**************************************************************
* Crop Line height
**************************************************************/
/**************************************************************
* Omit row
**************************************************************/
/**************************************************************
* Hover
**************************************************************/
/**************************************************************
* Animation Line
**************************************************************/
/*************************************************************
* Opacity
*************************************************************/
/*************************************************************
* Underline
*************************************************************/
/**************************************************************
*
* Position
*
**************************************************************/
/*************************************
* Common Style
*************************************/
/**************************************************************
*
* フッター
*
**************************************************************/
.l-footer {
  width: 100vw;
  background-color: var(--color-dark);
  color: var(--color-white);
}
.l-footer__fix {
  display: none;
  position: fixed;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  max-width: 900px;
  width: 100%;
  z-index: 20;
}
.l-footer__fix.is-fix {
  display: block;
}
.l-footer__fix-inner {
  display: flex;
}
.l-footer__fix-anchor {
  width: 33.3333333333%;
  padding: 1rem 1.5rem;
  display: flex;
  align-items: center;
  gap: 1rem;
  background-color: var(--color-primary);
  color: var(--color-white);
  font-size: 1rem;
  font-weight: bold;
  transition: color var(--anime-function);
  transition-property: filter;
}
.l-footer__fix-anchor.__dark {
  background-color: var(--color-dark);
}
.l-footer__fix-anchor.__accent {
  background-color: var(--color-accent);
  color: var(--color-dark);
}
.l-footer__fix-anchor_icon {
  width: 2rem;
  height: 2rem;
  fill: currentColor;
}
.l-footer__fix-anchor_text {
  line-height: 1.25;
}
.l-footer__fix-anchor:hover {
  filter: brightness(1.1);
}
.l-footer__inner {
  max-width: var(--max-width);
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--space-inline);
  padding-right: var(--space-inline);
  width: 100%;
  padding-top: 3.75rem;
  padding-bottom: 2.25rem;
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
}
.l-footer__head {
  display: flex;
  justify-content: space-between;
  gap: 2rem;
}
.l-footer__logo-anchor {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  fill: var(--color-primary);
}
.l-footer__sns {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1rem;
}
.l-footer__sns-anchor .l-footer__sns-icon {
  fill: var(--color-dark);
}
.l-footer__nav {
  display: flex;
  justify-content: space-between;
  gap: 2.5rem;
}
.l-footer__nav-menu {
  position: relative;
  padding-left: 1.5rem;
  min-width: calc((100% - 5rem) / 3);
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.l-footer__nav-menu::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  width: 1px;
  height: 100%;
  background-color: var(--color-primary);
  opacity: 0.25;
}
.l-footer__nav-anchor {
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--color-white);
}
.l-footer__nav-anchor.__button {
  display: block;
  padding: 1rem 1rem;
  background-color: var(--color-primary);
  color: var(--color-white);
  border-radius: 1rem;
}
.l-footer__copyright {
  width: 100%;
  padding: 1.5rem;
  font-size: 0.75rem;
  text-align: center;
  font-weight: bold;
}
@media screen and (max-width: 834px) {
  .l-footer__fix-anchor {
    padding: 0.75rem 0.75rem;
    gap: 0.25rem;
    font-size: 0.75rem;
  }
  .l-footer__fix-anchor_icon {
    width: 1.5rem;
    height: 1.5rem;
  }
  .l-footer__nav {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    gap: 2.5rem;
  }
}

/**************************************************************
*
* Header
*
**************************************************************/
.l-header {
  padding-inline: var(--space-inline);
  height: var(--header-height);
  max-height: var(--header-height);
  background-color: transparent;
  display: flex;
  align-items: center;
  gap: 2.5rem;
  z-index: 20;
  position: absolute;
  top: 0;
  left: 0;
}
.l-header__logo {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  height: 100%;
}
.l-header__logo-svg {
  fill: var(--color-primary);
  height: 1.75rem;
}
/**************************************************************
*
* Mainimage
*
**************************************************************/
.l-topmain {
  position: relative;
  width: 100%;
  height: 100vh;
  min-height: 100vh;
  background: var(--color-blue-light2);
}
.l-topmain__wrapper {
  max-width: var(--max-width);
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--space-inline);
  padding-right: var(--space-inline);
  position: relative;
  z-index: 1;
  height: 100%;
  display: grid;
  place-content: center space-between;
  padding-block: 10vh;
  grid-template-areas: "title image" "subtitle image" "point image" "button image";
  grid-column-gap: 2.5rem;
  grid-row-gap: 1rem;
}
.l-topmain__title {
  grid-area: title;
  color: var(--color-primary);
  font-size: 2.5rem;
  font-weight: 700;
  line-height: var(--line-height);
}
.l-topmain__title .em {
  font-size: 2.75rem;
  font-weight: 900;
}
.l-topmain__title .num {
  font-size: 3.375rem;
  font-weight: 900;
  padding-inline: 0.25rem;
}
.l-topmain__subtitle {
  grid-area: subtitle;
  width: fit-content;
  height: fit-content;
  color: var(--color-dark);
  font-size: 1.125rem;
  font-weight: bold;
  line-height: var(--line-height);
}
.l-topmain__point {
  grid-area: point;
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 0.5rem 0;
}
.l-topmain__point-item {
  width: 7.5rem;
  aspect-ratio: 1/1;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background-color: var(--color-white);
  box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.25);
  color: var(--color-primary);
  font-size: 0.875rem;
  font-weight: bold;
  line-height: var(--line-height);
  text-align: center;
}
.l-topmain__button {
  grid-area: button;
}
.l-topmain__button-notice {
  position: relative;
  width: fit-content;
  margin-bottom: 1rem;
  padding-inline: 0.75rem;
  color: var(--color-dark);
  font-size: 1.5rem;
  font-weight: bold;
  line-height: var(--line-height);
}
.l-topmain__button-notice .num {
  font-size: 2rem;
  font-weight: bold;
}
.l-topmain__button-notice::before, .l-topmain__button-notice::after {
  content: "";
  position: absolute;
  top: 0.875rem;
  width: 0.125rem;
  height: 2.125rem;
  border-radius: 0.0625rem;
  background-color: currentColor;
}
.l-topmain__button-notice::before {
  left: 0;
  transform: rotate(-20deg);
}
.l-topmain__button-notice::after {
  right: 0;
  transform: rotate(20deg);
}
.l-topmain__image {
  grid-area: image;
  display: flex;
  align-items: center;
}
@media screen and (max-width: 834px) {
  .l-topmain {
    height: auto;
    min-height: 100vh;
  }
  .l-topmain__wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    grid-row-gap: 1vh;
  }
  .l-topmain__title {
    text-align: center;
    font-size: 1.5rem;
  }
  .l-topmain__title .em {
    font-size: 1.75rem;
  }
  .l-topmain__title .num {
    font-size: 2.5rem;
  }
  .l-topmain__subtitle {
    text-align: center;
    font-size: 1rem;
  }
  .l-topmain__point {
    gap: 0.5rem;
    padding: 0;
  }
  .l-topmain__point-item {
    width: 6.25rem;
    font-size: 0.875rem;
  }
  .l-topmain__button-notice {
    margin-bottom: 0.5rem;
    padding-inline: 0.75rem;
    font-size: 1rem;
  }
  .l-topmain__button-notice .num {
    font-size: 1.5rem;
  }
  .l-topmain__button-notice::before, .l-topmain__button-notice::after {
    top: 0.625rem;
    width: 0.125rem;
    height: 1.5rem;
  }
  .l-topmain__image {
    height: 24vh;
  }
}
/**************************************************************
*
* Mainimage Subpage
*
**************************************************************/
.l-submain {
  position: relative;
  background: var(--color-primary);
}
.l-submain__bg {
  position: absolute;
  inset: 0;
  z-index: -1;
}
.l-submain__bg-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.l-submain__bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background-color: #fff;
  opacity: 0.85;
}
.l-submain__inner {
  padding-top: 2.5rem;
  padding-bottom: 2.5rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 2rem;
}
.l-submain__headline {
  font-size: 2.5rem;
  font-weight: 700;
  text-align: center;
  color: var(--color-white);
}
.l-submain__paragraph {
  font-size: 1.5rem;
  font-weight: 600;
  text-align: center;
  color: var(--color-light);
  line-height: var(--line-height);
}
.l-submain__paragraph .em {
  color: var(--color-yellow);
}
.l-submain__pr {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.l-submain__pr-box {
  width: 8.75rem;
  aspect-ratio: 1/1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  row-gap: 0.5rem;
  background: transparent;
  border: solid 1px var(--color-light);
  border-radius: 1rem;
  color: var(--color-light);
}
.l-submain__pr-box_icon {
  width: 2rem;
  height: 2rem;
  fill: currentColor;
}
.l-submain__pr-box_text {
  font-size: 1rem;
  font-weight: 700;
  text-align: center;
  line-height: var(--line-height);
}
.l-submain__pr-box_text .em {
  color: var(--color-yellow);
  letter-spacing: 0.2em;
}
.l-submain__pr-box_text .num {
  font-size: 1.5rem;
  color: var(--color-yellow);
}
@media screen and (max-width: 834px) {
  .l-submain__headline {
    font-size: 2rem;
  }
  .l-submain__paragraph {
    font-size: 1rem;
  }
  .l-submain__pr {
    width: 100%;
    justify-content: center;
    gap: 0.5rem;
  }
  .l-submain__pr-box {
    width: calc((100% - 1rem) / 3);
  }
  .l-submain__pr-box_icon {
    width: 1.5rem;
    height: 1.5rem;
  }
  .l-submain__pr-box_text {
    font-size: 0.875rem;
  }
}
/**************************************************************
*
* Bread Crumb
*
**************************************************************/
.l-topicpath {
  max-width: var(--max-width);
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--space-inline);
  padding-right: var(--space-inline);
  padding-block: 1rem;
}
.l-topicpath__item {
  display: inline-block;
  font-size: 0.6875rem;
  font-weight: 500;
  line-height: var(--line-height);
}
.l-topicpath__item:after {
  content: ">";
  margin-inline: 0.625rem;
}
.l-topicpath__item:last-child:after {
  content: none;
}
.l-topicpath__anchor {
  text-decoration: underline;
}
@media (any-hover: hover) {
  .l-topicpath__anchor:hover[href], .l-topicpath__anchor:hover[type] {
    text-decoration: none;
  }
}
.l-submain .l-topicpath {
  color: var(--color-white);
}
/**************************************************************
*
* Mobile Navigation Menu Button
*
**************************************************************/
.l-navigation-toggle {
  padding: 0;
  position: fixed;
  top: 0.5rem;
  right: var(--space-inline);
  z-index: 20;
  width: 2.75rem;
  height: 2.75rem;
  border-radius: 99999px;
  border: solid 1px var(--color-light);
  background-color: var(--color-white);
  display: flex;
  flex-flow: column nowrap;
  align-items: center;
  justify-content: center;
  opacity: 1;
  transition: var(--anime-duration) var(--anime-function);
  transition-property: opacity;
}
.l-navigation-toggle__bd {
  transition: var(--anime-duration) var(--anime-function);
  transition-property: transform;
  position: relative;
  margin: 0.75rem 0;
}
.l-navigation-toggle__bd, .l-navigation-toggle__bd:before, .l-navigation-toggle__bd:after {
  display: block;
  width: 1.875rem;
  height: 0.125rem;
  background-color: var(--color-dark);
  border-radius: 0.125rem;
}
.l-navigation-toggle__bd:before, .l-navigation-toggle__bd:after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
.l-navigation-toggle__bd:before {
  transition: var(--anime-duration) var(--anime-function);
  transition-property: transform;
  transition-delay: 400ms;
  transform: translateY(-0.5rem);
}
.l-navigation-toggle__bd:after {
  transition: var(--anime-duration) var(--anime-function);
  transition-property: transform, opacity;
  transition-delay: 200ms;
  transform: translateY(0.5rem);
}
.l-navigation-toggle__text {
  font-size: 0.875rem;
  letter-spacing: 0.06em;
  font-weight: 600;
}
.l-navigation-toggle.is-active .l-navigation-toggle__bd {
  transform: rotate(45deg);
}
.l-navigation-toggle.is-active .l-navigation-toggle__bd:before {
  transform: translateY(0px) rotate(-90deg);
}
.l-navigation-toggle.is-active .l-navigation-toggle__bd:after {
  transform: translateY(0px);
  opacity: 0;
}
@media (any-hover: hover) {
  .l-navigation-toggle:hover[href], .l-navigation-toggle:hover[type] {
    opacity: 0.75;
  }
}
@media screen and (min-width: 835px) {
  .l-navigation-toggle {
    display: none;
  }
}
@media screen and (max-width: 549px) {
  .l-navigation-toggle__bd {
    margin: 0.5rem 0;
  }
  .l-navigation-toggle__bd, .l-navigation-toggle__bd:before, .l-navigation-toggle__bd:after {
    width: 1.25rem;
    height: 0.125rem;
  }
  .l-navigation-toggle__bd:before {
    transform: translateY(-0.375rem);
  }
  .l-navigation-toggle__bd:after {
    transform: translateY(0.375rem);
  }
  .l-navigation-toggle__text {
    font-size: 0.625rem;
  }
}

/**************************************************************
*
* Navigation
*
**************************************************************/
.l-navigation {
  position: fixed;
  top: var(--header-height);
  left: 0;
  right: 0;
  bottom: 0;
  width: 100vw;
  height: calc(100vh - var(--header-height));
  background-color: var(--color-dark);
  color: var(--color-white);
  overflow: hidden;
  z-index: -1000;
  opacity: 0;
  transition: var(--anime-duration) var(--anime-function);
  transition-property: opacity;
}
.l-navigation__logo {
  width: 13.3125rem;
  position: absolute;
  top: 0.9375rem;
  left: var(--space-inline);
}
.l-navigation__inner {
  max-width: var(--max-width);
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--space-inline);
  padding-right: var(--space-inline);
  padding-top: 2rem;
  padding-bottom: 2rem;
  height: 100%;
  overflow-y: scroll;
}
.l-navigation__box {
  width: 100%;
  height: 100%;
  padding-block: 2.5rem;
  padding-inline: 2.5rem;
  border-radius: 0.625rem;
  background-color: rgba(255, 255, 255, 0.75);
  overflow-y: scroll;
}
.l-navigation__list {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.l-navigation__list-item {
  opacity: 0;
  transform: translateY(6.25rem);
  counter-increment: number;
  --this-number: counter(number);
}
.l-navigation__list-item:nth-child(1) {
  transition: var(--anime-duration) var(--anime-function);
  transition-property: opacity, transform;
  transition-delay: calc(1 * 100ms);
}
.l-navigation__list-item:nth-child(2) {
  transition: var(--anime-duration) var(--anime-function);
  transition-property: opacity, transform;
  transition-delay: calc(2 * 100ms);
}
.l-navigation__list-item:nth-child(3) {
  transition: var(--anime-duration) var(--anime-function);
  transition-property: opacity, transform;
  transition-delay: calc(3 * 100ms);
}
.l-navigation__list-item:nth-child(4) {
  transition: var(--anime-duration) var(--anime-function);
  transition-property: opacity, transform;
  transition-delay: calc(4 * 100ms);
}
.l-navigation__list-item:nth-child(5) {
  transition: var(--anime-duration) var(--anime-function);
  transition-property: opacity, transform;
  transition-delay: calc(5 * 100ms);
}
.l-navigation__list-item:nth-child(6) {
  transition: var(--anime-duration) var(--anime-function);
  transition-property: opacity, transform;
  transition-delay: calc(6 * 100ms);
}
.l-navigation__list-item:nth-child(7) {
  transition: var(--anime-duration) var(--anime-function);
  transition-property: opacity, transform;
  transition-delay: calc(7 * 100ms);
}
.l-navigation__list-item:nth-child(8) {
  transition: var(--anime-duration) var(--anime-function);
  transition-property: opacity, transform;
  transition-delay: calc(8 * 100ms);
}
.l-navigation__list-item:nth-child(9) {
  transition: var(--anime-duration) var(--anime-function);
  transition-property: opacity, transform;
  transition-delay: calc(9 * 100ms);
}
.l-navigation__list-item:nth-child(10) {
  transition: var(--anime-duration) var(--anime-function);
  transition-property: opacity, transform;
  transition-delay: calc(10 * 100ms);
}
.l-navigation__list-item:nth-child(11) {
  transition: var(--anime-duration) var(--anime-function);
  transition-property: opacity, transform;
  transition-delay: calc(11 * 100ms);
}
.l-navigation__list-anchor {
  font-size: 1rem;
  font-weight: bold;
  display: block;
  padding: 0.5rem;
  position: relative;
  transition: opacity 300ms;
  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
.l-navigation__list-anchor.__green {
  --this-color: var(--color-green);
}
.l-navigation__list-anchor.__yellow {
  --this-color: var(--color-yellow);
}
.l-navigation__list-anchor.__orange {
  --this-color: var(--color-orange);
}
.l-navigation__list-anchor.__gray {
  --this-color: var(--color-gray);
}
@media (any-hover: hover) {
  .l-navigation__list-anchor:hover[href], .l-navigation__list-anchor:hover[type] {
    opacity: 0.7;
    zoom: 1;
  }
}
.l-navigation__list-anchor::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 0.125rem;
  background-color: var(--color-primary);
  opacity: 0.5;
}
.l-navigation__children {
  padding-top: 1.125rem;
  padding-left: 0.5rem;
  display: flex;
  flex-direction: column;
  gap: 1.125rem;
}
.l-navigation__children-anchor {
  font-size: 0.875rem;
  padding-left: 0.9375rem;
  position: relative;
  display: inline-block;
  position: relative;
  padding-bottom: 2px;
}
.l-navigation__children-anchor:after {
  transition: var(--anime-duration) var(--anime-function);
  transition-property: transform;
  content: "";
  position: absolute;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 1px;
  background-color: currentColor;
  transform-origin: left center;
}
.l-navigation__children-anchor:after {
  transform: scaleX(0);
  transform-origin: right center;
}
@media (any-hover: hover) {
  .l-navigation__children-anchor:hover[href]:after, .l-navigation__children-anchor:hover[type]:after {
    transform: scaleX(1);
    transform-origin: left center;
  }
}
.l-navigation__children-anchor::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: var(--color-light);
  opacity: 0.5;
}
.l-navigation__link {
  color: var(--color-gray);
  opacity: 0;
  transform: translateY(6.25rem);
  transition: var(--anime-duration) var(--anime-function);
  transition-property: opacity, transform;
  transition-delay: 700ms;
}
.l-navigation__sns {
  opacity: 0;
  transform: translateY(6.25rem);
  transition: var(--anime-duration) var(--anime-function);
  transition-property: opacity, transform;
  transition-delay: 800ms;
  display: flex;
  gap: 1rem;
}
.l-navigation__sns_icon {
  width: 2.5rem;
  height: 2.5rem;
}
.l-navigation.is-active {
  opacity: 1;
  z-index: 10;
}
.l-navigation.is-active .l-navigation__bg {
  opacity: 0.75;
}
.l-navigation.is-active .l-navigation__list-item {
  opacity: 1;
  transform: translateY(0);
}
.l-navigation.is-active .l-navigation__link,
.l-navigation.is-active .l-navigation__sns {
  opacity: 1;
  transform: translateY(0);
}
@media screen and (min-width: 835px) {
  .l-navigation__list {
    flex-direction: row;
    flex-wrap: wrap;
    margin-bottom: 5rem;
  }
  .l-navigation__list-item {
    width: 18.75rem;
  }
}
@media screen and (max-width: 549px) {
  .l-navigation__box {
    padding-inline: var(--space-inline);
  }
}

/*************************************************************
*
* Pagetop Button
*
*************************************************************/
.l-pagetop {
  position: fixed;
  bottom: 20px;
  right: var(--space-inline);
  height: 46px;
  width: 46px;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  outline: none;
  cursor: pointer;
  background-color: #fff;
  padding: 0px;
  transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
  transition-property: opacity;
  transition-duration: 300ms;
  transition-delay: 0ms;
}
.l-pagetop:focus, .l-pagetop:active {
  outline: none;
}
.l-pagetop.is-fadein {
  opacity: 1;
  transition-delay: 50ms;
}
.l-pagetop__svg {
  fill: var(--color-primary);
}
@media screen and (min-width: 835px) {
  .l-pagetop.is-static {
    position: absolute;
    top: 30px;
  }
}
@media screen and (max-width: 549px) {
  .l-pagetop {
    right: 0.375rem;
    bottom: 0.375rem;
  }
}

/************************************************
* Object - Utility
***********************************************/
/*************************************************************
* 要素の回り込み解除
*************************************************************/
.sc {
  clear: both;
}

/*************************************************************
* クリアフィックス
*************************************************************/
.cf {
  zoom: 1;
}
.cf:after {
  content: "";
  display: table;
}
.cf:after {
  clear: both;
}

/*************************************************************
* ローディングスピナー
*************************************************************/
.u-spinner {
  border-width: 2px;
  border-color: white;
  border-top-color: transparent;
  border-radius: 9999px;
  animation: spin 0.8s linear infinite;
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
/*************************************************************
* その他
*************************************************************/
/* objfit */
img.objfit {
  width: 100%;
  object-fit: cover;
  object-position: center;
  font-family: "object-fit: cover;object-position: center;";
}

.cc-window.cc-invisible {
  top: 100%;
}

.u-mx-auto {
  margin-inline: auto;
  display: block;
}

/* hr */
.u-hr-dashed {
  border: none;
  border-top: dashed 0.0625rem var(--color-gray);
}
.u-hr-dashed.__white {
  border-top: dashed 0.0625rem var(--color-bg);
}

.u-translatey--150 {
  transform: translateY(-9.375rem);
}

.u-image-sm {
  width: 12.5rem;
  min-width: 12.5rem;
  height: 12.5rem;
  object-fit: cover;
  margin-inline: auto;
}

/*************************************************************
*
* デバイス毎のスタイル
*
*************************************************************/
/* PCサイズ以上 */
@media screen and (min-width: 1280px) {
  .over-pc-none {
    display: none;
  }
}
/* ノートPCサイズ以上 */
@media screen and (min-width: 835px) {
  .over-lp-none {
    display: none;
  }
}
/* タブレットサイズ以上 */
@media screen and (min-width: 550px) {
  .over-tb-none {
    display: none;
  }
}
/* ノートPCサイズ以下 */
@media screen and (max-width: 1279px) {
  .under-lp-none {
    display: none;
  }
}
/* タブレットサイズ以下 */
@media screen and (max-width: 834px) {
  .under-tb-none {
    display: none;
  }
}
/* スマホサイズ以下 */
@media screen and (max-width: 549px) {
  .under-sp-none {
    display: none;
  }
}
/*************************************************************
*
* ブラウザ更新
*
*************************************************************/
.u-ie-update__bg {
  position: fixed;
  z-index: 2000;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.8);
}
.u-ie-update__box {
  position: fixed;
  z-index: 2000;
  top: 50%;
  left: 50%;
  width: 500px !important;
  transform: translate(-50%, -50%);
  padding: 25px;
  background-color: #fff;
  text-align: center;
}
.u-ie-update__heading {
  font-size: 1.2em;
  color: var(--color-primary);
  margin-bottom: 1.25rem;
}
.u-ie-update__subtext {
  display: block;
  color: #999;
  font-size: 0.75em;
  font-weight: normal;
}
.u-ie-update__paragraph {
  text-align: justify;
  text-align-last: left;
  font-size: 0.875em;
  margin-bottom: 1.25rem;
}
.u-ie-update__btn {
  display: block;
  background-color: var(--color-primary);
  color: #fff;
}

@media screen and (max-width: 834px) {
  .u-wrapper-window {
    margin-left: calc(0 - var(--space-inline));
    margin-right: calc(0 - var(--space-inline));
  }
}

/*************************************************************
*
* スライド
*
*************************************************************/
.u-slide {
  width: 100%;
  overflow: hidden;
}
.u-slide__wrapper {
  display: flex;
  width: max-content;
  animation: slide-left 30s linear infinite;
}
.u-slide__item {
  flex: 0 0 auto; /* 7個表示 */
}

/* アニメーション定義 */
@keyframes slide-left {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}
/*************************************************************
*
* Container
*
*************************************************************/
/*************************************************************
* Page Container
*************************************************************/
.u-page-container {
  max-width: var(--max-width);
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--space-inline);
  padding-right: var(--space-inline);
}
.u-page-container.__small {
  max-width: 980px;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--space-inline);
  padding-right: var(--space-inline);
}
.u-page-container .u-page-container.__small {
  padding: 0;
}

@media screen and (max-width: 834px) {
  .u-max-tb {
    margin-inline: calc(-1 * var(--space-inline)) !important;
  }
}
@media screen and (max-width: 549px) {
  .u-max-sp {
    margin-inline: calc(-1 * var(--space-inline)) !important;
  }
}
.u-page-wrapper {
  position: relative;
  --aside-width: 18.75rem;
  min-height: 777px;
}
.u-page-wrapper__main {
  margin-right: var(--aside-width);
  padding-right: 2rem;
}
.u-page-wrapper__aside {
  position: absolute;
  top: 0;
  right: 0;
  width: var(--aside-width);
  padding-right: var(--space-inline);
}
.u-page-wrapper__aside.is-fix {
  position: fixed;
  top: calc(var(--header-height) + var(--space-sm));
  z-index: 10;
}
.u-page-wrapper__aside .is-sticky {
  position: sticky;
  top: 0;
  left: 0;
}
@media screen and (max-width: 1279px) {
  .u-page-wrapper__aside {
    right: var(--space-inline);
  }
}
@media screen and (max-width: 834px) {
  .u-page-wrapper__main {
    margin-right: 0;
    padding-right: 0;
  }
  .u-page-wrapper__aside {
    position: static;
    margin-top: 2.5rem;
    padding-right: 0;
    width: 100%;
  }
  .u-page-wrapper__aside.is-fix {
    position: static;
    top: unset;
    z-index: 10;
  }
  .u-page-wrapper__aside .is-sticky {
    position: static;
    top: unset;
  }
}

/*************************************************************
*
* Margin
*
*************************************************************/
/*************************************************************
* Content Margin Bottom
*************************************************************/
.u-mt-xl {
  margin-top: var(--space-xl);
}

.u-mb-xl {
  margin-bottom: var(--space-xl);
}

@media screen and (max-width: 834px) {
  .u-mt-xl {
    margin-top: var(--space-xl);
  }
  .u-mb-xl-tb {
    margin-bottom: var(--space-xl);
  }
}
@media screen and (max-width: 549px) {
  .u-mt-xl {
    margin-top: var(--space-xl);
  }
  .u-mb-xl-sp {
    margin-bottom: var(--space-xl);
  }
}
.u-mt-lg {
  margin-top: var(--space-lg);
}

.u-mb-lg {
  margin-bottom: var(--space-lg);
}

@media screen and (max-width: 834px) {
  .u-mt-lg {
    margin-top: var(--space-lg);
  }
  .u-mb-lg-tb {
    margin-bottom: var(--space-lg);
  }
}
@media screen and (max-width: 549px) {
  .u-mt-lg {
    margin-top: var(--space-lg);
  }
  .u-mb-lg-sp {
    margin-bottom: var(--space-lg);
  }
}
.u-mt-md {
  margin-top: var(--space-md);
}

.u-mb-md {
  margin-bottom: var(--space-md);
}

@media screen and (max-width: 834px) {
  .u-mt-md {
    margin-top: var(--space-md);
  }
  .u-mb-md-tb {
    margin-bottom: var(--space-md);
  }
}
@media screen and (max-width: 549px) {
  .u-mt-md {
    margin-top: var(--space-md);
  }
  .u-mb-md-sp {
    margin-bottom: var(--space-md);
  }
}
.u-mt-sm {
  margin-top: var(--space-sm);
}

.u-mb-sm {
  margin-bottom: var(--space-sm);
}

@media screen and (max-width: 834px) {
  .u-mt-sm {
    margin-top: var(--space-sm);
  }
  .u-mb-sm-tb {
    margin-bottom: var(--space-sm);
  }
}
@media screen and (max-width: 549px) {
  .u-mt-sm {
    margin-top: var(--space-sm);
  }
  .u-mb-sm-sp {
    margin-bottom: var(--space-sm);
  }
}
.u-mt-xs {
  margin-top: var(--space-xs);
}

.u-mb-xs {
  margin-bottom: var(--space-xs);
}

@media screen and (max-width: 834px) {
  .u-mt-xs {
    margin-top: var(--space-xs);
  }
  .u-mb-xs-tb {
    margin-bottom: var(--space-xs);
  }
}
@media screen and (max-width: 549px) {
  .u-mt-xs {
    margin-top: var(--space-xs);
  }
  .u-mb-xs-sp {
    margin-bottom: var(--space-xs);
  }
}
/*************************************************************
*
* Padding
*
*************************************************************/
/*************************************************************
* Content Vertical Padding
*************************************************************/
.u-py-xl {
  padding-block: var(--space-xl);
}

.u-pt-xl {
  padding-top: var(--space-xl);
}

.u-pb-xl {
  padding-bottom: var(--space-xl);
}

@media screen and (max-width: 834px) {
  .u-py-xl-tb {
    padding-block: var(--space-xl);
  }
  .u-pt-xl-tb {
    padding-top: var(--space-xl);
  }
  .u-pb-xl-tb {
    padding-bottom: var(--space-xl);
  }
}
@media screen and (max-width: 549px) {
  .u-py-xl-sp {
    padding-block: var(--space-xl);
  }
  .u-pt-xl-sp {
    padding-top: var(--space-xl);
  }
  .u-pb-xl-sp {
    padding-bottom: var(--space-xl);
  }
}
.u-py-lg {
  padding-block: var(--space-lg);
}

.u-pt-lg {
  padding-top: var(--space-lg);
}

.u-pb-lg {
  padding-bottom: var(--space-lg);
}

@media screen and (max-width: 834px) {
  .u-py-lg-tb {
    padding-block: var(--space-lg);
  }
  .u-pt-lg-tb {
    padding-top: var(--space-lg);
  }
  .u-pb-lg-tb {
    padding-bottom: var(--space-lg);
  }
}
@media screen and (max-width: 549px) {
  .u-py-lg-sp {
    padding-block: var(--space-lg);
  }
  .u-pt-lg-sp {
    padding-top: var(--space-lg);
  }
  .u-pb-lg-sp {
    padding-bottom: var(--space-lg);
  }
}
.u-py-md {
  padding-block: var(--space-md);
}

.u-pt-md {
  padding-top: var(--space-md);
}

.u-pb-md {
  padding-bottom: var(--space-md);
}

@media screen and (max-width: 834px) {
  .u-py-md-tb {
    padding-block: var(--space-md);
  }
  .u-pt-md-tb {
    padding-top: var(--space-md);
  }
  .u-pb-md-tb {
    padding-bottom: var(--space-md);
  }
}
@media screen and (max-width: 549px) {
  .u-py-md-sp {
    padding-block: var(--space-md);
  }
  .u-pt-md-sp {
    padding-top: var(--space-md);
  }
  .u-pb-md-sp {
    padding-bottom: var(--space-md);
  }
}
.u-py-sm {
  padding-block: var(--space-sm);
}

.u-pt-sm {
  padding-top: var(--space-sm);
}

.u-pb-sm {
  padding-bottom: var(--space-sm);
}

@media screen and (max-width: 834px) {
  .u-py-sm-tb {
    padding-block: var(--space-sm);
  }
  .u-pt-sm-tb {
    padding-top: var(--space-sm);
  }
  .u-pb-sm-tb {
    padding-bottom: var(--space-sm);
  }
}
@media screen and (max-width: 549px) {
  .u-py-sm-sp {
    padding-block: var(--space-sm);
  }
  .u-pt-sm-sp {
    padding-top: var(--space-sm);
  }
  .u-pb-sm-sp {
    padding-bottom: var(--space-sm);
  }
}
/*************************************************************
*
* Color
*
*************************************************************/
/*************************************************************
* Background
*************************************************************/
.u-color-bg-white {
  background-color: var(--color-white);
}

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

.u-color-bg-light-secondary {
  background-color: var(--color-blue-light);
}

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

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

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

/*************************************************************
* Text
*************************************************************/
.u-color-text-primary {
  color: var(--color-primary);
}

.u-color-text-alert {
  color: var(--color-alert);
}

/*************************************************************
* frame
*************************************************************/
.u-bg-arrow-bottom {
  position: relative;
}
.u-bg-arrow-bottom__svg {
  position: absolute;
  width: 100%;
  height: fit-content;
  top: 100%;
  left: 0;
  right: 0;
  fill: var(--color-blue-light2);
  z-index: -1;
}

/**************************************************************
* Common Style
**************************************************************/
/*************************************************************
*
* Typography
*
*************************************************************/
/*************************************************************
* Typography
*************************************************************/
.u-post {
  width: 100%;
  color: #333;
  line-height: 1.6;
}
.u-post p {
  margin-top: 1.2em;
  margin-bottom: 1.2em;
}
.u-post img {
  max-width: 100%;
  height: auto;
  margin: 20px 0;
}
.u-post blockquote {
  border-left: 4px solid var(--color-primary);
  margin: 1.5em 0;
  padding-left: 1em;
  font-style: italic;
  color: #555;
}
.u-post pre,
.u-post code {
  font-family: "Courier New", monospace;
  background: #eee;
  padding: 5px;
  border-radius: 3px;
}
.u-post strong {
  font-weight: 700;
}
.u-post h2 {
  font-size: 1.625rem;
  margin-top: 2.625rem;
  margin-bottom: 0.875rem;
  font-weight: bold;
  border-bottom: 0.125rem solid var(--color-primary);
  padding-bottom: 0.25rem;
}
.u-post h3 {
  font-size: 1.375rem;
  margin-top: 2.5rem;
  margin-bottom: 0.75rem;
  font-weight: bold;
  padding: 0.5rem 1rem;
  background-color: var(--color-dark);
  color: var(--color-white);
}
.u-post h4 {
  font-size: 1.125rem;
  margin-top: 2.375rem;
  margin-bottom: 0.625rem;
  font-weight: bold;
  padding-inline: 1rem;
  border-left: 2px solid var(--color-primary);
}
.u-post h5 {
  font-size: 1.0625rem;
  margin-top: 2.25rem;
  margin-bottom: 0.5rem;
  font-weight: bold;
}
.u-post h6 {
  font-size: 1rem;
  margin-top: 2.125rem;
  margin-bottom: 0.375rem;
  font-weight: bold;
}
.u-post a {
  color: var(--color-primary);
  text-decoration: underline;
  transition: color 0.3s ease;
}
.u-post a:hover {
  text-decoration: none;
}
.u-post a.bookmark {
  color: var(--color-primary);
  font-weight: bold;
}
.u-post a.bookmark:hover {
  filter: brightness(1.1);
}
.u-post .button,
.u-post .wp-block-button__link {
  display: inline-block;
  background-color: var(--color-dark);
  color: var(--color-accent);
  padding: 10px 20px;
  border: none;
  border-radius: 3px;
  text-decoration: none;
  transition: background-color 0.3s ease;
  cursor: pointer;
}
.u-post .button:hover,
.u-post .wp-block-button__link:hover {
  filter: brightness(1.1);
}
.u-post table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 1.5em;
}
.u-post table th,
.u-post table td {
  border: 1px solid #333;
  padding: 10px;
  text-align: left;
}
.u-post table th {
  background-color: var(--color-light);
}
.u-post ul {
  list-style-type: disc;
  padding-left: 1.5em;
  margin-bottom: 1.2em;
}
.u-post ol {
  list-style-type: decimal;
  padding-left: 1.5em;
  margin-bottom: 1.2em;
}
.u-post .embed-container {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  max-width: 100%;
  margin: 20px 0;
}
.u-post .embed-container iframe,
.u-post .embed-container embed,
.u-post .embed-container object {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.u-post .wp-block-details {
  background-color: var(--color-light);
  border: 1px solid #333;
  border-radius: 4px;
  overflow: hidden;
  margin: 1.5em 0;
}
.u-post .wp-block-details summary {
  padding: 0.75em 1em;
  font-size: 1.1rem;
  font-weight: bold;
  background-color: var(--color-light);
  cursor: pointer;
  position: relative;
}
.u-post .wp-block-details p {
  padding: 1em;
  margin: 0;
  border-top: 1px solid #333;
}
.u-post .toc {
  margin: 20px 0;
  padding: 15px;
  background-color: var(--color-light);
  border: 1px solid #333;
  border-radius: 4px;
}
.u-post .toc h2,
.u-post .toc h3,
.u-post .toc h4,
.u-post .toc h5,
.u-post .toc h6 {
  margin: 0 0 10px;
  font-size: 1.2rem;
  border-bottom: none;
}
.u-post .toc ul {
  list-style: none;
  padding-left: 0;
}
.u-post .toc ul li {
  margin-bottom: 0.5em;
}
.u-post .toc ul li a {
  color: var(--color-primary);
  text-decoration: none;
}
.u-post .toc ul li a:hover {
  text-decoration: underline;
}
.u-post .cta-button {
  display: inline-block;
  background-color: var(--color-dark);
  color: var(--color-accent);
  padding: 12px 24px;
  text-decoration: none;
  border-radius: 4px;
  transition: background-color 0.3s ease;
}
.u-post .cta-button:hover {
  filter: brightness(1.1);
}
.u-post .related-pages {
  margin-top: 3em;
  padding: 20px;
  background-color: var(--color-light);
  border-top: 2px solid var(--color-primary);
}
.u-post .related-pages h3 {
  margin-bottom: 1em;
}
.u-post .related-pages ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.u-post .related-pages ul li {
  margin-bottom: 0.5em;
}
.u-post .related-pages ul li a {
  text-decoration: none;
  color: var(--color-primary);
}
.u-post .related-pages ul li a:hover {
  text-decoration: underline;
}
.u-post .director-block {
  margin-top: 3em;
  padding: 20px;
  background-color: #fff;
  border: 1px solid #333;
  border-radius: 4px;
  display: flex;
  align-items: center;
}
.u-post .director-block .director-image {
  flex: 0 0 100px;
  margin-right: 20px;
}
.u-post .director-block .director-image img {
  border-radius: 50%;
  width: 100px;
  height: 100px;
  object-fit: cover;
}
.u-post .director-block .director-info {
  flex: 1;
}
.u-post .director-block .director-info h4 {
  margin: 0;
  font-size: 1.2em;
  color: #333;
}
.u-post .director-block .director-info p {
  margin: 0.5em 0 0;
  font-size: 0.9em;
  color: #555;
}
@media screen and (min-width: 835px) {
  .u-post {
    padding-inline: 20px;
  }
  .u-post h2, .u-post h3, .u-post h4, .u-post h5, .u-post h6 {
    margin-inline: -20px;
  }
}
.u-post > *:first-child {
  margin-top: 0;
}

/*************************************************************
* Text Align
*************************************************************/
.u-text-center {
  text-align: center;
}

.u-text-left {
  text-align: left;
}

.u-text-right {
  text-align: right;
}

.u-text-justify {
  text-align: justify;
}

@media screen and (max-width: 834px) {
  .u-text-center-tb {
    text-align: center;
  }
}
/*************************************************************
* Text Wrapping
*************************************************************/
/* 文字折り返し禁止 */
.u-text-nowrap {
  white-space: nowrap;
}

/*************************************************************
* Font Size
*************************************************************/
.u-text-small {
  font-size: 0.889em;
}

.u-text-large {
  font-size: 1.266em;
}

.u-text-huge {
  font-size: 2.027em;
}

/*************************************************************
* Font Style
*************************************************************/
.u-text-bold {
  font-weight: bold;
}

.u-keep-all {
  word-break: keep-all;
}

/*************************************************************
* Dot Style
*************************************************************/
.u-dot-text {
  position: relative;
  display: inline-block;
}
.u-dot-text::before {
  content: "・";
  position: absolute;
  top: -0.4em;
  left: 50%;
  transform: translateX(-50%);
  font-size: 0.5em;
}

/*************************************************************
*
* Form
*
*************************************************************/
/**************************************************************
* テンプレートクラス
**************************************************************/
.u-form__relation-item {
  display: none !important;
}

.u-form__asterisk {
  display: inline;
  color: var(--color-alert);
  font-weight: normal;
  line-height: 1;
}

/**************************************************************
*
* Grid
*
**************************************************************/
/**************************************************************
* Flexbox: Common Style
**************************************************************/
/**************************************************************
* Flexbox: Theme Common Style
**************************************************************/
/**************************************************************
* Flexbox: Grid $col:列数 $gap:間隔
**************************************************************/
/*************************************************************
*
* Margin
*
*************************************************************/
/*************************************************************
* Grid Common
*************************************************************/
.u-grid-row {
  display: flex;
  gap: var(--space-grid);
}
.u-grid-row.__flow-reverse {
  flex-direction: row-reverse;
}
.u-grid-row.__align-center {
  align-items: center;
}

.u-grid-column {
  display: flex;
  flex-direction: column;
  gap: var(--space-grid);
}
.u-grid-column.__flow-reverse {
  flex-direction: row-reverse;
}
.u-grid-column.__align-center {
  align-items: center;
}

.u-grid-many {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-grid);
}
.u-grid-many.__flow-reverse {
  flex-direction: row-reverse;
}
.u-grid-many.__align-center {
  align-items: center;
}

.u-grid-center {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-grid);
}
.u-grid-center.__flow-reverse {
  flex-direction: row-reverse;
}
.u-grid-center.__align-center {
  align-items: center;
}

.u-grid-space-between {
  display: flex;
  justify-content: space-between;
  gap: var(--space-grid);
}
.u-grid-space-between.__flow-reverse {
  flex-direction: row-reverse;
}
.u-grid-space-between.__align-center {
  align-items: center;
}

.u-grid-items-end {
  display: flex;
  align-items: flex-end;
  gap: var(--space-grid);
}
.u-grid-items-end.__flow-reverse {
  flex-direction: row-reverse;
}
.u-grid-items-end.__align-center {
  align-items: center;
}

@media screen and (max-width: 834px) {
  .u-grid-column-tb {
    display: flex;
    flex-direction: column;
    gap: var(--space-grid);
  }
  .u-grid-column-tb.__flow-reverse {
    flex-direction: row-reverse;
  }
  .u-grid-column-tb.__align-center {
    align-items: center;
  }
}
@media screen and (max-width: 549px) {
  .u-grid-column-sp {
    display: flex;
    flex-direction: column;
    gap: var(--space-grid);
  }
  .u-grid-column-sp.__flow-reverse {
    flex-direction: row-reverse;
  }
  .u-grid-column-sp.__align-center {
    align-items: center;
  }
}
/*************************************************************
* Grid Col Select
*************************************************************/
.u-grid-col1 {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-grid);
  display: flex;
  flex-direction: column;
  margin-right: 0;
}
.u-grid-col1.__flow-reverse {
  flex-direction: row-reverse;
}
.u-grid-col1.__align-center {
  align-items: center;
}
.u-grid-col1.__flow-reverse {
  flex-direction: row-reverse;
}
.u-grid-col1.__align-center {
  align-items: center;
}
.u-grid-col1 > * {
  width: 100%;
}

.u-grid-col2 {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-grid);
  margin-right: calc(0% - var(--space-grid));
}
.u-grid-col2.__flow-reverse {
  flex-direction: row-reverse;
}
.u-grid-col2.__align-center {
  align-items: center;
}
.u-grid-col2 > * {
  width: calc((100% - var(--space-grid) * 2) / 2);
}

.u-grid-col3 {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-grid);
  margin-right: calc(0% - var(--space-grid));
}
.u-grid-col3.__flow-reverse {
  flex-direction: row-reverse;
}
.u-grid-col3.__align-center {
  align-items: center;
}
.u-grid-col3 > * {
  width: calc((100% - var(--space-grid) * 3) / 3);
}

.u-grid-col4 {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-grid);
  margin-right: calc(0% - var(--space-grid));
}
.u-grid-col4.__flow-reverse {
  flex-direction: row-reverse;
}
.u-grid-col4.__align-center {
  align-items: center;
}
.u-grid-col4 > * {
  width: calc((100% - var(--space-grid) * 4) / 4);
}

.u-grid-col6 {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-grid);
  margin-right: calc(0% - var(--space-grid));
}
.u-grid-col6.__flow-reverse {
  flex-direction: row-reverse;
}
.u-grid-col6.__align-center {
  align-items: center;
}
.u-grid-col6 > * {
  width: calc((100% - var(--space-grid) * 6) / 6);
}

/*************************************************************
* Grid Col Select (Tablet)
*************************************************************/
@media screen and (max-width: 1279px) {
  .u-grid-col1-lp {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-grid);
    display: flex;
    flex-direction: column;
    margin-right: 0;
  }
  .u-grid-col1-lp.__flow-reverse {
    flex-direction: row-reverse;
  }
  .u-grid-col1-lp.__align-center {
    align-items: center;
  }
  .u-grid-col1-lp.__flow-reverse {
    flex-direction: row-reverse;
  }
  .u-grid-col1-lp.__align-center {
    align-items: center;
  }
  .u-grid-col1-lp > * {
    width: 100%;
  }
  .u-grid-col2-lp {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-grid);
    margin-right: calc(0% - var(--space-grid));
  }
  .u-grid-col2-lp.__flow-reverse {
    flex-direction: row-reverse;
  }
  .u-grid-col2-lp.__align-center {
    align-items: center;
  }
  .u-grid-col2-lp > * {
    width: calc((100% - var(--space-grid) * 2) / 2);
  }
  .u-grid-col3-lp {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-grid);
    margin-right: calc(0% - var(--space-grid));
  }
  .u-grid-col3-lp.__flow-reverse {
    flex-direction: row-reverse;
  }
  .u-grid-col3-lp.__align-center {
    align-items: center;
  }
  .u-grid-col3-lp > * {
    width: calc((100% - var(--space-grid) * 3) / 3);
  }
}
/*************************************************************
* Grid Col Select (Tablet)
*************************************************************/
@media screen and (max-width: 834px) {
  .u-grid-col1-tb {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-grid);
    display: flex;
    flex-direction: column;
    margin-right: 0;
  }
  .u-grid-col1-tb.__flow-reverse {
    flex-direction: row-reverse;
  }
  .u-grid-col1-tb.__align-center {
    align-items: center;
  }
  .u-grid-col1-tb.__flow-reverse {
    flex-direction: row-reverse;
  }
  .u-grid-col1-tb.__align-center {
    align-items: center;
  }
  .u-grid-col1-tb > * {
    width: 100%;
  }
  .u-grid-col2-tb {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-grid);
    margin-right: calc(0% - var(--space-grid));
  }
  .u-grid-col2-tb.__flow-reverse {
    flex-direction: row-reverse;
  }
  .u-grid-col2-tb.__align-center {
    align-items: center;
  }
  .u-grid-col2-tb > * {
    width: calc((100% - var(--space-grid) * 2) / 2);
  }
  .u-grid-col3-tb {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-grid);
    margin-right: calc(0% - var(--space-grid));
  }
  .u-grid-col3-tb.__flow-reverse {
    flex-direction: row-reverse;
  }
  .u-grid-col3-tb.__align-center {
    align-items: center;
  }
  .u-grid-col3-tb > * {
    width: calc((100% - var(--space-grid) * 3) / 3);
  }
}
/*************************************************************
* Grid Col Select (SP)
*************************************************************/
@media screen and (max-width: 549px) {
  .u-grid-col1-sp {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-grid);
    display: flex;
    flex-direction: column;
    margin-right: 0;
  }
  .u-grid-col1-sp.__flow-reverse {
    flex-direction: row-reverse;
  }
  .u-grid-col1-sp.__align-center {
    align-items: center;
  }
  .u-grid-col1-sp.__flow-reverse {
    flex-direction: row-reverse;
  }
  .u-grid-col1-sp.__align-center {
    align-items: center;
  }
  .u-grid-col1-sp > * {
    width: 100%;
  }
  .u-grid-col2-sp {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-grid);
    margin-right: calc(0% - var(--space-grid));
  }
  .u-grid-col2-sp.__flow-reverse {
    flex-direction: row-reverse;
  }
  .u-grid-col2-sp.__align-center {
    align-items: center;
  }
  .u-grid-col2-sp > * {
    width: calc((100% - var(--space-grid) * 2) / 2);
  }
  .u-grid-col3-sp {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-grid);
    margin-right: calc(0% - var(--space-grid));
  }
  .u-grid-col3-sp.__flow-reverse {
    flex-direction: row-reverse;
  }
  .u-grid-col3-sp.__align-center {
    align-items: center;
  }
  .u-grid-col3-sp > * {
    width: calc((100% - var(--space-grid) * 2) / 2);
  }
}
/*************************************************************
*
* Webfont
*
*************************************************************/
@font-face {
  font-family: "icomoon";
  src: url("fonts/icomoon.eot?d9b8vn");
  src: url("fonts/icomoon.eot?d9b8vn#iefix") format("embedded-opentype"), url("fonts/icomoon.ttf?d9b8vn") format("truetype"), url("fonts/icomoon.woff?d9b8vn") format("woff"), url("fonts/icomoon.svg?d9b8vn#icomoon") format("svg");
  font-weight: normal;
  font-style: normal;
  font-display: block;
}
[class^=icon-],
[class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: "icomoon" !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-arrow01:before {
  content: "\e900";
}

.icon-pagetop:before {
  content: "\e901";
}

.icon-tel01:before {
  content: "\e902";
}

/*************************************************************
*
* Anime
*
*************************************************************/
.anime-text span {
  display: inline-block;
  opacity: 0;
  transform: translate(0.625rem, 3.125rem);
  transition: var(--anime-duration) var(--anime-function);
  transition-property: opacity, transform;
}
.anime-text.is-active span {
  opacity: 1;
  transform: translate(0, 0);
}

.anime-blur {
  opacity: 0;
  transform: translateY(6.25rem);
  transition: var(--anime-duration) var(--anime-function);
  transition-property: opacity, transform;
}
.anime-blur.is-active {
  opacity: 1;
  transform: translateY(0);
}
.anime-blur__container .anime-blur:nth-child(2) {
  transition-delay: 200ms;
}
.anime-blur__container .anime-blur:nth-child(3) {
  transition-delay: 400ms;
}
.anime-blur__container .anime-blur:nth-child(4) {
  transition-delay: 600ms;
}
.anime-blur__container .anime-blur:nth-child(5) {
  transition-delay: 800ms;
}
.anime-blur__container .anime-blur:nth-child(6) {
  transition-delay: 1000ms;
}
.anime-blur__container .anime-blur:nth-child(7) {
  transition-delay: 1200ms;
}
.anime-blur__container .anime-blur:nth-child(8) {
  transition-delay: 1400ms;
}
.anime-blur__container .anime-blur:nth-child(9) {
  transition-delay: 1600ms;
}
.anime-blur__container .anime-blur:nth-child(10) {
  transition-delay: 1800ms;
}

.anime-appear > *:not(.anime-none),
.anime-block-appear > *:not(.anime-none) {
  opacity: 0;
  transform: translateY(6.25rem);
  transition: var(--anime-duration) var(--anime-function);
  transition-property: opacity, transform;
}
.anime-appear > *:not(.anime-none).is-appear,
.anime-block-appear > *:not(.anime-none).is-appear {
  opacity: 1;
  transform: translateY(0);
}
.anime-appear::before, .anime-appear::after,
.anime-block-appear::before,
.anime-block-appear::after {
  width: 0 !important;
  transition: var(--anime-duration) var(--anime-function);
  transition-property: width;
}
.anime-appear.is-appear::before, .anime-appear.is-appear::after,
.anime-block-appear.is-appear::before,
.anime-block-appear.is-appear::after {
  width: 100% !important;
}

.anime-scale > * {
  overflow: hidden;
  transform: scale(1.2);
  transition: var(--anime-duration) var(--anime-function);
  transition-property: transform;
}
.anime-scale.is-active > * {
  transform: scale(1);
}

.anime-background-fix {
  min-height: 83.3125rem;
}
.anime-background-fix > * {
  position: relative;
  z-index: -1000;
  transition: var(--anime-duration) var(--anime-function);
  transition-property: position;
}
.anime-background-fix.is-fix > * {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
}

.anime-graph-loading {
  width: 0 !important;
  transition: 2000ms var(--anime-function);
  transition-property: width;
}
.anime-graph-loading.is-active {
  width: 100% !important;
}

.anime-circle-loading {
  scale: 0.6;
  transition: var(--anime-duration) var(--anime-function);
  transition-property: scale;
}
.anime-circle-loading.is-active {
  animation-name: scalePop;
  animation-duration: 1s;
  animation-delay: 1s;
  animation-fill-mode: forwards;
}

/*左から右*/
.anime-text-background.is-active {
  position: relative;
  width: max-content;
  display: block;
}
.anime-text-background.is-active::before {
  animation-name: bgLRextendAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: #666; /*伸びる背景色の設定*/
}

@keyframes scalePop {
  0% {
    scale: 0.6;
  }
  50% {
    scale: 1.2;
  }
  100% {
    scale: 1;
  }
}
@keyframes bgLRextendAnime {
  0% {
    transform-origin: left;
    transform: scaleX(0);
  }
  50% {
    transform-origin: left;
    transform: scaleX(1);
  }
  50.001% {
    transform-origin: right;
  }
  100% {
    transform-origin: right;
    transform: scaleX(0);
  }
}
/*************************************************************
*
* triangle
*
*************************************************************/
/* y triangle */
.u-triangle-y-lg {
  clip-path: polygon(0 var(--space-lg), 100% 0, 100% calc(100% - var(--space-lg)), 0% 100%);
}

.u-triangle-y-md {
  clip-path: polygon(0 var(--space-md), 100% 0, 100% calc(100% - var(--space-md)), 0% 100%);
}

.u-triangle-y-sm {
  clip-path: polygon(0 var(--space-sm), 100% 0, 100% calc(100% - var(--space-sm)), 0% 100%);
}

/* top triangle */
.u-triangle-t-lg {
  clip-path: polygon(0 var(--space-lg), 100% 0, 100% 100%, 0% 100%);
}

.u-triangle-t-md {
  clip-path: polygon(0 var(--space-md), 100% 0, 100% 100%, 0% 100%);
}

.u-triangle-t-sm {
  clip-path: polygon(0 var(--space-sm), 100% 0, 100% 100%, 0% 100%);
}

/* bottom triangle */
.u-triangle-b-lg {
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - var(--space-lg)), 0% 100%);
}

.u-triangle-b-md {
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - var(--space-md)), 0% 100%);
}

.u-triangle-b-sm {
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - var(--space-sm)), 0% 100%);
}

.u-triangle-y-lg-py {
  padding-block: 15rem;
}

/************************************************
* Object - Component
***********************************************/
/*************************************************************
* Opacity
*************************************************************/
.c-anchor-alpha {
  transition: opacity 300ms;
  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
@media (any-hover: hover) {
  .c-anchor-alpha:hover[href], .c-anchor-alpha:hover[type] {
    opacity: 0.7;
    zoom: 1;
  }
}

/*************************************************************
* Underline
*************************************************************/
.c-anchor-underline {
  text-decoration: underline;
}
@media (any-hover: hover) {
  .c-anchor-underline:hover[href], .c-anchor-underline:hover[type] {
    text-decoration: none;
  }
}

/*************************************************************
* Underline: Animation
*************************************************************/
.c-anchor-line {
  display: inline-block;
  position: relative;
  padding-bottom: 2px;
}
.c-anchor-line:after {
  transition: var(--anime-duration) var(--anime-function);
  transition-property: transform;
  content: "";
  position: absolute;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 1px;
  background-color: currentColor;
  transform-origin: left center;
}
.c-anchor-line:after {
  transform: scaleX(0);
  transform-origin: right center;
}
@media (any-hover: hover) {
  .c-anchor-line:hover[href]:after, .c-anchor-line:hover[type]:after {
    transform: scaleX(1);
    transform-origin: left center;
  }
}
.c-anchor-line.__primary {
  color: var(--color-primary);
}
.c-anchor-line.__flex {
  display: flex;
  gap: var(--space-grid);
  align-items: center;
}

/*************************************************************
* Anchor Menu
*************************************************************/
.c-anchor-menu {
  display: inline-block;
  padding-block: 0.625rem;
  position: relative;
  color: var(--color-text-a);
  font-size: 1.125rem;
  font-weight: 700;
}
.c-anchor-menu.__green {
  --this-color: var(--color-green);
}
.c-anchor-menu.__yellow {
  --this-color: var(--color-yellow);
}
.c-anchor-menu.__orange {
  --this-color: var(--color-orange);
}
.c-anchor-menu.__gray {
  --this-color: var(--color-gray);
}
.c-anchor-menu::first-letter {
  color: var(--color-text-a);
  transition: var(--anime-duration) var(--anime-function);
  transition-property: color;
}
.c-anchor-menu::after {
  content: "";
  position: absolute;
  bottom: 0.1875rem;
  left: 50%;
  transform: translateX(-50%);
  width: 1.5rem;
  height: 0.1875rem;
  border-radius: 0.09375rem;
  background-color: var(--this-color);
  opacity: 0;
  transition: var(--anime-duration) var(--anime-function);
  transition-property: opacity;
}
.c-anchor-menu:hover::first-letter, .c-anchor-menu.is-active::first-letter {
  color: var(--this-color);
}
.c-anchor-menu:hover::after, .c-anchor-menu.is-active::after {
  opacity: 1;
}

/*************************************************************
* Bright
*************************************************************/
.c-anchor-bright {
  transition: filter 500ms cubic-bezier(0.23, 1, 0.32, 1);
}
@media (any-hover: hover) {
  .c-anchor-bright:hover[href], .c-anchor-bright:hover[type] {
    filter: brightness(1.1);
  }
}

/*************************************************************
*
* Button
*
*************************************************************/
/*************************************************************
* Common Style
*************************************************************/
/*************************************************************
* Theme Common Style
*************************************************************/
/*************************************************************
*
* Button01
*
*************************************************************/
.c-button01 {
  appearance: none;
  display: block;
  width: 100%;
  /* Small */
  width: fit-content;
  padding: 1.5rem 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.125rem;
  border-radius: 624.9375rem;
  background-color: var(--color-accent);
  box-shadow: var(--box-shadow);
  transition: var(--anime-duration) var(--anime-function);
  transition-property: box-shadow, filter;
}
.c-button01[href] {
  cursor: pointer;
}
.c-button01.__mauto {
  margin-left: auto;
  margin-right: auto;
}
.c-button01.__mright {
  margin-left: auto;
  margin-right: 0;
}
.c-button01.__inline {
  display: inline-block;
}
.c-button01.__disabled {
  pointer-events: none;
  filter: grayscale(100%);
  opacity: 0.8;
  color: #ababab;
}
.c-button01.__max-width {
  max-width: inherit;
}
.c-button01.__small {
  max-width: 130px;
  padding: 0.493em 1em;
  font-size: 0.79em;
}
.c-button01__tag {
  padding: 0.5rem 1rem;
  border-radius: 0.5rem;
  background-color: var(--color-dark);
  font-size: 1.5rem;
  font-weight: bold;
  color: var(--color-white);
}
.c-button01__text {
  font-size: 2rem;
  font-weight: bold;
  color: var(--color-dark);
}
.c-button01__arrow {
  width: 2.5rem;
  height: 2.5rem;
  background-color: var(--color-dark);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--color-accent);
  transition: var(--anime-duration) var(--anime-function);
  transition-property: right, fill;
}
.c-button01__arrow svg {
  fill: currentColor;
}
.box_btns > .c-button01 {
  max-width: 25rem;
  width: 100%;
}
.p-cta > .c-button01 {
  padding: 1rem 1.5rem;
  gap: 0.625rem;
}
.p-cta > .c-button01 .c-button01__tag {
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
}
.p-cta > .c-button01 .c-button01__text {
  font-size: 1.5rem;
}
.p-cta > .c-button01 .c-button01__arrow {
  width: 2rem;
  height: 2rem;
}
@media (any-hover: hover) {
  .c-button01:hover[href], .c-button01:hover[type] {
    filter: brightness(1.1);
    box-shadow: var(--box-shadow-hover);
  }
  .c-button01:hover[href] .c-button01__arrow, .c-button01:hover[type] .c-button01__arrow {
    right: 1.25rem;
    fill: var(--color-bg);
  }
}
@media screen and (max-width: 834px) {
  .c-button01 {
    padding: 1rem 1.5rem;
    gap: 0.625rem;
  }
  .c-button01__tag {
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
  }
  .c-button01__text {
    font-size: 1.5rem;
  }
  .c-button01__arrow {
    width: 2rem;
    height: 2rem;
  }
  .p-cta > .c-button01 {
    padding: 1rem 1.5rem;
    gap: 0.625rem;
  }
  .p-cta > .c-button01 .c-button01__tag {
    padding: 0.3125rem 0.625rem;
    font-size: 0.875rem;
  }
  .p-cta > .c-button01 .c-button01__text {
    font-size: 1.25rem;
  }
  .p-cta > .c-button01 .c-button01__arrow {
    width: 1.75rem;
    height: 1.75rem;
  }
}
@media screen and (max-width: 549px) {
  .c-button01 {
    width: 100%;
  }
}

/*************************************************************
*
* Heading
*
*************************************************************/
/*************************************
* Common Style
*************************************/
/*************************************
* Theme Common Style
*************************************/
/*************************************************************
*
* Heading01
*
*************************************************************/
.c-heading01 {
  display: block;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
}
.c-heading01__main {
  font-size: 2rem;
  font-weight: bold;
  color: var(--color-dark);
  text-align: center;
}
.c-heading01__main .em {
  font-size: 2.5rem;
}
.c-heading01__sub {
  font-family: var(--font-en);
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--color-dark);
  text-transform: uppercase;
  text-align: center;
}
.c-heading01.__white .c-heading01__main {
  color: var(--color-light);
}
.c-heading01.__white .c-heading01__sub {
  color: var(--color-light);
}
.c-heading01.__left {
  align-items: baseline;
}
.c-heading01.__left__main {
  text-align: left;
}
.c-heading01.__left__sub {
  text-align: left;
}
@media screen and (max-width: 834px) {
  .c-heading01__main {
    font-size: 1.875rem;
  }
  .c-heading01__sub {
    font-size: 0.8125rem;
  }
}
@media screen and (max-width: 549px) {
  .c-heading01__main {
    font-size: 1.75rem;
  }
  .c-heading01__sub {
    font-size: 0.75rem;
  }
}

/**************************************************************
*
* List
*
**************************************************************/
/*************************************
* Common Style
*************************************/
/**************************************************************
*
* DList01
*
**************************************************************/
.c-dlist01 {
  display: flex;
  gap: 1.5rem;
  margin-bottom: 1rem;
  border-bottom: solid 0.0625rem var(--color-light);
}
.c-dlist01__theme {
  width: 15rem;
  display: flex;
  justify-content: space-between;
  gap: 2rem;
  padding: 1rem 0;
  font-size: 1rem;
}
.c-dlist01__theme-tag {
  padding: 0.25rem 0.375rem;
  color: var(--color-gray);
  border: solid 0.0625rem currentColor;
  border-radius: 0.25rem;
  font-size: 0.75rem;
}
.c-dlist01__theme-tag.__required {
  color: var(--color-alert);
}
.c-dlist01__description {
  width: calc(100% - 17.5rem - 1.5rem);
  padding-bottom: 1rem;
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
}
.c-dlist01.__block {
  position: relative;
  padding: 1.5rem;
  padding-top: 2rem;
  border-radius: 0.25rem;
  background-color: var(--color-bg-secondary);
  box-shadow: 0 0.25rem 0.75rem rgba(0, 0, 0, 0.1);
  flex-direction: column;
}
.c-dlist01.__block .c-dlist01__description {
  padding-block: 1rem;
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
}
.c-dlist01.__block::after {
  counter-increment: number 1;
  content: counter(number);
  position: absolute;
  top: -2rem;
  left: 1.5rem;
  font-family: var(--font-en);
  font-size: 3rem;
  font-weight: bold;
  color: var(--color-primary);
  opacity: 0.75;
}
.c-dlist01__container {
  counter-reset: number 0;
}
@media screen and (max-width: 834px) {
  .c-dlist01 {
    flex-direction: column;
    gap: 0;
    margin-bottom: 0;
  }
  .c-dlist01__theme {
    width: 100%;
  }
  .c-dlist01__theme-tag {
    padding: 0.125rem 0.375rem;
    font-size: 0.75rem;
  }
  .c-dlist01__description {
    width: 100%;
  }
}
/**************************************************************
*
* List Basic
*
**************************************************************/
.c-list-basic__item {
  position: relative;
  padding-left: 0.875rem;
  line-height: var(--line-height-lg);
}
.c-list-basic__item::before {
  content: "";
  display: inline-block;
  position: absolute;
  width: 0.25rem;
  height: 0.25rem;
  background-color: var(--color-primary);
  border-radius: 99px;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}
.c-list-basic.__gap {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
}
/**************************************************************
*
* List check
*
**************************************************************/
.c-list-check {
  display: flex;
  flex-direction: column;
  row-gap: 0.75rem;
}
.c-list-check__item {
  position: relative;
  padding-left: 1.5rem;
  font-size: 1.125rem;
  font-weight: bold;
  line-height: var(--line-height);
}
.c-list-check__item .em {
  color: var(--color-accent);
}
.c-list-check__item::before {
  content: "";
  flex-shrink: 0;
  width: 1rem;
  height: 1rem;
  background-color: var(--color-primary);
  border-radius: 50%;
  background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTEiIGhlaWdodD0iOCIgdmlld0JveD0iMCAwIDExIDgiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTEgNEw0IDdMMTAgMSIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz48L3N2Zz4=");
  background-size: 60% 60%;
  background-repeat: no-repeat;
  background-position: center;
  position: absolute;
  top: 0.4375rem;
  left: 0;
}
.c-list-check.__bold {
  row-gap: 1.125rem;
}
.c-list-check.__bold .c-list-check__item {
  font-weight: bold;
}
@media screen and (max-width: 834px) {
  .c-list-check {
    row-gap: 0.625rem;
  }
  .c-list-check__item {
    padding-left: 1.25rem;
    font-size: 1rem;
  }
  .c-list-check__item::before {
    top: 0.3125rem;
  }
  .c-list-check.__bold {
    row-gap: 1rem;
  }
}
/*************************************************************
* Paragraph basic
*************************************************************/
.c-paragraph-basic {
  font-size: 1rem;
  line-height: var(--line-height-lg);
}
.c-paragraph-basic.__sm {
  font-size: 0.875rem;
}
.c-paragraph-basic.__lg {
  font-size: 1.125rem;
}
.c-paragraph-basic.__secondary {
  color: var(--color-text-b);
}
.c-paragraph-basic.__white {
  color: var(--color-bg);
}
.c-paragraph-basic.__bold {
  font-weight: bold;
}
@media screen and (max-width: 834px) {
  .c-paragraph-basic {
    font-size: 0.875rem;
  }
  .c-paragraph-basic.__sm {
    font-size: 0.75rem;
  }
  .c-paragraph-basic.__lg {
    font-size: 1rem;
  }
}
@media screen and (max-width: 549px) {
  .c-paragraph-basic.__sp-none {
    font-size: 0.75rem;
  }
}

/**************************************************************
*
* Table
*
**************************************************************/
/*************************************
* Common Style
*************************************/
/*************************************
* Theme Common Style
*************************************/
/**************************************************************
*
* Table01
*
**************************************************************/
.c-table01 {
  width: 100%;
}
.c-table01 tr th {
  padding: 1.5rem;
  max-width: 15rem;
  width: 15rem;
  font-weight: bold;
  text-align: left;
  border-bottom: solid 0.0625rem var(--color-primary);
}
.c-table01 tr th:first-child {
  border-top: solid 0.0625rem var(--color-primary);
}
.c-table01 tr td {
  padding: 1.5rem;
  vertical-align: top;
  font-weight: 500;
  line-height: 1.25;
  border-bottom: solid 0.0625rem var(--color-gray);
}
.c-table01 tr td:nth-child(2) {
  border-top: solid 0.0625rem var(--color-gray);
}
.c-table01.__small {
  font-size: 0.875rem;
}
@media screen and (max-width: 834px) {
  .c-table01__tr th {
    white-space: nowrap;
    width: 1%;
    padding-block: 0.5rem;
    padding-inline: 1rem;
    position: relative;
  }
  .c-table01__tr td {
    width: auto;
    padding-block: 0.5rem;
    padding-inline: 1rem;
    position: relative;
  }
  .c-table01__tr td:last-child {
    padding-block: 1rem;
  }
  .c-table01__tr td::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    border-bottom: solid 0.0625rem var(--color-bg-secondary);
  }
}
/************************************************
* Object - Form
***********************************************/
/*************************************************************
* チェックボックス01
*************************************************************/
.f-checkbox01 {
  display: flex;
}
.f-checkbox01__input {
  opacity: 0;
  width: 0px;
  position: absolute;
}
.f-checkbox01__input[disabled] + .f-checkbox01__label {
  color: var(--color-gray);
}
.f-checkbox01__input:checked + .f-checkbox01__label:before {
  background-color: var(--color-primary);
  border-color: var(--color-primary);
}
.f-checkbox01__input:checked + .f-checkbox01__label:after {
  opacity: 1;
}
.f-checkbox01__label {
  position: relative;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 16px;
  white-space: nowrap;
}
.f-checkbox01__label:before {
  content: "";
  width: 21px;
  height: 21px;
  display: block;
  background-color: var(--color-bg);
  border-radius: 3px;
  border: 1px solid var(--color-gray);
}
.f-checkbox01__label:after {
  content: "";
  display: block;
  width: 7px;
  height: 14px;
  position: absolute;
  top: -5px;
  bottom: 0;
  left: 7px;
  margin: auto;
  border-right: 2px solid var(--color-white);
  border-bottom: 2px solid var(--color-white);
  opacity: 0;
  transform: rotate(45deg);
  transition: opacity 100ms cubic-bezier(0.215, 0.61, 0.355, 1);
}
.f-checkbox01__container {
  display: flex;
  flex-flow: row wrap;
}
.f-checkbox01__container .f-checkbox01 {
  width: 33.33%;
  padding-right: 10px;
}
.f-checkbox01__container .f-checkbox01:nth-child(n+4) {
  margin-top: 20px;
}
@media screen and (max-width: 979px) {
  .f-checkbox01__container .f-checkbox01 {
    width: 50%;
  }
  .f-checkbox01__container .f-checkbox01:nth-child(n+3) {
    margin-top: 20px;
  }
}
@media screen and (max-width: 549px) {
  .f-checkbox01__container .f-checkbox01 {
    width: 100%;
    padding-right: 0;
  }
  .f-checkbox01__container .f-checkbox01:nth-child(n+2) {
    margin-top: 20px;
  }
}

/*************************************************************
* Date01
*************************************************************/
.f-date01 {
  transition: var(--anime-duration) var(--anime-function);
  transition-property: background-color;
  width: 100%;
  padding: 10px 20px;
  background-color: var(--color-bg-secondary);
  border-radius: 3px;
  border: none;
  font-size: 16px;
  position: relative;
}
.f-date01:focus {
  outline: none;
  background-color: var(--color-bg);
}
.f-date01.__error, .f-date01:invalid {
  border-color: var(--color-alert);
}
.f-date01.__medium {
  max-width: 400px;
}
.f-date01.__small {
  max-width: 80px;
}
.f-date01::after {
  content: "";
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  width: 14px;
  height: 14px;
  background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTUiIGhlaWdodD0iMTUiIHZpZXdCb3g9IjAgMCAxNSAxNSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxwYXRoIGQ9Ik0xNC4xMjEgNS4yNVYyLjkwMkMxNC4xMjA3IDIuNDczNTcgMTMuOTUwNiAyLjA2Mjc0IDEzLjY0NzggMS43NTk2MUMxMy4zNDUxIDEuNDU2NDggMTIuOTM0NCAxLjI4NTc5IDEyLjUwNiAxLjI4NUgxMS43MDZWMy4wNjdDMTEuNzA1NyAzLjI5MDUgMTEuNjE2OCAzLjUwNDc2IDExLjQ1ODggMy42NjI4QzExLjMwMDggMy44MjA4MyAxMS4wODY1IDMuOTA5NzMgMTAuODYzIDMuOTFIOS4zNzlDOS4xNTU1IDMuOTA5NzMgOC45NDEyNCAzLjgyMDgzIDguNzgzMiAzLjY2MjhDOC42MjUxNyAzLjUwNDc2IDguNTM2MjYgMy4yOTA1IDguNTM2IDMuMDY3VjEuMjg1SDUuNTg2VjMuMDY3QzUuNTg1NDcgMy4yOTA3NiA1LjQ5NjIxIDMuNTA1MTggNS4zMzc4IDMuNjYzMjFDNS4xNzkzOSAzLjgyMTI1IDQuOTY0NzYgMy45MSA0Ljc0MSAzLjkxSDMuMjYxQzMuMDM3MjQgMy45MSAyLjgyMjYxIDMuODIxMjUgMi42NjQyIDMuNjYzMjFDMi41MDU3OSAzLjUwNTE4IDIuNDE2NTMgMy4yOTA3NiAyLjQxNiAzLjA2N1YxLjI4NUgxLjYxNkMxLjE4NzQgMS4yODU1MyAwLjc3NjUyIDEuNDU2MDkgMC40NzM1NDcgMS43NTkyNUMwLjE3MDU3NCAyLjA2MjQxIDAuMDAwMjY0NTY4IDIuNDczNCAwIDIuOTAyVjEyLjg3OUMwLjAwMDUyOTM1MyAxMy4zNDgzIDAuMTg3MTgxIDEzLjc5ODIgMC41MTkwMDYgMTQuMTNDMC44NTA4MyAxNC40NjE4IDEuMzAwNzMgMTQuNjQ4NSAxLjc3IDE0LjY0OUgxMi4zNUMxMi44MTkzIDE0LjY0ODUgMTMuMjY5MiAxNC40NjE4IDEzLjYwMSAxNC4xM0MxMy45MzI4IDEzLjc5ODIgMTQuMTE5NSAxMy4zNDgzIDE0LjEyIDEyLjg3OVY1LjI0OUwxNC4xMjEgNS4yNVpNMS4zOTMgNS4xNDRIMTIuNzI4VjEyLjg3OUMxMi43MjggMTIuOTc5MyAxMi42ODgyIDEzLjA3NTQgMTIuNjE3MyAxMy4xNDYzQzEyLjU0NjQgMTMuMjE3MiAxMi40NTAzIDEzLjI1NyAxMi4zNSAxMy4yNTdIMS43N0MxLjY2OTc1IDEzLjI1NyAxLjU3MzYgMTMuMjE3MiAxLjUwMjcxIDEzLjE0NjNDMS40MzE4MiAxMy4wNzU0IDEuMzkyIDEyLjk3OTMgMS4zOTIgMTIuODc5TDEuMzkzIDUuMTQ0WiIgZmlsbD0iI0I1QjVCNiIvPgogICAgPHBhdGggZD0iTTQuNjYgNi41ODYwMUgyLjkzN1Y4LjMwOUg0LjY2VjYuNTg2MDFaIiBmaWxsPSIjQjVCNUI2Ii8+CiAgICA8cGF0aCBkPSJNNy45MjIgNi41ODZINi4xOTlWOC4zMDlINy45MjJWNi41ODZaIiBmaWxsPSIjQjVCNUI2Ii8+CiAgICA8cGF0aCBkPSJNOS40NjEgOC4zMDM5OUgxMS4xODRWNi41ODFIOS40NjFWOC4zMDM5OVoiIGZpbGw9IiNCNUI1QjYiLz4KICAgIDxwYXRoIGQ9Ik00LjY2IDkuNzAyMDFIMi45MzdWMTEuNDI1SDQuNjZWOS43MDIwMVoiIGZpbGw9IiNCNUI1QjYiLz4KICAgIDxwYXRoIGQ9Ik03LjkyMiA5LjcwMkg2LjE5OVYxMS40MjVINy45MjJWOS43MDJaIiBmaWxsPSIjQjVCNUI2Ii8+CiAgICA8cGF0aCBkPSJNOS40NjEgMTEuNDI1SDExLjE4NFY5LjcwMjAxSDkuNDYxVjExLjQyNVoiIGZpbGw9IiNCNUI1QjYiLz4KICAgIDxwYXRoIGQ9Ik0zLjI2MSAzLjMxNEg0Ljc0MUM0Ljc3MzYxIDMuMzE0MjYgNC44MDU5NCAzLjMwODA3IDQuODM2MTQgMy4yOTU3OEM0Ljg2NjM0IDMuMjgzNDggNC44OTM4IDMuMjY1MzMgNC45MTY5NSAzLjI0MjM3QzQuOTQwMSAzLjIxOTQgNC45NTg0NyAzLjE5MjA5IDQuOTcxMDEgMy4xNjE5OUM0Ljk4MzU1IDMuMTMxODkgNC45OSAzLjA5OTYxIDQuOTkgMy4wNjdWMC43NjhDNC45ODkyMSAwLjU2NDIxMSA0LjkwNzc3IDAuMzY5MDI1IDQuNzYzNDggMC4yMjUxMTJDNC42MTkxOSAwLjA4MTE5NzcgNC40MjM3OSAwLjAwMDI2Mjc3NyA0LjIyIDBIMy43ODJDMy41NzgyMSAwLjAwMDI2Mjc3NyAzLjM4MjgxIDAuMDgxMTk3NyAzLjIzODUyIDAuMjI1MTEyQzMuMDk0MjMgMC4zNjkwMjUgMy4wMTI3OSAwLjU2NDIxMSAzLjAxMiAwLjc2OFYzLjA2OEMzLjAxMiAzLjEwMDYxIDMuMDE4NDYgMy4xMzI4OSAzLjAzMDk5IDMuMTYyOTlDMy4wNDM1MyAzLjE5MzA5IDMuMDYxOSAzLjIyMDQgMy4wODUwNSAzLjI0MzM3QzMuMTA4MiAzLjI2NjMzIDMuMTM1NjYgMy4yODQ0OCAzLjE2NTg2IDMuMjk2NzhDMy4xOTYwNiAzLjMwOTA3IDMuMjI4MzkgMy4zMTUyNiAzLjI2MSAzLjMxNSIgZmlsbD0iI0I1QjVCNiIvPgogICAgPHBhdGggZD0iTTkuMzc5MDEgMy4zMTRIMTAuODYxQzEwLjg5MzUgMy4zMTQxMyAxMC45MjU2IDMuMzA3ODMgMTAuOTU1NyAzLjI5NTQ3QzEwLjk4NTcgMy4yODMxIDExLjAxMyAzLjI2NDkxIDExLjAzNiAzLjI0MTk1QzExLjA1ODkgMy4yMTg5OSAxMS4wNzcxIDMuMTkxNzEgMTEuMDg5NSAzLjE2MTY4QzExLjEwMTggMy4xMzE2NSAxMS4xMDgxIDMuMDk5NDcgMTEuMTA4IDMuMDY3VjAuNzY4QzExLjEwNzIgMC41NjQzODQgMTEuMDI1OSAwLjM2OTM0OSAxMC44ODE4IDAuMjI1NDY0QzEwLjczNzcgMC4wODE1NzgxIDEwLjU0MjYgMC4wMDA1MjY2NTEgMTAuMzM5IDBIOS44OTlDOS42OTU1NiAwLjAwMDc5MDA3OSA5LjUwMDY4IDAuMDgxOTU3OCA5LjM1NjgyIDAuMjI1ODE1QzkuMjEyOTcgMC4zNjk2NzIgOS4xMzE3OCAwLjU2NDU1NyA5LjEzMDk5IDAuNzY4VjMuMDY4QzkuMTMwOTkgMy4xMDA0NCA5LjEzNzM4IDMuMTMyNTYgOS4xNDk3OSAzLjE2MjUyQzkuMTYyMjEgMy4xOTI0OSA5LjE4MDQyIDMuMjE5NzIgOS4yMDMzNSAzLjI0MjY2QzkuMjI2MjkgMy4yNjU1OSA5LjI1MzUyIDMuMjgzNzkgOS4yODM0OSAzLjI5NjJDOS4zMTM0NiAzLjMwODYxIDkuMzQ1NTcgMy4zMTUgOS4zNzggMy4zMTUiIGZpbGw9IiNCNUI1QjYiLz4KICA8L3N2Zz4K");
  pointer-events: none;
}
.f-date01::-webkit-calendar-picker-indicator {
  position: absolute;
  width: 100%;
  height: 100%;
  opacity: 0;
}
.f-date01::-webkit-inner-spin-button {
  -webkit-appearance: none;
}
.f-date01::-webkit-clear-button {
  -webkit-appearance: none;
}
.f-date01:placeholder-shown {
  color: #ccc;
}
.f-date01::-webkit-input-placeholder {
  color: #ccc;
}
.f-date01:-moz-placeholder {
  color: #ccc;
}
.f-date01::-moz-placeholder {
  color: #ccc;
}
.f-date01:-ms-input-placeholder {
  color: #ccc;
}

/*************************************************************
* ファイル
*************************************************************/
input[type=file] {
  display: none;
}
input[type=file] + .btn_file {
  display: inline-block;
  width: auto;
  background-color: #efefef;
  border-radius: 3px;
  border: 1px solid #ccc;
  padding: 3px 8px;
  cursor: pointer;
  font-size: 0.85em;
}

/*************************************************************
* ラジオボタン01
*************************************************************/
.f-radio01 {
  display: flex;
}
.f-radio01:not(:last-child) {
  margin-right: 50px;
  float: left;
}
.f-radio01__input {
  opacity: 0;
  width: 0px;
  position: absolute;
}
.f-radio01__input[disabled] + .f-radio01__label {
  color: #ababab;
}
.f-radio01__input:checked + .f-radio01__label:before {
  background-color: var(--color-primary);
  border-color: var(--color-primary);
}
.f-radio01__label {
  position: relative;
  display: flex;
  align-items: center;
  font-size: 16px;
}
.f-radio01__label:before {
  content: "";
  width: 18px;
  height: 18px;
  display: block;
  margin-right: 10px;
  border-radius: 50%;
  border: solid 1px var(--color-text);
  background-color: var(--color-bg);
}

/*************************************************************
* セレクト01
*************************************************************/
.f-select01 {
  position: relative;
  display: block;
  width: 100%;
  background-color: var(--color-bg-secondary);
  border-radius: 3px;
  border: none;
  font-size: 16px;
}
.f-select01__input {
  appearance: none;
  outline: none;
  display: block;
  width: 100%;
  border: none;
  background-color: transparent;
  padding: 10px 20px;
}
.f-select01__input.is-empty {
  color: #ccc;
}
.f-select01:after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: 1rem;
  margin: auto;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 6px 5px 0 5px;
  border-color: var(--color-gray) transparent transparent transparent;
  pointer-events: none;
}

/*************************************************************
* Text01
*************************************************************/
.f-text01 {
  transition: var(--anime-duration) var(--anime-function);
  transition-property: background-color;
  width: 100%;
  background-color: var(--color-white);
  border: solid 1px var(--color-gray);
  border-radius: 3px;
  padding: 10px 20px;
  font-size: 16px;
}
.f-text01.__error, .f-text01:invalid {
  border-color: var(--color-alert);
}
.f-text01.__medium {
  max-width: 400px;
}
.f-text01.__small {
  max-width: 80px;
}
.f-text01:placeholder-shown {
  color: #ccc;
}
.f-text01::-webkit-input-placeholder {
  color: #ccc;
}
.f-text01:-moz-placeholder {
  color: #ccc;
}
.f-text01::-moz-placeholder {
  color: #ccc;
}
.f-text01:-ms-input-placeholder {
  color: #ccc;
}

/*************************************************************
* テキストエリア01
*************************************************************/
.f-textarea01 {
  transition: var(--anime-duration) var(--anime-function);
  transition-property: background-color;
  width: 100%;
  min-height: 200px;
  resize: vertical;
  background-color: var(--color-white);
  border: solid 1px var(--color-gray);
  border-radius: 3px;
  padding: 10px 20px;
  font-size: 16px;
  line-height: var(--line-height);
}
.f-textarea01 ::placeholder {
  color: #ccc;
}
.f-textarea01:placeholder-shown {
  color: #ccc;
}
.f-textarea01::-webkit-input-placeholder {
  color: #ccc;
}
.f-textarea01:-moz-placeholder {
  color: #ccc;
}
.f-textarea01::-moz-placeholder {
  color: #ccc;
}
.f-textarea01:-ms-input-placeholder {
  color: #ccc;
}

/*************************************************************
* トグルスイッチ01
*************************************************************/
.f-toggle01__input {
  opacity: 0;
  width: 0px;
}
.f-toggle01__input:checked + .f-toggle01__label:before {
  background-color: #fdc23e;
  border-color: #fdc23e;
}
.f-toggle01__input:checked + .f-toggle01__label:after {
  transform: translateX(1rem);
}
.f-toggle01__label {
  padding-left: 2.8em;
  position: relative;
  line-height: var(--line-height);
}
.f-toggle01__label:before {
  content: "";
  width: 2rem;
  height: 1rem;
  display: inline-block;
  position: absolute;
  top: 0;
  left: 0;
  margin-right: 4px;
  background-color: #e6e6e6;
  border-radius: 8px;
  box-shadow: 0 2px 8px -2px rgba(0, 0, 0, 0.24) inset;
}
.f-toggle01__label:after {
  content: "";
  display: block;
  width: calc(1rem - 4px);
  height: calc(1rem - 4px);
  position: absolute;
  top: 2px;
  left: 2px;
  border: 1px solid #ededed;
  border-radius: 50%;
  background-color: #fff;
  box-shadow: 0 4px 8px -4px rgba(0, 0, 0, 0.6);
  transition: transform 100ms cubic-bezier(0.215, 0.61, 0.355, 1);
}

/************************************************
* Object - Project
***********************************************/
/*************************************************************
*
* Top cta
*
*************************************************************/
.p-cta {
  width: 100%;
  position: relative;
  padding: 2.5rem;
  display: grid;
  gap: 1.5rem;
  grid-template-areas: "image headline list" "image notice list" "image button list";
  background: var(--color-dark);
  border-radius: 1rem;
  box-shadow: var(--box-shadow);
  transition: var(--anime-duration) var(--anime-function);
  transition-property: box-shadow, filter;
}
.p-cta__image {
  grid-area: image;
}
.p-cta__headline {
  grid-area: headline;
  color: var(--color-white);
  font-size: 2rem;
  font-weight: bold;
  line-height: var(--line-height);
}
.p-cta__notice {
  grid-area: notice;
  color: var(--color-white);
  font-size: 1rem;
  font-weight: 500;
  line-height: var(--line-height);
}
.p-cta__button {
  grid-area: button;
}
.p-cta__button-item {
  padding: 0.75rem 2.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  column-gap: 1rem;
  background-color: var(--color-accent);
  color: var(--color-dark);
  font-weight: bold;
  border-radius: 999999px;
}
.p-cta__button-item_arrow {
  fill: currentColor;
}
.p-cta__list {
  grid-area: list;
  display: flex;
  flex-direction: column;
  row-gap: 0.5rem;
  color: var(--color-white);
}
.p-cta__list-item {
  font-size: 1.125rem;
  font-weight: bold;
  line-height: var(--line-height);
  display: flex;
  align-items: center;
  column-gap: 0.5rem;
}
.p-cta__list-item::before {
  content: "✔︎";
  color: var(--color-light);
}
.p-cta:hover {
  filter: brightness(1.1);
  box-shadow: -2px -2px 2px rgba(255, 255, 255, 0.25), 2px 2px 2px rgba(0, 0, 0, 0.25);
}
.p-cta__container {
  max-width: var(--max-width);
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--space-inline);
  padding-right: var(--space-inline);
}
@media screen and (max-width: 834px) {
  .p-cta {
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
  }
  .p-cta__image {
    position: absolute;
    width: 5rem;
    top: 0;
    left: 0;
  }
  .p-cta__headline {
    font-size: 1.5rem;
    text-align: center;
  }
  .p-cta__notice {
    font-size: 0.875rem;
    text-align: center;
  }
  .p-cta__button {
    text-align: center;
  }
  .p-cta__list-item {
    gap: 0.25rem;
    font-size: 0.875rem;
  }
}
/*************************************************************
*
* Top cta fix
*
*************************************************************/
.p-cta-fix {
  width: 100%;
  padding: 0.625rem;
  display: flex;
  justify-content: center;
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  transform: translateY(100%);
  z-index: 10;
}
.p-cta-fix.is-fixed {
  transform: translateY(0);
}
.p-cta-fix::before {
  content: "";
  position: absolute;
  inset: 0;
  background-color: var(--color-dark);
  opacity: 0.2;
  z-index: -1;
}
/*************************************************************
*
* Top work
*
*************************************************************/
.p-work {
  display: flex;
  gap: 2rem;
}
.p-work__image {
  width: auto;
  height: 27.5rem;
}
@media screen and (max-width: 834px) {
  .p-work {
    gap: 1.5rem;
  }
  .p-work__image {
    height: 27.5rem;
  }
}
/*************************************************************
*
* worry
*
*************************************************************/
.p-worry {
  position: relative;
  max-width: var(--max-width);
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--space-inline);
  padding-right: var(--space-inline);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.875rem;
}
.p-worry__list {
  width: 50%;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.p-worry__list-item {
  padding: 0.8125rem 1.25rem;
  display: flex;
  align-items: center;
  gap: 0.625rem;
  background-color: var(--color-white);
  border-radius: 0.625rem;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: var(--line-height);
}
.p-worry__list-item::before {
  content: "";
  flex-shrink: 0;
  width: 1.25rem;
  height: 1.25rem;
  background-color: var(--color-primary);
  border-radius: 50%;
  background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTEiIGhlaWdodD0iOCIgdmlld0JveD0iMCAwIDExIDgiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTEgNEw0IDdMMTAgMSIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz48L3N2Zz4=");
  background-size: 60% 60%;
  background-repeat: no-repeat;
  background-position: center;
}
.p-worry__image {
  width: 100%;
  max-width: 32.6875rem;
  height: auto;
}
@media screen and (max-width: 834px) {
  .p-worry {
    margin-bottom: 4rem;
  }
  .p-worry__image {
    max-width: 10.75rem;
    position: absolute;
    right: -4vw;
    bottom: -4.375rem;
  }
  .p-worry__list {
    width: 100%;
  }
}
/*************************************************************
*
* feature
*
*************************************************************/
.p-feature {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.5rem;
  padding: 2rem;
  border-radius: 1rem;
  background-color: var(--color-blue-light);
}
.p-feature__image {
  width: auto;
  height: 8.75rem;
}
.p-feature__title {
  font-size: 1.5rem;
  font-weight: bold;
  text-align: center;
  line-height: var(--line-height);
  color: var(--color-dark);
}
.p-feature__body {
  font-size: 1.125rem;
  font-weight: 500;
  line-height: var(--line-height);
  color: var(--color-dark);
}
.p-feature__before {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2.5rem;
  padding-top: 2rem;
  padding-bottom: 2.5rem;
}
.p-feature__before-catch {
  width: fit-content;
  margin-inline: auto;
  padding: 1rem 2rem;
  border-radius: 0.5rem;
  background-color: var(--color-primary);
  font-size: 2rem;
  font-weight: bold;
  text-align: center;
  line-height: var(--line-height);
  color: var(--color-white);
}
.p-feature__before-arrow {
  fill: var(--color-primary);
  text-align: center;
}
.p-feature__container {
  gap: 2rem;
}
@media screen and (max-width: 834px) {
  .p-feature {
    padding: 1.5rem;
  }
  .p-feature__image {
    width: auto;
    height: 6.25rem;
  }
  .p-feature__title {
    font-size: 1.25rem;
  }
  .p-feature__body {
    font-size: 1rem;
  }
  .p-feature__before {
    gap: 1.5rem;
    padding-top: 2rem;
    padding-bottom: 1.5rem;
  }
  .p-feature__before-catch {
    padding: 0.75rem 1rem;
    font-size: 1.375rem;
  }
  .p-feature__before-arrow {
    fill: var(--color-primary);
    text-align: center;
  }
  .p-feature__container {
    gap: 1rem;
  }
}
/*************************************************************
*
* flow
*
*************************************************************/
.p-flow {
  position: relative;
  display: grid;
  grid-template-areas: "num title" "num body";
  grid-template-columns: min-content 1fr;
  grid-row-gap: 1rem;
  grid-column-gap: 2rem;
  padding: 2rem;
  border-radius: 2rem;
  background-color: var(--color-white);
}
.p-flow::before {
  grid-area: num;
  counter-increment: number 1;
  content: counter(number);
  width: 2rem;
  height: 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background-color: var(--color-primary);
  color: var(--color-white);
  font-family: var(--font-secondary);
  font-size: 1.25rem;
  font-weight: bold;
  text-align: center;
  line-height: 1;
}
.p-flow__title {
  grid-area: title;
  font-size: 1.25rem;
  font-weight: bold;
  line-height: var(--line-height);
  color: var(--color-dark);
}
.p-flow__body {
  grid-area: body;
  font-size: 1rem;
  font-weight: 500;
  line-height: var(--line-height);
  color: var(--color-dark);
}
.p-flow__container {
  position: relative;
  counter-reset: number 0;
  gap: 1rem;
}
.p-flow__image {
  position: absolute;
  right: 0;
  bottom: 8.125rem;
  width: 27.5rem;
}
@media screen and (max-width: 834px) {
  .p-flow {
    grid-template-areas: "num title" "body body";
    grid-column-gap: 0.5rem;
    padding: 1.5rem;
    border-radius: 1.5rem;
  }
  .p-flow::before {
    width: 1.5rem;
    height: 1.5rem;
    font-size: 1rem;
  }
  .p-flow__title {
    font-size: 1.125rem;
  }
  .p-flow__image {
    position: absolute;
    right: 0;
    bottom: -2.5rem;
    width: 10.25rem;
  }
}
/*************************************************************
*
* price
*
*************************************************************/
.p-price {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.125rem;
  padding: 2rem;
  border-radius: 2rem;
  background-color: var(--color-blue-light2);
  color: var(--color-dark);
}
.p-price__title {
  font-size: 1.5rem;
  font-weight: bold;
  text-align: center;
}
.p-price__content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
}
.p-price__tag {
  width: fit-content;
  padding-inline: 0.5rem;
  background-color: var(--color-dark);
  font-size: 1.125rem;
  font-weight: 500;
  line-height: var(--line-height);
  color: var(--color-white);
}
.p-price__price {
  font-size: 1.125rem;
  font-weight: 500;
  line-height: var(--line-height);
  text-align: center;
}
.p-price__price .em {
  font-size: 1.5rem;
  font-weight: bold;
  color: var(--color-primary);
}
.p-price__price .num {
  font-size: 2rem;
  font-weight: bold;
  color: var(--color-primary);
}
.p-price__notice {
  font-size: 1.125rem;
  font-weight: 500;
  text-align: center;
  opacity: 0.5;
}
.p-price__list {
  max-width: 340px;
  width: 100%;
}
.p-price__container {
  display: flex;
  justify-content: center;
  gap: 2.5rem;
}
@media screen and (min-width: 835px) {
  .p-price__container .p-price {
    min-width: 28.375rem;
  }
}
@media screen and (max-width: 834px) {
  .p-price {
    padding: 1.5rem;
    border-radius: 1.5rem;
  }
  .p-price__title {
    font-size: 1.25rem;
  }
  .p-price__tag {
    font-size: 1rem;
  }
  .p-price__price {
    font-size: 1rem;
  }
  .p-price__notice {
    font-size: 1rem;
  }
  .p-price__container {
    flex-direction: column;
    gap: 1rem;
  }
}
/*************************************************************
*
* faq
*
*************************************************************/
.p-faq {
  position: relative;
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.p-faq__question, .p-faq__answer {
  padding: 2rem;
  border-radius: 2rem;
  display: flex;
  align-items: center;
  gap: 1rem;
}
.p-faq__question::before, .p-faq__answer::before {
  min-width: 2.5rem;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-secondary);
  font-size: 1.5rem;
  font-weight: bold;
  text-align: center;
  line-height: 1;
  color: var(--color-white);
}
.p-faq__question-text, .p-faq__answer-text {
  font-size: 1.25rem;
  font-weight: bold;
  line-height: var(--line-height);
}
.p-faq__question {
  padding-right: 4rem;
  position: relative;
  background-color: var(--color-light);
}
.p-faq__question::before {
  content: "Q";
  background-color: var(--color-dark);
}
.p-faq__question-button {
  width: 1.5rem;
  height: 1.5rem;
  position: absolute;
  top: 50%;
  right: 2rem;
  transform: translateY(-50%);
  transition: var(--anime-duration) var(--anime-function);
  transition-property: transform;
}
.p-faq__question-button svg {
  width: 100%;
  height: 100%;
  fill: var(--color-dark);
}
.p-faq__question-button.is-active {
  transform: scaleY(-1) translateY(50%);
}
.p-faq__answer {
  background-color: var(--color-blue-light2);
}
.p-faq__answer::before {
  content: "A";
  background-color: var(--color-accent);
}
.p-faq__container {
  gap: 2.5rem;
}
@media screen and (max-width: 834px) {
  .p-faq {
    gap: 0.5rem;
  }
  .p-faq__question, .p-faq__answer {
    padding: 1rem;
    border-radius: 1.5rem;
    gap: 0.5rem;
  }
  .p-faq__question::before, .p-faq__answer::before {
    min-width: 2rem;
    width: 2rem;
    height: 2rem;
    font-size: 1.125rem;
  }
  .p-faq__question-text, .p-faq__answer-text {
    font-size: 1rem;
  }
  .p-faq__question {
    padding-right: 3rem;
  }
  .p-faq__question-button {
    right: 1.25rem;
    width: 1rem;
    height: 1rem;
  }
  .p-faq__container {
    gap: 1.25rem;
  }
}
/*************************************************************
*
* From Box
*
*************************************************************/
.p-from-box {
  padding: 4.375rem 10.9375rem;
  background-color: rgba(255, 255, 255, 0.5);
  border-radius: var(--border-radius);
  position: relative;
}
.p-from-box .box_agree {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 30px;
}
.p-from-box .box_btns {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.5rem;
}
.p-from-box.__min {
  padding: 1.5rem 2rem;
  background-color: var(--color-light);
}
@media screen and (max-width: 1279px) {
  .p-from-box {
    padding: 3.5rem 3.5rem;
  }
  .p-from-box__min {
    padding: 1rem 1.5rem;
  }
}
@media screen and (max-width: 834px) {
  .p-from-box {
    padding: 3rem 1.25rem;
  }
  .p-from-box__min {
    padding: 1rem 1.5rem;
  }
}
@media screen and (max-width: 549px) {
  .p-from-box {
    padding: 1.5rem 1rem;
    border-radius: 0.5rem;
  }
  .p-from-box__min {
    padding: 0.5rem 1rem;
  }
}