@charset "utf-8";

/* =========================================================================================
全体指定
=========================================================================================*/

/* 埋め込み動画（YOUTUBE）*/
.iframe-wrap,
.wp-block-embed.wp-block-embed-youtube .wp-block-embed__wrapper {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  margin-bottom: 0.5em;
}
.iframe-wrap iframe,
.wp-block-embed.wp-block-embed-youtube .wp-block-embed__wrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* =========================================================================================
section
=========================================================================================*/
section.wp-block-group {
  padding-block: 0;
  margin-bottom: 100px;
}
@media only screen and (max-width: 820px) {
  section.wp-block-group {
    margin-bottom: 75px;
  }
}
@media only screen and (max-width: 468px) {
  section.wp-block-group {
    margin-bottom: 50px;
  }
}

/* =========================================================================================
見出し（デフォルト）
=========================================================================================*/
.wp-block-heading {
  font-weight: var(--bold-font-weight);
  line-height: 1.25;
  margin-bottom: 0.75em;
  position: relative;
  z-index: 1;
}
* + .wp-block-heading {
  margin-top: 1.5em;
}
h1.wp-block-heading {
  font-size: clamp(1.875rem, calc(0.822rem + 4.494vw), 3.125rem); /* min: 30px, max: 50px */
}
h2.wp-block-heading {
  font-size: clamp(1.625rem, calc(0.993rem + 2.697vw), 2.375rem); /* min: 26px, max: 38px */
}
h3.wp-block-heading {
  font-size: clamp(1.375rem, calc(1.059rem + 1.348vw), 1.75rem); /* min: 22px, max: 28px */
  line-height: 1.4;
  border-top: 1px solid;
  border-bottom: 1px solid;
  padding: 0.375em 0;
}
h4.wp-block-heading {
  color: var(--accent-color);
  font-size: clamp(1.25rem, calc(1.039rem + 0.899vw), 1.5rem); /* min: 20px, max: 24px */
  line-height: 1.4;
}
h5.wp-block-heading {
  font-size: clamp(1.125rem, calc(1.02rem + 0.449vw), 1.25rem); /* min: 18px, max: 20px */
  line-height: 1.4;
  display: inline-block;
  border-bottom: dashed 2px;
  padding-bottom: 0.25em;
}
h6.wp-block-heading {
  font-size: clamp(0.938rem, calc(0.779rem + 0.674vw), 1.125rem); /* min: 15px, max: 18px */
}
@media only screen and (max-width: 820px) {
}
@media only screen and (max-width: 468px) {
}

/* =========================================================================================
段落
=========================================================================================*/
/*デフォルトのスペース*/
.entry-content .inner > p,
.wp-block-group > p,
.wp-block-group__inner-container > p,
.wp-block-column > p {
  margin-bottom: 1em;
}
/*本文（特大）*/
.has-x-large-font-size {
  font-size: clamp(1.25rem, calc(0.197rem + 4.494vw), 2.5rem) !important; /* min: 20px, max: 40px */
  font-weight: var(--weight-bold);
  line-height: 1.5;
}
/*本文（大）*/
.has-large-font-size {
  font-size: clamp(1rem, calc(0.789rem + 0.899vw), 1.25rem) !important; /* min: 16px, max: 20px */
  font-weight: var(--weight-medium);
}
/*本文（中）*/
.has-medium-font-size {
  font-size: clamp(0.875rem, calc(0.664rem + 0.899vw), 1.125rem) !important; /* min: 14px, max: 18px */
  font-weight: var(--weight-regular);
}
/*本文（小）*/
.has-small-font-size {
  font-size: clamp(0.75rem, calc(0.592rem + 0.674vw), 0.938rem) !important; /* min: 12px, max: 15px */
  font-weight: var(--weight-regular);
}

/* =========================================================================================
画像
=========================================================================================*/
.wp-block-image {
  margin-bottom: 1em;
}

/* 角丸 */
.wp-block-image.is-style-rounded img {
  border-radius: 10px;
}

/* 小さい画像を引き延ばす　.stretchを付与*/
.wp-block-image.stretch img {
  width: 100%;
  max-width: none;
}

/* 画像に枠をつける*/
.wp-block-image.border img {
  border: 1px solid var(--color-gray);
}
.wp-block-image :where(figcaption) {
  margin-top: 0;
  margin-bottom: 0;
}

/*キャプション*/
.wp-element-caption {
  font-size: clamp(0.75rem, calc(0.592rem + 0.674vw), 0.938rem) !important; /* min: 12px, max: 15px */
  line-height: 1.4;
  padding-bottom: 0 !important;
}

/*回り込み*/
.wp-block-image .alignright {
  width: fit-content;
  max-width: 40%;
  float: right;
  margin: 0.5em 0 1em 2em;
}
.wp-block-image .alignleft {
  width: fit-content;
  max-width: 40%;
  float: left;
  margin: 0.5em 2em 1em 0;
}
@media only screen and (max-width: 820px) {
  .wp-block-image .alignright,
  .wp-block-image .alignleft {
    float: none;
    max-width: none;
    margin: 0 auto 1em;
  }
}

/* =========================================================================================
埋め込み
=========================================================================================*/
/* 横幅を制御 */
.wp-block-embed__wrapper .wp-video {
  width: 100% !important;
}
.wp-block-embed__wrapper .wp-video {
  width: 100% !important;
}

/* 線をつける */
.wp-block-embed.border {
  border: 1px solid var(--color-gray);
}

/* =========================================================================================
ボタン
=========================================================================================*/
.btn {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px;
  padding: 0;
}
.wp-block-buttons {
  display: flex;
  align-items: stretch;
}
.btn a,
.wp-block-button a {
  color: #fff;
  text-align: center;
  font-weight: var(--bold-font-weight);
  line-height: 1.5;
  background: var(--accent-color);
  min-width: 225px;
  padding: 0.35em 1.75em 0.5em 0.75em;
  border-radius: 10px;
  position: relative;
  text-decoration: none;
  transition: 0.3s;
}
.btn a::after,
.wp-block-button a::after {
  content: "";
  background: #fff;
  width: 0.75em;
  aspect-ratio: 1 / 1;
  position: absolute;
  right: 0.5em;
  top: 50%;
  translate: 0 -50%;
  -webkit-mask-image: url(images/common/arrow_right.svg);
  mask-image: url(images/common/arrow_right.svg);
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  transform: none;
  transition: 0.3s;
  z-index: 2;
}

/* 一覧用ボタン */
.btn.list a,
.wp-block-button.list a {
  padding: 0.5em 2.5em 0.6em 0.75em;
}
.btn.list a::after,
.wp-block-button.list a::after {
  content: "";
  background: #fff;
  width: 1.1em;
  aspect-ratio: 1 / 1;
  position: absolute;
  right: 0.75em;
  top: 50%;
  translate: 0 -50%;
  -webkit-mask-image: url(images/common/icon_list.svg);
  mask-image: url(images/common/icon_list.svg);
}
/*color*/
.btn a.yellow {
  color: var(--base-font-color);
  background: var(--sub-color);
  border: 2px solid var(--base-font-color);
}
.btn a.yellow::after {
  background: var(--base-font-color);
}

@media only screen and (max-width: 820px) {
}
@media only screen and (max-width: 468px) {
  .btn a {
    width: 100%;
    min-width: 110px;
  }
}

/* =========================================================================================
区切り
=========================================================================================*/
hr,
.wp-block-separator {
  width: 100%;
  max-width: 500px;
  height: 1px;
  border: none;
  background-color: #000;
  margin: 10vh auto;
}
hr,
.wp-block-separator.is-style-dots:before {
  font-size: 3em;
  letter-spacing: 1em;
  padding-left: 1em;
}
@media only screen and (max-width: 820px) {
  hr,
  .wp-block-separator {
    width: 50%;
  }
}

/* =========================================================================================
テーブル
=========================================================================================*/

/*Table*/
table,
.wp-block-table table {
  width: 100%;
  border-spacing: 0;
  margin-block: 0 0.5em;
}
caption,
.wp-element-caption {
  color: var(--base-font-color);
  padding: 0.5em 0;
  opacity: 0.5;
}
th,
td,
.wp-block-table th,
.wp-block-table td,
.wp-block-flexible-table-block-table.wp-block-flexible-table-block-table > table tr th,
.wp-block-flexible-table-block-table.wp-block-flexible-table-block-table > table tr td {
  text-align: left;
  vertical-align: top;
  padding: 1em;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 1px dashed var(--gray-color);
  position: relative;
}
th,
.wp-block-table th,
.wp-block-flexible-table-block-table.wp-block-flexible-table-block-table > table tr th {
  font-weight: var(--bold-font-weight);
}
thead th,
.wp-block-table thead th,
.wp-block-flexible-table-block-table.wp-block-flexible-table-block-table > table thead tr th {
  font-weight: 600;
  background: #ffeaa2;
}
.wp-block-table.is-style-stripes .wp-element-caption {
  border-top: 3px solid #000;
}
.wp-block-flexible-table-block-table.wp-block-flexible-table-block-table > table {
  border-top: 1px solid;
}
.wp-block-flexible-table-block-table.wp-block-flexible-table-block-table > table strong {
  display: inline-block;
}

@media only screen and (max-width: 820px) {
  .wp-block-table th,
  .wp-block-table td {
    display: block;
    width: 100%;
  }
}
@media only screen and (max-width: 468px) {
}

/*枠線なしテーブル*/
.no-border table,
.no-border table th,
.no-border table td {
  vertical-align: top !important;
  border: none !important;
}
.no-border table {
  border-collapse: separate !important;
  border-spacing: 10px !important;
}
.no-border table th {
  font-size: smaller;
  text-align: center !important;
  font-weight: var(--bold-font-weight) !important;
  display: block !important;
  min-width: 6em !important;
  background: rgb(152, 214, 25, 0.5) !important;
  border-radius: 5px;
  padding: 0 0.5em !important;
}
.no-border table td {
  line-height: 1.4;
  background: none !important;
  padding: 0 !important;
}
@media only screen and (max-width: 820px) {
  .no-border table {
    border-spacing: 0 !important;
    margin-top: 0.75em;
  }
  .no-border table th,
  .no-border table td {
    display: block !important;
  }
  .no-border table th {
    width: fit-content !important;
    margin-bottom: 0.75em;
  }
  .no-border table td {
    width: 100% !important;
    padding-bottom: 1em !important;
  }
  .no-border table tr:last-child td {
    padding-bottom: 0 !important;
  }
}
@media only screen and (max-width: 468px) {
}

/* =========================================================================================
リスト
=========================================================================================*/

/*List - ul*/
.entry-content ul,
.wp-block-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.entry-content ul li,
.wp-block-list li {
  line-height: 1.5;
  padding-block: 0.25em;
  padding-left: 1em;
  position: relative;
  z-index: 1;
}
.entry-content ul li::before,
.wp-block-list li::before {
  position: absolute;
  content: "";
  background: var(--sub-color);
  width: 0.75em;
  aspect-ratio: 1 / 1;
  border-radius: 100%;
  top: 0.65em;
  left: 0;
}
.entry-content li ul,
.wp-block-list ul {
  margin: 0 0 0 1.175em;
}

/*List - ol*/
.entry-content ol {
  margin: 0.5em 0 0.5em 1em;
  counter-reset: count 0;
  list-style: none;
}
.entry-content ol > li {
  position: relative;
  padding-left: 0.35em;
  list-style: none;
  counter-increment: count 1;
}
.entry-content ol > li::before {
  color: var(--main-color);
  content: counters(count, "-") ".";
  position: absolute;
  top: 0.25em;
  left: -0.75em;
  background: transparent;
}

/*list - note*/
ul.note li:before {
  content: "※";
  background: none;
  top: 0.3em;
}
@media only screen and (max-width: 820px) {
}
@media only screen and (max-width: 468px) {
}

/* =========================================================================================
グリッド
=========================================================================================*/
/*共通*/
.wp-block-group.is-layout-grid {
  gap: 30px;
}
.wp-block-group.is-layout-grid + .is-layout-grid {
  margin-top: 50px;
}
@media only screen and (max-width: 820px) {
  .wp-block-group.is-layout-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 30px;
  }
  .wp-block-group.is-layout-grid + .is-layout-grid {
    margin-top: 30px;
  }
}
@media only screen and (max-width: 468px) {
  .wp-block-group.is-layout-grid {
    grid-template-columns: repeat(1, 1fr) !important;
  }
  .wp-block-group.is-layout-grid + .is-layout-grid {
    margin-top: 15px;
  }
}

/* card */
.is-layout-grid.card-block .wp-block-group {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: #fff;
  border: 1px dashed var(--accent-color);
  border-radius: 15px;
  padding: 1em;
}
.is-layout-grid.card-block .wp-block-group p {
  margin-bottom: 0;
}
.is-layout-grid.card-block .wp-block-group p + p {
  margin-top: 0.5em;
}
.is-layout-grid.card-block .wp-block-group .wp-block-heading {
  color: var(--base-font-color);
  background: linear-gradient(transparent 60%, #ffeaa2 60%);
  display: inline; /* 必要に応じて指定 */
}
@media only screen and (max-width: 820px) {
  .is-layout-grid.card-block {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
  }
}
@media only screen and (max-width: 468px) {
  .is-layout-grid.card-block {
    gap: 10px;
  }
}

/* =========================================================================================
メディアとテキスト
=========================================================================================*/
.wp-block-media-text + .wp-block-media-text {
  margin-top: 2em;
}

@media only screen and (max-width: 820px) {
  .wp-block-media-text .wp-block-media-text__content {
    margin: 0;
    padding: 1.5em 0 0.5em;
  }
}

/* =========================================================================================
引用
=========================================================================================*/
blockquote {
  position: relative;
  padding: 3em 2em;
  background: #f5f5f5;
}
blockquote cite {
  display: block;
  font-size: 0.8rem;
  text-align: right;
  color: #808080;
  padding-right: 20px;
}

/* =========================================================================================
詳細
=========================================================================================*/
.wp-block-details {
  border: 2px solid #adc2cc;
  border-radius: 5px;
  padding: 0.75em 1em 0.5em;
  margin-bottom: 1em;
}
.wp-block-details summary {
  color: var(--color-main);
  font-weight: var(--weight-semibold);
  list-style: none; /* 標準仕様でマーカーを消す */
  padding-right: 1.5em;
  position: relative;
  z-index: 1;
}
.wp-block-details summary::before,
.wp-block-details summary::after {
  content: "";
  background-color: var(--color-main);
  border-radius: 10px;
  pointer-events: none; /* クリック判定を邪魔しないように */
  position: absolute;
  top: 0.75em;
  right: 0;
  z-index: 5;
  transition: transform 0.3s ease;
}
.wp-block-details summary::after {
  width: 1em;
  height: 4px;
  margin-top: -2px; /* 完全に中央にするための微調整（太さの半分） */
  right: 0;
}
.wp-block-details summary::before {
  width: 4px;
  height: 1em;
  margin-top: -0.5em;
  right: calc(0.5em - 2px); /* 横棒の中心に来るように位置調整 */
}
.wp-block-details[open] summary {
  margin-bottom: 0.5em;
}
.wp-block-details[open] summary::before {
  transform: rotate(90deg);
}

/* =========================================================================================
専用パターン　-　囲み
=========================================================================================*/
/*線*/
.wp-block-group.box-border {
  border: 4px solid #ffeaa2;
  border-radius: 15px;
  background: #fff;
  padding: 1.5em;
  margin-bottom: 1em;
}
/*背景色*/
.wp-block-group.box-bg {
  background: rgba(255, 233, 162, 0.5);
  border-radius: 15px;
  padding: calc(1.5em + 4px); /* borderと並べた時に高さがずれないように線の太さ分調整 */
  margin-bottom: 1em;
}
@media only screen and (max-width: 820px) {
  .wp-block-group.box-border {
    padding: 1em;
  }
  /*背景色*/
  .wp-block-group.box-bg {
    padding: calc(1em + 4px);
  }
}
@media only screen and (max-width: 468px) {
}

/* =========================================================================================
VK BLOCK
=========================================================================================*/
.vk_flow .vk_flow_frame {
  background: #fff;
  border-color: var(--accent-color) !important;
  border-width: 2px !important;
}
.vk_flow.vk_flow-arrow-on::after,
.vk_flow > .vk_flow_frame_arrow {
  background: url(images/common/arrow_bottom.svg) center 50% no-repeat !important;
  background-size: 38px 38px !important;
  height: 45px !important;
  width: 45px !important;
}
/* =========================================================================================
その他
=========================================================================================*/
/*全体幅*/
.alignfull {
  width: 100vw;
  margin-right: calc(50% - 50vw);
  margin-left: calc(50% - 50vw);
}

/*--------------------------------------------------
  汎用グリッド
--------------------------------------------------*/
.grid-item {
  display: grid;
  align-items: start;
}
.grid-item.column-2 {
  grid-template-columns: auto 1fr;
  gap: 0 1em;
}

.grid-item.no-gap {
  gap: 0 !important;
}
.grid-item.column-gap-1em {
  column-gap: 1em;
}
.grid-item.column-gap-2em {
  column-gap: 2em;
}
.grid-item.column-gap-3em {
  column-gap: 3em;
}
.grid-item.column-gap-4em {
  column-gap: 4em;
}
.grid-item.column-gap-5em {
  column-gap: 5em;
}

/*--------------------------------------------------
  回り込み
--------------------------------------------------*/
.float-l {
  float: left;
  max-width: 400px;
  margin-right: 3em;
  margin-bottom: 1.5em;
}
.float-r {
  float: right;
  max-width: 400px;
  margin-left: 3em;
  margin-bottom: 1.5em;
}
@media only screen and (max-width: 820px) {
  .float-l,
  .float-r {
    width: fit-content;
    float: none;
    max-width: none;
    margin-inline: auto;
  }
}
@media only screen and (max-width: 468px) {
}

/*--------------------------------------------------
  余白調整（0.5em刻み）
--------------------------------------------------*/
/* 要素下の余白（margin-bottom） */
.mb-0 {
  margin-bottom: 0 !important;
}
.mb-0-5em {
  margin-bottom: 0.5em !important;
}
.mb-1em {
  margin-bottom: 1em !important;
}
.mb-1-5em {
  margin-bottom: 1.5em !important;
}
.mb-2em {
  margin-bottom: 2em !important;
}
.mb-2-5em {
  margin-bottom: 2.5em !important;
}
.mb-3em {
  margin-bottom: 3em !important;
}
.mb-3-5em {
  margin-bottom: 3.5em !important;
}
.mb-4em {
  margin-bottom: 4em !important;
}
.mb-4-5em {
  margin-bottom: 4.5em !important;
}
.mb-5em {
  margin-bottom: 5em !important;
}

/* 要素左の余白（margin-left） */
.ml-0 {
  margin-left: 0 !important;
}
.ml-0-5em {
  margin-left: 0.5em !important;
}
.ml-1em {
  margin-left: 1em !important;
}
.ml-1-5em {
  margin-left: 1.5em !important;
}
.ml-2em {
  margin-left: 2em !important;
}
.ml-2-5em {
  margin-left: 2.5em !important;
}
.ml-3em {
  margin-left: 3em !important;
}
.ml-3-5em {
  margin-left: 3.5em !important;
}
.ml-4em {
  margin-left: 4em !important;
}
.ml-4-5em {
  margin-left: 4.5em !important;
}
.ml-5em {
  margin-left: 5em !important;
}