?@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Zen+Kaku+Gothic+New:wght@400;700&family=Zen+Old+Mincho&display=swap');
/* CSS Document */

body {
	    font-family: 'Noto Sans JP', sans-serif;
	scroll-behavior: smooth;
}
a{
	transition: all 0.3s ease;
}
.sp,
.br-sp{
	display:none;
}
.fw-700{
	font-weight: 700;
}
.fs-small{
	font-size: .875rem;
}
.marker{
	background: linear-gradient(transparent 70%, #ffff00 30%);
}
.fc-red{
	color: #c1272d;
}
:where(.c-entry__content>:not(.alignleft):not(.alignright):not(.alignfull)){
	max-width: none;
}
.p-entry-content{
	padding: 0;
}
.p-entry-content>:where(:not(:first-child)){
	margin-top: 0;
}
.l-contents__main .c-section:first-child{
	padding-top: 0;
}
.l-contents__main .c-section:last-child{
	padding-bottom: 0;
}
.container{
	max-width: 60rem;
	margin: 0 auto;
	padding: 0 1rem;
}
@media (max-width: 767px) {
	.pc,
	.br-pc{
		display:none;
	}
	.sp
	.br-sp{
		display:block;
	}
}

/* =======================================
    index
======================================= */
.mainview{
	position: relative;
}
.mainview img{
	display: block;
	width: 70%;
	margin-left: auto;
}
.mainview-text{
	position: absolute;
	top: 50%;
	right: 60%;
}
.mainview-text .marker{
	display: inline-block;
	font-size: 3rem;
	font-weight: 700;
	line-height: 1;
	color: #000;
	margin-bottom: 1rem;
	padding-left: 1rem;
}
.mainview-text p:last-child{
	font-size: 1.5rem;
	text-shadow: 1px 1px 0 #FFF, -1px -1px 0 #FFF, -1px 1px 0 #FFF, 1px -1px 0 #FFF, 0px 1px 0 #FFF, 0 -1px 0 #FFF, -1px 0 0 #FFF, 1px 0 0 #FFF;
}
.wrap-main-bottom{
	background-color: #0071bc;
	padding: 2rem;
}
.main-bottom{
	display: flex;
	justify-content: space-between;
	gap: 2rem;
	max-width: 52rem;
	margin: 0 auto;
}
.main-bot01,
.main-bot02{
	width: 50%;
	text-align: center;
	background-color: #fff;
	border-radius: 1.5rem;
	padding: 1.5rem 1rem .75rem;
}
.main-bot01{
	font-size: 1.5rem;
	line-height: 1.4;
}
.main-bot03{
	font-size: 2.5rem;
	font-weight: 700;
}
.main-bot01 .fc-red{
	display: inline-block;
	font-size: 2.5rem;
	padding: 0 .5rem;
}
.main-bot01 .fs-small{
	text-align: right;
	padding-top: 1rem;
}
.main-bot02{
	font-size: 2rem;
	font-weight: 700;
	padding-bottom: 1.5rem;
}
.main-bot02 .marker{
	font-weight: normal;
}
/*SERVICE*/
#service{
	background-color: #f2f2f2;
	padding: 3rem 0;
}
#service h1{
	font-size: 3rem;
	font-weight: normal;
	text-align: center;
	color: #0071bc;
	margin-bottom: 1rem;
}
#service h1 + p{
	font-size: 1.25rem;
	text-align: center;
	margin-bottom: 3rem;
}
#service section{
	text-align: center;
	background-color: #fff;
	border-radius: 1.5rem;
	box-shadow: 0 0 10px 1px #999;
	margin-bottom: 2rem;
	padding: 3rem 2rem;
}
.service01 .icon-service{
	width: 70px;
}
.service02 .icon-service{
	width: 160px;
}
.service03 .icon-service{
	width: 140px;
}
#service h2{
	font-size: 2rem;
	color: #ba5636;
	margin: 1rem 0 2rem;
}
.ser-box{
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 2rem;
	max-width: 50rem;
	margin: 0 auto;
}
.ser-box img{
	width: 42%;
}
.ser-text{
	flex: 1;
	text-align: left;
}
.btn-blue{
	color: #fff;
	background-color: #0071bc;
}
.btn-blue:hover{
	background-color: #0083da;
}
.btn-yellow{
	color: #000;
	background-color: #fcce21;
}
.btn-yellow:hover{
	background-color: #ffdb56;
}
.btn-service{
	display: block;
	width: 50%;
	font-weight: 700;
	text-decoration: none;
	text-align: center;
	border-radius: 3rem;
	margin-top: 1rem;
	margin-left: 46%;
	padding: .75rem;
}
/*MESSAGE ごあいさつ*/
#message{
	background-color: #e5eff9;
	padding: 5rem 0;
}
#message h1{
	font-size: 3rem;
	text-align: center;
	margin-bottom: 3rem;
}
#message h1 span{
	display: block;
	font-size: 1rem;
}
.mes-box p{
	margin-bottom: 1.5rem;
}
.mes-box ul{
	list-style: none;
	margin: 0 0 1.5rem;
	padding: 0;
}
.mes-box li{
	position: relative;
	padding-left: 1rem;
}
.mes-box li::before{
	content: "・";
	position: absolute;
	top: 0;
	left: 0;
}
/*VOICE お客様の声*/
#voice{
	background-color: #f4f3df;
	padding: 5rem 0;
}
#voice h1{
	font-size: 3rem;
	text-align: center;
	color: #42210b;
	margin-bottom: 3rem;
}
#voice h1 span{
	display: block;
	font-size: 1rem;
}
.voice01{
	display: flex;
	justify-content: space-between;
	gap: 3rem;
}
.voice01 figure{
	width: 35%;
}
.voice01 figcaption{
	font-size: 1.25rem;
	text-align: center;
}
.voice-right{
	flex: 1;
}
#voice section{
	margin-bottom: 3rem;
}
#voice h2{
	font-size: 2rem;
	color: #42210b;
	border-bottom: solid 5px #42210b;
	margin-bottom: 1rem;
	padding-bottom: .5rem;
}
#voice p{
	margin-bottom: 1.35rem;
}
#voice p:last-child{
	margin-bottom: 0;
}
/*company 会社概要*/
#company{
	padding: 5rem 0;
}
#company h1{
	font-size: 3rem;
	text-align: center;
	margin-bottom: 2rem;
}
#company h1 span{
	display: block;
	font-size: 1rem;
}
#company dl{
	display: flex;
	max-width: 47rem;
	border-top: solid 1px #ccc;
	margin: 0 auto;
	padding: .75rem;
}
#company dl:last-child{
	border-bottom: solid 1px #ccc;
}
#company dt{
	width: 8rem;
	text-align: center;
}
#company dd{
	flex: 1;
	padding-left: 2rem;
}
#company a{
	display: inline-block;
	margin-left: 1rem;
}
/*CONTACT お問い合わせ*/
.contact{
	padding: 5rem 0;
}
.contact-title{
	font-size: 3rem;
	text-align: center;
	margin-bottom: 2rem;
}
.contact-title span{
	display: block;
	font-size: 1rem;
}
.contact-text{
	text-align: center;
	margin-bottom: 2rem;
}
.smf-form{
	border-top: solid 1px #eee;
}
.smf-item{
	align-items: center;
	border-bottom: solid 1px #eee;
}
.smf-form input{
	width: 100%;
}
.smf-item__label{
	display: inline-block;
	vertical-align: middle;
}
.smf-item__description{
	display: inline-block;
	vertical-align: middle;
	font-size: .75rem;
	color: #fff;
	background-color: #c1272d;
	border-radius: 4px;
	margin: 0 0 0 .5rem;
	padding: 0 5px;
}
.smf-action .smf-button-control__control{
	color: #fff;
	border: none;
	background: #0071bc;
}
.smf-action .smf-button-control__control:hover{
	background: #0083da;
}
.smf-complete-content{
	padding-top: 2rem;
}
.thanks-text{
	text-align: center;
}
@media (max-width: 1400px) {
	.mainview-text{
		right: inherit;
		left: 3rem;
	}
}
@media (max-width: 1024px) {
	.mainview-text .marker{
		font-size: 2.5rem;
	}
}
@media (max-width: 960px) {
	.main-bot01{
		font-size: 1.25rem;
	}
	.main-bot03,
	.main-bot01 .fc-red{
		font-size: 2rem;
	}
	.main-bot01 .fs-small{
		padding-top: .5rem;
	}
	.main-bot02{
		font-size: 1.875rem;
	}
}
@media (max-width: 767px) {
	.mainview img{
		width: calc(100% - 10px);
	}
	.mainview-text{
		position: inherit;
		top: inherit;
		left: inherit;
		text-align: center;
		padding: 2rem 1rem;
	}
	.mainview-text .marker{
		font-size: 2.25rem;
	}
	.wrap-main-bottom{
		padding: 2rem 1rem;
	}
	.main-bottom{
		flex-direction: column;
		max-width: 32rem;
	}
	.main-bot01,
	.main-bot02{
		width: 100%;
	}
	#service h1{
		font-size: 2.5rem;
		margin-bottom: .5rem;
	}
	#service h1 + p{
		font-size: 1rem;
		margin-bottom: 2rem;
	}
	#service section{
		padding: 2rem 1rem;
	}
	.service01 .icon-service{
		width: 60px;
	}
	#service h2{
		font-size: 1.75rem;
		margin-bottom: 1rem;
	}
	.ser-box{
		flex-direction: column;
		gap: 1rem;
	}
	.ser-box img{
		width: 100%;
	}
	.btn-service{
		width: 100%;
		margin-left: 0;
	}
	#message{
		padding: 3rem 0;
	}
	#message h1{
		font-size: 2rem;
		margin-bottom: 2rem;
	}
	#voice{
		padding: 3rem 0;
	}
	#voice h1{
		font-size: 2rem;
		margin-bottom: 1.5rem;
	}
	.voice01{
		flex-direction: column;
		align-items: center;
		gap: 1rem;
	}
	.voice01 figure{
		width: 80%;
		max-width: 20rem;
	}
	.voice01 figcaption{
		font-size: 1rem;
	}
	#voice section{
		margin-bottom: 2rem;
	}
	#voice h2{
		font-size: 1.5rem;
		border-width: 2px;
		padding-bottom: 0;
	}
	#company{
		padding: 3rem 0;
	}
	#company h1,
	.contact-title{
		font-size: 2rem;
	}
}
@media (max-width: 640px) {
	#company dl{
		flex-direction: column;
	}
	#company dt{
		width: 100%;
		text-align: left;
	}
	#company dd{
		padding-left: 0;
	}
}
@media (max-width: 480px) {
	.mainview-text .marker{
		font-size: 1.5rem;
	}
	.mainview-text p:last-child{
		font-size: 1.25rem;
	}
	#service section{
		padding: 1.25rem 1rem 2rem;
	}
	.service01 .icon-service{
		width: 50px;
	}
	.service02 .icon-service{
		width: 130px;
	}
	.service03 .icon-service{
		width: 90px;
	}
	#service h2{
		font-size: 1.5rem;
	}
	#voice{
		padding: 2rem 0;
	}
}