@charset "utf-8";
/*
 * Support head css
 * Date: 2010.04.21
 * Author: Creative Team
 */

#head .page_ttl{
	text-align:left;
	float:left;
	margin:4px auto auto 22px;
}

/**

#contents .page_ttl{
	display: none;
}

**/

/* top logo
----------------------------------- */
#top #head #logo h1 {
	color:#808080;
	line-height:20px;
}

#top #head #logo {	background: none;}

#contents #flashArea{
	height:200px;
	width:576px;
	margin-bottom: 5px;
}

#contents #mainArea{
	padding: 4px;
	border: solid #999 3px;
_width: 575px;
_overflow: hidden;
}
#contents #mainArea .ttl{
	position: relative;
	_width: 562px;
	padding-left: 15px;
	line-height: 18px;
	color: #fff;
	font-weight: bold;
	background: url(/common/images/ttl_bg01.gif) #2e2e2e no-repeat 0px center;
}
#contents #mainArea .ttl a{
	display: block;
	position: absolute;
	top:0px;
	right: 0px;
	height: 18px;
	padding-left: 15px;
	padding-right: 15px;
	font-weight: normal;
	background: url(/common/images/rss_bg_bk.gif) no-repeat 0px center;
	color: #fff;
}
#contents #mainArea .specialArticle ul{
padding: 10px 0px 0px;
}
#contents #mainArea .specialArticle li{
	_width: 562px;
	margin-bottom: 10px;
	padding: 3px 5px;
	behavior:url("/common/css/csshover.htc");
	cursor: pointer;
}
#contents #mainArea .specialArticle li:hover{
	background: #fff4c9;
}

#contents #mainArea .specialArticle li a{
	_width: 552px;
	display: block;
	padding-top: 25px;
	margin-top: -25px;
	color: #000;
}
#contents #mainArea .specialArticle li a:hover{
	text-decoration: none;
}
#contents #mainArea .specialArticle li .sub_ttl{
	padding-left: 35px;
	background: url(/common/images/bullet05.gif) no-repeat 0px 0px;
	line-height: 25px;
	font-weight: bold;
	font-size: 14px;
	color: #9c4600;
}

#contents #mainArea .specialArticle li span{
	display: block;
	margin-left: 90px;
}
#contents #mainArea .specialArticle li span.art_ttl{
	line-height: 23px;
	font-weight: bold;
	font-size: 20px;
	color: #000;
}
#contents #mainArea .specialArticle li span.name{
	line-height: 18px;
	font-weight: bold;
	color: #999;
}
#contents #mainArea .specialArticle li span.text{
}
#contents #mainArea .specialArticle li img{
	float: left;
}

#contents #mainArea .latestArticle ul{
padding: 10px 10px 0px;
}
#contents #mainArea .latestArticle li{
	line-height: 12px;
	margin-bottom: 5px;
}

#contents #mainArea .latestArticle .ranking,
#contents #mainArea .latestArticle .column,
#contents #mainArea .latestArticle .news,
#contents #mainArea .latestArticle .interview,
#contents #mainArea .latestArticle .knowhow,
#contents #mainArea .latestArticle .shopfaq,
#contents #mainArea .latestArticle .useful{
	float: left;
	display: block;
	margin-right: 10px;
	line-height: 12px;
	font-size: 10px;
	width: 80px;
	text-align: center;
	color: #fff;
}
#contents #mainArea .latestArticle .ranking{background: #b50000;}
#contents #mainArea .latestArticle .column{background: #b100d1;}
#contents #mainArea .latestArticle .news{background: #1642b3;}
#contents #mainArea .latestArticle .interview{background: #349200;}
#contents #mainArea .latestArticle .knowhow{background: #e57c00;}
#contents #mainArea .latestArticle .shopfaq{background: #00aeb9;}
#contents #mainArea .latestArticle .useful{background: #5E6382;}


#contents #mainArea .latestArticle li a{
	display: block;
	float: right;
	margin-right: 5px;
	line-height: 16px;
	width: 445px;
}
#contents #mainArea a.btn{
	display: block;
	margin-left: auto;
	_margin-left: 482px;
	margin-right: 10px;
	margin-bottom: 7px;
	height: 15px;
	width: 70px;
	background: url(/common/images/btn_more.gif) no-repeat 0px 0px;
	text-indent: -9999px;
}
#contents #mainArea a:hover.btn{
	background: url(/common/images/btn_more_ov.gif) no-repeat 0px 0px;
}

#contents #knohowArea,
#contents #templateArea{
	overflow: hidden;
	_width: 575px;
	padding-top: 15px;
	padding-left: 17px;
	background: url(/common/images/ttl_bg02.gif) no-repeat 0px 22px;
}
#contents #knohowArea{
	margin-top: 10px;
}
#contents #knohowArea .ttl,
#contents #templateArea .ttl{
	float: left;
	padding: 0px 5px;
	background: #fff;
	line-height: 20px;
	border-bottom: solid 1px #000;
	border-top: solid 1px #000;
	font-weight: bold;
}

#contents #knohowArea ul{
	margin-right: -4px;
	padding-top: 10px;
	width: 568px;
	clear: both;

}

#contents #knohowArea ul li{
	float: left;
	width: 284px;
	margin-bottom: 10px;
}

#contents #knohowArea ul li .sub_ttl01,
#contents #knohowArea ul li .sub_ttl02,
#contents #knohowArea ul li .sub_ttl03,
#contents #knohowArea ul li .sub_ttl04{
	height: 38px;
	padding-top: 10px;
	padding-left: 87px;
	background: url(/images/knowhow_bg01.gif) no-repeat 0px 0px;
	font-weight: bold;
	font-size: 14px;
	line-height: 18px;
}

#contents #knohowArea ul li .sub_ttl01{
	background: url(/images/knowhow_bg01.gif) no-repeat 0px 0px;
}
#contents #knohowArea ul li .sub_ttl02{
	background: url(/images/knowhow_bg02.gif) no-repeat 0px 0px;
}
#contents #knohowArea ul li .sub_ttl03{
	background: url(/images/knowhow_bg03.gif) no-repeat 0px 0px;
}
#contents #knohowArea ul li .sub_ttl04{
	background: url(/images/knowhow_bg04.gif) no-repeat 0px 0px;
}

#contents #knohowArea ul li ul{
	width: 275px;
	background: url(/common/images/itm_bg01.gif) repeat-y 0px 0px;
}
#contents #knohowArea ul li li{
	clear: both;
	width: 254px;
	_width: 274px;
	padding: 0px 0px 0px 20px;
	margin-bottom: 5px;
	background: url(/common/images/bullet01.gif) no-repeat 6px 2px;
}

#contents #templateArea ul{
	margin-left: -6px;
	width: 568px;
	padding-top: 10px;
	clear:both;
}
#contents #templateArea ul li{
	float: left;
	width: 113px;
	height: 137px;
	padding-bottom: 10px;
}
#contents #templateArea ul li a{
	background: url(/images/template_bg01.gif) no-repeat 0px 0px;
	display: block;
	margin-left: 6px;
	padding-top: 7px;
	text-align: center;
	height: 130px;
	font-weight: bold;
}
#contents #templateArea ul li.tmp01 a{
	background: url(/images/template_bg01.gif) #005fa3 no-repeat 0px 0px;
}
#contents #templateArea ul li.tmp02 a{
	background: url(/images/template_bg02.gif) #005fa3 no-repeat 0px 0px;
}
#contents #templateArea ul li.tmp03 a{
	background: url(/images/template_bg03.gif) #005fa3 no-repeat 0px 0px;
}
#contents #templateArea ul li.tmp04 a{
	background: url(/images/template_bg04.gif) #005fa3 no-repeat 0px 0px;
}
#contents #templateArea ul li.tmp05 a{
	background: url(/images/template_bg05.gif) #005fa3 no-repeat 0px 0px;
}
#contents #templateArea ul li.tmp01 a:visited{
	background: url(/images/template_bg01.gif) #b8007e no-repeat 0px 0px;
}
#contents #templateArea ul li.tmp02 a:visited{
	background: url(/images/template_bg02.gif) #b8007e no-repeat 0px 0px;
}
#contents #templateArea ul li.tmp03 a:visited{
	background: url(/images/template_bg03.gif) #b8007e no-repeat 0px 0px;
}
#contents #templateArea ul li.tmp04 a:visited{
	background: url(/images/template_bg04.gif) #b8007e no-repeat 0px 0px;
}
#contents #templateArea ul li.tmp05 a:visited{
	background: url(/images/template_bg05.gif) #b8007e no-repeat 0px 0px;
}

#contents #templateArea ul li.tmp01 a:active,
#contents #templateArea ul li.tmp01 a:hover{
	background: url(/images/template_bg01.gif) #ff0066 no-repeat 0px 0px;
}
#contents #templateArea ul li.tmp02 a:active,
#contents #templateArea ul li.tmp02 a:hover{
	background: url(/images/template_bg02.gif) #ff0066 no-repeat 0px 0px;
}
#contents #templateArea ul li.tmp03 a:active,
#contents #templateArea ul li.tmp03 a:hover{
	background: url(/images/template_bg03.gif) #ff0066 no-repeat 0px 0px;
}
#contents #templateArea ul li.tmp04 a:active,
#contents #templateArea ul li.tmp04 a:hover{
	background: url(/images/template_bg04.gif) #ff0066 no-repeat 0px 0px;
}
#contents #templateArea ul li.tmp05 a:active,
#contents #templateArea ul li.tmp05 a:hover{
	background: url(/images/template_bg05.gif) #ff0066 no-repeat 0px 0px;
}

#contents #knohowArea a.btn,
#contents #templateArea a.btn{
	display: block;
	margin-left: auto;
	_margin-left: 488px;
	margin-right: 0px;
	margin-bottom: 7px;
	height: 15px;
	width: 70px;
	background: url(/common/images/btn_more.gif) no-repeat 0px 0px;
	text-indent: -9999px;
}
#contents #knohowArea a:hover.btn,
#contents #templateArea a:hover.btn{
	background: url(/common/images/btn_more_ov.gif) no-repeat 0px 0px;
}

#contents #twitterArea{
	margin-top: 20px;
	padding: 1px;
	border: solid 3px #e8eef0;
	background: #999;
	
}
#contents #twitterArea  #twitterInner{
	position: relative;
	border: solid 1px #fff;
	background: #ffb400;
}
#contents #twitterArea  #twitterInner .twitter_ttl{
	padding: 15px 5px 5px;
	background: #ffb400;
	color: #fff;
	line-height: 16px;
	font-size: 14px;
	height: 45px;
}
#contents #twitterArea  #twitterInner .twitter_ttl a{
	color: #fff;
}
#contents #twitterArea  #twitterInner .twitter_ttl img{
	margin-top: -10px;
	margin-left: 5px;
	float: left;
}

#contents #twitterArea  #twitterInner .tweets{
	background: #fff;
	border: solid 1px #ffb400;
	overflow: hidden;
}
#contents #twitterArea  #twitterInner .tweet{
	margin-top: -1px;
	padding: 10px;
	background: url(/common/images/line_dotted01.gif) repeat-x top;
}
#contents #twitterArea  #twitterInner .twitter_foot{
	position: relative;
	padding: 10px;
}
#contents #twitterArea  #twitterInner .twitter_foot span{
	position: absolute;
	top: 10px;
	right: 10px;
}


#contents #twitterArea  #twitterInner .twtr-ft{
/*
	width: 566px;
	position: absolute;
	top: 0px;
	left: 0px;
*/
}

#contents #fasebookArea{
	margin-top:15px;
	}


#contents #knohowArea li.divider{
clear: both;
	margin-bottom: 1px;
	width: 500px;
}

div.pickup{
	width:997px;
	height:25px;
	margin-top:4px;
	padding-right:3px;
	background:url(/images/pickup_bg01.gif) no-repeat left top;
	}

div.pickup p{
	float:left;
	width:auto;
	padding:0 0 0 25px;
	line-height:25px;
	font-weight:bold;
	}

div.pickup ul{
	float:right;
	width:844px;
	height:19px;
	margin:3px 0;
	padding-left:16px;
	background:#fff;
	}

div.pickup ul li{
	display:inline;
	margin-right:15px;
	padding-right:15px;
	line-height:20px;
	border-right:1px solid #c5c5c5;
	}

div.pickup ul li.last{
	margin-right:0;
	padding-right:0;
	border:none;
	}

div.pickup ul li a{
	padding-left:13px;
	background: url(/common/images/bullet01.gif) no-repeat  0 1px ;
	}

#contents #mainArea .specialArticle li:after,
#contents #templateArea ul:after,
#contents #knohowArea ul:after,
#contents #mainArea .latestArticle li:after,
#contents #mainArea:after,
#contents #knohowArea:after,
#contents #templateArea:after,
#contents #twitterArea:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
}
* html #contents #mainArea .specialArticle li,
* html #contents #templateArea ul,
* html #contents #knohowArea ul,
* html #contents #mainArea .latestArticle li,
* html #contents #mainArea,
* html #contents #knohowArea,
* html #contents #templateArea,
* html #contents #twitterArea {
zoom: 1; } /* IE6 */

*:first-child+html #contents #mainArea .specialArticle li,
*:first-child+html #contents #templateArea ul,
*:first-child+html #contents #knohowArea ul,
*:first-child+html #contents #mainArea .latestArticle li,
*:first-child+html #contents #mainArea,
*:first-child+html #contents #knohowArea,
*:first-child+html #contents #templateArea,
*:first-child+html #contents #twitterArea {
zoom: 1; } /* IE7 */


#foot #copyright{
	padding-bottom: 10px;
}