/*
Theme Name: arkhe-child
Template: arkhe
*/

@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@200..800&family=Noto+Sans+JP:wght@100..900&display=swap');

.grecaptcha-badge { visibility: hidden }
.recapcha-text { font-size: 11px; text-align: center; margin-bottom: 30px}
.recapcha-text  a { font-size: 11px }

p, a, li, th, td, input, select, textarea, label {
	font-family: "Noto Sans JP", sans-serif;
	font-size: clamp(0.906rem, 0.861rem + 0.23vw, 1.031rem);
	line-height: 1.3
}
a {
	text-decoration: none
}
h1, h2, h3, h4, h5, h6 {
	font-family: "Noto Sans JP", sans-serif;
	line-height: 1.2;
	font-weight: 900
}
h1 { font-size: clamp(1.75rem, 1.568rem + 0.91vw, 2.25rem) }
h2 { font-size: clamp(1.5rem, 1.409rem + 0.45vw, 1.75rem) }
h3 { font-size: clamp(1.25rem, 1.159rem + 0.45vw, 1.5rem) }
h4 { font-size: clamp(1rem, 0.955rem + 0.23vw, 1.125rem) }
h5 { font-size: clamp(0.75rem, 0.705rem + 0.23vw, 0.875rem) }
img {
	display: block;
	width: 100%
}

[data-btns=r-l] .l-header__body {
	grid-template-columns: 0 0 1fr 0 40px
}
#header__bar {
	margin: 0 calc(50% - 50vw);
	padding: 0 calc(50vw - 50%);
	background: #1a1a1a;
	& p {
		padding: 10px;
		font-size: clamp(0.625rem, 0.534rem + 0.45vw, 0.875rem)
	}
}

.link__btn {
	position: relative;
	display: block;
	color: #fff;
	border-radius: clamp(0.875rem, 0.739rem + 0.68vw, 1.25rem);
	background: linear-gradient(90deg, rgba(255,0,0,1) 0%, rgba(255,50,0,1) 50%, rgba(255,150,125,1) 100%);
	background-size: 200% auto;
	background-position: 1% 50%;
	text-align: center;
	padding: clamp(0.875rem, 0.693rem + 0.91vw, 1.375rem);
	font-weight: 700;
	margin: clamp(1.25rem, 0.886rem + 1.82vw, 2.25rem);
	&::after {
		content: '';
		position: absolute;
		right: 10px;
		top: calc(50% - 8px);
		display: block;
		height: 16px;
		width: 16px;
		background-image: url(/wp-content/uploads/2024/03/arrow.svg);
		background-repeat: no-repeat;
		background-size: contain;
		opacity: .5
	}
}
.pdf__btn {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	&::after {
		position: relative;
		right: auto;
		top: auto;
		background-image: url(/wp-content/uploads/2024/03/icon-pdf.svg);
		height: 22px;
		width: 22px;
		opacity: 1
	}
}

.price__bold {
	font-family: "Manrope", sans-serif;
	font-weight: 800;
	font-size: 120%;
	letter-spacing: -0.05em
}

#hero__wrapper {
	margin: 0 calc(50% - 50vw);
	padding: clamp(1.5rem, 0.682rem + 4.09vw, 3.75rem) calc(50vw - 50%);
	background-image: url(/wp-content/uploads/2024/03/main_bg.jpg);
	background-size: cover;
	background-position: center
}

#top__contents section,
#cta__wrapper {
	position: relative;
	margin: 0 calc(50% - 50vw);
	padding: clamp(3.75rem, 2.386rem + 6.82vw, 7.5rem) calc(50vw - 50%);
	& > h1 {
		position: relative;
		text-align: center;
		margin-bottom: clamp(1.5rem, 1.227rem + 1.36vw, 2.25rem);
		z-index: 10;
		&::before {
			position: absolute;
			left: 0;
			top: -25px;
			font-size: 135%;
			font-family: "Manrope", sans-serif;
			font-weight: 800;
			opacity: .12;
			letter-spacing: 0.2em;
			z-index: 1
		}
	}
}

#reason__wrapper,
#service__wrapper {
	z-index: 0;
	&::after {
		content: '';
		position: absolute;
		left: 0;
		top: 0;
		display: block;
		height: 100%;
		width: 100%;
		background: rgba(0,0,0,.6);
		z-index: 1
	}
	& > * {
		position: relative;
		z-index: 10
	}
}

#reason__wrapper {
	background-image: url(/wp-content/uploads/2024/03/reason_bg.jpg);
	background-size: cover;
	background-position: center;
	& > h1 {
		color: #fff;
		&::before {
			content: 'REASON'
		}
	}
	& > img {
		height: clamp(12.5rem, 6.591rem + 29.55vw, 28.75rem);
		object-fit: cover
	}
	& > h3 {
		color: #fff;
    font-weight: 600;
    text-align: center;
    margin: clamp(0.875rem, 0.557rem + 1.59vw, 1.75rem) 0 clamp(0.375rem, 0.239rem + 0.68vw, 0.75rem);
	}
	& > p {
		color: #fff;
		margin-bottom: clamp(0.875rem, 0.557rem + 1.59vw, 1.75rem)
	}
}

.reason__point {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
	& .reason__point__box {
		position: relative;
		background: #fff;
		text-align: center;
		width: 100%;
		padding: clamp(0.75rem, 0.659rem + 0.45vw, 1rem);
		border-radius: clamp(0.75rem, 0.659rem + 0.45vw, 1rem);
		box-shadow: 3px 3px 7px rgba(0,0,0,.35);
		& h2 {
			position: absolute;
			font-size: clamp(2.25rem, 1.977rem + 1.36vw, 3rem);
			font-family: "Manrope", sans-serif;
			font-style: italic;
			color: #ccdeec;
		}
		& img {
			height: 60px
		}
		& h3 {
			color: #005a9e;
			font-weight: 500;
			margin: 6px 0
		}
		& p {
			color: #005a9e
		}
		
	}
}

#price__wrapper {
	& > h1 {
		color: #005a9e;
		&::before {
			content: 'PRICE'
		}
	}
}

.price__img {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	& .price__kogata, .price__chugata, .price__ogata {
		width: calc(33% - 3px)
	}
}

.discount__wrapper {
	position: relative;
	background: rgba(255,0,0,.1);
	padding: 36px 16px 16px;
	margin-top: 16px;
	border-radius: 16px;
	&::before {
		content: '';
		position: absolute;
		top: -10px;
		left: calc(50% - 40px);
		width: 0;
		height: 0;
		border-style: solid;
		border-right: 40px solid transparent;
		border-left: 40px solid transparent;
		border-top: 30px solid #fff;
		border-bottom: 0;
	}
	& > h1 {
		position: relative;
		text-align: center;
		color: #f00;
		margin-bottom: clamp(1.5rem, 1.227rem + 1.36vw, 2.25rem);
		z-index: 10;
		&::before {
			content: 'DISCOUNT';
			position: absolute;
			left: 0;
			top: -25px;
			font-size: 135%;
			font-family: "Manrope", sans-serif;
			font-weight: 800;
			opacity: .12;
			letter-spacing: 0.2em;
			z-index: 1
		}
	}
}

.discount__flex {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	& .discount__box {
		display: grid;
		grid-template-areas:
			"number title price"
			"number text  text";
		grid-template-columns: 36px 1fr auto;
		align-items: center;
		background: #fff;
		padding: 16px;
		border-radius: 16px;
		box-shadow: 4px 4px 8px rgba(0,0,0,.1);
		& h1 {
			grid-area: number;
			font-size: 40px;
			font-family: "Manrope", sans-serif;
			color: #ccdeec;
		}
		& .discount__title {
			grid-area: title;
			color: #005a9e
		}
		& .discount__price {
			grid-area: price;
			display: flex;
			align-items: baseline;
			justify-content: right;
			color: #f00
		}
		& p {
			grid-area: text
		}
	}
	& .hayawari__box {
		grid-template-areas:
			"number title"
			"number text"
			"price  price";
		grid-template-columns: 36px 1fr;
		& .hayawari__inner {
			grid-area: price;
			display: flex;
			flex-wrap: wrap;
			margin-top: 10px;
			gap: 8px;
			& h3 {
				display: flex;
				align-items: baseline;
				color: #f00;
				font-size: 16px;
				& .hayawari__before {
					display: block;
					background: #f00;
					color: #fff;
					font-size: 10px;
					font-weight: 500;
					padding: 5px;
					margin-right: 5px;
					border-radius: 5px;
					letter-spacing: -0.03em
				}
			}
		}
	}
}

#service__wrapper {
	background-image: url(/wp-content/uploads/2024/03/service_bg.jpg);
	background-size: cover;
	background-position: center;
	& > h1 {
		color: #fff;
		&::before {
			content: 'SERVICE'
		}
	}
}

.service__flex {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	& .service__box {
		display: flex;
		align-items: center;
		background: #fff;
		border-radius: 12px;
		box-shadow: 4px 4px 8px rgba(0,0,0,.1);
		overflow: hidden;
		& .service__content {
			width: 260px;
			padding: 12px;
			& h5 {
				display: flex;
				align-items: center;
				color: #99bdd8;
				font-weight: 600;
				& span {
					position: relative;
					display: flex;
					justify-content: center;
					align-items: center;
					background: #005a9e;
					font-family: "Manrope", sans-serif;
					font-weight: 800;
					color: #fff;
					height: 20px;
					width: 20px;
					border-radius: 50vh;
					margin-left: 8px;
					&::before {
						content: '';
						position: absolute;
						left: -4px;
						top: calc(50% - 4px);
						width: 0;
						height: 0;
						border-style: solid;
						border-top: 4px solid transparent;
						border-bottom: 4px solid transparent;
						border-right: 6px solid #005a9e;
						border-left: 0;
					}
				}
			}
			& h3 {
				color: #005a9e;
				margin: clamp(0.125rem, 0.034rem + 0.45vw, 0.375rem) 0 clamp(0.375rem, 0.284rem + 0.45vw, 0.625rem)
			}
		}
		& > img {
			width: calc(100% - 260px);
			height: 100%;
			object-fit: cover;
			object-position: center
		}
	}
}

#voice__wrapper {
	& > h1 {
		color: #005a9e;
		&::before {
			content: 'VOICE'
		}
	}
}

.voice__box {
	margin-bottom: clamp(1.25rem, 0.886rem + 1.82vw, 2.25rem);
	padding-bottom: clamp(1.25rem, 0.886rem + 1.82vw, 2.25rem);
	border-bottom: 1px solid rgba(255,255,255,.2);
	text-align: center;
	& .voice__person {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		gap: 16px;
		background: #e6e6e6;
		padding: 8px;
		border-radius: 16px;
		& img {
			width: 100px;
		}
		& .voice__person__name p {
			font-size: clamp(0.75rem, 0.705rem + 0.23vw, 0.875rem)
		}
	}
	& .voice__text p {
		margin-top: clamp(0.5rem, 0.409rem + 0.45vw, 0.75rem);
		text-align: left
	}
}

#news__wrapper {
	background: #e6e6e6;
	& > h1 {
		color: #666;
		&::before {
			content: 'NEWS'
		}
	}
	& .wp-show-posts {
		background: #fff;
		margin: 0;
		padding: 16px;
		border-radius: 20px;
		box-shadow: 4px 4px 8px rgba(0,0,0,.1);
		& .wp-show-posts-entry-title a {
			font-weight: 700;
			font-size: clamp(1rem, 0.955rem + 0.23vw, 1.125rem)
		}
	}
	& .wpsp-read-more a {
		background: #005a9e;
		border: none;
		color: #fff;
		border-radius: 8px;
		padding: 10px 18px
	}
}

#shop__wrapper {
	& iframe {
		height: 280px;
		margin-top: 16px
	}
}

.shop__content {
	& > h1 {
		text-align: center
	}
	& #shop__info__table {
		display: flex;
		flex-wrap: wrap;
		gap: 12px;
		margin: 16px 0;
		& .shop__info__row {
			display: flex;
			align-items: center;
			width: 100%;
			& h3 {
				font-size: clamp(0.906rem, 0.861rem + 0.23vw, 1.031rem);
				font-weight: 600;
				color: #1a1a1a;
				width: 120px
			}
			& p {
				width: calc(100% - 120px)
			}
		}
	}
}

#cta__wrapper {
	background-image: url(/wp-content/uploads/2024/03/contact_bg.jpg);
	background-size: cover;
	background-position: center;
	z-index: 0;
	&::after {
		content: '';
		position: absolute;
		left: 0;
		top: 0;
		display: block;
		height: 100%;
		width: 100%;
		background: rgba(255,0,0,.6);
		z-index: 1
	}
	& > * {
		position: relative;
		z-index: 10
	}
	& > div {
		& h4 {
			background: #fff;
			font-weight: 700;
			color: #f00;
			text-align: center;
			width: 80%;
			padding: 12px 0;
			margin: 0 auto clamp(1rem, 0.864rem + 0.68vw, 1.375rem);
			border-radius: 50vh
		}
		& .cta__bold {
			display: flex;
			align-items: center;
			justify-content: center;
			gap: 8px;
			margin-bottom: clamp(0.875rem, 0.739rem + 0.68vw, 1.25rem);
			& img {
				height: 30px;
				width: auto;
				filter: invert(100%) sepia(0%) saturate(7487%) hue-rotate(83deg) brightness(101%) contrast(100%);
			}
			& a {
				line-height: 1;
				color: #fff
			}
		}
		& p {
			color: #fff;
			text-align: center
		}
	}
}

.cta__tel {
	margin-bottom: 26px;
	padding-bottom: 26px;
	border-bottom: 2px solid #fff;
	& a {
		font-family: "Manrope", sans-serif;
		font-size: 34px
	}
}

.cta_web {
	& a {
		font-size: 28px;
		font-weight: 500
	}
}

#fixed__menu__wrapper {
	position: fixed;
	bottom: 0;
	left: 0;
	display: flex;
	align-items: stretch;
	background: #1a1a1a;
	box-shadow: 0 0 8px rgba(0,0,0,.3);
	z-index: 100;
	& h4 {
		display: flex;
		align-items: center;
		justify-content: center;
		font-weight: 500;
		padding: 10px
	}
	& a {
		display: flex;
		justify-content: center;
		align-items: center;
		padding: 10px;
		gap: 10px;
		& img {
			width: 30px;
			filter: invert(100%) sepia(0%) saturate(7487%) hue-rotate(83deg) brightness(101%) contrast(100%);
		}
	}
}

.fixed__menu__tel {
	background: #41c699
}
.fixed__menu__web {
	background: #3ac2d0
}

.p-fixBtnWrap {
	bottom: 80px
}
#pagetop svg {
	fill: #fff
}
.l-footer__nav a,
.c-copyright {
	color: #fff
}
.p-breadcrumb__text {
	font-size: clamp(0.688rem, 0.619rem + 0.34vw, 0.875rem)
}

#banner__area {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}
.widget_nav_menu .menu {
	display: flex;
	flex-wrap: wrap;
	gap: 0 8px;
	border: none;
	& li {
		border-bottom: 1px solid #fff;
		width: calc(50% - 4px)
	}
}

.l-content__body {
	margin-top: 0;
	margin-bottom: 0;
}
.c-pageTitle__main {
	&::before {
		display: block;
		font-family: "Manrope", sans-serif;
		font-weight: 500;
		font-size: 20px;
		letter-spacing: 0.3em;
		opacity: .8
	}
}
.page-id-2876 .c-pageTitle__main:before {
	content: 'REASON';
}
.page-id-2878 .c-pageTitle__main:before {
	content: 'PRICE';
}
.page-id-2880 .c-pageTitle__main:before {
	content: 'FLOW';
}
.page-id-17 .c-pageTitle__main:before {
	content: 'FAQ';
}
.page-id-21 .c-pageTitle__main:before {
	content: 'SHOP';
}
.page-id-23 .c-pageTitle__main:before {
	content: 'CONTACT';
}
.page-id-3635 .c-pageTitle__main:before {
	content: 'PRIVACY POLICY';
}
.page-id-19 .c-pageTitle__main:before {
	content: 'VOICE';
}

.reason__page {
	& section {
		padding: clamp(2.25rem, 1.705rem + 2.73vw, 3.75rem) 0;
		margin: clamp(2.25rem, 1.705rem + 2.73vw, 3.75rem) 0;
		border-bottom: 1px solid #eee
	}
	& section:nth-of-type(6) {
		border-bottom: none;
		padding-bottom: 0
	}
	& .reason__section__main {
		& h1 {
			color: #333;
			margin-bottom: clamp(1.5rem, 1.227rem + 1.36vw, 2.25rem)
		}
		& h3 {
			color: #005a99;
			margin: clamp(1.5rem, 1.227rem + 1.36vw, 2.25rem) 0 clamp(0.875rem, 0.693rem + 0.91vw, 1.375rem);
			&::before {
				content: '';
				display: inline-block;
				height: 20px;
				background-size: contain;
				background-position: left;
				background-repeat: no-repeat;
			}
		}
		& p {
			color: #4d4d4d;
			margin-bottom: clamp(0.75rem, 0.659rem + 0.45vw, 1rem)
		}
		& ol {
			color: #333;
			font-weight: 700
		}
	}
	& .reason__section__image {
		height: 200px;
		background-size: cover;
		background-position: center;
		margin-top: 12px;
		& h1 {
			position: absolute;
			left: 0;
			top: 0;
			color: #a7a7a7;
			font-family: "Manrope", sans-serif;
			font-style: italic;
			font-size: 34px;
			line-height: 1
		}
	}
	& .reason__exp {
		font-size: 80%;
		margin-top: clamp(0.5rem, 0.318rem + 0.91vw, 1rem)
	}
}

.reason__page section:nth-of-type(1) .reason__section__image {
	background-image: url(/wp-content/uploads/2026/02/shop_img01.jpg)
}
.reason__page section:nth-of-type(2) {
	& h3:before {
		background-image: url(/wp-content/uploads/2024/03/reason-point6.svg);
		width: 20px
	}
	& .reason__section__image {
		background-image: url(/wp-content/uploads/2024/03/reason_img.jpg)
	}
}
.reason__page section:nth-of-type(3) .reason__section__image {
	background-image: url(/wp-content/uploads/2024/03/service_img3.jpg)
}
.reason__page section:nth-of-type(4) {
	& h3:before {
		background-image: url(/wp-content/uploads/2024/03/reason-point2.svg);
		width: 26px
	}
	& .reason__section__image {
		background-image: url(/wp-content/uploads/2024/03/reason_img4.jpg)
	}
}
.reason__page section:nth-of-type(5) {
	& h3:before {
		background-image: url(/wp-content/uploads/2024/03/reason-point5.svg);
		width: 28px
	}
	& .reason__section__image {
		background-image: url(/wp-content/uploads/2024/03/reason_img5.jpg)
	}
}
.reason__page section:nth-of-type(6) .reason__section__image {
	background-image: url(/wp-content/uploads/2024/03/service_img1.jpg)
}

.reason__img__flex {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	& img {
		width: calc(50% - 4px)
	}
}

.price__page {
	& > h1 {
		color: #333;
		text-align: center;
		margin-bottom: clamp(1.125rem, 0.716rem + 2.05vw, 2.25rem)
	}
}
.price__box {
	display: grid;
	grid-template-areas:
		"head head"
		"left left"
		"right right"
		"total total";
	padding: clamp(1rem, 0.591rem + 2.05vw, 2.125rem);
	margin-bottom: clamp(1rem, 0.591rem + 2.05vw, 2.125rem);
	border-radius: clamp(1rem, 0.591rem + 2.05vw, 2.125rem);
	gap: 8px;
	& .price__head {
		grid-area: head;
		background-size: auto 85%;
		background-position: right top;
		background-repeat: no-repeat;
		& img {
			height: 54px;
			width: auto;
		}
		& p {
			color: #fff;
			margin-top: 36px
		}
	}
	& .price__inner {
		background: #fff;
		border-radius: clamp(1rem, 0.636rem + 1.82vw, 2rem);
		padding: clamp(0.75rem, 0.659rem + 0.45vw, 1rem) clamp(0.75rem, 0.477rem + 1.36vw, 1.5rem);
		box-shadow: 3px 3px 6px rgba(0,0,0,.1);
		& .price__inner__row {
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding: clamp(0.25rem, 0.205rem + 0.23vw, 0.375rem) 0;
			color: #bebebe;
			& p {
				font-weight: 500
			}
			& .price__bold {
				letter-spacing: 0.03em
			}
		}
		& .tax__total {
			color: #00699d
		}
		& .fee__total {
			color: #d91922
		}
	}
	& .price__inner:nth-of-type(2) {
		grid-area: left;
	}
	& .price__inner:nth-of-type(3) {
		grid-area: right;
	}
	& .price__total {
		grid-area: total;
		background: #d91922;
		& * {
			color: #ff0
		}
	}
}

.price__box__kei {
	background: #e2a241;
	& .price__head {
		background-image: url(/wp-content/uploads/2024/03/car_img1.png)
	}
}
.price__box__kogata {
	background: #d45829;
	& .price__head {
		background-image: url(/wp-content/uploads/2024/03/car_img2.png)
	}
}
.price__box__chugata {
	background: #31a2aa;
	& .price__head {
		background-image: url(/wp-content/uploads/2024/03/car_img3.png)
	}
}
.price__box__ogata {
	background: #434877;
	& .price__head {
		background-image: url(/wp-content/uploads/2024/03/car_img4.png)
	}
}

.inspection-item__wrapper {
	& h3 {
		color: #005a9c;
	}
	& .inspection-item__box {
		display: flex;
		flex-wrap: wrap;
		gap: 14px;
		margin: clamp(0.75rem, 0.659rem + 0.45vw, 1rem) 0 clamp(1.5rem, 1.227rem + 1.36vw, 2.25rem);
		& .inspection-item {
			width: calc(33% - 9px);
			& img {
				height: auto
			}
			& p {
				font-size: clamp(0.625rem, 0.534rem + 0.45vw, 0.875rem)
			}
		}
	}
}

.flow__page {
	& > h1 {
		background: #f00;
		color: #fff;
		text-align: center;
		padding: 8px;
		& span {
			color: #ff0
		}
	}
	& .flow__section {
		position: relative;
		padding: clamp(3.125rem, 2.443rem + 3.41vw, 5rem) 0 clamp(1.875rem, 0.739rem + 5.68vw, 5rem);
		border-bottom: 1px solid #f00;
		&::after {
			content: '';
			position: absolute;
			bottom: -30px;
			left: calc(50% - 40px);
			width: 0;
			height: 0;
			border-style: solid;
			border-right: 40px solid transparent;
			border-left: 40px solid transparent;
			border-top: 30px solid #f00;
			border-bottom: 0;
		}
		&:nth-child(7) {
			border: none;
			&::after {
				content: none
			}
		}
		& h2 {
			display: flex;
			align-items: center;
			color: #f00;
			border-bottom: 1px solid;
			line-height: 1;
			gap: 8px;
			& span {
				display: flex;
				justify-content: center;
				align-items: center;
				background: #f00;
				color: #fff;
				font-family: "Manrope", sans-serif;
				font-weight: 600;
				font-size: 20px;
				height: 40px;
				width: 30px;
			}
		}
		& p {
			margin: clamp(0.5rem, 0.364rem + 0.68vw, 0.875rem) 0
		}
		& img {
			height: 200px;
			object-fit:cover;
			object-position: center
		}
	}
}
.flow__checkbox {
	background: #f0f0f0;
	padding: clamp(0.75rem, 0.614rem + 0.68vw, 1.125rem);
	margin: clamp(0.75rem, 0.614rem + 0.68vw, 1.125rem) 0;
	& ul {
		display: flex;
		flex-wrap: wrap;
		list-style: none;
		padding: 0;
		margin-top: clamp(0.375rem, 0.239rem + 0.68vw, 0.75rem);
		gap: 6px 12px;
		& li {
			display: flex;
			align-items: center;
			color: #646464;
			margin: 0;
			gap: 6px;
			&::before {
				content: '';
				display: block;
				height: 12px;
				width: 12px;
				background-image: url(/wp-content/uploads/2024/03/checkmark.svg);
				background-size: contain;
				background-position: center;
				background-repeat: no-repeat;
			}
		}
	}
}

.faq__box {
	margin-bottom: clamp(1.563rem, 1.222rem + 1.7vw, 2.5rem);
	padding-bottom: clamp(1.563rem, 1.222rem + 1.7vw, 2.5rem);
	border-bottom: 1px solid #eee;
	& h3 {
		font-weight: 600;
		margin: clamp(0.75rem, 0.568rem + 0.91vw, 1.25rem) 0;
	}
	& .question {
		color: #005a9e;
		&::before {
			content: '';
			display: inline-block;
			height: clamp(1.063rem, 0.994rem + 0.34vw, 1.25rem);
			width: clamp(1.063rem, 0.994rem + 0.34vw, 1.25rem);
			background-image: url(/wp-content/uploads/2024/04/icon_faq-blue.svg);
			background-size: contain;
			background-position: center;
			background-repeat: no-repeat;
			margin-right: clamp(0.25rem, 0.159rem + 0.45vw, 0.5rem)
		}
	}
	& .answer {
		color: #ff0e34
	}
	& p {
		margin-bottom: clamp(0.5rem, 0.364rem + 0.68vw, 0.875rem)
	}
}
.faq__box:last-of-type {
	border: none
}

.shop__img__flex {
	grid-area: button;
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
	margin-top: clamp(1rem, 0.455rem + 2.73vw, 2.5rem);
	& .shop__img__box {
		width: calc(50% - 8px);
		text-align: center;
		& img {
			height: 120px;
			object-fit: cover;
			object-position: center
		}
		& h4 {
			font-weight: 600;
			color: #1a1a1a;
			margin: clamp(0.25rem, 0.159rem + 0.45vw, 0.5rem) 0
		}
	}
}
#shop__mechanic__flex {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
	margin: clamp(1.5rem, 0.682rem + 4.09vw, 3.75rem) 0;
	& .shop__mechanic__box {
		width: calc(50% - 8px);
		& .mechanic__title, h3 {
			text-align: center;
			color: #1a1a1a;
			margin: clamp(0.375rem, 0.284rem + 0.45vw, 0.625rem) 0
		}
	}
}
.mechanic__title {
	font-weight: 600
}
.otokuisama_img {
	margin: clamp(1.5rem, 1.136rem + 1.82vw, 2.5rem) 0
}

.contact__page {
	& .cta__tel {
		margin: 0;
		padding: 0;
		border: none
	}
}
#contact__wrapper {
	margin: 24px 0;
	& .form__row {
		margin-bottom: clamp(1.125rem, 0.716rem + 2.05vw, 2.25rem);
		padding-bottom: clamp(1.125rem, 0.716rem + 2.05vw, 2.25rem);
		& > h4 {
			display: flex;
			align-items: center;
			justify-content: space-between;
			background: #eee;
			padding: 8px 8px 8px 10px;
			margin-bottom: 8px;
			border-radius: 6px;
			font-weight: 600;
		}
	}
	& input[type="date"], input[type="text"], input[type="tel"], input[type="email"], select, textarea {
		padding: clamp(0.375rem, 0.33rem + 0.23vw, 0.5rem);
		border-radius: clamp(0.375rem, 0.33rem + 0.23vw, 0.5rem);
		color: #808080;
		max-width: 100%;
		&::placeholder {
			color: #ddd
		}
	}
	& > h2 {
		color: #f00;
		font-weight: 700;
		margin-bottom: clamp(1.5rem, 0.955rem + 2.73vw, 3rem)
	}
}
.form__span {
	display: block;
	background: #ff0e34;
	color: #fff;
	font-size: 12px;
	font-weight: 500;
	padding: 4px 8px;
	border-radius: 4px;
}
.form__fre {
	background: #bcbcbc
}
.wpcf7-list-item:first-of-type {
	margin: 0
}
.form__input__date {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: clamp(0.5rem, 0.318rem + 0.91vw, 1rem);
	margin: 16px 0;
	& > p {
		display: flex;
		align-items: center;
		gap: clamp(0.5rem, 0.318rem + 0.91vw, 1rem)
	}
}
.form__input__flex {
	display: flex;
	align-items: baseline;
	gap: 8px;
	& input[type="text"] {
		width: 200px
	}
}
.form__discount__wrapper {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	& .form__discount__box {
		& h4 {
			font-weight: 600;
			border-left: 4px solid #f00;
			padding-left: 8px;
			margin-bottom: clamp(0.375rem, 0.239rem + 0.68vw, 0.75rem)
		}
		& .wpcf7-form-control {
			& .wpcf7-list-item {
				display: block;
				margin: 0
			}
		}
	}
}
.form__input__address {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 8px;
	& input {
		width: 100%;
	}
	& [data-name="pref"] {
		width: 140px
	}
	& [data-name="city"] {
		width: calc(100% - 148px)
	}
}
.wpcf7-not-valid-tip {
	color: #ff0e34;
	font-size: clamp(0.688rem, 0.642rem + 0.23vw, 0.813rem)
}
textarea {
	width: 100%
}
.acceptance__wrapper {
	text-align: center;
	& label {
		display: flex;
		align-items: baseline;
		justify-content: center;
		gap: clamp(0.375rem, 0.307rem + 0.34vw, 0.563rem);
		& p {
			display: inline
		}
	}
}
#contact__wrapper .button__wrapper {
	& input[type="submit"] {
		display: block;
		background: linear-gradient(90deg, rgba(255,0,0,1) 0%, rgba(255,50,0,1) 50%, rgba(255,150,125,1) 100%);
		background-size: 200% auto;
		background-position: 1% 50%;
		color: #fff;
		font-weight: 600;
		border: none;
		padding: clamp(0.875rem, 0.693rem + 0.91vw, 1.375rem);
		margin: 18px auto;
		width: 80%;
		border-radius: clamp(0.875rem, 0.739rem + 0.68vw, 1.25rem);
		transition: all .2s;
		&:disabled {
			background: #bcbcbc
		}
		&:hover {
			background-position: 99% 50%;
		}
	}
	text-align: center;
	& .wpcf7-spinner {
		display: block;
		margin: 0 auto
	}
}
#wpcf7-f5-p23-o1 .wpcf7-response-output {
	margin: 0 0 clamp(1.5rem, 1.227rem + 1.36vw, 2.25rem) 0;
	padding: clamp(0.75rem, 0.659rem + 0.45vw, 1rem);
	border: none;
	background: #eee;
	color: #808080;
	font-size: clamp(0.875rem, 0.83rem + 0.23vw, 1rem);
	line-height: 1.3;
	border-radius: clamp(0.75rem, 0.659rem + 0.45vw, 1rem)
}

.privacy__page {
	margin-bottom: clamp(1.375rem, 0.511rem + 4.32vw, 3.75rem);
	& h3 {
		font-weight: 700;
		color: #1a1a1a;
		margin: clamp(1.375rem, 0.966rem + 2.05vw, 2.5rem) 0 clamp(0.875rem, 0.648rem + 1.14vw, 1.5rem)
	}
	& p {
		margin-bottom: clamp(0.5rem, 0.409rem + 0.45vw, 0.75rem)
	}
	& li {
		margin: clamp(0.25rem, 0.205rem + 0.23vw, 0.375rem) 0
	}
}
.sub__list {
	list-style: none;
	counter-reset: count;
	padding: 0 0 0 26px;
	& > li:before {
		content: '(' counter(count) ')';
		counter-increment: count 1;
		display: inline-block;
		width: 26px;
		margin-left: -26px;
	}
}
.sub__sub__list {
	list-style-type: katakana;
	padding: 0 0 0 28px
}

.discount__2month {
	background: #f00;
	color: #fff;
	text-align: center;
	font-weight: 500;
	font-size: clamp(1.125rem, 1.034rem + 0.45vw, 1.375rem);
	padding: clamp(0.5rem, 0.318rem + 0.91vw, 1rem);
	margin-bottom: clamp(1rem, 0.818rem + 0.91vw, 1.5rem);
	line-height: 1.3;
	& span {
		display: block;
		font-size: 80%;
		font-weight: 400
	}
}


@media screen and (max-width: 599px) {
	.pc {display: none}
}


@media screen and (max-width: 999px) {
	.c-drawerNav__a span {
		display: flex;
		align-items: center;
		& img {
			display: block;
			max-height: 22px;
			max-width: 22px;
			margin-right: 10px;
			filter: invert(100%) sepia(0%) saturate(7494%) hue-rotate(128deg) brightness(111%) contrast(100%);
		}
	}
	#top__contents #campaign__wrapper {
		padding-top: 12px;
		padding-bottom: 6px;
		padding-left: 4px;
		padding-right: 4px
	}
	.reason__page section {
		position: relative
	}
	.l-footer {
		padding-bottom: clamp(3rem, 2.273rem + 3.64vw, 5rem)
	}
	#voice__wrapper h1 br {
		display: none
	}
}


/*******************************************************
                    * タブレット *
 ******************************************************/

@media screen and (min-width: 600px) {
	.reason__point {
		& .reason__point__box {
			width: calc(50% - 8px)
		}
	}
	.discount__flex {
		& .discount__box {
			width: calc(50% - 6px)
		}
		& .hayawari__box {
			width: 100% !important
		}
	}
	.service__flex {
		& .service__box {
			width: calc(50% - 6px)
		}
	}
	.voice__box {
		display: flex;
		align-items: flex-start;
		justify-content: space-between;
		& .voice__person {
			display: flex;
			flex-wrap: wrap;
			width: 140px
		}
		& .voice__text {
			width: calc(100% - 160px);
			& p:first-child {
				margin: 0
			}
		}
	}
	#shop__wrapper > img {
		height: 360px;
		object-fit: cover;
		object-position: center
	}
	.shop__img__flex {
		gap: 24px;
		& .shop__img__box {
			width: calc(50% - 12px);
			& img {
				height: 220px
			}
		}
	}
	#shop__mechanic__flex {
		gap: 24px;
		& .shop__mechanic__box {
			width: calc(50% - 12px)
		}
	}
	.w-footer.-widget2 {
		display: grid;
		grid-template-areas:
			"logo   menu"
			"banner banner";
		grid-template-columns: 300px 1fr;
		gap: 30px 18px;
		& #block-12 {
			grid-area: logo;
			& p {
				font-size: clamp(0.75rem, 0.705rem + 0.23vw, 0.875rem)
			}
		}
		& #nav_menu-3 {
			grid-area: menu;
			margin: 0;
			& ul {
				gap: 6px 0;
				& li {
					font-size: 14px;
					border-bottom: none;
					border-right: 1px solid;
					border-left: 1px solid;
					width: auto;
					& a {
						padding: 3px 12px
					}
				}
			}
		}
		& #block-13 {
			grid-area: banner;
			margin: 0;
			& #banner__area {
				gap: 16px;
				& a {
					width: calc(50% - 8px);
					&:hover {
						opacity: .8
					}
				}
			}
		}
	}
	#fixed__menu__wrapper {
		& h4,a {
			padding: 16px 50px
		}
	}
	.p-fixBtnWrap {
		bottom: 80px
	}
	.reason__page {
		& .reason__section__image {
			height: 340px
		}
	}
	.price__box {
		grid-template-areas:
			"head head"
			"left right"
			"left total";
		gap: 14px;
		& .price__head {
			background-size: auto 100%;
			& img {
				height: 60px
			}
			& p {
				margin-top: 80px
			}
		}
	}
	.flow__page .flow__section img {
		height: 360px
	}
}


/*******************************************************
                        * PC *
 ******************************************************/

@media screen and (min-width: 1000px) {
	.sp { display: none }
	a{ transition: all .2s }
	#header__bar {
		& p {
			width: 1200px;
			margin: 0 auto
		}
	}
	[data-btns=r-l][data-logo=left] .l-header__body {
		grid-template-areas:
			"logo cta"
			"menu menu";
		grid-template-columns: 600px 1fr;
		& .l-header__center {
			grid-area: logo;
		}
		& .l-header__left {
			grid-area: cta;
			margin: 20px 0;
			justify-self: right;
			& a {
				display: block;
				text-align: center;
				background: #fff;
				padding: 12px 28px;
				border-radius: 50vh;
				box-shadow: 3px 3px 8px rgba(0,0,0,.2);
				& h4 {
					font-size: 16px;
					font-weight: 600;
					color: #f00;
				}
				& h2 {
					display: flex;
					align-items: center;
					justify-content: center;
					color: #f00;
					font-size: 24px;
					font-weight: 700;
					gap: 6px;
					& img {
						width: 36px;
						height: auto;
						filter: invert(18%) sepia(83%) saturate(6848%) hue-rotate(357deg) brightness(99%) contrast(112%);
					}
				}
				& .header__tel {
					font-family: "Manrope", sans-serif;
					font-weight: 800;
					font-size: 26px;
					letter-spacing: 0
				}
				& p {
					color: #808080;
					font-size: 12px;
					letter-spacing: -0.07em
				}
				&:hover {
					opacity: .8
				}
			}
			& .header__cta:first-child {
				margin-right: 30px
			}
		}
		& .l-header__right {
			grid-area: menu;
			margin: 0 calc(50% - 50vw);
			background: #fff;
			width: 100vw;
			justify-self: center;
			& .c-gnavWrap {
				width: 1200px;
				margin: 0 auto
			}
		}
	}
	.has-image>.c-headLogo {
		height: auto;
		width: 540px;
		&:hover {
			opacity: .8
		}
	}
	.l-header__body .c-gnavWrap {
		width: 100%
	}
	.c-gnav {
		border-left: 1px solid #005a9e;
		& > * {
			border-right: 1px solid #005a9e;
			flex-grow: 1
		}
	}
	.c-gnav__li > .c-gnav__a {
		padding: 14px;
		transition: all .2s;
		color: #005a9e;
		& span {
			display: block;
			font-size: 15px;
			& img {
				height: 50px;
				width: auto;
				margin: 0 auto 10px;
				filter: invert(21%) sepia(55%) saturate(3435%) hue-rotate(190deg) brightness(93%) contrast(101%);
			}
		}
		&:hover {
			background: #ccdeec
		}
	}
	.link__btn {
		max-width: 600px;
		margin-left: auto;
		margin-right: auto;
		&::after {
			top: calc(50% - 10px);
			right: 20px;
			height: 20px;
			width: 20px;
		}
		&:hover {
			background-position: 99% 50%
		}
	}
	.pdf__btn {gap: 12px;
		&::after {
			right: auto;
			top: auto;
			height: 28px;
			width: 28px;
		}
	}
	#top__contents section {
		& > h1 {
			&::before {
				font-size: 175%;
				top: -40px
			}
		}
	}
	#top__contents #campaign__wrapper {
		padding-top: 10px;
		padding-bottom: 0
	}
	.reason__point {
		gap: 30px;
		& .reason__point__box {
			width: calc(33% - 17px)
		}
	}
	.price__img {
		gap: 24px;
		& .price__kogata, .price__chugata, .price__ogata {
			width: calc(33% - 13px)
		}
	}
	.discount__wrapper {
		padding: 80px 48px 36px;
		margin-top: 60px;
		border-radius: 40px;
		&::before {
			left: calc(50% - 100px);
			border-right: 100px solid transparent;
			border-left: 100px solid transparent;
			border-top: 60px solid #fff;
		}
		& h1:before {
			font-size: 175%;
			top: -40px
		}
	}
	.discount__flex {
		gap: 18px;
		& .discount__box {
			grid-template-columns: 54px 1fr auto;
			width: calc(50% - 9px);
			padding: 24px;
			border-radius: 24px;
			& h1 {
				font-size: 60px;
				line-height: 1
			}
		}
		& .hayawari__box {
			grid-template-areas:
				"number title price"
				"number text price";
			grid-template-columns: 54px 260px 1fr;
			& .hayawari__inner {
				margin: 0;
				padding-left: 16px;
				gap: 12px 36px;
				& h3 {
					font-size: clamp(1.25rem, 1.159rem + 0.45vw, 1.5rem);
					& .hayawari__before {
						font-size: 14px;
						padding: 8px;
						margin-right: 12px;
						border-radius: 8px
					}
				}
			}
		}
	}
	.service__flex {
		gap: 24px 36px;
		& .service__box {
			width: calc(50% - 18px);
			& .service__content {
				width: calc(100% - 200px);
				padding: 24px;
				& h5 {
					& span {
						height: 24px;
						width: 24px
					}
				}
			}
			& > img {
				width: 200px
			}
		}
	}
	.voice__box {
		& .voice__person {
			width: 200px;
			padding: 16px;
			border-radius: 24px
		}
		& .voice__text {
			width: calc(100% - 220px)
		}
	}
	#shop__wrapper {
		display: grid;
		grid-template-areas:
			"info   img"
			"map    map"
			"button button";
		grid-template-columns: 1fr 600px;
		& .shop__content {
			grid-area: info;
			& h1 {
				text-align: left;
				margin-bottom: 36px
			}
			& #shop__info__table {
				gap: 18px;
				& .shop__info__row {
					& h3 {
						width: 160px
					}
					& p {
						width: calc(100% - 160px)
					}
				}
			}
		}
		& > img {
			grid-area: img;
			height: 400px
		}
		& > iframe {
			grid-area: map;
			height: 450px;
			margin-top: 36px
		}
		& .link__btn {
			grid-area: button;
			width: 600px
		}
	}
	#cta__wrapper {
		display: flex;
		align-items: flex-start;
		flex-direction: row;
		& > div {
			width: 50%;
			& h4 {
				width: 60%
			}
			& .cta__bold {
				& img {
					height: 36px
				}
			}
		}
	}
	.cta__tel {
		margin: 0;
		padding: 0;
		border-bottom: none;
		border-right: 2px solid #fff;
		& a {
			font-size: 52px
		}
	}
	.cta_web {
		& a {
			font-size: 40px
		}
	}
	.l-footer__widgets>.l-container {
		display: block
	}
	.l-footer__widgets .w-footer+.w-footer {
		margin: 0
	}
	.w-footer.-widget2 {
		grid-template-areas:
			"logo menu"
			".    banner";
		grid-template-columns: 460px 1fr
	}
	#footer__logo {
		& img {
			width: 400px;
			margin-bottom: 8px
		}
	}
	.w-footer.-widget2 {
		& #nav_menu-3 {
			& ul {
				& li {
					font-size: 16px;
					& a {
						padding: 8px 24px
					}
				}
			}
		}
	}
	#fixed__menu__wrapper {
		right: auto;
		width: 600px;
		border-radius: 0 20px 0 0;
		overflow: hidden;
		& h4 {
			flex-grow: 1;
		}
		& a {
			display: block;
			text-align: center;
			padding: 16px 60px;
			&:hover {
				opacity: .8
			}
			& img {
				width: auto;
				height: 30px;
				margin-bottom: 8px
			}
		}
	}
	.wp-show-posts-image img {
		width: 200px
	}
	.reason__page {
		& section {
			display: flex;
			align-items: stretch;
			justify-content: space-between;
			& .reason__section__main {
				width: calc(100% - 580px);
				& .link__btn {
					width: 80%
				}
				& h3:before {
					height: 26px;
				}
				& li {
					padding: 4px 0
				}
			}
			& .reason__section__image {
				position: relative;
				width: 440px;
				height: auto;
				margin: 0;
				& h1 {
					font-size: 80px;
					top: -43px
				}
			}
		}
		& section:nth-of-type(odd) {
			flex-direction: row-reverse
		}
	}
	.reason__page section:nth-of-type(2) {
		& h3:before {
			width: 26px
		}
	}
	.reason__page section:nth-of-type(4) {
		& h3:before {
			width: 34px
		}
	}
	.reason__page section:nth-of-type(5) {
		& h3:before {
			width: 38px
		}
	}
	.reason__img__flex {
		gap: 22px;
		& img {
			width: calc(50% - 11px)
		}
	}
	.price__box {
		grid-template-areas:
			"head left right"
			"head left total";
		grid-template-columns: 440px 1fr 1fr;
		& .price__head {
			position: relative;
			background-size: auto 80%;
			background-position: right center;
			& img {
				height: 70px;
			}
			& p {
				position: absolute;
				margin: 0;
				bottom: 0;
				left: 0
			}
		}
	}
	.inspection-item__wrapper {
		& .inspection-item__box {
			gap: 36px;
			& .inspection-item {
				width: calc(25% - 27px);
			}
		}
	}
	.flow__page .flow__section {
		display: grid;
		grid-template-areas:
			"title title"
			"text img";
		grid-template-columns: 1fr 400px;
		gap: 30px;
		& h2 {
			grid-area: title
		}
		& .flow__text {
			grid-area: text
		}
		& img {
			grid-area: img;
			height: 260px
		}
	}
	.flow__checkbox ul {
		gap: 8px 24px;
		& li:before {
			height: 16px;
			width: 16px
		}
	}
	.shop__img__flex {
		gap: 28px;
		& .shop__img__box {
			width: calc(33% - 16px);
			& img {
				height: 240px
			}
		}
	}
	#shop__mechanic__flex {
		gap: 28px;
		& .shop__mechanic__box {
			display: flex;
			align-items: center;
			justify-content: space-between;
			width: calc(50% - 14px);
			& img {
				width: 220px;
				height: 220px;
				object-fit: cover;
				object-position: center
			}
			& .shop__mechanic__content {
				width: calc(100% - 250px);
				& .mechanic__title, h3 {
					text-align: left
				}
			}
		}
	}
	.contact__page {
		& #cta__wrapper {
			& .cta__tel {
				width: 100%
			}
		}
	}
	#contact__wrapper {
		& .form__row {
			display: flex;
			flex-wrap: wrap;
			align-items: center;
			justify-content: space-between;
			border-bottom: 1px solid #eee;
			& > h4 {
				width: 350px;
				justify-content: flex-start;
				background: none;
				gap: 16px
			}
			& .form__input {
				width: calc(100% - 400px)
			}
		}
	}
	.form__input__address {
		justify-content: flex-start;
		gap: 16px;
		& [data-name="pref"] {
			width: 140px
		}
		& [data-name="city"] {
			width: 200px
		}
		& [data-name="address"] {
			flex-grow: 1
		}
	}
	.form__discount__wrapper {
		justify-content: flex-start;
		& .form__discount__box {
			width: 33%
		}
	}
	.sub__sub__list {
		padding-left: 33px
	}
}