@charset "utf-8";
/* CSS関数設定 */
:root {

	/* カラーテーマ --color-theme- */
	--theme-c-main: var(--c-service-2);

	/* テキストカラー --text-color- */
	--txt-c-base: var(--c-dark-700);
	--txt-c-white: var(--c-white);
	--txt-c-addon: var(--c-gray-300);
	--txt-c-emphasis: var(--c-red-500);

	/* フォントサイズ --font-size */
	--fz-9: clamp(8px, 0.8vw, 9px);
	--fz-10: clamp(8px, 0.8vw, 10px);
	--fz-11: clamp(10px, 1.1vw, 11px);
	--fz-12: clamp(10px, 1.1vw, 12px);
	--fz-13: clamp(11px, 1vw, 13px);
	--fz-14: clamp(12px, 1.2vw, 14px);
	--fz-15: clamp(13px, 1.4vw, 15px);
	--fz-16: clamp(14px, 1.5vw, 16px);
	--fz-18: clamp(15px, 1.6vw, 18px);
	--fz-19: clamp(16px, 1.8vw, 19px);
	--fz-20: clamp(16px, 1.8vw, 20px);
	--fz-21: clamp(17px, 1.9vw, 21px);
	--fz-22: clamp(18px, 2vw, 22px);
	--fz-23: clamp(19px, 2vw, 23px);
	--fz-24: clamp(19px, 2vw, 24px);
	--fz-25: clamp(20px, 2vw, 25px);
	--fz-26: clamp(21px, 2.1vw, 26px);
	--fz-28: clamp(22px, 2.5vw, 28px);
	--fz-29: clamp(23px, 2.5vw, 29px);
	--fz-30: clamp(25px, 3vw, 30px);
	--fz-35: clamp(25px, 3vw, 35px);
	--fz-38: clamp(26px, 3.1vw, 38px);
	--fz-40: clamp(30px, 3.5vw, 40px);
	--fz-43: clamp(30px, 4vw, 43px);
	--fz-50: clamp(30px, 4vw, 50px);
	--fz-60: clamp(40px, 5vw, 60px);
	--fz-70: clamp(50px, 6vw, 70px);
	--fz-14-const: 14px;
	--fz-15-const: 15px;

	--fz-xs: var(--fz-10); /* extra small */
	--fz-ss: var(--fz-12); /* super small */
	--fz-sm: var(--fz-14); /* small */
	--fz-md: var(--fz-16); /* medium */
	--fz-lg: var(--fz-25); /* large */
	--fz-xl: var(--fz-38); /* extra large */
	--fz-xxl: var(--fz-50); /* double extra large */

	/* ブロック間 --space */
	--spc-10: clamp( 5px, 1.1vw, 10px);
	--spc-15: clamp( 10px, 1.2vw, 15px);
	--spc-20: clamp( 15px, 1.7vw, 20px);
	--spc-25: clamp( 15px, 1.7vw, 25px);
	--spc-35: clamp( 20px, 2.5vw, 35px);
	--spc-30: clamp( 20px, 2.5vw, 30px);
	--spc-40: clamp( 30px, 3.5vw, 40px);
	--spc-50: clamp( 30px, 3.5vw, 50px);
	--spc-60: clamp( 40px, 4.5vw, 60px);
	--spc-65: clamp( 50px, 5.5vw, 65px);
	--spc-75: clamp( 60px, 6.5vw, 75px);
	--spc-80: clamp( 65px, 6.5vw, 80px);
	--spc-90: clamp( 70px, 7vw, 90px);
	--spc-100: clamp( 75px, 7vw, 100px);
	--spc-110: clamp( 80px, 7.5vw, 110px);
	--spc-120: clamp( 95px, 7.5vw, 120px);

	--spc-xs: var(--spc-10); /* extra small */
	--spc-ss: var(--spc-15); /* super small */
	--spc-sm: var(--spc-20); /* small */
	--spc-md: var(--spc-30); /* medium */
	--spc-lg: var(--spc-50); /* large */
	--spc-xl: var(--spc-80); /* extra large */
	--spc-xxl: var(--spc-100); /* double extra large */

	/* PCマックス幅 --pc-max-width */
	--pc-maw: var(--pc-maw-md);
	--pc-maw-ss: 800px;
	--pc-maw-sm: 1000px;
	--pc-maw-md: 1236px;
	--pc-maw-lg: 1440px;
}
@media screen and (min-width: 768px){
	:root{
		/* --inner-width */
		--inner-w: 95%;
		/* --section-space */
		--sec-spc: clamp(70px, 8vw, 100px);
	}
}
@media screen and (max-width: 767px){
	:root{
		--inner-w: 87.201%;
		--sec-spc: 50px;
	}
}

/* リセットCSS */
*{margin:0;padding:0;min-height: 0;min-width: 0;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
html {height:100%;scroll-behavior: smooth;box-sizing: border-box;}
ul li ,ol li{list-style:none;margin: 0;padding: 0;}
h1,h2,h3,h4,h5,h6{font-weight: var(--fw-base);font-size: 100%;margin: 0;}
p{margin: 0;}
strong{font-weight: inherit;}
a:focus, *:focus{ outline:none; }
article, header, footer, aside, figure, figcaption, nav, section,main{
display:block;
}


body{
	font-family: var(--ff-base);
	font-weight: var(--fw-base);
	font-feature-settings: "palt" 1;
	letter-spacing: var(--ls-default);
	width:100%;
	color: var(--txt-c-base);
	position:relative;
	z-index: 0;
	overflow-x: clip;
}
a{
	text-decoration: none;
	outline: none;
	word-wrap: break-word;
	color: var(--txt-c-base);
}
a img,a{
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all  0.5s;
}
img{
	height: auto;
	max-width: 100%;
	box-sizing: unset;
	display: block;
	width: 100%;
}
iframe{
	vertical-align: bottom;
}
button {
  background-color: transparent;
  border: none;
  cursor: pointer;
}



@media (hover: hover){
	a:hover{
		opacity: 0.7;
		text-decoration: none;
	}
	a:hover img{
		opacity:0.75 !important;
	}
}
html.no-smooth-scroll {
	scroll-behavior: auto;
}
.g-inner,
.g-inner--l,
.g-inner--m,
.g-inner--s,
.g-inner--ss{
	width: var(--inner-w);
	margin-inline: auto;
}
@media screen and (min-width: 1401px){
	.pctab {
		display: none;
	}
}

@media screen and (min-width: 768px){
	html{
		scroll-padding-top: 60px;
	}
	body{
		font-size: var(--fz-15-const);
		line-height: 1.7;
		-ms-text-size-adjust: 100%;
		-webkit-text-size-adjust: 100%;
	}
	a[href^="tel:"] {
		pointer-events: none;
	}

	.g-inner,
	.g-inner--m,
	.g-inner--pc{
		max-width: var(--pc-maw-md);
	}
}
@media screen and (max-width: 767px){
	html{
		scroll-padding-top: 0px;
	}
}


/* remを使うための設定 */
html {
  font-size: 100%;
}

@media (max-width: 375px) {
  html {
    font-size: 4.2666666667vw;
  }
}

@media screen and (min-width: 768px) {
  html {
    font-size: 0.9896969697vw;
  }
}

@media (min-width: 1650px) {
  html {
    font-size: 100%;
  }
}


/* ■■■■■■■■■■■■■■■■■■■■■■header■■■■■■■■■■■■■■■■■■■■■■ */

/* --------------------------------------------
* header sp
* -------------------------------------------- */
.hd-header__logoWrapper--sp {
  display: none;
}

@media screen and (max-width: 1024px) {
  .hd-header__logoWrapper--sp {
    display: flex;
  }
}


@media screen and (min-width: 1025px) {
  .hd-header__sp-navWrapper {
    display: none;
  }
}

@media screen and (max-width: 1024px) {
  .hd-header__sp-navWrapper {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex: 1;
    gap: var(--spc-30);
  }
}


@media screen and (max-width: 1024px) {
  .fat-nav__item:not(:first-child) {
    margin-top: var(--spc-20);
  }
}

@media screen and (max-width: 767px) {
  .fat-nav__item:not(:first-child) {
    margin-top: var(--spc-10);
  }
}

@media screen and (max-width: 1024px) {
  .fat-nav__item>a {
    display: block;
    width: 100%;
    border-bottom: 1px solid var(--c-gray-807);
    padding-bottom: var(--spc-20);
    padding-left: var(--spc-10);
    font-size: var(--min16);
  }
}

@media screen and (max-width: 767px) {
  .fat-nav__item>a {
    font-size: var(--min16);
    padding-bottom: var(--spc-10);
  }
}

@media screen and (max-width: 1024px) {
  .hd-header__sp-nav {
    background-color: var(--c-white);
    min-height: 100vh;
    padding-top: 10px;
    padding-left: var(--spc-30);
    padding-bottom: var(--spc-60);
  }
}

@media screen and (max-width: 767px) {
  .hd-header__sp-nav {
    padding-left: var(--spc-15);
  }
}

.hd-header__spNav-btnWrapper {
  margin-top: var(--spc-40);
  display: flex;
  justify-content: center;
  align-items: center;
}

@media screen and (max-width: 1024px) {
  .hd-header__spNav-btn {
    max-width: 350px;
    width: 100%;
    padding: var(--spc-10);
    display: block;
    background-color: var(--c-pink-btn);
    color: var(--c-white);
    text-align: center;
    font-size: var(--max25);
    letter-spacing: var(--ls-default);
    padding: var(--spc-10) var(--spc-10);
    border-radius: var(--bdrs-lg);
  }
}

@media screen and (max-width: 767px) {
  .hd-header__spNav-btn {
    font-size: var(--min16);
  }
}


/* --------------------------------------------
* header pc
* -------------------------------------------- */
.hd-header {
  width: 100%;
  position: fixed;
  z-index: 999;
  padding: var(--spc-15) 0;
  background-color: var(--c-white);
}

@media screen and (max-width: 1024px) {
  .hd-header {
    position: static;
    padding: var(--spc-15) 0;
  }
}

@media screen and (max-width: 767px) {
  .hd-header {
    padding: var(--spc-10) 0;
  }
}

.hd-header__inner {
  display: flex;
  justify-content: space-between;
  padding: 0 var(--spc-45) 0;
}

@media screen and (max-width: 1400px) {
  .hd-header__inner {
    align-items: center;
    justify-content: space-between;
    padding: 0 var(--spc-30);
    width: 100%;
  }
}
@media screen and (max-width: 1024px) {
  .hd-header__inner {
    padding-right: 70px;
    width: 100%;
  }
}

@media screen and (max-width: 767px) {
  .hd-header__inner {
    padding: 0 var(--spc-15);
  }
}

.hd-header__logoWrapper {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  position: relative;
  z-index: 500;
}

.hd-header__logoTxt {
  font-size: var(--max14);
  letter-spacing: 0.25em;
  color: var(--c-gray-807);
  white-space: nowrap;
}

@media screen and (max-width: 767px) {
  .hd-header__logoTxt {
    font-size: var(--min12);
  }
}

.hd-header__logo {
  flex-shrink: 0;
  max-width: max(calc(250 * var(--vw-xxl)), 230px);
  width: 100%;
  margin-top: var(--spc-10);
}
@media screen and (max-width: 767px) {
  .hd-header__logo {
    max-width: min(calc(200 * var(--vw-sp)), 250px);
    margin-top: var(--spc-5);
  }
}

.hd-header__logo>a {
  height: inherit;
  display: block;
}

.hd-header__logo>a>img {
  width: 100%;
}

.hd-header__pc-navWrapper {
  display: flex;
}


  .hd-header__pc-nav {
    display: flex;
    align-items: center;
    gap: var(--spc-50);
  }


@media screen and (max-width: 1024px) {
  .hd-header__pc-nav {
    display: none;
  }
}

.hd-header__pc-navList {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  width: calc(650 * var(--u));
  gap: var(--spc-20) 0;
  flex-shrink: 0;
}

.hd-header__pc-navItem {
  position: relative;
}

.hd-header__pc-navItem>a {
  font-size: var(--max17);
  color: var(--c-gray-807);
  letter-spacing: var(--ls-default);
  font-weight: var(--fw-medium);
  border-left: 1px solid var(--c-gray-807);
  padding-left: var(--spc-25);
  padding-right: var(--spc-25);
  line-height: 1;
}

.hd-header__pc-navItem:nth-child(4),
.hd-header__pc-navItem:last-child {
  border-right: 1px solid var(--c-gray-807);
}

@media (any-hover: hover) {
  .hd-header__pc-navItem:hover>a {
    color: var(--c-pink-btn);
  }
}

.hd-header__contact>.g-contact-btn {
  width: calc(180 * var(--u));
}

.hd-header__contact {
  position: relative;
}

@media screen and (max-width: 1024px) {
  .hd-header__contact {
    width: 100%;
  }
}

@media screen and (max-width: 767px) {
  .hd-header__contact.g-contact-btn {
    display: none;
  }
}


.hd-header__ctaBtn {
  font-size: var(--max22);
  max-width: max(calc(50 * var(--u)), 45px);
  width: 100%;
  max-height: max(calc(284 * var(--u)), 180px);
  height: 100%;
  background-color: var(--c-pink-btn);
  color: var(--c-white);
  writing-mode: vertical-rl;
  text-orientation: upright;
  position: fixed;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  z-index: 500;
  display: flex;
  align-items: center;
  justify-content: center;
  letter-spacing: var(--ls-xl);
}

@media screen and (max-width: 767px) {
  .hd-header__ctaBtn {
    top: unset;
    transform: unset;
    bottom: 0;
    right: 0;
    max-width: unset;
    width: 100%;
    height: calc(50 * var(--u));
    font-size: var(--min16);
    writing-mode: unset;
    line-height: 1;
  }
}

/* ■■■■■■■■■■■■■■■■■■■■■■footer■■■■■■■■■■■■■■■■■■■■■■ */

/* --------------------------------------------
* footer
* -------------------------------------------- */
.footer {
  background-color: var(--c-yellow-bg);
  padding: var(--spc-30) 0;
}

@media screen and (max-width: 1024px) {
  .footer {
    padding: var(--spc-80) 0 var(--spc-30);
  }
}

@media screen and (max-width: 767px) {
  .footer {
    padding: var(--spc-60) 0;
  }
}

.footer__inner {
  padding: 0 var(--spc-120);
}

@media screen and (max-width: 1400px) {
  .footer__inner {
    padding: 0 var(--spc-40);
  }
}

@media screen and (max-width: 767px) {
  .footer__inner {
    padding: 0 var(--spc-20);
  }
}

.footer__container {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

@media screen and (max-width: 1024px) {
  .footer__container {
    flex-direction: column;
    gap: var(--spc-20);
  }
}

.footer__wrapper {
  display: flex;
  gap: var(--spc-125);
}

@media screen and (max-width: 1400px) {
  .footer__wrapper {
    gap: var(--spc-100);
  }
}

@media screen and (max-width: 1024px) {
  .footer__wrapper {
    display: contents;
  }
}


.footer__logoWrapper {
  max-width: max(calc(365 * var(--u)), 260px);
  width: 100%;
  position: relative;
}

@media screen and (max-width: 1024px) {
  .footer__logoWrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: unset;
  }
}

.footer__logoWrapper::after {
  content: "";
  display: block;
  width: 1px;
  height: calc(191 * var(--u));
  background-color: var(--c-black);
  position: absolute;
  top: 0;
  right: -60px;
  z-index: 1;
}

@media screen and (max-width: 1400px) {
  .footer__logoWrapper::after {
    right: -30px;
  }
}

@media screen and (max-width: 1024px) {
  .footer__logoWrapper::after {
    display: none;
  }
}

.footer__logoTxt {
  font-size: var(--fz-18);
  letter-spacing: 0.25em;
  white-space: nowrap;
}

@media screen and (max-width: 1400px) {
  .footer__logoTxt {
    font-size: var(--max18);
  }
}

@media screen and (max-width: 767px) {
  .footer__logoTxt {
    font-size: var(--min14);
  }
}


.footer__logo {
  width: calc(306 * var(--u));
  margin-top: var(--spc-20);
  display: block;
}

@media screen and (max-width: 1024px) {
  .footer__logo {
    width: 100%;
    display: flex;
    justify-content: center;
  }
}

@media screen and (max-width: 767px) {
  .footer__logo {
    max-width: 300px;
    width: calc(200 * var(--vw-sp));
    display: flex;
    justify-content: center;
    margin-top: var(--spc-10);
  }
}

.footer__navWrapper {
  max-width: calc(542 * var(--u));
  width: 100%;
  position: relative;
  margin-top: var(--spc-20);
  margin-left: calc(113 * var(--u));
}

@media screen and (max-width: 1400px) {
  .footer__navWrapper {
    margin-left: 0;
  }
}

@media screen and (max-width: 1024px) {
  .footer__navWrapper {
    display: flex;
    flex-direction: column;
    width: fit-content;
    min-width: unset;
    align-items: center;
  }
}

@media screen and (max-width: 767px) {
  .footer__navWrapper {
    margin-top: var(--spc-20);
  }
}

.footer__navWrapper:first-child::after {
  content: "";
  display: block;
  width: 1px;
  height: 100%;
  background-color: var(--c-black);
  position: absolute;
  top: 0;
  right: calc(-30 * var(--u));
  z-index: 1;
}

@media screen and (max-width: 1024px) {
  .footer__navWrapper:first-child::after {
    display: none;
  }
}

.footer__navTxt {
  font-size: var(--rem19);
  letter-spacing: var(--ls-xl);
}

@media screen and (max-width: 1400px) {
  .footer__navTxt {
    font-size: var(--max18);
    white-space: nowrap;
  }
}

@media screen and (max-width: 767px) {
  .footer__navTxt {
    font-size: var(--min14);
    letter-spacing: var(--ls-default);
  }
}

.footer__snsList {
  display: flex;
  align-items: center;
  gap: var(--spc-35);
  margin-top: var(--spc-15);
}

@media screen and (max-width: 1024px) {
  .footer__snsList {
    justify-content: center;
  }
}

.footer__snsItem>a {
  width: 33px;
  display: flex;
  align-items: center;
}

.footer__nav {
  width: 100%;
  min-width: 550px;
}

@media screen and (max-width: 1024px) {
  .footer__nav {
    min-width: 420px;
  }
}

@media screen and (max-width: 767px) {
  .footer__nav {
    min-width: unset;
  }
}

.footer__navList {
  display: flex;
  gap: var(--spc-30);
  margin-top: var(--spc-25);
  width: fit-content;
}

@media screen and (max-width: 1024px) {
  .footer__navList {
    justify-content: center;
    align-items: center;
  }
}

@media screen and (max-width: 767px) {
  .footer__navList {
    gap: var(--spc-15);
    flex-direction: row;
  }
}

.footer__navItem>a {
  font-size: var(--max16);
  letter-spacing: var(--ls-xl);
  text-decoration: underline;
  text-underline-offset: 3px;
  white-space: nowrap;
}

@media screen and (max-width: 767px) {
  .footer__navItem>a {
    font-size: var(--min12);
  }
}

@media (any-hover: hover) {
  .footer__navItem > a:hover {
    color: var(--c-blue-7cc);
    opacity: 1;
    text-decoration-color: var(--c-black);
  }
}

@media screen and (max-width: 1024px) {
  .footer__btnWrapper {
    width: 100%;
    display: flex;
    justify-content: center;
    flex: 1;
    margin-top: var(--spc-30);
  }
}

.footer__btn {
  width: calc(264 * var(--u));
  font-size: var(--max21);
  letter-spacing: var(--ls-xl);
  padding: var(--spc-35) var(--spc-15);
  border-radius: var(--rem33);
  display: block;
  background-color: var(--c-pink-btn);
  color: var(--c-white);
  text-align: center;
  white-space: nowrap;
  min-width: 200px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--spc-10);
}

@media screen and (max-width: 1024px) {
  .footer__btn {
    padding: var(--spc-20) var(--spc-15);
    border-radius: var(--bdrs-xl);
    width: 100%;
    max-width: 300px;
  }
}

@media screen and (max-width: 767px) {
  .footer__btn {
    padding: var(--spc-15) var(--spc-10);
    font-size: var(--min16);
    max-width: 300px;
    width: 70%;
  }
}

.footer__btn>span {
  display: flex;
  align-items: center;
  transition: .3s ease-in-out;
}

@media (any-hover: hover) {
  .footer__btn:hover >span {
    transform: translateX(5px);
  }
}

.footer__btn i {
  font-size: var(--max28);
}

@media screen and (max-width: 767px) {
  .footer__btn i {
    font-size: var(--min18);
  }
}

.footer__copyright {
  text-align: right;
  margin-top: var(--spc-15);
  padding-right: var(--spc-45);
}

@media screen and (max-width: 1024px) {
  .footer__copyright {
    text-align: center;
    margin-top: var(--spc-40);
  }
}

.footer__copyrightTxt {
  font-size: var(--fz-16);
  letter-spacing: 0.01em;
}

@media screen and (max-width: 767px) {
  .footer__copyrightTxt {
    font-size: var(--rem12);
  }
}


/* ■■■■■■■■■■■■■■■■■■■■■■全ページ共通部分■■■■■■■■■■■■■■■■■■■■■■ */

/* --------------------------------------------
* common
* -------------------------------------------- */
.sp {
  display: none;
}

@media screen and (max-width: 767px) {
  .sp {
    display: block;
  }
}


.g-contact-btn {
  display: block;
  background-color: var(--c-pink-ff5);
  color: var(--c-white);
  text-align: center;
  font-size: var(--max17);
  letter-spacing: var(--ls-default);
  padding: var(--spc-15) var(--spc-10);
  border-radius: var(--bdrs-lg);
}

.g-contact-btn> a{
  color: var(--c-white);
}

@media screen and (max-width: 1024px) {
  .g-contact-btn {
    min-width: unset;
    max-width: 120px;
    padding: var(--spc-10);
  }
}

@media (any-hover: hover) {
  .g-contact-btn:hover .g-arrow {
    right: 6%;
  }
}

/* --------------------------------------------
* g-arrow >
* -------------------------------------------- */
.g-arrow {
  position: absolute;
  display: inline-block;
  width: calc(13.6 * var(--u));
  height: calc(17.9 * var(--u));
	vertical-align: middle;
	top: 50%;
	right: 8%;
	transform: translateY(-50%);
  transition: .3s ease-in-out;
}

.g-arrow::after {
  content: "";
  position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	width: 7px;
	height: 7px;
	border-top: 2px solid var(--c-white);
	border-right: 2px solid var(--c-white);
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
  transition: .3s ease-in-out;
}

/* --------------------------------------------
* g-more-btn
* -------------------------------------------- */
.g-more-btn {
  display: block;
  text-align: center;
  color: var(--c-white);
  border-radius: var(--bdrs-50);
  padding: var(--spc-17) var(--spc-20);
  font-size: var(--max20);
  letter-spacing: var(--ls-default);
  line-height: 1;
  width: max(calc(330 * var(--vw-xxl)), 240px);
  position: relative;
  transition: .3s ease-in-out;
}

@media screen and (max-width: 767px) {
  .g-more-btn {
    max-width: calc(400 * var(--u));
    width: calc(280 * var(--vw-sp));
    font-size: var(--fz-16);
    padding: var(--spc-15) var(--spc-15);
  }
}

@media (any-hover: hover) {
  .g-more-btn:hover .g-arrow {
    right: 6%;
  }
}

/* --------------------------------------------
* g-cta-btn
* -------------------------------------------- */
.g-cta-btn {
  background-color: var(--c-pink-ff5) ;
  max-width: calc(511 * var(--u));
  width: 100%;
  padding: var(--rem28) var(--spc-20);
  border-radius: var(--bdrs-xl);
  color: var(--c-white);
  font-size: var(--max30);
  line-height: 1;
  letter-spacing: var(--ls-default);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--spc-10);
}
@media screen and (max-width: 1024px) {
  .g-cta-btn {
    min-width: 300px;
  }
}
@media screen and (max-width: 767px) {
  .g-cta-btn {
    font-size: var(--min18);
    padding: var(--spc-20) var(--spc-15);
    max-width: 400px;
  }
}
/* --------------------------------------------
* g-ttl
* -------------------------------------------- */
.g-ttl {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}

.g-ttl__sub {
  width: 100%;
}

.g-ttl__main {
  font-size: var(--fz-38);
  letter-spacing: var(--ls-l);
  font-weight: var(--fw-medium);
  position: relative;
  z-index: 2;
  line-height: 1;
}

@media screen and (max-width: 767px) {
  .g-ttl__main {
    font-size: var(--min22);
  }
}

.g-ttl__main::after {
  content: "";
  display: inline-block;
  width: 100%;
  height: calc(9* var(--u));
  background-color: var(--c-yellow-ffe);
  position: absolute;
  bottom: 0;
  left: calc(-6 * var(--u));
  z-index: -1;
  padding: 0 calc(6 * var(--u));
}

.g-ttl__bottomTxt {
  text-align: center;
  font-size: var(--max23);
  letter-spacing: var(--ls-xl);
  position: relative;
}

@media screen and (max-width: 767px) {
  .g-ttl__bottomTxt {
    font-size: var(--min14);
  }
}

.g-ttl__bottomTxt::before {
  content: "";
  display: inline-block;
  width: 1px;
  background-color: var(--c-black);
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1;
}

@media screen and (max-width: 767px) {
  .g-ttl__bottomTxt::before {
    height: calc(35 * var(--u));
    top: calc(-35 * var(--u));
  }
}

/* --------------------------------------------
* g-s-inner
* -------------------------------------------- */
.g-s-inner {
	margin-inline: auto;
	padding: 0 var(--spc-30);
}