@charset "utf-8";

/* ::::::::::::::::::::::::::::::::::::::::::::::
    top.css
-------------------------------------------------
    トップページ
:::::::::::::::::::::::::::::::::::::::::::::: */

@import'/css/common/base.css';
@import'/css/common/layout.css';
@import'/css/common/module.css';

/* ==============================================
    背景
============================================== */
div#container {
    padding-bottom: 0;
    background: url(/img/top/bg_body_t.jpg) repeat-y 50% 0;
}
div#wrapper {
    background: url(/img/top/bg_body_b.jpg) no-repeat 50% 100%;
}
div#content {
    padding-bottom: 0;
}

/* ==============================================
   みんなのにおい百科
============================================== */
div#smellDictionary {
    position: relative;
    background: url(/img/top/bg_dictionary_t.gif) no-repeat;
}
/* override winIE6,7 */
*:first-child+html div#smellDictionary {
    padding-bottom: 20px;
}
* html div#smellDictionary {
    padding-bottom: 20px;
}
div#smellDictionary h2 {
    position: relative;
    top: -20px;
    margin-bottom: -20px;
}

/* 地図
-----------------------------------------------*/
div#smellMap {
    float: left;
    width: 670px;
    margin-right: 15px;
    padding-bottom: 40px;
    background: url(/img/top/bg_dictionary_b.gif) no-repeat 0 100%;
}
div#smellMap div.wrapMap {
    width: 648px;
    height: 292px;
    margin: 0 11px 0 11px;
}
div#smellMap div.wrapMap div.map {
    width: 646px;
    height: 290px;
}
div.wrapMap span.corner01 {
    background-image: url(/img/top/bg_map_01.gif);
}
div.wrapMap span.corner02 {
    background-image: url(/img/top/bg_map_02.gif);
}
div#smellMap div.more {
	margin: 10px 11px 0;
	text-align: right;
}
div#smellMap div.more h4,
div#smellMap div.more p {
	display: inline;
	margin-left: 10px;
}

/* においINDEX
-----------------------------------------------*/
div#smellIndex {
    float: left;
    width: 245px;
    padding: 0 15px 40px;
    background: url(/img/top/bg_dictionary_b.gif) no-repeat 100% 100%;
}
div#smellIndex h3 {
	margin-bottom: 10px;
}
div#smellIndex p.more {
	text-align: right;
}

/* 新規におい登録 */
div#smellIndex div.regist {
    margin-bottom: 15px;
	text-align: center;
}
div#smellIndex div.regist h4 {
    margin-bottom: 5px;
}

/* におい検索 */
div#smellIndex div.search {
    margin-bottom: 15px;
	text-align: center;
}
div#smellIndex div.search h4 {
    margin-bottom: 5px;
}
div#smellIndex div.search input.text {
	width: 145px;
	margin-right: 5px;
	padding: 1px 2px;
	border: 1px solid #cccccc;
	background: #fdfdfd url(/img/common/bg_search_input.gif) repeat-x;
	color: #999999;
	vertical-align: middle;
}
div#smellIndex div.search input.btn {
	vertical-align: middle;
}

/* においTAG */
div#smellIndex div.tag {
	margin-bottom: 10px;
	padding: 10px;
	background: #dff3fe;
}
div#smellIndex div.tag ul li {
	display: inline;
	margin-right: 0.5em;
}
div#smellIndex div.tag ul li.lv1 {
    font-size: 100%;
}
div#smellIndex div.tag ul li.lv2 {
    font-size: 108%;
}
div#smellIndex div.tag ul li.lv3 {
    font-size: 116%;
}
div#smellIndex div.tag ul li.lv4 {
    font-size: 124%;
}
div#smellIndex div.tag ul li.lv5 {
    font-size: 131%;
}

/* ==============================================
   においTopics
============================================== */
div#smellTopics {
    position: relative;
    width: 960px;
    background: url(/img/top/bg_topics_t.gif) no-repeat;
}
/* override winIE6,7 */
*:first-child+html div#smellTopics {
    padding-bottom: 20px;
}
* html div#smellTopics {
    padding-bottom: 20px;
}
div#smellTopics h2 {
    position: relative;
    top: -20px;
    margin-bottom: -20px;
}
div#smellTopics p.subttl {
    position: absolute;
    top: 5px;
    right: 20px;
    font-size: 77%;
}
div#smellTopics p.view {
    margin: 5px -5px 0 0;
}

/* においの相談室
-----------------------------------------------*/
div#smellCounseling {
    position: relative;
    float: left;
    width: 270px;
    min-height: 175px;
    margin-right: 15px;
    padding: 0 20px 40px;
    background: url(/img/top/bg_topics_b.gif) no-repeat 0 100%;
}
div#smellCounseling ul li {
    margin-top: 10px;
}
div#smellCounseling ul li ul li {
    display: inline;
    padding: 0;
    font-size: 77%;
}

/* 話題のにおいランキング
-----------------------------------------------*/
div#smellRanking {
	float: left;
	width: 270px;
	margin-right: 15px;
	min-height: 175px;
	padding: 0 20px 40px;
	background: url(/img/top/bg_topics_b.gif) no-repeat scroll -325px 100%;
}
div#smellRanking ol {
	list-style: none;
}
div#smellRanking ol li.rank1,
div#smellRanking ol li.rank2,
div#smellRanking ol li.rank3 {
	margin-top: 10px;
	padding-left: 22px;
	background-position: 0 0.2em;
	background-repeat: no-repeat;
}
div#smellRanking ol li.rank1 { background-image: url(/img/common/icn_rank_01.gif); }
div#smellRanking ol li.rank2 { background-image: url(/img/common/icn_rank_02.gif); }
div#smellRanking ol li.rank3 { background-image: url(/img/common/icn_rank_03.gif); }

div#smellRanking ol li ul li {
    display: inline;
    padding: 0;
    font-size: 77%;
}

/* スメリストランキング
-----------------------------------------------*/
div#userRanking {
	float: left;
	width: 270px;
	min-height: 175px;
	padding: 0 20px 40px;
	background: url(/img/top/bg_topics_b.gif) no-repeat scroll 100% 100%;
}
div#userRanking ol {
	overflow: hidden;
	margin: 10px 0 30px;
	width: 270px;
	list-style: none;
}
div#userRanking ol li.rank1,
div#userRanking ol li.rank2,
div#userRanking ol li.rank3 {
	float: left;
	width: 65px;
	margin-right: 5px;
	padding-left: 20px;
	background-repeat: no-repeat;
}
div#userRanking ol li.rank1 { background-image: url(/img/common/icn_rank_01.gif); }
div#userRanking ol li.rank2 { background-image: url(/img/common/icn_rank_02.gif); }
div#userRanking ol li.rank3 { background-image: url(/img/common/icn_rank_03.gif); }

div#userRanking ol li h4,
div#userRanking ol li p,
div#userRanking ol li ul {
	margin: 5px 0 0 -20px;
	font-size: 85%;
}
div#userRanking ol li div {
	height: 50px;
}
div#userRanking ol li h4 img.icn {
	margin-left: 0;
}
div#userRanking ol li ul li {
	margin-top: 3px;
	padding-left: 8px;
	background: url(/img/common/icn_arrow_01.gif) no-repeat 0 0.45em;
}

/* ==============================================
   その他コンテンツ
============================================== */
div#otherCont {
    float: left;
    width: 635px;
    margin: 20px 15px 0 0;
	background: url(/img/top/bg_other_t.gif) no-repeat;
}
div#otherCont h2 {
    position: relative;
    top: -30px;
	left: -20px;
	margin-bottom: -20px;
}
div#otherCont p.view {
    margin: 5px -5px 0 0;
}

/* においの逸品
-----------------------------------------------*/
div#excellentSmell {
    float: left;
	width: 270px;
	margin-right: 15px;
	padding: 0 20px 40px;
	background: url(/img/top/bg_other_b.gif) no-repeat 0 100%;
}
div#excellentSmell div.unitNewItem div.txt {
	float: right;
	width: 110px;
}
div#excellentSmell div.unitNewItem div.txt h3 {
	margin-bottom: 5px;
	font-size: 108%;
}
div#excellentSmell div.unitNewItem div.img {
    position: relative;
    float: left;
    width: 144px;
    height: 141px;
}
div#excellentSmell div.unitNewItem div.img a img {
    margin: 10px 0 0 12px;
}
div#excellentSmell div.unitNewItem div.img a span {
    position: absolute;
    top: 0;
    left: 0;
    width: 144px;
    height: 141px;
    background: url(/img/excellent/frame_tv_sub.gif) no-repeat;
}

/* ハナコの部屋
-----------------------------------------------*/
div#hanakoRoom {
    float: left;
	width: 270px;
	min-height: 175px;
	padding: 0 20px 40px;
	background: url(/img/top/bg_other_b.gif) no-repeat scroll 100% 100%;
}
div#hanakoRoom p.commingSoon {
	margin: 0 -10px;
}

/* adsence
-----------------------------------------------*/
div#adArea {
    clear: both;
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 100;
    padding-bottom: 10px;
}
div#adArea div.unitAd {
    margin-top: 10px;
}

/* においニュース
-----------------------------------------------*/
div#smellNews {
	position: relative;
	width: 300px;
	height: 60px;
	margin: 20px 0 60px;
	padding: 5px 5px 0;
	background: url(/img/top/bg_news.gif);
}
div#smellNews h2 {
	float: left;
	width: 58px;
	margin-right: 5px;
}
div#smellNews dl {
	float: left;
	width: 180px;
	margin-top: 5px;
}
div#smellNews dl dt {
	font-size: 77%;
}
div#smellNews dl dd h3 {
	font-size: 85%;
}
div#smellNews dl dd p {
	font-size: 77%;
}
div#smellNews p.view {
	position: absolute;
	right: 5px;
	bottom: 5px;
}

/* ==============================================
   ハナコflash
============================================== */
div#animation {
    float: left;
    width: 310px;
}

/* ==============================================
   clearfix
============================================== */

div#smellNews div#newsList ul:after,
div#smellDictionary:after,
div#smellTopics:after,
div#otherCont:after,
div#excellentSmell:after,
div#hanakoRoom:after,
div#userRanking ol:after,
div.unitNewItem:after,
div#smellNews:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
    line-height: 0;
    font-size: 0.1em;
}
div#smellNews div#newsList ul,
div#smellDictionary,
div#smellTopics,
div#otherCont,
div#excellentSmell,
div#hanakoRoom,
div#userRanking ol,
div.unitNewItem,
div#smellNews {
    display: inline-block;
}
/* Hides from IE-mac \*/
* html div#smellNews div#newsList ul,
* html div#smellDictionary,
* html div#smellTopics,
* html div#otherCont,
* html div#excellentSmell,
* html div#hanakoRoom,
* html div#userRanking ol,
* html div.unitNewItem,
* html div#smellNews {
    height: 1%;
}
div#smellNews div#newsList ul,
div#smellDictionary,
div#smellTopics,
div#otherCont,
div#excellentSmell,
div#hanakoRoom,
div#userRanking ol,
div.unitNewItem,
div#smellNews {
    display: block;
}
/* End hide from IE-mac */