/*
======== table of content. =================================

　new top
	
============================================================
*/


/* ----------------------------------------------------------------------------
　basic
---------------------------------------------------------------------------- */
#top{
	width:646px;
}


/* ----------------------------------------------------------------------------
　main_slide
---------------------------------------------------------------------------- */
.main_title{
	color:#000;
	font-size:12px;
	margin-bottom:20px;
	padding-top:5px;
}

#main_slide{
	width:646px;
	margin-bottom:18px;
	position:relative;
}
#slide_case{
	width:646px;
	height:402px;
	position:relative;
}
#slide_case p{
	position:absolute;
	top:0px;
	left:0px;
	display:none;
}

#slide_case p .shadow{
	width:646px;
	height:402px;
	display:block;
	z-index:1;
	position:absolute;
	top:0px;
	left:0px;
	background:url("../images/home/top_main_slide_shadow.png") 0 0 no-repeat;
}

#slide_case p a{
	display:block;
	cursor:pointer;
}

#main_slide ul{
}
#main_slide ul li{
	width:101px;
	font-size:14px;
	line-height:120%;
	color:#666666;
	padding:12px 0 7px;
	margin-right:8px;
	text-align:center;
	vertical-align:top;
	cursor:pointer;
	display:inline-block;
	background:url("../images/home/top_main_slide_paging.gif") 0 0 no-repeat;
	background-color:#efefef;
}
#main_slide ul .on{
	cursor:default;
	background-position:-101px 0;
	background-color:#ba8cbc;
	color:#fff;
}
#main_slide ul .lastItem{
	margin-right:0px;
}
*:first-child+html #main_slide ul li{
	display:inline;
	zoom:1;
}
#main_slide ul li span{
	display:block;
}


/* prev・next */
#main_slide .prev,
#main_slide .next{
	width:38px;
	height:402px;
	position:absolute;
	z-index:2;
}
#main_slide .prev a,
#main_slide .next a{
	display:block;
	width:38px;
	height:402px;
}

#main_slide .prev a{
	background:url("../images/home/top_main_slide_prev.png") right center no-repeat;
}
#main_slide .prev a:hover{
	background:url("../images/home/top_main_slide_prev_on.png") right center no-repeat;
}

#main_slide .next a{
	background:url("../images/home/top_main_slide_next.png") 0 center no-repeat;
}
#main_slide .next a:hover{
	background:url("../images/home/top_main_slide_next_on.png") 0 center no-repeat;
}


#main_slide .prev{
	top:0px;
	left:0px;
}
#main_slide .next{
	top:0px;
	right:0px;
}


/* detail_link */
#main_slide .detail_link a{
	
	position:absolute;
	right:8px;
	top:361px;
	padding:0 10px;
	height:32px;
	color:#fff;
	background:url("../images/home/top_main_slide_detail_link.png");
	
	font-size:14px;
	line-height:32px;
	text-align:center;
	z-index:3;
}
#main_slide .detail_link a:hover{
	text-decoration:underline;
}



/* ----------------------------------------------------------------------------
　ryokan_hotel_bnr
---------------------------------------------------------------------------- */
#ryokan_hotel_bnr{
	margin-bottom:20px;
}
#ryokan_hotel_bnr li{
	float:left;
}
#ryokan_hotel_bnr .lastItem{
	float:right;
}


/* ----------------------------------------------------------------------------
　bnr
---------------------------------------------------------------------------- */
.bnr{
	margin-bottom:20px;
}


/* ----------------------------------------------------------------------------
　topics
---------------------------------------------------------------------------- */
#topics{
	width:604px;
	background-color:#fcf9fc;
	border:1px solid #c290c3;
	position:relative;
	padding:40px 20px 20px;
	margin-bottom:15px;
}
#topics h3{
	position:absolute;
	top:-1px;
	left:-1px;
}
#topics dl{
	margin-bottom:20px;
}
#topics .lastItem{
	margin-bottom:0px;
}
#topics dl dt{
	color:#bb8cbc;
	background:url("") 0 0 no-repeat;
}
#topics dl dd{
	color:#333;
	line-height:180%;
	background:url("") 0 0 no-repeat;
}
#topics dl dd a{
	padding:0 0 0 11px;
	color:#0024ff;
	background:url("../images/home/top_topics_arrow.gif") 0 5px no-repeat !important;
}



/* ----------------------------------------------------------------------------
　special_topics
---------------------------------------------------------------------------- */
#special_topics{
	width:646px;
	margin-bottom:30px;
}
#special_topics h3{
	margin-bottom:15px;
}

/* photo_box */
#special_topics .photo_box{
	width:368px;
	height:318px;
	border:1px solid #c290c3;
	position:relative;
	float:left;
}
#special_topics .photo_box .box{
	display:none;
	position:absolute;
	top:0px;
	left:0px;
}
#special_topics .photo_box .box a{
	display:block;
}

#special_topics .photo_box .photo{
	position:relative;
}

/* title_box */
#special_topics .title_box{
	margin-top:10px;
}
#special_topics .title_box li{
	display:none;
}
#special_topics .title_box li a{
	display:block;
	color:#000;
	text-decoration:none;
}
#special_topics .title_box li a .title{
	font-size:18px;
	line-height:120%;
	margin-bottom:3px;
	color:#000;
	text-decoration:underline;
}
#special_topics .title_box li a:hover .title{
	text-decoration:none;
}
#special_topics .title_box li a .text{
	font-size:16px;
	line-height:120%;
	color:#646464;
}


/* list */
#special_topics .list{
	width:255px;
	height:303px;
	overflow:hidden;
	float:right;
	padding-top:15px;
}
#special_topics .list li{
	margin-bottom:45px;
}
#special_topics .list li a{
	font-size:16px;
	line-height:120%;
	display:block;
	color:#323232;
	cursor:pointer;
	text-decoration:underline;
}

#special_topics .list li a:hover{
	text-decoration:none;
}



/* ----------------------------------------------------------------------------
　RECOMMENDED HOTELS & RYOKAN
---------------------------------------------------------------------------- */
#recommended{
	width:646px;
}
#recommended h3{
	margin-bottom:10px;
}
#recommended h2{
	color:#000;
	font-size:14px;
	margin-bottom:10px;
}
#recommended ul li{
	width:202px;
	float:left;
	margin:0 20px 25px 0;
}
#recommended ul li a{
	display:block;
	color:#333;
	cursor:pointer;
	text-decoration:none;
}
#recommended ul .lastItem{
	margin-right:0px;
}
#recommended ul li .photo{
	position:relative;
	margin-bottom:5px;
}

#recommended ul li .place{
	margin-bottom:5px;
}
#recommended ul li .place01{
	display:inline-block;
	background: url("../images/home/top_recommended_place01.gif") right center no-repeat;
	background-color:#323232;
	vertical-align:top;
	color:#fff;
	line-height:115%;
	padding:3px 10px 3px 7px;
	position:relative;
	font-size:10px;
}
#recommended ul li .place02{
	display:inline-block;
	background: url("../images/home/top_recommended_place02.gif") right center no-repeat;
	background-color:#6a6a6a;
	vertical-align:top;
	color:#fff;
	line-height:115%;
	padding:3px 15px 3px 5px;
	position:relative;
	font-size:10px;
}

*:first-child+html #recommended ul li .place01{
	display:inline;
	zoom:1;
}
*:first-child+html #recommended ul li .place02{
	display:inline;
	zoom:1;
}


#recommended ul li .place span{
	display:block;
}


#recommended ul li a .title{
	text-align:center;
	margin-bottom:5px;
	text-decoration:underline;
}
#recommended ul li a:hover .title{
	text-decoration:none;
}

#recommended ul li .title span{
	display:block;
}

#recommended ul li a .text{
	/*color:#333;*/
	color:#5b5b5b;
}

#recommended ul li .price {
	margin-top:10px;
}
#recommended ul li .price span{
	color:#8f1c33;
}


/* ----------------------------------------------------------------------------
　popularareas
---------------------------------------------------------------------------- */
#popularareas{
	margin-bottom:50px;
}
#popularareas h3{
	position:relative;
	top:30px;
}
#popularareas .photo{
	width:646px;
	height:330px;
	position:relative;
	margin-bottom:20px;
}
#popularareas .photo li{
	position:absolute;
}
#popularareas .photo li a{
	display:block;
	position:relative;
	overflow:hidden;
	text-decoration:none !important;
	cursor:pointer;
}

#popularareas .photo li .hover{
	z-index:4;
}
#popularareas .photo li .hover2{
	width:100%;
	height:100%;
	position:absolute;
	left:0px;
	bottom:-100px;
	z-index:3;
	background: url("../images/home/top_popularareas_hover.png");
}
#popularareas .photo li .hover2_inner{
	position:relative;
}

#popularareas .photo li .hover2 .title{
	color:#000;
	padding:3px 5px;
	line-height:120%;
}
#popularareas .photo li .hover2 .text{
	color:#000;
	padding:0 12px;
	line-height:120%;
}


#popularareas .photo .osaka{	
	top:34px;
	left:0px;
}

#popularareas .photo .tokyo{
	top:0px;
	left:218px;
}

#popularareas .photo .mtfuji{
	top:111px;
	left:434px;
}

#popularareas .photo .takayama{
	top:111px;
	left:542px;
}

#popularareas .photo .nankishirahama{
	top:111px;
	left:218px;
}

#popularareas .photo .fukuoka{
	top:111px;
	left:326px;
}

#popularareas .photo .kyoto{
	top:0px;
	left:434px;
}

#popularareas .photo .okinawa{
	top:222px;
	left:0px;
}

#popularareas .photo .aso{
	top:222px;
	left:109px;
}

#popularareas .photo .sapporo{
	top:222px;
	left:218px;
}

#popularareas .photo .hakone{
	top:222px;
	left:434px;
}


/* all_area */
#popularareas .all_area dl{
	margin-bottom:10px;
}
#popularareas .all_area dl{display: inline-block;}
/* Exclude Mac IE \*/
#popularareas .all_area dl{display: block;}
/**/
#popularareas .all_area dl:after{content:".";display:block;clear:both;height:0;visibility: hidden;}


#popularareas .all_area dl dt{
	width:130px;
	float:left;
	margin-right:5px;
	
	color:#323232;
	display:block;
	background: url("../images/home/top_popularareas_arrow.gif") right 5px no-repeat;
}
#popularareas .all_area dl dd{
	width:511px;
	float:left;
}

#popularareas .all_area dl dd ul{display: inline-block;}
/* Exclude Mac IE \*/
#popularareas .all_area dl dd ul{display: block;}
/**/
#popularareas .all_area dl dd ul:after{content:".";display:block;clear:both;height:0;visibility: hidden;}

#popularareas .all_area dl dd ul li{
	float:left;
	margin-right:5px;
}

#popularareas .all_area dl dd a{
	color:#323232;
}


/* ----------------------------------------------------------------------------
　bnr
---------------------------------------------------------------------------- */
#bnr{
	margin-top:25px;
}
#bnr p{
	margin-bottom:17px;
}