/*===================
  Base
===================*/
@charset "utf-8";
:root{
  --color-main: #252525;
  --color-accent: #1442d7;
  --color-gray: #74747E;
  --color-border-gray: #E3E3E3;
  --color-bg-gray: #F8F9FB;
  --color-bg-gray-deep: #eef0f3;
  --content-padding-x: 5vw;
  --content-padding-y: 56px;
  --header-height: 72px;
}
@media screen and (min-width: 768px) {
  :root{
    --content-padding-y: 96px;
    --header-height: 120px;
  }
}
@font-face {
  font-family: "NotoSansJP";
  src: url("font/NotoSansJP-Regular.woff2") format("woff2");
  font-weight: normal;
  font-display: swap;
}
@font-face {
  font-family: "NotoSansJP";
  src: url("font/NotoSansJP-Bold.woff2") format("woff2");
  font-weight: bold;
  font-display: swap;
}
html{
  font-family: "NotoSansJP", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  font-size: 62.5%;
  line-height: 1.4;
  box-sizing: border-box;
  /* scroll-behavior: smooth; */
}
body{
  position: relative;
  color: var(--color-main);
  overflow-x: hidden;
  word-break: break-word;
  background-color: #FFF;
  background-image:
   radial-gradient(circle at 0% 0%, rgb(242, 248, 255) 0px, transparent 40%),
   radial-gradient(circle at 100% 100%, rgb(242, 248, 255) 0px, rgb(248, 247, 255) 40%, transparent 50%);
  background-attachment: fixed;

}
img {
  max-width: 100%;
  height: auto;
  vertical-align: top;
}

/*===================
  Layout
===================*/
.l-container{
  padding-inline: var(--content-padding-x);
}

.l-content{
  max-width: 1200px;
  margin-inline: auto;
}
.l-content-inner{
  max-width: 800px;
  margin-inline: auto;
}

/*===================
  Project
===================*/
/* ヘッダー */
.p-header{
  display: flex;
  align-items: center;
  width: 100%;
  height: var(--header-height);
  position: absolute;
  top: 0;
  left: 0;
  z-index: 999;
  padding-inline: 16px;
  background-image: linear-gradient(180deg, rgba(255, 255, 255, 0.8), transparent);
}
.p-header__logo a{
  transition: opacity .4s ease-out;
}
.p-header__logo img{
  width: 48px;
  height: auto;
}
#nav-toggle{
  display: none;
}
.p-header__global-nav{
  opacity: 0;
  visibility: hidden;
  transition: opacity .4s ease-out,  visibility .4s ease-out;
}
#nav-toggle:checked~.p-header__global-nav{
  opacity: 1;
  visibility: visible;
}
.p-header__global-nav-button{
  position: fixed;
  top: 0;
  right: 0;
  z-index: 1010;
  width: 56px;
  height: var(--header-height);
  display: flex;
  justify-content: center;
  align-items: center;
}
.p-header__global-nav-button span{
  position: relative;
  display: block;
  width: 24px;
  height: 2px;
  background-color: var(--color-main);
}
.p-header__global-nav-button span::before,
.p-header__global-nav-button span::after{
  position: absolute;
  left: 0;
  content: '';
  display: block;
  width: 24px;
  height: 2px;
  background-color: var(--color-main);
  transition: all .4s ease-out;
}
.p-header__global-nav-button span::before{
  top: -6px;
}
.p-header__global-nav-button span::after{
  bottom: -6px;
}
#nav-toggle:checked~.p-header__global-nav-button span{
  background-color: transparent;
}
#nav-toggle:checked~.p-header__global-nav-button span::before{
  top: 0;
  transform: rotate(45deg);
}
#nav-toggle:checked~.p-header__global-nav-button span::after{
  bottom: 0;
  transform: rotate(-45deg);
}
.p-header__global-nav{
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1000;
  width: 100%;
  height: 100vh;
  background-color: rgba(255, 255, 255, 0.8);
  backdrop-filter: blur(12px);
}
.p-header__global-nav-list{
  margin-top: var(--header-height);
  border-top: 1px solid var(--color-border-gray);
}
.p-header__global-nav-item{
  font-size: 1.6rem;
  font-weight: bold;
  letter-spacing: 0.1rem;
  border-bottom: 1px solid var(--color-border-gray);
}
.p-header__global-nav-item a{
  transition: color .4s ease-out;
}
.p-header__global-nav-item>a{
  display: block;
  line-height: 64px;
  padding-inline: 16px;
}
.p-header__global-nav-item>a::before {
  display: inline-block;
  content: '';
  width: 8px;
  height: 8px;
  background-color: var(--color-accent);
  border-radius: 50%;
  vertical-align: middle;
  margin-right: 8px;
}
.p-header__global-nav-item>ul{
  padding: 0 16px 24px;
}
.p-header__global-nav-item>ul>li{
  padding-left: 16px;
  font-size: 1.4rem;
  letter-spacing: 0.1rem;
}
.p-header__global-nav-item>ul>li+li{
  margin-top: 4px;
}
.p-header__global-nav-item>ul>li>a{
  display: block;
  line-height: 32px;
}
@media (hover: hover) and (pointer: fine) {
  .p-header__logo a:hover{
    opacity: 0.5;
  }
  .p-header__global-nav-item a:hover{
    color: var(--color-accent);
  }
}
@media screen and (min-width: 768px) {
  .p-header{
    padding-inline: var(--content-padding-x);
  }
  .p-header__content{
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    max-width: 1200px;
    margin-inline: auto;
  }
  .p-header__logo img{
    width: 64px;
  }
  .p-header__global-nav-button{
    display: none;
  }
  .p-header__global-nav{
    position: static;
    opacity: 1;
    visibility: visible;
    width: auto;
    height: auto;
    background-color: transparent;
    backdrop-filter: none;
  }
  .p-header__global-nav-list{
    margin-top: 0;
    border-top: none;
    display: flex;
    gap: 32px;
  }
  .p-header__global-nav-item{
    font-size: 1.4rem;
    border-bottom: none;
  }
  .p-header__global-nav-item>a{
    padding: 0;
  }
  .p-header__global-nav-item>a::before{
    content: none;
  }
  .p-header__global-nav-item>ul{
    display: none;
  }
}

/* キービジュアル */
.p-keyvisual{
  position: relative;
  overflow: hidden;
  background-color: var(--color-bg-gray);
  background-image:
    radial-gradient(circle at 0% 0%, rgba(246, 255, 233, 0.6) 0px, transparent 50%),
   radial-gradient(circle at 100% 40%, rgb(235, 255, 250) 0px, rgba(246, 255, 233, 0.6) 20%,transparent 40%),
   radial-gradient(circle at 80% 100%, rgb(211, 230, 255) 0px, rgba(238, 235, 255, 0.6) 40%, transparent 80%);
}
.p-keyvisual__content{
  display: flex;
  flex-direction: column-reverse;
  max-width: 1200px;
  margin-inline: auto;
}
.p-keyvisual__text{
  padding-block: var(--content-padding-y);
  padding-inline: var(--content-padding-x);
}
.p-keyvisual__title{
  font-size: 1.4rem;
  font-weight: bold;
  color: var(--color-accent);
}
.p-keyvisual__subtitle{
  font-size: clamp(24px, 7vw, 48px);
  font-weight: bold;
  letter-spacing: 0.1rem;
  color: var(--color-accent);
  margin-top: 16px;
}
.p-keyvisual__subtitle.js-load-slide p{
  overflow: hidden;
}
.p-keyvisual__subtitle.js-load-slide span{
  display: inline-block;
  transform: translateY(100%);
  transition: transform .6s ease-out;
}
.p-keyvisual__subtitle.js-load-slide p:nth-child(2) span{
  transition: transform .6s .6s ease-out;
}
.p-keyvisual__subtitle.js-load-slide.is-show span{
  transform: translateY(0);
}
.p-keyvisual__lead{
  font-size: 1.6rem;
  line-height: 2;
  margin-top: 32px;
}
.p-keyvisual .c-button-cta{
  margin-top: 32px;
  margin-inline: 0;
}
.p-keyvisual__image{
  aspect-ratio: 3 / 2;
  width: 90vw;
  height: fit-content;
  margin-left: 10vw;
  border-radius: 0 0 0 24px;
  overflow: hidden;
  box-shadow: 16px 16px 60px rgb(25 26 56 / 10%);
}
.p-keyvisual__image img{
  aspect-ratio: 3 / 2;
  object-fit: cover;
  width: 100%;
  height: 100%;
}
@media screen and (min-width: 768px) {
  .p-keyvisual{
    padding-block: 120px;
    padding-inline: var(--content-padding-x);
  }
  .p-keyvisual__content{
    gap: 2.4vw;
    flex-direction: row;
    align-items: center;
    margin-top: 36px;
  }
  .p-keyvisual__text{
    width: 64%;
    padding: 0;
  }
  .p-keyvisual__title{
    font-size: 1.6rem;
  }
  .p-keyvisual__subtitle{
    font-size: clamp(32px, 4vw, 56px);
  }
  .p-keyvisual__lead{
    font-size: 1.8rem;
  }
  .p-keyvisual__image{
    aspect-ratio: 1 / 1;
    width: 36%;
    margin-left: 0;
    border-radius: 24px;
  }
  .p-keyvisual__image img{
    aspect-ratio: 1 / 1;
  }
}

/* メニュー */
.p-menu{
  position: relative;
  z-index: 1;
  background-color: var(--color-bg-gray-deep);
}
.p-menu__list{
  display: flex;
  flex-wrap: wrap;
  border-bottom: 1px solid var(--color-border-gray);
}
.p-menu__item{
  width: 50%;
  height: 64px;
  background-color: #fff;
  border-top: 1px solid var(--color-border-gray);
}
.p-menu__item:nth-child(2n-1){
  border-right: 1px solid var(--color-border-gray);
}
.p-menu__item>a{
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  height: 100%;
  padding: 8px 2vw;
}
.p-menu__icon{
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 36px;
  height: 36px;
  background-color: #ebf0ff;
  border-radius: 50%;
  transition: background-color .4s ease-out;
}
.p-menu__icon svg{
  width: 20px;
  height: 20px;
  fill: var(--color-accent);
}
.p-menu__item .c-badge{
  font-size: 1rem;
  padding: 0.2em 0.6em;
}
.p-menu__text-area{
  flex-grow: 1;
}
.p-menu__name{
  position: relative;
  font-size: 1.4rem;
  font-weight: bold;
  line-height: 1.3;
  overflow: hidden;
  transition: color .4s ease-out;
  padding-right: 1em;
}
.p-menu__name::before,
.p-menu__name::after{
  position: absolute;
  right: 0;
  transform: translateY(-50%);
  content: '';
  display: inline-block;
  width: 1em;
  height: 1em;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='rgba(116,116,126,1)'%3E%3Cpath fill='none' d='M0 0h24v24H0z'%3E%3C/path%3E%3Cpath d='M13.0001 1.99974L11.0002 1.9996L11.0002 18.1715L7.05044 14.2218L5.63623 15.636L12.0002 22L18.3642 15.636L16.9499 14.2218L13.0002 18.1716L13.0001 1.99974Z'%3E%3C/path%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  transition: all .4s ease-out;
}
.p-menu__name::before{
  top: -1em;
}
.p-menu__name::after{
  top: 50%;
}
.p-menu__price{
  font-size: 1rem;
  color: var(--color-gray);
  line-height: 1.3;
}
@media (hover: hover) and (pointer: fine) {
  .p-menu__item:hover .p-menu__icon{
    background-color: #d6e0ff;
  }
  .p-menu__item:hover .p-menu__name{
    color: var(--color-accent);
  }
  .p-menu__item:hover .p-menu__name::before{
    top: 50%;
  }
  .p-menu__item:hover .p-menu__name::after{
    top: calc(100% + 1em);
  }
}
@media screen and (min-width: 768px) {
  .p-menu{
    background-color: #fff;
    padding: 64px var(--content-padding-x);
  }
  .p-menu__list{
    gap: 24px 2vw;
    justify-content: center;
    border-bottom: none;
  }
  .p-menu__item{
    position: relative;
    width: auto;
    height: auto;
    background-color: transparent;
    border: none!important;
  }
  .p-menu__item>a{
    display: block;
    padding: 0;
  }
  .p-menu__icon{
    width: 128px;
    height: 72px;
    border-radius: 12px;
  }
  .p-menu__icon svg{
    width: 32px;
    height: 32px;
  }
  .p-menu__item .c-badge{
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 1.2rem;
  }
  .p-menu__text-area{
    padding: 4px;
  }
  .p-menu__price{
    font-size: 1.2rem;
    margin-top: 2px;
  }
}

/* サービス紹介 */
.p-service{
  position: relative;
}
.p-service__menu{
  --menu-height: 72px;
  position: sticky;
  top: 0;
  left: 0;
  z-index: 10;
  height: 0;
  opacity: 0;
  visibility: hidden;
  transform: translateY(calc(var(--menu-height) * -1));
  transition: opacity .4s ease-out, transform .4s ease-out, visibility .4s ease-out;
  padding-inline: var(--content-padding-x);

}
.p-service__menu.is-visible{
  height: var(--menu-height);
  opacity: 1;
  visibility: visible;
  transform: translateY(16px);
}
.p-service__menu-list{
  display: flex;
  justify-content: center;
  background-color: rgba(255, 255, 255, 0.8);
  backdrop-filter: blur(12px);
  box-shadow: 0px 0px 16px rgb(25 26 56 / 10%);
  height: var(--menu-height);
  padding-inline: 16px;
  border-radius: 100vh;
  max-width: 1200px;
  margin-inline: auto;
}
.p-service__menu-item{
  font-size: 1.4rem;
  font-weight: bold;
  letter-spacing: 0.1rem;
  flex-shrink: 0;
  line-height: 24px;
  transition: color .4s ease-out;
}
.p-service__menu-item>a{
  display: block;
  padding: 24px 16px;
}
.p-service__container{
  --margin-top: 32px;
  position: relative;
  padding-inline: var(--content-padding-x);
  padding-block: var(--content-padding-y);
  overflow: hidden;
  box-shadow: 0px 0px 16px rgb(25 26 56 / 20%);
}
.p-service__container::after{
  position: absolute;
  inset: 0;
  z-index: -1;
  content: '';
  display: block;
  background-color: var(--color-bg-gray);
  mix-blend-mode: multiply;
}
.p-service__container + .p-service__container{
  margin-top: 16px;
}
.p-service__icon{
  text-align: center;
}
.p-service__icon svg{
  width: 40px;
  height: 40px;
  fill: var(--color-accent);
}
.p-service__title{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 4%;
  font-size: 2.4rem;
  font-weight: bold;
  text-align: center;
}
.p-service__title::before,
.p-service__title::after{
  content: '';
  display: inline-block;
  height: 3px;
  border-bottom: 3px dotted var(--color-accent);
  opacity: 0.5;
  flex-grow: 1;
}
.p-service__badge{
  text-align: center;
  margin-top: 16px;
}
.p-service__badge>*+*{
  margin-left: 8px;
}
.p-service__catch{
  color: #052ba4;
  font-size: 1.4rem;
  line-height: 1.7;
  font-weight: bold;
  text-align: center;
  margin-top: 16px;
}
.p-service__image{
  margin-top: var(--margin-top);
  aspect-ratio: 16 / 9;
}
.p-service__image img{
  aspect-ratio: 16 / 9;
  width: 100%;
  height: auto;
  object-fit: cover;
}
.p-service__box-group{
  margin-top: var(--margin-top);
}
.p-service__box{
  font-size: 1.6rem;
  background-color: #fff;
  border-radius: 16px;
  padding: min(6.4vw, 40px);
  box-shadow: 0px 0px 16px rgb(25 26 56 / 5%);
}
.p-service__box+.p-service__box{
  margin-top: 16px;
}
.p-service__box--outline .p-service__box-content p + p{
  margin-top: 16px;
}
.p-service__box--price{
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 12px;
}
.p-service__box--point .p-service__box-content li{
  position: relative;
  padding-left: 1.2em;
  line-height: 1.6;
  margin-top: 10px;
}
.p-service__box--point .p-service__box-content li:before{
  position: absolute;
  left: 0;
  top: 0.5em;
  content: '';
  display: inline-block;
  width: 1em;
  height: 1em;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='rgba(20,92,215,1)'%3E%3Cpath fill='none' d='M0 0h24v24H0z'%3E%3C/path%3E%3Cpath d='M9.9997 15.1709L19.1921 5.97852L20.6063 7.39273L9.9997 17.9993L3.63574 11.6354L5.04996 10.2212L9.9997 15.1709Z'%3E%3C/path%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}
.p-service__box--price .p-service__box-content{
  margin-top: 0;
}
.p-service__box-title{
  font-size: 1.2em;
  font-weight: bold;
}
.p-service__box-title::before{
  display: inline-block;
  content: '';
  width: 8px;
  height: 8px;
  background-color: var(--color-accent);
  border-radius: 50%;
  vertical-align: middle;
  margin-right: 8px;
}
.p-service__box-content{
  margin-top: 16px;
  line-height: 1.8;
}
.p-service__case-list{
  max-width: 480px;
  margin-inline: auto;
}
.p-service__case-item + .p-service__case-item{
  margin-top: 32px;
}
.p-service__case-item{
  display: block;
}
.p-service__case-image{
  background-color: var(--color-bg-gray);
}
.p-service__case-image img{
  width: 100%;
  height: auto;
}
#service-article .p-service__case-image{
  aspect-ratio: 8 / 5;
}
#service-live .p-service__case-image{
  aspect-ratio: 16 / 9;
}
.p-service__case-title{
  font-weight: bold;
  line-height: 1.6;
  padding-inline: 4px;
  margin-top: 8px;
  transition: color .4s ease-out;
}
.p-service__case-outline{
  font-size: 1.4rem;
  line-height: 1.6;
  padding-inline: 4px;
  margin-top: 6px;
}
.p-service__case-link{
  margin-top: 2px;
  padding-inline: 4px;
  text-align: right;
}
.p-service .c-button-cta{
  margin-top: var(--margin-top);
}
@media (hover: hover) and (pointer: fine) {
  .p-service__menu-item:hover{
    color: var(--color-accent);
  }
}
@media screen and (max-width: 767px) {
  .p-service__menu{
    display: none;
  }
}
@media screen and (min-width: 768px) {
  .p-service{
    padding: 32px;
    background-color: transparent;
  }
  .p-service__container{
    --margin-top: 40px;
    border-radius: 24px;
    box-shadow: none;
  }
  .p-service__container + .p-service__container{
    margin-top: 32px;
  }
  .p-service__title{
    font-size: 3.2rem;
  }
  .p-service__badge{
    margin-top: 24px;
  }
  .p-service__catch{
    font-size: 1.6rem;
    margin-top: 24px;
  }
  .p-service__box-group{
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(10, 1fr);
  }
  .p-service__box{
    padding: max(24px, 2vw);
    margin-top: 0;
  }
  .p-service__box+.p-service__box{
    margin-top: 0;
  }
  .p-service__box--outline{
    grid-column: 1 / 7;
    grid-row: 1 / 3;
  }
  .p-service__box--point{
    grid-column: 7 / 11;
    grid-row: 1 / 1;
  }
  .p-service__box--price{
    grid-column: 7 / 11;
    grid-row: 2 / 3;
  }
  .p-service__box--case{
    grid-column: 1 / 11;
    grid-row: 3 / 4;
  }
  .p-service__case-list{
    display: flex;
    gap: 3%;
    max-width: none;
  }
  .p-service__case-item{
    width: calc((100% - 6%)/3);
  }
  .p-service__case-item + .p-service__case-item{
    margin-top: 0;
  }
}

/* メディア紹介 */
.p-media{
  margin-top: var(--content-padding-y);
}
.p-media .l-content{
  margin-top: calc(var(--content-padding-y) * -1);
  padding-top: var(--content-padding-y);
}
.p-media__list{
  margin-top: 32px;
}
.p-media__item{
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  padding: min(3.2vw, 20px);
  background-color: #fff;
  border-radius: 16px;
  box-shadow: 0px 0px 16px rgb(25 26 56 / 5%);
}
.p-media__item + .p-media__item{
  margin-top: 16px;
}
.p-media__image-area{
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  aspect-ratio: 16 / 9;
  background-color: var(--color-bg-gray);
  background-image: radial-gradient(at 50% 50%, rgb(255, 255, 255) 0px, transparent 120%);
  border-radius: 12px;
}
.p-media__image-area img{
  width: 90%;
  height: auto;
}
.p-media__text-area{
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: min(3.2vw, 20px);
}
.p-media__title{
  font-size: 2rem;
  font-weight: bold;
}
.p-media__description{
  font-size: 1.6rem;
  line-height: 1.6;
  margin-top: 12px;
  flex-grow: 1;
}
.p-media__data{
  display: flex;
  align-items: end;
  flex-wrap: wrap;
  font-size: 1.6rem;
  line-height: 1.7;
  margin-top: 12px;
}
.p-media__data dt,
.p-media__data dd{
  padding-bottom: 4px;
  border-bottom: 1px solid var(--color-border-gray);
  margin-top: 8px;
}
.p-media__data dt{
  width: 72px;
}
.p-media__data dd{
  width: calc(100% - 72px);
  text-align: right;
}
.p-media__data dd .u-smaller{
  margin-left: 4px;
}
.p-media__link{
  margin-top: 12px;
  text-align: right;
}
@media screen and (min-width: 768px) {
  .p-media__list{
    display: flex;
    gap: 2.4vw;
  }
  .p-media__item{
    width: calc((100% - 4.8vw)/3);
    padding: max(12px, 1vw);
  }
  .p-media__item + .p-media__item{
    margin-top: 0;
  }
  .p-media__text-area{
    padding: max(12px, 1vw);
  }
}

/* お申込みの流れ */
.p-flow{
  margin-top: var(--content-padding-y);
}
.p-flow .l-content{
  margin-top: calc(var(--content-padding-y) * -1);
  padding-top: var(--content-padding-y);
}
.p-flow__list{
  margin-top: 32px;
}
.p-flow__item{
  position: relative;
  display: flex;
  padding: min(6.4vw, 40px);
  border-radius: 16px;
  overflow: hidden;
}
.p-flow__item::after{
  position: absolute;
  inset: 0;
  z-index: -1;
  content: '';
  display: block;
  background-color: var(--color-bg-gray);
  mix-blend-mode: multiply;
}
.p-flow__item + .p-flow__item{
  margin-top: 16px;
}
.p-flow__num-area{
  flex-shrink: 0;
  position: relative;
  font-weight: bold;
  color: var(--color-accent);
  text-align: center;
  margin-right: min(6.4vw, 40px);
}
.p-flow__num-area::before{
  content: '';
  width: 1px;
  height: calc(100% - 64px);
  background-color: var(--color-border-gray);
  position: absolute;
  bottom: 0;
  left: 50%;
}
.p-flow__step{
  font-size: 1.2rem;
}
.p-flow__num{
  font-size: 2.4rem;
}
.p-flow__title{
  font-size: 2rem;
  font-weight: bold;
}
.p-flow__description{
  font-size: 1.6rem;
  line-height: 1.8;
  margin-top: 12px;
}
@media screen and (min-width: 768px) {
  .p-flow__item{
    padding: 0;
  }
  .p-flow__item + .p-flow__item{
    margin-top: 24px;
  }
  .p-flow__num-area{
    width: 120px;
    padding: max(32px, 2vw) 0;
    margin-right: 0;
  }
  .p-flow__num-area::before{
    height: auto;
    top: 24px;
    right: 0;
    bottom: 24px;
    left: auto;
  }
  .p-flow__text-area{
    width: calc(100% - 120px);
    padding: max(32px, 2vw);
  }
  .p-flow__num{
    font-size: 3.2rem;
  }
}

/* お問い合わせ */
.p-contact{
  position: relative;
  padding-block: var(--content-padding-y);
  margin-top: var(--content-padding-y);
}
.p-contact::after {
  position: absolute;
  inset: 0;
  z-index: -1;
  content: '';
  display: block;
  background-color: rgb(242, 248, 255);
  mix-blend-mode: multiply;
}
.p-content__form-wrap{
  background-color: #fff;
  border-radius: 16px;
  box-shadow: 0px 0px 16px rgb(25 26 56 / 5%);
  padding: min(6.4vw, 40px);
  margin-top: 32px;
}
.p-content__form-label{
  font-size: 1.6rem;
  font-weight: bold;
  margin-top: 32px;
}
.p-content__form-label:first-child{
  margin-top: 0;
}
.p-content__form-content{
  font-size: 1.6rem;
  margin-top: 12px;
}
.p-content__form-content input[type="text"],
.p-content__form-content textarea{
  display: inline-block;
  width: 100%;
  background-color: var(--color-bg-gray);
  outline: 1px solid var(--color-border-gray);
  padding: 8px;
  border-radius: 4px;
}
.p-content__form-content input[type="text"]:focus,
.p-content__form-content textarea:focus{
  outline-color: var(--color-main);
}
.p-content__form-content input[type="text"]::placeholder,
.p-content__form-content textarea::placeholder{
  color: var(--color-gray);
}
.p-content__form-content textarea{
  height: calc(8lh + 16px);
}
.p-content__form-privacy-policy{
  margin-top: 32px;
  font-size: 1.4rem;
  text-align: center;
}
.p-content__form-privacy-policy>*+*{
  margin-top: 12px;
}
.p-content__form-privacy-policy a{
  color: var(--color-accent);
  text-decoration: underline;
}
.p-content__form-privacy-policy input[type="checkbox"]{
  position: relative;
  display: inline-block;
  width: 16px;
  height: 16px;
  border: 1px solid var(--color-main);
  border-radius: 2px;
  vertical-align: middle;
  margin-right: 8px;
  cursor: pointer;
}
.p-content__form-privacy-policy input[type="checkbox"]::before{
  position: absolute;
  top: 2px;
  left: 4px;
  content: '';
  display: inline-block;
  width: 6px;
  height: 8px;
  border-bottom: 2px solid #fff;
  border-right: 2px solid #fff;
  transform: rotate(45deg);
}
.p-content__form-privacy-policy label{
  cursor: pointer;
}
.p-content__form-privacy-policy input[type="checkbox"]:checked{
  background-color: var(--color-accent);
}
.p-content__form-submit{
  margin-top: 32px;
  text-align: center;
}
.p-content__form-submit button{
  display: inline-block;
  width: 200px;
  height: 56px;
  font-size: 1.6rem;
  font-weight: bold;
  color: #fff;
  background-color: var(--color-accent);
  border-radius: 100vh;
  border: 2px solid var(--color-accent);
  transition: color .4s ease-out, background-color .4s ease-out;
  cursor: pointer;
}
.is-required::after{
  content: '[必須]';
  color: #e91e63;
  font-size: 1.2rem;
  font-weight: bold;
  margin-left: 8px;
}
@media (any-hover: hover) {
  .p-content__form-submit button:hover{
    color: var(--color-accent);
    background-color: #fff;
  }
}
@media screen and (min-width: 768px) {
  .p-content__form-wrap{
    padding: max(56px, 2vw);
  }
}

/* ページトップへボタン */
.p-pagetop{
  position: fixed;
  right: 16px;
  bottom: 16px;
  z-index: 100;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 48px;
  height: 48px;
  background-color: #fff;
  border: 2px solid var(--color-main);
  border-radius: 50%;
  transition: opacity .4s ease-out;
}
.p-pagetop__arrow{
  position: relative;
  display: block;
  width: 50%;
  height: 50%;
  overflow: hidden;
}
.p-pagetop__arrow svg{
  position: absolute;
  left: 0;
  fill: var(--color-main);
  width: 100%;
  height: 100%;
  transition: transform .4s ease-out;
}
.p-pagetop__arrow svg:nth-child(1){
  bottom: 0;
}
.p-pagetop__arrow svg:nth-child(2){
  bottom: -100%;
}
@media (any-hover: hover) {
  .p-pagetop:hover svg{
    transform: translateY(-100%);
  }
}
@media screen and (min-width: 768px) {
  .p-pagetop{
    right: 32px;
    bottom: 32px;
  }
}

/* フッター */
.p-footer{
  color: #fff;
  background-color: var(--color-main);
  padding: 24px var(--content-padding-x);
}
.p-footer__company-group a{
  transition: opacity .4s ease-out;
}
.p-footer__logo img{
  width: 72px;
  height: auto;
}
.p-footer__company{
  font-size: 1.4rem;
  font-weight: bold;
  margin-top: 8px;
}
.p-footer__copyright{
  font-size: 1.2rem;
  margin-top: 8px;
  opacity: 0.5;
}
@media (any-hover: hover) {
  .p-footer__company-group a:hover{
    opacity: 0.5;
  }
}
@media screen and (min-width: 768px) {
  .p-footer{
    padding: 32px var(--content-padding-x);
  }
}

/*===================
  Component
===================*/
/* CTAボタン */
.c-button-cta{
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 400px;
  height: 56px;
  margin-inline: auto;
  font-size: 1.6rem;
  font-weight: bold;
  color: #fff;
  background-color: var(--color-main);
  border: 2px solid transparent;
  text-align: center;
  border-radius: 100vh;
  transition:
  color .4s ease-out,
  background-color .4s ease-out,
  border-color .4s ease-out;
}
@media screen and (min-width: 768px) {
  .c-button-cta{
    height: 72px;
    font-size: 1.8rem;
  }
}
@media (any-hover: hover) {
  .c-button-cta:hover{
    color: var(--color-main);
    background-color: #fff;
    border-color: var(--color-main);
  }
}

/* 注意書き */
.c-note{
  font-size: 1.4rem;
  line-height: 1.4;
  color: var(--color-gray);
}

/* 外部サイトへ */
.c-external-link{
  font-size: 1.4rem;
  color: var(--color-gray);
  transition: .4s ease-out;
}
.c-external-link::after{
  content: '';
  display: inline-block;
  width: 1em;
  height: 1em;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='rgba(116,116,126,1)'%3E%3Cpath fill='none' d='M0 0h24v24H0z'%3E%3C/path%3E%3Cpath d='M10 6V8H5V19H16V14H18V20C18 20.5523 17.5523 21 17 21H4C3.44772 21 3 20.5523 3 20V7C3 6.44772 3.44772 6 4 6H10ZM21 3V11H19L18.9999 6.413L11.2071 14.2071L9.79289 12.7929L17.5849 5H13V3H21Z'%3E%3C/path%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  vertical-align: middle;
  margin-left: 4px;
  transition: .4s ease-out;
}
@media (any-hover: hover) {
  .c-external-link:hover{
    color: var(--color-accent);
  }
  .c-external-link:hover::after{
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='rgba(20,92,215,1)'%3E%3Cpath fill='none' d='M0 0h24v24H0z'%3E%3C/path%3E%3Cpath d='M10 6V8H5V19H16V14H18V20C18 20.5523 17.5523 21 17 21H4C3.44772 21 3 20.5523 3 20V7C3 6.44772 3.44772 6 4 6H10ZM21 3V11H19L18.9999 6.413L11.2071 14.2071L9.79289 12.7929L17.5849 5H13V3H21Z'%3E%3C/path%3E%3C/svg%3E");
  }
}

/* バッヂ */
.c-badge{
  display: inline-block;
  font-size: 1.4rem;
  font-weight: bold;
  line-height: 1;
  padding: 0.4em 1em;
  border-radius: 100vh;
  border: 1px solid var(--color-main);
  background-color: #fff;
  width: max-content;
}

/* セクションのヘッド */
.c-section-title{
  color: #052ba4;
  font-size: 2.8rem;
  font-weight: bold;
  text-align: center;
  letter-spacing: 0.1rem;
}
.c-section-lead{
  font-size: 1.4rem;
  line-height: 1.7;
  text-align: center;
  margin-top: 24px;
}
@media screen and (min-width: 768px) {
  .c-section-title{
    font-size: 3.6rem;
  }
  .c-section-lead{
    font-size: 1.6rem;
  }
}

/*===================
  Utility
===================*/
em{
  font-weight: bold;
  text-decoration: underline;
  text-decoration-style: wavy;
}

strong{
  color: #e91e63;
  font-weight: bold;
}

.u-bigger{
  font-size: 1.4em;
}

.u-smaller{
  font-size: 0.8em;
}