@charset "utf-8";

/*都道府県ページ　アイキャッチ
--------------------------------------------------*/
#pref_eye{
	margin-bottom:15px;
}

#pref_eye .main_box_content{
	padding:4px;
}

#pref_eye_left{
	float:left;
	width:210px;
	height:290px;
	position:relative;
}

#pref_eye_right{
	float:right;
	width:410px;
	height:290px;
	position:relative;
	padding-bottom:10px;
}
#pref_eye_right li{
	margin-bottom:2px;
}

#pref_eye_cption{
	position:absolute;
	right:0;
	bottom:0;
	padding:10px;
	background-color:#000000;
	filter: alpha(opacity=70);
  -moz-opacity:0.70;
  opacity:0.70;
	color:#ffffff;
}

#area_selector_box{
	position:absolute;
	left:0;
	bottom:0;
	max-height:221px;
}

#area_selector_popular{
	padding:10px 10px 5px 10px;
	background-color:#fcf489;
	width:190px;
}

#area_selector_popular ul{
	height:66px;
	overflow:hidden;
}

.area_selector_popular_caption span{
	display:none;
}

.area_selector_popular_caption{
	width:94px;
	height:14px;
	background:url(/images/tl_selector_popular.gif) no-repeat left top;
	margin-bottom:5px;
}

#area_selector_popular ul li{
	float:left;
	_display:inline;
	margin:0 8px 0 0;
	white-space:nowrap;
	line-height:22px;
}

#area_selector_pref li{
	float:left;
	_display:inline;
	margin:5px 5px 0 0;
}

#area_selector_pref li a{
	display:block;
	width:65px;
	text-align:center;
	background-color:#e8e8e8;
	padding:3px 0;
	border-radius:3px;
	-moz-border-radius:3px;
}

#area_selector_pref li a:hover{
	background-color:#c9c9c9;
}


/*東京都の特集＆注目スポット
--------------------------------------------------*/


/*東京の話題のスポットランキング
--------------------------------------------------*/
#pref_ranking .main_box_content{
	padding:0;
	overflow:hidden;
	background-color:#ffd302;
	border:none;
}

#pref_ranking h2{
	padding-left:24px;
	background:url(/images/all.png) no-repeat left -1150px;
}
#pref_ranking h3{
  padding-left:24px;
}
#tl_ranking_gourmet{
	background:url(/images/mini.gif) no-repeat left -150px;
}

#tl_ranking_shopping{
	background:url(/images/mini.gif) no-repeat left -350px;
}

#tl_ranking_leasure{
	background:url(/images/mini.gif) no-repeat left -200px;
}

#pref_ranking .ranking_box{
	background-color:#ffffff;
	border:1px solid #fdc800;
	width:186px;
	float:left;
	padding:10px;
	margin-right:6px;
}

#pref_ranking .ranking_box_last{
	margin-right:0;
}

#pref_ranking ul.item_box li div.item_img{
	text-align:center;
}

#pref_ranking ul.item_box li div.item_img div.item_image_credit{
	width:186px;
	text-align:center;
}

/*s3slider アイキャッチ
--------------------------------------------------*/
#s3slider {
  width: 410px; /* important to be same as image width */
  height: 290px; /* important to be same as image height */
  position: relative; /* important */
  overflow: hidden; /* important */
}

#s3sliderContent {
  width: 410px; /* important to be same as image width or wider */
  position: absolute; /* important */
  top: 0; /* important */
  margin-left: 0; /* important */
}

.s3sliderImage {
	width:410px;
	height:290px;
  float: left; /* important */
  position: relative; /* important */
  display: none; /* important */
}

.s3sliderImage span {
  position: absolute; /* important */
  left: 0;
  padding: 10px 15px;
  width: 380px;
  background-color: #000000;
  filter: alpha(opacity=70); /* here you can set the opacity of box with text */
  -moz-opacity: 0.7; /* here you can set the opacity of box with text */
  -khtml-opacity: 0.7; /* here you can set the opacity of box with text */
  opacity: 0.7; /* here you can set the opacity of box with text */
  color: #ffffff;
  display: none; /* important */
  bottom: 0;

  /*
     if you put
     top: 0; -> the box with text will be shown at the top of the image
     if you put
     bottom: 0; -> the box with text will be shown at the bottom of the image
  */
}

.clear {
  clear: both;
}
#detail_header{
  width:410px;
  height:149px;
	position:relative;
	margin-bottom:15px;
}
#title_box{
	position:absolute;
	bottom:0px;
  width:370px;
  padding:10px 15px;
  margin:0px 5px;
  border-bottom:solid 5px #B4CE27;
  background-color:white;
  background-color:rgba(254,254,254,0.7);
  filter: progid:DXImageTransform.Microsoft.gradient(startcolorstr=#B4FFFFFF, endcolorstr=#B4FFFFFF, gradienttype=0);
}
#title_box h2 a,
#title_box h2 a:hover{
	color:black;
	text-decoration:none;
}
#header_image{
	overflow:hidden;
	width:410px;
	height:149px;
}
.radius5px{
  border-radius: 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius:5px;
}
.top_radius{
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  -webkit-border-top-left-radius: 10px;
  -webkit-border-top-right-radius: 10px;
  -moz-border-radius-topleft:10px;
  -moz-border-radius-topright:10px;
}
