:root {
    --font-bold: "HondaGlobalFontJP-Bold", sans-serif;
    --font-normal: "HondaGlobalFontJP-Regular", sans-serif;
    --font-light: "HondaGlobalFontJP-Light", sans-serif;
}

body {
	font-family: "HondaGlobalFontJP-Regular", sans-serif;
	max-width: 100vw;
	width: 100%;
}

#main_wrapper {
	font: 13px/1.231 arial, helvetica, clean, sans-serif;
	*font-size: small;
	*font: x-small;
	font-family: "HondaGlobalFontJP-Regular", sans-serif;
	overflow: hidden;
}

select,
input,
textarea,
button {
	font: 99% arial, helvetica, clean, sans-serif
}

table {
	font-size: inherit;
	font: 100%
}

pre,
code,
kbd,
samp,
tt {
	font-family: monospace;
	*font-size: 108%;
	line-height: 100%
}

.switch_pc {
	display: block;
}

.switch_sp {
	display: none;
}

.gnav_list {
	display: flex;
	justify-content: center;
}

#contents {
	width: 100% !important;
}

#wrapper {
	width: 940px;
	margin: 0 auto;
	padding-top: 3px;
	padding-bottom: 20px;
	color: #666;
	text-align: center;
}

#wrapper p,
#wrapper_map p {
	font-family: var(--font-bold);
	line-height: 2em;
}

#mainTop {
	background-image: url(../image/main_pc_2003.png);
	background-repeat: no-repeat;
	background-position: center;
	margin: 100px auto 66px;
	height: 545px;
	text-align: center;
	font-family: var(--font-bold);
	position: relative;
	color: #666;
}

div.TopWrapper {
	position: absolute;
	width: 100%;
	top: 60%;
	left: 50%;
	transform: translateY(-50%) translateX(-50%);
	-webkit-transform: translateY(-50%) translateX(-50%);
}

.floating_banner {
	position: fixed;
	width: 194px;
	top: 50%;
	right: 0%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	z-index: 100;
}

.floating_banner img {
	max-width: 100%;
}

.floating_banner_sp {
	display: none;
}

#mainTop h1 {
	font-size: 42px;
	margin-bottom: 20px;
	font-weight: normal !important;
}

#wrapper h2 {
	font-size: 40px;
}

.tit_cap {
	margin-top: 10px;
	text-align: center;
	color: #7e7e7e;
	font-size: 12px;
	font-family: var(--font-light) !important;
	font-weight: normal !important;
}

#wrapper .estimatebutton a {
	padding-top: 22px;
	line-height: 1em;
}

#maintenance_chart {
	margin: 60px 0;
	padding-top: 60px;
	border-top: 1px solid #606060;
}

#wrapper .title {
	margin-bottom: 40px;
	font-size: 31px;
}

#wrapper .title:after,#wrapper_map .title:after {
	position: relative;
	display: block;
	content: "";
	margin: 25px auto 0;
	width: 60px;
	height: 3px;
	background-color: #E50012;
}

#maintenance_chart .desc {
	margin-bottom: 40px;
	font-size: 18px;
	line-height: 1.75em;
}

#maintenance_chart .step {
	margin: 0 auto 65px;
	width: 825px;
}

#maintenance_chart .step img {
	max-width: 100%;
}

.estimatebutton_sp {
	display: none;
}

.estimatebutton a {
	position: relative;
	background-color: rgba(230, 0, 33, 0.7);
	margin: 0 auto;
	width: 100%;
	height: 38px;
	width: 375px;
	display: block;
	padding-top: 22px;
	font-family: var(--font-bold);
	font-size: 20px;
	padding-left: 25px;
	color: #fff;
	line-height: 1em;
}

.estimatebutton a:after {
	position: absolute;
	content: "";
	display: block;
	padding-top: 2em;
	width: 30px;
	height: 14px;
	top: calc(50% - 28px);
	left: 40px;
	background: url(../image/mainbutton_arrow_1910.png)0 2px no-repeat;
	transform: rotate(-90deg);
}

.estimatebutton a:hover {
	opacity: 0.8;
	transition: 0.2s;
}

#wrapper_map h2 {
	font-size: 29px;
	font-family: var(--font-bold);
}


#syaken_koukan_carcare ul {
	margin-left: 70px;
}

#syaken_koukan_carcare ul li {
	display: inline;
}

#syaken_koukan_carcare ul li img {
	vertical-align: top;
}

#wrapper_map {
	padding-top: 60px;
	background-color: #f7f7f7;
	margin: 0 auto;
	padding-bottom: 20px;
	color: #666;
	text-align: center;
}

#wrapper_map h2 {
	padding-top: 120px;
	margin-top: -120px;
}

#wrapper_map .map_copy {
	margin-top: 50px;
	font-size: 18px;
}

#threePoint {
	margin-bottom: 35px;
	border: 1px solid #d8d8d8;
	background: #eeeee7;
	padding-top: 18px;
	padding-left: 18px;
	padding-bottom: 6px;
}

#threePoint ol li {
	margin-bottom: 12px;
}

#threePoint ol li img {
	vertical-align: bottom;
}

#howtoAccess {
	padding-top: 25px;
	padding-left: 20px;
	padding-right: 19px;
}

#howtoAccess h4 {
	margin-bottom: 10px;
}

#howtoAccess p.copy {
	margin-bottom: 25px;
}

ul#accessFrom_hondacars {
	margin-bottom: 20px;
	background: url(../image/arrow.gif) 337px 79px no-repeat;
}

ul#accessFrom_hondacars li {
	display: inline;
}

ul#accessFrom_hondacars li img {
	vertical-align: bottom;
}

p.caution {
	font-size: 93%;
	margin-bottom: 50px;
}

ul#tab {
	border-bottom: 1px solid #999;
}

ul#tab li {
	display: inline;
}

ul#tab li img {
	vertical-align: bottom;
	margin-bottom: -1px;
}

#tab01,
#tab02 {
	border: 2px solid #999;
	margin: 0 auto;
	background-color: #fff;
	width: 940px;
	height: 550px;
	margin-top: 30px;
	border-radius: 15px;
	box-shadow: 0px 2px 7px 0px #a8a8a8;
	margin-bottom: 80px;
}

#tab02 {
	padding: 50px 45px;
}

ul#tab01 li img,
ul#tab02 li img {
	vertical-align: bottom;
}

p.kochirakara {
	margin-top: 50px;
	margin-bottom: 15px;
	text-align: center;
}

p.hanbaiten {
	text-align: center;
	margin-bottom: 15px;
}

p.map {
	position: absolute;
	text-align: left;
	margin-top: 35px;
	margin-left: 30px;
	z-index: 10;
}

p.afterserviceTop {
	text-align: right;
	margin-bottom: 10px;
	margin-top: 5px;
}

p.search_btn {
	width: 460px;
	margin: 40px auto 100px;
}

p.search_btn.sp {
	display: none;
}

p.search_btn img {
	width: 100%;
}

/* 地図用
=========================================*/

p#field {
	width: 647px;
	margin-top: 12%;
	margin-left: 18%;
	background-image: url(../map/div_normal.gif);
	background-repeat: no-repeat;
	background-position: top center;
	z-index: 1;
}

p#field img {
	background-image: url(../map/div_normal.gif);
	background-repeat: no-repeat;
	background-position: top center;
}


/* hover、半透明
=========================================*/
a.trans img {
	filter: alpha(opacity=100);
	-moz-opacity: 1.0;
	opacity: 1.0;
}

a.trans:hover img {
	filter: alpha(opacity=70);
	-moz-opacity: 0.7;
	opacity: 0.7;
}

.accordion {
	display: none;
}

.section_inner {
	margin-top: 2vw;
}

@media only print,screen and (max-width: 768px) {
	.gnav_list {
		display: block;
	}

	#mainTop {
		margin: 55px 0 40px;
		background: url(../image/main_sp_2003.png) 0 0 no-repeat;
		background-size: contain;
		height: 62vw;
	}

	.bnr {
		display: none;
		position: relative;
		width: 100%;
	}

	.floating_banner_sp {
		position: fixed;
		bottom: -1px;
		display: block;
		z-index: 88;
	}

	#contents {
		width: 100% !important;
	}

	#wrapper {
		width: auto;
		margin: 0 auto;
		padding: 0 15px;
		color: #666;
		text-align: center;
	}

	div.TopWrapper {
		position: absolute;
		width: 80vw;
		top: 52%;
		left: 50%;
		line-height: 8.5vw;
		transform: translateY(-50%) translateX(-50%);
		-webkit-transform: translateY(-50%) translateX(-50%);
	}

	div.TopWrapper h1 {
		font-family: var(--font-bold);
		letter-spacing: 0.02em;
	}

	#nav_wrap h1 img {
		margin-top: 18px;
	}

	#mainTop h1 {
		font-size: 6vw;
		margin-bottom: 4vw;
		text-shadow: 0px 0px 1px#fff,
			0px 0px 5px#fff,
			0px 0px 10px#fff,
			0px 0px 15px#fff,
			0px 0px 20px#fff,
			0px 0px 25px#fff,
			0px 0px 30px#fff,
			0px 0px 35px#fff,
			0px 0px 40px#fff;
		font-family: var(--font-bold) !important;
	}

	#mainTop .copy {
		line-height: 1.8em;
		font-size: 3.4vw;
		text-shadow: 0px 0px 1px#fff,
			0px 0px 5px#fff,
			0px 0px 10px#fff,
			0px 0px 15px#fff,
			0px 0px 20px#fff;
	}

	.estimatebutton {
		display: none;
	}

	.estimatebutton_sp {
		display: block;
		width: 70vw;
		margin: 0 auto;
		position: relative;
	}

	.estimatebutton_sp a {
		position: relative;
		background-color: rgba(230, 0, 33, 0.7);
		padding-top: 1.4vw;
		padding-bottom: 2.4vw;
		display: block;
		padding-left: 3.4vw;
		margin-top: 2.2vw;
		width: 95%;
		height: 7vw !important;
		color: #fff;
		font-size: 3.77vw;
		line-height: 2.2em;
	}

	.estimatebutton_sp a:after {
		position: absolute;
		content: '';
		top: calc(50% - 5px);
		left: 5%;
		width: 15px;
		height: 10px;
		background: url(../image/mainbutton_arrow_1910.png)0 2px no-repeat;
		background-size: 100%;
	}

	#wrapper h2 {
		margin-bottom: 9.5vw;
		font-size: 5.5vw;
		font-family: var(--font-bold);
		line-height: 1.75em;
	}

	.tit_cap {
		margin-top: 0;
		font-size: 2.5vw;
		white-space: nowrap;
	}

	#wrapper .title,#wrapper_map .title {
		margin-bottom: 5.8vw;
		font-size: 4.2vw;
		font-family: var(--font-bold);
	}

	#wrapper_map .title {
		margin-bottom: 0;
	}

	#wrapper .title:after,#wrapper_map .title:after {
		margin-top: 15px;
		width: 8vw;
	}

	#wrapper .desc {
		margin-bottom: 8vw;
		font-size: 3.9vw;
		font-family: var(--font-bold);
	}

	#wrapper .line,
	#wrapper_map .line {
		width: 10vw;
		padding-bottom: 4.8vw;
	}

	#maintenance_chart {
		margin: 14vw 0 0;
		padding-top: 0;
		border-top: none;
	}

	#maintenance_chart .step {
		margin-bottom: 7vw;
		width: 100%;
		text-align: center;
	}

	.floating_btn_sp {
		margin: 0 -15px;
	}


	#chart_image {
		display: flex;
		justify-content: center;
		align-content: space-around;
		margin: 0 auto;
		margin-top: 8vw;
	}

	#maintenance_about .chao a {
		font-size: 5.5vw;
	}

	#chart_image ul.image_list {
		flex-direction: column;
		padding: 0 3vw;
	}

	#chart_image ul.image_list .arrow {
		transform: rotate(90deg);
		margin: 3.8vw 0;
	}

	#chart_image ul.text_list {
		flex-direction: column;
		justify-content: space-between;
		margin: 0;
		padding: 70px 0 45px 4.3vw;
		text-align: left;
		font-size: 3.5vw;
	}

	#chart_image ul.text_list li {
		max-width: 50vw;
		width: 100%;
	}

	#wrapper_map .map_copy {
		margin-top: 5vw;
		line-height: 2.6em;
		font-size: 3.5vw;
	}

	#chart_image ul.image_list .comp {
		position: relative;
	}

	#chart_image ul.image_list .comp:before {
		position: absolute;
		display: inline;
		bottom: 57%;
		left: 70%;
		max-height: 72px;
		max-width: 104px;
	}

	#tab01,
	#tab02 {
		display: none;
	}

	.main_menu {
		display: block;
		width: 89%;
		margin: 22px auto;
	}

	.search_location p {
		padding-top: 18px;
	}

	.search_location p img {
		padding-top: 3px;
	}

	#search {
		max-width: 90%;
		margin: 0 auto;
		margin-top: 25px;
	}

	.section_inner {
		margin-top: 0;
	}

	.caution_text p {
		font-size: 10px;
		font-family: var(--font-light);
		text-align: left;
		text-indent: -1em;
		padding-left: 2em;
		font-weight: normal !important;
	}

	.main_menu {
		display: block;
	}

	.accordion {
		display: block;
		max-width: 980px;
		margin: 0 auto;
	}

	p.search_btn {
		width: 100%;
		margin: 20px auto 0;
	}

	.mw750 {
		max-width: 750px;
	}

	.jp {
		height: 70px;
		font-size: 125%;
		font-family: var(--font-bold);
	}

	.button {
		display: table;
		position: relative;
		width: 100%;
		margin: 0 auto;
		border-bottom: none;
		background: #dfdfdf;
		color: #191919;
		text-align: left;
		cursor: pointer;
	}

	.button a {
		color: #191919;
	}

	.content1 a {
		display: block;
	}

	.jp:after,
	.region:after {
		display: inline-block;
		position: absolute;
		top: 0.8em;
		right: 0;
		margin-right: 0.35em;
		background-size: contain;
		color: #444;
		font-size: 25px;
		content: "＋";
		font-weight: normal;
	}

	.jp.active:after,
	.region.active:after {
		display: inline-block;
		position: absolute;
		top: 0.8em;
		right: 0;
		margin-right: 0.35em;
		background-size: contain;
		color: #444;
		font-size: 25px;
		content: "－";
		font-weight: normal;
	}

	.region:after {
		font-size: 20px;
		top: 0.08em;
		margin-right: 0.6em;
	}

	.region.active:after {
		font-size: 20px;
		top: 0.08em;
		margin-right: 0.6em;
	}

	.hokkaido,
	.region,
	.drop a {
		color: #444;
	}

	.hokkaido:after {
		display: none !important;
	}

	.button span {
		position: relative;
		display: table-cell;
		padding-top: 0.2em;
		padding-left: 3.2em;
		vertical-align: middle;
	}

	.accordion li:last-child .inner {
		border-top: none;
	}

	.inner {
		width: 100%;
		margin: 0 auto;
		border-bottom: none;
	}

	.button:before {
		display: inline-block;
		position: absolute;
		top: 0.9em;
		left: 0;
		width: 32px;
		height: 32px;
		margin-left: 1em;
		background-size: contain;
		content: "";
	}

	.accordion {
		text-align: center;
	}

	.accordion .inner {
		display: none;
		background: #fff;
	}

	.region {
		background: #fff;
		border-bottom: 1px #dfdfdf solid;
		min-height: 56px;
		line-height: 56px !important;
		font-weight: normal !important;
		font-size: 16px !important;
	}

	.region span {
		padding-left: 15px;
	}

	.prefecture {
		border-bottom: 1px #fff solid;
		background: rgb(248, 248, 248);
		text-align: left;
		height: 53px;
		font-size: 14px !important;
		line-height: 54px !important;
	}

	.prefecture span {
		padding-left: 30px;
	}

	p.search_btn.sp {
		display: block;
	}

	p.search_btn.pc {
		display: none;
	}

	.c-floating-banner .c-floating-banner-img img {
		display: none;
	}


}


@media only screen and (max-width: 320px) {
	.tit_cap {
		white-space: inherit;
	}
}