@charset "UTF-8";

/*-- Yaku Han JP --*/
@font-face {
  font-family: "Yaku Han JP";
  src: url("../fonts/yakuhan-jp/YakuHanJP-Thin.otf") format("opentype");
  font-weight: 100;
}

@font-face {
  font-family: "Yaku Han JP";
  src: url("../fonts/yakuhan-jp/YakuHanJP-Light.otf") format("opentype");
  font-weight: 300;
}

@font-face {
  font-family: "Yaku Han JP";
  src: url("../fonts/yakuhan-jp/YakuHanJP-Regular.otf") format("opentype");
  font-weight: 400;
}

@font-face {
  font-family: "Yaku Han JP";
  src: url("../fonts/yakuhan-jp/YakuHanJP-Medium.otf") format("opentype");
  font-weight: 500;
}

@font-face {
  font-family: "Yaku Han JP";
  src: url("../fonts/yakuhan-jp/YakuHanJP-DemiLight.otf") format("opentype");
  font-weight: 600;
}

@font-face {
  font-family: "Yaku Han JP";
  src: url("../fonts/yakuhan-jp/YakuHanJP-Bold.otf") format("opentype");
  font-weight: 700;
}

@font-face {
  font-family: "Yaku Han JP";
  src: url("../fonts/yakuhan-jp/YakuHanJP-Black.otf") format("opentype");
  font-weight: 900;
}

/*-- Higure Gothic --*/

@font-face {
  font-family: "Higure Gothic";
  src: url("../fonts/higure-gothic/HigureGothic-Light.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Higure Gothic";
  src: url("../fonts/higure-gothic/HigureGothic-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Higure Gothic";
  src: url("../fonts/higure-gothic/HigureGothic-Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Higure Gothic";
  src: url("../fonts/higure-gothic/HigureGothic-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Higure Gothic";
  src: url("../fonts/higure-gothic/HigureGothic-Black.ttf") format("truetype");
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

html {
  font-size: 62.5% !important;
  width: 100vw;
  font-kerning: normal;
  font-feature-settings: "halt";
  text-spacing-trim: auto;
  scrollbar-gutter: stable;
  scrollbar-width: none;
  /* Firefox */
  -ms-overflow-style: none;
  overflow: hidden;
}

html::-webkit-scrollbar {
  display: none;
  /* Chrome Safari */
}

.material-symbols-outlined {
  font-variation-settings:
    "FILL" 1,
    "wght" 400,
    "GRAD" 0,
    "opsz" 24;
}

body {
  width: 100vw;
  font-family: "Yaku Han JP", "Higure Gothic", "Quicksand", "Zen Maru Gothic", sans-serif;
  font-feature-settings: "palt";
  line-break: strict;
  word-break: normal;
  overflow-wrap: break-word;
  font-weight: 500;
  line-height: 1.4;
  background-color: #f8f8f8;
  color: #2d2d2d;
  overflow: hidden;
}

body.menu-open {
  overflow: clip;
}

.site-wrap {
  width: 100vw;
}

.indent-ib {
  display: inline-block;
}

.indent-b {
  display: block;
}

.copy-hl {
  display: inline-block;
  color: #eb6ea5;
}

/*-------------------------------------------------- ヘッダー --------------------------------------------------*/

.header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: calc(10px + 14 * ((100vw - 400px) / 1040));
  padding-right: calc(10px + 14 * ((100vw - 400px) / 1040));
  padding-left: calc(24px + 16 * ((100vw - 400px) / 1040));
  position: fixed;
  width: 100vw;
  box-sizing: border-box;
  z-index: 10;
}

.hd-logo-img-box {
  width: calc(120px + 50 * ((100vw - 400px) / 1040));
  height: calc(56px + 8 * ((100vw - 400px) / 1040));
  display: flex;
  align-items: center;
}

.hd-logo-img {
  width: 100%;
  object-fit: cover;
}

@media screen and (max-width: 1280px) {
  .global-nav {
    display: none;
  }
}

.global-nav-cont {
  display: flex;
  align-items: center;
  font-size: calc(14px + 2 * ((100vw - 400px) / 1040));
  font-weight: 700;
  gap: 0.5em;
}

.global-nav-list {
  padding: 0.5em 0.75em;
}

.hd-btns {
  display: flex;
  align-items: center;
  font-weight: 700;
  line-height: 1;
  gap: 0.5em;
  z-index: 30;
  position: relative;
  padding-right: calc(64px + 16 * ((100vw - 400px) / 1040));
}

.hd-cv {
  background-color: #eb6ea5;
  color: #fff;
  padding: 1em 1.5em;
  border-radius: 9999px;
  display: block;
  font-size: calc(16px + 2 * ((100vw - 400px) / 1040));
}

.hd-cv:hover {
  background-color: #4b4b4be6;
}

@media screen and (max-width: 1280px) {
  .hd-cv {
    display: none;
  }
}

.hd-hamb {
  position: fixed;
  top: calc(10px + 14 * ((100vw - 400px) / 1040));
  right: calc(10px + 14 * ((100vw - 400px) / 1040));
  z-index: 30;
  width: calc(56px + 8 * ((100vw - 400px) / 1040));
  aspect-ratio: 1 / 1;
  border: 1px solid #f0f0f0;
  background-color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  cursor: pointer;
}

.hd-hamb.is-open {
  background-color: transparent;
  border-color: transparent;
}

.hamb-dot-box {
  display: flex;
  gap: 4px;
  transition: transform 0.3s ease;
}

.hd-hamb:hover .hamb-dot-box {
  transform: rotate(-90deg);
}

.hd-hamb.is-open .hamb-dot-box {
  transform: rotate(-90deg);
}

.hamb-dot {
  width: 4px;
  aspect-ratio: 1 / 1;
  background-color: #e15889;
  border-radius: 9999px;
}

.hd-hamb.is-open .hamb-dot {
  background-color: #fff;
}

/*-------------------------------------------------- メニュー --------------------------------------------------*/

.fs-menu {
  position: fixed;
  inset: 0;
  z-index: 20;
  width: 100%;
  height: 100dvh;
  background-color: #f8f8f880;
  color: #fff;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition:
    opacity 0.4s ease,
    visibility 0.4s ease;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);

  display: flex;
  flex-direction: column;
  align-items: flex-end;
}

/* メニューが開いた状態 */
.fs-menu.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.fs-menu-wrap {
  display: flex;
  justify-content: flex-end;
  gap: max(0px, calc(80 * ((100vw - 400px) / 1040)));
  width: fit-content;
  height: 100dvh;
  background: #eb6ea5;
  margin-top: calc(4px + 6 * ((100vw - 400px) / 1040));
  margin-left: calc(10px + 14 * ((100vw - 400px) / 1040));
  margin-right: calc(4px + 6 * ((100vw - 400px) / 1040));
  margin-bottom: calc(4px + 6 * ((100vw - 400px) / 1040));
  padding: calc(104px + (-16) * ((100vw - 400px) / 1040)) calc(32px + 48 * ((100vw - 400px) / 1040));
  border-radius: calc(28px + 4 * ((100vw - 400px) / 1040));
  box-sizing: border-box;
  overflow-y: auto;
}

@media screen and (max-width: 768px) {
  .fs-menu-wrap {
    width: 100%;
    margin: 0;
    border-radius: 0;
    justify-content: center;
  }
}

.fs-menu-nav-grp {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: calc(28px + 4 * ((100vw - 400px) / 1040));
}

@media screen and (max-width: 768px) {
  .fs-menu-nav-grp {
    width: 100%;
  }
}

.fs-menu-tag {
  font-size: calc(14px + 2 * ((100vw - 400px) / 1040));
  font-weight: 700;
  line-height: 1;
  color: #f7d5e1;
}

.fs-menu-nav-cont {
  width: calc(336px + 144 * ((100vw - 400px) / 1040));
}

@media screen and (max-width: 768px) {
  .fs-menu-nav-cont {
    width: 100%;
  }
}

.fs-menu-nav {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1.25em;
  line-height: 1;
  font-size: calc(18px + 2 * ((100vw - 400px) / 1040));
  font-weight: 700;
}

.fs-menu-nav li {
  list-style: none;
}

.fs-menu-nav a {
  display: block;
}

.fs-menu-cv {
  font-size: calc(18px + 2 * ((100vw - 400px) / 1040));
  padding: 1em;
  margin: 2em 0;
  background: #fff;
  color: #eb6ea5;
  font-weight: 700;
  text-align: center;
  border-radius: 9999px;
}

.fs-menu-pp {
  font-size: calc(13px + 1 * ((100vw - 400px) / 1040));
  font-weight: 700;
  line-height: 1;
}

.fs-menu-cr {
  font-size: calc(11px + 1 * ((100vw - 400px) / 1040));
  font-weight: 600;
  color: #ffffff80;
  line-height: 1;
}

.fs-menu-img-cont {
  width: max(0px, calc(400 * ((100vw - 400px) / 1040)));
}

@media screen and (max-width: 1280px) {
  .fs-menu-img-cont {
    display: none;
  }
}

.fs-menu-slide {
  margin-bottom: 10%;
}

.fs-menu-slide img {
  width: 100%;
  object-fit: contain;
  border-radius: calc(8px + 4 * ((100vw - 400px) / 1040));
}

.fs-menu-bnr {
  width: 100%;
  object-fit: contain;
  border-radius: calc(8px + 4 * ((100vw - 400px) / 1040));
}

/*-------------------------------------------------- TOP --------------------------------------------------*/

main {
  width: 100%;
}

/*-------------------------------------------------- TOP／ヒーロー --------------------------------------------------*/

#top-hero {
  width: 100%;
  height: 100%;
}

.top-hero-wrap {
  width: 100%;
  height: 100%;
  background-image: url(../img/kv-quarter-circle-r-fff.svg), url(../img/kv-quarter-circle-l-fff.svg);
  background-repeat: no-repeat, no-repeat;
  background-size: calc(240px + 280 * ((100vw - 400px) / 1040)), calc(240px + 280 * ((100vw - 400px) / 1040));
  background-position:
    top right,
    bottom left;
}

/*-------------------------------------------------- TOP／KVイラストスライダー --------------------------------------------------*/

.kv-il-swiper {
  width: 100%;
  padding-top: calc(64px + 56 * ((100vw - 400px) / 1040)) !important;
}

.kv-il-swiper .swiper-wrapper {
  transition-timing-function: linear;
}

.kv-il-slide {
  width: calc(200px + 120 * ((100vw - 400px) / 1040)) !important;
  aspect-ratio: 1 / 1;
}

.kv-il-slide-item {
  width: 100%;
  height: 100%;
}

.kv-il-slide-item img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/*-------------------------------------------------- TOP／ヒーローコピー --------------------------------------------------*/

.top-copy-wrap {
  position: relative;
}

.top-scroll-sign-blk {
  position: absolute;
  bottom: 0;
  left: calc(24px + 8 * ((100vw - 400px) / 1040));
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: fit-content;
  line-height: 1;
  width: 2em;
}

@media screen and (max-width: 1040px) {
  .top-scroll-sign-blk {
    left: calc(12px + 4 * ((100vw - 400px) / 1040));
  }
}

@media screen and (max-width: 768px) {
  .top-scroll-sign-blk {
    left: calc(24px + 112 * ((100vw - 400px) / 1040));
  }
}

.top-scroll-sign-txt-box {
  width: 7em;
  height: fit-content;
  transform: rotate(90deg);
  transform-origin: center;
  font-family: "Quicksand", sans-serif;
  font-size: calc(12px + 2 * ((100vw - 400px) / 1040));
  font-weight: 700;
  letter-spacing: 0.04em;
  line-height: 1;
  white-space: nowrap;
}

.top-copy-area {
  width: 100%;
  box-sizing: border-box;
  padding-top: calc(24px + 16 * ((100vw - 400px) / 1040));
  padding-left: calc(24px + 112 * ((100vw - 400px) / 1040));
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  font-size: calc(32px + 32 * ((100vw - 400px) / 1040));
  gap: calc(40px + 24 * ((100vw - 400px) / 1040));
}

@media screen and (max-width: 1040px) {
  .top-copy-area {
    flex-direction: column;
  }
}

.top-copy-lead-cont {
  width: 100%;
  box-sizing: border-box;
}

@media screen and (max-width: 768px) {
  .top-copy-lead-cont {
    padding-right: calc(24px + 112 * ((100vw - 400px) / 1040));
  }
}

.top-copy-lead-main {
  font-weight: 700;
  margin-bottom: 0.5em;
  line-height: 1.25;
  text-align: left;
  display: block;
}

@media screen and (max-width: 1040px) {
  .top-copy-lead-main {
    letter-spacing: -0.04em;
  }
}

.top-copy-lead-sub-cta-blk {
  display: flex;
  position: relative;
  font-size: calc(14px + 2 * ((100vw - 400px) / 1040));
}

@media screen and (max-width: 768px) {
  .top-copy-lead-sub-cta-blk {
    gap: 1.75em;
    flex-direction: column;
  }
}

@media screen and (max-width: 400px) {
  .top-copy-lead-sub-cta-blk {
    flex-direction: column;
  }
}

.top-copy-lead-sub {
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: 0.02em;
  color: #4b4b4be6;
  margin-right: auto;
}

.top-copy-cta-cont {
  width: fit-content;
  margin-left: auto;
  background-color: #eb6ea5;
  color: #fff;
  font-size: calc(18px + 2 * ((100vw - 400px) / 1040));
  font-weight: 700;
  padding: 2.25em 2em 2.25em 3em;
  border-radius: 9999px 0 0 9999px;
  position: absolute;
  right: 0;
  bottom: 0;
  box-sizing: border-box;
}

@media screen and (max-width: 1280px) {
  .top-copy-cta-cont {
    text-align: center;
    padding: 1.25em 1em 1.25em 2em;
  }
}

@media screen and (max-width: 1040px) {
  .top-copy-cta-cont {
    padding: 1.25em 0.75em 1.25em 2em;
  }
}

@media screen and (max-width: 768px) {
  .top-copy-cta-cont {
    width: 85%;
    flex: 1;
    position: relative;
    text-align: left;
    padding: 1.25em;
    margin-left: auto;
    border-radius: 9999px;
  }
}

@media screen and (max-width: 400px) {
  .top-copy-cta-cont {
    left: calc(24px + 112 * ((100vw - 400px) / 1040));
    padding: 1.75em 1.25em;
    border-radius: 9999px 0 0 9999px;
  }
}

.top-copy-cta-tag {
  font-family: "Quicksand", sans-serif;
  color: #f7d5e1;
  font-size: 1.4rem;
}

@media screen and (max-width: 1040px) {
  .top-copy-cta-tag {
    display: none;
  }
}

.top-copy-cta-txt-blk {
  display: flex;
  align-items: center;
  line-height: 1.25;
  gap: 2em;
  margin: 0.5em 0;
}

@media screen and (max-width: 1280px) {
  .top-copy-cta-txt-blk {
    flex-direction: column;
    gap: 1em;
    margin: 0.25em 0;
  }
}

@media screen and (max-width: 1040px) {
  .top-copy-cta-txt-blk {
    gap: 0.5em;
  }
}

@media screen and (max-width: 768px) {
  .top-copy-cta-txt-blk {
    flex-direction: row;
    justify-content: center;
    margin: 0;
  }
}

@media screen and (max-width: 1040px) {
  .top-copy-cta-txt-blk .indent-ib {
    display: block;
  }
}

@media screen and (max-width: 768px) {
  .top-copy-cta-txt-blk .indent-ib {
    display: inline-block;
  }
}

.top-copy-cta-txt {
  flex: 1;
  text-align: center;
}

@media screen and (max-width: 400px) {
  .top-copy-cta-txt {
    text-align: left;
  }
}

.circle-btn {
  width: calc(32px + 8 * ((100vw - 400px) / 1040));
  aspect-ratio: 1 / 1;
  background-color: #fff;
  background-image: url(../img/arrow-20-20-eb6ea5.svg);
  background-repeat: no-repeat;
  background-size: calc(16px + 4 * ((100vw - 400px) / 1040));
  background-position: center;
  border-radius: 9999px;
}

/*-------------------------------------------------- TOP／FV下お知らせ --------------------------------------------------*/

.fv-info-pick-blk {
  display: flex;
  align-items: center;
  background-color: #fff;
  border-radius: 9999px;
  border: 2px solid #2d2d2d0d;
  padding: 1em 1.5em;
  margin-top: calc(32px + 32 * ((100vw - 400px) / 1040));
  margin-right: calc(16px + 104 * ((100vw - 400px) / 1040));
  margin-left: calc(16px + 104 * ((100vw - 400px) / 1040));
  font-size: calc(16px + 2 * ((100vw - 400px) / 1040));
}

@media screen and (max-width: 768px) {
  .fv-info-pick-blk {
    flex-direction: column;
    padding: 1.5em 2em;
    border-radius: 1em;
    align-items: flex-start;
    gap: 1em;
  }
}

.fv-info-pick-cat-box {
  font-size: calc(14px + 2 * ((100vw - 400px) / 1040));
  white-space: nowrap;
  font-weight: 700;
  line-height: 1;
  padding: 0.5em 0 0.5em 0.5em;
  color: #4b4b4be6;
  margin-right: 2em;
  border-right: 2px solid #2d2d2d1a;
}

@media screen and (max-width: 768px) {
  .fv-info-pick-cat-box {
    border-right: none;
    padding: 0;
  }
}

.fv-info-pick-cat {
  padding-right: 2em;
}

.fv-info-pick-title-box {
  display: flex;
  align-items: center;
  gap: 1em;
  font-weight: 500;
  color: #4b4b4be6;
  flex: 1;
}

.fv-info-pick-title-item {
  display: flex;
  align-items: center;
  gap: 1em;
  margin-right: auto;
}

@media screen and (max-width: 768px) {
  .fv-info-pick-title-item {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.25em;
  }
}

.fv-info-pick-title {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
}

.fv-info-pick-date {
  font-size: calc(14px + 2 * ((100vw - 400px) / 1040));
  font-weight: 700;
  line-height: 1;
  color: #2d2d2d80;
}

.circle-btn-wide {
  width: calc(40px + 6 * ((100vw - 400px) / 1040));
  height: calc(24px + 4 * ((100vw - 400px) / 1040));
  aspect-ratio: 5 / 3;
  background-color: #2d2d2d;
  background-image: url(../img/arrow-18-18-fff.svg);
  background-repeat: no-repeat;
  background-size: calc(16px + 2 * ((100vw - 400px) / 1040));
  background-position: center;
  border-radius: 9999px;
}

/*-------------------------------------------------- TOP／ABOUT導線 --------------------------------------------------*/

#top-about {
  padding-top: calc(56px + 64 * ((100vw - 400px) / 1040));
}

/*-------------------------------------------------- TOP／ABOUT導線ワークイメージスライダー --------------------------------------------------*/

.work-img-swiper {
  position: relative;
  margin-bottom: calc(40px + 80 * ((100vw - 400px) / 1040));
}

.top-work-slide-object {
  position: absolute;
  z-index: 10;
}

.top-work-slide-object-ball-1 {
  width: calc(12px + 12 * ((100vw - 400px) / 1040));
  left: calc(8px + 12 * ((100vw - 400px) / 1040));
  top: calc(20px + 12 * ((100vw - 400px) / 1040));
}

@media screen and (max-width: 768px) {
  .top-work-slide-object-ball-1 {
    z-index: 2;
  }
}

.top-work-slide-object-ball-2 {
  width: calc(12px + 8 * ((100vw - 400px) / 1040));
  aspect-ratio: 1 / 1;
  right: calc(40px + 156 * ((100vw - 400px) / 1040));
  top: calc(160px + (-40) * ((100vw - 400px) / 1040));
  z-index: -1;
}

@media screen and (max-width: 768px) {
  .top-work-slide-object-ball-2 {
    z-index: 2;
  }
}

.top-work-slide-object-tri {
  width: calc(16px + 8 * ((100vw - 400px) / 1040));
  right: calc(120px + 600 * ((100vw - 400px) / 1040));
  top: calc(40px + (-20) * ((100vw - 400px) / 1040));
  z-index: 2;
}

@media screen and (max-width: 768px) {
  .top-work-slide-object-tri {
    z-index: 2;
  }
}

.top-work-slide-object-square {
  width: calc(16px + 12 * ((100vw - 400px) / 1040));
  left: calc(120px + 200 * ((100vw - 400px) / 1040));
  bottom: calc(8px + 12 * ((100vw - 400px) / 1040));
}

@media screen and (max-width: 768px) {
  .top-work-slide-object-square {
    z-index: 2;
  }
}

.work-img-slide {
  width: auto !important;
}

.work-img-slide-img-box {
  width: fit-content;
  height: fit-content;
}

.work-img-slide-img {
  object-fit: cover;
  display: block;
  width: 100%;
  height: 100%;
  border-radius: calc(24px + 3 * ((100vw - 400px) / 1040));
}

.work-img-slide-img-1,
.work-img-slide-img-9 {
  width: calc(240px + 187 * ((100vw - 400px) / 1040));
  height: auto;
  aspect-ratio: 4 / 3;
}

.work-img-slide-img-3,
.work-img-slide-img-6 {
  width: calc(160px + 160 * ((100vw - 400px) / 1040));
  height: auto;
  aspect-ratio: 4 / 3;
}

.work-img-slide-img-2,
.work-img-slide-img-4,
.work-img-slide-img-8 {
  width: calc(120px + 120 * ((100vw - 400px) / 1040));
  height: auto;
  aspect-ratio: 1 / 1;
}

.work-img-slide-img-5,
.work-img-slide-img-7 {
  width: calc(160px + 160 * ((100vw - 400px) / 1040));
  height: auto;
  aspect-ratio: 1 / 1;
}

.work-img-slide-img-3,
.work-img-slide-img-5,
.work-img-slide-img-7,
.work-img-slide-img-9 {
  margin-top: calc(40px + 40 * ((100vw - 400px) / 1040));
}

.work-img-slide-img-2 {
  margin-top: calc(80px + 80 * ((100vw - 400px) / 1040));
}

.work-img-slide-img-6 {
  margin-top: calc(20px + 20 * ((100vw - 400px) / 1040));
}

.work-img-slide-img-2,
.work-img-slide-img-5,
.work-img-slide-img-8 {
  border-radius: 9999px;
}

/*-------------------------------------------------- TOP／ABOUT導線説明ブロック --------------------------------------------------*/

.top-about-exp-cont {
  font-size: calc(32px + 24 * ((100vw - 400px) / 1040));
  margin: 0 max(0px, calc(20 * ((100vw - 400px) / 1040)));
  background-color: #fff;
  border-radius: calc(40px + 40 * ((100vw - 400px) / 1040));
  padding-top: calc(64px + 56 * ((100vw - 400px) / 1040));
  padding-bottom: calc(80px + 80 * ((100vw - 400px) / 1040));
}

.cmnt-bb {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  width: fit-content;
  margin: 0 auto;
}

.cmnt-bb-txt {
  background-color: #eb6ea5;
  font-size: calc(16px + 4 * ((100vw - 400px) / 1040));
  padding: 1em 1.5em;
  border-radius: 9999px;
  line-height: 1;
  letter-spacing: -0.02em;
  color: #fff;
  font-weight: 500;
  display: block;
}

.cmnt-bb-edge {
  height: fit-content;
}

.cmnt-bb-edge img {
  width: calc(22px + 4 * ((100vw - 400px) / 1040));
  height: calc(13px + 4 * ((100vw - 400px) / 1040));
}

.top-about-exp-h {
  font-weight: 700;
  text-align: center;
  letter-spacing: -0.02em;
  margin: 0.75em calc(32px + 288 * ((100vw - 400px) / 1040));
}

.top-about-exp-heart {
  position: relative;
  width: 100%;
  height: calc(160px + 150 * ((100vw - 400px) / 1040));
  isolation: isolate;
  overflow-x: hidden;
}

.top-about-exp-heart img {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: calc(433px + 407 * ((100vw - 400px) / 1040));
  height: auto;
}

.top-about-exp-heart-l {
  z-index: 2;
  left: calc(-160px + 160 * ((100vw - 400px) / 1040));
}

.top-about-exp-heart-r {
  z-index: 1;
  right: calc(-160px + 160 * ((100vw - 400px) / 1040));
}

.top-about-exp-txt-blk {
  margin: 1em calc(32px + 288 * ((100vw - 400px) / 1040));
}

.top-about-exp-txt {
  color: #4b4b4be6;
  font-size: calc(16px + 2 * ((100vw - 400px) / 1040));
  font-weight: 700;
  line-height: 2;
  letter-spacing: 0.02em;
  margin-bottom: 1em;
}

.main-btn-box {
  display: flex;
  align-items: center;
  width: fit-content;
  font-size: calc(16px + 4 * ((100vw - 400px) / 1040));
  justify-content: center;
  margin: 0 auto;
}

.main-btn-txt {
  background-color: #eb6ea5;
  color: #fff;
  line-height: 1;
  letter-spacing: -0.02em;
  padding: 1em 1.25em;
  border-radius: 9999px;
  font-weight: 700;
  transition: 0.2s ease-out;
}

.main-btn-box:hover .main-btn-txt {
  border-radius: 9999px 0 0 9999px;
}

.main-btn-circle-btn {
  width: calc(16px + 4 * ((100vw - 400px) / 1040));
  aspect-ratio: 1 / 1;
  background-color: #eb6ea5;
  background-image: url(../img/arrow-20-20-fff.svg);
  background-repeat: no-repeat;
  background-size: calc(16px + 4 * ((100vw - 400px) / 1040));
  background-position: center;
  border-radius: 9999px;
  padding: 1em;
  transition: 0.2s ease-out;
}

.main-btn-box:hover .main-btn-circle-btn {
  border-radius: 0 9999px 9999px 0;
}

/*-------------------------------------------------- TOP／FACILITY導線ブロック --------------------------------------------------*/

#top-facility {
  font-size: calc(28px + 20 * ((100vw - 400px) / 1040));
  position: relative;
  overflow-x: hidden;
}

.top-facility-wrap {
  padding-top: calc(80px + 80 * ((100vw - 400px) / 1040));
  padding-left: calc(24px + 96 * ((100vw - 400px) / 1040));
  padding-right: calc(24px + 96 * ((100vw - 400px) / 1040));
}

.top-facility-circle {
  position: absolute;
  z-index: -1;
}

.top-facility-circle-1 {
  width: calc(80px + 40 * ((100vw - 400px) / 1040));
  aspect-ratio: 1 / 1;
  right: calc(-40px + (-20) * ((100vw - 400px) / 1040));
  top: calc(64px + 156 * ((100vw - 400px) / 1040));
}

.top-facility-circle-2 {
  width: calc(160px + 80 * ((100vw - 400px) / 1040));
  aspect-ratio: 1 / 1;
  left: calc(-80px + (-40) * ((100vw - 400px) / 1040));
  top: calc(280px + 680 * ((100vw - 400px) / 1040));
}

.h-tag {
  display: flex;
  font-size: calc(14px + 2 * ((100vw - 400px) / 1040));
  font-weight: 700;
  gap: 0.5em;
  line-height: 1;
  color: #eb6ea5;
}

.h-tag-dot-unit {
  display: flex;
  align-items: center;
  gap: 0.25em;
}

.h-tag-dot {
  width: 0.5em;
  aspect-ratio: 1 / 1;
  border-radius: 9999px;
}

.h-tag-dot-1 {
  background-color: #f7d5e1;
}

.h-tag-dot-2 {
  background-color: #eb6ea5;
}

.top-facility-h-tag {
  margin-bottom: 1em;
}

.top-facility-h-grp {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 2em;
}

@media screen and (max-width: 768px) {
  .top-facility-h-grp {
    flex-direction: column;
    gap: 0.75em;
  }
}

.top-facility-h {
  display: flex;
  align-items: baseline;
  font-weight: 700;
  letter-spacing: -0.02em;
}

.top-facility-h-l {
  font-size: calc(40px + 24 * ((100vw - 400px) / 1040));
  margin-right: -0.2em;
}

.top-facility-h-exp-txt {
  font-size: calc(15px + 1 * ((100vw - 400px) / 1040));
  width: calc(352px + 208 * ((100vw - 400px) / 1040));
  line-height: 1.6;
  letter-spacing: 0.02em;
  font-weight: 500;
  color: #4b4b4be6;
}

@media screen and (max-width: 768px) {
  .top-facility-h-exp-txt {
    width: 100%;
  }
}

/*-------------------------------------------------- TOP／FACILITY導線/拠点リスト--------------------------------------------------*/

.top-facility-place-grp {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-wrap: wrap;
  column-gap: calc(32px + 88 * ((100vw - 400px) / 1040));
  row-gap: calc(40px + 40 * ((100vw - 400px) / 1040));
  margin-bottom: 2em;
}

.top-facility-place-list {
  width: calc(33% - (20px + 60 * ((100vw - 400px) / 1040)));
  height: auto;
  font-size: calc(18px + 6 * ((100vw - 400px) / 1040));
}

@media screen and (max-width: 1040px) {
  .top-facility-place-list {
    width: calc(160px + 160 * ((100vw - 400px) / 1040));
  }
}

@media screen and (max-width: 400px) {
  .top-facility-place-list {
    width: calc(50% - (16px + 44 * ((100vw - 400px) / 1040)));
  }
}

.top-facility-place-list:nth-child(2),
.top-facility-place-list:nth-child(5) {
  margin-top: calc(40px + 0 * ((100vw - 400px) / 1040));
}

@media screen and (max-width: 1040px) {
  .top-facility-place-list:nth-child(2),
  .top-facility-place-list:nth-child(5) {
    margin-top: 0;
  }
}

.top-facility-place-img {
  width: 100%;
  object-fit: cover;
  border-radius: calc(18px + 18 * ((100vw - 400px) / 1040));
}

.top-facility-place-name-box {
  display: flex;
  align-items: center;
  font-size: calc(18px + 6 * ((100vw - 400px) / 1040));
  gap: 1em;
}

@media screen and (max-width: 768px) {
  .top-facility-place-name-box {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.5em;
  }
}

.top-facility-place-name-item {
  margin-top: 0.5em;
  margin-right: auto;
  font-weight: 700;
  line-height: 1.25;
  flex: 1;
}

.top-facility-place-type {
  font-size: calc(12px + 2 * ((100vw - 400px) / 1040));
  color: #eb6ea5;
  padding-bottom: 0.5em;
  display: inline-block;
  position: relative;
  line-height: 1;
}

.top-facility-place-type::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 100%;
  height: 2px;
}

.facility-place-type-b {
  color: #65a6d7;
}

.facility-place-type-b::after {
  background: radial-gradient(circle, #65a6d7 1px, transparent 1px);
  background-size: 4px 2px;
  background-repeat: repeat-x;
}

.facility-place-type-a::after {
  background: radial-gradient(circle, #eb6ea5 1px, transparent 1px);
  background-size: 4px 2px;
  background-repeat: repeat-x;
}

.top-facility-place-name {
  margin-top: 0.6em;
  margin-bottom: 0.25em;
}

.top-facility-place-name-sub {
  font-family: "Quicksand", sans-serif;
  font-weight: 600;
  font-size: calc(12px + 2 * ((100vw - 400px) / 1040));
  color: #2d2d2d80;
}

.way-wrap {
  width: 100%;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}

.top-facility-way-wrap {
  margin-top: calc(-16px - 194 * ((100vw - 400px) / 1040));
  position: relative;
  z-index: -1;
}

.way-blk {
  display: flex;
  width: max-content;
  margin-inline: auto;
}

.way-blk-type-a .way-straight {
  width: calc(240px + 640 * ((100vw - 400px) / 1040));
  position: relative;
}

.way-straight::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: calc(80px + 60 * ((100vw - 400px) / 1040));
  background: #fff;
  transform: translate(-50%, -50%);
}

.way-l-curve-down {
  width: calc(160px + 310 * ((100vw - 400px) / 1040));
  aspect-ratio: 1 / 1;
  border-left: calc(80px + 60 * ((100vw - 400px) / 1040)) solid #fff;
  border-top: calc(80px + 60 * ((100vw - 400px) / 1040)) solid #fff;
  border-radius: 9999px 0 0 0;
  box-sizing: border-box;
  margin-top: calc(80px + 250 * ((100vw - 400px) / 1040));
}

.way-l-curve-up {
  width: calc(160px + 310 * ((100vw - 400px) / 1040));
  aspect-ratio: 1 / 1;
  border-left: calc(80px + 60 * ((100vw - 400px) / 1040)) solid #fff;
  border-bottom: calc(80px + 60 * ((100vw - 400px) / 1040)) solid #fff;
  border-radius: 0 0 0 9999px;
  box-sizing: border-box;
  margin-bottom: calc(80px + 250 * ((100vw - 400px) / 1040));
}

.way-r-curve-down {
  width: calc(160px + 310 * ((100vw - 400px) / 1040));
  aspect-ratio: 1 / 1;
  border-right: calc(80px + 60 * ((100vw - 400px) / 1040)) solid #fff;
  border-top: calc(80px + 60 * ((100vw - 400px) / 1040)) solid #fff;
  border-radius: 0 9999px 0 0;
  box-sizing: border-box;
  margin-top: calc(80px + 250 * ((100vw - 400px) / 1040));
}

.way-r-curve-up {
  width: calc(160px + 310 * ((100vw - 400px) / 1040));
  aspect-ratio: 1 / 1;
  border-right: calc(80px + 60 * ((100vw - 400px) / 1040)) solid #fff;
  border-bottom: calc(80px + 60 * ((100vw - 400px) / 1040)) solid #fff;
  border-radius: 0 0 9999px 0;
  box-sizing: border-box;
  margin-bottom: calc(80px + 250 * ((100vw - 400px) / 1040));
}

.way-spacer {
  width: calc(160px + 310 * ((100vw - 400px) / 1040));
  position: relative;
}

.way-spacer::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: calc(80px + 60 * ((100vw - 400px) / 1040));
  background: #fff;
  transform: translate(-50%, -50%);
}
/*-------------------------------------------------- TOP／feature導線 --------------------------------------------------*/

#top-feature {
  font-size: calc(28px + 20 * ((100vw - 400px) / 1040));
  margin-top: calc(-16px + (-154) * ((100vw - 400px) / 1040));
  margin-bottom: calc(96px + 104 * ((100vw - 400px) / 1040));
  padding-top: calc(64px + 56 * ((100vw - 400px) / 1040));
}

.top-feature-h-area {
  width: calc(352px + 448 * ((100vw - 400px) / 1040));
  margin: 0 auto;
  position: relative;
}

.top-feature-h-area::before {
  content: "";
  width: calc(80px + 120 * ((100vw - 400px) / 1040));
  aspect-ratio: 1 / 1;
  background: url("../img/cv-il-3.svg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  position: absolute;
  top: 0;
  left: calc(-80px + (-120) * ((100vw - 400px) / 1040));
}

.top-feature-h-area::after {
  content: "";
  width: calc(80px + 120 * ((100vw - 400px) / 1040));
  aspect-ratio: 1 / 1;
  background: url("../img/cv-il-4.svg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  position: absolute;
  top: 0;
  right: calc(-80px + (-120) * ((100vw - 400px) / 1040));
}

@media screen and (max-width: 768px) {
  .top-feature-h-area::before {
    top: calc(-80px + (-120) * ((100vw - 400px) / 1040));
    left: calc(-8px + (-72) * ((100vw - 400px) / 1040));
  }

  .top-feature-h-area::after {
    top: calc(-80px + (-120) * ((100vw - 400px) / 1040));
    right: calc(-8px + (-72) * ((100vw - 400px) / 1040));
  }
}

.top-feature-h {
  text-align: center;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: -0.02em;
  margin-top: 0.75em;
  margin-bottom: 1em;
}

.top-feature-h-exp-txt {
  text-align: center;
  font-size: calc(15px + 1 * ((100vw - 400px) / 1040));
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: 0.02em;
  color: #4b4b4be6;
}

.top-feature-swiper-cont {
  width: calc(376px + 944 * ((100vw - 400px) / 1040));
  margin-left: auto !important;
  position: relative;
  box-sizing: border-box;
  margin: 2em 0;
}

.top-feature-swiper {
  margin-left: max(0px, calc(240 * ((100vw - 400px) / 1040))) !important;
  padding-right: calc(80px + 200 * ((100vw - 400px) / 1040)) !important;
  overflow: visible !important;
  padding-top: 1em;
  padding-bottom: 1em;
}

.top-feature-slide {
  width: calc(264px + 96 * ((100vw - 400px) / 1040)) !important;
}

.top-feature-slide:nth-child(even) {
  margin-top: max(0px, calc(80 * ((100vw - 400px) / 1040)));
}

.top-feature-slide-img-box {
  width: 100%;
  aspect-ratio: 3 / 2;
  position: relative;
  z-index: 0;
}

.top-feature-slide-img-box::after {
  content: "";
  position: absolute;
  inset: 0;
  background-color: #c2def3;
  border-radius: 9999px;
  z-index: -1;
}

.top-feature-slide-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 9999px;
  transform-origin: left bottom;
  transform: rotate(-4deg);
}

.top-feature-swiper-nav {
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: calc(122px + 24 * ((100vw - 400px) / 1040));
  height: calc(60px + 12 * ((100vw - 400px) / 1040));
  z-index: 2;
  border-radius: 9999px;
  font-size: calc(20px + 4 * ((100vw - 400px) / 1040));
  background: linear-gradient(to right, transparent calc(50% - 1px), #ffffff1a calc(50% - 1px), #ffffff1a calc(50% + 1px), transparent calc(50% + 1px)) center / 2px calc(20px + 4 * ((100vw - 400px) / 1040)) no-repeat;
  background-color: #4b4b4be6;
}

.swiper-button-prev:after,
.swiper-button-next:after {
  display: none;
}

.swiper-button-prev {
  left: calc(20px + 4 * ((100vw - 400px) / 1040)) !important;
  color: #fff !important;
}

.swiper-button-next {
  right: calc(20px + 4 * ((100vw - 400px) / 1040)) !important;
  color: #fff !important;
}

.material-symbols-outlined {
  font-size: calc(20px + 4 * ((100vw - 400px) / 1040));
}

@media screen and (max-width: 1040px) {
  .top-feature-swiper-nav {
    display: none;
  }
}

.top-feature-slide-h {
  font-size: calc(20px + 4 * ((100vw - 400px) / 1040));
  font-weight: 700;
  margin-top: 1.66em;
  margin-bottom: 1em;
}

.top-feature-slide-txt {
  font-size: calc(14px + 2 * ((100vw - 400px) / 1040));
  font-weight: 500;
  line-height: 1.6;
  color: #4b4b4be6;
}

/*-------------------------------------------------- TOPインサート --------------------------------------------------*/

#top-insert {
  padding-bottom: calc(64px + 56 * ((100vw - 400px) / 1040));
}

.top-insert-wrap {
  display: flex;
  justify-content: flex-start;
  column-gap: calc(40px + (120) * ((100vw - 400px) / 1040));
  overflow-x: hidden;
  width: 100vw;
  height: calc(280px + 360 * ((100vw - 400px) / 1040));
}

.top-insert-img-box {
  display: flex;
  align-items: center;
  position: relative;
  overflow-x: hidden;
}

.top-insert-img {
  width: auto;
  height: 100%;
  will-change: transform;
}

.top-insert-img-box-1 {
  border-radius: 0 9999px 9999px 0;
  width: calc(220px + 580 * ((100vw - 400px) / 1040));
}

.top-insert-img-box-2 {
  border-radius: 9999px 0 0 9999px;
  width: calc(140px + 340 * ((100vw - 400px) / 1040));
}

@media screen and (max-width: 1040px) {
  .top-insert-img-box-1 {
    z-index: 2;
  }

  .top-insert-img-box-2 {
    z-index: 1;
  }

  .top-insert-img-box-2 img {
    transform: translateX(calc(-120px + 120 * ((100vw - 400px) / 1040)));
  }
}

/*-------------------------------------------------- TOPご利用に関する導線 --------------------------------------------------*/

#top-usage {
  margin: 0 calc(24px + 136 * ((100vw - 400px) / 1040));
  padding-bottom: calc(64px + 56 * ((100vw - 400px) / 1040));
}

.top-usage-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: calc(8px + 32 * ((100vw - 400px) / 1040));
}

.top-usage-blk {
  width: calc(352px + 188 * ((100vw - 400px) / 1040));
  background-color: #fff;
  font-size: calc(24px + 8 * ((100vw - 400px) / 1040));
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75em;
  text-align: center;
  border-radius: calc(24px + 8 * ((100vw - 400px) / 1040));
  padding-top: calc(32px + 8 * ((100vw - 400px) / 1040));
  padding-bottom: calc(32px + 16 * ((100vw - 400px) / 1040));
}

.top-usage-h {
  font-weight: 700;
  letter-spacing: -0.02em;
}

.top-usage-txt {
  font-size: calc(14px + 2 * ((100vw - 400px) / 1040));
  margin: 0 calc(32px + 16 * ((100vw - 400px) / 1040));
  letter-spacing: 0.02em;
  font-weight: 500;
  line-height: 1.6;
}

.top-usage-icon {
  width: calc(48px + 16 * ((100vw - 400px) / 1040));
  margin-bottom: 0.25em;
}

@media screen and (max-width: 768px) {
  .top-usage-wrap {
    flex-direction: column;
  }
}

/*-------------------------------------------------- TOPバナー --------------------------------------------------*/

.top-bnr-wrap a {
  width: fit-content;
  margin: 0 auto;
}

.top-bnr-img {
  width: calc(350px + 690 * ((100vw - 400px) / 1040));
  margin: 0 auto;
  border-radius: calc(8px + 12 * ((100vw - 400px) / 1040));
}

.top-bnr-img-pc {
  display: block;
}

.top-bnr-img-sp {
  display: none;
}

@media screen and (max-width: 768px) {
  .top-bnr-img-pc {
    display: none;
  }

  .top-bnr-img-sp {
    display: block;
  }
}

/*-------------------------------------------------- TOP最新情報 --------------------------------------------------*/

.top-topics-wrap {
  background-color: #fff;
  padding: calc(64px + 56 * ((100vw - 400px) / 1040)) calc(24px + 96 * ((100vw - 400px) / 1040));
  margin: 0 max(0px, calc(20 * ((100vw - 400px) / 1040))) calc(24px + 96 * ((100vw - 400px) / 1040));
  margin-top: calc(48px + 32 * ((100vw - 400px) / 1040));
  margin-bottom: calc(96px + 64 * ((100vw - 400px) / 1040));
  border-radius: calc(40px + 40 * ((100vw - 400px) / 1040)) calc(24px + 96 * ((100vw - 400px) / 1040));
}

.top-topics-grp {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: calc(64px + 56 * ((100vw - 400px) / 1040));
  font-size: calc(26px + 10 * ((100vw - 400px) / 1040));
  margin-top: 2em;
}

@media screen and (max-width: 768px) {
  .top-topics-grp {
    flex-direction: column;
  }
}

.top-topics-info-list-area {
  width: 41.4%;
}

@media screen and (max-width: 768px) {
  .top-topics-info-list-area {
    width: 100%;
  }
}

.top-topics-info-box-area {
  width: 48.3%;
}

@media screen and (max-width: 768px) {
  .top-topics-info-box-area {
    width: 100%;
  }
}

.top-topics-h-blk {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  margin-bottom: 1.5em;
}

.top-topics-h-icon {
  width: calc(40px + 14 * ((100vw - 400px) / 1040));
  margin-right: 0.5em;
}

.top-topics-h {
  width: auto;
  font-weight: 700;
  letter-spacing: -0.02em;
  margin-right: auto;
}

.topics-list {
  padding-bottom: calc(24px + 12 * ((100vw - 400px) / 1040));
  margin-bottom: calc(24px + 12 * ((100vw - 400px) / 1040));
  position: relative;
}

.topics-list:last-child {
  margin-bottom: 0;
}

.topics-list::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 100%;
  height: 2px;
  background: radial-gradient(circle, #2d2d2d40 1px, transparent 1px);
  background-size: 4px 2px;
  background-repeat: repeat-x;
}

.topics-list-blk {
  font-size: calc(16px + 2 * ((100vw - 400px) / 1040));
  font-weight: 500;
}

@media screen and (max-width: 768px) {
  .topics-list-blk {
    width: 100%;
  }
}

.post-meta {
  display: flex;
  align-items: center;
  gap: 1em;
  font-size: 1.4rem;
  font-weight: 700;
  margin-bottom: 1em;
}

.topics-box .post-meta {
  margin-bottom: 0.5em;
}

.post-meta-lavel-cat {
  color: #65a6d7;
  position: relative;
  padding-left: 1.25em;
}

.post-meta-lavel-cat::before {
  content: "";
  position: absolute;
  display: inline-block;
  width: 0.75em;
  aspect-ratio: 1 / 1;
  background-color: #65a6d7;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  border-radius: 0 9999px 9999px 0;
}

.post-meta-lavel-date {
  font-family: "Quicksand", sans-serif;
  font-weight: 600;
  color: #4b4b4b80;
}

.post-title {
  display: flex;

  color: #4b4b4be6;
}

.topics-box .post-title {
  margin-bottom: 0.75em;
}

.post-title-txt {
  margin-right: auto;
}

.post-title .circle-btn-wide {
  background-color: transparent;
  background-image: url("../img/arrow-18-18-2d2d2d80.svg");
}

.post-meta-rd-cat-item {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25em;
  font-size: calc(12px + 2 * ((100vw - 400px) / 1040));
}

.post-meta-rd-cat {
  padding: 0.5em 0.75em;
  color: #eb6ea5;
  border: 1px solid #eb6ea5;
  border-radius: 9999px;
  line-height: 1;
  white-space: nowrap;
}

.topics-box-blk {
  display: flex;
  flex-wrap: wrap;
  column-gap: calc(16px + 24 * ((100vw - 400px) / 1040));
  row-gap: calc(32px + 28 * ((100vw - 400px) / 1040));
  font-size: calc(16px + 2 * ((100vw - 400px) / 1040));
  font-weight: 500;
}

.topics-box {
  width: calc(46.4% - (2px + 3 * ((100vw - 400px) / 1040)));
  flex-shrink: 1;
}

.topics-box-img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  height: auto;
  object-fit: cover;
  object-position: center;
  border-radius: calc(12px + 8 * ((100vw - 400px) / 1040));
  margin-bottom: 0.5em;
}

/*-------------------------------------------------- CV（共通）--------------------------------------------------*/

.cv-il-slide {
  width: calc(80px + 80 * ((100vw - 400px) / 1040)) !important;
  aspect-ratio: 1 / 1;
}

.cv-il-slide-item img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.cv-wrapper {
  box-sizing: border-box;
  background-color: #fff;
  margin: calc(48px + 32 * ((100vw - 400px) / 1040)) max(0px, calc(80 * ((100vw - 400px) / 1040)));
  padding: calc(64px + 16 * ((100vw - 400px) / 1040)) calc(16px + 104 * ((100vw - 400px) / 1040)) calc(64px + 56 * ((100vw - 400px) / 1040));
  border-radius: calc(40px + 40 * ((100vw - 400px) / 1040));
}

.cv-h-area {
  font-size: calc(32px + 8 * ((100vw - 400px) / 1040));
  text-align: center;
  margin-bottom: 1em;
}

.cv-h {
  font-weight: 700;
  margin: 0.75em 0;
  letter-spacing: -0.02em;
}

.cv-h-exp-txt {
  font-size: calc(16px + 2 * ((100vw - 400px) / 1040));
  font-weight: 500;
  color: #4b4b4be6;
  line-height: 1.6;
  letter-spacing: 0.02em;
}

.cv-contact-area {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5em;
  font-size: calc(20px + 4 * ((100vw - 400px) / 1040));
}

.cv-contact-means {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5em;
  font-weight: 700;
  padding: 1.5em;
  border-radius: 0.5em;
  box-sizing: border-box;
  position: relative;
}

@media screen and (max-width: 768px) {
  .cv-contact-means {
    justify-content: flex-start;
    padding-right: 3em;
  }
}

.cv-contact-h {
  display: flex;
}
@media screen and (max-width: 400px) {
}

.cv-contact-means-prim {
  background: #eb6ea5;
  color: #fff;
  width: 100%;
}

.cv-contact-means-prim::after {
  content: "";
  position: absolute;
  right: 1.5em;
  top: 50%;
  transform: translateY(-50%);
  width: 1em;
  aspect-ratio: 1 / 1;
  background-image: url(../img/arrow-20-20-fff.svg);
  background-size: 100%;
  background-position: center;
  background-repeat: no-repeat;
}

.cv-contact-means-second {
  background: #f9f9f9;
  border: 1px solid #2d2d2d0d;
  color: #2d2d2d;
  font-size: calc(18px + 2 * ((100vw - 400px) / 1040));
  width: calc(50% - (5px + 1 * ((100vw - 400px) / 1040)));
}

@media screen and (max-width: 1040px) {
  .cv-contact-means-second {
    width: 100%;
  }
}

.cv-contact-means-second::after {
  content: "";
  position: absolute;
  right: 1.5em;
  top: 50%;
  transform: translateY(-50%);
  width: 1em;
  aspect-ratio: 1 / 1;
  background-image: url(../img/arrow-20-20-fff.svg);
  background-size: 100%;
  background-position: center;
  background-repeat: no-repeat;
}

.cv-contact-means-phone::after {
  background-image: url(../img/arrow-20-20-2d2d2d.svg);
}

.cv-contact-means-line::after {
  background-image: url(../img/arrow-ex-20-20-2d2d2d.svg);
}

.cv-contact-icon-phone {
  color: #65a6d7;
}

.cv-contact-icon-line {
  color: #06c755;
}

/*-------------------------------------------------- フッター --------------------------------------------------*/

.ft-sns-wrap {
  background: #eb6ea5;
  border-radius: 0 calc(64px + 88 * ((100vw - 400px) / 1040)) 0 0;
}

.ft-sns-area {
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: calc(24px + 40 * ((100vw - 400px) / 1040));
  padding: calc(48px + 32 * ((100vw - 400px) / 1040));
  font-size: calc(16px + 8 * ((100vw - 400px) / 1040));
}

@media screen and (max-width: 768px) {
  .ft-sns-area {
    flex-direction: column;
  }
}

.ft-sns-txt {
  font-weight: 700;
  line-height: 1.25;
}

.ft-sns-btn-grp {
  display: flex;
  align-items: center;
  color: #eb6ea5;
  gap: calc(18px + 2 * ((100vw - 400px) / 1040));
}

.ft-sns-btn {
  font-size: calc(18px + 2 * ((100vw - 400px) / 1040));
  line-height: 1;
  text-align: center;
  width: calc(48px + 16 * ((100vw - 400px) / 1040));
  aspect-ratio: 1 / 1;
  background-color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  font-weight: bold;
}

.ft-sns-cover {
  width: 100%;
  background: #fff;
  height: calc(64px + 56 * ((100vw - 400px) / 1040));
  border-radius: calc(32px + 48 * ((100vw - 400px) / 1040)) calc(32px + 48 * ((100vw - 400px) / 1040)) 0 0;
}

#ft {
  background-color: #fff;
}

.ft-wrap {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: calc(56px + 104 * ((100vw - 400px) / 1040));
  padding: 0 calc(24px + 96 * ((100vw - 400px) / 1040));
}

@media screen and (max-width: 768px) {
  .ft-wrap {
    flex-direction: column;
  }
}

.ft-logo {
  width: calc(164px + 36 * ((100vw - 400px) / 1040));
}

.ft-content-grp {
  width: calc(352px + 488 * ((100vw - 400px) / 1040));
  display: flex;
  flex-direction: column;
  gap: calc(32px + 48 * ((100vw - 400px) / 1040));
  margin-bottom: calc(64px + 16 * ((100vw - 400px) / 1040));
}

@media screen and (max-width: 768px) {
  .ft-content-grp {
    width: 100%;
  }
}

.ft-bnr {
  width: calc(352px + 88 * ((100vw - 400px) / 1040));
  border-radius: calc(8px + 4 * ((100vw - 400px) / 1040));
}

@media screen and (max-width: 768px) {
  .ft-bnr {
    width: 100%;
  }
}

.ft-nav-cont {
  display: flex;
  align-items: flex-start;
  gap: 3.5em;
  font-size: calc(14px + 2 * ((100vw - 400px) / 1040));
}

@media screen and (max-width: 1280px) {
  .ft-nav-cont {
    flex-direction: column;
  }
}

.ft-nav {
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: 0.02em;
  display: flex;
  flex-wrap: wrap;
  width: calc(336px + 24 * ((100vw - 400px) / 1040));
  gap: calc(20px + 12 * ((100vw - 400px) / 1040));
}

@media screen and (min-width: 1441px) {
  .ft-nav {
    width: 100%;
  }
}

@media screen and (max-width: 768px) {
  .ft-nav {
    width: 100%;
  }
}

.ft-nav-list {
  width: calc(50% - (12px + 4 * ((100vw - 400px) / 1040)));
}

@media screen and (min-width: 1441px) {
  .ft-nav-list {
    width: calc(50% - 2em);
  }
}

#ft .cv-contact-area {
  font-size: calc(18px + 2 * ((100vw - 400px) / 1040));
}

#ft .cv-contact-means {
  padding: 1em;
}

#ft .cv-contact-means-second {
  font-size: calc(16px + 1 * ((100vw - 400px) / 1040));
}

/*-------------------------------------------------- フッター／コピーライト --------------------------------------------------*/

.ft-cr-wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 0 calc(16px + 24 * ((100vw - 400px) / 1040)) calc(24px + 16 * ((100vw - 400px) / 1040)) calc(24px + 16 * ((100vw - 400px) / 1040));
  box-sizing: border-box;
}

.ft-cr-cont {
  display: flex;
  align-items: center;
  width: 100%;
}

@media screen and (max-width: 1280px) {
  .ft-cr-cont {
    flex-direction: column;
    align-items: flex-start;
    width: auto;
  }
}

.ft-cr-pp-item {
  display: flex;
  align-items: center;
  gap: 1.33em;
  font-size: calc(12px + 2 * ((100vw - 400px) / 1040));
}

@media screen and (max-width: 1280px) {
  .ft-cr-pp-item {
    margin-bottom: 1.5em;
  }
}

.ft-cr-pp-mark {
  width: calc(48px + 12 * ((100vw - 400px) / 1040));
  height: calc(48px + 12 * ((100vw - 400px) / 1040));
}

.ft-cr-pp {
  line-height: 1;
  letter-spacing: -0.02em;
  font-weight: 700;
  color: #2d2d2d80;
}

.ft-cr-txt {
  font-size: calc(11px + 1 * ((100vw - 400px) / 1040));
  font-family: "Quicksand", sans-serif;
  font-weight: 600;
  line-height: 1;
  color: #4b4b4b80;
  text-align: center;
  margin: 0 auto;
}

@media screen and (max-width: 768px) {
  .ft-cr-txt {
    margin: 0;
  }
}

.scroll-top-btn {
  display: block;
  width: calc(64px + 16 * ((100vw - 400px) / 1040));
  height: calc(64px + 16 * ((100vw - 400px) / 1040));
  border-radius: 9999px;
  aspect-ratio: 1 / 1;
  background-color: #eb6ea5;
  content: "";
  background-image: url("../img/arrow-up-24-24-fff.svg");
  background-repeat: no-repeat;
  background-size: calc(20px + 4 * ((100vw - 400px) / 1040)) calc(20px + 4 * ((100vw - 400px) / 1040));
  background-position: center center;
}

/*-------------------------------------------------- 下層ヘッダー --------------------------------------------------*/

.lower-hd-wrap {
  width: 100%;
  padding: calc(80px + 80 * ((100vw - 400px) / 1040)) calc(40px + 40 * ((100vw - 400px) / 1040));
  text-align: center;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  background: #fff;
  border-radius: 0 0 0 calc(80px + 140 * ((100vw - 400px) / 1040));
  position: relative;
}

@media screen and (max-width: 768px) {
  .lower-hd-wrap {
    text-align: left;
    align-items: flex-start;
  }
}

.lower-hd-txt {
  font-size: calc(32px + 24 * ((100vw - 400px) / 1040));
  font-weight: 700;
}

.lower-hd-il {
  width: calc(96px + 104 * ((100vw - 400px) / 1040));
  aspect-ratio: 1 / 1;
  position: absolute;
  right: calc(24px + 96 * ((100vw - 400px) / 1040));
  bottom: calc(-32px + (-48) * ((100vw - 400px) / 1040));
}

/*-------------------------------------------------- 下層ページナビ --------------------------------------------------*/

.lower-pg-nav-wrap {
  width: calc(352px + 288 * ((100vw - 400px) / 1040));
  padding: calc(48px + 48 * ((100vw - 400px) / 1040)) calc(24px + 56 * ((100vw - 400px) / 1040)) 0;
}

@media screen and (max-width: 768px) {
  .lower-pg-nav-wrap {
    width: 100%;
    box-sizing: border-box;
  }
}

.lower-pg-nav {
  font-size: calc(15px + 1 * ((100vw - 400px) / 1040));
  display: flex;
  flex-wrap: wrap;
  gap: calc(8px + 8 * ((100vw - 400px) / 1040));
}

.lower-pg-nav-li {
  line-height: 1.25;
  letter-spacing: 0.02em;
  font-weight: 700;
  background: #fff;
  border-radius: 0.5em;
}

.lower-pg-nav-li-txt {
  display: flex;
  align-items: center;
  gap: 1em;
  padding: 0.75em 1em;
}

.lower-pg-nav-li-txt p {
  flex: 1;
}

.lower-pg-nav-li-down-icon {
  width: 0.625em;
  height: 0.375em;
}

/*-------------------------------------------------- 下層CTA --------------------------------------------------*/

.lower-sec-cta {
  font-size: calc(16px + 2 * ((100vw - 400px) / 1040));
  line-height: 1.6;
  letter-spacing: 0.02em;
  font-weight: 700;
  padding: 0 calc(24px + 216 * ((100vw - 400px) / 1040));
}

.lower-sec-cta-btn-grp {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: calc(16px + 4 * ((100vw - 400px) / 1040));
  padding-bottom: calc(80px + 80 * ((100vw - 400px) / 1040));
}

@media screen and (max-width: 768px) {
  .lower-sec-cta-btn-grp {
    flex-direction: column;
  }
}

.lower-sec-cta-btn-grp .main-btn-box {
  margin: 0;
}

.main-btn-txt-line {
  background-color: #06c755;
}

.main-btn-circle-btn-line {
  background-color: #06c755;
}

.lower-sec-cta-txt {
  text-align: center;
  margin-bottom: calc(32px + 24 * ((100vw - 400px) / 1040));
}

/*-------------------------------------------------- ABOUT --------------------------------------------------*/

/*-------------------------------------------------- ABOUT／事業紹介 --------------------------------------------------*/

#about .lower-hd-il {
  width: calc(192px + 208 * ((100vw - 400px) / 1040));
  aspect-ratio: 2 / 1;
  position: absolute;
  right: calc(24px + 96 * ((100vw - 400px) / 1040));
  bottom: calc(-32px + (-48) * ((100vw - 400px) / 1040));
}

.about-business-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: calc(56px + 24 * ((100vw - 400px) / 1040));
  padding: calc(56px + 40 * ((100vw - 400px) / 1040)) calc(24px + 136 * ((100vw - 400px) / 1040)) calc(80px + 80 * ((100vw - 400px) / 1040));
}

.about-business-lead {
  text-align: center;
}

.about-business-lead-h {
  font-size: calc(20px + 4 * ((100vw - 400px) / 1040));
  line-height: 1.5;
  letter-spacing: 0.02em;
  font-weight: 700;
  margin-bottom: calc(30px + 10 * ((100vw - 400px) / 1040));
}

.about-business-lead-txt {
  font-size: calc(15px + 1 * ((100vw - 400px) / 1040));
  line-height: 1.6;
  letter-spacing: 0.02em;
  font-weight: 500;
}

.about-business-cont {
  display: flex;
  flex-direction: column;
  gap: calc(56px + 24 * ((100vw - 400px) / 1040));
}

.about-business-type-area {
  display: flex;
  align-items: center;
  gap: calc(28px + 92 * ((100vw - 400px) / 1040));
}

@media screen and (max-width: 1040px) {
  .about-business-type-area {
    align-items: flex-start;
  }
}

@media screen and (max-width: 768px) {
  .about-business-type-area {
    flex-direction: column;
  }
}

@media screen and (max-width: 1040px) {
  .about-business-type-img-box {
    width: 50%;
  }
}

.about-business-type-img-box {
  width: calc(352px + 88 * ((100vw - 400px) / 1040));
  height: auto;
  aspect-ratio: 4 / 3;
  overflow: hidden;
}

@media screen and (max-width: 1040px) {
  .about-business-type-img-box {
    width: 50%;
  }
}

@media screen and (max-width: 768px) {
  .about-business-type-img-box {
    width: 100%;
    height: 100%;
    aspect-ratio: 2 / 1;
  }
}

.about-business-type-img-box-a {
  border-radius: 9999px calc(7px + 3 * ((100vw - 400px) / 1040)) calc(7px + 3 * ((100vw - 400px) / 1040)) 9999px;
}

.about-business-type-img-box-b {
  border-radius: calc(7px + 3 * ((100vw - 400px) / 1040)) 9999px 9999px calc(7px + 3 * ((100vw - 400px) / 1040));
  order: 1;
}

@media screen and (max-width: 768px) {
  .about-business-type-img-box-b {
    order: 0;
  }
}

.about-business-type-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.about-business-type-h-blk {
  display: flex;
  align-items: center;
  gap: 0.75em;
  font-size: calc(28px + 12 * ((100vw - 400px) / 1040));
  font-weight: 700;
  margin-bottom: 1em;
  line-height: 1.25;
  letter-spacing: 0.02em;
}

@media screen and (max-width: 1040px) {
  .about-business-type-h-blk {
    flex-direction: column;
    align-items: flex-start;
  }
}

@media screen and (max-width: 768px) {
  .about-business-type-h-blk {
    flex-direction: row;
  }
}

.about-business-type-exp-grp {
  width: calc(352px + 208 * ((100vw - 400px) / 1040));
  order: 0;
}

@media screen and (max-width: 1040px) {
  .about-business-type-exp-grp {
    width: 50%;
  }
}

@media screen and (max-width: 768px) {
  .about-business-type-exp-grp {
    width: 100%;
    order: 1;
  }
}

.about-business-type-h-icon {
  width: calc(64px + 24 * ((100vw - 400px) / 1040));
  aspect-ratio: 1 / 1;
}

.about-business-type-h-sub {
  font-size: calc(14px + 4 * ((100vw - 400px) / 1040));
  color: #4b4b4b;
}

.about-business-type-h {
  margin-top: 0.25em;
}

.about-business-type-h-a {
  color: #eb6ea5;
}

.about-business-type-h-b {
  color: #65a6d7;
}

.about-business-type-text {
  font-size: calc(14px + 2 * ((100vw - 400px) / 1040));
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: 0.02em;
  color: #4b4b4be6;
}

/*-------------------------------------------------- ABOUT／マッチング --------------------------------------------------*/

#about-match {
  margin-bottom: calc(80px + 80 * ((100vw - 400px) / 1040));
}

.about-match-wrap {
  background: #fff;
  padding: calc(64px + 56 * ((100vw - 400px) / 1040)) calc(24px + 96 * ((100vw - 400px) / 1040));
  margin: 0 max(0px, calc(80 * ((100vw - 400px) / 1040)));
  border-radius: calc(40px + 40 * ((100vw - 400px) / 1040));
}

.about-match-area {
  font-size: calc(28px + 12 * ((100vw - 400px) / 1040));
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2em;
}

.about-match-h-grp {
  font-size: calc(24px + 4 * ((100vw - 400px) / 1040));
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.about-match-cont {
  display: flex;
  align-items: flex-start;
  gap: calc(40px + 40 * ((100vw - 400px) / 1040));
}

@media screen and (max-width: 1040px) {
  .about-match-cont {
    flex-direction: column;
  }
}

.about-match-h {
  font-weight: 700;
  color: #eb6ea5;
  letter-spacing: 0.02em;
}

.about-match-exp-blk {
  width: calc(50% - calc(20px + 20 * ((100vw - 400px) / 1040)));
}

@media screen and (max-width: 1040px) {
  .about-match-exp-blk {
    width: 100%;
    order: 1;
  }
}

.about-match-exp-h {
  font-weight: 700;
  letter-spacing: -0.02em;
  margin-bottom: 1.5em;
}

.about-match-exp-txt {
  font-size: calc(15px + 1 * ((100vw - 400px) / 1040));
  line-height: 1.6;
  letter-spacing: 0.02em;
  font-weight: 500;
}

.about-match-img-blk {
  width: calc(50% - calc(20px + 20 * ((100vw - 400px) / 1040)));
  position: relative;
}

@media screen and (max-width: 1040px) {
  .about-match-img-blk {
    width: 100%;
  }
}

.about-match-img-box {
  aspect-ratio: 1 / 1;
}

.about-match-img-box-1 {
  width: calc(264px + 176 * ((100vw - 400px) / 1040));
  border-radius: 9999px;
}

@media screen and (max-width: 1040px) {
  .about-match-img-box-1 {
    width: calc(264px + 176 * ((100vw - 400px) / 1040));
    margin-left: max(0px, calc(120 * ((100vw - 400px) / 1040)));
  }
}

.about-match-img-box-2 {
  width: calc(144px + 76 * ((100vw - 400px) / 1040));
  margin-top: calc(-72px + 8 * ((100vw - 400px) / 1040));
  margin-left: auto;
}

@media screen and (max-width: 1040px) {
  .about-match-img-box-2 {
    width: calc(144px + 76 * ((100vw - 400px) / 1040));
    margin-right: max(0px, calc(120 * ((100vw - 400px) / 1040)));
  }
}

.about-match-img {
  object-fit: cover;
  width: 100%;
}

.about-match-img-1 {
  border-radius: 9999px;
}

.about-match-img-2 {
  border-radius: calc(14px + 6 * ((100vw - 400px) / 1040));
}

.about-match-img-object {
  position: absolute;
}

.about-match-img-object-square {
  left: 0;
  top: 0;
}

.about-match-img-object-tri {
  left: calc(72px + 48 * ((100vw - 400px) / 1040));
  bottom: calc(32px + 8 * ((100vw - 400px) / 1040));
}

.about-match-img-object-ball {
  right: 0;
  bottom: calc(176px + 44 * ((100vw - 400px) / 1040));
}

/*-------------------------------------------------- ABOUT／ステートメント --------------------------------------------------*/

#about-statement .h-tag {
  color: #fff;
}

#about-statement .h-tag-dot-2 {
  background: #fff;
}

.about-statement-area {
  background: #eb6ea5;
  color: #fff;
  padding: calc(80px + 80 * ((100vw - 400px) / 1040)) 0;
}

.about-statement-insert {
  width: 100%;
  position: relative;
}

.about-statement-insert-img {
  width: inherit;
  object-fit: cover;
}

.about-statement-insert-cover {
  width: 100%;
  position: absolute;
  left: 0;
  bottom: 0;
}

.about-statement-insert-cover-bottom {
  width: 100%;
}

/*-------------------------------------------------- ABOUT／ステートメント／想い --------------------------------------------------*/

.about-statement-mind {
  font-size: calc(28px + 12 * ((100vw - 400px) / 1040));
}

.about-statement-mind-h-grp {
  padding: 0 calc(24px + 216 * ((100vw - 400px) / 1040));
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 2em;
}

.about-statement-mind-h {
  font-weight: 700;
  letter-spacing: -0.02em;
  margin-top: 1em;
  margin-bottom: 1.5em;
}

.about-statement-mind-txt {
  font-size: calc(14px + 2 * ((100vw - 400px) / 1040));
  line-height: 1.6;
  letter-spacing: 0.02em;
}

.about-statement-mind-heart {
  position: relative;
  width: 100%;
  height: calc(160px + 160 * ((100vw - 400px) / 1040));
  isolation: isolate;
  overflow-x: hidden;
}

.about-statement-mind-heart-l {
  z-index: 2;
  left: calc(-160px + 160 * ((100vw - 400px) / 1040));
}

.about-statement-mind-heart-r {
  z-index: 1;
  right: calc(-160px + 160 * ((100vw - 400px) / 1040));
}

.about-statement-mind-heart img {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: calc(433px + 432 * ((100vw - 400px) / 1040));
  height: auto;
}

/*-------------------------------------------------- ABOUT／ステートメント／理念 --------------------------------------------------*/

.about-statement-idea {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-size: calc(24px + 8 * ((100vw - 400px) / 1040));
  gap: 2em;
  padding-top: calc(80px + 80 * ((100vw - 400px) / 1040));
  padding-bottom: calc(96px + 104 * ((100vw - 400px) / 1040));
}

.about-statement-idea-h-grp {
  padding: 0 calc(24px + 216 * ((100vw - 400px) / 1040));
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.about-statement-idea-h {
  font-weight: 700;
  text-align: center;
  margin-top: 1em;
  line-height: 1.5;
  letter-spacing: 0.02em;
}

.about-statement-idea-drow-blk {
  margin-bottom: calc(6px + 26 * ((100vw - 400px) / 1040));
  overflow-x: hidden;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.about-statement-idea-drow-blk img {
  display: block;
  margin: 0 auto;
  width: calc(448px + 672 * ((100vw - 400px) / 1040));
}

.about-statement-idea-exp-blk {
  width: 100%;
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  gap: 0.83em;
  font-size: calc(16px + 8 * ((100vw - 400px) / 1040));
  font-weight: 700;
  padding: 0 calc(24px + 136 * ((100vw - 400px) / 1040));
}

@media screen and (max-width: 768px) {
  .about-statement-idea-exp-blk {
    flex-direction: column;
    align-items: flex-start;
  }
}

.about-statement-idea-exp-blk-line {
  width: 1px;
  align-self: stretch;
  flex-shrink: 0;
  background-color: #ffffff40;
}

.about-statement-idea-exp-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex: 1;
  gap: calc(20px + 20 * ((100vw - 400px) / 1040));
}

@media screen and (max-width: 768px) {
  .about-statement-idea-exp-box {
    width: 100%;
    flex-direction: row;
    border-bottom: 1px solid #ffffff40;
    padding-bottom: 1.25em;
  }
}

.about-statement-idea-exp-icon {
  width: calc(40px + 40 * ((100vw - 400px) / 1040));
}

.about-statement-idea-exp-txt {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5em;
}

@media screen and (max-width: 768px) {
  .about-statement-idea-exp-txt {
    align-items: flex-start;
  }
}

.about-statement-idea-exp-h-sub {
  font-size: calc(14px + 2 * ((100vw - 400px) / 1040));
  color: #ffffff80;
}

/*-------------------------------------------------- ABOUT／ステートメント／約束 --------------------------------------------------*/

.about-statement-promise {
  padding: 0 calc(24px + 216 * ((100vw - 400px) / 1040));
}

.about-statement-promise-h-grp {
  font-size: calc(24px + 8 * ((100vw - 400px) / 1040));
  margin-bottom: 1.75em;
}

.about-statement-promise-h-grp .h-tag {
  margin-bottom: 1.5em;
}

.about-statement-promise-h-cont {
  text-align: left;
  font-weight: 700;
  line-height: 1.5;
  display: flex;
  align-items: flex-end;
  gap: calc(36px + 44 * ((100vw - 400px) / 1040));
}

@media screen and (max-width: 768px) {
  .about-statement-promise-h-cont {
    flex-direction: column;
    align-items: center;
  }
}

.about-statement-promise-h {
  letter-spacing: 0.02em;
  order: 0;
}

@media screen and (max-width: 768px) {
  .about-statement-promise-h {
    order: 1;
  }
}

.about-statement-promise-symbol {
  width: calc(120px + 80 * ((100vw - 400px) / 1040));
  order: 1;
}

@media screen and (max-width: 768px) {
  .about-statement-promise-symbol {
    order: 0;
  }
}

.about-statement-promise-symbol img {
  width: inherit;
  object-fit: cover;
}

.about-statement-promise-exp-blk {
  font-size: calc(16px + 8 * ((100vw - 400px) / 1040));
  position: relative;
}

.about-statement-promise-exp-blk::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 2px;
  background: radial-gradient(circle, #ffffff40 1px, transparent 1px);
  background-size: 4px 2px;
  background-repeat: repeat-x;
}

.about-statement-promise-exp-box {
  display: flex;
  align-items: center;
  position: relative;
  font-weight: 700;
  gap: calc(24px + 12 * ((100vw - 400px) / 1040));
  line-height: 1.5;
  letter-spacing: 0.02em;
  padding: 1.5em 0;
}

.about-statement-promise-exp-box::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 100%;
  height: 2px;
  background: radial-gradient(circle, #ffffff40 1px, transparent 1px);
  background-size: 4px 2px;
  background-repeat: repeat-x;
}

.about-statement-promise-exp-icon {
  width: calc(80px + 80 * ((100vw - 400px) / 1040));
}

/*-------------------------------------------------- ABOUT／代表メッセージ --------------------------------------------------*/

.about-msg-wrap {
  padding-top: calc(96px + 64 * ((100vw - 400px) / 1040));
  padding-left: calc(24px + 136 * ((100vw - 400px) / 1040));
  padding-right: calc(24px + 136 * ((100vw - 400px) / 1040));
  padding-bottom: calc(80px + 80 * ((100vw - 400px) / 1040));
  box-sizing: border-box;
  width: 100%;
  overflow-x: hidden;
}

.about-msg-h-area {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: calc(24px + 16 * ((100vw - 400px) / 1040));
  margin-bottom: 2em;
  position: relative;
  z-index: -1;
}

@media screen and (max-width: 768px) {
  .about-msg-h-area {
    flex-direction: column;
    align-items: flex-start;
    gap: 1.5em;
  }
}

.about-msg-object {
  position: absolute;
  aspect-ratio: 1 / 1;
}

.about-msg-object-ball-1 {
  width: calc(8px + 8 * ((100vw - 400px) / 1040));
  right: calc(104px + 360 * ((100vw - 400px) / 1040));
  top: calc(-40px + (24) * ((100vw - 400px) / 1040));
}

.about-msg-object-ball-2 {
  width: calc(24px + 16 * ((100vw - 400px) / 1040));
  right: calc(272px + 248 * ((100vw - 400px) / 1040));
  bottom: calc(16px + (-56) * ((100vw - 400px) / 1040));
}

.about-msg-object-square-1 {
  width: calc(40px + 40 * ((100vw - 400px) / 1040));
  right: calc(-20px + -20 * ((100vw - 400px) / 1040));
  top: calc(-20px + -20 * ((100vw - 400px) / 1040));
}

.about-msg-object-square-2 {
  width: calc(24px + 16 * ((100vw - 400px) / 1040));
  right: calc(-12px + -24 * ((100vw - 400px) / 1040));
  bottom: calc(-24px + -16 * ((100vw - 400px) / 1040));
}

.about-msg-object-tri {
  width: calc(35px + 35 * ((100vw - 400px) / 1040));
  right: calc(80px + 40 * ((100vw - 400px) / 1040));
  bottom: calc(-70px + -50 * ((100vw - 400px) / 1040));
}

.about-msg-h-blk {
  display: flex;
  align-items: center;
}

.about-msg-h-blk .h-tag {
  font-size: calc(12px + 8 * ((100vw - 400px) / 1040));
}

.about-msg-h {
  padding-left: 0.5em;
  font-weight: 700;
}

.about-msg-img-blk {
  width: calc(210px + 190 * ((100vw - 400px) / 1040));
  aspect-ratio: 1 / 1;
}

@media screen and (max-width: 768px) {
  .about-msg-img-blk {
    width: 100%;
    aspect-ratio: 3 / 2;
    margin-left: auto;
    margin-right: calc(-24px + (-136) * ((100vw - 400px) / 1040));
  }
}

.about-msg-img-blk img {
  width: inherit;
  height: 100%;
  object-fit: cover;
  object-position: center;
  border-radius: 9999px;
}

@media screen and (max-width: 768px) {
  .about-msg-img-blk img {
    border-radius: 9999px 0 0 9999px;
  }
}

.about-msg-exp-area {
  display: flex;
  align-items: flex-end;
  gap: calc(36px + 164 * ((100vw - 400px) / 1040));
  font-size: calc(16px + 2 * ((100vw - 400px) / 1040));
}

@media screen and (max-width: 768px) {
  .about-msg-exp-area {
    flex-direction: column;
  }
}

.about-msg-exp-txt {
  width: calc(352px + 448 * ((100vw - 400px) / 1040));
  line-height: 2;
  letter-spacing: 0.02em;
  font-weight: 500;
  color: #4b4b4b;
}

@media screen and (max-width: 768px) {
  .about-msg-exp-txt {
    width: 100%;
  }
}

.about-msg-prof {
  font-size: calc(18px + 6 * ((100vw - 400px) / 1040));
  margin-bottom: 0.5em;
  white-space: nowrap;
}

.about-msg-prof-position {
  font-size: calc(14px + 2 * ((100vw - 400px) / 1040));
  color: #4b4b4b;
}

.about-msg-prof-name {
  font-weight: 700;
}

/*-------------------------------------------------- ABOUT／会社概要 --------------------------------------------------*/

.about-company-wrap {
  background: #fff;
  padding: calc(64px + 56 * ((100vw - 400px) / 1040)) calc(24px + 96 * ((100vw - 400px) / 1040));
  margin-left: max(0px, calc(80 * ((100vw - 400px) / 1040)));
  margin-right: max(0px, calc(80 * ((100vw - 400px) / 1040)));
  margin-bottom: calc(96px + 104 * ((100vw - 400px) / 1040));
  border-radius: calc(40px + 40 * ((100vw - 400px) / 1040));
}

.about-company-h-blk {
  font-weight: 700;
  letter-spacing: -0.02em;
  margin-bottom: 1.5em;
  font-size: calc(24px + 16 * ((100vw - 400px) / 1040));
  display: flex;
}

.about-company-h-blk .h-tag {
  font-size: calc(12px + 8 * ((100vw - 400px) / 1040));
}

.about-company-h {
  padding-left: 0.5em;
  font-weight: 700;
}

.about-company-ov-blk {
  border-top: 1px solid #2d2d2d1a;
}

.about-company-ov-list {
  display: flex;
  align-items: flex-start;
  gap: calc(24px + 96 * ((100vw - 400px) / 1040));
  font-size: calc(16px + 2 * ((100vw - 400px) / 1040));
  padding: 2em 0;
  border-bottom: 1px solid #2d2d2d1a;
}

@media screen and (max-width: 768px) {
  .about-company-ov-list {
    flex-direction: column;
    gap: 1em;
  }
}

.about-company-ov-h {
  font-weight: 700;
  width: calc(176px + 24 * ((100vw - 400px) / 1040));
}

.about-company-ov-exp {
  font-weight: 500;
  color: #4b4b4b;
  letter-spacing: 0.02em;
  flex: 1;
}

/*-------------------------------------------------- FEATURE --------------------------------------------------*/
/*-------------------------------------------------- FEATURE／お悩み --------------------------------------------------*/

.feature-ask-wrap {
  margin: calc(64px + 56 * ((100vw - 400px) / 1040)) calc(16px + 144 * ((100vw - 400px) / 1040));
  position: relative;
}

.feature-ask-h-grp {
  font-size: calc(28px + 12 * ((100vw - 400px) / 1040));
  text-align: center;
  letter-spacing: 0.05em;
  font-weight: 700;
  margin: 0 calc(40px + 88 * ((100vw - 400px) / 1040));
  margin-bottom: calc(36px + 44 * ((100vw - 400px) / 1040));
}

.feature-ask-h-sub {
  font-size: calc(16px + 8 * ((100vw - 400px) / 1040));
  line-height: 1;
  margin-bottom: 1em;
}

.feature-ask-h {
  line-height: 1.4;
}

.feature-ask-icon {
  position: absolute;
  left: calc(-52px + 52 * ((100vw - 400px) / 1040));
  top: 0;
  width: calc(72px + 88 * ((100vw - 400px) / 1040));
  aspect-ratio: 1 / 1;
}

@media screen and (max-width: 768px) {
  .feature-ask-icon {
    left: 0;
    top: 0;
  }
}

.feature-ask-worry-bb-grp {
  display: flex;
  align-items: flex-start;
  justify-content: center;
}

@media screen and (max-width: 768px) {
  .feature-ask-worry-bb-grp {
    align-items: flex-end;
  }
}

.feature-ask-worry-bb {
  width: calc(160px + 160 * ((100vw - 400px) / 1040));
  height: 100%;
  aspect-ratio: 1 / 1;
  border-radius: 9999px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-size: calc(18px + 6 * ((100vw - 400px) / 1040));
  font-weight: 700;
  line-height: 1.25;
}

.feature-ask-worry-bb-1 {
  background-color: #ddebf5;
}

.feature-ask-worry-bb-2 {
  background-color: #65a6d7;
  color: #fff;
  margin: 0 calc(-56px + 86 * ((100vw - 400px) / 1040));
  margin-top: 2em;
  z-index: 3;
}

@media screen and (max-width: 768px) {
  .feature-ask-worry-bb-2 {
    margin-top: 0;
    margin-bottom: calc(100px + (-20) * ((100vw - 400px) / 1040));
  }
}

.feature-ask-worry-bb-3 {
  background-color: #dcf1ff;
}

/*-------------------------------------------------- FEATURE／アスラのこたえ --------------------------------------------------*/

.feature-answer-h-grp {
  font-size: calc(28px + 12 * ((100vw - 400px) / 1040));
  letter-spacing: 0.02em;
  margin: calc(64px + 56 * ((100vw - 400px) / 1040)) calc(24px + 216 * ((100vw - 400px) / 1040));
  margin-bottom: 0;
}

.feature-answer-h {
  text-align: center;
  font-weight: 700;
  margin-bottom: 1em;
}

.feature-answer-txt {
  font-weight: 500;
  text-align: center;
  font-size: calc(16px + 2 * ((100vw - 400px) / 1040));
  line-height: 1.6;
}

/*-------------------------------------------------- FEATURE／ポイント --------------------------------------------------*/

.feature-point-area {
  margin: 0 calc(16px + 144 * ((100vw - 400px) / 1040));
  margin-top: calc(-16px - 194 * ((100vw - 400px) / 1040));
}

.feature-point-num-blk {
  display: flex;
  gap: 1em;
  font-size: calc(64px + 16 * ((100vw - 400px) / 1040));
  margin-bottom: 0.75em;
}

.feature-point-num-box {
  display: flex;
  align-items: center;
  font-weight: 700;
  font-family: "Quicksand", sans-serif;
  color: #eb6ea5;
  gap: 0.25em;
}

.feature-point-num-box .h-tag {
  flex-direction: column;
  margin-bottom: 0;
}

.feature-point-num {
  line-height: 1;
}

.feature-point-num-spacer {
  display: block;
  flex: 1;
  width: auto;
  position: relative;
}

.feature-point-num-spacer::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0.25em;
  width: 100%;
  height: 4px;
  background: radial-gradient(circle, #65a6d740 2px, transparent 2px);
  background-size: 8px 4px;
  background-repeat: repeat-x;
}

.feature-point-cont {
  display: flex;
  align-items: center;
  letter-spacing: 0.02em;
  gap: calc(26px + 46 * ((100vw - 400px) / 1040));
  margin-bottom: calc(70px + 23 * ((100vw - 400px) / 1040));
}

@media screen and (max-width: 768px) {
  .feature-point-cont {
    flex-direction: column;
  }
}

.feature-point-cont-img-box {
  width: calc(336px + 144 * ((100vw - 400px) / 1040));
  aspect-ratio: 3 / 2;
  border-radius: 9999px;
  position: relative;
}

.feature-point-cont-img-box::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  aspect-ratio: 3 / 2;
  background-color: #c2def3;
  border-radius: 9999px;
  z-index: -1;
}

.feature-point-cont-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 9999px;
  transform-origin: left bottom;
  transform: rotate(-4deg);
}

.feature-point-cont-h-block {
  width: calc(336px + 224 * ((100vw - 400px) / 1040));
}

@media screen and (max-width: 768px) {
  .feature-point-cont-h-block {
    width: 100%;
  }
}

.feature-point-cont-h {
  font-size: calc(26px + 10 * ((100vw - 400px) / 1040));
  line-height: 1.25;
  font-weight: 700;
  margin-bottom: 1em;
}

.feature-point-cont-txt {
  font-size: calc(16px + 2 * ((100vw - 400px) / 1040));
  line-height: 1.6;
  font-weight: 500;
  color: #4b4b4b;
}

.feature-point-hint-cont {
  position: relative;
}

.feature-point-hint-bb {
  background-color: #eb6ea5;
  color: #fff;
  display: inline-block;
  font-size: calc(18px + 2 * ((100vw - 400px) / 1040));
  font-weight: 700;
  line-height: 1;
  padding: 0.75em 1em;
  border-radius: 9999px 9999px 9999px 0;
  position: absolute;
  left: 0;
  top: -1.375em;
}

.feature-point-hint-blk {
  background-color: #fff;
  padding: calc(54px + 26 * ((100vw - 400px) / 1040)) calc(24px + 56 * ((100vw - 400px) / 1040));
  border-radius: 0 calc(20px + 20 * ((100vw - 400px) / 1040)) calc(20px + 20 * ((100vw - 400px) / 1040)) calc(20px + 20 * ((100vw - 400px) / 1040));
}

.feature-point-hint-list-box {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1em;
}

.feature-point-hint-list {
  font-size: calc(16px + 4 * ((100vw - 400px) / 1040));
  font-weight: 500;
  letter-spacing: 0.02em;
  display: flex;
  align-items: flex-start;
  gap: 1em;
}

.feature-point-hint-dot {
  width: 0.5em;
  height: 0.5em;
  aspect-ratio: 1 / 1;
  background-color: #eb6ea5;
  border-radius: 9999px;
  margin-top: 0.45em;
}

/*-------------------------------------------------- FEATURE／ポイント（タイムテーブル） --------------------------------------------------*/

.feature-point-hint-ls-box {
  display: flex;
  align-items: flex-start;
  gap: calc(30px + 50 * ((100vw - 400px) / 1040));
}

@media screen and (max-width: 768px) {
  .feature-point-hint-ls-box {
    flex-direction: column;
  }
}

.feature-point-hint-ls-img {
  width: calc(140px + 220 * ((100vw - 400px) / 1040));
  border-radius: calc(10px + 10 * ((100vw - 400px) / 1040));
}

.feature-point-hint-ls-txt-item {
  font-size: calc(20px + 4 * ((100vw - 400px) / 1040));
  letter-spacing: 0.02em;
}

.feature-point-hint-ls-txt-item {
  margin-bottom: 2em;
}

.feature-point-hint-ls-title-elem {
  font-weight: 700;
  display: flex;
}

.feature-point-hint-ls-title {
  padding-left: 0.5em;
  margin-bottom: 1em;
}

.feature-point-hint-ls-txt {
  font-size: calc(14px + 4 * ((100vw - 400px) / 1040));
  line-height: 1.6;
}

.feature-point-hint-ls-tt-list-pack {
  position: relative;
  font-size: calc(16px + 2 * ((100vw - 400px) / 1040));
  padding-left: 1.5em;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.5em;
}

.feature-point-hint-ls-tt-list {
  display: flex;
  align-items: flex-start;
  gap: 1em;
  font-weight: 500;
  line-height: 1.6;
}

.feature-point-hint-ls-tt-list::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 4px;
  height: 100%;
  background: radial-gradient(circle, #4b4b4b10 2px, transparent 2px);
  background-size: 4px 8px;
  background-repeat: repeat-y;
}

.feature-point-hint-ls-tt-list-time {
  font-family: "Quicksand", sans-serif;
  font-weight: 700;
  min-width: 48px;
}

#feature .cv {
  margin-top: calc(-16px - 194 * ((100vw - 400px) / 1040));
}

/*-------------------------------------------------- HOWTOUSE --------------------------------------------------*/
/*-------------------------------------------------- HOWTOUSE／ご利用条件 --------------------------------------------------*/

#howtouse-term .howtouse-sec-wrap {
  margin-bottom: 0;
}

.howtouse-sec-wrap {
  background: #fff;
  padding: calc(64px + 56 * ((100vw - 400px) / 1040)) calc(24px + 96 * ((100vw - 400px) / 1040));
  margin-left: max(0px, calc(80 * ((100vw - 400px) / 1040)));
  margin-right: max(0px, calc(80 * ((100vw - 400px) / 1040)));
  margin-bottom: calc(96px + 104 * ((100vw - 400px) / 1040));
  margin-top: calc(48px + 32 * ((100vw - 400px) / 1040));
  border-radius: calc(40px + 40 * ((100vw - 400px) / 1040));
}

.howtouse-term-wrap {
  background: #fff;
  padding: calc(64px + 56 * ((100vw - 400px) / 1040)) calc(24px + 96 * ((100vw - 400px) / 1040));
  margin-left: max(0px, calc(80 * ((100vw - 400px) / 1040)));
  margin-right: max(0px, calc(80 * ((100vw - 400px) / 1040)));
  margin-bottom: calc(96px + 104 * ((100vw - 400px) / 1040));
  border-radius: calc(40px + 40 * ((100vw - 400px) / 1040));
}

.howtouse-sec-h-cont {
  font-size: calc(24px + 16 * ((100vw - 400px) / 1040));
  margin-bottom: 1.5em;
  font-weight: 700;
}

.howtouse-sec-h-blk {
  letter-spacing: -0.02em;
  display: flex;
  margin-bottom: 0.5em;
  gap: 0.625em;
}

.howtouse-sec-h-cap {
  font-size: calc(14px + 2 * ((100vw - 400px) / 1040));
  color: #eb6ea5;
}

.howtouse-term-list-blk {
  border-top: 1px solid #2d2d2d1a;
}

.howtouse-term-list {
  display: flex;
  align-items: flex-start;
  gap: calc(24px + 96 * ((100vw - 400px) / 1040));
  font-size: calc(16px + 2 * ((100vw - 400px) / 1040));
  padding: calc(32px + 28 * ((100vw - 400px) / 1040)) 0;
  border-bottom: 1px solid #2d2d2d1a;
}

@media screen and (max-width: 1040px) {
  .howtouse-term-list {
    flex-direction: column;
    gap: 1.75em;
  }
}

.howtouse-term-list-h {
  font-size: calc(14px + 6 * ((100vw - 400px) / 1040));
  font-weight: 700;
  color: #eb6ea5;
  width: calc(336px + 4 * ((100vw - 400px) / 1040));
}

.howtouse-term-list-exp-box {
  letter-spacing: 0.02em;
  color: #4b4b4b;
  flex: 1;
}

.howtouse-term-list-exp-txt {
  font-weight: 700;
  margin-bottom: 1em;
}

.howtouse-term-list-exp-cap {
  font-size: calc(12px + 2 * ((100vw - 400px) / 1040));
}

/*-- HOWTOUSE／ご利用条件／チェックボックス --*/

.howtouse-term-list-check-pack {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1em;
  margin-bottom: 1em;
}

.howtouse-term-list-check {
  display: flex;
  align-items: flex-start;
  gap: 1em;
}

.howtouse-term-list-check-mark {
  width: calc(32px + 8 * ((100vw - 400px) / 1040));
  height: calc(32px + 8 * ((100vw - 400px) / 1040));
  aspect-ratio: 1 / 1;
  background-color: #eb6ea5;
  background-image: url(../img/checkmark-24-24-fff.svg);
  background-repeat: no-repeat;
  background-size: calc(16px + 8 * ((100vw - 400px) / 1040));
  background-position: center;
  border-radius: calc(8px + 4 * ((100vw - 400px) / 1040));
}

.howtouse-term-list-check-txt {
  margin-top: 0.4em;
  font-weight: 700;
}

/*-- HOWTOUSE／ご利用条件／事例 --*/

.howtouse-term-list-ex-pack {
  width: 100%;
}

@media screen and (max-width: 1040px) {
  .howtouse-term-list-ex-pack {
    display: flex;
  }
}

.howtouse-term-list-ex {
  display: flex;
  align-items: center;
  font-size: calc(24px + 8 * ((100vw - 400px) / 1040));
  align-items: center;
  gap: calc(24px + 96 * ((100vw - 400px) / 1040));
  margin-top: calc(24px + 8 * ((100vw - 400px) / 1040));
  padding-top: calc(24px + 8 * ((100vw - 400px) / 1040));
  position: relative;
}

@media screen and (max-width: 1040px) {
  .howtouse-term-list-ex {
    flex-direction: column;
    flex: 1;
  }
}

.howtouse-term-list-ex::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 2px;
  background: radial-gradient(circle, #2d2d2d40 1px, transparent 1px);
  background-size: 4px 2px;
  background-repeat: repeat-x;
}

@media screen and (max-width: 1040px) {
  .howtouse-term-list-ex::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 2px;
    height: 100%;
    background: radial-gradient(circle, #2d2d2d40 1px, transparent 1px);
    background-size: 2px 4px;
    background-repeat: repeat-y;
  }

  .howtouse-term-list-ex:nth-child(1)::before {
    display: none;
  }
}

.howtouse-term-list-ex-prof {
  font-size: calc(18px + 6 * ((100vw - 400px) / 1040));
  font-weight: 700;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.33em;
}

.howtouse-term-list-ex-name {
  display: flex;
  align-items: flex-end;
  justify-content: center;
}

.howtouse-term-list-ex-name-mr {
  font-size: calc(14px + 4 * ((100vw - 400px) / 1040));
}
.howtouse-term-list-ex-price {
  display: flex;
  align-items: flex-end;
  font-weight: 700;
  line-height: 1;
  gap: 0.25em;
  margin-bottom: 0.5em;
}

.howtouse-term-list-ex-yen {
  font-size: calc(16px + 8 * ((100vw - 400px) / 1040));
}

.howtouse-term-list-ex-cap {
  font-size: calc(12px + 2 * ((100vw - 400px) / 1040));
  text-align: right;
}

@media screen and (max-width: 1040px) {
  .howtouse-term-list-exp-box {
    width: 100%;
  }
}

/* B型3事例：768px以下でex-packを縦積み */
@media screen and (max-width: 768px) {
  .howtouse-term-list-ex-pack-b {
    display: flex;
    flex-direction: column;
  }

  .howtouse-term-list-ex-pack-b .howtouse-term-list-ex {
    flex-direction: row;
    align-items: center;
    width: 100%;
    gap: 2em;
  }

  .howtouse-term-list-ex-pack-b .howtouse-term-list-ex-prof {
    flex-shrink: 0;
  }

  .howtouse-term-list-ex-pack-b .howtouse-term-list-ex-paying {
    flex: 1;
  }

  .howtouse-term-list-ex-pack-b .howtouse-term-list-ex::before {
    width: 100%;
    height: 2px;
    background: radial-gradient(circle, #2d2d2d40 1px, transparent 1px);
    background-size: 4px 2px;
    background-repeat: repeat-x;
  }

  .howtouse-term-list-ex-pack-b .howtouse-term-list-ex:first-child::before {
    display: none;
  }
  .howtouse-term-list-ex-cap {
    text-align: left;
  }
}

/* 400px以下は各事例の中も縦積み */
@media screen and (max-width: 400px) {
  .howtouse-term-list-ex-pack {
    display: flex;
    flex-direction: column;
  }

  .howtouse-term-list-ex {
    width: 100%;
    flex: none;
    flex-direction: row;
    align-items: center;
    gap: 2em;
  }

  .howtouse-term-list-ex-prof {
    flex-shrink: 0;
    width: 30%;
  }

  .howtouse-term-list-ex-paying {
    flex: 1;
  }

  .howtouse-term-list-ex-price {
    justify-content: flex-start;
  }

  .howtouse-term-list-ex-cap {
    text-align: left;
  }

  .howtouse-term-list-ex::before {
    width: 100%;
    height: 2px;
    background: radial-gradient(circle, #2d2d2d40 1px, transparent 1px);
    background-size: 4px 2px;
    background-repeat: repeat-x;
  }

  .howtouse-term-list-ex:first-child::before {
    display: none;
  }
}

/*-------------------------------------------------- HOWTOUSE／ご利用までの流れ --------------------------------------------------*/

.howtouse-flow-list {
  display: flex;
  align-items: center;
  margin-bottom: 2em;
  padding-bottom: 2em;
  font-size: calc(20px + 4 * ((100vw - 400px) / 1040));
  position: relative;
}

@media screen and (max-width: 1040px) {
  .howtouse-flow-list {
    align-items: flex-start;
  }
}

.howtouse-flow-list::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  width: calc(100% - (62px + 68 * ((100vw - 400px) / 1040)));
  height: 2px;
  background: radial-gradient(circle, #2d2d2d40 1px, transparent 1px);
  background-size: 4px 2px;
  background-repeat: repeat-x;
}

.howtouse-flow-list-step {
  width: calc(62px + 68 * ((100vw - 400px) / 1040));
  box-sizing: border-box;
  padding-right: calc(20px + 40 * ((100vw - 400px) / 1040));
  font-size: calc(32px + 16 * ((100vw - 400px) / 1040));
  font-weight: 700;
  font-family: "Quicksand", sans-serif;
  text-align: center;
  color: #eb6ea5;
  line-height: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

@media screen and (max-width: 1040px) {
  .howtouse-flow-list-step {
    height: calc(64px + 96 * ((100vw - 400px) / 1040));
  }
}

.howtouse-flow-list-tag {
  font-size: calc(11px + 1 * ((100vw - 400px) / 1040));
  margin-bottom: 0.5em;
}

.howtouse-flow-list-step-line {
  position: absolute;
  width: 4px;
  height: calc(32px + 16 * ((100vw - 400px) / 1040));
  border-radius: 9999px;
  background-color: #f7d5e1;
  bottom: calc(-16px + (-8) * ((100vw - 400px) / 1040));
  left: calc(16px + 17 * ((100vw - 400px) / 1040));
}

.howtouse-flow-list-exp {
  display: flex;
  align-items: center;
  gap: calc(20px + 28 * ((100vw - 400px) / 1040));
  width: calc(274px + 716 * ((100vw - 400px) / 1040));
}

@media screen and (max-width: 1040px) {
  .howtouse-flow-list-exp {
    flex-direction: column;
    align-items: flex-start;
  }
}

.howtouse-flow-list-icon {
  border-radius: calc(8px + 4 * ((100vw - 400px) / 1040));
  width: calc(64px + 96 * ((100vw - 400px) / 1040));
}

@media screen and (max-width: 1040px) {
  .howtouse-flow-list-icon {
    position: absolute;
  }
}

.howtouse-flow-list-exp-h {
  font-weight: 700;
  line-height: 1.25;
  margin-bottom: 0.66em;
}

@media screen and (max-width: 1040px) {
  .howtouse-flow-list-exp-h {
    height: calc(64px + 96 * ((100vw - 400px) / 1040));
    margin-left: calc(64px + 96 * ((100vw - 400px) / 1040));
    padding-left: 1em;
    display: flex;
    align-items: center;
  }
}

.howtouse-flow-list-exp-txt {
  font-size: calc(14px + 2 * ((100vw - 400px) / 1040));
  line-height: 1.6;
  letter-spacing: 0.02em;
}

/*-------------------------------------------------- FACILITY --------------------------------------------------*/
/*-------------------------------------------------- FACILITY／拠点一覧 --------------------------------------------------*/

#facility-index {
  overflow-x: hidden;
}

.facility-map-wrap {
  font-size: calc(16px + 4 * ((100vw - 400px) / 1040));
  line-height: 1.75;
  font-weight: 500;
}

.facility-map-txt {
  padding: calc(48px + 48 * ((100vw - 400px) / 1040)) calc(32px + 208 * ((100vw - 400px) / 1040));
  text-align: center;
}

.facility-map-box {
  margin: 0 auto;
  width: calc(100% - max(0px, calc(320 * ((100vw - 400px) / 1040))));
  height: 100%;
  aspect-ratio: 2 / 1;
  overflow: hidden;
  border: 1px solid #e9e9e9;
  border-radius: calc(20px + 40 * ((100vw - 400px) / 1040));
}

.facility-map-mymap {
  display: block;
  width: 100%;
  height: 118%;
  border: 0;
  transform: translateY(-15%);
}
@media screen and (max-width: 768px) {
  .facility-map-box {
    aspect-ratio: 4 / 3;
  }

  .facility-map-mymap {
    height: 130%;
    transform: translateY(-20%);
  }
}

.facility-index-wrap {
  margin: calc(96px + 104 * ((100vw - 400px) / 1040)) max(0px, calc(160 * ((100vw - 400px) / 1040)));
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: calc(80px + 80 * ((100vw - 400px) / 1040));
}

@media screen and (max-width: 768px) {
  .facility-index-wrap {
    margin-left: 0;
    margin-right: 0;
  }
}

.facility-index-list {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  position: relative;
  font-size: calc(26px + 10 * ((100vw - 400px) / 1040));
  gap: calc(52px + 68 * ((100vw - 400px) / 1040));
}

@media screen and (max-width: 768px) {
  .facility-index-list {
    flex-direction: column;
    gap: 2em;
  }
}

.facility-index-list-img-blk {
  position: relative;
  z-index: 3;
  width: calc(400px + 40 * ((100vw - 400px) / 1040));
  min-width: 39.3%;
  height: auto;
  border-radius: max(0px, calc(36 * ((100vw - 400px) / 1040)));
  overflow: hidden;
}

@media screen and (max-width: 768px) {
  .facility-index-list-img-blk {
    display: flex;
    justify-content: space-between;
    width: 100%;
    order: 0;
    border-radius: 0;
  }
}

.facility-index-list:nth-child(even) .facility-index-list-img-blk {
  order: 0;
}

.facility-index-list:nth-child(even) .facility-index-list-exp {
  order: 1;
}

@media screen and (max-width: 768px) {
  .facility-index-list-exp {
    order: 1;
  }
}

.facility-index-list-img-blk img {
  width: 100%;
  object-fit: cover;
}

@media screen and (max-width: 768px) {
  .facility-index-list-img-blk img {
    width: calc(50% - (3px + 5 * ((100vw - 400px) / 1040)));
  }
}

.facility-index-list-icon {
  position: absolute;
  right: calc(-20px + (-100) * ((100vw - 400px) / 1040));
  top: calc(-20px + (-100) * ((100vw - 400px) / 1040));
  z-index: 2;
  width: calc(80px + 160 * ((100vw - 400px) / 1040));
}

.facility-index-list:nth-child(even) .facility-index-list-icon {
  left: calc(-20px + (-100) * ((100vw - 400px) / 1040));
}

.facility-index-list-exp {
  width: auto;
  font-size: calc(26px + 10 * ((100vw - 400px) / 1040));
  margin-top: max(0px, calc(27 * ((100vw - 400px) / 1040)));
}

@media screen and (max-width: 768px) {
  .facility-index-list-exp {
    margin: 0 calc(24px + 136 * ((100vw - 400px) / 1040));
  }
}

.facility-index-list-exp-txt {
  font-size: calc(14px + 2 * ((100vw - 400px) / 1040));
  line-height: 2;
  font-weight: 500;
}

.facility-index-list-name-blk {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1em;
  margin-top: 0.5em;
  margin-bottom: 1em;
}

.facility-index-list-type {
  font-weight: 700;
  line-height: 1;
  position: relative;
  font-size: calc(14px + 2 * ((100vw - 400px) / 1040));
  display: inline-block;
  color: #eb6ea5;
  padding-bottom: 0.5em;
}

.facility-index-list-type-b {
  color: #65a6d7;
}

.facility-index-list-type::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 100%;
  height: 2px;
  background: radial-gradient(circle, #eb6ea5 1px, transparent 1px);
  background-size: 4px 2px;
  background-repeat: repeat-x;
}

.facility-index-list-type-b::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 100%;
  height: 2px;
  background: radial-gradient(circle, #65a6d7 1px, transparent 1px);
  background-size: 4px 2px;
  background-repeat: repeat-x;
}

.facility-index-list-type-name {
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: 0.02em;
  margin-bottom: 0.25em;
}

.facility-index-list-type-name-sub {
  font-size: calc(13px + 1 * ((100vw - 400px) / 1040));
  color: #4b4b4b80;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: 0.02em;
}

/*-------------------------------------------------- PLACE --------------------------------------------------*/
/*-------------------------------------------------- PLACE／拠点ヘッダー --------------------------------------------------*/
.place-hd-wrap {
  padding-top: calc(80px + 80 * ((100vw - 400px) / 1040));
  margin-bottom: calc(80px + 80 * ((100vw - 400px) / 1040));
  position: relative;
  overflow-x: clip;
  overflow-y: visible;
}

.place-hd-kv-blk {
  width: 100%;
  aspect-ratio: 2 / 1;
}

.place-hd-kv {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media screen and (max-width: 768px) {
  .place-hd-kv-blk {
    aspect-ratio: 5 / 4;
  }
}

.place-hd-place-type {
  display: inline-block;
  position: relative;
  font-size: calc(14px + 2 * ((100vw - 400px) / 1040));
  font-weight: 700;
  margin-left: calc(24px + 56 * ((100vw - 400px) / 1040));
  padding-bottom: 0.5em;
}

/* A型 */
.place-hd-place-type-a {
  color: #eb6ea5;
}

/* B型 */
.place-hd-place-type-b {
  color: #65a6d7;
}

.place-hd-place-type::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 100%;
  height: 2px;
  background-size: 4px 2px;
  background-repeat: repeat-x;
}

/* A型 */
.place-hd-place-type-a::after {
  background-image: radial-gradient(circle, #eb6ea5 1px, transparent 1px);
}

/* B型 */
.place-hd-place-type-b::after {
  background-image: radial-gradient(circle, #65a6d7 1px, transparent 1px);
}

.place-hd-h-grp {
  font-size: calc(32px + 24 * ((100vw - 400px) / 1040));
  font-weight: 700;
  text-align: center;
  padding: 0 calc(24px + 56 * ((100vw - 400px) / 1040));
  padding-bottom: calc(48px + 32 * ((100vw - 400px) / 1040));
}

.place-hd-h {
  margin: 1em 0 0.25em 0;
}

.place-hd-h-sub {
  font-size: calc(14px + 2 * ((100vw - 400px) / 1040));
  color: #eb6ea5;
}

.place-hd-h-sub-b {
  color: #65a6d7;
}

.place-hd-object {
  position: absolute;
}

.place-hd-object-1 {
  width: calc(90px + 90 * ((100vw - 400px) / 1040));
  aspect-ratio: 1 / 1;
  right: calc(-45px + (-45) * ((100vw - 400px) / 1040));
  top: calc(240px + 40 * ((100vw - 400px) / 1040));
}

.place-hd-object-2 {
  width: calc(213px + 107 * ((100vw - 400px) / 1040));
  aspect-ratio: 1 / 1;
  left: calc(-106px + (-45) * ((100vw - 400px) / 1040));
  bottom: calc(-106px + (-54) * ((100vw - 400px) / 1040));
}

/*-------------------------------------------------- PLACE／拠点の紹介 --------------------------------------------------*/

.place-exp-wrap {
  padding: calc(24px + 136 * ((100vw - 400px) / 1040));
  padding-top: calc(80px + 80 * ((100vw - 400px) / 1040));
  padding-bottom: calc(64px + 56 * ((100vw - 400px) / 1040));
}

.place-exp-cont {
  font-size: calc(26px + 10 * ((100vw - 400px) / 1040));
  display: flex;
  align-items: flex-start;
  gap: calc(40px + 40 * ((100vw - 400px) / 1040));
}

@media screen and (max-width: 768px) {
  .place-exp-cont {
    flex-direction: column;
  }
}

.place-exp-img {
  width: calc(336px + (-16) * ((100vw - 400px) / 1040));
  min-width: 28.6%;
  border-radius: calc(13px + 5 * ((100vw - 400px) / 1040));
}

@media screen and (max-width: 768px) {
  .place-exp-img {
    width: 100%;
  }
}

.place-exp-h {
  margin-bottom: 1em;
  font-weight: 700;
}

.place-exp-txt {
  font-size: calc(16px + 2 * ((100vw - 400px) / 1040));
  line-height: 1.75;
  letter-spacing: 0.02em;
  font-weight: 500;
  color: #4b4b4b;
}

.place-exp-cmnt-cont {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: calc(32px + 4 * ((100vw - 400px) / 1040));
  margin-top: calc(54px + 18 * ((100vw - 400px) / 1040));
}

.place-exp-cmnt-person {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: calc(80px + 80 * ((100vw - 400px) / 1040));
  gap: calc(16px + 2 * ((100vw - 400px) / 1040));
}

.place-exp-cmnt-prof {
  text-align: center;
  font-size: calc(18px + 2 * ((100vw - 400px) / 1040));
}

.place-exp-cmnt-prof-post {
  font-size: calc(11px + 1 * ((100vw - 400px) / 1040));
  font-weight: 500;
}

.place-exp-cmnt-prof-name {
  font-weight: 700;
}

.place-exp-cmnt-person-thumb {
  width: calc(80px + 16 * ((100vw - 400px) / 1040));
  aspect-ratio: 1 / 1;
  overflow: hidden;
}

.place-exp-cmnt-person-thumb-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.place-exp-cmnt-blk {
  background-color: #fff;
  font-size: calc(16px + 2 * ((100vw - 400px) / 1040));
  font-weight: 500;
  padding: 2em;
  border-radius: calc(24px + 3 * ((100vw - 400px) / 1040));
  position: relative;
  line-height: 1.75;
}

.place-exp-cmnt-blk::before {
  content: "";
  position: absolute;
  left: calc(-16px + (-2) * ((100vw - 400px) / 1040));
  background-image: url(../img/place-cmnt-tri.svg);
  background-repeat: no-repeat;
  width: calc(16px + 2 * ((100vw - 400px) / 1040));
  height: calc(16px + 2 * ((100vw - 400px) / 1040));
  aspect-ratio: 1 / 1;
  background-position: center;
}

.place-exp-cmnt-txt {
  font-weight: 700;
}

.place-sec-wrap {
  background: #fff;
  padding: calc(64px + 56 * ((100vw - 400px) / 1040)) calc(24px + 96 * ((100vw - 400px) / 1040));
  margin-left: max(0px, calc(80 * ((100vw - 400px) / 1040)));
  margin-right: max(0px, calc(80 * ((100vw - 400px) / 1040)));
  margin-bottom: calc(48px + 32 * ((100vw - 400px) / 1040));
  border-radius: calc(40px + 40 * ((100vw - 400px) / 1040));
}

.place-sec-h-blk {
  font-weight: 700;
  letter-spacing: -0.02em;
  margin-bottom: 1.5em;
  font-size: calc(26px + 10 * ((100vw - 400px) / 1040));
  display: flex;
}

.place-sec-h-blk .h-tag {
  font-size: calc(12px + 6 * ((100vw - 400px) / 1040));
}

.place-sec-h {
  padding-left: 0.5em;
  font-weight: 700;
}

.place-ov-name-box {
  font-size: calc(20px + 8 * ((100vw - 400px) / 1040));
  gap: 1em;
  margin-bottom: 1em;
}

.place-ov-name-item {
  margin-top: 0.5em;
  margin-bottom: 2em;
  margin-right: auto;
  font-weight: 700;
  line-height: 1.25;
  flex: 1;
}

.place-ov-type {
  display: inline-block;
  position: relative;
  font-size: calc(12px + 2 * ((100vw - 400px) / 1040));
  font-weight: 700;
  padding-bottom: 0.5em;
  line-height: 1;
}

/* A型 */
.place-ov-type-a {
  color: #eb6ea5;
}

/* B型 */
.place-ov-type-b {
  color: #65a6d7;
}

.place-ov-type::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 100%;
  height: 2px;
  background-size: 4px 2px;
  background-repeat: repeat-x;
}

/* A型 */
.place-ov-type-a::after {
  background-image: radial-gradient(circle, #eb6ea5 1px, transparent 1px);
}

/* B型 */
.place-ov-type-b::after {
  background-image: radial-gradient(circle, #65a6d7 1px, transparent 1px);
}

.place-ov-name {
  margin-top: 0.6em;
  margin-bottom: 0.25em;
}

.place-ov-name-sub {
  font-family: "Quicksand", sans-serif;
  font-weight: 600;
  font-size: calc(12px + 2 * ((100vw - 400px) / 1040));
  color: #2d2d2d80;
}

.place-ov-tag-item {
  display: flex;
  align-items: flex-start;
  font-size: calc(12px + 2 * ((100vw - 400px) / 1040));
  font-weight: 700;
  color: #4b4b4b;
  gap: 0.5em;
}

.place-ov-tag {
  display: inline-block;
  padding: 0.66em 1em;
  border: 1px solid #d9d9d9;
  border-radius: 9999px;
}

.place-ov-blk {
  border-top: 1px solid #2d2d2d1a;
}

.place-ov-list {
  display: flex;
  align-items: flex-start;
  gap: calc(24px + 96 * ((100vw - 400px) / 1040));
  font-size: calc(16px + 2 * ((100vw - 400px) / 1040));
  padding: 2em 0;
  border-bottom: 1px solid #2d2d2d1a;
}

@media screen and (max-width: 768px) {
  .place-ov-list {
    flex-direction: column;
    gap: 1em;
  }
}

.place-ov-h {
  font-weight: 700;
  width: calc(176px + 24 * ((100vw - 400px) / 1040));
}

.place-ov-exp {
  color: #4b4b4b;
  letter-spacing: 0.02em;
  flex: 1;
}

.place-ov-exp-pink {
  color: #eb6ea5;
}

.place-ov-exp-ex-icon {
  width: 1em;
  height: 1em;
  aspect-ratio: 1 / 1;
}

.place-ov-btn-blk {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.25em;
}

.place-ov-btn-box {
  display: flex;
  align-items: center;
  gap: 0.5em;
  flex: 1;
}

.place-ov-btn-box .place-ov-exp {
  text-decoration: underline;
}

.place-ov-link-btn {
  display: flex;
  align-items: center;
  font-size: calc(12px + 2 * ((100vw - 400px) / 1040));
  font-weight: 700;
  font-family: "Quicksand", sans-serif;
  background: #eb6ea5;
  color: #fff;
  padding: 0.33em 0.66em;
  border-radius: 9999px;
}

.place-ov-link-btn-pdf {
  background: #4b4b4b;
}

.place-avail-blk {
  font-size: calc(18px + 2 * ((100vw - 400px) / 1040));
  display: flex;
  align-items: center;
  gap: 2.5em;
  margin-left: 2.5em;
  margin-bottom: 2.5em;
}

@media screen and (max-width: 768px) {
  .place-avail-blk {
    flex-direction: column;
    margin-left: 0;
  }
}

.place-avail-status-box {
  display: inline-block;
  text-align: center;
}

.place-avail-status-hc {
  font-weight: 700;
}

.place-avail-blk-line {
  width: 2px;
  background-color: #2d2d2d1a;
  align-self: stretch;
}

@media screen and (max-width: 768px) {
  .place-avail-blk-line {
    width: 100%;
    height: 2px;
  }
}

.place-avail-status-msg {
  font-weight: 700;
  margin-bottom: 0.75em;
}

.place-avail-status-hint {
  font-size: calc(12px + 2 * ((100vw - 400px) / 1040));
}

.place-avail-hint {
  font-size: calc(13px + 1 * ((100vw - 400px) / 1040));
  letter-spacing: 0.02em;
  color: #4b4b4bbf;
}

/*-------------------------------------------------- PLACE／関連ブログ --------------------------------------------------*/

.place-blog-wrap {
  margin-left: calc(24px + 56 * ((100vw - 400px) / 1040));
  padding-top: calc(16px + 24 * ((100vw - 400px) / 1040));
  padding-bottom: calc(96px + 104 * ((100vw - 400px) / 1040));
}

.related-blog-swiper-wrap {
  width: 100%;
  overflow: hidden;
  margin-bottom: calc(48px + 12 * ((100vw - 400px) / 1040));
}

.related-blog-swiper {
  overflow: visible;
  padding-left: calc(32px + 32 * ((100vw - 400px) / 1040));
}

.related-blog-slide {
  display: block;
  width: calc(162px + 98 * ((100vw - 400px) / 1040)) !important;
  flex-shrink: 0;
  color: inherit;
  text-decoration: none;
}

.related-blog-slide-img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  height: auto;
  object-fit: cover;
  object-position: center;
  border-radius: calc(14px + 6 * ((100vw - 400px) / 1040));
}

.related-blog-slide-date {
  margin-top: 0.75em;
  font-size: calc(10px + 2 * ((100vw - 400px) / 1040));
  color: #999;
}

.related-blog-slide-h {
  margin-top: 0.35em;
  font-size: calc(13px + 3 * ((100vw - 400px) / 1040));
  font-weight: 500;
  line-height: 1.7;
}

.related-blog-slide-tag-box {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 0.7em;
}

.related-blog-slide-tag {
  padding: 0.25em 0.65em;
  border: 1px solid #ed6ca7;
  border-radius: 9999px;
  font-size: calc(9px + 1 * ((100vw - 400px) / 1040));
  line-height: 1.3;
  color: #ed6ca7;
}

/*-------------------------------------------------- Q&A --------------------------------------------------*/

.qa-h-blk {
  font-weight: 700;
  letter-spacing: -0.02em;
  margin-bottom: 1.5em;
  font-size: calc(24px + 16 * ((100vw - 400px) / 1040));
  display: flex;
}

.qa-h {
  padding-left: 0.5em;
  font-weight: 700;
}

.qa-h-blk .h-tag {
  font-size: calc(12px + 8 * ((100vw - 400px) / 1040));
}

.qa-wrap {
  padding: calc(64px + 56 * ((100vw - 400px) / 1040)) calc(24px + 96 * ((100vw - 400px) / 1040));
  padding-bottom: 0;
}

#qa-work .qa-wrap {
  padding-bottom: calc(96px + 104 * ((100vw - 400px) / 1040));
}

.qa-cont {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: calc(18px + 22 * ((100vw - 400px) / 1040));
}

.qa-blk {
  display: flex;
  flex-direction: column;
  gap: 0.1em;
  font-size: calc(18px + 2 * ((100vw - 400px) / 1040));
  width: 100%;
}

.qa-list {
  letter-spacing: 0.02em;
  background: #fff;
  display: flex;
  align-items: flex-start;
  gap: 1.5em;
}

.qa-list-q {
  color: #eb6ea5;
  font-weight: 700;
  padding: 1.5em;
  padding-bottom: 1em;
  border-radius: 1em 1em 0 0;
  line-height: 1.25;
}

.qa-list-a {
  color: #65a6d7;
  font-weight: 500;
  font-size: calc(16px + 2 * ((100vw - 400px) / 1040));
  padding: 1.5em;
  padding-top: 1em;
  border-radius: 0 0 1em 1em;
  line-height: 1.6;
}

.qa-icon {
  font-weight: 700;
  font-size: calc(27px + 3 * ((100vw - 400px) / 1040));
}

.qa-txt {
  margin-top: 0.4em;
}

.qa-list-a .qa-txt {
  color: #4b4b4b;
}

/*-------------------------------------------------- BLOG --------------------------------------------------*/

.blog-wrap {
  padding: calc(64px + 56 * ((100vw - 400px) / 1040)) calc(24px + 96 * ((100vw - 400px) / 1040));
  padding-bottom: calc(96px + 104 * ((100vw - 400px) / 1040));
}

/*-------------------------------------------------- 一覧レイアウト --------------------------------------------------*/

.blog-main {
  --category-menu-width: calc(200px + 60 * ((100vw - 400px) / 1040));

  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  column-gap: calc(36px + 64 * ((100vw - 400px) / 1040));
}

@media screen and (max-width: 1280px) {
  .blog-main {
    position: relative;
  }
}

@media screen and (max-width: 768px) {
  .blog-main {
    --category-menu-width: 100%;

    flex-direction: column;
    flex-wrap: nowrap;
    position: static;
  }
}

/*-------------------------------------------------- 見出し --------------------------------------------------*/

.blog-h-blk {
  display: flex;
  align-items: center;

  width: 100%;
  margin-bottom: 1.5em;

  font-size: calc(24px + 16 * ((100vw - 400px) / 1040));
  font-weight: 700;
  letter-spacing: -0.02em;
}

@media screen and (max-width: 1280px) {
  .blog-h-blk {
    width: calc(100% - var(--category-menu-width));
    box-sizing: border-box;
    padding-right: 1em;
  }
}

@media screen and (max-width: 768px) {
  .blog-h-blk {
    width: 100%;
    margin-bottom: 1em;
    padding-right: 0;
  }
}

.blog-h {
  padding-left: 0.5em;
  font-weight: 700;
  line-height: 1.25;
  text-align: left;
}

.blog-h-blk .h-tag {
  flex-shrink: 0;
  font-size: calc(12px + 8 * ((100vw - 400px) / 1040));
}

/*-------------------------------------------------- 記事一覧 --------------------------------------------------*/

.blog-main > .topics-list-blk,
.blog-main > .topics-box-blk {
  flex: 1;
  min-width: 0;
}

@media screen and (max-width: 1280px) {
  .blog-main > .topics-list-blk,
  .blog-main > .topics-box-blk {
    flex: 0 0 100%;
  }
}

@media screen and (max-width: 768px) {
  .blog-main > .topics-list-blk,
  .blog-main > .topics-box-blk {
    width: 100%;
    flex: 0 0 100%;
  }
}

/*-------------------------------------------------- ブログ記事 --------------------------------------------------*/

.blog-main > .topics-box-blk {
  --topics-gap: calc(16px + 16 * ((100vw - 400px) / 1040));

  display: flex;
  flex-wrap: wrap;

  gap: calc(32px + 16 * ((100vw - 400px) / 1040)) var(--topics-gap);
}

.blog-main > .topics-box-blk .topics-box {
  flex: 0 0 calc((100% - var(--topics-gap) * 2) / 3);
  min-width: 0;
}

@media screen and (max-width: 1040px) {
  .blog-main > .topics-box-blk .topics-box {
    flex-basis: calc((100% - var(--topics-gap)) / 2);
  }
}

/*-------------------------------------------------- カテゴリメニュー --------------------------------------------------*/

.category-menu {
  position: relative;
  z-index: 5;

  width: var(--category-menu-width);
  flex-shrink: 0;

  background-color: #65a6d7;
  border-radius: calc(28px + 8 * ((100vw - 400px) / 1040));
  overflow: hidden;

  transition: border-radius 0.3s ease;
}

@media screen and (max-width: 1280px) {
  .category-menu {
    position: absolute;
    top: 0;
    right: 0;
  }
}

@media screen and (max-width: 768px) {
  .category-menu {
    position: relative;
    top: auto;
    right: auto;

    width: 100%;
    margin-bottom: 2em;
  }
}

/*-------------------------------------------------- カテゴリボタン --------------------------------------------------*/

.category-menu-btn {
  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 1em;
  width: 100%;

  box-sizing: border-box;

  padding: calc(18px + 6 * ((100vw - 400px) / 1040)) calc(24px + 8 * ((100vw - 400px) / 1040));

  border: 0;
  background: transparent;

  color: #fff;

  font-family: inherit;
  font-size: calc(14px + 2 * ((100vw - 400px) / 1040));
  font-weight: 700;

  cursor: pointer;
}

.category-menu-label {
  flex: 1;
  min-width: 0;

  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

/*-------------------------------------------------- カテゴリ矢印 --------------------------------------------------*/

.category-menu-arrow {
  flex-shrink: 0;

  width: 0;
  height: 0;

  border-left: calc(5px + 2 * ((100vw - 400px) / 1040)) solid transparent;
  border-right: calc(5px + 2 * ((100vw - 400px) / 1040)) solid transparent;
  border-top: calc(8px + 3 * ((100vw - 400px) / 1040)) solid #ffffff80;

  transition: transform 0.3s ease;
}

.category-menu:hover .category-menu-arrow {
  transform: rotate(180deg);
}

/*-------------------------------------------------- カテゴリ一覧 --------------------------------------------------*/

.category-menu-list {
  max-height: 0;

  overflow: hidden;
  opacity: 0;

  font-size: calc(14px + 2 * ((100vw - 400px) / 1040));
  font-weight: 500;
  line-height: 1.25;
  letter-spacing: -0.02em;

  scrollbar-width: none;
  -ms-overflow-style: none;

  transition:
    max-height 0.4s ease,
    opacity 0.2s ease;
}

.category-menu-list::-webkit-scrollbar {
  display: none;
}

.category-menu-list a {
  display: block;

  width: 100%;
  box-sizing: border-box;

  padding: calc(12px + 4 * ((100vw - 400px) / 1040)) calc(24px + 8 * ((100vw - 400px) / 1040));

  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;

  color: #fff;
}

.category-menu-list li:last-child a {
  padding-bottom: calc(20px + 8 * ((100vw - 400px) / 1040));
}

.category-menu-list a:hover {
  background-color: #ffffff1a;
}

/*-------------------------------------------------- カテゴリ展開 --------------------------------------------------*/

.category-menu:hover .category-menu-list {
  max-height: calc(180px + 100 * ((100vw - 400px) / 1040));
  overflow-y: auto;
  opacity: 1;
}

/*-------------------------------------------------- ブログ用カラー --------------------------------------------------*/

#blog-index .category-menu {
  background-color: #e965a0;
}

/*-------------------------------------------------- お知らせ用カラー --------------------------------------------------*/

#topics-info-index .category-menu {
  background-color: #65a6d7;
}

#topics-info-index .blog-h-blk .h-tag-dot-1 {
  background-color: #c2def3;
}

#topics-info-index .blog-h-blk .h-tag-dot-2 {
  background-color: #65a6d7;
}

/*-------------------------------------------------- ページネーション --------------------------------------------------*/

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

  width: fit-content;

  margin: calc(48px + 32 * ((100vw - 400px) / 1040)) auto 0;

  padding: calc(14px + 4 * ((100vw - 400px) / 1040)) calc(18px + 6 * ((100vw - 400px) / 1040));

  border-radius: 9999px;

  background-color: #4b4b4b;
  color: #fff;
}

/*-------------------------------------------------- 矢印 --------------------------------------------------*/

.pagination-arrow {
  display: flex;
  align-items: center;
  justify-content: center;

  color: #fff;
  opacity: 0.8;

  transition: opacity 0.2s ease;
}

.pagination-arrow:hover {
  opacity: 1;
}

.pagination-arrow .material-symbols-outlined {
  font-size: calc(16px + 2 * ((100vw - 400px) / 1040));
  font-weight: 300;
}

/*-------------------------------------------------- ページ選択 --------------------------------------------------*/

.pagination-select-wrap {
  position: relative;
  margin: 0 calc(16px + 8 * ((100vw - 400px) / 1040));
  padding: 0 calc(16px + 8 * ((100vw - 400px) / 1040));
  border-left: 1px solid #ffffff30;
  border-right: 1px solid #ffffff30;
}

.pagination-select {
  appearance: none;
  -webkit-appearance: none;

  border: 0;
  outline: 0;

  background: transparent;
  color: #fff;

  font-family: inherit;
  font-size: calc(16px + 2 * ((100vw - 400px) / 1040));
  font-weight: 700;
  line-height: 1;

  text-align: center;

  cursor: pointer;
}

/*-------------------------------------------------- PP --------------------------------------------------*/

/*-------------------------------------------------- お知らせ詳細：見出しカラー --------------------------------------------------*/

#topics-info-detail h2::before,
#topics-info-detail h3::before,
#topics-info-detail h4::before {
  background-color: #65a6d7;
}

#pp-lead {
  font-size: calc(15px + 1 * ((100vw - 400px) / 1040));
  font-weight: 500;
  line-height: 2;
  letter-spacing: 0.02em;
  color: #4b4b4b;
}

.pp-lead-text-wrap {
  padding: calc(48px + 48 * ((100vw - 400px) / 1040)) calc(24px + 216 * ((100vw - 400px) / 1040));
  padding-bottom: calc(64px + 56 * ((100vw - 400px) / 1040));
}

#pp-body {
  letter-spacing: 0.02em;
}

.pp-body-wrap {
  font-size: calc(20px + 4 * ((100vw - 400px) / 1040));
  padding: 0 calc(24px + 216 * ((100vw - 400px) / 1040));
  padding-bottom: calc(96px + 104 * ((100vw - 400px) / 1040));
}

.pp-body-cont {
  margin-bottom: calc(48px + 32 * ((100vw - 400px) / 1040));
}

.pp-body-cont:last-child {
  margin-bottom: 0;
}

.pp-body-list-h {
  color: #eb6ea5;
  font-weight: 700;
  line-height: 1.4;
  margin-bottom: 1.5em;
}

.pp-body-list-blk {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2.5em;
  font-size: calc(15px + 1 * ((100vw - 400px) / 1040));
  font-weight: 500;
  color: #4b4b4b;
  line-height: 1.75;
}

.pp-body-list {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1em;
}

.pp-body-list-blt {
  font-family: "Quicksand", sans-serif;
}

.pp-body-list-txt-box {
  display: flex;
  align-items: flex-start;
}

.pp-body-inner-list-blk {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1.5em;
}

.pp-body-list-txt {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1.25em;
}

.pp-body-inner-list {
  display: flex;
  align-items: flex-start;
  margin-left: 1.75em;
}

.pp-body-inner-list .pp-body-inner-list {
  margin-left: 0;
}

/*-------------------------------------------------- INFO DETAIL --------------------------------------------------*/

.topics-detail-hd-wrap {
  display: flex;
  align-items: center;
  gap: calc(10px + 14 * ((100vw - 400px) / 1040));
  padding: calc(40px + 120 * ((100vw - 400px) / 1040)) calc(40px + 120 * ((100vw - 400px) / 1040)) calc(40px + 40 * ((100vw - 400px) / 1040));
  padding-top: calc(120px + 40 * ((100vw - 400px) / 1040));
  background-color: #fff;
  font-size: calc(20px + 4 * ((100vw - 400px) / 1040));
  font-weight: 700;
  border-radius: 0 0 0 calc(40px + 40 * ((100vw - 400px) / 1040));
}

.topics-detail-hd-il {
  width: calc(48px + 32 * ((100vw - 400px) / 1040));
  aspect-ratio: 1 / 1;
}

.topics-detail {
  --detail-text-pad: max(0px, calc(160 * ((100vw - 400px) / 1040)));
  --detail-media-pad: max(0px, calc(80 * ((100vw - 400px) / 1040)));
  --detail-text-space: calc(24px + 2 * ((100vw - 400px) / 1040));
  --detail-block-space: calc(48px + 32 * ((100vw - 400px) / 1040));
  --detail-radius: calc(14px + 6 * ((100vw - 400px) / 1040));

  position: relative;
  margin-bottom: calc(96px + 104 * ((100vw - 400px) / 1040));
}

.topics-detail::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 100%;
  height: 2px;
  background: radial-gradient(circle, #2d2d2d40 1px, transparent 1px);
  background-size: 4px 2px;
  background-repeat: repeat-x;
}

.topics-detail-wrap {
  padding: calc(48px + 32 * ((100vw - 400px) / 1040)) calc(24px + 136 * ((100vw - 400px) / 1040));
  padding-bottom: calc(80px + 80 * ((100vw - 400px) / 1040));
}

.topics-detail-title {
  padding: 0 max(0px, calc(160 * ((100vw - 400px) / 1040)));
  margin-bottom: calc(48px + 32 * ((100vw - 400px) / 1040));
}

.topics-detail-title .post-meta {
  margin-bottom: calc(14px + 6 * ((100vw - 400px) / 1040));
  font-size: calc(16px + 2 * ((100vw - 400px) / 1040));
  flex-wrap: wrap;
  row-gap: 0.5em;
}

/*-- 記事詳細：タイトル --*/

.topics-detail h1 {
  font-size: calc(28px + 12 * ((100vw - 400px) / 1040));
  font-weight: 700;
}

/*-- 記事詳細：KV --*/

.topics-detail-kv {
  width: 100%;
  overflow: hidden;
  border-radius: calc(14px + 6 * ((100vw - 400px) / 1040));
  margin: calc(48px + 32 * ((100vw - 400px) / 1040)) 0;
}

.topics-detail-kv-img {
  display: block;
  width: 100%;
  height: auto;
}

/*-- 記事詳細：基本ブロック --*/

.topics-detail-blk {
  width: 100%;
  box-sizing: border-box;
  padding: 0 max(0px, calc(80 * ((100vw - 400px) / 1040)));
  font-size: calc(16px + 1 * ((100vw - 400px) / 1040));
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: 0em;
}

/*-- 記事詳細：テキスト用ブロック --*/

.topics-detail-txt-blk {
  width: 100%;
  box-sizing: border-box;
  padding: 0 max(0px, calc(80 * ((100vw - 400px) / 1040)));
}

/*-- 記事詳細：H2 --*/

.topics-detail h2 {
  font-size: calc(24px + 8 * ((100vw - 400px) / 1040));
  font-weight: 700;
  margin-top: calc(72px + 24 * ((100vw - 400px) / 1040));
  margin-bottom: calc(36px + 12 * ((100vw - 400px) / 1040));
  position: relative;
  padding-left: 1em;
}

.topics-detail h2::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: calc(4px + 4 * ((100vw - 400px) / 1040));
  height: 100%;
  border-radius: 9999px;
  background-color: #eb6ea5;
  background-repeat: no-repeat;
}

/*-- 記事詳細：H3 --*/

.topics-detail h3 {
  font-size: calc(22px + 6 * ((100vw - 400px) / 1040));
  font-weight: 700;
  margin-top: calc(66px + 18 * ((100vw - 400px) / 1040));
  margin-bottom: calc(33px + 9 * ((100vw - 400px) / 1040));
  position: relative;
  padding-left: 1em;
}

.topics-detail h3::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 0.5em;
  height: 0.25em;
  border-radius: 9999px;
  background-color: #eb6ea5;
  background-repeat: no-repeat;
}

/*-- 記事詳細：H4 --*/

.topics-detail h4 {
  font-size: calc(20px + 4 * ((100vw - 400px) / 1040));
  font-weight: 700;
  margin-top: calc(60px + 12 * ((100vw - 400px) / 1040));
  margin-bottom: calc(30px + 6 * ((100vw - 400px) / 1040));
  position: relative;
  padding-left: 0.75em;
}

.topics-detail h4::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.45em;
  width: calc(3px + 1 * ((100vw - 400px) / 1040));
  height: 0.75em;
  border-radius: 9999px;
  background-color: #eb6ea5;
  background-repeat: no-repeat;
}

/*-- 記事詳細：図用ブロック --*/

.topics-detail-blk .topics-detail-figure-blk {
  width: 100%;
  margin: calc(48px + 32 * ((100vw - 400px) / 1040)) 0;
}

/*-- 記事詳細：画像 --*/

.topics-detail-blk .topics-detail-figure-blk img {
  width: 100%;
  object-fit: cover;
  border-radius: calc(14px + 6 * ((100vw - 400px) / 1040));
}

/*-- 記事詳細：キャプション --*/

.topics-detail-blk .topics-detail-figure-blk small {
  font-size: calc(12px + 2 * ((100vw - 400px) / 1040));
  padding-top: 1em;
  font-weight: 400;
  color: #4b4b4b;
}

/*-- 記事詳細：テキスト --*/

.topics-detail .topics-detail-blk p {
  color: #4b4b4b;
  margin: calc(24px + 2 * ((100vw - 400px) / 1040)) 0;
}

/*-- 記事詳細：強テキスト --*/

.topics-detail .topics-detail-blk b,
.topics-detail .topics-detail-blk strong {
  color: #2d2d2d;
  font-weight: 700;
  margin: calc(24px + 2 * ((100vw - 400px) / 1040)) 0;
}

.topics-detail .topics-detail-blk p b,
.topics-detail .topics-detail-blk p strong {
  display: inline;
  margin: 0;
}

/*-- 記事詳細：リンクテキスト --*/

.topics-detail .topics-detail-blk a {
  color: #288cc8;
  text-decoration: underline;
  margin: calc(24px + 2 * ((100vw - 400px) / 1040)) 0;
}

.topics-detail .topics-detail-blk p a {
  margin: 0;
  display: inline;
}

/*-- 記事詳細：インタビュー --*/

/* Q / A単体の基本余白 */
.interview-question-blk .topics-detail-iv-blk,
.interview-answer-blk .topics-detail-iv-blk {
  margin: calc(54px + 6 * ((100vw - 400px) / 1040)) 0;
}

/* Qの直後にAが来た場合 */
.interview-question-blk + .interview-answer-blk .topics-detail-iv-blk {
  margin-top: calc(24px + 2 * ((100vw - 400px) / 1040));
}

/* Aの直後にAが来た場合 */
.interview-answer-blk + .interview-answer-blk .topics-detail-iv-blk {
  margin-top: calc(24px + 2 * ((100vw - 400px) / 1040));
}

/* Q */
.iv-q {
  font-size: calc(18px + 2 * ((100vw - 400px) / 1040));
  display: flex;
  align-items: flex-start;
  position: relative;
  padding-left: 2.5em;
}

.iv-q p {
  margin: 0 !important;
}

.iv-q::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 1.75em;
  height: 1.6em;
  border-radius: 9999px;
  background-image: linear-gradient(#2d2d2d80, #2d2d2d80);
  background-position: center;
  background-size: 1.75em 0.1em;
  background-repeat: no-repeat;
  box-sizing: border-box;
}

/* A */
.iv-a {
  display: flex;
  align-items: flex-start;
  margin: 0;
}

.iv-a p {
  margin: 0 !important;
}

.iv-a-name {
  display: flex;
  align-items: flex-start;
  padding-right: 1em;
  position: relative;
  gap: 0.5em;
  white-space: nowrap;
}

.iv-a-name::after {
  content: "：";
}

/*-- 記事詳細：会話ブロック --*/

.topics-detail-talk-blk {
  display: flex;
  align-items: flex-start;
  gap: 1.5em;
  margin-top: calc(48px + 3 * ((100vw - 400px) / 1040));
  margin-bottom: calc(32px + 2 * ((100vw - 400px) / 1040));
}

.talk-txt {
  margin-top: calc(28px + 12 * ((100vw - 400px) / 1040)) !important;
}

.talk-speaker {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.speaker-thumb {
  width: calc(56px + 24 * ((100vw - 400px) / 1040));
  aspect-ratio: 1 / 1;
  overflow: hidden;
  border-radius: 50%;
}

.speaker-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.speaker-name {
  font-size: calc(12px + 1 * ((100vw - 400px) / 1040));
  line-height: 1.25;
  margin-bottom: 0 !important;
  margin-top: 0.5em !important;
}

/*-- 記事詳細：引用ブロック --*/

.topics-detail-cite-blk {
  display: flex;
  align-items: flex-start;
  gap: calc(16px + 24 * ((100vw - 400px) / 1040));
  width: 100%;
  background-color: #fff;
  padding: calc(16px + 24 * ((100vw - 400px) / 1040));
  border-radius: calc(14px + 6 * ((100vw - 400px) / 1040));
  text-decoration: none !important;
  box-sizing: border-box;
}

/* 画像 */

.topics-detail-cite-blk .cite-img {
  width: calc(48px + 32 * ((100vw - 400px) / 1040));
  min-width: calc(48px + 32 * ((100vw - 400px) / 1040));
  aspect-ratio: 1 / 1;
  flex-shrink: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
}

.topics-detail-cite-blk .cite-img img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  border-radius: calc(8px + 4 * ((100vw - 400px) / 1040));
}

/* テキスト */

.topics-detail-cite-blk .cite-txt {
  flex: 1;
  width: auto;
  min-width: 0;
  margin: 0;
  padding: 0;
}

/* タイトル */

.topics-detail-cite-blk .cite-title {
  font-size: calc(14px + 2 * ((100vw - 400px) / 1040));
  line-height: 1.6;
  margin-top: 0;
  margin-bottom: 1em;
  color: #4b4b4b;
}

/* URL */

.topics-detail-cite-blk .cite-link {
  display: block;
  font-size: calc(12px + 2 * ((100vw - 400px) / 1040));
  line-height: 1.6;
  margin: 0 !important;
  color: #4b4b4b80 !important;
  overflow-wrap: anywhere;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/*-- 記事詳細：1カラムブロック --*/

.topics-detail-single-clumn-blk {
  background-color: #f3f3f3;
  padding: 1px calc(24px + 56 * ((100vw - 400px) / 1040)) calc(24px + 56 * ((100vw - 400px) / 1040));
  border-radius: calc(14px + 6 * ((100vw - 400px) / 1040));
  margin: calc(48px + 32 * ((100vw - 400px) / 1040)) 0;
}

/* 1カラム内の子ブロック */
.topics-detail-single-clumn-blk > .topics-detail-blk {
  padding-left: 0;
  padding-right: 0;
}

/* 1カラム内のテキストブロック */
.topics-detail-single-clumn-blk > .topics-detail-blk > .topics-detail-txt-blk {
  padding-left: 0;
  padding-right: 0;
}

/* 1カラム内の本文 */
.topics-detail-single-clumn-blk p {
  margin: 1em 0 !important;
}

/* 1カラム内のH3 */
.topics-detail-single-clumn-blk h3 {
  color: #eb6ea5;
}

/* 1カラム内の画像 */
.topics-detail-single-clumn-blk .topics-detail-figure-blk {
  margin: calc(24px + 8 * ((100vw - 400px) / 1040)) 0;
}

/*-- 記事詳細：2カラムブロック --*/

.topics-detail-twin-clumn-blk {
  background-color: #f3f3f3;
  padding: 1px calc(24px + 56 * ((100vw - 400px) / 1040)) calc(24px + 56 * ((100vw - 400px) / 1040));
  border-radius: calc(14px + 6 * ((100vw - 400px) / 1040));
  margin: calc(48px + 32 * ((100vw - 400px) / 1040)) 0;
}

.topics-detail-twin-clumn-blk p {
  margin: 1em 0 !important;
}

.topics-detail-twin-clumn-blk h3 {
  color: #eb6ea5;
}

.twin-clumn-inner-blk {
  display: flex;
  align-items: flex-start;
  column-gap: calc(48px + 8 * ((100vw - 400px) / 1040));
}

@media screen and (max-width: 1040px) {
  .twin-clumn-inner-blk {
    flex-direction: column;
  }
}

.twin-clumn-inner-blk-img {
  width: 100%;
  height: 100%;
  min-width: 240px;
}

.twin-clumn-inner-blk-img img {
  object-fit: cover;
  width: 100%;
  height: 100%;
  border-radius: calc(8px + 4 * ((100vw - 400px) / 1040));
}

.twin-clumn-inner-blk-txt {
  width: 100%;
  min-width: 0;
}

/* 2カラム右側では通常ブロックの左右paddingを解除 */

.twin-clumn-inner-blk-txt > .topics-detail-blk {
  padding-left: 0;
  padding-right: 0;
}

/* 2カラム右側ではテキスト用ブロックの左右paddingも解除 */

.twin-clumn-inner-blk-txt > .topics-detail-blk > .topics-detail-txt-blk {
  padding-left: 0;
  padding-right: 0;
}

/* 2カラム右側の先頭要素の上マージンを横並びの時はカット */

@media screen and (min-width: 1041px) {
  .twin-clumn-inner-blk-txt > .topics-detail-blk:first-child h4 {
    margin-top: 0;
  }
}

/*-- 記事詳細：埋め込みブロック --*/

.topics-detail-embed-blk {
  width: 100%;
  box-sizing: border-box;
  padding: 0 max(0px, calc(80 * ((100vw - 400px) / 1040)));
  margin: calc(48px + 32 * ((100vw - 400px) / 1040)) 0;
}

/* 埋め込み全般 */

.topics-detail-embed-blk iframe,
.topics-detail-embed-blk video,
.topics-detail-embed-blk embed,
.topics-detail-embed-blk object {
  max-width: 100%;
  box-sizing: border-box;
}

/* WordPress Embed */

.topics-detail-embed-blk .wp-block-embed,
.topics-detail-embed-blk .wp-block-embed__wrapper {
  width: 100%;
  max-width: 100%;
  margin: 0;
  box-sizing: border-box;
}

/* YouTube */

.topics-detail-embed-blk iframe[src*="youtube.com"],
.topics-detail-embed-blk iframe[src*="youtu.be"],
.topics-detail-embed-blk iframe[src*="youtube-nocookie.com"] {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
}

/* X / Twitter */

.topics-detail-embed-blk .twitter-tweet {
  max-width: 100% !important;
}

/* Instagram */

.topics-detail-embed-blk .instagram-media {
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

/* Facebook */

.topics-detail-embed-blk .fb-post,
.topics-detail-embed-blk .fb-video {
  max-width: 100% !important;
  box-sizing: border-box;
}

/*-------------------------------------------------- INFO DETAIL／シェアボタン --------------------------------------------------*/

.topics-detail-share-blk {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.5em;
  font-size: calc(14px + 2 * ((100vw - 400px) / 1040));
  padding-top: calc(42px + 6 * ((100vw - 400px) / 1040));
  padding-bottom: calc(64px + 56 * ((100vw - 400px) / 1040));
}

.topics-detail-share-txt {
  line-height: 1.25;
  font-weight: 700;
  color: #4b4b4bbf;
}

.topics-detail-share-box {
  display: flex;
  align-items: center;
  gap: 0.5em;
}

.topics-detail-share-sns-btn {
  line-height: 1;
  text-align: center;
  width: calc(42px + 6 * ((100vw - 400px) / 1040));
  aspect-ratio: 1 / 1;
  background-color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  font-weight: bold;
  color: #eb6ea5;
  cursor: pointer;
}

/*-------------------------------------------------- 記事詳細：WordPress移行記事 補正 --------------------------------------------------*/

/* 本文P：直下 / Group内 */
.topics-detail-cont > p,
.topics-detail-cont > .wp-block-group > p {
  box-sizing: border-box;
  padding-inline: var(--detail-text-pad);
  margin: var(--detail-text-space) 0;
  color: #4b4b4b;
  font-size: calc(16px + 1 * ((100vw - 400px) / 1040));
  font-weight: 500;
  line-height: 1.6;
}

.topics-detail-cont > .wp-block-group.is-layout-flex {
  display: block;
}

.topics-detail-cont > p:empty {
  margin: 0;
  padding: 0;
}

/* 見出し：通常 / 旧Columns内H2 */
.topics-detail-cont > :is(h2, h3, h4),
.topics-detail-cont > .wp-block-columns > .wp-block-column > h2 {
  box-sizing: border-box;
  padding-right: var(--detail-text-pad);
}

.topics-detail-cont > h2,
.topics-detail-cont > .wp-block-columns > .wp-block-column > h2 {
  padding-left: calc(var(--detail-text-pad) + 1em);
  margin-top: calc(72px + 24 * ((100vw - 400px) / 1040));
  margin-bottom: calc(36px + 12 * ((100vw - 400px) / 1040));
}

.topics-detail-cont > h3 {
  padding-left: calc(var(--detail-text-pad) + 1em);
  margin-top: calc(66px + 18 * ((100vw - 400px) / 1040));
  margin-bottom: calc(33px + 9 * ((100vw - 400px) / 1040));
}

.topics-detail-cont > h4 {
  padding-left: calc(var(--detail-text-pad) + 0.75em);
  margin-top: calc(60px + 12 * ((100vw - 400px) / 1040));
  margin-bottom: calc(30px + 6 * ((100vw - 400px) / 1040));
}

.topics-detail-cont > :is(h2, h3, h4)::before,
.topics-detail-cont > .wp-block-columns > .wp-block-column > h2::before {
  left: var(--detail-text-pad);
}

.topics-detail-cont > .wp-block-columns {
  margin: 0;
}

/* 本文内の装飾 */
.topics-detail-cont > p :is(strong, b) {
  display: inline;
  margin: 0;
  color: #2d2d2d;
  font-weight: 700;
}

.topics-detail-cont > p a {
  display: inline;
  margin: 0;
  color: #288cc8;
  text-decoration: underline;
}

/*--------------------------------------------------
  記事詳細：画像
--------------------------------------------------*/

/* 通常の画像ブロック */
.topics-detail-cont > .wp-block-image,
.topics-detail-cont > figure:not(.wp-block-embed, .wp-block-table) {
  width: calc(100% - (var(--detail-media-pad) * 2));
  margin: var(--detail-block-space) var(--detail-media-pad);
  padding: 0;
  box-sizing: border-box;
}

/* 通常画像 */
.topics-detail-cont img:not(.emoji):not(.wp-smiley) {
  display: block;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  box-sizing: border-box;
  object-fit: contain;
  object-position: center;
  border-radius: var(--detail-radius);
}

/* p直下に直接入っている画像 */
.topics-detail-cont > p > img:not(.emoji):not(.wp-smiley) {
  width: calc(100% - (var(--detail-media-pad) * 2)) !important;
  margin: var(--detail-block-space) auto;
}

/* キャプション */
.topics-detail-cont > figure figcaption {
  margin-top: 1em;
  font-size: calc(12px + 2 * ((100vw - 400px) / 1040));
  font-weight: 400;
  line-height: 1.6;
  color: #4b4b4b;
}

/* 絵文字 */
.topics-detail-cont img.emoji,
.topics-detail-cont img.wp-smiley {
  display: inline !important;
  width: 1em !important;
  height: 1em !important;
  max-width: none !important;
  margin: 0 0.07em !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  vertical-align: -0.1em !important;
  object-fit: contain;
}

/* リスト */
.topics-detail-cont > :is(ul, ol) {
  box-sizing: border-box;
  padding-right: var(--detail-text-pad);
  padding-left: calc(var(--detail-text-pad) + 1.75em);
  margin: var(--detail-text-space) 0;
  color: #4b4b4b;
  font-size: calc(16px + 1 * ((100vw - 400px) / 1040));
  font-weight: 500;
  line-height: 1.6;
}

.topics-detail-cont > :is(ul, ol) li {
  margin: 0.5em 0;
}

/* 引用 */
.topics-detail-cont > blockquote {
  box-sizing: border-box;
  margin: var(--detail-block-space) var(--detail-text-pad);
  padding: calc(20px + 12 * ((100vw - 400px) / 1040));
  background-color: #f3f3f3;
  border-left: 4px solid #eb6ea5;
}

/* テーブル */
.topics-detail-cont > .wp-block-table {
  box-sizing: border-box;
  padding-inline: var(--detail-media-pad);
  margin: var(--detail-block-space) 0;
  overflow-x: auto;
}

.topics-detail-cont > .wp-block-table table {
  width: 100%;
  border-collapse: collapse;
}

.topics-detail-cont > table {
  width: calc(100% - (var(--detail-text-pad) * 2)) !important;
  max-width: calc(100% - (var(--detail-text-pad) * 2));
  height: auto !important;
  margin: var(--detail-text-space) var(--detail-text-pad);
  border-collapse: collapse;
  table-layout: fixed;
  box-sizing: border-box;
}

.topics-detail-cont > table th,
.topics-detail-cont > table td {
  padding: 1em;
  border: 1px solid #ddd;
  text-align: left;
  vertical-align: middle;
  box-sizing: border-box;
  word-break: break-word;
}

/* YouTube / Vimeo */
.topics-detail-cont :is(.wp-block-embed-youtube iframe, .wp-block-embed-vimeo iframe, iframe[src*="youtube.com"], iframe[src*="youtu.be"], iframe[src*="vimeo.com"]) {
  display: block;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 16 / 9;
  border: 0;
}

/* WordPress video：縦動画も画面高を超えすぎない */
.topics-detail-cont .wp-block-video {
  width: 100%;
  text-align: center;
}

.topics-detail-cont .wp-block-video video {
  display: block;
  width: auto;
  max-width: 100%;
  height: auto;
  max-height: 80vh;
  margin-inline: auto;
}

/*-------------------------------------------------- CONTACT --------------------------------------------------*/

.contact-navi-wrap {
  padding: calc(48px + 48 * ((100vw - 400px) / 1040)) calc(32px + 128 * ((100vw - 400px) / 1040)) 0;
}

.contact-navi-txt {
  font-size: calc(16px + 2 * ((100vw - 400px) / 1040));
  font-weight: 700;
  text-align: center;
  line-height: 1.75;
}

@media screen and (max-width: 768px) {
  .contact-navi-txt {
    text-align: left;
  }
}

.contact-navi-btn-blk {
  --navi-gap: 1em;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: var(--navi-gap);
  font-size: calc(18px + 2 * ((100vw - 400px) / 1040));
  font-weight: 700;
  padding-top: calc(36px + 68 * ((100vw - 400px) / 1040));
}

@media screen and (max-width: 768px) {
  .contact-navi-btn-blk {
    gap: 0.5em;
  }
}

.contact-navi-btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
  /* 3カラム */
  width: calc((100% - var(--navi-gap) * 2) / 3);
  background-color: #fff;
  padding: 1.5em;
  border-radius: 0.5em;
  box-sizing: border-box;
}

@media screen and (max-width: 768px) {
  .contact-navi-btn {
    flex-direction: column;
    gap: 0.5em;
  }
}

@media screen and (max-width: 584px) {
  .contact-navi-btn {
    width: 100%;
    flex-direction: row;
  }
}

.contact-navi-btn-txt-box {
  display: flex;
  align-items: center;
  gap: 0.75em;
}

@media screen and (max-width: 768px) {
  .contact-navi-btn-txt-box {
    flex-direction: column;
    gap: 0.25em;
  }
}

@media screen and (max-width: 584px) {
  .contact-navi-btn-txt-box {
    flex-direction: row;
    gap: 0.5em;
  }
}

.contact-navi-icon-env {
  color: #eb6ea5;
}

.contact-navi-icon-tel {
  color: #65a6d7;
}

.contact-navi-icon-line {
  color: #06c755;
}

.contact-navi-btn-arrow {
  width: calc(18px + 2 * ((100vw - 400px) / 1040));
  height: 100%;
  aspect-ratio: 1 / 1;
  background-color: transparent;
  background-image: url(../img/arrow-down-20-20-2d2d2d.svg);
  background-repeat: no-repeat;
  background-size: calc(18px + 2 * ((100vw - 400px) / 1040));
  background-position: center;
  border-radius: 9999px;
}

@media screen and (max-width: 768px) {
  .contact-navi-btn-arrow {
    opacity: 0.5;
  }
}

@media screen and (max-width: 584px) {
  .contact-navi-btn-arrow {
    opacity: 1;
  }
}

.contact-navi-btn-arrow-ex {
  background-image: url(../img/arrow-ex-20-20-2d2d2d.svg);
}

/*-------------------------------------------------- CONTACT／お問い合わせフォーム --------------------------------------------------*/

#contact-mail {
  padding: 0 max(0px, calc(80 * ((100vw - 400px) / 1040)));
  padding-top: calc(96px + 104 * ((100vw - 400px) / 1040));
}

.contact-mail-wrap {
  padding: calc(64px + 56 * ((100vw - 400px) / 1040)) calc(24px + 96 * ((100vw - 400px) / 1040));
  background-color: #fff;
  border-radius: 0 calc(40px + 40 * ((100vw - 400px) / 1040)) calc(40px + 40 * ((100vw - 400px) / 1040)) calc(40px + 40 * ((100vw - 400px) / 1040));
  position: relative;
}

.contact-form {
  display: flex;
  flex-direction: column;
  gap: 2em;
  font-size: calc(16px + 2 * ((100vw - 400px) / 1040));
}

@media screen and (max-width: 1040px) {
  .contact-form {
    gap: 1em;
  }
}

/*-------------------------------------------------- CONTACT／お問い合わせ目的 --------------------------------------------------*/

.contact-aim-grp {
  position: relative;
  padding-bottom: calc(56px + 6 * ((100vw - 400px) / 1040));
  margin-bottom: calc(32px + 4 * ((100vw - 400px) / 1040));
}

.contact-aim-grp::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 100%;
  height: 4px;
  background: radial-gradient(circle, #2d2d2d40 2px, transparent 2px);
  background-size: 8px 4px;
  background-repeat: repeat-x;
}

.contact-hint-bb {
  position: absolute;
  left: 0;
  top: -1.33em;
  display: flex;
  align-items: center;
  gap: 0.5em;
  border-radius: 1.25em 1.25em 1.25em 0;
  background-color: #eb6ea5;
  color: #fff;
  font-size: calc(18px + 2 * ((100vw - 400px) / 1040));
  font-weight: 700;
  padding: 0.66em 1em;
}

.contact-mail-aim-hd {
  display: flex;
  align-items: center;
  gap: calc(13px + 2 * ((100vw - 400px) / 1040));
  font-size: calc(20px + 4 * ((100vw - 400px) / 1040));
  font-weight: 700;
  margin-bottom: 2em;
}

.contact-mail-aim-hd .h-tag {
  margin: 0;
}

.contact-radio-blk {
  --radio-gap: max(0px, calc(40 * ((100vw - 400px) / 1040)));

  box-sizing: border-box;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
}

.contact-radio {
  padding: 1em;
  box-sizing: border-box;
}

.contact-radio,
.contact-radio-other {
  width: calc((100% - var(--radio-gap) * 2) / 3);
  box-sizing: border-box;
  cursor: pointer;
  font-size: calc(16px + 2 * ((100vw - 400px) / 1040));
  font-weight: 700;
}

@media screen and (max-width: 1040px) {
  .contact-radio,
  .contact-radio-other {
    width: calc((100% - var(--radio-gap)) / 2);
  }
}

@media screen and (max-width: 768px) {
  .contact-radio,
  .contact-radio-other {
    width: 100%;
  }
}

/* デフォルトのラジオボタンを非表示 */
.contact-radio input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

/* 丸 */
.contact-radio span {
  display: flex;
  align-items: flex-start;
  gap: 0.5em;
}

.contact-radio span::before {
  content: "";
  display: block;
  flex-shrink: 0;
  width: 1.5em;
  height: 1.5em;
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  background-color: #f5f5f5;
  border: 1px solid #2d2d2d0d;
  box-sizing: border-box;
}

/* 選択時 */
.contact-radio input:checked + span::before {
  background-color: #eb6ea5;
  border: 5px solid #f5f5f5;
}

/* キーボード操作時 */
.contact-radio input:focus-visible + span::before {
  outline: 2px solid #eb6ea5;
  outline-offset: 2px;
}

.contact-radio-other {
  position: relative;
  padding: 1em;
}

.contact-radio-other .contact-radio {
  width: 100%;
  padding: 0;
}

.contact-radio-other-input {
  position: absolute;
  z-index: 2;
  top: 2.75em;
  left: 3em;
  width: calc(100% - 3em * ((100vw - 400px) / 1040));
  padding: 1em;
  border: 1px solid #eee;
  border-radius: 8px;
  background-color: #fafafa;
  box-sizing: border-box;

  /* 非表示 */
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(-8px);

  transition:
    opacity 0.3s ease,
    transform 0.3s ease,
    visibility 0.3s;
}

/* その他を選択 */
.contact-radio-other:has(.contact-radio input:checked) .contact-radio-other-input {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
}

/*-------------------------------------------------- CONTACT／お問い合わせ入力項目--------------------------------------------------*/

.contact-form-box {
  display: flex;
  align-items: flex-start;
}

@media screen and (max-width: 1040px) {
  .contact-form-box {
    flex-direction: column;
  }
}

.contact-form-label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: calc(256px + 64 * ((100vw - 400px) / 1040));
  font-weight: 700;
  padding: 1em;
  box-sizing: border-box;
}

@media screen and (max-width: 1040px) {
  .contact-form-label {
    padding-left: 0;
    width: 100%;
  }
}

.contact-form-required {
  background-color: #eb6ea5;
  color: #fff;
  font-size: calc(12px + 2 * ((100vw - 400px) / 1040));
  font-weight: 500;
  padding: 0.25em 0.75em;
  border-radius: 9999px;
}

.contact-form-field {
  flex: 1;
  width: auto;
}

@media screen and (max-width: 1040px) {
  .contact-form-field {
    width: 100%;
  }
}

.contact-form input,
.contact-form select,
.contact-form textarea {
  appearance: none;
  -webkit-appearance: none;
  border: none;
  outline: none;
  color: inherit;
  background-color: #f5f5f5;
  box-sizing: border-box;
  border: 1px solid #2d2d2d0d;
  padding: 1em;
  border-radius: 0.5em;
  font-size: calc(16px + 2 * ((100vw - 400px) / 1040));
}

.contact-form-field input,
.contact-form-field select,
.contact-form-field textarea {
  width: 100%;
  font-family: inherit;
  font-size: inherit;
  font-weight: 400;
  line-height: inherit;
  color: inherit;
}

.contact-form-box-message {
  margin-bottom: 1em;
}

/*-------------------------------------------------- CONTACT／お問い合わせフォーム／プライバシーポリシー--------------------------------------------------*/
@media screen and (max-width: 1040px) {
  .contact-form-privacy {
    margin-top: 0.5em;
  }
}

.contact-form-privacy-check {
  display: flex;
  align-items: center;
  position: relative;
  gap: 0.66em;
}

.contact-form-privacy-check input {
  width: 2em;
  height: 2em;
  aspect-ratio: 1 / 1;
  margin: 0;
}

/* チェックマーク */
.contact-form-privacy-check-mark {
  position: absolute;
  left: 0;
  top: 0;
  width: 2em;
  height: 2em;
  display: block;
  background-image: url("../img/checkmark-24-24-fff.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 1.5em;
  box-sizing: border-box;

  /* 通常時は非表示 */
  opacity: 0;
  pointer-events: none;
}

/* チェック時：inputを赤に */
.contact-form-privacy-check input:checked {
  appearance: none;
  -webkit-appearance: none;
  background-color: #eb6ea5;
}

/* チェック時：マークを表示 */
.contact-form-privacy-check input:checked + .contact-form-privacy-check-mark {
  opacity: 1;
}

.contact-form-privacy-check-txt {
  font-weight: 700;
  display: flex !important;
}

.contact-form-privacy-check-txt a {
  color: inherit;
  text-decoration: underline;
}

.contact-form-privacy-note {
  font-size: calc(12px + 2 * ((100vw - 400px) / 1040));
  margin-top: 1em;
}
/*-------------------------------------------------- CONTACT／お問い合わせフォーム／送信ボタン --------------------------------------------------*/

@media screen and (max-width: 1040px) {
  .contact-form-submit {
    margin-top: 0.5em;
  }
}

.contact-form-submit-btn {
  cursor: pointer;
}

.contact-form-submit-btn .main-btn-txt {
  padding: 1.5em 2em;
}

.contact-form-submit-btn .main-btn-circle-btn {
  padding: 1.5em;
}

.contact-form-submit-btn:hover .main-btn-txt {
  border-radius: 9999px 0 0 9999px;
}

.contact-form-submit-btn:hover .main-btn-circle-btn {
  border-radius: 0 9999px 9999px 0;
}

/*-------------------------------------------------- CONTACT／お問い合わせフォーム／電話番号リスト --------------------------------------------------*/

#contact-phone {
  padding: calc(96px + 104 * ((100vw - 400px) / 1040)) max(0px, calc(80 * ((100vw - 400px) / 1040)));
}

.contact-phone-wrap {
  padding: calc(64px + 56 * ((100vw - 400px) / 1040)) calc(24px + 96 * ((100vw - 400px) / 1040));
  background-color: #fff;
  border-radius: 0 calc(40px + 40 * ((100vw - 400px) / 1040)) calc(40px + 40 * ((100vw - 400px) / 1040)) calc(40px + 40 * ((100vw - 400px) / 1040));
  position: relative;
}

#contact-phone .contact-hint-bb {
  background-color: #65a6d7;
}

.contact-phone-lead-blk {
  font-size: calc(18px + 2 * ((100vw - 400px) / 1040));
  text-align: center;
  letter-spacing: 0.02em;
  padding: 0 calc(8px + 152 * ((100vw - 400px) / 1040));
}
@media screen and (max-width: 768px) {
  .contact-phone-lead-blk {
    text-align: left;
  }
}

.contact-phone-lead {
  line-height: 1.6;
  font-weight: 700;
  margin-bottom: 1.5em;
}

.contact-phone-lead-recept {
  font-size: calc(14px + 2 * ((100vw - 400px) / 1040));
  font-weight: 700;
  color: #4b4b4b;
  margin-bottom: 0.5em;
}

.contact-phone-lead-recept-note {
  font-size: calc(11px + 1 * ((100vw - 400px) / 1040));
  font-weight: 500;
}

.contact-phone-number-list-grp {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  font-size: calc(18px + 2 * ((100vw - 400px) / 1040));
  gap: 0.5em;
  margin-top: calc(36px + 24 * ((100vw - 400px) / 1040));
}

.contact-phone-number-list {
  display: flex;
  align-items: center;
  background-color: #f9f9f9;
  border: 1px solid #f0f0f0;
  padding: 2em;
  border-radius: 1em;
  gap: 1.25em;
  width: 100%;
  box-sizing: border-box;
}

@media screen and (max-width: 1040px) {
  .contact-phone-number-list {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.5em;
  }
}

.contact-phone-number-list-place-name {
  color: #eb6ea5;
  font-weight: 700;
  text-align: center;
  padding-right: 0.25em;
  width: 19%;
}

@media screen and (max-width: 1040px) {
  .contact-phone-number-list-place-name {
    width: 100%;
    text-align: left;
  }
}

.contact-phone-number-list-b .contact-phone-number-list-place-name {
  color: #65a6d7;
}

.contact-phone-number-list-detail {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: calc(21px + 123 * ((100vw - 400px) / 1040));
  padding-left: 1.75em;
  flex: 1;
  border-left: 2px solid #2d2d2d1a;
  width: 100%;
}

@media screen and (max-width: 1280px) {
  .contact-phone-number-list-detail {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.75em;
  }
}

@media screen and (max-width: 1040px) {
  .contact-phone-number-list-detail {
    padding-left: 0;
    padding-top: 1em;
    border-left: 0;
    border-top: 2px solid #2d2d2d1a;
  }
}

.contact-phone-number-list-place-number {
  display: flex;
  align-items: center;
  gap: 0.5em;
  font-size: calc(28px + 4 * ((100vw - 400px) / 1040));
  font-weight: 700;
  font-family: "Quicksand", sans-serif;
  line-height: 1;
  letter-spacing: 0.02em;
  white-space: nowrap;
}

.contact-phone-number-list-place-number .phone-icon {
  color: #eb6ea5;
}

.contact-phone-number-list-b .contact-phone-number-list-place-number .phone-icon {
  color: #65a6d7;
}

.contact-phone-number-list-place-add {
  font-size: calc(14px + 2 * ((100vw - 400px) / 1040));
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1em;
  width: 100%;
}

.contact-phone-number-list-b .place-ov-link-btn {
  background-color: #65a6d7;
}

#contact #cv {
  margin-bottom: calc(48px + 72 * ((100vw - 400px) / 1040));
}

/*==================================================
CONTACT FORM 7
==================================================*/

/*--------------------------------------------------
お問い合わせ目的 見出し
--------------------------------------------------*/

.contact-mail-aim-hd {
  display: flex;
  align-items: center;
  gap: calc(13px + 2 * ((100vw - 400px) / 1040));
}

.contact-mail-aim-hd .h-tag {
  display: block;
  flex: 0 0 auto;
  margin: 0;
}

/* CF7が生成するp */
.contact-mail-aim-hd .h-tag-dot-unit > p {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.35em;
  margin: 0;
}

/* ・・を横並び */
.contact-mail-aim-hd .h-tag-dot-unit {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.35em;
  width: auto;
}

/* 丸 */
.contact-mail-aim-hd .h-tag-dot {
  position: static !important;
  display: block;
  flex: 0 0 auto;
  margin: 0 !important;
}

/* 見出し */
.contact-mail-aim-hd > p {
  width: auto;
  margin: 0;
  flex: 0 0 auto;
}

/*--------------------------------------------------
お問い合わせ目的 ラジオボタン
--------------------------------------------------*/

.contact-radio-blk .wpcf7-form-control-wrap {
  display: block;
  width: 100%;
}

.contact-radio-blk .wpcf7-radio {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  width: 100%;
}

.contact-radio-blk .wpcf7-list-item {
  width: calc((100% - var(--radio-gap) * 2) / 3);
  margin: 0;
  padding: 1em;
  box-sizing: border-box;

  font-size: calc(16px + 2 * ((100vw - 400px) / 1040));
  font-weight: 700;
}

.contact-radio-blk .wpcf7-list-item label {
  display: flex;
  align-items: flex-start;
  margin: 0;
  cursor: pointer;
}

/* CF7標準ラジオを非表示 */
.contact-radio-blk .wpcf7-list-item input[type="radio"] {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

/* テキスト + オリジナルラジオ */
.contact-radio-blk .wpcf7-list-item-label {
  display: flex;
  align-items: flex-start;
  gap: 0.5em;
}

.contact-radio-blk .wpcf7-list-item-label::before {
  content: "";
  display: block;
  flex: 0 0 auto;

  width: 1.5em;
  height: 1.5em;
  aspect-ratio: 1 / 1;

  border: 1px solid #2d2d2d0d;
  border-radius: 50%;
  background-color: #f5f5f5;

  box-sizing: border-box;
}

/* 選択時 */
.contact-radio-blk .wpcf7-list-item input[type="radio"]:checked + .wpcf7-list-item-label::before {
  background-color: #eb6ea5;
  border: 5px solid #f5f5f5;
}

/*--------------------------------------------------
ラジオボタン レスポンシブ
--------------------------------------------------*/

@media screen and (max-width: 1040px) {
  .contact-radio-blk .wpcf7-list-item {
    width: calc((100% - var(--radio-gap)) / 2);
  }
}

@media screen and (max-width: 768px) {
  .contact-radio-blk .wpcf7-list-item {
    width: 100%;
  }
}

/*--------------------------------------------------
「その他」入力欄
--------------------------------------------------*/

.contact-radio-blk .wpcf7-list-item.is-other {
  position: relative;
}

.contact-radio-other-input-wrap {
  width: 100%;
  max-height: 0;
  padding-left: 2em;

  overflow: hidden;

  opacity: 0;
  visibility: hidden;
  pointer-events: none;

  box-sizing: border-box;

  transition:
    max-height 0.3s ease,
    opacity 0.3s ease,
    visibility 0.3s;
}

/* 「その他」選択時 */
.contact-radio-other-input-wrap.is-open {
  max-height: 10em;

  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

/* CF7が生成するp */
.contact-radio-other-input-wrap p {
  margin: 0;
}

.contact-radio-other-input-wrap .contact-radio-other-input {
  position: static;

  width: 100%;
  margin-top: 0.75em;

  box-sizing: border-box;
}

.contact-radio-other-input-wrap.is-open .contact-radio-other-input {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
}

/*--------------------------------------------------
通常フォーム
--------------------------------------------------*/

/*
項目名 + 必須を横並び

お名前　必須
*/

.contact-form-label {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex-wrap: nowrap !important;

  width: calc(256px + 64 * ((100vw - 400px) / 1040));

  gap: 0.75em;
}

/*
CF7が自動生成したpが間に入っても、
labelと必須を直接flex itemとして扱う
*/
.contact-form-label > p {
  display: contents;
}

/* 項目名 */
.contact-form-label label {
  display: inline-block !important;

  width: auto !important;
  margin: 0 !important;

  flex: 0 0 auto !important;
}

/* 必須 */
.contact-form-label .contact-form-required {
  display: inline-block !important;

  width: auto !important;
  margin: 0 !important;

  flex: 0 0 auto !important;
}

/*--------------------------------------------------
入力フィールド
--------------------------------------------------*/

.contact-form-field {
  min-width: 0;
}

/* CF7が生成するp */
.contact-form-field > p {
  width: 100%;
  margin: 0;
}

.contact-form-field .wpcf7-form-control-wrap {
  display: block;
  width: 100%;
}

.contact-form-field input,
.contact-form-field select,
.contact-form-field textarea {
  width: 100%;
  box-sizing: border-box;
}

/*--------------------------------------------------
通常フォーム 1040px以下
--------------------------------------------------*/

@media screen and (max-width: 1040px) {
  .contact-form-label {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    flex-wrap: nowrap !important;

    width: 100%;

    gap: 0.75em;
  }

  .contact-form-label > p {
    display: contents;
  }

  .contact-form-label label,
  .contact-form-label .contact-form-required {
    display: inline-block !important;

    width: auto !important;
    margin: 0 !important;

    flex: 0 0 auto !important;
  }
}

/*--------------------------------------------------
プライバシーポリシー
--------------------------------------------------*/

.contact-form-privacy-check {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: nowrap;

  gap: 0.75em;
}

/* チェックボックスを包む要素 */
.contact-form-privacy-checkbox {
  display: flex;
  align-items: center;

  flex: 0 0 auto;
}

/* CF7が生成する要素 */
.contact-form-privacy-checkbox .wpcf7-form-control-wrap,
.contact-form-privacy-checkbox .wpcf7-acceptance,
.contact-form-privacy-checkbox .wpcf7-list-item,
.contact-form-privacy-checkbox .wpcf7-list-item label {
  display: flex;
  align-items: center;

  width: auto;

  margin: 0;
  padding: 0;
}

.contact-form-privacy-checkbox .wpcf7-list-item {
  margin: 0;
}

/* チェックボックス */
.contact-form-privacy-checkbox input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;

  display: block;

  width: 2em;
  height: 2em;
  aspect-ratio: 1 / 1;

  margin: 0;

  flex: 0 0 auto;

  border: 1px solid #f0f0f0;
  border-radius: 0.25em;

  background-color: #f9f9f9;

  box-sizing: border-box;
  cursor: pointer;
}

/* チェック時 */
.contact-form-privacy-checkbox input[type="checkbox"]:checked {
  background-color: #eb6ea5;

  background-image: url("../img/checkmark-24-24-fff.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 1em;
}

/* CF7が生成する不要なラベル文字 */
.contact-form-privacy-checkbox .wpcf7-list-item-label {
  display: none;
}

/* 「プライバシーポリシーに同意する」 */
.contact-form-privacy-check-txt {
  display: block;

  width: auto;
  margin: 0;

  flex: 0 0 auto;

  white-space: nowrap;
}

/* プラポリの必須 */
.contact-form-privacy-check > .contact-form-required {
  display: inline-block;

  width: auto;
  margin: 0;

  flex: 0 0 auto;
}

/*--------------------------------------------------
CF7 バリデーションメッセージ
--------------------------------------------------*/

/* 各フィールド下の赤文字 */
.wpcf7-not-valid-tip {
  display: none !important;
}

/* フォーム最下部のメッセージ */
.wpcf7-response-output {
  display: none !important;
}

/*-------------------------------------------------- THANKS --------------------------------------------------*/

.thanks-msg-wrap {
  font-size: calc(24px + 8 * ((100vw - 400px) / 1040));
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 2em;
  padding: 0 calc(24px + 216 * ((100vw - 400px) / 1040));
  padding-top: calc(64px + 56 * ((100vw - 400px) / 1040));
  padding-bottom: calc(96px + 104 * ((100vw - 400px) / 1040));
  box-sizing: border-box;
}

.thanks-msg-h {
  font-weight: 700;
  letter-spacing: 0.05em;
}

.thanks-msg-txt {
  font-size: calc(16px + 2 * ((100vw - 400px) / 1040));
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: 0.02em;
  margin-bottom: 1em;
}

/*--------------------------------------------------
404エラーページ
--------------------------------------------------*/

.error-404 {
  padding: calc(160px + 80 * ((100vw - 400px) / 1040)) calc(24px + 96 * ((100vw - 400px) / 1040));
}

.error-404-wrap {
  text-align: center;
}

.error-404-code {
  font-family: "Quicksand", sans-serif;
  font-size: calc(80px + 80 * ((100vw - 400px) / 1040));
  font-weight: 700;
  line-height: 1;
  color: #eb6ea5;
}

.error-404-title {
  margin-top: 0.75em;
  font-size: calc(24px + 16 * ((100vw - 400px) / 1040));
  font-weight: 700;
}

.error-404-text {
  margin: 1.5em 0 2.5em;
  font-size: calc(14px + 2 * ((100vw - 400px) / 1040));
  line-height: 1.6;
  color: #4b4b4b;
}

/*--------------------------------------------------
パンくず
--------------------------------------------------*/

.breadcrumb {
  padding: 1.5em calc(24px + 96 * ((100vw - 400px) / 1040));
  padding-bottom: 0;
}

.breadcrumb-list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5em;
  font-size: calc(12px + 2 * ((100vw - 400px) / 1040));
  color: #4b4b4b80;
}

.breadcrumb-item {
  display: flex;
  align-items: center;
  gap: 0.5em;
}

.breadcrumb-item:not(:last-child)::after {
  content: "›";
  color: #4b4b4b40;
}

.breadcrumb-item a {
  color: #4b4b4b;
}