@charset "utf-8";
/* CSS Document */

/*===============================================
●共通
===============================================*/
#dealerWrap .btn a {border-radius: 10px;}
#dealerWrap .btn svg {
	width: 1.12em;
	height: 1.12em;
	vertical-align: -0.25em;
}
#dealerWrap .btn a:hover svg {fill: #fff!important;}
#dealerWrap .acenter {line-height: 1.63em;}
#dealerWrap .dealerTitle {
	/* font-family: "ゴシックMB101 DB"; */
	font-weight: 600;
	line-height: 1em;
}
#dealerWrap .dealerTitle span {margin-right: 0.5em;}
#dealerWrap .yellowFont {color: #FFFF00;}
#dealerWrap .ballon {position: relative;}
#dealerWrap .ballon:before {
	content: "";
	position: absolute;
	top: 100%;
	left: 50%;
}

/* dealerContact
---------------------------------------- */
#dealerContact .contactBox {text-align: center;}
#dealerContact .contactBox h2 {
	background-color: #0052A4;
	color: #fff;
	line-height: 1em;
	font-weight: bold;
	display: flex;
	align-items: center;
	justify-content: center;
}
.contactSt01 {fill: #0052A4;}
.contactSt02 {fill: #fff;}
#dealerContact .contactBox > div {
	border: 2px solid #0052A4;
	border-top: none;
}
#dealerContact .contactBox p {
	background-color: #E7E7E7;
	font-weight: bold;
	text-align: center;
	line-height: 1.69em;
	padding: 0.8em 0 0.5em;
}
#dealerContact #telArea a {
	display: block;
	text-decoration: none;
}
.freephoneSt01 {fill: #1B982A;}
.freephoneSt02 {fill: #1A1311;}
.freephoneSt03 {fill: #FFF;}
#dealerContact #telArea #number {font-family: "Oswald", sans-serif;}
#dealerContact #mailArea .btn svg {fill: #0052A4;}

/* purchaseWrap
---------------------------------------- */
#purchaseWrap .dealerTitle {
	color: #0052A4;
	background: linear-gradient(transparent 35%, #EAF6FD 35%);
	padding-bottom: 0.6em;
}
#purchaseIcon01 svg {
	width: 25px;
	height: 22px;
	fill: #0052A4;
	vertical-align: -0.1em;
}
/* purchaseBox  */
.purchaseBox {
	border: 1px solid #0052A4;
	border-top: none;
}
.purchaseBox .ballon {
	background-color: #0052A4;
	color: #fff;
	font-weight: bold;
	display: flex;
	align-items: center;
	justify-content: center;
}
.purchaseSt01 {fill: #FFFF00;}
.purchaseSt02 {fill: #fff;}
.purchaseBox p {line-height: 1.43em;}
.purchaseBox .btn svg {fill: #0e53a3;}
.purchaseImage {border: 1px solid #ccc;}

/* windowWrap
---------------------------------------- */
#windowWrap .dealerTitle {
	color: #01642D;
	background: linear-gradient(transparent 35%, #E7FBF0 35%);
	padding-bottom: 0.5em;
}
#searchIcon svg {
	fill: #01642D;
	width: 25px;
	height: 25px;
	vertical-align: -0.15em;
}
#windowWrap p {
	text-align: center;
	line-height: 1.43em;
}
#windowWrap .btn a {
	border: 1px solid #01642D;
	color: #01642D;
}
#windowWrap .btn a:hover {
	background-color: #009944;
	border: 1px solid #009944;
	color: #fff;
}
#windowWrap .btn svg {fill: #01642D;}

/* repairWrap
---------------------------------------- */
#repairWrap .dealerTitle {
	color: #001C58;
	background: linear-gradient(transparent 35%, #DDE6FB 35%);
	padding-bottom: 0.4em;
}
#repairWrap section {
	border: 1px solid #0052A4;
	border-top: none;
}
#repairIcon01 svg {
	fill: #001C58;
	width: 25px;
	height: 25px;
	vertical-align: -0.2em;
}

/* repairWrap
---------------------------------------- */
#repairWrap .ballon {
	background-color: #001C58;
	color: #fff;
	font-weight: bold;
	line-height: 1.5em;
	display: flex;
	align-items: center;
	padding: 0.5em 0.5em 0.5em 1em;
}
#repairWrap .ballon svg {margin-right: 0.8em;}
.repairSt01 {fill: #FFF000;}
.repairSt02 {fill: #FF0000;}
#repairWrap .repairInner p {line-height: 1.43em;}
#repairWrap .btn a {
	border: 1px solid #001C58;
	color: #001C58;
	display: flex;
	align-items: center;
	justify-content: center;
}
#repairWrap .btn a:hover {
	background-color: #0E53A3;
	border: 1px solid #0E53A3;
	color: #fff;
}
#repairWrap .btn svg {fill: #001C58;}
#repairWrap .dealerFlex section .btn a {
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: left;
	line-height: 1.4em;
	padding: 0.8em 0.5em;
}

/*===============================================
●画面の横幅が729px以下
===============================================*/
@media screen and (max-width: 767px){

	#dealerWrap {margin-bottom: 4em; padding: 0;}
	#dealerWrap .tit03 {margin-bottom: 0.8em;}
	#dealerWrap .acenter {margin-bottom: 2em; text-align: left !important;}
	#dealerWrap .dealerTitle {
		font-size: 1.4em; font-weight: bold;
		margin-bottom: 1.5em;
		line-height: 1.3em;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	#dealerWrap .ballon {
		padding: 0.8em 0.5em;
		font-size: 1.3em;
	}

	/* dealerContact
	---------------------------------------- */
	#dealerContact {margin-bottom: 4.5em;}
	#dealerContact .contactBox h2 {
		font-size: 1.35em;
		padding: 0.7em 0 0.5em;
	}
	#dealerContact .contactBox > div {padding: 2.5em 1em 2.2em;}
	#dealerContact .contactIcon {margin-right: 0.6em;}
	#dealerContact .contactIcon svg {
		width: 26px;
		height: 26px;
	}
	#dealerContact #telArea {margin-bottom: 2em;}
	#dealerContact #telArea a {margin-bottom: 1.5em;}
	#dealerContact #telArea #freePhoneIcon svg {
		width: 3.64em;
		height: 1.86em;
	}
	#dealerContact #telArea #number {
		font-size: 2.4em;
		margin-left: 0.3em;
	}
	#dealerContact #mailArea .btn {margin-bottom: 2em;}

	/* purchaseWrap
	---------------------------------------- */
	#purchaseWrap {margin-bottom: 4em;}
	.purchaseBox .ballon:before {
		margin-left: -8px;
		border: 8px solid transparent;
		border-top: 10px solid #0052A4;
	}
	.purchaseBox .ballon .purchaseIcon svg  {vertical-align: -0.1em;}
	.purchaseBox .ballon #purchasIcone02 {margin-right: 0.6em;}
	.purchaseBox .ballon #purchasIcone03 {margin-right: 0.8em;}
	.purchaseBox .ballon #purchasIcone02 svg {
		width: 30px;
		height: 21px;
	}
	.purchaseBox  .ballon #purchasIcone03 svg {
		width: 20px;
		height: 26px;
	}
	.purchaseBox .purchaseInner {padding: 2em 1em;}
	.purchaseBox .purchaseImage img {width: 100%;}
	.purchaseBox p {padding: 1.5em 0 2em;}
	#purchaseBox01 {margin-bottom: 2em;}

	/* windowWrap
	---------------------------------------- */
	#windowWrap {margin-bottom: 4em;}
	#windowWrap p {margin-bottom: 1.5em;}

	/* repairWrap
	---------------------------------------- */
	#repairWrap .ballon {justify-content: center;}
	#repairWrap .ballon:before {
		margin-left: -8px;
		border: 8px solid transparent;
		border-top: 10px solid #001C58;
	}
	#repairIcon02 svg {
		width: 40px;
		height: 28px;
		vertical-align: -0.1em;
	}
	#repairIcon03 svg {
		width: 40px;
		height: 42.5px;
		vertical-align: -0.4em;
	}
	#repairIcon04 svg {
		width: 38px;
		height: 39.5px;
	}
	#repairWrap .repairBox {margin-bottom: 2em;}
	#repairWrap .repairInner {padding: 2em 1em;}
	#repairWrap #repairBox01 .repairInner .btn:first-of-type {margin: 2em 0 1em;}
	#repairWrap .dealerFlex #repairBox02 p,
	#repairWrap .dealerFlex #repairBox03 p {margin-bottom: 1.5em;}
	#repairWrap .dealerFlex #repairBox02 #stickerImage {text-align: center;}
	#repairWrap .dealerFlex #repairBox02 #stickerImage img {width: 80%;}

}
/*===============================================
●画面の横幅が730px以上
===============================================*/
@media screen and (min-width: 768px) {

	#dealerWrap {
		margin: 1em auto 10em;
		max-width: 980px;
	}
	#dealerWrap .tit03 {margin-bottom: 0.8em;}
	#dealerWrap .acenter {
		font-size: 1.14em;
		margin-bottom: 2.5em;
	}

	/* dealerTitle */
	#dealerWrap .dealerTitle {
		font-size: 1.71em; font-weight: bold;
		text-align: center;
	}

	/* dealerFlex */
	.dealerFlex {
		display: flex;
		justify-content: space-between;
		justify-content: center;
	}

	/* 各コンテンツの余白 */
	#dealerContact,
	#purchaseWrap,
	#windowWrap {margin-bottom: 10em;}

	/* dealerContact
	---------------------------------------- */
	#dealerContact {
		display: flex;
		justify-content: space-between;
	}
	#dealerContact > p {
		font-size: 1.86em;
		margin-bottom: 2em;
	}

	/* contactBox */
	#dealerContact .contactBox {width: 48%;}
	#dealerContact .contactBox h2 {
		font-size: 1.86em;
		padding: 0.5em 0 0.3em;
	}
	#dealerContact .contactIcon {margin-right: 0.8em;}
	#dealerContact .contactIcon svg {
		width: 50px;
		height: 50px;
	}
	#dealerContact .contactBox p {font-size: 1.14em;}
	#dealerContact #telArea > div {padding: 11% 5% 8%;}
	#dealerContact #telArea a {
		pointer-events: none;
		margin-bottom: 2.52em;
	}
	#dealerContact #telArea a #number {
		font-size: 2.86em;
		margin-left: 0.5em;
	}
	#dealerContact #telArea #freePhoneIcon svg {
		width: 4.2em;
		height: 2.43em;
	}
	#dealerContact #mailArea > div {padding: 9% 5% 8%;}
	#dealerContact #mailArea .btn {
		max-width: 310px;
		margin: 0 auto 2em;
	}

	/* purchaseWrap
	---------------------------------------- */
	#purchaseWrap .dealerTitle {margin-bottom: 2em;}
	.purchaseBox {
		width: 47%;
		display: flex;
		flex-direction: column;
	}
	.purchaseBox .purchaseInner {
		padding: 2em 1.3em 110px;
		display: flex;
		flex-wrap: wrap;
	}
	.purchaseBox .ballon {
		font-size: 1.43em;
		padding: 1em 0;
		height: 70px;
	}
	.purchaseBox .ballon:before {
		margin-left: -10px;
		border: 10px solid transparent;
		border-top: 13px solid #0052A4;
	}
	.purchaseBox .ballon .purchaseIcon {margin-right: 0.8em;}
	.purchaseBox .ballon #purchasIcone02 svg {
		width: 38px;
		height: 29px;
	}
	.purchaseBox  .ballon #purchasIcone03 svg {
		width: 27px;
		height: 33px;
	}
	.purchaseBox .purchaseImage {
		max-width: 410px;
		margin: 0 auto 1.5em;
	}
	.purchaseBox .btn {width: 100%;}
	#purchaseBox01 p {margin-bottom: 3em;}
	#purchaseBox02  {position: relative;}
	#purchaseBox02 .btn {
		position: absolute;
		bottom: 2em;
		left: 0;
	}
	#purchaseBox02 .btn a {
		max-width: 385px;
		width: 90%;
		margin: 0 auto;
	}

	/* windowWrap
	---------------------------------------- */
	#windowWrap .dealerTitle {margin-bottom: 1em;}
	#windowWrap p {margin-bottom: 2em;}
	#windowWrap .btn {
		max-width: 385px;
		margin: 0 auto;
	}

	/* repairWrap
	---------------------------------------- */
	#repairWrap .dealerTitle {margin-bottom: 1.5em;}
	#repairWrap .dealerFlex section {width: 31.3%;}
	#repairWrap .ballon {font-size: 1.43em;}
	#repairWrap .ballon:before {
		margin-left: -10px;
		border: 10px solid transparent;
		border-top: 13px solid #001C58;
	}
	#repairIcon02 svg {
		width: 46px;
		height: 34px;
	}
	#repairIcon03 svg {
		width: 44px;
		height: 46.5px;
	}
	#repairIcon04 svg {
		width: 45px;
		height: 46.5px;
	}
	#repairWrap .repairInner {padding: 2.3em 1.2em 2em;}
	#repairWrap .dealerFlex #repairBox01 .repairInner .btn:first-of-type {margin: 3em 0 1.5em;}
	#repairWrap .dealerFlex #repairBox02,
	#repairWrap .dealerFlex #repairBox03 {position: relative;}
	#repairWrap .dealerFlex #repairBox02 #stickerImage,
	#repairWrap .dealerFlex #repairBox03 .btn {
		position: absolute;
		bottom: 2em;
		left: 0;
		width: 100%;
	}
	#repairWrap .dealerFlex #repairBox02 #stickerImage img {
		display: block;
		width: 92%;
		max-width: 230px;
		margin: 0 auto;
	}
	#repairWrap .dealerFlex #repairBox03 .btn a {
		width: 92%;
		max-width: 270px;
		margin: 0 auto;
	}

}

/*===============================================
●画面の横幅が730px以上970px以下(PCのみ)
===============================================*/
@media screen and (min-width: 730px) and (max-width: 970px) {

	#repairWrap #repairBox01 .ballon span:last-child br,
	#repairWrap #repairBox02 .ballon span:last-child br {display: none;}

}