@charset "UTF-8";
@import "reset.css";
/* CSS Document */

:root {
	--main-color: #12A863;
	--bg-color: #F2F7E4;
	--cta-color: #EE6E35;

	--sub-bg-soft: #F3F9E2;
	--sub-grad-start: #F9FCE8;
	--sub-grad-end: #D9EDC9;
	--sub-green-light: #B0D365;
	--sub-orange-strong: #EF540F;
	--sub-cyan: #00A4B2;
	--sub-navy: #003562;
	--white: #FFFFFF;
	--black: #000000;
	--sub-green-deep: #005D56;

	--border-color: #cccccc;
	--border-color-light: #eeeeee;
	--overlay-bg: #252525;
	--marker-yellow: #FFEA91;

	--gradient-angle: 135deg;
	--gradient-sub-soft: linear-gradient(var(--gradient-angle), var(--sub-grad-start), var(--sub-grad-end));

	--main-font: "fot-tsukuardgothic-std", sans-serif;
	--en-font: "gill-sans-nova", sans-serif;
	--num-font: "barlow", sans-serif;

}

/* #region 汎用ブロック - common */

body {
	font-family: var(--main-font);
	font-weight: bold;
	margin: 0;
	padding: 0;
	position: relative;
}

p,
span,
li,
dt,
dd {
	line-height: 2;
	font-size: 1rem;
}

a {
	text-decoration: none;
	word-break: break-all;
	transition: all 0.3s ease-out;
}

picture,
img {
	max-width: 100%
}

.obc {
	width: 100%;
	height: 100%;
	object-fit: cover;
	vertical-align: bottom
}

.wrap {
	width: 90%;
	max-width: 1400px;
	margin: 0 auto
}

.wrap-l {
	width: 95%;
	max-width: 1600px;
	margin: 0 auto
}

.flex {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between
}

@media screen and (max-width:667px) {
	.sp-none {
		display: none !important
	}
}

@media screen and (min-width:668px) {
	.sp-size {
		display: none !important
	}
}

@media (min-width:1000px) {

	p,
	span,
	li,
	dt,
	dd {
		font-size: 1rem;
		/* 16px */
	}
}


/* #endregion */

/* #region 汎用ブロック - テーブル */

.table_wrap dl {
	border-bottom: solid 1px var(--border-color);
}

.table_wrap dt,
.table_wrap dd {
	width: 100%;
	margin: 0;
	padding: .5em
}

.table_wrap dt {
	font-weight: bold;
}

.table_wrap dd a {
	color: var(--black)
}


@media screen and (min-width:768px) {
	.table_wrap dt {
		width: 20%;
		text-align: center;
	}

	.table_wrap dd {
		width: 75%
	}

}


/* #endregion */

/* #region 汎用ブロック - ボタン */
.btn_wrap {
	margin: 2em auto;
}

.btn1 {
	display: inline-block;
	width: 100%;
	max-width: 300px;
	text-align: center;
	text-decoration: none;
	padding: 1em;
	outline: none;
	color: var(--white);
	background-color: var(--main-color);
	position: relative;
	transition: color .5s ease;
	letter-spacing: .5px;
	border-radius: 8px;
	overflow: hidden;
}

.btn1:hover::before {
	transform: scaleX(1);
	transform-origin: left;
}

.btn1::before {
	position: absolute;
	top: 0;
	left: 0;
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.15);
	transform: scaleX(0);
	transform-origin: right;
	transition: all .5s ease;
	transition-property: transform;
	border-radius: 8px;
}

.btn1 span {
	position: relative;
	color: var(--white);
}

.btn_next:after {
	content: '';
	display: inline-block;
	width: 15px;
	height: 15px;
	background: url("../img/common/btn_ic.png")no-repeat center / contain;
	color: var(--white);
	line-height: 15px;
	text-align: center;
	border-radius: 50%;
	position: absolute;
	top: 50%;
	transform: translate(0, -50%);
	transition: .5s;
	right: 8%;
}

.btn_next:hover:after {
	right: 5%
}



/* #endregion */

/* #region 汎用ブロック - section-heading */

.section-heading {
    position: relative;
    display: flex;
    align-items: center;
    gap: 15px;
    font-family: 'Inter', var(--main-font);
    font-size: 1.8rem;
    line-height: 1.2;
    padding-left: 30px;
}

.section-heading::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 13px;
    height: 50px;
    background: var(--main-color);
    border-radius: 0 5px 5px 0;
}

@container (min-width: 1400px) {
    .section-heading {
        font-size: 2.9rem; /* Figma: 47px */
        line-height: 1.2; /* Figma: 57px */
    }

    .section-heading::before {
        height: 67px; /* Figma: 67px */
    }
}

/* #endregion */

/* #region 汎用ブロック - 背景 */

.bg {
	background-color: var(--bg-color);
}


/* #endregion */

/* #region 汎用ブロック - 画像表示位置 */

.obj-pos-top {
	object-position: 50% 20%;
}

.obj-pos-bottom {
	object-position: 50% 80%;
}

/* #endregion */

/* #region 専用ブロック - header */

header {
	width: 100%;
	height: 60px;
	z-index: 1000;
	transition: top 0.3s;
	top: 0;
	left: 0;
	margin: 0 auto;
	background: var(--white);
	position: fixed;
	display: flex;
	align-items: center;
	justify-content: center;
	border-bottom: solid 1px var(--border-color-light);
	padding: 0;
}

.header_logo {
	flex: 0 0 auto;
	position: relative;
}

/* ロゴ出し分け: モバイルではlogo-sp、PCではlogo-pc */
.header_logo .logo-pc {
	display: none;
}

.header_logo .logo-sp {
	display: block;
}

.header_logo a {
	display: block;
	width: 100%;
	height: 100%;
}

.header_logo img {
	width: 100%;
	height: auto;
	display: block;
	object-fit: contain;
}

.global-nav__item>a {
	color: var(--black);
	letter-spacing: .5px;
	font-weight: bold;
	text-decoration: none;
}

/*　協賛・問い合わせボタン */
.nav_btn .header__contact-btn {
	text-align: center;
}

.nav_btn .header__contact-btn i,
.nav_btn .header__contact-btn i:hover,
.nav_btn .header__contact-btn span {
	color: var(--white);
}

.nav_btn .header__contact-btn i {
	margin-right: .5em;
}

#contact_btn a.header__contact-btn {
	display: inline-block;
	width: 100%;
	max-width: 300px;
	text-align: center;
	text-decoration: none;
	padding: 1em;
	outline: none;
	color: var(--white);
	background-color: var(--main-color);
	position: relative;
	transition: color .5s ease;
	letter-spacing: .5px;
	border-radius: 8px;
	overflow: hidden;
}

#contact_btn a.header__contact-btn:hover::before {
	transform: scaleX(1);
	transform-origin: left;
}

#contact_btn a.header__contact-btn::before {
	position: absolute;
	top: 0;
	left: 0;
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.15);
	transform: scaleX(0);
	transform-origin: right;
	transition: all .5s ease;
	transition-property: transform;
	border-radius: 8px;
}

#contact_btn a.header__contact-btn span {
	position: relative;
	color: var(--white);
}

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

  sp nav (~999px)

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

@media (max-width:999px) {
	.header_logo {
		position: absolute;
		top: 50%;
		left: 3%;
		transform: translateY(-50%);
		width: 160px;
	}

	.header_logo .logo-pc {
		display: none;
	}

	.global-nav {
		position: fixed;
		right: -500px;
		top: 0;
		width: 90%;
		max-width: 500px;
		height: 100vh;
		background-color: var(--white);
		transition: all .6s;
		z-index: 2000;
		overflow-y: auto;
	}

	.global-nav__list {
		padding: 7em 1em 2em;
		list-style: none;
		overflow-y: auto;
	}

	.global-nav__item {
		width: 100%;
		padding: 1em;
		border-bottom: 1px solid var(--border-color);
		font-size: 1em
	}

	.global-nav__item>a {
		line-height: 1.3;
	}

	/* ハンバーガーメニュー */
	.hamburger {
		cursor: pointer;
		display: flex;
		flex-direction: column;
		justify-content: flex-start;
		align-items: center;
		position: absolute;
		top: 50%;
		right: 0;
		width: 55px;
		height: 100%;
		transform: translate(0, -50%);
	}

	.hamburger__line {
		position: absolute;
		left: 50%;
		transform: translate(-50%, 0);
		width: 25px;
		height: 1px;
		background-color: var(--black);
		transition: all .6s;
	}

	.hamburger__line--1 {
		top: calc(50% - 10px);
	}

	.hamburger__line--2 {
		top: 50%;
	}

	.hamburger__line--3 {
		top: calc(50% + 10px);
	}

	.black-bg {
		position: fixed;
		left: 0;
		top: 0;
		width: 100vw;
		height: 100vh;
		z-index: 100;
		background-color: var(--overlay-bg);
		opacity: 0;
		visibility: hidden;
		transition: all .6s;
		cursor: pointer;
	}

	/* nav-open */
	.nav-open .global-nav {
		right: 0;
	}

	.nav-open .black-bg {
		opacity: .7;
		visibility: visible;
	}

	.nav-open .hamburger {
		background: none;
		box-shadow: none;
		z-index: 9999;
		right: .5em;
	}

	.nav-open .hamburger__line {
		top: 50%;
		background: var(--black);
	}

	.nav-open .hamburger__line--1 {
		transform: rotate(-45deg);
	}

	.nav-open .hamburger__line--2 {
		width: 0;
		left: 50%;
	}

	.nav-open .hamburger__line--3 {
		transform: rotate(45deg);
	}

	/* nav_btn */

	.nav_btn {
		border-bottom: none;
		padding: 1em 1em 0 !important;
		display: flex;
	}

	.nav_btn a {
		margin: 0 auto;
	}
}

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

  pc nav (1000px~)

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

@media (min-width:1000px) {
	header {
		height: 115px;
	}

	header>.wrap-l {
		display: flex;
		align-items: center;
		justify-content: space-between;
		height: 100%;
	}

	.header_logo .logo-sp {
		display: none;
	}

	.header_logo .logo-pc {
		display: block;
	}

	.header_logo {
		width: 220px;
		height: auto;
		flex: 0 0 auto;
		margin-right: 3rem;
	}

	.global-nav {
		display: flex;
		align-items: center;
		justify-content: flex-end;
		width: auto;
		margin-left: auto;
		flex: 0 0 auto;
	}

	.global-nav__list {
		display: flex;
		align-items: center;
		justify-content: flex-end;
		flex-wrap: nowrap;
		gap: 2rem;
		width: auto;
	}

	.global-nav__item {
		margin-right: 0;
		font-size: 1.2rem;
	}

	.global-nav__item:not(.nav_btn)>a {
		display: inline-block;
		text-align: center;
		position: relative;
		padding: 0 0.25rem;
		line-height: 1.4;
		font-size: 1.2rem;
	}

	#contact_btn {
		margin-left: 0.75rem;
		margin-right: 0;
	}

	#contact_btn a.header__contact-btn {
		padding: 0.6rem 1.3rem;
		background: var(--cta-color);
	}

	#contact_btn a.header__contact-btn span {
		font-size: 1.2rem;
	}

	#contact_btn a.header__contact-btn::before {
		background: #ffae79;
	}

	.hamburger,
	.black-bg,
	.spnav {
		display: none
	}

	.nav_btn .header__contact-btn {
		display: flex;
		align-items: center;
	}
}


.u-recaptcha-policy{
	max-width: 1200px;
	margin: 2em auto;
	font-weight: 500;
	line-height: 1.6
}

.u-recaptcha-policy a{
	text-decoration: underline
}

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

  pc nav 中間幅 (1000px ~ 1400px)

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

@media (min-width:1000px) and (max-width:1400px) {
	.header_logo {
		width: 140px;
		margin-right: 1rem;
	}

	.global-nav__list {
		gap: 0.8rem;
	}

	.global-nav__item {
		font-size: 0.9rem;
	}

	.global-nav__item:not(.nav_btn)>a {
		font-size: 0.9rem;
		padding: 0 0.1rem;
	}

	#contact_btn a.header__contact-btn {
		padding: 0.5rem 1rem;
	}

	#contact_btn a.header__contact-btn span {
		font-size: 0.9rem;
	}
}


/* #endregion */

/* #region 専用ブロック - アコーディオン */
.acc_click {
	position: relative;
	cursor: pointer;
	transition: all .5s ease;
}

/*アコーディオンで現れるエリア*/
.box {
	display: none;
	/*はじめは非表示*/

}

.box a {
	text-decoration: none;
	padding: .3em 0;
	display: block;
	font-size: 0.9rem;
	/* 15px */
	color: var(--black)
}

@media (max-width:999px) {
	.acc_click {
		display: block;
		width: 100%;
	}

	/*アイコンの＋×*/
	.acc_click::before,
	.acc_click::after {
		position: absolute;
		content: '';
		width: 15px;
		height: 1px;
		background-color: var(--black);
	}

	.acc_click::before {
		top: 48%;
		right: 15px;
		transform: rotate(0deg);
	}

	.acc_click::after {
		top: 48%;
		right: 15px;
		transform: rotate(90deg);
	}

	/*　closeというクラスがついたら形状変化　*/
	.acc_click.close::before {
		transform: rotate(45deg);
	}

	.acc_click.close::after {
		transform: rotate(-45deg);
	}

	.box {
		padding: .5em .5em 0
	}

	.box li {
		margin: .3em 0
	}

	.box li a:before {
		content: '-';
		color: var(--main-color);
		display: inline-block;
		margin-right: .5em
	}
}

@media (min-width:1000px) {
	.dropdown {
		position: relative
	}

	.box {
		position: absolute;
		padding: 1em 1.2em;
		background: var(--bg-color);
		width: 200px;
		top: 54px;
		left: 50%;
		transform: translate(-50%, 0);
	}

	.box li {
		position: relative;
		display: block;
		width: 100%;
	}

	.box li a {
		color: #000;
		width: 100%
	}

	.box li:after {
		content: "";
		position: absolute;
		left: 0;
		bottom: 0;
		width: 0%;
		height: 1px;
		background-color: var(--main-color);
		transition: width 0.3s ease;
	}

	.box li:hover:after {
		width: 100%;
	}

	.box li:hover a {
		transform: translateX(5px);
		opacity: .9
	}
}

/* #endregion */

/* #region 専用ブロック - footer */

.footer {
	background-color: var(--white);
}

.footer__contact {
	position: relative;
	padding: 4rem 0 5rem;
	background: linear-gradient(180deg, var(--sub-grad-end), var(--sub-grad-start));
}

.footer__contact .wrap {
	position: relative;
}

.footer__contact-body {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	gap: 2.5rem;
}

.footer__contact-info {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

.footer__contact-heading {
	font-family: var(--main-font);
	font-size: 1.5rem;
	line-height: 1.5;
	color: var(--black);
}

.footer__contact-text {
	font-size: 0.9rem;
	line-height: 2.5;
	color: var(--black);
}

.footer__contact-cta {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 1.5rem;
}

.footer__contact-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: var(--cta-color);
	border-radius: 10px;
	padding: 1em 2em;
	text-decoration: none;
	transition: opacity 0.3s;
}

.footer__contact-btn>span {
	display: flex;
	align-items: center;
	gap: 0.5em;
	font-size: 1rem;
	color: var(--white);
}

.footer__contact-btn .icon-mail_ic {
	font-size: inherit;
}

.footer__contact-btn:hover {
	opacity: 0.8;
}

.footer__body {
	padding: 4rem 0 3rem;
}

.footer__body-inner {
	display: flex;
	flex-direction: column;
	gap: 3rem;
}

/* モバイル：中央寄せ */
.footer__company {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 1.2rem;
	text-align: center;
	font-style: normal;
}

.footer__logo {
	width: 220px;
	height: auto;
	aspect-ratio: 294 / 32;
	object-fit: contain;
}

.footer__address {

	display: flex;
	flex-direction: column;
	gap: 0.3rem;
	font-size: 0.9rem;
	line-height: 1.5;
	color: var(--black);
	margin-top: 1rem;
	text-align: center;
	font-style: normal;
}

.footer__address p {
	font-size: 0.9rem;
	line-height: 1.2;
	color: var(--black);
}

.footer__license {
	font-size: 0.9rem;
	line-height: 1.2;
	color: var(--black);
}

/* モバイル：リスト全体を中央に、項目は左揃え */
.footer__nav {
	display: flex;
	justify-content: center;
}

.footer__nav-col {
	display: flex;
	flex-direction: column;
	gap: 1.2rem;
	list-style: none;
}

@media (max-width:800px){
	.footer__nav-col{
		display: none
	}
}

.footer__nav-item a {
	display: block;
	font-size: 1rem;
	letter-spacing: 0.05em;
	line-height: 1;
	color: var(--black);
	text-decoration: none;
}

.footer__nav-item a:hover {
	opacity: 0.7;
}

.footer__nav-item--head {
	padding-bottom: 0.8rem;

}

.footer__nav-item--child {
	position: relative;
	padding-left: 1.5em;
	margin-top: 1.2rem;
}

.footer__nav-item--child::before {
	content: '';
	position: absolute;
	left: 0;
	top: 50%;
	width: 0.8em;
	border-top: 2px solid var(--sub-green-light);
	transform: translateY(-50%);
}

.footer__copyright {
	text-align: center;
	font-size: 0.8rem;
	letter-spacing: 0.05em;
	line-height: 1;
	color: var(--black);
	padding: 1.5rem 0;
}

/* タブレット */
@media (min-width: 768px) {
	.footer__body {
		padding: 7rem 0 4rem;
	}

	.footer__company {
		align-items: flex-start;
		text-align: left;
	}

	.footer__logo {
		width: 260px;
	}

	.footer__address {
		text-align: left;
	}

	.footer__nav {
		display: block;
	}

	.footer__nav-col {
		display: block;
		column-count: 2;
		column-gap: 3rem;
	}

	.footer__nav-col>.footer__nav-item {
		break-inside: avoid;
		margin-top: 1.2rem;
	}

	.footer__nav-col>.footer__nav-item:first-child {
		margin-top: 0;
	}
}

/* PC */
@media (min-width: 1400px) {
	.footer__contact {
		padding: 5rem 0 7rem;
	}

	.footer__bg-text {
		top: calc(-5rem - 0.5em);
		font-size: 10.7rem;
		/* 171px */
	}

	.footer__contact-body {
		flex-direction: row;
		align-items: center;
		gap: 0;
	}

	.footer__contact-info {
		flex: 1;
		gap: 2rem;
		padding-right: 4rem;
	}

	.footer__contact-heading {
		font-size: 1.9rem;
		/* 31px */
		line-height: 1.5;
	}

	.footer__contact-text {
		font-size: 1.3rem;
		/* 20px */
		line-height: 2.5;
	}

	.footer__contact-cta {
		flex: 1;
		padding-left: 4rem;
	}

	.footer__contact-cta .tel-wrap {
		width: 100%;
	}

	.footer__contact-btn {
		min-width: 580px;
		padding: 1.5em 3em;
	}

	.footer__contact-btn>span {
		font-size: 1.5rem;
		/* 24px */
	}

	.footer__body {
		padding: 9rem 0 5rem;
	}

	.footer__body-inner {
		flex-direction: row;
		align-items: flex-start;
		gap: 0;
	}

	.footer__company {
		flex: 0 0 40%;
		gap: 1.5rem;
	}

	.footer__logo {
		width: 294px;
	}

	.footer__address {
		font-size: 1rem;
		/* 15px */
	}

	.footer__nav {
		flex: 1;
		display: block;
		margin-top: calc(32px + 2rem);
	}

	.footer__nav-col {
		column-count: 3;
		column-gap: 2rem;
	}

	.footer__nav-item a {
		font-size: 1.1rem;
		/* 18px */
	}

	.footer__copyright {
		padding: 2rem 0;
	}
}

/* #endregion */

/* #region 専用ブロック - ページヘッダー */

.page-hero {
	position: relative;
	height: 200px;
	margin-top: 80px;
}

.page-hero::before {
	content: '';
	position: absolute;
	inset: 0;
	background: url('../img/common/page_header.jpg') 0% 0% / cover no-repeat;
	opacity: 0.65;
}

.page-hero__inner {
	position: relative;
	z-index: 1;
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.page-hero__title {
	font-family: var(--en-font);
	font-style: italic;
	font-weight: 300;
	font-size: 4rem;
	line-height: 1;
	letter-spacing: .05em;
	color: var(--main-color);
}

.page-hero__sub {
	font-size: 1.1rem;
	line-height: 1.5;
	letter-spacing: 0;
	color: var(--black);
}

@media (min-width: 1000px) {
	.page-hero {
		margin-top: 115px;
	}
}

@media (min-width: 1400px) {
	.page-hero {
		height: 425px;
	}

	.page-hero__inner {
		justify-content: flex-start;
		padding-top: 155px;
	}

	.page-hero__title {
		font-size: 7.1rem; /* 114px */
		line-height: 1;
	}

	.page-hero__sub {
		margin-top: 21px;
		font-size: 1.9rem; /* 30px */
		line-height: 1.5;
	}
}

/* #endregion */

/* #region 汎用ブロック - page-header */

.page-header {
	margin-top: 3rem;
	font-size: 2rem;
	line-height: 1.2;
	color: var(--black);
	text-align: center;
}

.page-header::after {
	content: attr(data-en);
	display: block;
	margin-top: 6px;
	font-size: 0.9rem;
	font-weight: 400;
	line-height: 1.4;
	color: var(--main-color);
}

@media (min-width: 768px) {
	.page-header {
		font-size: 2.4rem;
	}

	.page-header::after {
		font-size: 1rem;
	}
}

@media (min-width: 1400px) {
	.page-header {
		margin-top: 5rem;
		font-size: 2.9rem; /* Figma: 47px */
	}

	.page-header::after {
		margin-top: 7px;
		font-size: 1.1rem; /* Figma: 18px */
	}
}

/* #endregion */

/* #region 汎用ブロック - ユーティリティ */

.br-pc {
	display: none;
}

@media (min-width: 1200px) {
	.br-pc {
		display: inline;
	}
}

/* #endregion */





/* #region 専用ブロック - contact */

.contact {
    position: relative;
    padding: 4rem 0 5rem;
    margin-top: 4rem;
    background: linear-gradient(107deg, var(--sub-grad-start), var(--sub-grad-end));
}

.contact .wrap {
    position: relative;
}

.contact__bg-text {
    position: absolute;
    top: calc(-4rem - 0.5em);
    left: 0;
    font-family: var(--en-font);
    font-style: italic;
    font-weight: 300;
    font-size: 3.5rem;
    line-height: 1;
    color: var(--main-color);
    white-space: nowrap;
    pointer-events: none;
}

@media (min-width: 768px) {
    .contact {
        margin-top: 6rem;
    }

    .contact__bg-text {
        font-size: 7rem;
    }
}

.contact__body {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
}

.contact__info {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.contact__heading {
    font-family: var(--main-font);
    font-size: 1.5rem;
    line-height: 1.5;
    color: var(--black);
}

.contact__text {
    font-size: 0.9rem;
    font-weight: normal;
    line-height: 2.5;
    color: var(--black);
}

.contact__cta {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.5rem;

}

.contact__btn {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--cta-color);
    border-radius: 10px;
    padding: .8em 1.5em;
    text-decoration: none;
    transition: opacity 0.3s;
}

.contact__btn>span {
    display: flex;
    align-items: center;
    gap: 0.5em;
    font-size: 0.9rem;
    color: var(--white);
}

.contact__btn .icon-mail_ic {
    font-size: inherit;
}

.contact__btn:hover {
    opacity: 0.8;
}

@media (min-width: 768px) {
    .contact__btn {
        padding: 1em 2em;
    }

    .contact__btn>span {
        font-size: 1rem;
    }
}

@media (min-width:1080px) {
    .contact__body {
        flex-direction: row;
        align-items: center;
        gap: 0;
    }

    .contact__info {
        flex: 1;
        gap: 3rem;
        padding-right: 3rem;
    }

    .contact__cta {
        flex: 1;
        padding-left: 3rem;
    }
}

@media (min-width: 1400px) {
    .contact {
        padding: 5rem 0 7rem;
        margin-top: 15rem;
    }

    .contact__bg-text {
        top: calc(-5rem - 0.5em);
        font-size: 10.7rem;
        /* 171px */
    }

   
    .contact__heading {
        font-size: 1.9rem;
        /* 31px */
        line-height: 1.5;
    }

    .contact__text {
        font-size: 1.3rem;
        /* 20px */
        line-height: 2.5;
    }

    .contact__btn {
        min-width: 580px;
        padding: 1.5em 3em;
    }

    .contact__btn>span {
        font-size: 1.5rem;
        /* 24px */
    }
}



/* #region 専用ブロック - information */

.information {
    padding: 5rem 0;
}

.information__heading {
    display: flex;
    flex-direction: column;
}

.information__heading-en {
    font-family: var(--en-font);
    font-style: italic;
    font-weight: 300;
    font-size: 2rem;
    line-height: 1;
    letter-spacing: 5px;
    color: var(--main-color);
}

@media (min-width: 768px) {
    .information__heading-en {
        font-size: 3rem;
        letter-spacing: 10px;
    }
}

.information__heading-ja {
    font-family: var(--main-font);
    font-size: 1.1rem;
    line-height: 1;
    color: var(--black);
}

.information__list {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 1000px;
    margin-top: 2rem;
    margin-right: auto;
    margin-left: auto;
}

.information__item {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
	border-bottom: solid 1px #EAF1E2;
	padding: 1em;
}

@media (min-width: 768px) {
    .information__item {
        flex-direction: row;
        align-items: center;
        gap: 4rem;
    }
}

.information__item+.information__item {
    margin-top: 0.5rem;
}

.information__date {
    font-family: var(--en-font);
    font-weight: 300;
    font-size: 0.9rem;
    line-height: 2;
    color: var(--sub-green-light);
}

.information__item-title {
    font-family: var(--main-font);
    font-size: 0.9rem;
    line-height: 2;
    color: var(--black);
}

@media (min-width: 1400px) {
    .information__heading-en {
        font-size: 4.2rem;
        /* 67px */
    }

    .information__heading-ja {
        font-size: 1.3rem;
        /* 20px */
    }

    .information__date {
        font-size: 1.1rem;
        /* 18px */
    }

    .information__item-title {
        font-size: 1.1rem;
        /* 18px */
    }
}

/* #endregion */



/* #region 専用ブロック - works */

.works {
    padding: 6rem 0 6rem;
    overflow-x: hidden;
}

.works__heading {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.works__heading-en {
    font-family: var(--en-font);
    font-weight: 600;
    font-size: 1.3rem;
    line-height: 1;
    color: var(--main-color);
}

.works__heading-ja {
    font-family: var(--main-font);
    font-size: 2rem;
    line-height: 1.5;
    color: var(--black);
}

.works__swiper {
    margin-top: 4rem;
    overflow: visible;
    padding-bottom: 12px;
    width: 110%;
    margin-left: 50%;
    transform: translateX(-50%);
}

.works__swiper .swiper-slide {
    width: 280px;
}

.works__card {
    display: flex;
    flex-direction: column;
    background: var(--white);
    box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.07);
    border-radius: 18px;
    overflow: hidden;
}

.works__card-img-wrap {
    overflow: hidden;
    padding: 1.2rem 1.5rem 0;
	aspect-ratio:3 / 2;
	margin-bottom: 1em
}

.works__card-img-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.works__card-body {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    padding: .2rem 1.5rem 1.8rem;
}

.works__card-location {
    font-family: var(--main-font);
    font-size: 0.9rem;
    line-height: 1.5;
    color: var(--main-color);
}

.works__card-title {
    font-family: var(--main-font);
    font-size: 1.5rem;
    line-height: 1.5;
    color: var(--black);
}

.works__card-text {
    margin-top: 0.5rem;
    font-size: 0.9rem;
    font-weight: normal;
    line-height: 1.9;
    color: var(--black);
}

.works .btn-wrap {
    display: flex;
    justify-content: center;
    margin-top: 6rem;
}

.works .btn-wrap .section__btn {
    width: auto;
}

@media (min-width: 768px) {
    .works__swiper .swiper-slide {
        width: 340px;
    }

    /*.works__card-img {
        height: 240px;
    }*/
}

@media (min-width: 1400px) {

    .works {
        padding: 8rem 0 6rem;
    }

    .works__heading-en {
        font-size: 1.9rem;
        /* 30px */
    }

    .works__heading-ja {
        font-size: 4.1rem;
        /* 66px */
        line-height: 1.5;
    }

    .works__swiper {
        margin-top: 7rem;
    }

    .works__swiper .swiper-slide {
        width: 500px;
    }

    /*.works__card-img {
        height: 320px;
    }*/

    .works__card-location {
        font-size: 1.2rem;
        /* 19px */
        line-height: 1.5;
    }

    .works__card-title {
        font-size: 2.3rem;
        /* 37px */
        line-height: 1.5;
    }

    .works__card-text {
        font-size: 1rem;
        /* 16px */
        line-height: 1.9;
    }
}

/* #endregion */


/***********************************************************
   contact
************************************************************/


.contact_info_inner{
	padding: 2em 1em;
	border-radius: 5px;
	text-align: center;
	backdrop-filter: blur(5px);
	background: rgba(255,255,255,.8);
}
.contact_info_inner > p{
	font-weight: bold;
	font-size: 1.2em;
	margin-bottom: 1em;
}
.contact_tel_wrap > p:first-of-type{
	font-weight: bold;
	font-size: 1.5em;
	color: var(--color-green);
	line-height: 1.5;
	margin-bottom: .5em;
}
@media (min-width:768px){
	.contact_info_inner > p{font-size: 1.4em}
	.contact_tel_wrap > p:first-of-type{
		font-size: 2em;
	}
}

@media (min-width:1200px){
	.contact_tel_wrap > p:first-of-type{
		font-size: 2.5em
	}
}




/***********************************
 form
***********************************/
.form_title{
	text-align: center;
	margin: 3em auto;
}
.form-flow {
    margin: 3em auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center
}
.form-flow > li {
    margin: .5em 0;
	width: 32%;
    background: #ccc;
    padding: .8em;
    text-align: center;
    border-radius: .3em;
    color: #a7a7a7;
	font-weight: 400;
	letter-spacing: 1px
}
.form-flow li.pickup {
    background: var(--main-color)!important;
    color: #fff;
}
#page_reserve .form-flow li.pickup {background: #e60514!important}
.form-att-b{font-weight: bold;}
.form-att{
	color:red;
	font-weight: bold;
}

#check .form-att{color: #000}

.form_att{
	color: red;
    margin: 1em auto;
    font-size: 13px;
    line-height: 1.5;
}

/*  form  */

#form{margin: 3em auto}
#form .reserve_title{
	font-weight: bold;
    font-size: 1.5em;
    padding-bottom: .5em;
    max-width: 1200px;
    margin: 1em auto;
    background: #f5e6e7;
    padding: 1em .5em;
    letter-spacing: 1px;
}
#form dl{
	border-bottom: solid 1px #ccc;
	padding: 1em 0;
	max-width: 1200px;
	margin: 0 auto;
	display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}
#form dt,
#form dd{
	padding: .3em 0;
	margin: 0;
	font-size: 1em;
	font-weight: 400;
	letter-spacing: 1px
}
@media screen and (max-width:668px){
	#form dt,#form dd{width: 100%}
}
@media screen and (min-width:668px){
	#form dt{width: 26%;margin-right: 4%}
	#form dd{width: 65%;}
}

#form dt small{
	display: block;
	margin-left: 45px
}

#form input[type="text"],
#form input[type="email"],
#form input[type="url"],
#form textarea,
#zip_wrap input[type="tel"]{
	border: solid 1px #b6b6b6;
    border-radius: 5px;
    padding: 1em .5em;
    margin: 0;
    font-size: 16px;
    width: 100%;
    box-sizing: border-box;
}

input[type="text"].tel,
input[type="text"].zip{padding: 1em}
input[type="text"].your_birth{width: 25%!important}
input[type="text"].your_old{width: 20%!important}

#old_wrap{display: inline-block;}

textarea{line-height: 1.6;font-weight: 400}

@media screen and (max-width:668px){
	input[type="text"].tel,
	input[type="tel"].zip{width: auto!important;}
}
@media(min-width:668px){
	input[type="text"].tel,
	input[type="tel"].zip{width: 10%!important}
	input[type="text"].your_birth{width: 15%!important}
}

#zip_wrap {margin-bottom: .8em;}
#zip{width: 60%!important}
@media(min-width:668px){
	#zip{width: 30%!important}
}
#zip_wrap span{display: inline-block;margin-left: .5em;}
.confirm #zip_wrap span{display: none}

input[type="text"].w-100,
#form input[type="email"].w-100,
textarea.w-100{width: 100%}

#busyo{display: flex;justify-content: space-between}
#busyo input[type="text"]:first-of-type{width: 58%}
#busyo input[type="text"]:last-of-type{width: 40%}

.mwform-radio-field{margin: 1em 1em 1em 0}
.c_info dd{
	display: flex;
	flex-direction: column;
	justify-content: flex-start
}
.c_info dd span{
	margin: .5em 0;
	margin-left: 0!important;
	font-size: .9em
}
.com_name dd{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between
}
.com_n1{width: 60%!important;}
.com_n2{width: 30%!important;}
.mwform-zip-field{display: block}

/*-- submit --*/
input[type="submit"]{
	display: block;
    width: 90%;
    max-width: 250px;
    background: var(--main-color);
    text-align: center;
    padding: 1em;
    border: none;
    margin: 3em auto;
    border-radius: 2em;
    color: #fff;
    font-weight: 400;
	outline: none
}

input[type="submit"].back{background: #ccc}
input[type="submit"]{appearance: none;}
.error{margin: .5em auto}
.privacy_check{text-decoration: underline}
/*-- thanks --*/
.thanks_message h3 {
    margin: 1em auto;
    font-size: 2em;
    font-weight: bold;
	line-height: 1.6
}
.thanks_message > p {
    line-height: 1.8em;
	margin-bottom: 2em;
	font-weight: 400
}
.thanks_message .contact_tel_wrap{margin-bottom: 2em}
.thanks_message .contact_tel_wrap p{margin-bottom: 0}
.thanks_message a.btn1 span:after{display: none}


/*-- 必須・任意 --*/
.hissu:before,
.nini:before,
.jidou:before{
	padding: .3em;
	color: #fff;
	margin-right: 10px;
	display: inline-block;
	font-size: 12px;
	line-height: 1;
	width: 30px;
	text-align: center
}

.hissu:before{
	content: '必須';
	background: #f17676;
}
.nini:before{
	content: '任意';
	background: #9b9b9b;
}
.jidou:before{
	content: '自動入力';
	background: #333;
	width: 60px
}
#form .form_title{
	color: #B60F41;
	font-size: 1.2em;
	padding: .5em 0;
	border-bottom: solid 1px #B60F41;
	margin-bottom: 1em;
	font-weight: bold;
	margin-top: 3em
}
#form .form_title:first-of-type{margin-top: 0;}
#form dd a{color: #000}







/***********************************************************
   privacy
************************************************************/
.privacy_wrap{margin: 5em auto}
.privacy_wrap h2{
	font-size: 1.5em;
	margin-bottom: 1em;
	font-weight: bold;
	text-align: center
}
.privacy_wrap > p{
	margin-bottom: 2em;
	text-align: center
}


.privacy_wrap p,
.privacy_wrap dd{
	font-size: 1em;
	font-weight: 400;
	line-height: 2
}
.privacy_wrap dt{
	font-weight: bold;
	font-size: 1.4em;
	letter-spacing: 1px;
	margin-bottom: .5em;color: var(--color-green);
}

.privacy_wrap dl{
	border-bottom: solid 1px #ccc;
	padding: 1em 0;
	margin-bottom: 2em;
}
.privacy_wrap dd h4{font-weight: bold;}

.privacy_wrap ul,
.privacy_wrap ol{
	margin: 1em auto;
	padding-left: 2em
}
.privacy_wrap li{
	list-style: disc;
	margin-bottom: .5em
}
.privacy_wrap ol li{list-style: decimal}

@media screen and (max-width:768px){
	#page_privacy p,
	#page_privacy dd{font-size: 15px;}
}


/***********************************
  footer (fix)
***********************************/
/* page-top */

#page-top{
	position: fixed;
	bottom: 10%;
	right: 3%;
	text-decoration: none;
	z-index: 800;
}
#page-top a{
	width: 50px;
	height: 50px;
	background: #6EC300;
	border-radius: 50%;
	line-height: 50px;
	display: block;
	text-align: center;
	color: #fff
}
@media screen and (max-width:667px){
	#ft_fix{
		 position: fixed;
		left: 0;
		bottom: 0;
		width: 100%;
		z-index: 800;
		background: #a2cc4d;
		padding-bottom: env(safe-area-inset-bottom);
		transform: translateZ(0);
		-webkit-transform: translateZ(0);
	}
	#ft_fix > *{
		width: 50%;
		text-align: center;
	}
	#ft_fix a{
		color: #fff;
		display: block;
		padding: .8em;
		font-size: .9rem;
		font-weight: 400;
	}
	.fix_tel{
		border-right: solid 1px #fff;
		font-family: var(--num-font);
		font-size: 1.5em
	}
	.fix_contact{
		background: var(--cta-color)
	}
	#ft_fix i{margin-right: .3em}
}
@media screen and (min-width:668px){
	#ft_fix{display: none}
}



.tel-wrap {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: center;
}

.tel-wrap::before {
    content: "TEL.";
    font-family: var(--num-font);
    font-size: 1.2rem;
    color: var(--main-color);
    line-height: 1;
    margin-right: .2em;
}

.tel-number {
    font-family: var(--num-font);
    font-size: 2.6rem;
    font-weight: 600;
    line-height: 1.5;
    color: var(--main-color);
	margin-bottom: .3em
}
.tel-number a{color: var(--main-color); }

@media (min-width: 768px) {
    .tel-wrap::before {
        font-size: 1.5rem;
    }

    .tel-number {
        font-size: 3.5rem;
    }
}

.tel-hours {
    flex: 0 0 100%;
    margin-top: -1rem;
    margin-left: 2em;
    font-size: 0.9rem;
    font-weight: normal;
    line-height: 1.5;
    color: var(--black);
    text-align: center;
}

@media (min-width: 1400px) {
    .tel-wrap::before {
        font-size: 1.9rem;
        /* 30px */
    }

    .tel-number {
        font-size: 5.1rem;
        /* 82px */
    }

    .tel-hours {
        font-size: 1rem;
        /* 16px */
    }
}


#notf .wrap{padding: 3em 0}
#notf .wrap h2{
	margin-bottom: 1em;
	font-size: 1.5em;
	font-weight: bold;
	line-height: 1.6
}

#notf a{margin-top: 2em}
#notf a:after{display: none!important}






