@charset "utf-8";

/*
Copyright (c) 2009, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 2.7.0
*/
html{color:#000;background:#FFF;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var,optgroup{font-style:inherit;font-weight:inherit;}del,ins{text-decoration:none;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}sup{vertical-align:baseline;}sub{vertical-align:baseline;}legend{color:#000;}input,button,textarea,select,optgroup,option{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;}input,button,textarea,select{*font-size:100%;}body{font:13px/1.231 arial,helvetica,clean,sans-serif;*font-size:small;*font:x-small;}select,input,button,textarea,button{font:99% arial,helvetica,clean,sans-serif;}table{font-size:inherit;font:100%;}pre,code,kbd,samp,tt{font-family:monospace;*font-size:108%;line-height:100%;}




/* ==========================
	global
========================== */
html {
	color: #333;
	background: #f2f7e5 url(images/bg01.png);
}

body {
	line-height: 1.4;
}

h1 {
	line-height: 0;
}

input {
	width: 18em;
	margin: 5px 5px 5px 0;
	padding: 3px;
	vertical-align: middle;
}

strong { font-weight: bold; }

a { color: #668821; text-decoration: underline; outline:none; }
a:hover { text-decoration: none; }

label { cursor: pointer; }

.clearfix:after {
	height: 0;
	visibility: hidden;
	content: ".";
	display: block;
	clear: both;
}
.clearfix { display: inline-block; }


.caption {
	color: #666;
	font-size: 85%;
}


p.btn a,
p.btn span {
	background: #ff84a7;
	text-align: center;
	padding: 5px 0;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	color: #fff;
	text-shadow: -1px -1px #eb7a9a;
	display: block;
	margin: 10px 5px 5px;
	text-decoration: none;
}

p.btn span { background: #ccc; }

p.btn a:hover {
	background: #f67096;
	text-shadow: -1px -1px #de6e8d;
}




/* --------------------
	header
-------------------- */
#header {
	margin: 40px 0 0;
	position: relative;
}

#header ul {
	position: absolute;
	top: 25px;
	right: 0;
}

#header ul li {
	width: 105px;
	float: left;
}

#header ul li a {
	margin-left: 7px;
	padding: 5px 0;
	background: #78c55e;
	text-decoration: none;
	color: #fff;
	display: block;
	text-shadow: -1px -1px #6cb154;
	text-align: center;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	_zoom: 1;
}

#header ul li a:hover,
#header ul li a.active {
	background: #5dab42;
	text-shadow: -1px -1px #549a3b;
}



/* ==========================
	local
========================== */

/* --- home --- */
#container {
	width: 750px;
	margin: 0 auto;
	position: relative;
}

/* lead text */
#lead {
	font-size: 123.1%;
}

#example {
	font-size: 93%;
	color: #999;
	margin-top: 1em;
}


/* 質問リスト */
#questionList div {
	margin-top: 3em;
	display: none;
}


#questionList p {
	font-size: 90%;
	line-height: 1.4;
}


/* ナゼナゼくんブロック */
#nazenaze-block{
	width: 230px;
	margin: 50px auto 30px;
}

#nazenaze-kun {
	position: relative;
	margin: 10px auto 0;
	width: 200px;
	height: 125px;
}

#nazenaze-kun li {
	position: absolute;
	top: 0;
	left: 0;
	list-style: none;
}

#nazenaze-voice {
	text-align: center;
	width: 230px;
	font-size: 11px;
	line-height: 1.3;
	height: 1em;
}
*+html #nazenaze-voice { font-size: 9px; }
* html #nazenaze-voice { font-size: 9px; }
html>/**/body #nazenaze-voice { font-size /*\**/: 9px\9; }

#naze2, #naze3, #naze4 { display: none; }


/* Twitter投稿ボタン */
.btn-base {
	text-align: center;
	margin: 10px auto 0;
	width: 200px;
	position: relative;
}

.btn-base a {
	display: block;
	padding: 10px;
	font-weight: bold;
	text-decoration: none;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-box-shadow: 2px 2px 2px #d9d9d9;
	-webkit-box-shadow: 2px 2px 2px #d9d9d9;
}

.btn-green a {
	background: #669900 url(images/btn_bg.png) top left repeat-x;
	border: 1px solid #679a01;
	color: #fafafa;
	text-shadow: #6ca003 -1px -1px;
}

.btn-green a:hover { background: #6ca003; }


/* 青ボタン */
.btn-blue {
	width: 235px;
	margin: 50px auto 0 !important;
	position: relative;
	right: 12px;
}

.btn-blue a {
	background: #90d1f2;
	font-weight: normal;
	color: #fff;
	text-shadow: #81bcd9 -1px -1px;
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
}

.btn-blue a:hover {
	background: #7abddf;
	text-shadow: -1px -1px #6eaac8;
}

.btn-blue a img {
	position: absolute;
	top: -35px;
	right: -38px;
}


#send-twitter { display: none; }



/* 降参するチェックボックス */
#giveup {
	margin-top: 3px;
	text-align: center;
	font-size: 85%;
	color: #888;
	display: none;
}

#giveup:hover {
	color: #333;
}

#giveup input {
	width: auto;
}



/* この問いのURL */
#this-question-url {
	font-size: 11px;
	color: #999;
}
*+html #this-question-url { font-size: 10px; }
* html #this-question-url { font-size: 10px; }
html>/**/body #this-question-url { font-size /*\**/: 10px\9; }

#this-question-url input {
	border: none;
	margin: 0;
	padding: 0;
	color: #999;
}
*+html #this-question-url input { position: relative; top: -1px; }
* html #this-question-url input { position: relative; top: -1px; }


/* 胸に秘めておく機能 */
#in-my-mind {
	display: none;
	margin-bottom: 5px;
}

#in-my-mind textarea {
	width: 440px;
	display: none;
	margin-top: 3px;
}

#in-my-mind a {
	color: #999;
	font-size: 11px;
	margin-bottom: 10px;
	padding-left: 11px;
	background: url(images/ico_heart.png) left 3px no-repeat;
	text-decoration: none;
}
*+html #in-my-mind a { font-size: 9px; background-position-y: 1px; }
* html #in-my-mind a { font-size: 9px; background-position-y: 1px; }
html>/**/body #in-my-mind a { font-size /*\**/: 9px\9; background-position-y: 1px\9; }

#in-my-mind a:hover { text-decoration: underline; }


/* other */
#txt0 {
	width: 400px;
	margin-top: 2em;
	padding: 8px;
	border: 3px solid #79c162;
	background: #fcfff6;
	font-weight: bold;
	color: #666;
	font-size: 90%;
}

#maincontents {
	-moz-border-radius: 20px;
	-webkit-border-radius: 20px;
	border-right: 1px solid #e1e8cf;
	border-bottom: 1px solid #e1e8cf;
	background: #fff;
	padding: 30px;
	width: 455px;
	position: relative;
}




/* ----------------------
	main-contents
---------------------- */
#maincontents .section {
	font-size: 123.1%;
	position: relative;
}

#maincontents .section p {
	margin: 0 15px 1em;
}

#maincontents h2 {
	background: #f9f9f9;
	margin-bottom: 1em;
	padding: 10px 15px;
	color: #666;
	font-weight: bold;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-box-shadow: 1px 1px 0px #e8e8e8;
	-webkit-box-shadow: 1px 1px 0px #e8e8e8;
}



/* =======================
	download
======================= */
#wallpaper .thumb {
	position: absolute;
	left: 0;
	_left: -15px;
}

#wallpaper ul {
	margin: 30px 0 0 240px;
	height: 200px;
	font-size: 77%;
}
* #wallpaper ul { padding-top: 10px; }
*+#wallpaper ul { padding-top: 10px; }

#wallpaper ul li {
	width: 80px;
	float: left;
	margin-bottom: 20px;
	padding-left: 8px;
	background: url(images/ico_arrow_pink.png) left center no-repeat;
}



/* ----------------------
	sidebar
---------------------- */

#sidebar {
	position: absolute;
	top: 80px;
	right: 0;
	width: 220px;
	padding-bottom: 50px;
}

* html #sidebar { top: 120px; }
*+html #sidebar { top: 120px; }


.box {
	margin-bottom: 15px;
	padding-left: 10px;
	color: #888;
}

.fukidashi {
	background: url(images/fukidashi.png) 0 20px no-repeat;
}

.box .wrapper {
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	border-right: 1px solid #e1e8cf;
	border-bottom: 1px solid #e1e8cf;
	background: #fff;
	padding: 13px 14px;
}


/* words box */
#words {
	font-style: italic;
	font-family: Georgia,Garamond,"Times New Roman","Hiragino Mincho Pro","ヒラギノ明朝 Pro W3","ＭＳ Ｐ明朝",serif;
	letter-spacing: -1px;
}

#words blockquote {
	font-size: 108%;
}

#words blockquote span { font-size: 77%; }

#words .title {
	text-align: right;
	font-size: 116%;
}

#words .author {
	text-align: right;
	font-size: 93%;
	margin-top: 3px;
	display: none;
}

#words a {
	color: #888;
}


/* goods box */
#goods h2 {
	text-align: center;
	margin: 0;
}

#goods p.goodsimage {
	text-align: center;
}

#goods p.text {
	font-size: 85%;
	margin: 0 5px;
}




/* seisakusho box */
#seisakusho .wrapper {
	background: #fafafa;
	font-size: 85%;
}

#seisakusho .illust {
	background: url(images/img_illust.png) right bottom no-repeat;
	padding: 20px 60px 10px 0;
}


/* twitter-widget */
#twitter-widget {
	margin: 0 0 15px 10px;
}



/* ===================================
	footer
=================================== */
#footer {
	font-size: 85%;
	margin: 1em 0 4em;
}
*+html #footer address { font-size: 9px; }
* html #footer address { font-size: 9px; }

#footer address { font-style: normal; }

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

#footer a:hover { text-decoration: underline; }


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

/* ===================================
	goods
=================================== */
#goods #maincontents {
	width: auto;
}

#goods .lead {
	position: absolute;
	top: 35px;
	right: 40px;
	font-size: 85%;
}


/* --- tabs --- */
#goods #tabs {
	margin: 0 0 0 10px;
}

#goods #tabs li {
	float: left;
	position: relative;
}

#goods #tabs li a {
	display: block;
	background: #f2f7e5;
	color: #78c55e;
	font-weight: bold;
	padding: 5px 10px;
	margin-left: 10px;
	text-decoration: none;
	-moz-border-radius: 8px 0 0 0;
	-webkit-border-radius: 8px 0 0 0;
}

#goods #tabs li img {
	position: absolute;
	top: -16px;
	right: -8px;
}

#goods #tabs li.active a,
#goods #tabs li a:hover {
	background: #a9dca3;
	color: #fff;
}


/* --- cell --- */
#goods #items {
	clear: left;
	background: #a9dca3;
	padding: 10px 10px 0;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
}

#goods #items ul {
	margin: 0 -10px 0 0;
	overflow: hidden;
	_zoom: 1;
	_margin-right: -20px;
}
*+html #goods #items ul { margin-bottom: 10px; }

#goods #items li {
	background: #fff;
	width: 216px;
	margin: 0 10px 10px 0;
	float: left;
}

#goods #items p { text-align: center; color: #666666; }

#goods #items .price {
	color: #78c55e;
	font-weight: bold;
	text-align:center;
	font-size: 116%;
	margin-top: 5px;
}

#goods #character {
	position: absolute;
	top: 80px;
	right: -40px;
	_right: -39px;
}

#goods #items .btn {
	width: 130px;
	margin: 0 auto 15px;
}

#goods #items .btn a,
#goods #items .btn span {
	-moz-border-radius: 15px;
	-webkit-border-radius: 15px;
	padding: 3px 0;
	text-shadow: none;
}

#goods #nazenaze2gou {
	display: none;
}

* html #goods .caption { margin-top: 20px; }
*+html #goods .caption { margin-top: 20px; }
body:first-of-type #goods .caption { margin-top: 20px; }



/* =============================
	extra
============================= */

/* 上余白 */
.mt0 { margin-top:0 !important; }
.mt10{ margin-top:10px !important; }
.mt20{ margin-top:20px !important; }
.mt30{ margin-top:30px !important; }
.mt40{ margin-top:40px !important; }
.mt50{ margin-top:50px !important; }
.mt60{ margin-top:60px !important; }
.mt70{ margin-top:70px !important; }
.mt80{ margin-top:80px !important; }
.mt90{ margin-top:90px !important; }
.mt100{ margin-top:100px !important; }

/* 下余白 */
.mb0 { margin-bottom:0 !important; }
.mb10{ margin-bottom:10px !important; }
.mb20{ margin-bottom:20px !important; }
.mb30{ margin-bottom:30px !important; }
.mb40{ margin-bottom:40px !important; }
.mb50{ margin-bottom:50px !important; }

/* 左余白 */
.ml0 { margin-left:0 !important; }
.ml10{ margin-left:10px !important; }
.ml20{ margin-left:20px !important; }
.ml30{ margin-left:30px !important; }
.ml40{ margin-left:40px !important; }
.ml50{ margin-left:50px !important; }

/* 右余白 */
.mr0 { margin-right:0 !important;}
.mr10{ margin-right:10px !important; }
.mr20{ margin-right:20px !important; }
.mr30{ margin-right:30px !important; }
.mr40{ margin-right:40px !important; }
.mr50{ margin-right:50px !important; }

/* ボックス幅 */
.w100{ width: 200px !important; }
.w150{ width: 200px !important; }
.w200{ width: 200px !important; }
.w250{ width: 250px !important; }
.w300{ width: 300px !important; }
.w350{ width: 350px !important; }
.w400{ width: 400px !important; }
.w450{ width: 450px !important; }

/* フォントサイズ */
.font-xs { font-size: 77%; }
.font-s  { font-size: 85%; }
.font-m  { font-size: 100%; }