@charset "utf-8";
/*--------------------------------------------------------------------------------

  intro

--------------------------------------------------------------------------------*/
.intro {
  text-align: center;
}
.intro-lead {
  font-family: var(--ff-go);
  font-weight: 700;
  color: var(--color-primary);
  font-size: var(--fs-3l);
  line-height: var(--line-height-m);
  padding-bottom: 0.5em;
}
.intro-txt {
  font-weight: bold;
  font-size: var(--fs-m);
}

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

  loop

--------------------------------------------------------------------------------*/
@media not (max-width: 760px) { .loop { --img-break-point: 1400; --pd-break-point: var(--base-width); } }
@media (max-width: 760px) { .loop { --img-break-point: 1000; --pd-break-point: 760; } }
.loop {
  line-height: 1;
  overflow: hidden;
  display: flex;
  white-space: nowrap;
  container-type: inline-size;
}
.loop-list {
  padding: min(14cqi, var(--space-2l)) 0;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  animation: request-loop 60s linear infinite;
  will-change: transform;
}
.loop-list_item:nth-child(even) {
  padding-top: min(calc(60 / var(--pd-break-point) * 100vw), 60px);
}
.loop-list_item:nth-child(odd) {
  padding-bottom: min(calc(60 / var(--pd-break-point) * 100vw), 60px);
}
.loop-list_img {
  width: min(calc(320 / var(--img-break-point) * 100vw), 320px);
  margin: 0 min(calc(20 / var(--base-width) * 100vw), 20px);
  border-radius: 0.6rem;
  object-fit: cover;
  aspect-ratio: 4 / 3;
}
@keyframes request-loop {
  from { transform: translateX(0); }
  to { transform: translateX(-100%); }
}

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

  about

--------------------------------------------------------------------------------*/
.about {
  text-align: center;
}

/*--------------------------------------------------------------------------------
  .about-case
--------------------------------------------------------------------------------*/
@media not (max-width: 760px) { .about-case { --border-width: min(1cqw, 10px); } }
@media (max-width: 760px) { .about-case { --border-width: min(1.5cqw, 10px); } }
.about-case {
  margin-bottom: var(--space-m);
  display: inline-grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0 4cqw;
  line-height: var(--line-height-s);
  container-type: normal;
}
.about-case_item {
  display: grid;
  grid-template-rows: 1fr auto;
  container-type: normal;
  font-size: min(3.5cqw, 1rem);
}

/* .about-case_txt
----------------------------------------*/
.about-case_area-txt {
  border-radius: 0.4rem;
  background: rgba(var(--rgb-color-primary-lighter) / 0.5);
  background: linear-gradient(180deg,rgba(var(--rgb-color-primary-lighter) / 0.5) 0%, rgba(var(--rgb-color-secondary-lightest) / 0.5) 100%);
  padding: var(--border-width);
  border-radius: 999px;
  position: relative;
}
.about-case_area-txt:before {
  content: "";
  width: calc(100% - (var(--border-width) * 2));
  height: calc(100% - (var(--border-width) * 2));
  position: absolute;
  left: var(--border-width);
  top: var(--border-width);
  border-radius: 999px;
  background-color: #FFF;
}
.about-case_txt {
  position: relative;
  z-index: 2;
  height: 100%;
  color: var(--color-primary);
  font-family: var(--ff-go);
  font-weight: 500;
  padding: 1.5em min(5cqi, 3em);
  display: grid;
  place-content: center;
  place-items: center;
}
.about-case_item:first-child .about-case_area-txt,
.about-case_item:first-child .about-case_area-txt:before { border-bottom-right-radius: 0; }
.about-case_item:last-child .about-case_area-txt,
.about-case_item:last-child .about-case_area-txt:before { border-bottom-left-radius: 0; }

/* .about-case_img
----------------------------------------*/
@media not (max-width: 760px) { .about-case_img { --break-point: 1000; } }
@media (max-width: 760px) { .about-case_img { --break-point: 640; } }
.about-case_item:first-child .about-case_area-img { justify-self: end; }
.about-case_item:last-child .about-case_area-img { justify-self: start; }
.about-case_area-img {
  position: relative;
  z-index: 1;
  margin-top: -1.5em;
}
.about-case_img {
  width: min(calc(120 / var(--break-point) * 100vw), 120px);
}

/*--------------------------------------------------------------------------------
  .about_lead
--------------------------------------------------------------------------------*/
.about_lead {
  font-weight: bold;
  font-size: var(--fs-2m);
  margin-bottom: 1em;
}
.about_lead-highlight {
  font-size: var(--fs-m);
  margin: 0 0.25rem;
}
@media (max-width: 760px) {
  .about_txt { text-align: left; }
}

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

  overview

--------------------------------------------------------------------------------*/
.overview {
  padding: var(--space-3l) 0 var(--space-2l) 0;
}
.overview_hd {
  margin-bottom: var(--space-m);
}

/*--------------------------------------------------------------------------------
  .overview_tbl
--------------------------------------------------------------------------------*/
@media not (max-width: 760px) {
  .overview_tbl th {
    width: 25%;
    white-space: nowrap;
  }
}

/*--------------------------------------------------------------------------------
  .overview_list
--------------------------------------------------------------------------------*/
.overview_list {
  --list-rgap: 0;
  margin-top: 1rem;
}
@media not (max-width: 760px) {
  .overview_list {
    display: inline-grid;
    gap: 0 5cqi;
    grid-auto-flow: column;
    grid-template-rows: repeat(3, auto);
  }
}

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

  flow

--------------------------------------------------------------------------------*/
.flow {
  background-color: var(--bg-primary);
}
.flow_container { display: grid; }
.flow_area-img { margin-top: var(--space-l); }
@media not (max-width: 760px) {
  .flow {
    padding: var(--space-2l) 0 0 0;
  }
  .flow_container {
    grid-template-columns: 1fr 1.5fr;
    grid-template-rows: repeat(2, auto);
    grid-template-areas: 
      "flow-hd flow-content"
      "flow-img flow-content";
  }
  .flow_hd { grid-area: flow-hd; padding-right: var(--space-2l); }
  .flow_content { grid-area: flow-content; align-self: center; padding-bottom: var(--space-2l); }
  .flow_area-img { grid-area: flow-img; align-self: end; }
}
@media (max-width: 760px) {
  .flow {
    padding: var(--space-2l) 0 0 0;
  }
  .flow_hd { margin-bottom: var(--space-m); }
  .flow_area-img { text-align: center; }
}

/*--------------------------------------------------------------------------------
  .flow_img
--------------------------------------------------------------------------------*/
@media not (max-width: 760px) {
  .flow_img {
    width: min(calc(400 / 1400 * 100vw), 400px);
  }
}
@media (max-width: 760px) {
  .flow_img {
    width: min(80%, 440px);
  }
}

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

  schedule

--------------------------------------------------------------------------------*/
.schedule {
  padding-top: var(--space-2l);
}
.schedule_hd {
  margin-bottom: var(--space-m);
}
.schedule_hd-ttl {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--space-s) 1rem;
}

/*--------------------------------------------------------------------------------
  .schedule-list
--------------------------------------------------------------------------------*/
@media not (max-width: 760px) { .schedule-list { --border-width: min(1cqw, 12px); } }
@media (max-width: 760px) { .schedule-list { --border-width: min(2cqw, 12px); } }
.schedule-list {
  position: relative;
  padding: var(--border-width);
  border-radius: 0.6rem;
  background: rgba(var(--rgb-color-primary-lighter) / 0.5);
  background: linear-gradient(180deg,rgba(var(--rgb-color-primary-lighter) / 0.5) 0%, rgba(var(--rgb-color-secondary-lightest) / 0.5) 100%);
  overflow: hidden;
}
.schedule-list_scroll {
  overflow-x: auto;
  border-radius: 0.2rem;
  background-color: #FFF;
}
.schedule-list_inner {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--space-m) var(--inner-space-s);
  padding: var(--inner-space-m);
}
@media (max-width: 760px) {
  .schedule-list_inner {
    grid-template-columns: repeat(4, minmax(calc((50% + (var(--inner-space-m) / 2)) - var(--inner-space-s)), 1fr));
  }
  .schedule-list_item:last-of-type:after {
    content: ""''"";
    position: absolute;
    top: 0;
    left: 100%;
    height: 100%;
    width: var(--inner-space-m);
    background-color: transparent;
  }
}
.schedule-list_item {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  flex-direction: column;
}
.schedule-list_time {
  background-color: var(--color-primary-light);
  color: #FFF;
  font-weight: 500;
  line-height: 1;
  border-radius: 999px;
  padding: 0.5em 2.5em;
  text-align: center;
  position: relative;
}
.schedule-list_time:before {
  content: "";
  width: 0.75em;
  height: 0.5em;
  position: absolute;
  left: 50%;
  top: 100%;
  transform: translateX(-50%);
  background-color: var(--color-primary-light);
  clip-path: polygon(50% 100%, 0 0, 100% 0);
}
.schedule-list_txt {
  font-weight: bold;
  padding-top: 1em;
}
.schedule-list_area-img {
  padding-top: 1em;
  text-align: center;
}
.schedule-list_img {
  width: min(80%, 200px);
}

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

  faq

--------------------------------------------------------------------------------*/
.faq {
  padding-top: var(--space-3l);
}
.faq_highlight {
  container-type: inline-size;
  text-align: center;
  padding: min(14cqi, var(--space-2l)) 0;
  font-size: var(--fs-2m);
  font-weight: bold;
}

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

  request

--------------------------------------------------------------------------------*/
@media not (max-width: 760px) { .request { margin-top: var(--space-2s); --fs: min(1.8cqw, 1rem); --border-width: min(1cqw, 12px); } }
@media (max-width: 760px) { .request { --fs: 1rem; --border-width: min(2cqw, 12px); } }
.request {
  margin-bottom: min(4cqi, var(--space-s));
  container-type: inline-size;
  background-color: var(--bg-primary2);
  padding: var(--border-width);
  border-radius: 0.6rem;
}
.request_link {
  --link-color: #FFF;
  --link-color-hover: #FFF;
  --link-deco: none;
  --link-deco-hover: none;
  font-size: var(--fs);
  display: grid;
  color: #FFF;
  border-radius: 0.3rem;
  background: var(--color-primary-light);
  background: linear-gradient(145deg,rgba(var(--rgb-color-primary-light) / 1) 50%, rgba(var(--rgb-color-secondary-lighter) / 1) 90%);
  position: relative;
}
@media not (max-width: 760px) {
  .request_link {
    grid-template-columns: auto 1fr;
    grid-template-areas: 
      "request-img request-ttl request-btn"
      "request-img request-txt request-btn";
    column-gap: var(--inner-space-l);
    row-gap: min(1.5cqw, 1.5rem);
    padding: var(--space-2s) var(--inner-space-m);
  }
  .request_mask-img { grid-area: request-img; }
  .request_ttl { grid-area: request-ttl; align-self: end; }
  .request_txt { grid-area: request-txt; align-self: start; }
  .request_btn { grid-area: request-btn; align-self: center; }
}
@media (max-width: 760px) {
  .request_link { padding: var(--inner-space-l); }
  .request_mask-img { margin: var(--space-s) 0; }
  .request_btn { margin-top: var(--space-s); justify-self: end; }
}

/*--------------------------------------------------------------------------------
  .request_ttl
--------------------------------------------------------------------------------*/
.request_ttl {
  font-family: var(--ff-go);
  font-weight: 700;
  font-size: var(--fs-3l);
  line-height: var(--line-height-2s);
}

/*--------------------------------------------------------------------------------
  .request_mask-img
--------------------------------------------------------------------------------*/
.request_mask-img {
  width: min(calc(var(--img-width) / var(--img-break-point) * 100vw), calc(var(--img-width) * 1px));
  aspect-ratio: 11 / 13;
  mask-image: var(--mask_oval);
  mask-repeat: no-repeat;
  mask-position: center center;
  mask-size: cover;
  margin-inline: auto;
}
.request_img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media not (max-width: 760px) {
  .request_mask-img {
    width: min(calc(240 / var(--base-width) * 100vw), 240px);
    margin-top: calc(-1 * (var(--space-2s) + var(--inner-space-l)));
  }
}
@media (max-width: 760px) {
  .request_mask-img {
    width: min(70%, 360px);
  }
}

/*--------------------------------------------------------------------------------
  .request_btn
--------------------------------------------------------------------------------*/
.request_btn { line-height: 1; }
@media (max-width: 760px) {
  .request_btn {
    margin-right: calc(-1 * (var(--inner-space-l) - var(--inner-space-m)));
    margin-bottom: calc(-1 * (var(--inner-space-l) - var(--inner-space-m)));
  }
}