@charset "utf-8";

#page-top { bottom: 2.5em; }


/* 全体 ============================== */
body { background-color: red; }

div.wrapper { width: 980px; margin: 0 auto; }

a.icon { padding:2px 12px 2px 3px; background: url(../images/index_icon_arrow.gif) 100% no-repeat; margin-left: -3px; }
a.icon:link, a.icon:visited { background-color: white; }
a.icon:active, a.icon:hover { background-color: #f2f2f2; }



/* ヘッダ ============================== */
div.headWrapNotice { padding: 20px 16px 25px; position: relative;}
div.headWrapNotice ul.topShareBtns { position: absolute; bottom: 15px; right: 16px; }
div.headWrapNotice ul.topShareBtns li { float: right; padding-left: 10px; }
div.headWrapNotice p.headLogo { float: left; }
div.headWrapNotice p.tagline{ float: left; padding: 9px 0 0 50px; line-height: 1.9; letter-spacing: 0.05em; }
div.headWrapNotice div.aboutBtn { float: right; }

div.noticeArea { padding: 0 16px; }


div.contTop { padding-right: 16px; text-align: right; min-width: 996px; }

ul.noticeShareBtn { margin-top: 5px; }
ul.noticeShareBtn li { float: right; padding-left: 5px; }


/* コンテンツ ============================== */
div.contFrame { background-color: white; min-width: 980px; border-right: solid 8px red; border-left: solid 8px red; padding: 0 8px; }

/* メインカラム */
div.leftCont { float: left; width: 770px; }

div.leftCont div.abesec { margin-top: 30px; }
div.leftCont div.leftClm500 { float: left; width: 500px; }
div.leftCont div.rightClm250 { float: right; width: 250px; }
div.leftCont div.leftClm420 { float: left; width: 420px; }
div.leftCont div.rightClm330 { float: right; width: 330px; }
div.leftCont div.leftClm375 { float: left; width: 375px; }
div.leftCont div.rightClm375 { float: right; width: 375px; }
div.leftCont div.leftClm330 { float: left; width: 330px; }

/* 次回予告・ブログ */
div.leftCont div.abesec img.nextTit { margin-top: 13px; }
div.leftCont div.abesec div.nextBox { margin-top: 8px;}
div.leftCont div.abesec div.nextBox div.nextCont { float: left; padding-left:5px; width: 410px; }
div.leftCont div.abesec div.nextBox p.nexSummary { margin-top: 5px; }
div.leftCont div.abesec div.nextBox img.nextAbe { float: right; }

div.leftCont div.abesec div.nextBox p.blogTit { padding-left:5px; line-height: 1.35; }
div.leftCont div.abesec div.nextBox div.blogCont { float: left; padding-left:5px; width: 150px; margin-top: 5px; }
div.leftCont div.abesec div.nextBox img.blogAbe { float: right; margin-top: 15px; }





/* アンケート */
div.leftCont div.abesec img.surveyTit { margin-top: 9px; }
div.leftCont div.abesec div.surveyBox { margin-top: 9px;}
div.boxline div.boxContSurvey { padding: 15px; }
div.boxline div.boxContSurvey div.surveyQ { padding: 7px 0 0 32px; min-height: 30px; _height: 30px; line-height: 1.3; }
div.boxline div.boxContSurvey div.surveyQred { background: url(../images/index_survey_Q_r.gif) 0 0 no-repeat; }
div.boxline div.boxContSurvey div.surveyQblk { background: url(../images/index_survey_Q_b.gif) 0 0 no-repeat; }
div.boxline div.boxContSurvey div.surveyQ p.questionLead { margin-bottom: 3px; }
div.boxline div.boxContSurvey div.graphArea { margin-top: 12px; }
div.boxline div.boxContSurvey div.graphArea div.surveyGraph { float: left; width: 300px; }
div.boxline div.boxContSurvey div.graphArea div.surveyGraph div.exampleOut { background: url(../images/index_bg_black.gif) 0 0; padding: 1px; margin-top: 10px; }
div.boxline div.boxContSurvey div.graphArea div.surveyGraph div.exampleIn { background-color: white; padding: 5px 8px; line-height: 1; }
div.boxline div.boxContSurvey div.graphArea div.surveyGraph div.exampleIn ul li { float: left; padding: 0 20px 0 17px; line-height: 1.2; margin-top: 5px; white-space: nowrap; }
div.boxline div.boxContSurvey div.graphArea div.surveyGraph div.exampleIn ul li.eg1 { background: url(../images/index_survey_icon1.gif) 0 0 no-repeat;}
div.boxline div.boxContSurvey div.graphArea div.surveyGraph div.exampleIn ul li.eg2 { background: url(../images/index_survey_icon2.gif) 0 0 no-repeat;}
div.boxline div.boxContSurvey div.graphArea div.surveyGraph div.exampleIn ul li.eg3 { background: url(../images/index_survey_icon3.gif) 0 0 no-repeat;}
div.boxline div.boxContSurvey div.graphArea div.surveyGraph div.exampleIn ul li.eg4 { background: url(../images/index_survey_icon4.gif) 0 0 no-repeat;}

div.boxline div.boxContSurvey div.graphArea div.surveybtn { float: right; }
div.boxline div.boxContSurvey div.surveyBtnView { margin: 20px 0 5px; text-align: center; }


div.boxline div.boxContSurvey div.graphArea div.surveyGraph p.leadNoGraph { margin-top: 3px; line-height: 1.3; }
div.boxline div.boxContSurvey div.graphArea div.surveyGraph div.exampleOutNoGraph { background: url(../images/index_bg_black.gif) 0 0; padding: 1px; margin-top: 5px; }
div.boxline div.boxContSurvey div.graphArea div.surveyGraph div.exampleInNoGraph { background-color: white; padding: 2px 8px 7px; }
div.boxline div.boxContSurvey div.graphArea div.surveyGraph div.exampleInNoGraph ul li { padding-left:1.25em; text-indent:-1.25em; text-align: left; margin-top: 5px; line-height: 1.35; }
div.boxline div.boxContSurvey div.graphArea div.surveyGraph div.exampleInNoGraph p.noVote { padding: 15px 0 10px ; text-align: center; }
div.boxline div.boxContSurvey div.graphArea div.closingOut { background: url(../images/index_bg_red.gif) 0 0; padding: 1px; }
div.boxline div.boxContSurvey div.graphArea div.closingIn { background-color: white; padding: 15px 0 10px; text-align: center; }
div.boxline div.boxContSurvey div.graphArea div.closingIn p.cap { margin-top: 5px; margin-bottom: 10px; }


/* ナビ */
div.leftCont div.abesec img.naviTit { margin-top: 12px; }
div.leftCont div.abesec div.naviBox { margin-top: 6px;}
div.leftCont div.abesec div.naviBox ul.naviCont { float: left; padding-left:5px; width: 260px; }
div.leftCont div.abesec div.naviBox ul.naviCont li { margin-bottom: 4px; }
div.leftCont div.abesec div.naviBox img.naviAbe { float: right; margin-top: 25px; }

/* 今ツボ */
div.leftCont div.abesec img.tsuboTit { margin-top: 13px; }
div.leftCont div.abesec div.tsuboBox { margin-top: 8px;}
div.leftCont div.abesec div.tsuboBox ul.tsuboCont { float: left; padding-left: 5px; width: 280px; line-height: 1.35; }
div.leftCont div.abesec div.tsuboBox ul.tsuboCont li { padding-left: 34px; background-position: 0 10px; background-repeat: no-repeat; }
div.leftCont div.abesec div.tsuboBox ul.tsuboCont li span { display: block; padding-top: 10px; }
div.leftCont div.abesec div.tsuboBox ul.tsuboCont li:first-child span { padding-top: 5px; }
div.leftCont div.abesec div.tsuboBox ul.tsuboCont li.rank1 { background-image: url(../images/index_tsubo_rank1.gif); background-position: 0 5px; }
div.leftCont div.abesec div.tsuboBox ul.tsuboCont li.rank2 { background-image: url(../images/index_tsubo_rank2.gif); }
div.leftCont div.abesec div.tsuboBox ul.tsuboCont li.rank3 { background-image: url(../images/index_tsubo_rank3.gif); }
div.leftCont div.abesec div.tsuboBox ul.tsuboCont li.rank4 { background-image: url(../images/index_tsubo_rank4.gif); }
div.leftCont div.abesec div.tsuboBox ul.tsuboCont li.rank5 { background-image: url(../images/index_tsubo_rank5.gif); padding-bottom: 5px;}
div.leftCont div.abesec div.tsuboBox img.tsuboAbe { float: right; margin-top: 5px; }
div.leftCont div.abesec div.tsuboBox ul.tsuboCont li a.itunes { float: right; padding: 7px 0 0 5px; }
div.leftCont div.abesec div.tsuboBox ul.tsuboCont li:first-child a.itunes { float: right; padding: 2px 0 0 5px; }

/* ワクテク講座*/
div.leftCont div.abesec div.wktkWrap { margin-top: 13px; }
div.leftCont div.abesec div.wktkWrap div.wktkCont { float: left; width: 620px; }
div.leftCont div.abesec div.wktkWrap div.wktkBox { margin-top: 8px; padding: 15px 10px 0; }
div.leftCont div.abesec div.wktkWrap div.wktkBox div.wktkBoxIn { padding: 0 5px 15px; }
div.leftCont div.abesec div.wktkWrap div.wktkBox div.wktkBoxIn div.wktkTxt { float: left; width: 360px; }
div.leftCont div.abesec div.wktkWrap div.wktkBox div.wktkBoxIn div.wktkNews { float: right; width: 200px; border: dashed 1px red; text-align: center; padding: 30px 0; }
div.leftCont div.abesec div.wktkWrap p.drwktk { float: right; width: 120px; }

/* ワクテク講座*/
div.leftCont div.abesec ul.bnrs { margin-top: 20px; }
div.leftCont div.abesec ul.bnrs li { float: left; margin-right: 20px; margin-bottom: 20px; line-height: 1; font-size: 0; }
div.leftCont div.abesec ul.bnrs li:nth-child(2n) { margin-right: 0; }
div.leftCont div.abesec ul.bnrs li img { border: solid 1px #ccc; }
div.leftCont div.abesec ul.bnrs li img:hover { border: solid 1px red; }

/* 右カラム */
div.rightCont { float: right; width: 190px; }

div.rightCont div.rightSection { margin-top: 15px; }
div.rightCont div.rightSectionTop { margin-top: 30px; }

div.rightCont div.rightBoxCont { text-align: center; }
div.rightCont div.rightBoxCont div.goodspic { margin-top: 10px; padding: 0 10px; width: 168px; height: 89px; text-align: left; }
div.rightCont div.rightBoxCont img.symbol { margin: 12px 0; }





div.rightSection div.twtArea { border: solid 1px #ccc; }
div.rightSection div.twtArea a.twtAbe02 { background: red url(../images/twticon.png) 5px center no-repeat; color: white; text-decoration: none; font-size: 80%; padding: 3px 8px 1px 20px; border-radius: 4px; display: inline-block; min-height: 17px; }
div.rightSection div.twtArea a.twtAbe02:hover { background-color: #dd0000; }
div.rightSection div.twtArea p.btnFrame { border-top: solid 1px #ccc; padding: 5px 0; text-align: center; }



.rightSection .lineatArea { border: solid 1px #ccc; padding: 10px 10px 8px; }
.rightSection .lineatArea p.tit { line-height: 1; text-align: center; }
.rightSection .lineatArea p.tit span.mainTit { font-size: 200%; font-weight: 700; }
.rightSection .lineatArea p.tit span.subTit { display: block; margin-top:5px; letter-spacing: 0.2em; }
.rightSection .lineatArea dl.lineatAcnt { margin-top: 15px; line-height: 1; }
.rightSection .lineatArea dl.lineatAcnt dt { background-color: black; color: white; text-align: center; padding: 3px; width: 7em; border-radius: 20px; margin-top: 5px; }
.rightSection .lineatArea dl.lineatAcnt dd { margin-top: -1em; padding-left: 7.5em; }
.rightSection .lineatArea p.lineatAddBtn { margin-top: 15px; text-align: center; }





div.rightCont img.boxTop { margin-bottom: 8px; }
div.rightCont img.boxBtm { margin-top: 8px; }

div.rightCont div.rightSection img.rightTit { margin-top: 8px; }
div.rightCont div.rightLinkBox { margin-top: 8px; line-height: 1.5; }
div.rightCont div.rightLinkBox ul li { margin: 4px 10px 0; }
div.rightCont div.rightLinkBox ul li.border { padding-bottom: 5px; border-bottom: dashed 1px #ccc; }
div.rightCont div.rightLinkBox ul li a { padding: 2px 5px; display: block; width: 155px; background: url(../images/index_icon_arrow.gif) 100% no-repeat;  }
div.rightCont div.rightLinkBox ul li a:link, div.rightCont div.rightLinkBox ul li a:visited { background-color: white; }
div.rightCont div.rightLinkBox ul li a:active, div.rightCont div.rightLinkBox ul li a:hover { background-color: #f2f2f2; }
div.rightCont img.rightLinkBoxBtm { margin-top: 6px; }

div.rightCont div.rightLinkBox ul li.new { padding-left: 30px; background: url(../images/index_icon_new.png) left center no-repeat; }
div.rightCont div.rightLinkBox ul li.new a { width: 125px; }
div.rightCont div.rightLinkBox ul li.new a:link, div.rightCont div.rightLinkBox ul li.new a:visited { background-color: transparent; }
div.rightCont div.rightLinkBox ul li.new a:active, div.rightCont div.rightLinkBox ul li.new a:hover { background-color: #f2f2f2; }



/* ツイート */
div.tweetBoxOut { background: url(../images/index_bg_gray.gif) 0 0; padding: 0 4px 4px; }
div.tweetBoxIn { background: white; padding: 0 0px; }
.tweet {
	display: block;
	clear: both;
	padding: 0;
	margin-top: 5px;
	overflow: hidden;
}
.tweet p.text {
	line-height: 1.25; 
}
.tweet p.date {
	color: #999;
	margin-top: 2px;
	padding-bottom: 5px;
	border-bottom: solid 1px #ccc;
}
.monitter {
	height: 360px;
	overflow:hidden;
}



/* 共通パーツ ============================== */
/* ベルト */
div.beltB { background: url(../images/index_bg_black.gif) 0 0; height: 6px; line-height: 0; font-size: 0; }
div.beltR { background: url(../images/index_bg_red.gif) 0 0; height: 6px; line-height: 0; font-size: 0; }
div.beltG { background: url(../images/index_bg_gray.gif) 0 0; height: 6px; line-height: 0; font-size: 0; }


/* メインカラム　ボックス設定 */
div.boxline { border: solid 1px #ccc; }
div.boxNew { background: url(../images/index_new.gif) right top no-repeat; }
div.boxline div.boxhead { line-height: 1.25; }
div.boxline div.boxhead div.headSubtit { float: left; color: white; }
div.boxline div.boxhead div.headSubtit p { padding: 4px 5px 2px; }
div.boxline div.boxhead div.headSubtit p.redbg { background-color: red; }
div.boxline div.boxhead div.headSubtit p.blkbg { background-color: black; }
div.boxline div.boxhead div.headUpdate { float: right; padding: 10px 10px 0 0; color: #999; }
div.boxline div.boxCont { padding: 10px; }

div.boxline div.boxLink { margin: 0 10px; padding: 5px 0; border-top: dashed 1px #ccc; text-align: right; }
div.boxline div.boxBtn { margin: 0 10px; padding: 10px 0 15px; border-top: dashed 1px #ccc; text-align: center; }
div.boxline div.boxBtn img { padding: 0 10px; }

div.boxdotlineRedOut { background: url(../images/index_bg_red.gif) 0 0; padding: 1px; }
div.boxdotlineRedIn { background-color: white; }


/* 右カラム　ボックス設定 */
div.rightBox { background: url(../images/index_right_box_bg.gif) left top repeat-y; }
div.rightBox div.rightBoxLink { margin: 0 10px; padding: 5px 0 0; border-top: dashed 1px #ccc; text-align: right; }



/* リンク集 */
.linkssec { border-top: dashed 1px #ccc; }
ul.links li { margin: 8px 1% 0; float: left; width: 48%; padding-bottom: 5px; border-bottom: dashed 1px #ccc; }
ul.links li a { padding: 2px 24px 2px 5px; display: inline-block; background: url(../images/index_icon_arrow.gif) 98% no-repeat;  }
ul.links li a:link, ul.links li a:visited { background-color: white; }
ul.links li a:active, ul.links li a:hover { background-color: #f2f2f2; }







/* フッタ ============================== */
div.footLogos { margin-top: 50px; text-align: center; padding-bottom: 30px; }
div.footLogos img { padding: 0 25px; }
div.topCopy { margin: 8px auto 3px; color: white; text-align: center; min-width: 1012px; }





