@charset "shift_jis";

/* -------------------------------------------------------------
	Topページ用CSS
-----------------------------------------------------------------*/

html, body {

}
body {
	background-color: #000000;
	background-image: url(../../img/bg_top.jpg);
	background-position: 0 0;
	background-repeat: repeat-x;
}
body,td,th {
	font-family: Tahoma, "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro W3", "ＭＳ Ｐゴシック", "MS P Gothic", Verdana, sans-serif;
}
#wrap {
	background-image: url(../../img/bg_top_gnavi.jpg);
	background-position: 50% 502px;
	background-repeat: no-repeat;
}
#main {
	width: 1110px;
	height: 600px;
	position: relative;
	z-index: 0;
	overflow: hidden;
}

#top_pic {
	position: absolute;	
	z-index: 1;
	top: 0;
	right: 0;
	padding: 0 65px;
}
#top_logo {
	position: absolute;	
	z-index: 3;
	top: 243px;
	left: 376px;
}
#top_date {
	position: absolute;
	z-index: 3;	
	top: 0;
	right: 0;
}

/* ナビ */
#gnavi_left {
	width: 409px;
	height: 65px;
	position: absolute;	
	z-index: 2;	
	top: 502px;
	left: 76px;
	padding-top: 10px;
}
#gnavi_right {
	width: 414px;
	height: 65px;	
	position: absolute;	
	z-index: 2;	
	top: 502px;
	right: 76px;
	padding-top: 10px;	
}

/* 次回予告吹き出し */
#top_next {
	position: absolute;	
	/*top: 350px;*/
	top: 345px;
	right: 0px;
	z-index: 3;
}
#top_next h2 {
	position: absolute;
	top: -40px;
	right: 15px;
	z-index: 4;
	width: 80px;
	height: 80px;
	-webkit-perspective: 10px;/*iOS8*/
	perspective: 10px;/*iOS8*/
}
#top_next h2 span {
	width: 80px;
	height: 80px;
	border-radius: 50%;
	background-color: #ca1c1d;
	
	color: #fff;
	font-weight: bold;
	line-height: 1.2;
	text-align: center;
	display: table-cell;
	vertical-align: middle;
	transform: rotate(10deg);
	-moz-transform: rotate(10deg);
	-webkit-transform: rotate(10deg);
}
#top_next .box {
	background-color: rgba(255,255,255,0.9);
	border-radius: 20px;
	position: relative;
	width: 350px;
	/*padding: 10px;*/
	padding: 10px 10px 22px;
	
	overflow: hidden;
	color: #333;
	font-weight: bold;
	line-height: 1.4;
}
#top_next:after {
	content: "";
	background: url(../../img/top_next_tip.png) 0 0 no-repeat;
	width: 55px;
	height: 30px;
	position: absolute;
	top: -30px;
	right: 140px;
	z-index: 4;
	opacity: 0.9;
}
/*#top_next:after {
	content: "";
	position: absolute;
	border: 10px solid transparent;
	border-bottom-color: rgba(255,255,255,0.9);
	top: -20px;
	left: 40px;
}*/

#top_next .date {
	font-size: 16px;
	margin-bottom: 5px;
}
#top_next img {
	width: 150px;
	height: auto;
	float: left;
	margin-right: 10px;
}
#top_next .ttl {
	width: 190px;
	float: left;
	font-size: 16px;
}
#top_next .ttl span.num {
	display: block;
	background-color: #000;
	color: #fff;
	text-align: center;
	padding: 1px;
	margin-bottom: 5px;
}

#top_next .ttl_s {
	width: 190px;
	float: left;
	font-size: 14px;
	line-height: 1.4;
}
#top_next .ttl_s span.num {
	display: block;
	background-color: #000;
	color: #fff;
	text-align: center;
	padding: 1px;
	margin-bottom: 5px;
}
#top_next .note {
	font-weight: normal;
	font-size: 12px;
}

/* ご了承ください */
#top_notice {
	font-size: 12px;
	color: #fff;
	position: absolute;
	top: -2px !important;
    right: 20px !important;
	z-index: 10 !important;
	line-height: 1.4;
}

/* 次回予告を2つ掲載 */
.next_two#top_next {
	top: 330px;
}
.next_two#top_next .box {
	padding: 4px 10px;
}
.next_two#top_next .box .date {
	font-size: 14px;
	margin-bottom: 2px;
	clear: both;
}
.next_two#top_next .box img {
	width: 90px;
}
.next_two#top_next .box img:nth-child(2) {
	margin-bottom: 4px;
}
.next_two#top_next .ttl {
	width: auto;
	float: left;
}
.next_two#top_next .ttl span.num {
	width: 5em;
	margin-bottom: 0px;
	margin-right: 5px;
	/*float: left;*/
	padding: 0;
}
.next_two#top_next .note {
	clear: both;
	position: absolute;
	bottom: 5px;
	right: 15px;
	z-index: 5;
}


/*#top_dvdbox {
	position: absolute;
	z-index: 3;*/
	/*top: 325px;*/
	/*top: 343px;
	left: 0;
}*/

/*#top_coty-day {
	position: absolute;
	z-index: 3;	*/
	/*top: 325px;*/
	/*top: 348px;
	right: 0;
}*/
/*#tire_present {  タイヤプレゼント 
	position: absolute;
	z-index: 3;	
	top: 338px;
	right: 0;	
}
#bn_book {
	position: absolute;
	z-index: 3;	
	top: 314px;
	left: 0;	
}
#bn_fes{
	position: absolute;
	z-index: 3;	
	top: 307px;
	left: 0;	
}*/

/*プレゼントボタン*/
#btn_present {
	position: absolute;
	top: 430px;
	left: 200px;
	z-index: 10;
	border-radius: 10px;
}
#btn_present a:hover {
	opacity: 0.6;
}


#top_hulu_header {
	position: absolute;
	top: 330px;
	left: 0;
	z-index: 3;
	width: 190px;
	height: auto;
}
#top_hulu_header img {
	width: 190px;
	height: auto;
}
#top_hulu_header img.hulu01 {
	margin-bottom: 4px;
}

/* 愛車フェス2017告知 */
.layer_board .inner {
	width: 800px;
	position: relative;
}
.layer_board .inner p,
.layer_board .inner li {
	display: none;
	position: absolute;
	z-index: 2002;
}
.layer_board .inner .bg {
}
.layer_board .inner .text01 {
	top: 30px;
	left: 30px;
}
.layer_board .inner .text02 {
	top: 135px;
	left: 30px;
}
.layer_board .inner .text03 {
	top: 233px;
	left: 30px;
}
.layer_board .inner .text04 {
	top: 386px;
	left: 467px;
}
.layer_board .inner .pic01 {
	top: 137px;
	left: 501px;
}
.layer_board .inner .pic02 {
	top: 326px;
	left: 30px;
}
.layer_board .inner .btn {
	top: 10px;
	right: 30px;
}
.layer_board .inner .btn a:hover {
	opacity: 0.6;
}

.layer_board .btn_close {
	background-color: rgba(0,0,0,0.8);
	text-align: center;
	border-radius: 6px;
	border: 2px solid #fff;
	margin: 10px auto 0;
	width: 40%;
}
.layer_board .btn_close a {
	display: block;
	color: #fff;
	text-decoration: none;
	font-size: 16px;
	font-weight: bold;
	padding: 20px 10px;
}
.layer_board .btn_close:hover {
	opacity: 0.6;
}

/* アンケート */
#btn_survey a {
	display: block;
	background: url(../../img/btn_survey.png) 0 0 no-repeat;
	width: 467px;
	height: 52px;
	text-indent:100%;
	white-space:nowrap;
	position: absolute;
    top: 10px;
    left: 0;
    z-index: 99;
}

#btn_survey a:hover {
	background: url(../../img/btn_survey.png) 0 -56px no-repeat;
	
}


/* フッター */
#footer {
	width: 980px;
	margin: 0 auto;
	padding-bottom: 69px;
	position: relative;
}

/* フッターバナーリスト */
#bnr_list {
	clear: both;
	width: 960px;
	overflow: hidden;
	margin: 10px auto 20px;
	padding: 0 10px;
	text-align: center;
	font-size: 0;/*<li>隙間対策*/
}
#bnr_list li {
	display: inline-block;
	margin-right: 20px;
}
#bnr_list_ li:nth-child(2) {
	margin-right: 0;
}
#bnr_list li a:hover {
	opacity: 0.6;
}

/* フッターバナーリスト（グッズ等紹介用） */
#bnr_list_goods {
	clear: both;
	width: 959px;
	overflow: hidden;
	margin: 0 auto;
	padding: 0 10px;
}
#bnr_list_goods li {
	float: left;
	margin-right: 10px;
	margin-bottom: 10px;
	text-align: center;
	width: 324px;
}
#bnr_list_goods li:nth-child(3n) {
	margin-right: 0;
	width: 291px;
}
#bnr_list_goods li a:hover {
	opacity: 0.6;
}

/* フッター3段目 */
#footer_btn {
	width: 980px;
	position: relative;
	margin-top: 10px;
}
#top_btn {
	position: absolute;
	left: 10px;
	top: 0;
	z-index: 3;
}
#sns_list {
	position: absolute;
	left: 153px;
	top: 0;
	z-index: 3px;
	padding: 8px 10px 0;
	background-color: rgba(255,255,255,0.2);
}
#footer_copy {
	position: absolute;
	z-index: 3;
	top: 19px;
	right: 0;
}

/* 趣味の深掘り　プレゼントキャンペーン！2018 */
#btn_2018spring {
	position:absolute;
	top: 210px;
	left: 0;
	z-index: 4;
	display: none;
}
#btn_2018spring a:hover {
	opacity: 0.8;
}

/* 枠移動お知らせ
----------------------------------------------------*/
#oshirase {
	background-color: rgba(35,149,192,0.9);
	background-color: rgb(35,149,192)\9; /* ie6, ie7,ie8*/
	padding: 10px;
	position: absolute;
	top: 360px;
	right: 20px;
	border: 3px double #dddddd;
	z-index: 100;
}
#oshirase p {
	color: #ffffff;
	font-weight: bold;
	line-height: 1.6;
}

/* お知らせ */
#info {
    background: rgba(0,0,0,0.8);
    padding: 10px;
    position: absolute;
	top: 100px;
	right: 10px;
	color: #fff;
    z-index: 99;
}

#info p {
	font-weight: bold;
}
