@charset "utf-8";

/*=====================================================

 * Style Name: Index Page Style
 * Style URL: /common/css/index.css
 * Description: Page Style Sheet
 * Version: 0.4
 * Last Up Date: 2011/04/13
 * Author: Prime works
 * Author URL: http://www.primeworks.jp/
 *
 * Markup Reference:
 *

=====================================================*/







/*----- contents -------

	0: Function Elements
	1: Common Elements
		: Heading
		: table
		: list
	2: Unique Elements

----------------------*/







/*
===== 0: Function Elements ===========================*/

ul#translate { float: right; padding: 2px 15px; }
ul#translate li { padding-right: 5px; }
ul#translate li select { margin: 0; }



/*

===== 1: Common Elements ===========================*/

div#main { float: left; width: 730px; overflow: hidden; }
div#side { float: right; width: 220px; text-align: center; }


div.twin-box { width: 750px; }
.odd-line { background: #f9f9f9; }

div#index-operation h2,
div#index-recommend h2,
div#index-news h2,
div#index-topics h2,
div#index2-topics h2,
div#index-links h2,
div#index-banners h2 {
    background: url("../img/bg_h2.gif") no-repeat scroll 0 0 transparent;
    margin: 0 0 20px;
    padding: 10px 30px;
}





/*

===== 2: Unique Elements ===========================*/



/* Operation
-----------------------------*/

div#index-operation {
	margin-right: -10px;
	width: 740px;
	/zoom : 1;
}

div#index-operation:after{ content : ''; display : block; clear : both; }

div.ope-category {
	float: left;
	padding-right: 10px;
	width: 175px;
}


div#index-operation { position: relative; }

div#index-operation h2,
div#index-operation p { position: relative; }

div#index-operation a.button-box { display: block; }
div#index-operation h2 a.button-box { position: absolute; top: 15px; right: 20px; }
div#index-operation p a.button-box { float: right; padding-left: 5px; }
div#index-operation p a.button-box img { border: 1px solid #d8d8d8; }


div#index-operation h3 {
	margin: 0 0 15px;
	background: none;
	padding: 0;
}


/* Recommend

-----------------------------*/

div#index-recommend { position: relative; }

div#index-recommend h3,
div#index-recommend p { position: relative; }

div#index-recommend a.button-box { display: block; }
div#index-recommend h3 a.button-box { position: absolute; top: 15px; right: 10px; }
div#index-recommend p a.button-box { float: right; padding-left: 5px; }
div#index-recommend p a.button-box img { border: 1px solid #d8d8d8; }


div#index-recommend .nav { margin-right: -10px; width: 740px; }
div#index-recommend .nav li { padding: 0 10px 7px 0; }



/* News
-----------------------------*/

div#index-news { width: 470px; }
div#index-news h3 { margin-bottom: 13px; }
div#index-news img.icon-rss { position: absolute; top: 15px; right: 70px; }


div#index-news dt { padding-top: 7px; color: #9a381b; font-weight: bold; line-height: 17px; }
div#index-news dt img { padding: 0 5px; }


div#index-news dd { padding-bottom: 7px; border-bottom: 1px dotted #cccccc; }


div#index-news dd.qr-code { min-height:90px; /height:90px; padding-right:200px; background:url(../img/bnr_smp_qr.gif) no-repeat 300px 5px;}
div#index-news dd.qr-code-ver2 { min-height:90px; /height:90px; background:url(../img/bnr_smp_qr.gif) no-repeat 320px 5px;}

div#index-news dd.qr-code130917 { min-height:70px; /height:70px; background:url(../../news/img/bnr_news_qr130917.gif) no-repeat 320px 0;}

div#index-news dd img.qr-code-index { margin: 10px 0 0 5px;}



/* Topics
-----------------------------*/

div#index-topics { width: 240px; }
div#index2-topics { width: 750px; }

div#index-topics ul.banner li { float: none; margin: 0 0 6px; width: auto; }
div#index2-topics ul.banner li { float: left; margin: 0 10px 12px 0; width: auto; }


/* Links

-----------------------------*/

div#index-links { overflow: hidden; padding-bottom: 25px; border-bottom: 1px solid #cccccc; }
div#index-links .nav { margin-right: -20px; }
div#index-links .nav li { padding: 0 25px 10px 0; }


/* Movie

-----------------------------*/

div#index-movie { width: 410px; }
div#index-movie h3 { margin-bottom: 13px; }


div.movie-box {
	padding: 7px 0;	
	border-bottom: 1px dotted #cccccc;
	/zoom : 1;
}

div.movie-box:after{ content : ''; display : block; clear : both; }


div.movie-box p { margin: 0; }
div.movie-box dt { font-weight: bold; }





/* Banners
-----------------------------*/

div#index-banners ul.banner li { width: auto; margin-bottom: 10px; }


/* Side
-----------------------------*/


div#side dl {
	margin-bottom: 15px;
	padding: 5px 0;
	background: #f9f4eb;
	border: 1px solid #e7e7e7;
}

div#side dt { padding-bottom: 7px; text-align: left; }


div#side ul.banner { margin: 0; }
div#side dl ul.banner { margin-bottom: -7px; }


div#side p.search { margin: 15px 0 30px; padding: 8px 0; width: 220px; }
* html div#side p.search { width: 220px; }




/* slider

-----------------------------*/


#slider,
#sub-slider {
	margin: 0 auto;
	width: 980px;
	text-align: left;
}

#slider div,
#sub-slider div {
	width: 980px;
	height: 315px;
	overflow: hidden;
	position: relative;
	margin: 0 0 5px;
}

#slider div div,
#sub-slider div div {
	top: 0;
	left: 0;
	position: absolute;
	display: none;
}

#slider ul,
#sub-slider ul {
	width: 980px;
	border-top: 4px solid #efebe8;
	border-bottom: 4px solid #efebe8;
}

#slider ul li,
#sub-slider ul li {
	width: 191px; /*サムネ5枚時*/
/*	width: 240px;*/ /*サムネ4枚時*/
	float: left;
	display: inline;
	border-left: 4px solid #efebe8;
}

#slider ul li a,
#sub-slider ul li a {
	display: block;
	padding: 3px;
}

#slider ul li.last-item,
#sub-slider ul li.last-item {
/*	border-right: 4px solid #efebe8;*/ /*サムネ5枚時*/
	border-right: 5px solid #efebe8; /*サムネ4枚時*/
	
}

#slider ul li.active,
#sub-slider ul li.active {
  	background-color: #614e46;
}

#slider .maplink,
#sub-slider .maplink {
	border: none;
	outline: none;
}


#slider a#slide_first,
#sub-slider a#slide_first {
	position: relative;
	top: 0;
	left: 0;
	display: none;
}



/* ranking

-----------------------------*/

div#ranking {
	width: 980px;
	margin: 20px 0 35px;
}

div#ranking h2 {
	margin : 0 0 20px;
}

div#ranking ul {
	overflow: hidden;
	margin-bottom: -7px;
}

div#ranking ul#nav li {
	margin-right: 5px;
	float: left;
	display: inline;
	font-size: 0;
}

div#ranking ul#nav li#faceline,
div#ranking ul#nav li#diet,
div#ranking ul#nav li#anti.mr04 {
	margin-right: 4px;
}

div#ranking ul#nav li.last-item,
div#ranking ul#nav li#diet.last-item {
	margin: 0;
}

div#ranking ul.panel {
	border: 1px solid #DFDFDF;
	clear: both;
	background: url(../img/bg_ranking.gif) repeat-x top left;
}

div#ranking ul.panel li {
	display: none;
	overflow: hidden;
}

div#ranking ul.panel li div {
	float: left;
	border-right: 1px solid #CCC;
	height: 330px;
}

div#ranking ul.panel li div.rank-1st {
	padding: 8px 15px 50px;
}

div#ranking ul.panel li div.rank-2nd,
div#ranking ul.panel li div.rank-3rd {
	padding: 11px 15px 47px;
}

div#ranking ul.panel li div.rank-other {
	padding: 15px 15px 42px;
	border: none;
}

div#ranking ul.panel li div dl {
	width: 229px;
	float: left;
}

div#ranking ul.panel li div dl dt a {
	text-decoration: none;
}

div#ranking ul.panel li div.rank-1st dl dt {
	background: url(../img/icon_ranking_1st.gif) no-repeat 0 50%;
	padding: 12px 0 12px 68px;
}

div#ranking ul.panel li div.rank-2nd dl dt {
	background: url(../img/icon_ranking_2nd.gif) no-repeat 0 50%;
	padding: 9px 0 9px 60px;
}

div#ranking ul.panel li div.rank-3rd dl dt {
	background: url(../img/icon_ranking_3rd.gif) no-repeat 0 50%;
	padding: 9px 0 9px 55px;
}

div#ranking ul.panel li div dl dt.rank-4th {
	background: url(../img/icon_ranking_4th.gif) no-repeat 0 50%;
	padding: 5px 0 5px 30px;
}

div#ranking ul.panel li div dl dt.rank-5th {
	background: url(../img/icon_ranking_5th.gif) no-repeat 0 50%;
	padding: 5px 0 5px 30px;
}

div#ranking ul.panel li div dl dt {
	font-size: 110%;
	font-weight: bold;
}

div#ranking ul.panel li div dl dt img {
	vertical-align: middle;
	padding: 0 0 0 5px;
}

div#ranking ul.panel li div dl dt,
div#ranking ul.panel li div dl dd {
	margin: 0 0 10px;
}

div#ranking ul.panel li div dl dd.photo {
	text-align: center;
}

div#ranking ul.panel li div.rank-other dl {
	width: 167px;
}

div#ranking ul.panel li div.rank-other dl dt {
	margin: 0;
}

div#ranking ul.panel li div.rank-other dl dd {
	margin: 0 0 20px;
}