@charset "UTF-8";
@import url("img_slider.css");
/*------------------------------------------------------------------------------------------
*
*
common.css
*
*
------------------------------------------------------------------------------------------ */
/* Eric Meyer's Reset CSS v2.0 - http://cssreset.com */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

/*HTML5display-roleresetforolderbrowsers*/
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block;
}

body {
  line-height: 1;
  background-color: #fff;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after {
  content: '';
  content: none;
}

q:before, q:after {
  content: '';
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* overwrite */
body {
  font-size: 80%;
  line-height: 1.3;
  font-family: "HondaGlobalFontJP-Regular", sans-serif;
  -webkit-text-size-adjust: 100%;
}

#auto-header, #auto-header-overlay {
  z-index: 65535 !important;
}

a, li, p, div, button {
  outline: none !important;
}

header, footer {
  line-height: 1;
}

header a, footer a, #contents_area a, #footer_topic_path a {
  text-decoration: none;
}

.bold {
  font-family: "HondaGlobalFontJP-Bold", sans-serif !important;
}

#auto-header {
  line-height: 1;
}

/* ------------ */
body.only_sp .device_pc_only, body.only_tablet .device_pc_only {
  display: none !important;
}

.device_sp_only {
  display: none !important;
}

body.only_sp .device_sp_only {
  display: inherit !important;
}

body.only_tablet .device_sp_only {
  display: inherit !important;
}

body.only_tablet .quick_link_wrap .view_3d.switch_pc {
  display: block !important;
}

body.only_sp footer .view_3d {
  display: none !important;
}

/* ------------------------------------------------------------
*
#contents_area
*
------------------------------------------------------------ */
a {
  color: #000;
}

#contents_area {
  color: #444;
  position: relative;
  text-align: left;
  line-height: 1;
}

#contents_area:after {
  content: '';
  clear: both;
  display: block;
}

#contents_area a {
  transition: opacity .1s ease;
}

#contents_area a:hover {
  opacity: .7;
}

#contents_footer_navigation {
  text-align: left;
}

/* ------------------------------------------------------------
*
MOVIE PLAYER
*
------------------------------------------------------------ */
.bc-iframe body {
  background-color: transparent;
}

.bc-player-4k5Jg43ag_default {
  background-color: transparent;
}

.bc-player-4k5Jg43ag_default .vjs-poster {
  background-color: transparent;
}

.bc-player-4k5Jg43ag_default.vjs-mouse .vjs-big-play-button {
  top: 0;
  left: 0;
  left: 242px\9  !important;
  top: 140px\9  !important;
}

.vjs-big-play-button {
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  margin: auto;
}

.only_sp .vjs-big-play-button {
  /*    display: none; */
}

.bc-player-4k5Jg43ag_default .vjs-progress-holder:before {
  background-color: #000 !important;
  filter: alpha(opacity=30) !important;
  opacity: 0.3 !important;
}

.bc-player-4k5Jg43ag_default .vjs-load-progress {
  background-color: #c00 !important;
  background-color: #000 \9   !important;
  filter: alpha(opacity=0) !important;
  opacity: 0.3 !important;
}

.bc-player-4k5Jg43ag_default .vjs-play-progress, .bc-player-4k5Jg43ag_default .vjs-volume-level {
  background-color: #c00 !important;
}

.movie_player {
  display: none;
}

#movie_modal_data video, #movie_modal_data .video-js {
  width: 100% !important;
  height: auto !important;
  position: relative;
}

#movie_modal .m_mov {
  display: none;
}

.box_link img {
  transition: opacity .1 ease;
}

.box_link:hover img {
  opacity: .7;
}

.clearfix:after {
  content: "";
  clear: both;
  display: block;
}

@media print {
  #access_header {
    position: relative !important;
  }
  #global_navigation {
    position: absolute !important;
    top: 111px !important;
  }
}

@media print, screen and (min-width: 769px) {
  /*------------------------------------------------------------------------------------------
  	*
  	*
  	min-width : 769px
  	*
  	*
  	------------------------------------------------------------------------------------------ */
  #auto-header, #auto-header-overlay {
    min-width: 980px;
  }
  /* common style */
  body {
    position: relative !important;
    overflow: auto !important;
  }
  header br, footer br, #contents_area br {
    display: block !important;
  }
  header br.sp, footer br.sp, #contents_area br.sp {
    display: none !important;
  }
  .switch_pc {
    display: block;
  }
  .switch_sp {
    display: none;
  }
  .box_flex {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
  }
  /* ------------------------------------------------------------------------------------------
  	*
  	#nav_header
  	*
  	------------------------------------------------------------------------------------------ */
  header {
    position: relative;
    height: 122px;
    text-align: left;
  }
  #nav_header {
    width: 100%;
    min-width: 980px;
    height: 60px;
  }
  #nav_header.fixed {
    position: fixed;
    top: 0;
  }
  #nav_header > div {
    width: 100%;
    max-width: 980px;
    margin: 0 auto;
    position: relative;
  }
  #nav_header h1 {
    padding-top: 20px;
  }
  #nav_header h1 a {
    font-size: 22px;
    color: #444;
    font-family: "HondaGlobalFontJP-Bold", sans-serif;
  }
  #nav_header .access_link {
    float: right;
    margin-top: -12px;
  }
  /* ------------------------------------------------------------------------------------------
  	*
  	#global_navigation
  	*
  	------------------------------------------------------------------------------------------ */
  .gnav_ico {
    display: none;
  }
  #global_navigation {
    width: 100%;
    min-width: 980px;
    height: 60px;
    position: absolute;
    top: 60px;
    left: 0;
    z-index: 100;
    border-top: #d0d2d4 solid 1px;
    border-bottom: #d0d2d4 solid 1px;
    background: #fff;
  }
  #global_navigation.fixed {
    position: fixed;
    top: 0;
  }
  #global_navigation_inner {
    width: 980px;
    height: 45px;
    margin: 0 auto;
    position: relative;
  }
  #global_navigation ul {
    overflow: hidden;
  }
  #global_navigation li {
    float: left;
    width: 25%;
    height: 60px;
    box-sizing: border-box;
    background: url(../img/nav_separator_pc.png) no-repeat 0 center #fff;
    padding: 15px 10px 0;
  }
  #global_navigation li:first-child {
    background: none;
  }
  #global_navigation li a {
    display: block;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    text-indent: -9999px;
    background-image: url(../img/nav_pc.png);
    background-repeat: no-repeat;
    /*padding: 0 20px;*/
  }
  #global_navigation li#nav01 a {
    background-position: 10px 0;
  }
  #global_navigation li#nav02 a {
    background-position: -255px 0;
  }
  #global_navigation li#nav03 a {
    background-position: -500px 0;
  }
  #global_navigation li#nav04 a {
    background-position: -745px 0;
  }
  #global_navigation li#nav01 a:hover, #global_navigation li#nav01.current a {
    background-position: 10px -45px;
  }
  #global_navigation li#nav02 a:hover, #global_navigation li#nav02.current a {
    background-position: -255px -45px;
  }
  #global_navigation li#nav03 a:hover, #global_navigation li#nav03.current a {
    background-position: -500px -45px;
  }
  #global_navigation li#nav04 a:hover, #global_navigation li#nav04.current a {
    background-position: -745px -45px;
  }
  /* ------------------------------
  	#contents_area
  	------------------------------ */
  #contents_area {
    margin-top: 0;
    width: 100%;
    min-width: 980px;
    /*padding: 42px 0 0 0;*/
    box-sizing: border-box;
  }
  /* ------------------------------ */
  .btn_pagetop {
    width: 45px;
    height: 45px;
    background-image: url(../img/btn_pagetop.png);
    background-repeat: no-repeat;
    background-size: 45px;
    opacity: 0;
    visibility: hidden;
    position: fixed;
    bottom: 20px;
    right: 20px;
    cursor: pointer;
    transition: opacity .1s ease;
    z-index: 10;
  }
  .btn_pagetop:hover {
    opacity: .7 !important;
  }
  .modal_mov_open a {
    display: block;
    position: relative;
  }
  .modal_mov_open a:hover {
    opacity: .7;
  }
  /*.modal_mov_open a::after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: url(../img/icon_play_pc.png) center center no-repeat;
  }*/
  /* ------------------------------
  	#movie_modal
  	------------------------------ */
  #movie_modal {
    width: 100%;
    height: 100%;
    display: none;
    visibility: hidden;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 65535;
  }
  #movie_modal .movie_overlay {
    width: 100%;
    height: 100%;
    background-color: #fff;
    opacity: 1;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1;
  }
  #movie_modal .movie_btn_close {
    width: 30px;
    height: 30px;
    margin: 0 0 0 0;
    background-image: url(../img/parts_modal_close.png);
    background-repeat: no-repeat;
    background-size: 30px;
    position: fixed;
    top: 20px;
    left: 20px;
    z-index: 2;
    cursor: pointer;
    transition: opacity .1s ease;
  }
  #movie_modal .movie_btn_close:hover {
    opacity: .7;
  }
  #movie_modal_inner {
    margin: 0 auto;
    opacity: 0;
    text-align: center;
    position: fixed;
    top: 0;
    z-index: 2;
  }
  /* ------------------------------------------------------------------------------------------
   *
  	  #section_caution
   *
   ------------------------------------------------------------------------------------------ */
  #section_caution {
    width: 900px;
    margin: 80px auto 0;
  }
  #section_caution p {
    margin: 0 0 10px 0;
    font-size: 11px;
    font-family:"HondaGlobalFontJP-Light",sans-serif;
    line-height: 1.4em;
  }
  #section_caution p .square {
	  display: inline-block;
	  border: 1px solid #aaa;
	  background: #fefce5;
	  height: 11px;
	  width: 30px;
	  vertical-align: middle;
	  margin: 1px 2px;
  }
  .sup {
    margin: 0 2px;
    padding: 0 !important;
    font-size: 60%;
    line-height: 1em;
    text-indent: 0 !important;
    display: inline-block;
    vertical-align: text-top;
    position: relative;
    top: -2px;
  }
  /* ------------------------------
  #footer_topic_path
  ------------------------------ */
  #footer_topic_path {
    background-color: #f0f0f0;
    margin-top: 100px;
  }
  #footer_topic_path ul {
    width: 880px;
    margin: 0 auto;
    position: relative;
    overflow: hidden;
  }
  #footer_topic_path ul li {
    padding: 14px 0 16px;
    font-size: 12px;
    /*font-family:"HondaGlobalFontJP-Light",sans-serif;*/
    line-height: 20px;
    float: left;
  }
  #footer_topic_path ul li a {
    color: #444;
  }
  #footer_topic_path ul li a::after {
    content: "＞";
    margin-left: 5px;
    margin-right: 5px;
  }
  /* ------------------------------
  footer
  ------------------------------ */
  #footer-link {
    padding-top: 30px;
    min-width: 980px;
    border-top: solid 1px #E4E4E4;
    position: relative;
  }
  #footer-link ul {
    overflow: hidden;
    font-size: 0;
    width: 746px;
    margin: 0 auto;
    margin-top: 30px;
  }
  #footer-link ul li {
    float: left;
    margin-left: 43px;
  }
  #footer-link ul li:first-child {
    margin-left: 0;
  }
  #footer-link ul li a {
    display: block;
    text-align: center;
    font-size: 11px;
    font-family:"HondaGlobalFontJP-Light",sans-serif;
    line-height: 1.3;
    width: 220px;
  }
  #footer-link ul li a img {
    width: 100%;
  }
  #footer-link #page-top {
    position: absolute;
    left: 50%;
    margin-left: 423px;
    width: 67px;
    height: 67px;
    background: url(../img/pagetop.png);
    top: -68px;
  }
  #footer-text {
    width: 880px;
    margin: 20px auto 0;
    font-size: 12px;
    font-family:"HondaGlobalFontJP-Light",sans-serif;
  }
  #footer-text .links {
    font-size: 0;
  }
  #footer-text .links li {
    float: left;
    margin-right: 30px;
    font-size: 12px;
    font-family:"HondaGlobalFontJP-Regular",sans-serif;
    line-height: 140%;
  }
  #footer-text .text {
    color: #4F4E4E;
    line-height: 1.5;
    background: url(../img/guarantee.png) no-repeat 0px 100px;
    padding-bottom: 50px;
  }
  #footer-text .text2 {
    margin-top: 10px;
    color: #4F4E4E;
    line-height: 1.5;
    background: url(../img/guarantee.png) no-repeat right 0;
  }
  #footer-text .box {
    margin: 0 auto;
  }
  #footer-text ul.links {
    overflow: hidden;
    padding-bottom: 10px;
  }
  #footer-text .text li:first-child {
    text-indent: -1em;
    padding-left: 1em;
  }
  footer {
    min-width: 980px;
    margin: 0 auto 110px;
    border-top: 1px solid #444;
  }
  footer .quick_link_wrap {
    margin: 0 auto;
    padding: 20px 0;
    background-color: #f0f0f0;
  }
  footer .quick_link {
    width: 880px;
    margin: 0 auto;
    position: relative;
    overflow: hidden;
  }
  footer .quick_link li {
    margin-right: 70px;
    margin-bottom: 15px;
    float: left;
    font-size: 14px;
    line-height: 36px;
  }
  footer .quick_link li:last-child {
    margin-right: 0;
  }
  #contents_area footer .quick_link li a {
    color: #444;
  }
  footer .quick_link li {
    position: relative;
  }
  footer .quick_link li a {
    color: #444;
  }
  footer .quick_link li a:before {
    content: "";
    margin-right: 10px;
    height: 36px;
    display: inline-block;
    vertical-align: middle;
  }
  footer .quick_link li.pdf a:before {
    width: 27px;
    background: url(../img/icon_footer_pdf.png) center center no-repeat;
    background-size: 27px auto;
  }
  footer .quick_link li.manual a:before {
    width: 50px;
    background: url(../img/icon_footer_manual.png) center center no-repeat;
    background-size: 50px auto;
  }
  footer .quick_link li.view_3d a:before {
    width: 34px;
    background: url(../img/icon_footer_3d.png) center center no-repeat;
    background-size: 34px auto;
  }
  footer .quick_link li.estimate a:before {
    width: 23px;
    background: url(../img/icon_footer_estimate.png) center center no-repeat;
    background-size: 23px auto;
  }
  footer .quick_link li.car a:before {
    width: 45px;
    background: url(../img/icon_footer_car.png) center center no-repeat;
    background-size: 45px auto;
  }
  footer .quick_link li.pdf {
    min-width: 120px;
  }
  footer .quick_link li.pdf a {
    vertical-align: top;
    line-height: 20px;
    height: 36px;
    display: inline-block;
    padding-left: 38px;
  }
  footer .quick_link li.pdf a:before {
    position: absolute;
    top: 0;
    left: 0;
  }
  footer .quick_link li.pdf a .size {
    position: absolute;
    left: 38px;
    bottom: 1px;
    font-size: 11px;
    font-family:"HondaGlobalFontJP-Light",sans-serif;
    line-height: 11px;
    color: #666;
  }
  footer .slider_wrap {
    width: 930px;
    margin: 0 auto 50px;
  }
  /*footer .guaranteed {
    width: 700px;
    margin: 30px auto 0;
    -ms-flex-pack: start;
    justify-content: flex-start;
  }
  footer .guaranteed .logo img {
    width: 150px !important;
  }
  footer .guaranteed .text {
    padding-left: 10px;
    font-size: 11px;
    font-family:"HondaGlobalFontJP-Light",sans-serif;
    line-height: 18px;
  }
  footer .guaranteed .text .link {
    margin-bottom: 0;
    font-size: 11px;
    font-family:"HondaGlobalFontJP-Light",sans-serif;
    line-height: 18px;
    text-align: left;
  }
  footer .guaranteed .text .link a {
    color: #0064a1;
    margin: 0;
    background: none;
    display: inline-block;
  }
  footer .guaranteed .text .link a::after {
    content: "";
    width: 16px;
    height: 16px;
    background: url(/navi/common/img/parts_ico_btn_detail_arrow.png) right center no-repeat;
    background-size: 16px auto;
    display: inline-block;
    position: relative;
    top: 3px;
    right: -5px;
  }*/
  
  footer .guaranteed {
		width: 880px;
		margin:0 auto;
		-webkit-box-pack: start;
		-webkit-justify-content: flex-start;
		-ms-flex-pack: start;
		justify-content: flex-start;
		align-items: flex-start;
	}

	footer .guaranteed .box_flex_item {
		width: 50%;
	}

	footer .guaranteed .logo img {
		width: 150px;
	}

	footer .guaranteed .text {
		padding-left: 10px;
		font-size: 11px;
		line-height: 18px;
	}

	footer .guaranteed .text .link {
		margin-bottom: 0;
		font-size: 11px;
		line-height: 18px;
		text-align: left;
	}

	footer .guaranteed .text .link a {
		color: #0064a1;
		margin: 0;
		background: none;
		display: inline-block;
	}

	footer .guaranteed .text .link a::after {
		content: "";
		width: 16px;
		height: 16px;
		background: url(/navi/common/img/parts_ico_btn_detail_arrow.png) right center no-repeat;
		background-size: 16px auto;
		display: inline-block;
		position: relative;
		top: 3px;
		right: -5px;
	}

	/*アンケートエリア*/
	section#kansou {
		background: #f0f0f0;
		width: 900px;
    	margin: 40px auto 0;
		padding: 40px 0;
	}
	
	section#kansou p.lead {
		text-align: center;
		font-family: "HondaGlobalFontJP-Bold", sans-serif;
		font-size: 18px;
		margin-bottom: 15px;
	}
	
	section#kansou p.caution {
		text-align: center;
		line-height: 1.5;
		margin-bottom: 10px;
	}
	
	section#kansou p#textLength {
		width: 530px;
		margin: 0 auto;
		text-align: right;
		margin-bottom: 5px;
	}
	
	section#kansou textarea {
		width: 530px;
		height: 100px;
		box-sizing: border-box;
		padding: 0.5em;
		display: block;
		margin: 0 auto;
		margin-bottom: 20px;
	}
	
	section#kansou #btn-confirm {
		width: 170px;
		height: 35px;
		display: block;
		margin: 0 auto;
		background: #797979;
		color: #fff;
		border: none;
		opacity: 0.5;
	}
	
	section#kansou #btn-confirm.on {
		opacity: 1;
		cursor: pointer;
	}
	
	section#kansou #btn-confirm.on:hover {
		opacity: 0.9;
	}
}

#section_survey,#kansou{
  display: none !important;
}

@media print, screen and (min-width: 769px) {
.sup .reg{
  font-size: 140%;
  position: relative;
  top: 4px;
  left: -2px;
}
sup .reg{
  font-size: 140%;
}
}