@charset "utf-8";
/*
Theme Name: office-zousaku2024
Author: YES-REFORM CO., LTD.
*/

/* Body
========================================== */
html, body{
	width: 100%;
	font-size:62.5%;/*10px*/
}
body {
	color:var(--txt-color);
	line-height:1.8;
	font-size:1.6rem;
	font-family: "Zen Kaku Gothic Antique", sans-serif;
	font-optical-sizing: auto;
	font-weight: 500;
	font-style: normal;
}
.tab {
	display: none !important;
}
.sp {
	display: none !important;
}
@media screen and (max-width: 840px) {
	body{
		word-wrap:break-word;
		font-size: 1.6rem;
	}
	.tab {
		display: block !important;
	}
}
@media screen and (max-width: 599px) {
	.pc {display: none !important;}
	.sp {display: block !important;}
}

.txt_green {
	color: #8bc627!important;
}

.txt_orange {
	color: #f98926!important;
}

/* header
========================================== */
.headerArea{
	position: absolute;
	top:0;
	left: 50%;
	z-index: 1000;
	transform: translateX(-50%);
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
	max-width: 1500px;
	height: 100px;
	transition: all .5s;
}
.headerLogo{margin-left: 20px; line-height: 2.5;}
.headerLogo img{max-width: 100%;height: auto;}
.headerLogo a{
	display: flex;
	align-items: center;
	column-gap: 1em;
	color: #fff; text-decoration: none;
}
.headerLogo a:hover img{
	transform: translatey(0);
}
.headerLogo span{
	font-size: 2rem;
	font-weight: 700;
}
.headerArea .inner{
	display: flex;
	justify-content:flex-end;
	align-items: center;
	padding-right: 1em;
}
.headerInfo .tel{
	text-align: center;
	font-family: "Cormorant", serif;
	font-optical-sizing: auto;
	font-style: normal;
	color: #fff;
	line-height: 1;
}
.headerInfo .tel a{
	color: #fff;
	text-decoration: none;
}
.headerInfo .tel span{
	display: block;
}
.headerInfo .tel .number{
	font-size:3rem;
	letter-spacing: 2px;
}
.headerInfo .tel .hours{
	padding-left: 1em;
	letter-spacing: 1px;
}
@media screen and (max-width:1124px){

}
@media screen and (max-width:840px){
	.headerArea{position: absolute;background: none;border: none;height: 50px;}
	.headerArea .inner {margin-top: 2em;}
	.headerLogo{padding-top: 5px;margin-left: 10px;width: auto;}
	.headerLogo img{
		/* height: 40px;
		width: auto; */
		width: 11%;
		max-width: 50px;
	}
	.headerLogo a{
		column-gap: 3vw;
	}
	.headerInfo{margin-bottom: 20px;text-align: center;}

}
@media screen and (max-width:599px) {
	.headerLogo span{
		font-size: 3.3vw;
	}
	.headerInfo .tel .number {
		font-size: 5vw;
	}
	.headerInfo .tel .hours {
		font-size: 0.9em;
	}
}
@media screen and (max-width:390px) {
	/* .headerArea {
		display: block;
	} */
	.headerLogo{
		padding-top: 10px;
	}
	.headerLogo span{
		font-weight: 500;
	}
	/* .headerInfo .tel{
		display: none;
	} */
}


/* mv
========================================== */
.mvWrap{
	position: relative;
	background: url(images/mv.jpg) center no-repeat;
	background-size: cover;
}
.mvWrap::after{
	content: '';
	display: block;
	position: absolute;
	top: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.26);
	z-index: 2;
}
.mvWrap img{
	width: 100%;
}
.mvWrap .mvInner{
	position: relative;
	z-index: 10;
	width: 100%;
	padding: 110px 0 5%;
}
.mvWrap .mvInner img{
	width: auto;
}
.mvWrap .mvInner .mvPoint > div > img{
	width: 100%;
	max-width: 200px;
}
.mvWrap .mvInner .mvText{
	margin-bottom: 2.8em;
	color: #fff;
	font-weight: 400;
}
.mvWrap .mvInner .mvText .mvText_bg{
	margin: 0;
	padding: 0px 0px 20px 20px;
	background: url(images/mvtext_bg.png)  center no-repeat;
	background-size: 100%;
}
.mvWrap .mvInner .mvText h1{
	line-height: 2;
	letter-spacing: 3px;
	font-size: clamp(2.8rem, 3.3vw, 3.6rem);
	font-weight: 500;
	text-align: center;
	text-shadow: 1px 1px 3px rgb(30 38 30 / 60%);
}
.mvWrap .mvInner .mvText h1 span{
	display: inline-block;
	margin-right: 5px;
	padding: 0 0.3em 0.1em;
	background: var(--main-color);
	font-size: 1.1em;
	line-height: 1.5;
}
.mvWrap .mvInner .mvPoint{
	display: flex;
	justify-content: center;
	align-items: center;
	column-gap: 1em;
	max-width: 840px;
	margin: 0 auto 2.4em;
	padding: 0 0.5em;
}
.mvWrap .mvInner .mvPoint > div{
	width: calc((100% - 1em * 2) / 3);
	text-align: center;
}
/* .mvWrap .mvInner .mvPoint div{
	margin: 0 10px;
} */
/* .mvWrap .mvInner .mvPoint img{
	padding-left: 18px;
} */
.mvWrap .mvInner .mvPoint p{
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 0.6em 0 0.8em;
	background: var(--c-grey);
	font-size: clamp(1.5rem, 2vw, 2rem);
	font-weight: 600;
	text-align: center;
	color: #fff;
	line-height: 1.5;
	border-radius: 4px;
}
.mvWrap .mvInner .contactBtn p{
	margin-bottom: 0.7em;
}
.thanks .mvWrap{
	height: 330px;
}

@media screen and (max-width:840px){
	.mvWrap{margin-top: 0;}
	.mvWrap .mvInner{top: 10%;}
	.mvWrap .mvInner .contactBtn p{
		margin-bottom: 0.5em;
		font-size: min(4.5vw, 2rem);
	}
	.thanks .mvWrap{
		height: 39vw;
	}
}
@media screen and (max-width:768px) {
	.mvWrap .mvInner .mvText h1 {
		font-size: clamp(2rem, 4.7vw, 3.6rem);
	}
}
@media screen and (max-width:599px){
	.mvWrap .mvInner {
		padding: 85px 0 10%;
	}
	.mvWrap .mvInner img {
		width: 100%;
	}
	.mvWrap .mvInner .mvText{
		margin-bottom: 2.8EM;
	}
	.mvWrap .mvInner .mvText h1{
		letter-spacing: 1px;
	}
	.mvWrap .mvInner .mvText .mvText_bg{
		padding: 0 4px 3px 6px;
	}
	.mvWrap .mvInner .mvPoint{
		column-gap: 0.5em;
	}
	.mvWrap .mvInner .mvPoint p{
		height: calc(1em * 1.6 * 4 + 1.4em );
	}
	.mvWrap .mvInner .mvPoint img {
		width: 100%;
	}
}
@media screen and (max-width:399px) {
	.mvWrap .mvInner .mvPoint div {
		width: 31%;
	}
	.mvWrap .mvInner .mvPoint p {
		padding: 5px;
		font-weight: 400;
		font-size: 3.7vw;
	}
}
@media screen and (max-width:360px) {
	.mvWrap .mvInner .mvPoint {
		margin: 0 auto 20px;
	}
}
/* @media screen and (max-width:320px) {
	.mvWrap .mvInner .mvPoint p{
		height: auto;
		font-size: 1.4rem;
	}
} */

/* contents
========================================== */
.contents{
	overflow: hidden;
	margin:0 auto;
	width: 100%;
	background-color: var(--bg-color);
	}
.contents p+p{margin-top: 1.5em;}
.Inner{
	width:1000px;
	margin: 0 auto;
	padding: 0;}

@media screen and (max-width:1200px){
	.Inner{
		width: 100%;
		padding: 0 30px;}
}
@media screen and (max-width:599px){
	.Inner{padding: 0 20px;}
}


/* contactBtn
========================================== */
.contactBtn {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}
.contactBtn p {
	width: 100%;
	margin-bottom: 10px;
	font-weight: 500;
	color: #fff;
	text-align: center;
	letter-spacing: 2px
}
@media screen and (max-width:599px) {
	.contactBtn{
		padding: 0 20px;
		width: 92%;
		margin: 0 auto;
	}
	.contactBtn img{
		width: 100%;
	}
}


/* Top
========================================== */
.topArea{
	padding: 80px 0 0;
	background: #fff;
}
.topArea .Inner{
	width: 100%;
	margin-bottom: 80px;
	background: url(images/top_problem_bg.jpg) center;
	/* background-size: cover; */
}
.topArea .topArea__cont{
	width: 100%;
	max-width: 1000px;
	margin: 0 auto;
	padding: 50px 30px 80px;
}
.topArea h2{
	text-align: center;
	margin-bottom: 1.8em;
}
.topArea h2 > img {
	display: inline-block;
	padding: 0 0.8em;
	max-width: 100%;
}
.topArea .Problem{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	row-gap: 2.4em;
}
.topArea .Problem li{
	display: flex;
	flex-direction: column;
	align-items: center;
	column-gap: 3vw;
	width: 24%;
}
.topArea .Problem_icon{
	width: 100px;
	text-align: center;
}
.topArea .Problem_icon img{
	width: 100%;
}
.topArea .Problem_txt{
	height: 100%;
	padding: 1em 1.4em;
	background: #fff;
	font-weight: 600;
	line-height: 1.6;
	border-radius: 4px;
}
.topAreaBtn{
	padding: 100px 0 300px;
	position: relative;
	background: url(images/top_btn_bg.jpg) top center no-repeat;
	background-size: cover;
}
.topAreaBtn::after {
	content: '';
	position: absolute;
	top: 0;
	left: 50%;
	transform: translate(-50%, -50%);
	background: url(images/top_arrow.png) center no-repeat;
	width: 142px;
	height: 101px;
}

@media screen and (max-width:840px){
	.topArea .topArea__cont {
		padding: 50px 0 80px;
	}
	.topArea .Problem{
		justify-content: space-around;
	}
	.topArea .Problem li{
		width: 45%;
	}
}
@media screen and (max-width:599px) {
	.topArea {
		padding: 20px 0 0;
	}
	.topArea .Inner {
		margin-bottom: 60px;
		padding: 40px 20px 30px;
	}
	/* .topArea h2{
		padding: 0 20px;
	} */
	.topArea h2 img{
		width: 100%;
	}
	.topArea .topArea__cont {
		padding: 0 0 10%;
	}
	.topAreaBtn h2{
		width: 68%;
		margin: 0 auto 3.5em;
	}
	.topArea .Problem li {
		width: 100%;
	}
	.topArea .Problem li:nth-child(2n-1) {
		flex-direction: row;
	}
	.topArea .Problem li:nth-child(2n) {
		flex-direction: row-reverse;
	}
	.topArea .Problem_icon{
		width: 25%;
	}
	.topArea .Problem_icon img{
		width: 100%;
	}
	.topArea .Problem_txt{
		width: 75%;
		height: auto;
	}
	.topAreaBtn {
		padding: 60px 0 250px;
	}
	.topAreaBtn::after{
		width: 20%;
		background-size: contain;
	}
}


/* Example
========================================== */
.exampleArea {
	position: relative;
	margin-top: -250px;
	padding-top: 100px;
	/*background: url(images/example_bg.png) no-repeat;
	background-size: 100%;*/
}
.exampleArea::before{
	content: '';
	position: absolute;
	top: 0;
	clip-path: polygon(50% 0, 100% 50%, 100% 100%, 0 100%, 0 50%);
	width: 100%;
	height: 300px;
	background-color: var(--bg-color);
}
.exampleCase{
	padding: 80px 0;
}
.exampleList{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	counter-reset: number 0;
}
.exampleList li{
	position: relative;
	width: 30%;
	margin-bottom: 50px;
	background: #fff;
	box-shadow: 6px 6px var(--shadow-color);
	color: var(--txt-color);
	font-weight: 500;
}
.exampleList li::before{
	counter-increment: number 1;
	content: "0" counter(number);
	position: absolute;
	top: 2px;
	left: -2px;
	font-family: "Cormorant", serif;
	font-optical-sizing: auto;
	font-style: normal;
	font-size: 8rem;
	color: var(--bg-color);
	line-height: 1rem;
}
.exampleList li.numberType01::before{
	top: 22px;
}
.exampleList li .exampleItem{
	display: flex;
	flex-direction: column;
	height: 100%;
}
.exampleList li .exampleCont{
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	row-gap: 3em;
	height: 100%;
	padding: 25px 20px;
}
.exampleList li .exampleInfoWrap{
	display: flex;
	justify-content: space-between;
	margin-top: 10px;
	padding: 0;
}
.exampleList h3{
	position: relative;
	padding: 1.5em 1.2em;
	font-size: min(2vw, 2.2rem);
	line-height: 1.4;
	z-index: 1;
}
.exampleList img{
	width: 100%;
}
.exampleList .exampleCont p{
	font-size: 15px;
	line-height: 1.7;
}
.exampleList dl{
	text-align: center;
}
.exampleList dl dt,
.exampleList dl dd{
	padding: 0.5em 0;
	line-height: 1.2;
}
.exampleList dl dt{
	background: #444;
	font-size: 14px;
	color: #fff;
	letter-spacing: 1px;
	border-radius: 3px;
}
.exampleList dl dd{
	font-size: min(1.4vw, 15px);
}
.exampleList li .exampleInfoWrap dl{
	width: 31%;
}
@media screen and (max-width:840px) {
	.exampleCase {
		padding: 60px 0;
	}
	.exampleList h3{
		font-size: min(2.8vw, 2.2rem);
	}
	.exampleList li {
		width: 48%;
	}
	.exampleList dl dd{
		font-size: 15px;
	}
}
@media screen and (max-width:599px) {
	.exampleArea{
		margin-top: -199px;
		padding-top: 75px;
	}
	.exampleArea::before{
		height: 200px;
	}
	.exampleCase {
		padding: 30px 0;
	}
	.exampleList h3{
		font-size: min(4.6vw, 2rem);
	}
	.exampleList li {
		width: 100%;
		margin-bottom: 40px;
		border-radius: 3px;
	}
	.exampleList li .exampleCont {
		row-gap: 1.8em;
	}
	.exampleList p{
		height: auto;
	}
}


/* Flow
========================================== */
.flowArea{
	padding-bottom: 160px;
}
.flowArea .Inner{
	width: 1024px;
}
.flowArea h2{
	margin-bottom: 60px;
}
.flowList{
	display: flex;
	flex-wrap: wrap;
	justify-content:space-between;
		counter-reset: number 0;
}
.flowList li{
	position: relative;
	width: 25%;
	margin-bottom: 50px;
	padding: 80px 36px 30px 40px;
	/* background: url(images/flowlist_bg.jpg) top center no-repeat; */
	background: url(images/flowlist_bg_btm.jpg) bottom -4px center no-repeat, url(images/flowlist_bg_top.jpg) top center no-repeat, url(images/flowlist_bg_mid.jpg) top center repeat-y;
	text-align: center;
}
.flowList li:first-child {
	/* background: url(images/flowlist_bg_first.jpg) top center no-repeat; */
	background: url(images/flowlist_bg_first_btm.jpg) bottom -4px center no-repeat, url(images/flowlist_bg_first_top.jpg) top center no-repeat, url(images/flowlist_bg_first_mid.jpg) top center repeat-y;
}
.flowList li:last-child {
	/* background: url(images/flowlist_bg_end.jpg) top center no-repeat; */
	background: url(images/flowlist_bg_end_btm.jpg) bottom -4px center no-repeat, url(images/flowlist_bg_end_top.jpg) top center no-repeat, url(images/flowlist_bg_end_mid.jpg) top center repeat-y;
}
.flowList li::before{
	counter-increment: number 1;
	content: "0" counter(number);
	position: absolute;
	top: 30px;
	left: 50%;
	transform: translate(-50%, -50%);
	font-family: "Cormorant",
	serif;
	font-optical-sizing: auto;
	font-style: normal;
	font-size: 5rem;
	font-weight: 300;
	color: var(--c-beige);
	line-height: 1rem;
}
.flowList li::after{
	content: '';
	position: absolute;
	top: 62px;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 50px;
	height: 1px;
	background: var(--border-color);
}
.flowList li div{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: flex-end;
	height: 50px;
	margin: 15px auto 30px;
}
.flowList li div::after {
	content: '';
	position: relative;
	bottom: -10px;
	width: 100px;
	height: 1px;
	background: var(--border-color);
}
.flowList li h3{
	width: 100%;
	font-size: 1.8rem;
	line-height: 1.4;
	letter-spacing: 1px;
}
.flowList p {
	position: relative;
	text-align: left;
	font-size: 15px;
	font-weight: 500;
	line-height: 1.7;
}
.flowArea .contactBtn{
	margin-top: 20px;
}
.flowArea .contactBtn p{
	color: var(--txt-subcolor);
}

@media screen and (max-width: 1000px) {
	.flowArea .Inner {
		width: 100%;
	}
	.flowList{
		justify-content: flex-start;
	}
	.flowList li{
		width: calc(100% / 3);
	}
	.flowList li,
	.flowList li:first-child,
	.flowList li:last-child{
		background-size: 100%;
	}
}
@media screen and (max-width: 840px) {
	.flowArea {
		padding-bottom: 80px;
	}
	.flowList li {
		width: calc(100% / 2);
		padding-top: 120px;
	}
	.flowList p{
		padding: 0.2em 1em 1em;
		line-height: 1.6;
	}
	.flowList li::before{
		top: 50px;
	}
	.flowList li::after{
		top: 82px;
	}
}
@media screen and (max-width: 599px) {
	.flowArea .Inner{
		padding: 0 10px;
	}
	.flowArea h2 {
		margin-bottom: 30px;
	}
	.flowList li {
		position: relative;
		width: 45%;
		margin: 0 auto 30px;
		padding: 80px 1em 1.8em;
		z-index: 1;
	}
	.flowList li,
	.flowList li:first-child,
	.flowList li:last-child{
		background: #fff;
		box-shadow: 6px 6px var(--shadow-color);
	}
	.flowList li::before {
		top: 30px;
	}
	.flowList li::after {
		top: 65px;
	}
	.flowList li img{
		width: 90%;
	}
	.flowList p{
		padding: 0;
	}
}


/* About us
========================================== */
.aboutArea{
	padding: 50px 0;
	background: url(images/aboutarea_bg.jpg) no-repeat;
	background-size: cover;
}
.aboutArea .Inner{
	padding: 100px 60px 50px;
	background: rgb(255 255 255 / 80%);
	border-radius: 10px;
}
.aboutArea h2{
	margin-bottom: 40px;
}
.aboutTop{
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
}
.aboutTop p{
	line-height: 2.4;
	letter-spacing: 1px;
}
.aboutList{
	margin: 30px auto 35px;
}
.aboutList ul{
	display: flex;
	justify-content: space-between;
	align-items: stretch;
	flex-wrap: wrap;
}
.aboutList ul li{
	width: 48.5%;
}
.aboutList dl{
	display: flex;
	background-color: var(--bg-color);
	width: 100%;
	margin-bottom: 0.7em;
}
.aboutList dl dt,
.aboutList dl dd{
	padding: 0.8em 1em;
}
.aboutList dl dd a{
	color: inherit;
	text-decoration: none;
}
.aboutList dl dt{
	width: 8em;
	color: var(--main-color);
	font-weight: 600;
}
.aboutList dl.aboutList_l dt{
	width: 15%;
}
.aboutList dl.aboutList_l dd{
	padding: 0.8em 0;
	line-height: 1.8;
}
.aboutList dl dd > dl{
	display: block;
	width: auto;
	margin-bottom: 0.3em;
}
.aboutList dl dd > dl + dl{
	margin-top: 1em;
}
.aboutList dl dd > dl dt{
	width: fit-content;
	margin-bottom: 3px;
	padding: 0 0.4em;
	background: #444;
	color: #fff;
	font-size: 0.9em;
	border-radius: 3px;
}
.aboutList dl dd dl dd{
	padding: 0;
	line-height: 1.6;
}
.aboutArea .contactBtn p{
	margin-top: 10px;
	color: var(--txt-subcolor);
}
@media screen and (max-width: 1000px) {
	.aboutTop div:first-child {
		width: 40%;
	}
	.aboutTop div:last-child {
		width: 60%;
		padding-left: 1rem;
	}
	.aboutTop div:first-child img {
		width: 100%;
	}
	.aboutTop p {
		line-height: 2;
	}
	.aboutTop div p br {
		display: none;
	}
	.aboutList dl dt {
		width: 8em;
	}
	.aboutList dl dd {
		width: 69%;
	}
	.aboutList dl.aboutList_l dt {
		width: 20%;
	}
}
@media screen and (max-width: 840px) {
	.aboutArea .Inner{
		padding: 60px 30px;
	}
	.aboutTop p {
		line-height: 1.8;
	}
}
@media screen and (max-width: 599px) {
	.aboutArea .Inner {
		padding: 60px 20px;
	}
	.aboutList ul li {
		width: 100%;
	}
	.aboutTop div:first-child,
	.aboutTop div:last-child{
		width: 100%;
	}
	.aboutTop div:first-child{
		margin-bottom: 2.5em;
		text-align: center;
	}
	.aboutTop div:first-child img{
		width: 50%;
	}
	.aboutList dl.aboutList_l{
		display: block;
	}
	.aboutList dl.aboutList_l dt,
	.aboutList dl.aboutList_l dd{
		width: 100%;
	}
	.aboutList dl.aboutList_l dd {
		padding: 0 20px 10px;
	}
	.aboutList dl dd dl dd{
		width: 100%;
		padding: 2px 0 0 0;
	}
	.aboutArea .contactBtn {
		padding: 0;
	}
}


/* Staff
========================================== */
.staffArea{
	padding: 100px 0 85px;
}
.staffArea .Inner{
	width: 1000px;
}
.staffCont{
	margin-top: 30px;
}
.staffList{
	display: flex;
	justify-content: center;
}
.staffList .img{
	display: inline-block;
	width: 52%;
}
.staffList .img img{
	width: 100%;
}
.staffItem {
	text-align: center;
}
.staffList dl{
	text-align: center;
}
.staffList dl dt{
	margin-bottom: 0.4em;
	font-size: clamp(1.8rem, 2vw, 2.4rem);
	color: var(--c-grey);
}
.staffList dl dd{
	color: var(--main-color);
	line-height: 1.4;
}
.staffCont .staffTxt{
	margin-top: 2em;
	font-size: clamp(14px, 1.9vw, 16px);
	text-align: center;
}
.staffCont .staffTxt > .large{
	display: inline-block;
	margin-right: 0.2em;
	padding: 0 0.3em;
	background: linear-gradient(transparent 60%, #ffcc99 40%);
	font-size: 1.2em;
	font-weight: bold;
}
.staffArea .contactBtn{
	margin-top: 3.8em;
}
.staffArea .contactBtn p {
	margin-bottom: 15px;
	color: var(--txt-subcolor);
	line-height: 1.5;
}
.contactBtn p > .fukidashi{
	display: inline-block;
	position: relative;
}
.contactBtn p > .fukidashi::before{
	content: "＼";
	display: inline-block;
	position: absolute;
	bottom: 0;
	right: calc(100% + 0.5em);
}
.contactBtn p > .fukidashi::after{
	content: "／";
	display: inline-block;
	position: absolute;
	bottom: 0;
	left: calc(100% + 0.5em);
}
@media screen and (max-width: 1000px) {
	.staffArea .Inner {
		width: 100%;
	}
}
@media screen and (max-width: 840px) {
	.staffArea {
		padding: 80px 0;
	}
	.contactBtn p {
		font-size: 1.4rem;
	}
	.staffList dl dd{
		font-size: 1.4rem;
	}
}
@media screen and (max-width: 599px) {
	.staffArea {
		padding: 60px 0;
	}
	.staffArea .contactBtn {
		margin-top: 3.2em;
		padding: 0;
	}
}


/* contact
========================================== */
.contactArea{
	margin-bottom: 90px;
	padding-bottom: 65px;
}
.contactArea .Inner{
	padding: 110px 60px 85px;
	background: #fff;
	border-radius: 10px;
}
.contactTop{
	margin-top: 50px;
	text-align: center;
}
.contactTop p{
	margin-bottom:40px;
	color: var(--main-color);
	letter-spacing: 2px;
}
.contactForm{
	margin-top: 40px;
}
.contactForm dl{
	margin-bottom: 40px;
}
.contactForm dl dt{
	margin-bottom: 15px;
	/*font-size: clamp(1.6rem, 2vw, 1.8rem);*/
	font-weight: 600;
	color: var(--c-grey);
}
.contactForm dl dt span{
	padding-left: 1rem;
	color: var(--c-red);
}
.contactForm input[type="text"]{
	width: 100%;
	padding: 15px 20px;
	line-height: 1.5em;
	vertical-align: middle;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	background: var(--bg-color);
	box-shadow: inset 1px 0px 3px var(--border-color);
	box-sizing: border-box;
	font-family: inherit;
	-webkit-appearance: none;
}
.contactForm textarea{
	width: 100%;
	padding: 15px 20px;
	line-height: 1.5em;
	vertical-align: middle;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	background: var(--bg-color);
	box-shadow: inset 1px 0px 3px var(--border-color);
	box-sizing: border-box;
	font-family: inherit;
	-webkit-appearance: none;
}
.contactForm input::placeholder {
	color: var(--txt-subcolor);
	font-weight: 500;
}
.contactBtn input[type="submit"] {
	margin-top: 45px;
	z-index: 1;
	display: inline-block;
	padding: 0.8em 5em;
	border: none;
	border-radius: 5px;
	box-sizing: border-box;
	background-color: var(--main-color);
	font-size: 100%;
	font-weight: 500;
	font-family: inherit;
	color: #fff;
	text-align: center;
	text-decoration: none;
	transition: .2s;
	cursor: pointer;
	-webkit-appearance: none;
}
.contactBtn:hover input[type="submit"]:hover {
	color: #fff;
	background-color: var(--sub-color);
}
@media screen and (max-width: 840px) {
	.contactArea {
		margin-bottom: 0;
	}
	.contactArea .Inner {
		padding: 80px 30px;
	}
}
@media screen and (max-width: 599px) {
	.contactArea{
		padding-bottom: 30px;
	}
	.contactArea .Inner {
		padding: 60px 20px 6em;
	}
	.contactTop img{
		width: 100%;
	}
	.contactForm dl {
		margin-bottom: 20px;
	}
}


/* footer
========================================== */
footer{
	width: 100%;
}
.footerWrap{
	position: relative;
	margin: 0 auto;
	padding: 0 0 30px;
	max-width: 1300px;
}
.footerBtn {
	position: fixed;
	left: 50%;
	transform: translate(-50%, 50px);
	width: 100%;
	z-index: 999;
	transition: all 0.2s;
}
.footerBtn.active {
	background: rgba(0, 0, 0, 0.3);
}
.footerBtnWrap {
	display: flex;
	justify-content: center;
	max-width: 1000px;
	margin: 0 auto;
}
.footerBtnWrap > div {
	width: 50%;
}
.footerBtn a{
	display: block;
}
.footerBtn a img {
	width: 100%;
}
.footerBtn a:hover img {
	transform: translatey(0);
}
.footerInfo{
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
	margin: 0 auto;
	padding: 30px 50px 40px;
	color: var(--txt-color);
}
.footerInfo div{
	display: flex;
	align-items: center;
}
.footerLink a{
	padding-left: 1rem;
}
.footerLink a:hover img {
	transform: scale(0.9, 0.9);
}
.footerInfo p+p{margin-top:0; line-height:1.4;}
.footerInfo .logo{width: 61px;}
.footerInfo .logo img{width: 100%;height: auto;}
.footerInfo .company{font-size: 1.6rem; font-weight: 600; padding-left: 3rem;}
.footerInfo .address{padding-left: 3rem;}
.footerInfo .tel{
	padding-right: 2rem;
	text-decoration: none;
	font-family: "Cormorant", serif;
	font-optical-sizing: auto;
	font-style: normal;
	font-weight: 600;
	text-align: center;
	line-height: 1.2;
}
.footerInfo .logo a:hover img {
	transform: translatey(0);
}
.footerInfo .tel a{
	font-size: 3rem;
	color: var(--txt-color);
	text-decoration: none;
	letter-spacing: 1px;
}
.copyright{
	font-size:1.2rem;
	font-weight: normal;
	text-align: center;
}

@media screen and (max-width: 1200px) {
	.footerWrap{
		max-width: 100%;
	}
	.footerInfo {
		padding: 20px 40px;
	}
}
@media screen and (max-width: 1060px) {
	.footerBtn{
		width: 100%;
	}
	.footerInfo_r{
		margin-top: 20px;
		justify-content: end;
	}
	.footerInfo .tel{
		margin-bottom: 10px;
		padding-right: 0;
		line-height: 1;
	}
	.footerInfo{
		justify-content: space-between;
	}
	.footerInfo div{
		flex-wrap: wrap;
	}
	.footerInfo .address{
		width: 100%;
		margin-top: 10px;
		padding-left: 0;
	}
}
@media screen and (max-width: 599px) {
	.footerWrap{
		padding: 5px 0;
	}
	.footerInfo {
		display: none;
	}
	.footerWrap {
		padding: 0 0 10px;
	}
	.footerInfo {
		display: block;
		padding: 15px 20px 0px;
	}
	.footerInfo_r{
		margin-top: 10px;
		justify-content: space-between;
	}
	.footerLink img{
		width: 80%;
	}
	.footerLink a:hover img{
		transform: scale(1, 1);
	}
	.footerLink a {
		padding-left: 0;
		text-align: right;
	}
}
@media screen and (max-width:320px) {
	.footerInfo .company {
		padding-left: 1.5rem;
	}
	.footerInfo .tel a {
		font-size: 2.4rem;
	}
	.footerInfo_r {
		margin-top: 0;
	}
}

/* pageTop
========================================== */
#pageTop{
	position:fixed;
	line-height: 1;
	right:20px;
	bottom:20px;
	z-index: 9999;}
#pageTop a{
	display: block;
	position:relative;
	padding:20px;
	background-color:var(--main-color);
	box-sizing: border-box;
	color:#fff;
	font-size: 1.2rem;
	text-decoration: none;
	transition: all .3s;
}
#pageTop a::before{
	position:absolute;
	content: "";
	top:17px;
	left:50%;
	margin-left: -4px;
	width: 8px;
	height: 8px;
	border-top: solid 2px #fff;
	border-right: solid 2px #fff;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
	transition: all .3s;
	}
#pageTop:hover a{background-color: var(--sub-color);}
#pageTop:hover a::before{top:13px;}
@media screen and (max-width: 1200px) {
	#pageTop{
		right:0;}
}
@media screen and (max-width: 840px) {
	#pageTop{display: none!important}
}

/* 確認・完了
========================================== */

/* MV */
.thanks .mvWrap .mvInner  {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 100%;
	padding: 0;
}
.thanks .mvWrap .mvInner .mvText {
	margin-bottom: 0;
}
.thanks .mvWrap .mvInner .mvText h1 {
	font-size: clamp(1.8rem, 3.6vw, 3rem);
}

/* content */
.thanks .contactArea .Inner {
	margin: 100px auto 0;
}
.thanks .contactArea .Inner .cont {
	margin-top: 3em;
	text-align: center;
}
.thanks .contents p+p {
	margin-top: 2.5em;
}
.thanks .contactArea .Inner .cont .address {
	margin-top: 0;
}
.thanks .contactArea .Inner .cont a {
	text-decoration: none;
	color: #000;
}
.thanks .contactArea .Inner .txt.small {
	font-size: 0.85em;
	color: #f26060;
}
.thanks .contactArea .Inner .txt.small a {
	color: inherit;
}
.thanks .contactArea .Inner .cont .signature {
	margin-top: 3em;
}
.thanks .contactArea .heading {
	font-size: 1.2em;
	font-weight: bold;
	color: var(--main-color);
}
.thanks .contactArea .returnBtn {
	margin-top: 3.5em;
	text-align: center;
}
.thanks .contactArea .returnBtn .btn a {
	display: inline-block;
	width: 100%;
	max-width: 260px;
	padding: 0.8em 0;
	background-color: var(--main-color);
	font-size: 100%;
	font-weight: 500;
	font-family: inherit;
	color: #fff;
	box-sizing: border-box;
	border-radius: 5px;
	text-align: center;
	text-decoration: none;
	transition: all 0.2s;
}
.thanks .contactArea .returnBtn .btn a:hover {
	background-color: var(--sub-color);
	color: #fff;
}
.thanks .contactBtn {
	column-gap: 1em;
	row-gap: 1em;
	margin-top: 45px;
}
.thanks input[type="submit"] {
	width: 100%;
	max-width: 260px;
	margin-top: 0;
	padding: 0.8em 0;
}
.thanks input[type="button"] {
	z-index: 1;
	display: inline-block;
	width: 100%;
	max-width: 260px;
	padding: 0.8em 0;
	border: none;
	border-radius: 5px;
	box-sizing: border-box;
	background-color: var(--main-color);
	font-size: 100%;
	font-weight: 500;
	font-family: inherit;
	color: #fff;
	text-align: center;
	text-decoration: none;
	transition: .2s;
	cursor: pointer;
	-webkit-appearance: none;
}
.thanks input[type="button"]:hover {
	color: #fff;
	background-color: var(--sub-color);
}
@media screen and (max-width: 840px) {
	.thanks .contactArea .Inner {
		width: calc(100% - 2em);
		margin: 55px auto 0;
	}
}
@media screen and (max-width: 599px) {
	.thanks .contactBtn {
		flex-direction: column-reverse;
		align-items: center;
	}
}

table.formTable td {
	text-align-last: left;
}
