BODY {
	margin:0;
	padding:0;
	text-align:center;
	background-color: #ecebe9;
	color:#ffffff;
	overflow-x:hidden;
	font-family:'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
}

A:link {
	color: #ffffff;
	font-weight: 500;
	text-decoration: none;
}
A:visited {
	color: #66ccff;
}
A:hover {
	color: #66ccff;
	text-decoration: underline;
}
A:active {
	color: #66ccff;
}

/*--------------------------------------
  ULのデフォルト
--------------------------------------*/
ul {
	list-style-type:none;
	margin:0;
	padding:0;
}

/*--------------------------------------
  ヘッダー
--------------------------------------*/
header {
	margin:0 auto;
	padding:0;
	width:100%;
	max-width:600px;
	text-align:center;
	background:#0e532e;
	border: 4px #d5923c solid;
	border-bottom: 0;
	box-sizing:border-box;
}
.header{
	margin:0 auto;
	padding:0;
	
}
.header img{
	margin-top:6px;
	height:40px;
	
}

/*--------------------------------------
  メイン
--------------------------------------*/
#main {
	margin:0 auto;
	padding:0;
	padding-bottom:30px;
	width:100%;
	max-width:600px;
	text-align:center;
	line-height:200%;
	background:#0e532e;
	border-left: 4px #d5923c solid;
	border-right: 4px #d5923c solid;
	box-sizing:border-box;
}
#main h2{
	width:96%;
	margin:0 auto;
	padding:0;
	text-align:left;
	color:#66ccff;
}
#main h2 img{
	vertical-align:-4px;
	height:25px;
}

#main p{
	width:90%;
	margin:0 auto;
	margin-top:6px;
	margin-bottom:6px;
	padding:0;
	font-size:20px;
	text-align:left;
}

/*--------------------------------------
  リストページ
--------------------------------------*/
#list {
	border: 2px #66ccff solid;
	border-right: none;
	border-bottom: none;
	font-size:18px;
	margin:0 auto;
	width:90%;
}
#list li{
	border-bottom: 2px #66ccff solid;
	border-right: 2px #66ccff solid;
	float:left;
	width:16.6666%;
	width:-webkit-calc(100% / 6);
	width:calc(100% / 6);
	height:36px;
	box-sizing:border-box;
}
/*--------------------------------------
  グローバルリンク カレンダー
--------------------------------------*/
#global_link ,#back_number {
	position: absolute;
   	right:5px;
	color:#333333;
	margin:0 auto;
	padding:0;
	width:100%;
	max-width:320px;
	text-align:center;
	line-height:200%;
	background:#ffffff;
	-webkit-box-shadow: 0 10px 6px -6px #777;
	-moz-box-shadow: 0 10px 6px -6px #777;
	box-shadow: 0 10px 6px -6px #777;
}
#global_link{
   	top: 10px;
}
#back_number{
   	top: 210px;
}

#global_link h2 ,#back_number h2{
	font-size:20px;
	margin:0 auto;
	position: relative;
}
#global_link img , #back_number img{
	height:16px;
	position: absolute;
}
#global_link img.left , #back_number img.left{
	left:5px;
}
#global_link img.right , #back_number img.right{
	right:5px;
}
#global_link table , #back_number table {
	border: 3px #666666 solid;
	border-collapse: collapse;
	font-size:18px;
	margin:0 auto;
	width:100%;
	color:#333333;
}
#global_link tr,td {
	border: 2px #666666 solid;
}
#global_link tr td a{
	color: #1e90ff;
}

/*--------------------------------------
 カレンダー
--------------------------------------*/
#back_number th {
	background:#cccccc;
}
#back_number tr{
	height:30px;
}
#back_number td a{
	display:block;
	color:#333333;
	text-decoration: none;
}
#back_number td:hover {
	background:#ffcccc;
}
.now{
	background-image: url("https://www.nazo2.red/img/banner/day.png");
	background-repeat:no-repeat;
	background-position: center center; 
}
/*--------------------------------------
  答えを見る
--------------------------------------*/
.answer_button img{
	height:25px;
}

/*--------------------------------------
  答え
--------------------------------------*/
.answer_list{
	width:80%;
	margin：0 auto;
	font-size:20px;
	text-align:left;
}
.answer_list li{
	height:30px;
}

.answer_list .answer{
	font-size:24px;
	color:#ff99cc;
	font-weight:bolder;
}
/*--------------------------------------
  次の問題 前の問題
--------------------------------------*/
.board_list {
	width:96%;
	height:25px;
	margin:0 auto;
	margin-top:4px;
}
.board_list li{
	width:33%;
	height:25px;
	float:left;
}
.board_list img{
	height:25px;
}
/*--------------------------------------
  シェアボタン
--------------------------------------*/
.share{
	position: relative;
}
.share_button{
	position: absolute;
   	left: 42%;
   	bottom: 29%;
}
.share_button img{
	width:40px;
	height:40px;
}
/*--------------------------------------
  黒板の下の画像
--------------------------------------*/
.under{
	width:100%;
	max-width:600px;
	margin:0;
	padding:0;
	border-left: 4px #d5923c solid;
	border-right: 4px #d5923c solid;
	box-sizing:border-box;
	-webkit-box-shadow: 0 10px 6px -6px #777;
	-moz-box-shadow: 0 10px 6px -6px #777;
	box-shadow: 0 10px 6px -6px #777;
}

.pink{
	color:#FF6699

}
.skyblue{
	color:#6699FF
}
/*--------------------------------------
  フッター
--------------------------------------*/
footer{	
	position: fixed;
	width:100%;
	left:0;
  	bottom: 0;
	text-align:left;
	text-shadow:	2px  2px 5px #38332f,
			-2px  2px 5px #38332f,
			 2px -2px 5px #38332f,
			-2px -2px 5px #38332f;

}
footer img{	
	filter:alpha(opacity=70);
	-moz-opacity: 0.7;
	opacity: 0.7;
}
footer img:hover{	
	filter:alpha(opacity=100);
	-moz-opacity: 1.0;
	opacity: 1.0;
}

/*--------------------------------------
  広告
--------------------------------------*/
.article_under_ad {
	position: absolute;
   	left:5px;
   	top: 10px;
	margin:0 auto;
	padding:0;
	width:100%;
	height:600px;
	max-width:320px;
	text-align:center;
	font-size:14px;
	color:#666666
}

/*--------------------------------------
  1240以下のスクリーン
--------------------------------------*/
@media screen and (max-width: 1240px){

header, #main, .under{
	width:480px;
}
}
/*--------------------------------------
  1120以下のスクリーン
--------------------------------------*/
@media screen and (max-width: 1120px){

#global_link, #back_number{
	max-width:250px;
}
.article_under_ad{
	max-width:250px;
}
footer{
	text-align:right;
}
}

/*--------------------------------------
  960以下のスクリーン
--------------------------------------*/
@media screen and (max-width: 960px){

header, #main, .under{
	width:100%;
}

#global_link, #back_number, .article_under_ad, footer{
	position:static;
}
.article_under_ad{
	max-width:728px;
	height:90px;
}
#global_link, #back_number{
	margin:10px 5%;
	max-width:40%;
	float: left;
}

}


/*--------------------------------------
  640以下のスクリーン
--------------------------------------*/
@media screen and (max-width: 640px){

.article_under_ad{
	margin-top:10px;
	max-width:100%;
	height:initial;
}
#global_link, #back_number{
	margin:14px 0;
	max-width:100%;
	float: none;
}
footer{
	text-align:center;
	dont-size:14px;
}
footer img{	
	filter:alpha(opacity=100);
	-moz-opacity: 1.0;
	opacity: 1.0;
}

.share_button{
   	left: 28%;
	bottom: 28%;
}
}

@media screen and (min-width: 640px){

body{
	background-image: url("https://www.nazo2.red/img/banner/background.png");
  	background-position: center center;
	background-repeat: no-repeat;
   	background-attachment: fixed;
	background-size: cover;
}
}