@charset "utf-8";

/*===============================================

 *	toppage

===============================================*/
.topBdy{
	background-image: url("../img/toppage/bg_kv_main.webp");
	background-repeat: no-repeat;
	background-position: top center;
	background-color: #041e2c;
	min-height: 100vh;
	position: relative;
	width: 100%;
}
.tpTxtSummary{
	margin-bottom: 40px;
	text-align: center;
}
@media screen and ( max-width:767px ){
	.topBdy{
		background-image: url("../img/toppage/bg_kv_sp.webp");
		background-size: contain;
	}
}

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

 *	key-visual

-----------------------------------------------*/
#keyVisual{
	position: relative;
	padding: 470px 5vw 320px;
}
#keyVisual p{
}
.subCatch{
	font-size: 1.8rem;
	margin-bottom: 20px;
}
.mainCatch{
	font-size: 4.8rem;
	font-family: "Shippori Mincho", serif;
	line-height: 1.4;
	margin-bottom: 15px;
}
.enCatch{
	color: #ccc5a8;
	font-size: 1.7rem;
	font-family: "Bodoni Moda", serif;
	margin-bottom: 35px;
}
.btnCatch a{
	background: linear-gradient(to right,  rgba(204,197,168,1) 0%,rgba(177,170,143,1) 100%);
	border-radius: 4px;
	color: #03293e;
	display: inline-block;
	font-size: 2.2rem;
	font-family: "Shippori Mincho", serif;
	padding: 15px 70px;
	position: relative;
	text-align: center;
}
.btnCatch a:hover{
	background: linear-gradient(to right,  rgba(216,206,163,1) 0%,rgba(189,181,148,1) 100%);

}
.btnCatch a:after{
	background-color: #03293e;
	content: "";
	display: block;
	height: 1px;
	width: 40px;
	position: absolute;
	right: 0;
	top: 50%;
}
@media screen and ( max-width:767px ){
	#keyVisual {
		padding: 240px 7vw 0;
	}
	.subCatch{
		font-size: 1.5rem;
		line-height: 1.4;
		margin-bottom: 15px;
	}
	.mainCatch{
		font-size: 3.0rem;
		line-height: 1.4;
	}
	.enCatch{
		font-size: 1.2rem;
		margin-bottom: 30px;
	}
	.btnCatch a{
		font-size: 1.6rem;
		padding: 13px 70px;
	}
}
/*-----------------------------------------------

 *	top about

-----------------------------------------------*/
.tpAboutWrap {
	padding-bottom: 30px;
	padding-top: 180px;
}
.tpAboutTxt{
	line-height: 2.3;
	margin-bottom: 70px;
}
.tpAboutHline{
	font-size: 4.0rem;
	line-height: 1.5;
	margin-bottom: 60px;
}
.tpAboutHline div{
	font-size: 1.6rem;
	margin-bottom: 20px;
}
.tpAboutHlineSub{
	font-size: 2.4rem;
	line-height: 1.8;
	margin-bottom: 40px;
}

@media screen and ( max-width:767px ){
	.tpAboutWrap {
		padding-bottom: 55px;
		padding-top: 50px;
		text-align: left;
	}
	.tpAboutHline{
		font-size: 2.7rem;
		line-height: 1.4;
		margin-bottom: 30px;
	}
	.tpAboutHline div{
		font-size: 1.3rem;
		margin-bottom: 10px;
	}
	.tpAboutHlineSub{
		font-size: 1.6rem;
		line-height: 1.8;
		margin-bottom: 20px;
	}
	.tpAboutTxt{
		line-height: 1.8;
		margin-bottom: 0;
	}
}

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

 *	tpServiceWrap

-----------------------------------------------*/
.tpServiceWrap{
}

.baseHead{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin-bottom: 70px;
}
.bsHeadTxt{
	padding-top: 20px;
	width: 750px;
}

.tpServiceList{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 80px 40px;
}
.tpServiceBox{
	background-color: #18313f;
	border-radius: 4px;
	padding: 60px 50px 60px;
	position: relative;
	width: calc( 100% / 2 - 20px );
}
.tpServiceBoxLast{
	width: 100%;
}
.tpServiceBox h3,
.tpServiceBox .hx3{
	font-size: 2.6rem;
	line-height: 1.5;
	margin-bottom: 20px;
	text-align: center;
}
.tpServiceIcon{
	position: absolute;
	top: -20px;
	left: 50%;
	transform: translateX(-50%);
}
.tpServiceBox p{
	color: #d7dfe3;
}

.tpServiceBox div{
	position: absolute;
	bottom: -20px;
	left: 0;
	right: 0;
	margin: 0 auto;
	width: 300px;
}
.tpServiceBox a{
	background-color: #104a6b;
	background-image: url("../img/toppage/icon_arrow_wh.png");
	background-position: center right 30px;
	background-size: 17px 5px;
	background-repeat: no-repeat;
	border-radius: 4px;
	color: #fff;
	display: block;
	font-family: "Bodoni Moda", serif;
	letter-spacing: 0.08em;
	padding: 15px 40px;
}
.tpServiceBox a:hover{
	background-color: #11557c;
}

.tpServiceBoxLast{
	padding: 50px 562px 50px 50px;
	padding-right: 562px;
	text-align: left;
	overflow: hidden;
}
.tpServiceBoxLast .tpServiceIcon{
	top: 0;
	right: 0;
	left: auto;
	transform: translateX(0);
}
.tpServiceBoxLast h3,
.tpServiceBoxLast .hx3{
	margin-bottom: 15px;
	text-align: left;
}
.tpServiceBoxLast div{
	background-color: #104a6b;
	margin: 20px 0 0;
	position: relative;
	bottom: 0;
	width: 300px;
}
@media screen and ( max-width:767px ){
	.bsHeadTxt{
		padding-top: 0;
		width: 100%;
	}
	.tpServiceList{
		display: flex;
		gap: 60px;
	}
	.tpServiceBox{
		line-height: 2.0;
		padding: 35px 25px 50px;
		width: 100%;
	}
	.tpServiceBox h3,
.tpServiceBox .hx3{
		font-size: 1.9rem;
		margin-bottom: 12px;
	}
	 .tpServiceIcon img{
		height: auto;
		width: 38px;
	}
	.tpServiceBox div{
		width: 260px;
	}
	.tpServiceBox a{
		background-position: center right 25px;
		background-size: 17px 5px;
		letter-spacing: 0.08em;
		padding: 12px 25px;
	}

	.tpServiceBoxLast{
		padding-bottom: 30px;
		text-align: left;
		overflow: auto;
	}
	.tpServiceBoxLast .tpServiceIcon{
		position: relative;
		top: 0;
		right: 0;
		left: 0;
		transform: translateX(0);
		margin: -35px -25px 25px;
	}
	.tpServiceBoxLast .tpServiceIcon img{
		height: auto;
		width: auto;
	}
}

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

 *	.top Why Choose Us

-----------------------------------------------*/
#tpWhyArea{
	background-image: url("../img/toppage/bg_tp_why_pc.webp"), linear-gradient(to bottom,  #0e2f4e 0%,#104a6b 100%);
	background-position: top 280px right , top center;
	background-repeat: no-repeat;
}
.tpWhyWrap{
	display: flex;
	flex-direction: column;
}
.tpWhyBox:nth-child(odd){
	display: flex;
	flex-direction: column;
	align-self: flex-end;
}
.tpWhyBox{
	margin-bottom: 70px;
	margin-top: 70px;
	position: relative;
	width: 1100px;
}
.tpWhyBox:last-child{
	margin-bottom: 0;
}
.tpWhyIn{
	align-self: flex-end;
}
.tpWhyPhoto{
	position: absolute;
	top: -40px;
	right: -90px;
	z-index: 0;
}
.tpWhyBox:nth-child(odd) .tpWhyPhoto{
	right: auto;
	left: -90px;
}
.tpWhyBox h3,
.tpWhyBox .hx3{
	font-size: 3.2rem;
	font-family: "Shippori Mincho", serif;
	line-height: 1.5;
	margin-bottom: 25px;
}
.tpWhyBox h3 div,
.tpWhyBox .hx3 div{
	color: #ccc5a8;
	display: block;
	font-size: 4.8rem;
	font-family: "Bonheur Royale", cursive;
	line-height: 1.2;
}
.tpWhyBox h3 span,
.tpWhyBox .hx3 span{
	font-size: 6.4rem;
}
.tpWhyTxt{
	color: #d7dfe3;
	margin-bottom: 35px;
	max-width: 488px;
}
.tpWhyTbl{
	align-self: flex-end;
	max-width: 880px;
	position: relative;
	z-index: 2;
}
.tpWhyTbl th , .tpWhyTbl td{
	text-align: center;
}
.tpWhyTbl th{
	background-color: #0f394f;
	font-weight: bold;
	padding: 18px 60px;
}
.tpWhyTbl th img{
	margin-top: -10px;
}
.tpWhyTbl td{
	background-color: #144f6e;
	border-top: 1px solid #d7dfe3;
	padding: 14px 60px;
}
.tpWhyTbl th:first-child{
	background-color: #18313f;
	border-right: 1px solid #d7dfe3;
	text-align: left;
}
.tpWhyTbl td:first-child{
	background-color: #36617a;
	border-right: 1px solid #d7dfe3;
	text-align: left;
}
.tpWhyTbl th:last-child{
	background-color: #ccc5a8;
	border-left: 1px solid #d7dfe3;
}
.tpWhyTbl td:last-child{
	background-color: #f4f3ec;
	border-left: 1px solid #d7dfe3;
	color: #948a63;
	font-weight: bold;
}


@media screen and ( max-width:767px ){
	#tpWhyArea{
		background-image: linear-gradient(to bottom,  #0e2f4e 0%,#104a6b 100%);
		background-position: top center;
	}
	.tpWhyBox{
		background: url("../img/toppage/bg_why_sp_01.webp") no-repeat top 245px right -20px;
		background-size: auto 150px;
		margin-bottom: 35px;
		margin-top: 10px;
		width: auto;
	}
	.tpWhyBox:nth-child(odd){
		background-image: url("../img/toppage/bg_why_sp_02.webp");
		background-size: auto 160px;
	}
	.tpWhyPhoto{
		margin-bottom: 20px;
		margin-right: -5vw;
		position: relative;
		top: 0;
		left: 0;
		right: 0;
		z-index: 1;
	}
	.tpWhyBox:nth-child(odd) .tpWhyPhoto{
		margin-left: -5vw;
		margin-right: 0;
		left: 0;
		right: 0;
	}

	.tpWhyBox h3,
.tpWhyBox .hx3{
		font-size: 2.0rem;
		line-height: 1.4;
		margin-bottom: 15px;
	}
	.tpWhyBox h3 div,
.tpWhyBox .hx3 div{
		color: #ccc5a8;
		display: block;
		font-size: 2.8rem;
		line-height: 1.0;
	}
	.tpWhyBox h3 span,
.tpWhyBox .hx3 span{
		font-size: 4.0rem;
	}
	.tpWhyTxt{
		margin-bottom: 20px;
	}

	.tpWhyTbl{
		font-size: 1.3rem;
		line-height: 1.3;
		width: 100%;
	}
	.tpWhyTbl th , .tpWhyTbl td{
		padding: 10px 7px;
	}
	.tpWhyTbl th img{
		margin-top: -5px;
		height: auto;
		width: 76px;
	}
}


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

 *	top case Studies

-----------------------------------------------*/
.tpCaseWrap{
	margin-bottom: 40px;
	position: relative;
	width: 100%;
}
.tpCaseWrap:after,
.tpCaseWrap:before{
	background: linear-gradient(to right,  rgba(4,30,44,1) 0%,rgba(4,30,44,1) 1%,rgba(4,30,44,0) 100%);
	content: "";
	display: block;
	position: absolute;
	top: 0;
	height: 100%;
	width: 200px;
	z-index: 2;
}
.tpCaseWrap:after{
	right: 0;
	transform: rotate(180deg);
}
.tpCaseWrap:before{
	left: 0;
}

.tpCaseBox{
	background-color: #0f394f;
	border-radius: 4px;
	color: #d7dfe3;
	font-size: 1.5rem;
	padding: 40px 38px;
}
.tpCaseWrap .tpCaseBox{
	margin: 0 10px;
	width: 560px;
}

.tpCaseBox h3,
.tpCaseBox .hx3{
	color: #fff;
	font-family: "Shippori Mincho", serif;
	font-size: 2.0rem;
	margin-bottom: 20px;
}
.tpCaseBox h3 a,
.tpCaseBox .hx3 a{
	color: #fff;
}
.tpCaseBox h3 a:hover,
.tpCaseBox .hx3 a:hover{
	color: #ccc5a8;
}
.tpCaseBox h4,
.tpCaseBox .hx4{
	margin-bottom: 20px;
}
.tpCaseBox h4 span,
.tpCaseBox .hx4 span{
	border: 1px solid #6d777c;
	font-size: 1.4rem;
	margin-right: 10px;
	padding: 0 4px;
}
.tpCaseList{
	margin-bottom: 20px;
}
.tpCaseList li{
	background: url("../img/toppage/icon_check_beige.png") no-repeat left top 7px;
	line-height: 1.4;
	margin-bottom: 8px;
	padding-left: 20px;
}
.tpCaseTxt{
	color: #ccc5a8;
	font-family: "Shippori Mincho", serif;
	font-size: 1.8rem;
}

/* slick */
.slick-track {
	display: flex;
}
.slick-slide {
	height: auto !important;
}
.slideArrow {
	background-color: #fff;
	border-radius: 56px;
	line-height: 51px;
	height: 56px;
	width: 56px;
	text-align: center;
	position: absolute;
	top: 50%;
	display: block;
	padding: 0;
	cursor: pointer;
	outline: none;
	transform: translate(0, -50%);
	z-index: 3;
}

.nextArrow {
	right: 5%;
}
.prevArrow {
	left: 5%;
}
.prevArrow img{
	transform: rotate(180deg);
}
@media screen and ( max-width:767px ){
	.tpCaseWrap{
		margin: 0 -5vw 30px;
		width: calc( 100% + 10vw );
	}
	.tpCaseWrap:after,
	.tpCaseWrap:before{
		width: 40px;
	}
	.tpCaseBox{
		font-size: 1.4rem;
		margin: 0 4px;
		padding: 20px 20px;
	}
	.tpCaseWrap .tpCaseBox{
		width: 80vw;
	}
	.slideArrow {
		border-radius: 56px;
		line-height: 27px;
		height: 30px;
		width: 30px;
	}
	.slideArrow img{
		width: 10px;
	}
}


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

 *	top Consultant

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

.tpConsulHead{
}
.tpConsulHead .baseBtn{
	margin-top: 45px;
}
.tpConsulHead .baseBtn a{
	background-color: #041e2c;
	padding-left: 30px;
	text-align: left;
}
.tpConsulHead .baseBtn a:hover{
	background-color: #062b3f;
}
.tpConsulHead{
}

.tpConsulProf{
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
}
.tpConsulProf li{
	padding-left: 30px;
}
.tpConsulProf figure{
	color: #ccc5a8;
	font-size: 1.8rem;
	margin-bottom: 18px;
	position: relative;
}
.tpConsulProf figcaption{
	font-family: "Bodoni Moda", serif;
	position: absolute;
	top: 0;
	left: -30px;
	writing-mode: vertical-rl;
}
.tpConsulProf p{
	line-height: 1.6;
}
.tpProfPost{
	color: #ccc5a8;
	font-size: 1.5rem;
	margin-bottom: 3px;
}
.tpProfName{
	font-family: "Shippori Mincho", serif;
	font-size: 2.2rem;
}
.tpProfEiji{
	font-family: "Bodoni Moda", serif;
	font-size: 1.3rem;
}

@media screen and ( max-width:767px ){
	.tpConsulWrap{
		display: block;
	}
	.tpConsulHead .baseBtn{
		margin-bottom: 30px;
		margin-top: 20px;
	}
	.tpConsulProf li{
		padding-left: 15px;
		width: calc( ( 100% - 20px ) / 2 );
	}
	.tpConsulProf figure{
		margin-bottom: 10px;
		width: 100%;
	}
	.tpConsulProf figcaption{
		font-size: 1.1rem;
		left: -20px;
	}
	.tpConsulProf p{
		line-height: 1.4;
	}
	.tpProfPost{
		font-size: 1.2rem;
		margin-bottom: 3px;
	}
	.tpProfName{
		font-size: 1.8rem;
	}
	.tpProfEiji{
		font-size: 1.1rem;
	}
}

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

 *	top Flow

-----------------------------------------------*/
.tpFlowArea .baseBtn{
	margin-top: 40px;
}

@media screen and ( min-width:768px ){
	.tpFlowWrap{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		gap: 30px;
	}
	.tpFlowBox{
		position: relative;
		width: calc( (100% - 120px) / 5 );
	}
	.tpFlowBox:before{
		top: 132px;
		right: -124px;
		height: 1px;
		width: 160px;
	}

}

.tpFlowBox:before{
	background-color: #d7dfe3;
	content: "";
	position: absolute;
}
.tpFlowBox:last-child:before{
	display: none;
}
.tpFlowBox{
	display: flex;
	flex-direction: column;
	text-align: center;
}
.tpFlowStep{
	font-family: "Bodoni Moda", serif;
	font-size: 1.3rem;
	line-height: 1.0;
	letter-spacing: 0.14em;
	margin-bottom: 12px;
}
.tpFlowStep span{
	display: block;
	font-size: 4.0rem;
	letter-spacing: 0.06em;
	margin-top: 4px;
}
.tpFlowIcon{
}
.tpFlowIcon img{
	background-color: #041e2c;
	border: 1px solid #d7dfe3;
	border-radius: 80px;
}
.tpFlowBox h3,
.tpFlowBox .hx3{
	font-family: "Shippori Mincho", serif;
	font-size: 2.2rem;
	margin-bottom: 15px;
	margin-top: 10px;
}
.tpFlowBox h4,
.tpFlowBox .hx4{
	font-family: 'Zen Kaku Gothic New', serif;
	display: flex;
	justify-content: center;
	align-items: center;
	
	color: #ccc5a8;
	margin-bottom: 30px;
	padding-bottom: 20px;
	position: relative;
	height: calc(1.5em * 3 + 20px);
	line-height: 1.5;
}
.tpFlowBox h4:before,
.tpFlowBox h4:after,
.tpFlowBox .hx4:before,
.tpFlowBox .hx4:after{
	content: "";
	display: block;
	position: absolute;
	bottom: 0;
	left: 50%;
	height: 1px;
	width: 20px;
}
.tpFlowBox h4:before,
.tpFlowBox .hx4:before{
	background-color: #104a6b;
	margin-left: -20px;
}
.tpFlowBox h4:after,
.tpFlowBox .hx4:after{
	background-color: #d7dfe3;
}

.tpFlowTxt{
	font-size: 1.5rem;
	text-align: left;
}

@media screen and ( max-width:767px ){
	.tpFlowWrap{
	}
	.tpFlowBox{
		margin-bottom: 30px;
		padding-left: 55px;
		position: relative;
		text-align: left;
	}
	.tpFlowBox:before{
		top: 74px;
		left: 18px;
		height: calc(100% - 36px);
		width: 1px;
	}
	.tpFlowStep{
		font-size: 1.1rem;
		position: absolute;
		top: 22px;
		left: 0;
		text-align: center;
	}
	.tpFlowStep span{
		font-size: 2.9rem;
	}
	.tpFlowIcon{
		position: absolute;
		top: 10px;
		left: 55px;
	}
	.tpFlowIcon img{
		width: 66px;
	}
	.tpFlowBox h3,
	.tpFlowBox h4,
.tpFlowBox .hx3,
.tpFlowBox .hx4{
		margin-left: 80px;
	}
	.tpFlowBox h3,
.tpFlowBox .hx3{
		font-size: 1.7rem;
		margin-bottom: 4px;
	}
	.tpFlowBox h4,
.tpFlowBox .hx4{
		display: block;
		font-size: 1.4rem;
		height: auto;
		margin-bottom: 15px;
		padding-bottom: 15px;
	}
	.tpFlowBox h4:before,
.tpFlowBox .hx4:before{
		margin-left: 0;
		left: 0;
	}
	.tpFlowBox h4:after,
.tpFlowBox .hx4:after{
		left: 20px;
	}
	.tpFlowTxt{
		font-size: 1.3rem;
	}
	.tpFlowArea .baseBtn{
		margin-top: 30px;
	}
}

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

 *	top FAQ

-----------------------------------------------*/
.tpFaqWrap{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.tpFaqWrap h2{
	margin-right: 100px;
}
.tpFaqIn{
	flex: 1;
	transform: translateY(-16px);
}

details{
	transition: all 0.3s ease-out;
}
details summary:-webkit-details-marker {
	display: none;
}
.tpFaqIn details{
	border-bottom: 1px solid #6d777c;
	padding-bottom: 10px;
	padding-top: 10px;
	position: relative;
}
.tpFaqIn details:after{
	background-color: #104a6b;
	content: "";
	display: block;
	position: absolute;
	bottom: -1px;
	right: 0;
	height: 1px;
	width: 60px;
}
.tpFaqIn summary{
	cursor: pointer;
	font-size: 1.8rem;
	line-height: 1.4;
	list-style: none;
	transition: all 0.3s ease-out;
	position: relative;
	padding: 15px 60px;
}
.tpFaqIn span{
	color: #fff;
	font-family: "Shippori Mincho", serif;
	font-size: 3.2rem;
	transform: translateY(-54%);
	position: absolute;
	top: 50%;
	left: 10px;
}
.tpFaqIn p{
	border-top: 1px solid #6d777c;
	color: #d7dfe3;
	margin-left: 50px;
	margin-top: 10px;
	padding-bottom: 14px;
	padding-left: 50px;
	padding-top: 17px;
	position: relative;
}


details summary::after ,
details summary::before {
	background-color: #d7dfe3;
	content: '';
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
}
details summary::after {
	right: 20px;
	height: 1px;
	width: 19px;
}
details summary::before {
	right: 29px;
	height: 19px;
	width: 1px;
}

details[open] summary::before {
	display: none;
}

details[open] {
	transition: all 0.3s ease-out;
}

@media screen and ( max-width:767px ){
	.tpFaqWrap{
		display: block;
	}
	.tpFaqWrap h2{
		margin-bottom: 15px;
		margin-right: 0;
	}
	.tpFaqIn{
		flex: 1;
		transform: translateY(0);
	}

	.tpFaqIn details{
		padding: 0;
	}
	.tpFaqIn details:after{
		width: 30px;
	}
	.tpFaqIn summary{
		font-size: 1.4rem;
		line-height: 1.4;
		padding: 15px 30px;
	}
	.tpFaqIn span{
		font-size: 1.6rem;
		line-height: 1.2;
		margin-right: 20px;
		padding-bottom: 0;
		left: 0;
	}
	.tpFaqIn p{
		line-height: 1.4;
		margin-left: 30px;
		margin-top: 0;
		padding-bottom: 18px;
		padding-left: 30px;
		padding-top: 16px;
	}
	details summary::after {
		right: 10px;
		height: 1px;
		width: 10px;
	}
	details summary::before {
		right: 15px;
		height: 10px;
		width: 1px;
	}
}



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

 *	top company

-----------------------------------------------*/
.tpInfoArea{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.tpInfoArea h2{
	transform: translateY(15px);
}
.tpInfoWrap {
	flex: 1;
	max-width: 800px;
}
.tpInfoWrap li:not(:last-child){
	border-bottom: 1px solid #6d777c;
	position: relative;
}
.tpInfoWrap li:not(:last-child):after{
	background-color: #104a6b;
	content: "";
	position: absolute;
	bottom: -1px;
	right: 0;
	height: 1px;
	width: 56px;
}
.tpInfoWrap li a{
	color: #fff;
	display: inline-block;
	padding: 16px 20px;
}
.tpInfoWrap li .infoListTime{
	color: #ccc5a8;
	font-family: "Bodoni Moda", serif;
	margin-right: 20px;
}
.tpInfoWrap li{
}

@media screen and ( max-width:767px ){
	.tpInfoArea{
		display: block;
	}
	.tpInfoWrap li a{
		display: inline-block;
		padding: 16px 0;
	}
	.tpInfoWrap li .infoListTime{
		display: block;
		margin: 0 0 2px;
	}
	.tpInfoWrap li:not(:last-child):after{
		width: 30px;
	}

}



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

 *	top Contact Us お問い合わせフォーム

-----------------------------------------------*/
.tpFormContainer form{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 40px;
}
.tpFormBox{
	width: 100%;
}
.tpFormHarf{
	width: calc( ( 100% - 40px ) / 2 );
}
.tpFormBox dt{
	margin-bottom: 6px;
}
.tpFormBox ::placeholder{
	color: #748da0;
}
.tpFormBox input , .tpFormBox textarea{
	background-color: #00466b;
	border-radius: 4px;
	border: 1px solid #51798e;
	color: #fff;
	padding: 15px 20px;
	width: 100%;
}
.tpFormBox dt span{
	background-color: #ad1818;
	color: #fff;
	display: inline-block;
	line-height: 1.0;
	font-size: 1.2rem;
	margin-left: 16px;
	padding: 2px 8px;
}

.tpFormSubmit{
	margin: 0 auto;
	position: relative;
}
.tpFormSubmit img{
	position: absolute;
	top: 50%;
	left: 30px;
	transform: translateY(-50%);
}
.tpFormSubmit input{
	background-color: #03293e;
	background-image: url("../img/toppage/icon_arrow_wh.png");
	background-position: center right 30px;
	background-size: 17px 5px;
	background-repeat: no-repeat;
	border: none;
	color: #fff;
	cursor: pointer;
	font-size: 1.8rem;
	outline: none;
	padding: 20px 0;
	transition: all 0.3s ease-out;
	width: 440px;
}
.tpFormSubmit input:hover{
	background-color: #022f47;
}

.tpFormPrivacyCheck{
	text-align: center; 
	width: 100%;
}
.tpFormPrivacyCheck p{
	color: #d7dfe3;
	margin-bottom: 10px;
}
.tpFormPrivacyCheck input{
	margin-right: 8px;
}
.tpFormSubmit input[type="submit"]:disabled {
	cursor: not-allowed;
	opacity: 0.5;
}

/*-- 確認ページ --*/
#wpcf7-f85-o1 .tpFormPrivacyCheck {
	display: none;
}
#wpcf7-f85-o1 dd{
	background-color: #00466b;
	border-radius: 4px;
	padding: 10px 15px;
}
#wpcf7-f85-o1 dd:empty {
	padding: 0;
	background: none;
}
.tpFormSubmit.tpFormConfirmSubmit{
	gap: 20px;
}
.tpFormBack input{
	background-color: #21282c;
	background-image: url(../img/toppage/icon_arrow_wh_left.png);
	background-position: center left 20px;
	padding-left: 20px;
	width: 160px;
}
.tpFormSend{
	position: relative;
}
.tpFormConfirmSubmit .wpcf7-spinner {
	display: none;
}


/*-- ContactForm7の微調整 --*/
.tpFormSubmit {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
}

.tpFormSubmit .wpcf7-spinner {
	position: absolute;
	top: 50%;
	left: 50%;
	margin: 0;
	transform: translate(180px, -50%);
}

@media screen and ( max-width:767px ){
	/* スピナーの位置（中央から180px右）が画面外に出て横スクロールの原因になるため、右端基準にする */
	.tpFormSubmit .wpcf7-spinner{
		left: auto;
		right: 0;
		transform: translateY(-50%);
	}
	.tpFormContainer form{
		gap: 10px;
	}
	.tpFormBox{
		width: 100%;
	}
	.tpFormHarf{
		width: 100%;
	}
	.tpFormSubmit{
		width: 100%;
	}
	.tpFormSubmit input{
		font-size: 1.4rem;
		width: 100%;
	}
/*-- 確認ページ --*/
	#wpcf7-f85-o1 dd{
		background-color: #00466b;
		border-radius: 4px;
		padding: 10px 15px;
	}
	.tpFormSubmit.tpFormConfirmSubmit{
		gap: 10px;
	}
	.tpFormBack input{
		background-position: center left 15px;
		padding-left: 15px;
		width: 120px;
	}
	.tpFormSend{
		position: relative;
		width: 180px;
	}
}



/**/


/*-----------------------------------------------
 *	タブレット幅（768〜1199px）の横スクロール対策
 *	「選ばれる理由」は width:1100px 固定＋写真が right:-90px のため、
 *	画面幅が1100px未満だと横にはみ出す。この範囲だけ縦並びに近い形へ。
-----------------------------------------------*/
@media screen and ( min-width:768px ) and ( max-width:1099px ){
	.tpWhyBox{
		width: auto;
	}
	.tpWhyPhoto,
	.tpWhyBox:nth-child(odd) .tpWhyPhoto{
		position: relative;
		top: 0;
		left: auto;
		right: auto;
		width: 100%;
		max-width: 640px;
		margin: 0 auto 20px;
	}
	.tpWhyPhoto img{
		width: 100%;
		height: auto;
	}
}

/* 1100〜1279px：写真の右へのはみ出し（right:-90px）が画面外に出るため、画面端で切る */
@media screen and ( min-width:1100px ) and ( max-width:1279px ){
	#tpWhyArea{
		overflow-x: hidden;
	}
}