@charset "UTF-8";

/****************
Main
****************/
#main{
	padding:2% 2% 0 2%;
	float:left;
	width:80%;
	/width:78%;
	color:#fff;
	overflow:hidden;

	box-shadow:2px 2px 2px #000;
	-moz-box-shadow:2px 2px 2px #000;
	-webkit-box-shadow:2px 2px 2px #000;
}
section{
	padding:0 0 20px 0;

}
section:after{
	content:"";
	display:block;
	clear:both;
}
.clr{
	clear:both;
}
.txGreen{ color:#3c0; }
.txRed{ color:#c00; }
.substance{
	position:relative;
	clear:both;
	width:83%;
	margin:20px auto;
}
.substance p{
	text-align:left;
}
.substance:after{
	content:"";
	clear:both;
	display:block;
}

/* Images single */
.img_sgl{
	text-align:center;
}
.img_sgl.border img{
	border:1px solid #333;
}
.img_sgl.borderBlue img{
	border:1px solid #4f8f97;
}
.img_sgl .switchPhoto,
.img_sgl .toolTips,
.img_sgl .jstImg{
	margin:0 2%;
	max-width:100%;
}
.img_sgl.fixed .switchPhoto,
.img_sgl.fixed .toolTips,
.img_sgl.fixed .jstImg{
	width:43%;
}


/* Images side by side */
.img_sbs{
	position:relative;
}
.img_sbs:after{
	content:"";
	display:block;
	clear:both;
}
.img_sbs li{
	float:left;
	width:45%;
	margin:0 2%;
}

.img_sbs li .switchPhoto,
.img_sbs li .toolTips,
.img_sbs li .jstImg{
	width:100%;
}

.img_sbs li div img{
	width:100%;
}
.img_sbs li img{
	width:100%;

}
.img_sbs.border li img{
	border:1px solid #333;
}
.img_sbs.borderBlue li img{
	border:1px solid #4f8f97;
}
.img_sbs.arrow li:after,
.img_sbs.arrow01 li:after,
.img_sbs.arrow02 li:after{
	content:"";
	border-left:13px solid #fff;
	border-top:8px solid transparent;
	border-bottom:8px solid transparent;
	position:absolute;
	top:48%;
	left:48.3%;
}
.img_sbs.arrow01 li:after{
	top:34%;
}
.img_sbs.arrow02 li:after{
	top:40%;
}

/* Image single left  */

.img_sgl_lft.border img{
	border:1px solid #333;
}
.img_sgl_lft.borderBlue img{
	border:1px solid #4f8f97;
}
.img_sgl_lft .switchPhoto,
.img_sgl_lft .toolTips,
.img_sgl_lft .jstImg{
	width:43%;
	float:left;
	margin:0 15px 0 2%;
}

/* Image tree style */

.img_tree{
	width:45%;
	margin:0 15px 0 2%;
}
.img_tree.left{
	float:left;
}
.img_tree.right{
	float:right;
}
.img_tree .switchPhoto,
.img_tree .toolTips,
.img_tree .jstImg{
	width:100%;
}
.img_tree ul{
	overflow:hidden;
}
.img_tree.arrow li{
	position:relative;
	margin-bottom:10%;
}
.img_tree.arrow li:before{
	content:"";
	border-left:8px solid transparent;
	border-top:13px solid #fff;
	border-right:8px solid transparent;
	position:absolute;
	top:-17%;
	left:48%;
}
.img_tree.border img{
	border:1px solid #333;
}






/* list style  */
.liStyle01 li{
	width:43%;
	float:left;
	margin:10px 3% 15px;
	color:#b9b9b9;
	position:relative;
}

.liStyle01 .switchPhoto,
.liStyle01 .toolTips,
.liStyle01 .jstImg{
	width:100%;
}
.liStyle01 li img{
	border:1px solid #333;
}
.liStyle01 li.noBorder img{
	border:none;
}
.liStyle01 li.borderBlue img{
	border:1px solid #4f8f97;
}
.txArea{
	padding:0 0 0 10%;
	margin:7px 0;
}
.txArea:before{
	position:absolute;
	left:0;
	color:#fff;
	background:#0d0d0d;
	padding:0 7px;
	border:1px solid #666;
}
.txArea.first:before{content:"1";}
.txArea.second:before{content:"2";}
.txArea.third:before{content:"3";}
.txArea.fourth:before{content:"4";}
.txArea.fifth:before{content:"5";}

.liStyle02{
	position:relative;
}
.liStyle02:after{
	content:"";
	display:block;
	clear:both;
}
.liStyle02 li{
	float:left;
	width:29%;
	margin:5px 2%;
}
.liStyle02 p{
	font-size:14px;
	color:#b9b9b9;
}

.liStyle02 li .switchPhoto,
.liStyle02 li .toolTips,
.liStyle02 li .jstImg{
	width:100%;
}

.liStyle02 li div img{
	width:100%;
}
.liStyle02 li img{
	width:100%;

}
.liStyle02.border li img{
	border:1px solid #333;
}
.liStyle02.borderBlue li img{
	border:1px solid #4f8f97;
}
.liStyle02.arrow li:after{
	content:"";
	border-left:15px solid #fff;
	border-top:10px solid transparent;
	border-bottom:10px solid transparent;
	position:absolute;
	top:48%;
	left:48.5%;
}
.liStyle03{
	clear:both;
	color:#9b9b9b;
	padding:0 2% 10px;
}
.liStyle04{
	color:#9b9b9b;
	padding:0 2% 10px;
}
.liStyle04 li:before{
	content:" - ";
}
.liStyle05{
	color:#9b9b9b;
}
.liStyle05 dt,
.liStyle05 dl{
	float:left;
}

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

.colum3 li{
	width:33%;
	float:left;
}


#entertainment #main{
	background:#000 url(../../img/bg_decohead_red.jpg) 0 0 repeat-x;
	background-size:100% auto;
}
#navigation #main{
	background:#000 url(../../img/bg_decohead_green.jpg) 0 0 repeat-x;
	background-size:100% auto;
}
#others #main{
	background:#000 url(../../img/bg_decohead_blue.jpg) 0 0 repeat-x;
	background-size:100% auto;
}
#except #main{
	background:#000 url(../../img/bg_decohead_purple.jpg) 0 0 repeat-x;
	background-size:100% auto;
}

#face{
	position:relative;
	width:100%;
	font-family: 'Quantico', sans-serif;
	text-align:center;
	margin:0 0 20px;
}
#face p{
	position:absolute;
}
#face li p{
	position:relative;
	font-size:16px;
	font-family: 'Source Sans Pro', sans-serif;
}
.lead{
	font-family: 'Source Sans Pro', sans-serif;
}
.titStyle01{
	font-family: 'Quantico', sans-serif;
	font-weight:normal;
	font-size:3em;
	text-shadow:1px 1px 2px #ccc, -2px -2px 2px #000;
	padding:auto 0;
	margin:20px 0 10px;
	padding:25px 0 25px 18%;
	line-height:1em;
	background-size:auto 93%;
	background-position:53px 0;
}

.titStyle02,
.titStyle03,
.titStyle06,
.titStyle08{
	font-family: 'Quantico', sans-serif;
	font-weight:normal;
	background:#600;
	text-shadow:-1px -2px 0 #000, 1px 1px 0 #666;
	padding:5px 2% 10px;
	margin:10px 0;
	line-height:1em;

	border-top:1px solid #444;
	border-bottom:1px solid #444;

	background: #1b1b1b;
	background:	-moz-linear-gradient(top,  #353535 0%, #181818 100%);
	background:	-webkit-gradient(linear, left top, left bottom, color-stop(0%,#353535), color-stop(100%,#181818));
	background:	-webkit-linear-gradient(top,  #353535 0%,#181818 100%);
	background:	-o-linear-gradient(top,  #353535 0%,#181818 100%);
	background:	-ms-linear-gradient(top,  #353535 0%,#181818 100%);
	background:	linear-gradient(top,  #353535 0%,#181818 100%);
	filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#ff353535,EndColorStr=#ff181818);

	box-shadow:0 0 4px 0 rgba(0, 0, 0, .5) inset;
	-moz-box-shadow:0 0 4px 0 #000 inset;
	-webkit-box-shadow:0 0 4px 0 #000 inset;
}

.titStyle02:before{
	content:"";
	padding-left:6%;
	background-repeat:no-repeat !important;
	background-size:auto 90% !important;
	background-position:center center !important;
}
.titStyle06:before{
	content:"";
	padding-left:13%;
	background-repeat:no-repeat !important;
	background-size:auto 88% !important;
	background-position:center center !important;
}
.titStyle08:before{
	content:"";
	padding-left:9%;
	background-repeat:no-repeat !important;
	background-size:auto 88% !important;
	background-position:center center !important;
}
.titStyle04{
	font-family: 'Quantico', sans-serif;
	font-size:1.6em;
	font-weight:normal;
	margin:auto;
	padding:20px 5% 5px;
	text-align:left;
}
.titStyle05{
	font-size:1em;
	font-weight:normal;
	position:relative;
	padding:0 2%;
	color:#fff;
	float:left;
	margin:0 0 5px 0;
	width:100%;
	line-height:2em;
}
.titStyle05:before{
	content:"";
	width:36px;
	height:35px;
	margin:0 1% 0 0;
	float:left;
}
.titStyle05:after{
	content:"";
	display:block;
	clear:both;
}
.titStyle07{
	font-size:1em;
	font-weight:normal;
	position:relative;
	padding:0 0 0 5%;
	color:#fff;
}
.titStyle07:before{
	content:"";
	border-width:5px;
	border-style:solid;
	border-color:#ccc #999 #777 #666 ;
	position:absolute;
	top:30%;
	left:0;
}

.txStyle01{
	width:50%;
	margin:0 0 0 15px;
	float:left;
}
.txStyle02{
	color:#b9b9b9;
	padding:0 2% 10px;
	clear:both;
}

.txStyle03{
	color:#b9b9b9;
	font-weight:bold;
	padding:0 2% 5px;
}
.txStyle04{
	padding:10px 2% 5px;
}
.txStyle05{
	color:#b9b9b9;
	padding:0 2% 10px;
	float:left;
	width:45%;
}
ol.txStyle05{
	padding:0 2% 10px 5%;
}
ol.txStyle05 li{
	list-style-type:decimal;
}

.btStyle01{
	position:relative;
	margin:auto;
	width:70%;
	padding:15px;
	display:block;
	background: #393939;
	background:	-moz-linear-gradient(top, #585858 0%, #0E0E0E 9%, #393939 27%, #000 82%, #1d1d1d 90%, #585858 100%);
	background:	-webkit-gradient(linear, left top, left bottom, color-stop(0%,#585858), color-stop(9%,#0e0e0e), color-stop(27%,#393939), color-stop(82%,#000), color-stop(90%,#1d1d1d), color-stop(100%,#585858));
	background:	-webkit-linear-gradient(top, #585858 0%,#0e0e0e 9%,#393939 27%,#000 82%,#1d1d1d 90%,#585858 100%);
	background:	-o-linear-gradient(top, #585858 0%,#0e0e0e 9%,#393939 27%,#000 82%,#1d1d1d 90%,#585858 100%);
	background:	-ms-linear-gradient(top, #585858 0%,#0e0e0e 9%,#393939 27%,#000 82%,#1d1d1d 90%,#585858 100%);
	background:	linear-gradient(top,  #585858 0%,#0e0e0e 9%,#393939 27%,#000 82%,#1d1d1d 90%,#585858 100%);
	filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#ff585858,EndColorStr=#ff000000);

	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border:1px solid #585858;
}

.btStyle01:after{
	content:"";
	border-style:solid;
	border-color:transparent transparent transparent #fff;
	border-width:6px 10px 6px;
	position:absolute;
	top:40%;
	right:3%;
	width:0;
	height:0;
}
.btStyle01:hover{
	color:#ff6;
	background: #393939;
	background:	-moz-linear-gradient(top, #585858 0%, #2d2d2d 9%, #393939 27%, #1b1b1b 82%, #1d1d1d 90%, #585858 100%);
	background:	-webkit-gradient(linear, left top, left bottom, color-stop(0%,#585858), color-stop(9%,#2d2d2d), color-stop(27%,#393939), color-stop(82%,#1b1b1b), color-stop(90%,#1d1d1d), color-stop(100%,#585858));
	background:	-webkit-linear-gradient(top, #585858 0%,#2d2d2d 9%,#393939 27%,#1b1b1b 82%,#1d1d1d 90%,#585858 100%);
	background:	-o-linear-gradient(top, #585858 0%,#2d2d2d 9%,#393939 27%,#1b1b1b 82%,#1d1d1d 90%,#585858 100%);
	background:	-ms-linear-gradient(top, #585858 0%,#2d2d2d 9%,#393939 27%,#1b1b1b 82%,#1d1d1d 90%,#585858 100%);
	background:	linear-gradient(top,  #585858 0%,#2d2d2d 9%,#393939 27%,#1b1b1b 82%,#1d1d1d 90%,#585858 100%);
	filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#ff585858,EndColorStr=#ff1b1b1b);
}

.btStyle01:hover:after{
	border-color:transparent transparent transparent #ff6;
}

.btStyle02{
	position:relative;
	padding:0 5% 0;
	display:block;
	text-decoration:underline;
}
.btStyle02:after{
	content:"";
	border-style:solid;
	border-width:5px 7px 5px;
	border-color:transparent transparent transparent #fff;
	position:absolute;
	top:30%;
	left:0;
}
.btStyle02:hover{
	color:#ff6;
}
.btStyle02:hover:after{
	border-color:transparent transparent transparent #ff6;
}

.btStyle03{
	position:relative;
	padding:0 5% 0;
	display:block;
}
.btStyle03:after{
	content:"";
	border-style:solid;
	border-width:8px 5px 5px;
	border-color:#fff transparent transparent transparent;
	position:absolute;
	top:30%;
	left:-1%;
}
.btStyle04{
	text-decoration:underline;
}
.btStyle04:hover{
	color:#ff6;
}
.btStyle05{
	position:relative;
	margin:5px 0;
	background:#fff;
	display:block;
	width:97px;
	height:25px;
	padding:5px 10px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px;
	-pie-border-radius:5px;
	behavior: url(../../js/PIE.htc);
}

/* ToolTip */
.toolTips{
	position: relative;
/*	float:left;
	border:1px solid #333;*/
}

.toolTips a{
	position:absolute;
	cursor: help;
	display: inline-block;
	border:2px solid #f00;
}
.toolTips span{
	visibility: hidden;
	position: absolute; 
	bottom: 30px;
/*	left: 50%;*/
	z-index: 999;
	padding: 10px;
	border: 2px solid #ccc;
	opacity: .9;
	color:#000;
	display:block;
	background-color: #ddd;
	background-image: -webkit-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
	background-image: -moz-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
	background-image: -ms-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
	background-image: -o-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
	background-image: linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));	
}
.toolTips a:hover span{
	visibility: visible;
}

.toolTips .sumbimg{
	width:250px;
}
.toolTips .baseimg{
	width:100%;
}

/* switchPhoto */
.switchPhoto{
	position: relative;
	margin:0;
	width:auto;
/*	border:1px solid #333;*/
}
.switchPhoto img{
	width:100%;
}
.switchPhoto .back{
	position:absolute;
	top:0;
	left:0;
}

.imgCap{
	border:1px solid #333;
}

.gotohome{
	width:50%;
	float:left;
	display:none;
}
.gototop{
	position:relative;
	text-align:right;
	margin:0 0 10px 0;
	width:50%;
	float:right;
}
.gototop:after{
	content:"";
	display:block;
	width:100%;
	clear:both;
}
.gotohome a,
.gototop a{
	width:44px;
	padding:10px 15px 10px;
	color:#aaa;
	font-size:0.8em;
}
.gototop a:before{
	content:"";
	margin:10px 5px 0 0;
	padding:5px 0 0;
	position:absolute;
	top:-6px;
	right:0;
	border-bottom:6px solid #999;
	border-right:3px solid transparent;
	border-left:3px solid transparent;
}

.gototop a:hover{
	color:#fff;
}
#sendPage{
	clear:both;
	border-top:1px solid #333;
	text-align:center;
}
#sendPage a{
	color:#a9a9a9;
	padding:0 10px;
	font-size:40px;
}

#sendPage a:before{
	content:">";
}
#sendPage a:first-child:before{/* last-child doesn't work in IE8, so it's deny general style of #sendPage*/
	content:"<";
}

#sendPage a:hover{
	color:#fff;
}
/****************
Side
****************/
nav{
	color:#fff;
	float:right;
	width:19%;
	width:18%\9;
	margin:0 0 5px 0;
}
#gMenu a#previous{
	display:none;
}

.nest{
	display:none;
	font-family: 'Quantico', sans-serif;
	font-size:1em;
}

#li2 .nest{
	background:#160909;
}
.nest li{
	border-top:1px solid rgba(255, 255, 255, .1);
	border-bottom:1px solid #000;
}
#li3 .nest{
	background:#0c100a;
}

#li4 .nest{
	background:#090c13;
}
#entertainment #li2 .nest,
#navigation #li3 .nest,
#others #li4 .nest{
	display:block;
}

.nest a{
	padding:7px 15px;
	color:#fff;
	display:block;	

	text-shadow:-1px -1px 0 #000;
	-moz-text-shadow:0 -1px 1px #000;
	-webkit-text-shadow:0 -1px 1px #000;
}



#gMenu .nest a:hover,
#gMenu .active a,
.page_sns .nSns a,
.page_apps .nApp a,
.page_cloud_service .nCs a,
.page_kenwood_wireless_link .nKwl a,
.page_av_source .nAs a,
.page_bluetooth .nBt a,
.page_route_collector .nRc a,
.page_real_time_information .nRti a,
.page_smart_poi_search .nPoi a,
.page_map .nMap a,
.page_user_interface .nUi a,
.page_more_features .nMf a,
.page_oem_solution .nOem a,
.page_sound_processor .nSp a{
	color:#fc0;
	text-shadow:-1px -1px 0 #000, 1px 1px 0 #999;
	-moz-text-shadow:-1px -1px 0 #000, 1px 1px 0 #999;
	-webkit-text-shadow:-1px -1px 0 #000, 1px 1px 0 #999;
}

#gMenu .nest a:after{
	content:"";
	display:inline-block;
	position:absolute;
	top:30%;
	right:5%;
	width:5px;
	height:0px;
	margin:0 auto;
	border-left:8px solid #fff; 
	border-top:5px solid transparent;
	border-bottom:5px solid transparent;
}

#gMenu .nest a:hover:after,
.page_sns .nSns a:after,
.page_apps .nApp a:after,
.page_cloud_service .nCs a:after,
.page_kenwood_wireless_link .nKwl a:after,
.page_av_source .nAs a:after,
.page_bluetooth .nBt a:after,
.page_route_collector .nRc a:after,
.page_real_time_information .nRti a:after,
.page_smart_poi_search .nPoi a:after,
.page_map .nMap a:after,
.page_user_interface .nUi a:after,
.page_more_features .nMf a:after,
.page_oem_solution .nOem a:after,
.page_sound_processor .nSp a:after{
	content:"";
	display:inline-block;
	position:absolute;
	top:30%;
	right:5%;
	width:5px;
	height:0px;
	margin:0 auto;
	border-left:8px solid #fc0 !important; 
	border-top:5px solid transparent;
	border-bottom:5px solid transparent;
}
#menu{
	display:none;
	color:#600;
}

body.fr .nPoi{font-size:11px;}
body.fr .nMf{font-size:11px;}

/****************
Footer
****************/
footer ul{
	display:none;
}
footer ul li{
	cursor:pointer;
	text-decoration:underline;
}