@charset "utf-8";
/* サイドナビ */
.sideNav {
	float: left;
	width: 230px;
}

div#sidenavi ul li a {
	display: block;
	background: #f2f2f2;
	padding: 6px;
	text-decoration: none;
	line-height: 1.5;
	color: #000;
	border-bottom: 2px solid #fff;
}
div#sidenavi ul li a:visited {
	text-decoration:none;
	color:#000;
}
div#sidenavi ul li a:hover {
	text-decoration:none;
	background:#4d4d4d;
	color:#fff;
}
div#sidenavi ul li a span {
	font-size: 93%;
	padding-left: 5px;
	border-left: 3px solid #696969;
	display: block;
}
div#sidenavi ul li a:hover span {
	padding-left:5px;
	border-left:3px solid #d2dce5;
}
div#sidenavi ul li a.self {
	background: #4d4d4d;
	color: #fff;
	font-weight: bold;
}
div#sidenavi ul li a.self span {
	border-left: 3px solid #d2dce5;
	color: #fff;
}

/* コンテンツ */
.mainContents {
	width: 700px;
	float: right;
}
.gototop {
	text-align: right;
	margin-top: 20px;
}

/* 共通パーツ
===============================*/
/* c-3 */
.mainContents .l-c3 {
	position: relative;
	color: #fff;
	background-color: #353535;
	font-weight: bold;
	line-height: 1.5;
	font-size: 13px;
	padding: 7px 4px 4px 7px;
	margin-bottom: 12px;
}
.mainContents .l-c3 h3 {
	float: left;
	border-left: 3px solid #f3f3f3;
	padding-left: 7px;
	display: inline-block;
}
.mainContents .l-c3 span.caution {
	font-size: 10px;
	font-weight: normal;
	margin-right: 0;
}
/* c-4 */
.contentsTitleHead {
	float: left\9;
}
.mainContents .l-c4 {
	float: right;
}
.mainContents .l-c4 span {
	white-space: nowrap\9;
}
.mainContents .l-c4 img {
	white-space: nowrap\9;
	vertical-align: middle;
	margin-right: 3px;
	margin-bottom: 3px;
}
.mainContents .l-c4 table {
	white-space: nowrap\9;
	font-weight: normal;
}
.mainContents .l-c4 table img {
	width: auto;
	white-space: nowrap\9;
}

/* 適用タイプがタイトル以外の所に入る場合 */
.tekiyou_area { margin-left: 5px;}
.tekiyou_area img {
	vertical-align: middle;
	margin-right: 3px;
	margin-bottom: 3px;
	width: auto !important;
}

/* 価格のテーブル
---------------------------------------------- */
.price_table {
	line-height: 1.5;
	font-size: 13px;
}
.price_table_price {
	text-align: right;
	font-size: 13px;
}

.price_table_tax01 {
	table-layout: fixed;
	display: table-cell;
}
.price_table_tax02 {
	table-layout: fixed;
	display: table-cell;
}


.price_table_row_bottom td {
	padding-bottom: 10px;
	border-bottom: 1px solid #000;
}
.price_table_row_sum td {
	padding-top: 10px;
}
.price_table_row_package td {
	border-top: 1px solid #000;
	border-bottom: 1px solid #000;
}
.price_table_row_package td.price_table_item {
	color: #fff;
	background-color: #f00;
	padding: 5px;
	border-left: 1px solid #000;
}
.price_table_row_package td.price_table_price {
	font-weight: bold;
	color: #f00;
	padding-left: 10px;
}
.price_table_row_package td.price_table_caution {
	border-right: 1px solid #000;
}
.price_table_caution02 {
	padding-bottom: 10px;
}
.wid190 { width: 190px;}


/* 仕切り線
---------------------------------------------- */
.partition {
	height: 3px;
	background: url(/ACCESS/common/img/bd_dot.gif) center 0 repeat-x;
	-webkit-background-size: auto 3px;
	background-size: auto 3px;
	border: none;
	margin: 20px 0;
}

/* ボーダー付きのリンク
---------------------------------------------- */
.caution_anchor01 {
	display: block;
	text-align: center;
	background: #33c;
	line-height: 1.5;
	color: #fff;
	font-weight: bold;
	padding: 5px;
	text-decoration: none;
	border: 3px double #fff;
}
.caution_anchor01:visited {
	background:#3333CC;
	color:#fff;
}
.caution_anchor01:hover {
	background:#330066;
	color:#FFFF66;
}

.caution_anchor02 {
	text-align:center;
	font-size: 13px;
	line-height: 1.5;
	padding:5px;
	border:1px solid #ccc;
}
.caution_anchor02 a {
	text-decoration: none;
}
.caution_anchor02 a:hover {
	text-decoration: underline;
	color:#c00;
}


/* ギャザズナビ
---------------------------------------------- */
.for_gathers {
	text-align: right;
	margin-bottom: 5px;
}
.for_gathers span {
	display: inline-block;
	color: #004EA2;
	font-size: 80%;
	line-height: 1.3;
	white-space: nowrap;
	text-align: right;
	padding: 2px;
	border: 1px solid #004EA2;
}

/* 動画
---------------------------------------------- */
.movieWrap {
	border:1px solid #a6a8ab;
	background:#ebebeb;
}
.movieLeft {
	float: left;
	width: 323px;
	padding-left: 15px;
}
.movieTtl {
	margin-bottom: 20px;
}
.movieRight {
	float: left;
	width: 320px;
	background-color: #e2e2e2;
	padding: 20px;
}

/* パッケージ
---------------------------------------------- */
.package_title {
	display: inline-block;
	color: #fff;
	font-weight: bold;
	font-size: 16px;
	background-color: #c00;
	padding: 6px 6px 6px 4px;
}
.package_body {
	padding: 10px;
	border: solid 2px #c00;
}

/* ドラレコ
---------------------------------------------- */
.dataTable td {
	padding: 5px;
	border: 1px solid #666;
}


/* ナノイー
---------------------------------------------- */
.nanoeWrapper {
	border: 3px solid #62a7d6;
	border-radius: 5px;
	padding: 15px;
	margin-bottom: 20px;
}
.nanoeTtl {
	color: #62a7d6;
	font-size: 16px;
	font-weight: bold;
	line-height: 1.5;
	margin-bottom: 5px;
}

/* プラズマクラスター
---------------------------------------------- */
.plasmacluster {
	width: 688px;
	display: table;
	padding:5px;
	border:1px solid #ddd;
	margin-bottom: 20px;
}
.plasmacluster img,.plasmacluster p {
	display: table-cell;
	vertical-align: middle;
}
/* Honda Dog
---------------------------------------------- */
.hondadog_icon {
	vertical-align: middle !important;
}


/* ETCコーション
---------------------------------------------- */
.etc_caution {
	padding: 10px 0;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
}

/* フォント
---------------------------------------------- */
/* D-1 */
.f-d1 {
	font-size: 14px;
	font-weight: bold;
	line-height: 1.3;
}
.f-d1-bottom { margin-bottom: 12px;}
/* D-2 */
.access_price_wrap {
	font-size: 13px;
	line-height: 1.3;
	margin-bottom: 10px;
}
.access_price_tax {
	font-size: 16px;
	font-weight: bold;
	line-height: 1.3;
}
/* D-3 */
.f-d3 {
	font-size: 13px;
	line-height: 1.5;
	margin-bottom: 12px;
}
/* D-4 */
.f-d4 {
	font-size: 13px;
	line-height: 1.5;
	font-weight: bold;
	margin-bottom: 5px;
}
/* D-5 */
.f-d5 {
	font-size: 12px;
	line-height: 1.5;
	margin-bottom: 12px;
}

/* フッターのコーション(D-6) */
.common_caution {
	margin: 20px auto 0;
	background-color: #f0f0f0;
	padding: 12px 12px 7px 12px;
}
.common_caution li {
	text-indent: -1em;
	margin-left: 1em;
	margin-bottom: 5px;
}
/* D-8 */
.f-d8 {
	font-size: 10px;
	line-height: 1.3;
	font-weight: bold;
}

/* D-9 */
.f-d9 {
	font-size: 10px;
	line-height: 1.5;
}
.f-d9 li {
	text-indent: -1em;
	margin-left: 1em;
}

/* 型番 */
.kataban {
	margin: 1em 0 1em 1em;
}

/*適用タイプ　201708add*/
img.tekiyoutype {
	height: 18px;
}

/* 画像下のアキ
---------------------------------------------- */
/* F-1 */
.p-f1 { margin-bottom: 20px;}
.p-f1 img { vertical-align: bottom;}
.p-caution { margin-bottom: 3px;}
.p-f3 { margin-bottom: 8px;}


/* インデント
===============================*/
.displayblock { display: block;}
.displayinlineblock { display: inline-block;}

.indent2em { padding-left: 2em; text-indent: -2em; }
.indent4em { padding-left: 4em; text-indent: -4em; }
.indent5em { padding-left: 5em; text-indent: -5em; }
.indent6em { padding-left: 6em; text-indent: -6em; }
.indent7em { padding-left: 7em; text-indent: -7em; }
.indent8em { padding-left: 8em; text-indent: -8em; }
.indent9em { padding-left: 9em; text-indent: -9em; }
.indent10em { padding-left: 10em; text-indent: -10em; }
.indent11em { padding-left: 11em; text-indent: -11em; }
.indent12em { padding-left: 12em; text-indent: -12em; }
.indent13em { padding-left: 13em; text-indent: -13em; }
.indent14em { padding-left: 14em; text-indent: -14em; }
.indent15em { padding-left: 15em; text-indent: -15em; }
.indent16em { padding-left: 16em; text-indent: -16em; }

@media only screen and (max-width: 736px) {
	/* サイドナビ */
	.sideNav {
		float: none;
		width: 100%;
	}
	.sideNav h2 a {
		display: block;
		width: 84%;
		-webkit-background-size: cover !important;
		background-size: cover !important;
		padding-top: 7.2%;
		margin: 0 auto 20px;
	}
	div#sidenavi h2.titleExterior a {
		background: url(/ACCESS/common/img/category_title_exterior_sp.gif) 0 0 no-repeat;
	}
	div#sidenavi h2.titleExteriorCarrier a {
		background: url(/ACCESS/common/img/category_title_exteriorcarrier_sp.gif) 0 0 no-repeat;
	}
	div#sidenavi h2.titleInterior a {
		background: url(/ACCESS/common/img/category_title_interior_sp.gif) 0 0 no-repeat;
	}
	div#sidenavi h2.titleSecurity_support a {
		background: url(/ACCESS/common/img/category_title_security_support_sp.gif) 0 0 no-repeat;
	}
	div#sidenavi h2.titleSecurity_support2 a {
		background: url(/ACCESS/common/img/category_title_security_support_sp2.gif) 0 0 no-repeat;
	}
	div#sidenavi h2.titleNavi_audio_etc a {
		background: url(/ACCESS/common/img/category_title_navi_audio_etc_sp.gif) 0 0 no-repeat;
	}
	div#sidenavi h2.titleNavi a {
		background: url(/ACCESS/common/img/category_title_navi_sp.gif) 0 0 no-repeat;
	}
	div#sidenavi h2.titleNavi_etc a {
		background: url(/ACCESS/common/img/category_title_navi_etc_sp.gif) 0 0 no-repeat;
	}
	div#sidenavi h2.titleEtc a {
		background: url(/ACCESS/common/img/category_title_etc_sp.gif) 0 0 no-repeat;
	}
	div#sidenavi h2.titleCarcaring a {
		background: url(/ACCESS/common/img/category_title_carcaring_sp.gif) 0 0 no-repeat;
	}
	div#sidenavi h2.titleAudio_etc a {
		background: url(/ACCESS/common/img/category_title_audio_etc_sp.gif) 0 0 no-repeat;
	}
	div#sidenavi h2.titleNavioption a {
		background: url(/ACCESS/common/img/category_title_navioption_sp.gif) 0 0 no-repeat;
	}
	div#sidenavi h2.titleNavi_audio a {
		background: url(/ACCESS/common/img/category_title_navi_audio_sp.gif) 0 0 no-repeat;
	}
	
	.sideNav h2 img { display: none;}
	#sidenavi .sideNavSelect {
		display: block;
		color: #000;
		font-size: 14px;
		line-height: 1.0;
		text-decoration: none;
		background-color: #f0f0f0;
		background: #f0f0f0 url(/ACCESS/common/img/ico_detail_arrow_bottom.gif) 91.746% center no-repeat;
		-webkit-background-size: 10px auto;
		background-size: 10px auto;
		padding: 16px 30px 15px 12px;
		margin-bottom: 30px;
	}

	/* コンテンツ */
	.mainContents {
		float: none;
		width: 100%;
	}
	.gototop {
		text-align: right;
		margin-top: 5px;
	}

	/* c-3 */
	.mainContents .l-c3 {
		width: 86.6666%;
		color: #000;
		background: none;
		font-weight: bold;
		line-height: 1.3;
		font-size: 14px;
		padding: 0;
		margin: 0 auto 15px;
	}
	.mainContents .l-c3.l-c3-tekiyou .contentsTitleHead {
		margin-bottom: 6px;
	}
	.mainContents .l-c3 .contentsTitleHead {
		background-color: #353535;
		color: #fff;
		border-left: none;
		padding: 7px 7px 7px 8px;
	}
	.mainContents .l-c3 h3 {
		float: none;
		display: block;
		color: #fff;
		padding-left: 7px;
		border-left: 3px solid #f3f3f3;
	}
	.mainContents .l-c3 h3 span {
		color: #fff;
		border-left: none;
		padding-left: 0;
	}
	.mainContents .l-c3 span.caution {
		display: block;
		font-size: 10px;
		font-weight: normal;
		border-left: none;
		padding-left: 0;
	}

	/* c-4 */
	.mainContents .l-c4 {
		float: none;
		text-align: right;
		color: #000;
	}
	.mainContents .l-c4 table {
		font-weight: normal;
	}
	.mainContents .l-c4 .l-c4-lead {
		width: 55%;
		text-align: right;
	}

	/* 適用タイプがタイトル以外の所に入る場合 */
	.tekiyou_area { display: block;}

	/* 適用タイプとテキストを並べる場合 */
	.tekiyou_area_align {
		display:inline-block;
	}

	/* 価格のテーブル
	---------------------------------------------- */
	.price_table {
		display: block;
		width: 86.6666%;
		margin: 0 auto;
	}
	.col-e1-sp .price_table {
		width: 100%;
	}
	.price_table_row {
		display: block;
		margin-bottom: 10px;
	}
	.price_table td.price_table_price {
		float: right;
		padding-left: 0;
	}
	.price_table_item {
		width: 45%;
		float: left;
	}
	.price_table_price {
		width: 52%;
		float: none;
		background-color: #fff;
		display: inline-block;
		text-align: right;
		font-weight: bold;
		padding-right: 2%;
	}
	.price_table tbody,.price_table tr,.price_table td {
		display: block;
	}
	.price_table tbody {
		width: 100%;
	}

	.price_table_row_bottom td {
		border-bottom: none;
	}
	.price_table_row_bottom td.price_table_price {
		padding-bottom: 0;
	}
	.price_table_row_sum {
		display: block;
		width: 100%;
		border-top: 1px solid #000;
	}
	.price_table_row_sum td.price_table_caution {
		background-color: #fff;
		padding-top: 0;
	}
	.price_table_caution {
		display: inline-block;
		float: right;
		width: 54%;
		font-size: 11px;
		text-align: right;
		border: none;
	}
	.price_table_caution02 {
		display: block;
		width: 100%;
	}
	.price_table_row_package {
		box-sizing: border-box;
		background-color: #f00;
		border: 1px solid #000;
	}
	.price_table_row_package td.price_table_item {
		color: #fff;
		font-weight: bold;
		padding: 16px 0 0 1%;
	}
	.price_table_row_sum .price_table_caution {
		border: none;
		padding-top: 0;
	}
	.price_table_row_package td {
		border: none !important;
	}
	.price_table_row_package td.price_table_caution {
		background-color: #fff;
	}
	.price_table_row_package .price_table_item {
	}
	.price_table_row_package .price_table_price { padding-top: 8px;}
	.price_table_row_package .price_table_caution { padding-bottom: 8px;}


	/* 仕切り線
	---------------------------------------------- */
	.partition {
		margin: 10px auto;
	}

	/* ボーダー付きのリンク
	---------------------------------------------- */
	.caution_anchor01 {
		display: block;
		text-align: center;
		background: #33c;
		line-height: 1.5;
		color: #fff;
		font-weight: bold;
		padding: 5px;
		text-decoration: none;
		border: 3px double #fff;
	}
	.caution_anchor01:visited {
		background: #33c;
		color:#fff;
	}
	.caution_anchor01:hover {
		background: #33c;
		color: #fff;
	}

	/* 動画
	---------------------------------------------- */
	.movieWrap {
		border:1px solid #a6a8ab;
		background:#ebebeb;
	}
	.movieLeft {
		float: none;
		/*width: 86.6666%;*/
		width: 90%; /*201905change*/
		padding: 0 0 20px 0;
		margin: 0 auto;
	}
	.movieTtl {
		margin-bottom: 20px;
	}
	.movieTtl img {
		width: 100%;
	}
	.movieTxt { width: 100%;}
	.movieTxt img { width: 100%;}

	.movieRight {
		float: none;
		/*width: 86.6666%;*/
		width: 90%; /*201905change*/
		background: none;
		padding: 0 0 20px;
		margin: 0 auto;
	}
	#myExperience {
		width: 100% !important;
		height: auto !important;
	}
	#myExperience2 {
		width: 100% !important;
		height: auto !important;
	}
	
	


	/* パッケージ
	---------------------------------------------- */
	.package_title {
		display: block;
	}

	/* ドラレコ
	---------------------------------------------- */
	.dataTable {
		width: 100%;
	}
	
	table.dataTable,
	table.dataTable td {
		border-collapse:collapse;
	}	
	

	/* プラズマクラスター
	---------------------------------------------- */
	.plasmacluster {
	}
	.plasmacluster p { padding-left: 10px;}

	/* フォント
	---------------------------------------------- */
	/* D-1 */
	.f-d1 {
		font-size: 14px;
		font-weight: bold;
		line-height: 1.3;
	}
	.f-d1-bottom { margin-bottom: 15px;}
	/* D-2 */
	.access_price_wrap {
		font-size: 14px;
		line-height: 1.3;
		margin-bottom: 10px;
	}
	.access_price_tax {
		font-size: 16px;
		font-weight: bold;
		line-height: 1.3;
	}

	/* D-3 */
	.f-d3 {
		font-size: 14px;
		line-height: 1.3;
		margin-bottom: 15px;
	}
	/* D-4 */
	.f-d4 {
		font-size: 12px;
		line-height: 1.5;
		font-weight: bold;
		margin-bottom: 6px;
	}
	/* D-5 */
	.f-d5 {
		font-size: 12px;
		line-height: 1.5;
		margin-bottom: 6px;
	}
	/* フッターのコーション(D-6) */
	.common_caution {
		margin: 20px auto 0;
		font-size: 11px;
		line-height: 1.3;
		background-color: #f0f0f0;
		padding: 10px;
	}
	.common_caution li {
		text-indent: -1em;
		margin-left: 1em;
		margin-bottom: 5px;
	}
	/* D-8 */
	.f-d8 {
		font-size: 9px;
		line-height: 1.3;
		font-weight: bold;
	}
	/* D-9 */
	.f-d9 {
		font-size: 9px;
		line-height: 1.5;
	}


	/* 画像下のアキ
	---------------------------------------------- */
	/* F-1 */
	.p-f1 { margin-bottom: 20px;}
	.p-caution { margin-bottom: 6px;}
	.p-f3 { margin-bottom: 6px;}
	
	
	/*201702add*/
	.selectModalList li a.self {
	color: #c00;
	}
}

/*201707add*/
p.dailyluxeLink {
	margin-bottom: 20px;
	text-align: center;
	border:1px solid #ccc;
	padding:15px 10px;
	font-weight:bold;
	font-size:15px;
}

p.dailyluxeLink a {
	text-decoration: none;
	color:#404040;
	display: inline-block;
	padding-left:10px;
	background:url(/ACCESS/common/img/img_arrow.png) left 4px no-repeat;
}

p.dailyluxeLink a:hover {
	color: #037B9F;
	text-decoration: underline;
}


/*201707add*/
p.kaihatsuStory {
	text-align: center;
	font-weight:bold;
	font-size:13px;
}

p.kaihatsuStory a {
	display:block;
	padding:10px;
	border:1px solid #660e12;
	color:#000;
	text-decoration:none;
	transition: all .3s;
}

p.kaihatsuStory a span {
	text-decoration: none;
	display: inline-block;
	position: relative;
}

p.kaihatsuStory a span::before {
	content: "";
  	position: absolute;
  	left: -14px;
  	background: #660e12;
  	height: 15px;
  	width: 15px;
  	border-radius: 50%;
	transition: all .3s;
}

p.kaihatsuStory a:hover span::before {
	content: "";
  	position: absolute;
  	left: -14px;
  	background: #fff;
  	height: 15px;
  	width: 15px;
  	border-radius: 50%;
}

p.kaihatsuStory a span::after {
	content: '';
  width: 3px;
  height: 3px;
  border: 0px;
  border-top: solid 2px #fff;
  border-right: solid 2px #fff;
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  top: 5px;
  left: -10px;
  transition: all .3s;
}

p.kaihatsuStory a:hover span::after {
	content: '';
  width: 3px;
  height: 3px;
  border: 0px;
  border-top: solid 2px #660e12;
  border-right: solid 2px #660e12;
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  top: 5px;
  left: -10px;
}

p.kaihatsuStory a:hover {
	color: #fff;
	text-decoration: none;
	background: #660e12;
}


/*201809add*/
ul.rearcameranosuiteki{
	display: flex;
	display: -ms-flexbox;
	display: -webkit-box;
	display: -webkit-flex;
}

ul.rearcameranosuiteki li{
	width: 335px;
}

ul.rearcameranosuiteki li.arrow{
	width: 30px;
	font-size: 20px;
	text-align:  center;
	padding-top: 80px;
}

/*201810add*/
@media only screen and (min-width: 737px){
.pccb {
	clear: both;
}

.keycover_naname_pd {
	padding-top: 42px;
}
	
.keycover_naname_pd2 {
	padding-top: 60px;
}	

.keycover_keinaname_pd {
	padding-top: 86px;
}
}

@media only screen and (max-width: 736px) {
	ul.rearcameranosuiteki{
		flex-direction: column;
	}

	ul.rearcameranosuiteki li{
		width: 100%;
	}
	
	ul.rearcameranosuiteki li.arrow{
		width: 100%;
		text-align:  center;
		padding-top: 0;
		transform: rotate(90deg);
	}
	
	.for_gathers span{
	 	font-size: 2.4vw;
	}
	
	
	.partition.col-e1.mb35{
		margin: 20px auto !important;
	}
	
	.keycover_naname_pd {
		padding-top: 26%;
	}
	
	.keycover_naname_pd2 {
		padding-top: 40%;
	}
	
	.keycover_keinaname_pd {
		padding-top: 55%;
	}
	
	.sppl1em{
		padding-left: 1em;
		display: inline-block;
	}

}


/*アクティトラック用*/
.actytruck_caution {
	font-weight: bold;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
}

.actytruck_caution dt {
	color: #f00;
}

@media only screen and (max-width: 736px) {
	.actytruck_caution {
		flex-direction: column;
	}
}

/*201910 add*/
.bold{ font-weight: bold;}

.widDR {
	display: flex;
	align-items: center;
}
.widDR .icon {
	width: 110px;
}

.widDR .icon img{
	width: 100px;
}

@media only screen and (max-width: 736px) {
	.widDR {
		display: block;
	}
	
	.widDR .icon {
		width: auto;
		margin-bottom: 20px;
		text-align: center;
	}
}


/*201912add*/
.new_icon {
	width: 37px;
	vertical-align: middle;
	margin-top: -2px;
}

@media only screen and (max-width: 736px) {
	.new_icon {
		width: 32px;
		vertical-align: middle;
	}
}


/*202004add*/
@media print, screen and (min-width : 769px){
/*prev nextボタン*/	
ul.prev_next {
	display: flex;
	justify-content: space-between;
	margin-top: 30px;
}

ul.prev_next li a {
	display: inline-block;
	width: 180px;
	background: #4d4d4d;
	color: #fff;
	text-decoration: none;
	text-align: center;
	line-height: 40px;
	font-weight: bold;
	position: relative;
	transition: all 0.3s;
}

ul.prev_next li a span {
	transition: all 0.3s;
}

ul.prev_next li a:hover {
	background: #c00;
}

ul.prev_next li.prev a span {
	margin-left: 10px;
}	
	
ul.prev_next li.prev a:hover span {
	margin-left: -2px;
}

ul.prev_next li.next a span {
	margin-right: 10px;
}	
	
ul.prev_next li.next a:hover span {
	margin-right: -2px;
}

ul.prev_next li a::after {
	position: absolute;
	content: '';
	display: block;
	top: 15px;
	width: 7px;
    height: 7px;
	transition: all 0.3s;
}

ul.prev_next li.prev a::after {
	left: 24px;
    border-top: 3px solid #fff;
    border-right: 3px solid #fff;
    -webkit-transform: rotate(-135deg);
    transform: rotate(-135deg);
}

ul.prev_next li.prev a:hover::after {
	left: 18px;
}

ul.prev_next li.next a::after {
	right: 24px;
    border-top: 3px solid #fff;
    border-right: 3px solid #fff;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

ul.prev_next li.next a:hover::after {
	right: 18px;
}
	
	/*評価を聞くエリア*/
	section#section_survey {
		background: #eaf5f9;
		padding: 40px 0;
		margin-top: 30px;
	}
	
	section#section_survey p.lead {
		text-align: center;
		font-weight: bold;
		font-size: 18px;
		margin-bottom: 15px;
	}
	
	section#section_survey ul.question {
		display: flex;
		justify-content: space-between;
		width: 300px;
		margin: 0 auto;
	}
	
	section#section_survey ul.question li {
		width: 50px;
	}
	
	section#section_survey ul.question li a {
		width: 50px;
		height: 50px;
		cursor: pointer;
		display: block;
		background-repeat: no-repeat;
		background-size: 50px 50px;
	}
	
	section#section_survey ul.question li a.link_01 {
		background-image: url("../img/icon_bad_off.png");
	}
	
	section#section_survey ul.question li a.link_01:hover {
		background-image: url("../img/icon_bad_on.png");
	}
	
	section#section_survey ul.question li a.link_02 {
		background-image: url("../img/icon_normal_off.png");
	}
	
	section#section_survey ul.question li a.link_02:hover {
		background-image: url("../img/icon_normal_on.png");
	}
	
	
	section#section_survey ul.question li a.link_03 {
		background-image: url("../img/icon_good_off.png");
	}
	
	section#section_survey ul.question li a.link_03:hover {
		background-image: url("../img/icon_good_on.png");
	}
	
	section#section_survey p.answered {
		text-align: center;
		font-size: 14px;
		line-height: 50px;
		display: none;
	}
	
	
	/*アンケートエリア*/
	section#kansou {
		background: #f0f0f0;
		margin-top: 30px;
		padding: 40px 0;
	}
	
	section#kansou p.lead {
		text-align: center;
		font-weight: bold;
		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#kansou #btn-confirm:hover {
		opacity: 0.8;
	}*/
}



@media print, screen and (max-width : 768px){	
	/*prev nextボタン*/
	ul.prev_next {
		width: 86.6666%;
		margin: 0 auto;
	display: flex;
	justify-content: space-between;
	margin-top: 30px;
}

ul.prev_next li a {
	display: inline-block;
	width: 38vw;
	background: #4d4d4d;
	color: #fff;
	font-size: 13px;
	text-decoration: none;
	text-align: center;
	line-height: 40px;
	font-weight: bold;
	position: relative;
}

ul.prev_next li a::after {
	position: absolute;
	content: '';
	display: block;
	top: 15px;
	width: 7px;
    height: 7px;
}
	
ul.prev_next li.prev a span {
	margin-left: 10px;
}	

ul.prev_next li.next a span {
	margin-right: 10px;
}	

ul.prev_next li.prev a::after {
	left: 10px;
    border-top: 3px solid #fff;
    border-right: 3px solid #fff;
    -webkit-transform: rotate(-135deg);
    transform: rotate(-135deg);
}


ul.prev_next li.next a::after {
	right: 10px;
    border-top: 3px solid #fff;
    border-right: 3px solid #fff;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

	/*評価を聞くエリア*/
	section#section_survey {
		width: 86.6666%;
		margin: 6vw auto;
		background: #eaf5f9;
		padding: 9vw 0;
	}
	
	section#section_survey p.lead {
		text-align: center;
		font-weight: bold;
		font-size: 3.7333vw;
		margin-bottom: 4vw;
	}
	
	section#section_survey ul.question {
		display: flex;
		justify-content: space-between;
		width: 56vw;
		margin: 0 auto;
	}
	
	section#section_survey ul.question li {
		width: 12vw;
	}
	
	section#section_survey ul.question li a {
		width: 12vw;
		height: 12vw;
		cursor: pointer;
		display: block;
		background-repeat: no-repeat;
		background-size: 12vw 12vw;
	}
	
	section#section_survey ul.question li a.link_01 {
		background-image: url("../img/icon_bad_off.png");
	}
	
	section#section_survey ul.question li a.link_01:hover {
		background-image: url("../img/icon_bad_on.png");
	}
	
	section#section_survey ul.question li a.link_02 {
		background-image: url("../img/icon_normal_off.png");
	}
	
	section#section_survey ul.question li a.link_02:hover {
		background-image: url("../img/icon_normal_on.png");
	}
	
	section#section_survey ul.question li a.link_03 {
		background-image: url("../img/icon_good_off.png");
	}
	
	section#section_survey ul.question li a.link_03:hover {
		background-image: url("../img/icon_good_on.png");
	}
	
	section#section_survey p.answered {
		text-align: center;
		font-size: 14px;
		min-height: 12vw;
		display: none;
	}
	
	/*アンケートエリア*/
	section#kansou {
		width: 86.6666%;
		margin: 0 auto;
		background: #f0f0f0;
		margin-top: 6vw;
		padding: 9vw 0;
	}
	
	section#kansou p.lead {
		text-align: center;
		font-weight: bold;
		font-size: 3.4333vw;
		margin-bottom: 4vw;
	}
	
	section#kansou p.caution {
		text-align: center;
		line-height: 1.5;
		font-size: 3vw;
		margin-bottom: 10px;
	}
	
	section#kansou p#textLength {
		width: 76vw;
		margin: 0 auto;
		text-align: right;
		font-size: 3vw;
		margin-bottom: 5px;
	}
	
	section#kansou textarea {
		width: 76vw;
		height: 28vw;
		box-sizing: border-box;
		padding: 0.5em;
		display: block;
		margin: 0 auto;
		margin-bottom: 20px;
		font-size: 16px;
		font-family:"メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	}
	
	section#kansou #btn-confirm {
		width: 44vw;
		height: 8.8vw;
		display: block;
		margin: 0 auto;
		background: #797979;
		color: #fff;
		border: none;
		cursor: pointer;
	}
	
	/* iOSでのデフォルトスタイルをリセット */
	section#kansou input[type="submit"],
	section#kansou input[type="button"] {
		border-radius: 0;
		-webkit-box-sizing: content-box;
		-webkit-appearance: button;
		appearance: button;
		border: none;
		box-sizing: border-box;
		cursor: pointer;
	}
	
	section#kansou input[type="submit"]::-webkit-search-decoration,
	section#kansou input[type="button"]::-webkit-search-decoration {
		display: none;
	}
	
	section#kansou input[type="submit"]::focus,
	section#kansou input[type="button"]::focus {
		outline-offset: -2px;
	}
}




/*202211add*/
div.viscotecsWrapper {
	background: #fafafa;
	border: 1px solid #999;
}


@media only screen and (min-width: 737px){
.keycover2022hatsubaiyotei {
	display: flex;
	justify-content: space-between;
	margin-bottom: 10px;
}
	
.keycover2022hatsubaiyotei div {
	width: 344px;
}

.keycover2022hatsubaiyotei div p {
	border: 1px solid #f00;
	color: #f00;
	font-size: 11px;
	text-align: center;
	padding: 0.4em;
	line-height: 11px;
}
	
div.viscotecsWrapper {
	padding: 25px 30px 20px;
	margin-bottom: 40px;
}


div.viscotecsWrapper > p:nth-child(1) img {
	width: 122px;
}
	
div.viscotecsWrapper > p:nth-child(2) {
	margin: 10px auto 20px;
	padding-bottom: 16px;
	border-bottom: 1px solid #999;
	font-size: 11px;
}
	
div.viscotecsWrapper p:nth-child(2) img {
	width: 50px;
	margin-right: 3px;
	vertical-align: middle;
}
	
div.viscotecsWrapper div.explanation {
	display: flex;
	justify-content: space-between
}
	
div.viscotecsWrapper div.explanation .text {
	width: 375px;
	text-align: justify;
}
	
div.viscotecsWrapper div.explanation .photo {
	width: 236px;
}
	
div.viscotecsWrapper div.explanation .photo img {
	width: 100%;
}	
	
}


@media print, screen and (max-width : 768px){
	.keycover2022hatsubaiyotei {
	display: flex;
	justify-content: space-between;
	margin-bottom: 10px;
}
	
.keycover2022hatsubaiyotei div {
	width: 47.6921%;
}

.keycover2022hatsubaiyotei div p {
	border: 1px solid #f00;
	color: #f00;
	font-size: 10px;
	text-align: center;
	padding: 0.4em;
	line-height: 10px;
}
	
div.viscotecsWrapper {
	padding: 5vw 6.4vw 4vw;
	margin-bottom: 7vw;
}


div.viscotecsWrapper > p:nth-child(1) img {
	width: 28vw;
}
	
div.viscotecsWrapper > p:nth-child(2) {
	margin: 2.666vw auto 5.32vw;
	padding-bottom: 3.7333vw;
	border-bottom: 1px solid #999;
	font-size: 10px;
}
	
div.viscotecsWrapper p:nth-child(2) img {
	width: 12.4vw;
	margin-right: 2px;
	vertical-align: middle;
}
	
div.viscotecsWrapper div.explanation .text {
	margin-bottom: 4vw;
}
	


	
div.viscotecsWrapper div.explanation .photo img {
	width: 100%;
}
}


/*============================ 202211 ZR-V「関連おすすめアクセサリー」*/

.recommendItemWrapper {
	margin: 40px 0;
}

.recommendItemWrapper > p {
	font-size: 16px;
    font-weight: bold;
    border-bottom: 1px solid #999;
    padding-bottom: 4px;
    margin-bottom: 17px;
}

.recommendItemWrapper > ul {
	display: flex;
	justify-content: space-between;
}

.recommendItemWrapper > ul li {
	width: 224px;
}

.recommendItemWrapper > ul li img {
	outline: 1px solid #ccc;
	outline-offset: -1px;
	margin-bottom: 10px;
}

.recommendItemWrapper > ul li a {
	text-decoration: none;
	color: #000;
}

.recommendItemWrapper > ul li a:hover {
	color: #c00;
}

.recommendItemWrapper > ul li a:hover img{
	opacity: 0.8;
}


@media only screen and (max-width: 736px) {
	.recommendItemWrapper {
	margin: 30px auto;
}

.recommendItemWrapper > p {
	font-size: 15px;
    margin-bottom: 14px;
}

.recommendItemWrapper > ul {
	display: block;
}

.recommendItemWrapper > ul li {
	width: 100%;
	margin-bottom: 20px;
}

.recommendItemWrapper > ul li img {
	display: block;
	width: 100%;
	margin-bottom: 10px;
}

.recommendItemWrapper > ul li a {
	text-decoration: none;
	color: #000;
}
	
}


/*============================ 202211 ZR-V「YouTube動画」*/
@media only screen and (max-width: 736px) {
	.zrvmovieArea {
		aspect-ratio: 16 / 9;
	}
	
	.zrvmovieArea iframe {
		width: 100%;
		height: 100%;
	}
}


/*202410「ハイグレードスピーカシステム」バナー追加対応*/
@media (hover: hover) and (pointer: fine) {
	a.trans2024:hover picture,
	a.trans2024:hover img{
		opacity: 0.9;
	}
}
