@charset "utf-8";
/* CSS Document */


/*=========================================================
 メインイメージ
==========================================================*/

#mainimg img{
	padding:0px;
	margin:0px;
}

/*=========================================================
 メイン
==========================================================*/
#main{
	margin-top:10px;
}


/*=========================================================
 サイドナビ （左）
==========================================================*/
#side-navi{
	width:190px;
	float:left;
	margin-left:10px;
	display:inline;
}


/*=========================================================
 みんなが見てる！ランキング - サイドナビ内
==========================================================*/

#ranking{
	background: url(/inc/images/top/bg_ranking.gif) repeat-y scroll;
	margin-bottom:10px;
	zoom: 1;
}

#ranking a{
	color: #333333;
	display:block;
}

#ranking a:hover{
	text-decoration: none;
	color: #666;
}


#ranking td.red,
#ranking td.red a{
	color: #ff0000;
}

#ranking td.red a:hover{
	color: #ff6666;
}

#ranking-table{
	width: 170px;
	margin: 3px 0px 3px 10px;
}


#ranking-table .ranking-no{
	text-align: center;
}

#ranking-table th,#ranking-table td{
	border-bottom: 1px dotted #cccccc;
	padding: 3px 0px 3px 0px;
}

#ranking-table th{
	vertical-align:top;
	padding: 3px 0px 3px 0px;
}
#ranking-table td {
	padding: 3px 0px 3px 10px;
	text-align:left;
}

#ranking-table .no_1 a{
	color: #ff0000;
}

#ranking-table .no_1 a:hover{
	color: #ff6666;
}


/*=========================================================
 サービス一覧　
==========================================================*/

div#service{
	margin-bottom: 5px;
}

div#service h2 a{
	padding:0px;
	margin:0px;
	background:none;
	float:none;
}

div#service ul{
	border-width: 1px 0px 1px 0px;
	border-style: solid;
	border-color: #cccccc;
	background-attachment: scroll;
	background-image: url(/inc/images/top/bg_service.gif);
	background-repeat: repeat-y;
	margin-bottom:10px;
}

div#service ul li{
	float:left;
	width:185px;
	height: 100%;
	display: block;
}

div#service ul li dl{
}

div#service ul li dl dt{
	padding: 1px 1px 2px 2px;
}

div#service ul li dl dd{
	background: url(/inc/images/common/icon/ico_arrow_black.gif) no-repeat 0px 3px scroll;
	display: block;
	border-bottom: 1px dotted #cccccc;
	margin: 0px 10px 3px 10px;
	zoom: 1;
}

div#service ul li dl dd a{
	color: #005bab;
	text-decoration: none;
	margin: 2px 0px 2px 20px;
	display:block;
}

div#service ul li dl dd a:hover{
	color: #3399cc;
	text-decoration: underline;
}

div#service ul li dl dd a:visited{
	color: #9966ff;
}

div#service ul li dl dd a.out{
	padding: 0px 18px 0px 0px;
}

/* Safari, Chrome */
@media screen and (-webkit-min-device-pixel-ratio:0) {
dl dd a .small{
	letter-spacing: -0.2em
}
}

/* サービス一覧・ランキング　h2打消し設定 */
#main #side-navi h2,
#contents #service h2{
	background-image: none !important;
	padding: 0px;
	height:40px;
	text-align: center;
	display: table-cell;
}

#main #side-navi h2 img,
#contents #service h2 img{
	vertical-align: middle;
	margin: 13px 9px 13px 9px;
}

/* その他一覧　リンク設定 */

div#service div.catalog{
	margin: 5px 10px 10px 0px;
}

div#service div.catalog a{
	display: block;
	padding-left: 20px;
	background: url(/inc/images/common/icon/ico_arrow_aqua.gif) no-repeat 0px center  scroll;
	color: #005bab;
	float:right;
}

div#service div.catalog a:hover{
	color: #3399cc;
	text-decoration: none;	
}


h2  a:visited,div#service div.catalog a:visited{
	color: #9966ff;
}

div#service a.service-bnr{
	margin-bottom:10px;
	text-align:center;
	display:block;
}



/*=========================================================
 「ライフイベントを選ぶ」
==========================================================*/

#life-event{
	padding-bottom: 13px;
}

*:first-child+html #life-event h2 a,
*:first-child+html #life-event h2 a {
	margin-top: -1.3em;
}


#life-event h2 a{
	padding-right: 0px;
	text-decoration: underline;
	cursor: pointer !important;
}

#life-event h2 a:hover{
	text-decoration: none;
}


#life-event ul li{
	float:left;
	margin-right:8px;
	width:85px;
	vertical-align: 1.3em
}

#life-event a{
	display: block;
	text-decoration: none;
}

#life-event a:hover{
	text-decoration: underline;
}

#life-event ul li a img{
	margin-bottom:5px;
}

/* ライブラリー と 今月のみんなの一票 共通部分 */
#liblary,#ballot{
	width:365px;
}

#liblary h4,#ballot h4{
	*font-size: 100%;
}

#liblary div,
#ballot div{
	background-attachment: scroll;
	background-repeat: no-repeat;
	background-position: bottom;
}

a span.typeA{
	height: 17px !important;
	padding-left: 20px;
	margin-bottom: 5px;
	background: url(/inc/images/common/icon/ico_arrow_black.gif) scroll no-repeat 0px 1px;
	display: block;
	cursor: pointer;
	_zoom: 1;
}


/*=========================================================
	ライブラリー・今月のみんなの一票
==========================================================*/

/* h2 */
#main h2.liblary,
#main h2.ballot{
	width: 316px;
	height: 21px;
	background-attachment: scroll;
	background-repeat: no-repeat;
	padding: 13px 0px 5px 49px;
}

#main h2.liblary{ background-image:url(/inc/images/common/bg_h2/bg_h2_library.gif); 
}

#main h2.ballot{
	background-image:url(/inc/images/common/bg_h2/bg_h2_ballot.gif);
}

#main h2.liblary a,#main h2.ballot a,
#main h2.yellow-circle a,#life-event h2 a {
	font-size: 85% !important;
}

/* ライブラリー */
#liblary {
	float: left;
}
#liblary div{
	background-color:#ddedf9;
	background-image: url(/inc/images/top/img_liblary-foot.jpg);
}
#liblary h4 {
	width: 345px;
	background: url(/inc/images/top/img_liblary-top.jpg) 0 0 no-repeat;
	padding: 10px 10px 0px 10px;
}
#liblary h4.none {
	background: none;
}
#liblary ul {
	margin-top:10px;
	margin-left: 10px;
}

#liblary ul li{
	margin-bottom:8px;
}



/* 今月のみんなの一票 */
#ballot{
	float: right;
}

#ballot div{
	width:365px;
	background-color: #eeeeee;
}

#ballot .ballotbox{
	padding-bottom: 5px;
	background: url(/inc/images/top/img_ballot-foot.jpg) center bottom no-repeat;
}

#ballot h4 {
	width: 345px;
	padding: 10px 10px 0px 10px;
	background: url(/inc/images/top/img_ballot-top.jpg) 0 0 no-repeat;
    padding-bottom: 10px;
    _padding-bottom: 5px !important;
}
/*#ballot form{
	margin-left: 10px;
	color: #005bab;
	overflow: hidden;
}*/

#ballot form {
    color: #005BAB;
	background:#eeeeee;
}


#ballot input{
	float: left;
	clear: both;
}

#ballot span{
	display:block;
	float: left;
	margin: 2px 0px 0px -10px;
	text-indent: 10px;
	_width: 135px;
	width: 215px;
}


#ballot form ul{
	margin-left: 10px;
	margin-bottom: 10px;
	_margin-left: 5px;
	_margin-bottom: 5px;
	_width: 167px;
	width: 247px;
	float: left;
}

#ballot form ul li{
	 margin-top: 2px;
	 _margin-top: 0px !important;
}

#ballot #touhyou{
	display: block;
	float: right;
	background: none;
	margin: 5px 10px;
	width: 75px;
}

#ballot #touhyou #ballot-btn{
	float:right;
}

/*=========================================================
 お知らせ　ニュースリリース 　
==========================================================*/
/* お知らせ　ニュースリリース ご注意ください */
#announcement,
#news-release  {
	width:365px;
}

#announcement {	float: left;}

#news-release {	float: right;}

#attention {
	clear: both;
	padding-bottom:20px;
}
#attention ul{
	margin-left: 10px;
}


/* お知らせ・ニュースリリース のみ*/

#announcement h2.yellow-circle,
#news-release h2.yellow-circle{
	width:334px;
	height: 20px;
	background-attachment: scroll;
	background-repeat: no-repeat;
	padding: 8px 0px 2px 31px;
}


/* ご注意ください */
#attention h2.attention{
	background-image:url(/inc/images/common/bg_h2/bg_h2_attention.gif);
	padding-left: 44px;
}




/*=========================================================
	その他
==========================================================*/

/* contents内の独立テキストリンク */
#contents #service div.text_link{
	width:100%;
	clear: both;
	text-align: right;
}

/* バナースペース - ページ下部 */
#banner-space{
	background: url(/inc/images/top/bg_line.jpg) repeat-x scroll;
	padding-top: 13px;
}

.twin {
	margin-bottom: 20px;
}

/*吹き出し*/
.hukidashi {
	position: relative;
}
.hukidashi:hover .hukidashi_guide {
	opacity: 1;
	visibility: visible; /* これがないとIE8で表示してしまう。*/
	transform: translateY(0);
}
.hukidashi_guide, .hukidashi_guide:visited {
	transition: opacity .5s, transform .5s, visibility .5s;
	visibility: hidden;
	opacity: 0;
	transform: translateY(-10px);
	display: inline-block;
	position: absolute;
	background: #f5e0e5;
	padding: 10px;
	font-size: 80%;
	min-width: 174px;
	top: 53px;
	left: 50%;
	margin-left: -85px;
	border-radius: 8px;
	box-shadow: 0 5px 8px rgba(0, 0, 0, 0.8);
	color: #005bab;
}
.hukidashi_guide:before {
	content: "";
	position: absolute;
	top: -12px;
	left: 50%;
	margin-left: -11px;
	display: block;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0 11px 13px 11px;
	border-color: transparent transparent #f5e0e5 transparent;
}