@charset "utf-8";

/* ICON CONTENTS -- navi PAGE
------------------------------------------------------------------*/

#iconbox{ padding:10px; border:1px solid #ccc;}
#iconbox h3{
	padding:10px 0 10px 10px;
	margin:0 0 10px 0;
	line-height:1;
	position: relative;
	background:#757579;
	color:#fff;
	font-size:14px;
	font-weight:normal;
}
#iconbox #note{ position: absolute; top: 15px; right: 10px; font-size:11px; }
#iconbox ul{
	padding:0;
	margin:0 -4px 0 0;
}
#iconbox li {
	position:relative;
	width:106px;
	height:50px;
	margin:0 4px 4px 0;

	float:left;
	list-style:none;
	text-align: center;
	font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', '游ゴシック', 'Yu Gothic', '游ゴシック体', 'YuGothic', 'Meiryo UI', 'メイリオ', sans-serif;
	background-color: #006EFF;
}
#iconbox li:before {
     content: "";
     display: inline-block;
     vertical-align: middle;
     height: 100%;
     margin-right: -0.5%;
}
#iconbox li p {
	display: inline-block;
 	 vertical-align: middle;
	color: #fff;
	line-height: 1.2em;

}
#iconbox li span {
	font-size: 75%;
	position: absolute;
	right: 1.5px;
	top: 1.5px;
	color: #fff;
}
span.red{
	color:#C00;
	}
 /*Chrome*/
@media all and (-webkit-min-device-pixel-ratio:0) and (min-resolution: .001dpcm) {
#iconbox li span {
	right: 1.5px;
	top: 0.5px;
}
}


/* CAR NAME ICON */
#icon_carbox{ padding:10px; border:1px solid #ccc; clear:both;}
#icon_carbox h3{
	padding:10px 0 10px 10px;
	margin:0 0 10px 0;
	line-height:1;
	position: relative;
	background:#757579;
	color:#fff;
	font-size:14px;
	font-weight:normal
}
#icon_carbox h3 p{ position:absolute; right:4px; top:2px; font-size:9px; color:#F00; width:400px; line-height:11px; padding:2px; }
#icon_carbox ul{ padding:0; margin:0}
#icon_carbox li{ padding:1px; margin:0; float:left; list-style:none;}
#car_area{ border:1px solid #CCC; padding:2px 0 2px 3px; width:871px;}
#car_area li img	{display: none;}
#car_area li img	{_width:16px; _height:23px;}
#car_area li.active{cursor: pointer;}
#car_area li.on{ cursor:default; }
#car_area li 	{width:122px; height:26px; background-position: 1px 1px;}
/*
#car_area li a	{display: block; width:122px; height:26px;}
*/

/* option ICON */
#icon_carbox .option{
	margin-top:10px;
	padding:0;
	margin: 0;
	position: relative;
	height:50px;
	font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', '游ゴシック', 'Yu Gothic', '游ゴシック体', 'YuGothic', 'Meiryo UI', 'メイリオ', sans-serif;
}


#icon_carbox .option ul {
	padding:0;
	margin:5px -4px 5px 0;
	display: none;
	top: 0;
	left: 0;
}
#icon_carbox .option li {
	position:relative;
	width:106px;
	height:50px;
	margin-right:4px;
	margin-bottom:4px;
	text-align: center;
	background-color: #777872;

	box-sizing:border-box;
}
#icon_carbox .option li:before {
     content: "";
     display: inline-block;
     vertical-align: middle;
     height: 100%;
     margin-right: -0.5%;
}
#icon_carbox .option li p {

	display: inline-block;
 	 vertical-align: middle;
	color: #fff;
	line-height: 1.2em;
	text-shadow:1px 1px rgba(100,100,100, 0.2);

}
.option_off {
	padding-left:0px;
 	 background-image: none;
}
.option_on {
	background: url(/accessory/navi_audio/common/img/option_arrow.png),linear-gradient(to bottom, #e58d9a 0%, #e7576a 100%);
	background-repeat: no-repeat;
	background-position:0px center;
	border-top: solid 1px #ebaeb7;
	border-bottom: solid 1px #bc4756;
	border-left: solid 1px #d06c7a;
	border-right: solid 1px #d26573;

	border-top: solid 1px #ebaeb7;
	border-bottom: solid 1px #bc4756;
	border-left: solid 1px #d06c7a;
	border-right: solid 1px #d26573;
	border-width: 1px;
  	border-style: solid;
}
.option_on_nolink {
	background: linear-gradient(to bottom, #e58d9a 0%, #e7576a 100%);
	background-repeat: no-repeat;
	background-position:0px center;
	border-top: solid 1px #ebaeb7;
	border-bottom: solid 1px #bc4756;
	border-left: solid 1px #d06c7a;
	border-right: solid 1px #d26573;

	border-top: solid 1px #ebaeb7;
	border-bottom: solid 1px #bc4756;
	border-left: solid 1px #d06c7a;
	border-right: solid 1px #d26573;
	border-width: 1px;
  	border-style: solid;
}

#icon_carbox .option li span.annotation {
	font-size: 75%;
	position: absolute;
	right: 1.5px;
	top: 1.5px;
	color: #fff;
}

 /*Chrome*/
@media all and (-webkit-min-device-pixel-ratio:0) and (min-resolution: .001dpcm) {
#icon_carbox .option li span.annotation {
	right: 1.5px;
	top: 0px;
}
}

#icon_carbox .option li span.space01 {
	font-size:90%;
	letter-spacing:-1px;
}

#icon_carbox .option li span.space02 {
	font-size:95%;
	letter-spacing:-0.5px;
}
#icon_carbox .option li span.space03 {
	font-size:90%;
	letter-spacing:-2px;
}

.onmouse {
	cursor: pointer;
}



#icon_carbox #note{
	position: absolute !important;
	top: 3px !important;
	right: 10px !important;
	font-size:9px;
	color: #fff;
	background-color:transparent;
	width:auto !important;
	line-height:12px;
	}
#icon_carbox #note_s{
	position: absolute !important;
	top: 9px !important;
	right: 10px !important;
	font-size:9px;
	color: #fff;
	background-color:transparent;
	width:auto !important;
	line-height:12px;
	}

/* アイコン注釈 */
#explanatory{
	font-size:10px;
	line-height:16px;
	padding:10px;
	}
#explanatory ul{ padding:0; margin:0; }
#explanatory li{
	padding:0;
	margin:0;
	list-style:none;
	}
#explanatory .attention{ color:#C00;}

/*　車種名　設定　*/

#list_legacy			{ background:url(../img/icon_car/legacy.gif) no-repeat; }
#list_levorg			{ background:url(../img/icon_car/levorg.gif) no-repeat; }
#list_impreza			{ background:url(../img/icon_car/impreza.gif) no-repeat; }
#list_s4				{ background:url(../img/icon_car/s4.gif) no-repeat; }
#list_wrx_sti			{ background:url(../img/icon_car/wrx_sti.gif) no-repeat; }
#list_sti				{ background:url(../img/icon_car/sti.gif) no-repeat; }
#list_xv				{ background:url(../img/icon_car/xv.gif) no-repeat; }
#list_xv_hybrid			{ background:url(../img/icon_car/xv_hybrid.gif) no-repeat; }
#list_forester			{ background:url(../img/icon_car/forester.gif) no-repeat; }
#list_exiga				{ background:url(../img/icon_car/exiga.gif) no-repeat; }
#list_crossover7		{ background:url(../img/icon_car/crossover7.gif) no-repeat; }
#list_brz				{ background:url(../img/icon_car/brz.gif) no-repeat; }
#list_justy				{ background:url(../img/icon_car/justy.gif) no-repeat; }
#list_trezia			{ background:url(../img/icon_car/trezia.gif) no-repeat; }
#list_lucra				{ background:url(../img/icon_car/lucra.gif) no-repeat; }
#list_chiffon			{ background:url(../img/icon_car/chiffon.gif) no-repeat; }
#list_stella			{ background:url(../img/icon_car/stella.gif) no-repeat; }
#list_pleo_plus			{ background:url(../img/icon_car/pleo_plus.gif) no-repeat; }
#list_pleo				{ background:url(../img/icon_car/pleo.gif) no-repeat; }
#list_dias_wagon		{ background:url(../img/icon_car/dias_wagon.gif) no-repeat; }
#list_sambar_van		{ background:url(../img/icon_car/sambar_van.gif) no-repeat; }
#list_sambar_truck		{ background:url(../img/icon_car/sambar_truck.gif) no-repeat; }


/*　オプションアイコングレー設定　*/




#aux					{ background:url(../img/icon_op/aux_da.gif) no-repeat; }
#aux_05					{ background:url(../img/icon_op/aux_05.gif) no-repeat; }
#aux_06					{ background:url(../img/icon_op/aux_06.gif) no-repeat; }
#aux_degital			{ background:url(../img/icon_op/aux_degital.gif) no-repeat; }
#aux_analog_movie		{ background:url(../img/icon_op/aux_analog_movie.gif) no-repeat; }
#corner_senser			{ background:url(../img/icon_op/corner_senser.gif) no-repeat; }
#corner_senser_03		{ background:url(../img/icon_op/corner_senser_03.gif) no-repeat; }
#corner_senser_04		{ background:url(../img/icon_op/corner_senser_04.gif) no-repeat; }
#corner_senser_05		{ background:url(../img/icon_op/corner_senser_05.gif) no-repeat; }
#corner_senser_06		{ background:url(../img/icon_op/corner_senser_06.gif) no-repeat; }
#corner_senser_07		{ background:url(../img/icon_op/corner_senser_07.gif) no-repeat; }
#corner_senser_08		{ background:url(../img/icon_op/corner_senser_08.gif) no-repeat; }
#corner_senser_09		{ background:url(../img/icon_op/corner_senser_09.gif) no-repeat; }
#front_sideview_camera	{ background:url(../img/icon_op/front_sideview_camera.gif) no-repeat; }
#front_sideview_camera_03{ background:url(../img/icon_op/front_sideview_camera_03.gif) no-repeat; }
#front_sideview_camera_04{ background:url(../img/icon_op/front_sideview_camera_04.gif) no-repeat; }
#front_sideview_camera_06{ background:url(../img/icon_op/front_sideview_camera_06.gif) no-repeat; }
#front_sideview_camera_07{ background:url(../img/icon_op/front_sideview_camera_07.gif) no-repeat; }
#front_sideview_camera_08{ background:url(../img/icon_op/front_sideview_camera_08.gif) no-repeat; }
#front_sideview_camera_09{ background:url(../img/icon_op/front_sideview_camera_09.gif) no-repeat; }
#front_view_multi_camera{ background:url(../img/icon_op/front_view_multi_camera.gif) no-repeat; }
#ipod_audio				{ background:url(../img/icon_op/ipod_audio.gif) no-repeat; }
#ipod_video				{ background:url(../img/icon_op/ipod_video.gif) no-repeat; }
#ipod_video_01			{ background:url(../img/icon_op/ipod_video_01.gif) no-repeat; }
#ipod_video_02			{ background:url(../img/icon_op/ipod_video_02.gif) no-repeat; }
#ipod_video_03			{ background:url(../img/icon_op/ipod_video_03.gif) no-repeat; }
#ipod_video_04			{ background:url(../img/icon_op/ipod_video_04.gif) no-repeat; }
#ipod_video_05			{ background:url(../img/icon_op/ipod_video_05.gif) no-repeat; }
#ipod_video_06			{ background:url(../img/icon_op/ipod_video_06.gif) no-repeat; }
#ipod_video_07			{ background:url(../img/icon_op/ipod_video_07.gif) no-repeat; }
#ipod_video_08			{ background:url(../img/icon_op/ipod_video_08.gif) no-repeat; }
#ipod_video_09			{ background:url(../img/icon_op/ipod_video_09.gif) no-repeat; }
#navi_etc				{ background:url(../img/icon_op/navi_etc.gif) no-repeat; }
#navi_etc_its			{ background:url(../img/icon_op/navi_etc_its.gif) no-repeat; }
#navi_etc_its_03		{ background:url(../img/icon_op/navi_etc_its_03.gif) no-repeat; }
#navi_etc_its_04		{ background:url(../img/icon_op/navi_etc_its_04.gif) no-repeat; }
#navi_etc_its_05		{ background:url(../img/icon_op/navi_etc_its_05.gif) no-repeat; }
#navi_etc_its_06		{ background:url(../img/icon_op/navi_etc_its_06.gif) no-repeat; }
#navi_etc_its_07		{ background:url(../img/icon_op/navi_etc_its_07.gif) no-repeat; }
#navi_etc2				{}
#navi_etc2_01			{ background:url(../img/icon_op/navi_etc2_01.gif) no-repeat; }
#navi_etc2_02			{ background:url(../img/icon_op/navi_etc2_02.gif) no-repeat; }
#navi_etc2_03			{ background:url(../img/icon_op/navi_etc2_03.gif) no-repeat; }
#navi_etc2_04			{ background:url(../img/icon_op/navi_etc2_04.gif) no-repeat; }
#navi_etc2_05			{ background:url(../img/icon_op/navi_etc2_05.gif) no-repeat; }
#navi_etc2_06			{ background:url(../img/icon_op/navi_etc2_06.gif) no-repeat; }
#navi_etc2_07			{ background:url(../img/icon_op/navi_etc2_07.gif) no-repeat; }
#rear_monitar			{  }
#rear_monitar_01		{ background:url(../img/icon_op/rear_monitar_01.gif) no-repeat; }
#rear_monitar_02		{ background:url(../img/icon_op/rear_monitar_02.gif) no-repeat; }
#rear_monitar_03		{ background:url(../img/icon_op/rear_monitar_03.gif) no-repeat; }
#rear_vision_03			{ background:url(../img/icon_op/rear_vision_03.gif) no-repeat; }
#rearview_camera		{ background:url(../img/icon_op/rearview_camera.gif) no-repeat; }
#rearview_camera_03		{ background:url(../img/icon_op/rearview_camera_03.gif) no-repeat; }
#rearview_camera_04		{ background:url(../img/icon_op/rearview_camera_04.gif) no-repeat; }
#rearview_camera_05		{ background:url(../img/icon_op/rearview_camera_05.gif) no-repeat; }
#rearview_camera_06		{ background:url(../img/icon_op/rearview_camera_06.gif) no-repeat; }
#rearview_camera_07		{ background:url(../img/icon_op/rearview_camera_07.gif) no-repeat; }
#rearview_camera_08		{ background:url(../img/icon_op/rearview_camera_08.gif) no-repeat; }
#rearview_camera_09		{ background:url(../img/icon_op/rearview_camera_09.gif) no-repeat; }
#rearview_multi_camera	{ background:url(../img/icon_op/rearview_multi_camera.gif) no-repeat; }
#remokon				{ background:url(../img/icon_op/remokon.gif) no-repeat; }
#stea_rimocon			{  }
#stea_rimocon_04		{ background:url(../img/icon_op/stea_rimocon_04.gif) no-repeat; }
#stea_rimocon_05		{ background:url(../img/icon_op/stea_rimocon_05.gif) no-repeat; }
#usb_audio				{ background:url(../img/icon_op/usb_audio.gif) no-repeat; }
#usb_audio_05			{ background:url(../img/icon_op/usb_audio_05.gif) no-repeat; }
#usb_audio_07			{ background:url(../img/icon_op/usb_audio_07.gif) no-repeat; }
#usb_video_06			{ background:url(../img/icon_op/usb_video_06.gif) no-repeat; }
#usb_video_07			{ background:url(../img/icon_op/usb_video_07.gif) no-repeat; }
#vics_01				{ background:url(../img/icon_op/vics_01.gif) no-repeat; }
#vics_02				{ background:url(../img/icon_op/vics_02.gif) no-repeat; }
#vics_03				{ background:url(../img/icon_op/vics_03.gif) no-repeat; }
#vics_04				{ background:url(../img/icon_op/vics_04.gif) no-repeat; }
#vics_05				{ background:url(../img/icon_op/vics_05.gif) no-repeat; }
#vics_06				{ background:url(../img/icon_op/vics_06.gif) no-repeat; }
#vics_07				{ background:url(../img/icon_op/vics_07.gif) no-repeat; }