html 						{height: 100%;
							background-image: url("../img/ptn2.jpg")
							}

body						{height: 100%;
							font-family: YuGothic, "Hiragino Kaku Gothic ProN", Meiryo, Verdana, "游ゴシック", sans-serif;
							font-size: 15px;
							color: #333;
							}

body						{height: auto;
							}

strong					{font-weight: bold;}

.top-h1					{font-size: 24px;
							margin-bottom: 10px;
							padding-left: 15px;
							font-weight: normal;
							}
							
.top-h1 i				{margin-right: 10px;
							color: #27AE60;
							text-shadow: 2px 2px 0px #F1C40F;}
							
.std-h2					{margin-bottom: 20px;
							padding-left: 0.8em;
							font-size: 18px;
							font-weight: bold;
							border-left: 5px solid #FB9034;}

.std-h3					{margin-bottom: 1em;
							margin-top: 2em;
							margin-left: 14px;
							font-size: 16px;
							font-weight: bold;
							color: #FB9034;}
							
.std-ul					{margin: 1em 0 1em 1em;}

.std-ol					{margin: 1em 0 1em 1em;
							list-style: decimal;}

.section
							{background-color: rgba(255,255,255,0.6);
							margin-bottom: 40px;
							padding-top: 15px;
							padding-bottom: 25px;
							border-radius: 5px;
							-webkit-border-radius: 5px;
							-moz-border-radius: 5px;
							}
							
.section > p
							{margin-left: 2em;
							margin-right: 1em;}

.subsection > p
							{margin-left: 1em;
							margin-right: 1em;}

							
.subsection				{padding: 15px 15px 20px 15px;
							margin: 0 15px 10px 15px;
							border-radius: 3px;
							-webkit-border-radius: 3px;
							-moz-border-radius: 3px;
							background-color: rgba(255,255,255,0.6);
							overflow: hidden;}

header					{overflow: hidden;
							margin: 0;
							padding-top: 10px;
							padding-bottom: 10px;
							background-color: #FFA240;
							color: #fff;
							border-bottom: 1px solid #FFA240;
							
							}

.title-logo				{float: left;}

.gaiyou					{float: right;
							margin-top: 3px;}

#menu						{background-color: rgba(255,255,255,0.7);
							border-top: 1px solid #FFC877;
							border-bottom: 1px solid #FB9034;
							margin-bottom: 40px;
  							}

#menu ul					{list-style: none;
							font-size: 0;
							margin: 0;
							padding: 0;
							}

#menu ul li				{display: inline-block;
							width: 20%;
							}

#menu li a				{display: block;
							padding: 15px;
							margin: 0;
							text-align: center;
							/*color: #FB9034;*/
							color: #333;
							font-size: 18px;
							text-decoration: none;
							}

#menu li a:hover		{background-color: #FEBA80;
							color: #fff;
							}

#recently				{width: 100%;
							/*background-color: rgba(256,256,256,0.5);*/
							}

.recently-inner		{overflow: hidden;
							}
							
.recently-theme		{float: left;
							width: 47%;
							margin-right: 3%;
							padding: 0 10px;
							box-sizing: border-box;}

.recently-theme h2	{font-size: 20px;
							color: #FB9034;
							font-weight: bold;
							display: block;
							margin-bottom: 10px;}

.recently-theme h3	{color: #FB9034;
							font-size: 40px;
							display: block;
							text-align: center;
							padding-top: 80px;
							padding-bottom: 80px;}

.recently-theme p		{color: #FFFFFF;
							display: block;
							text-align: center;
							padding-top: 10px;
							padding-bottom: 10px;
							background-color: #FFA240;
							
							border-bottom-left-radius: 3px;
							border-bottom-right-radius: 3px;
							-webkit-border-bottom-left-radius: 3px;  
							-webkit-border-bottom-right-radius: 3px;  
							-moz-border-radius-bottomleft: 3px;  
							-moz-border-radius-bottomright: 3px;}
							

.recently-theme button {float: right;
								width: 50%;
								padding-top: 10px;
								padding-bottom: 10px;
								margin-top: 10px;
								text-align: center;
								border-radius: 5px;
								font-size: 16px;
								cursor: pointer;
								font-family: Verdana, "游ゴシック", YuGothic, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;}

.recently-theme button:hover
								{opacity: 0.8;}

.recently-theme button:focus {outline: none;}

.recently-theme button i {margin-left: 10px;}

.recently-theme .matome-ok {border: solid 1px #FB9034;
									background-color: rgba(256,256,256,0);
									color: #FB9034;}
									
.recently-theme .matome-ok:hover {/*background-color: #FEBA80*/
											}

.recently-theme .matome-ng {border: solid 1px #ccc;
									background-color: rgba(256,256,256,0);
									color: #ccc;}

.recently-detail		{float: left;
							width: 50%;
							margin-top: 10px;
							padding: 0 10px;
							box-sizing: border-box;
							}
							
.recently-detail h2	{font-size: 16px;
							color: #FFFFFF;
							display: block;
							padding-top: 10px;
							padding-left: 10px;
							padding-bottom: 10px;
							background-color: #81B42E;
							}

.recently-detail i	{margin-right: 10px;
							color: #27AE60;
							}

.recently-detail h3	{color: #FB9034;
							border-bottom: 1px dotted #ffc877;
							margin: 0;
							}

.recently-detail ul	{margin-top: 10px;
							margin-bottom: 20px;}

.recently-detail ul li {color: #333333;
								margin-left: 1em;
								margin-bottom: auto;}

#join						{width: 100%;
							}

.join-inner				{padding-left: 15px;
							padding-right: 15px;
							overflow: hidden;
							margin-bottom: 20px;
							}

.join-inner h2			{display: block;
							padding-top: 10px;
							padding-bottom: 10px;
							color: #fff;
							text-align: center;
							font-size: 16px;
							background-color: #81B42E;
							
							border-top-left-radius: 3px;
							border-top-right-radius: 3px;
							-webkit-border-top-left-radius: 3px;  
							-webkit-border-top-right-radius: 3px;  
							-moz-border-radius-topleft: 3px;  
							-moz-border-radius-topright: 3px; 
							}
							
.join-inner h3			{display: block;
							padding-top: 30px;
							padding-bottom: 30px;
							color: #fff;
							text-align: center;
							font-size: 26px;
							font-weight: bold;
							background-color: #f1c40f;
							text-shadow: 1px 1px 1px #333;
							}
							
.join-inner p			{display: block;
							padding-top: 10px;
							padding-bottom: 10px;
							color: #fff;
							text-align: center;
							background-color: #f39c12;
							
							border-bottom-left-radius: 3px;
							border-bottom-right-radius: 3px;
							-webkit-border-bottom-left-radius: 3px;  
							-webkit-border-bottom-right-radius: 3px;  
							-moz-border-radius-bottomleft: 3px;  
							-moz-border-radius-bottomright: 3px;
							}

.join-1					{width: 32%;
							margin-right: 2%;
							float: left;
							-moz-box-sizing: border-box;
							-webkit-box-sizing: border-box;
							box-sizing: border-box;
							}
							
.join-2					{width: 32%;
							margin-right: 2%;
							float: left;
							-moz-box-sizing: border-box;
							-webkit-box-sizing: border-box;
							box-sizing: border-box;
							}
							
.join-3					{width: 32%;
							float: left;
							-moz-box-sizing: border-box;
							-webkit-box-sizing: border-box;
							box-sizing: border-box;
							}
							

#news						{width: 100%;
							}

#news ul					{padding: 15px;
							margin: 0 15px 0 15px;
							border-radius: 3px;
							-webkit-border-radius: 3px;
							-moz-border-radius: 3px;
							background-color: rgba(255,255,255,0.6);
							}

#news time				{/*margin-right: 40px;*/
							width: 180px;
							float: left;
							font-weight: bold;}						

#news ul li				{line-height: 2em;
							border-bottom: 1px dashed #ffc877;
							font-size: 12px;}
							
#news .news-text		{width: 100%;
							display: block;}

/******お知らせタグ******/
.odai-release-tag, .ibent-tag, .mente-tag, .oshirase-tag, .minlabo-tag
							{color: #fff;
							padding: 1px 1em;
							font-weight: normal;
							margin-left: 15px;
							border-radius: 2px;
							-webkit-border-radius: 2px;
							-moz-border-radius: 2px;
							}
							
.odai-release-tag		{background-color: #FB9034;}

.ibent-tag				{background-color: #3498db;}

.mente-tag				{background-color: #95a5a6;
							padding: 1px 0.5em;}

.oshirase-tag			{background-color: #27ae60;}

.minlabo-tag			{background-color: #A1B92E;
							padding: 1px 0.85em;}

#theme					{width: 100%;
							overflow: hidden;
							}
							
#theme .top-h1			{margin-bottom: 0;	/*theme-boxの上にpaddingが入っているため*/
							}
							
.theme-box				{position: relative;
							height: auto;
							width: 225px;
							padding: 10px 10px;
							float: left;
							margin: 1%;
							border: 1px solid #FFC877;
							border-top: 4px solid #F39C12;
							background-color: rgba(256,256,256,0.8);
							/*border-radius: 5px;*/
							box-sizing: border-box;}
							
.theme-box:before		{content: "";
							display: block;
							padding-top: 100%;}
							
.theme-box a			{
							position: absolute;
							top: 0;
							left: 0;
							bottom: 0;
							right: 0;
							width: 100%;
							height: 100%;
							}
							
.theme-box a:link		{
							text-decoration: none;
							color: #333333;
							}
							
.theme-box a:visited	{text-decoration: none;
							color: #333333;
							}

.theme-box ul			{position: absolute;
							bottom: 0;
							left: 0;
							width:100%;
							padding-top: 5px;
							padding-bottom: 5px;
							background-color: #FFC877;}

.theme-box ul > li	{font-size: 12px;
							margin-left: 10px;}

.theme-box li:nth-child(1){
							color: #3498DB;
							}
							
/******お題一覧タグ******/
.main-tag, .second-tag, .technical-tag
							{color: #fff;
							padding: 1px 0.5em;
							margin-right: 5px;
							margin-left: 5px;
							border-radius: 2px;
							-webkit-border-radius: 2px;
							-moz-border-radius: 2px;
							font-size: 12px;
							}
							
.main-tag				{background-color: #F39C12;}

.second-tag				{background-color: #27AE60;}

.technical-tag			{background-color: #3498DB;}


.theme-box h2			{padding-left: 10px;
							margin-left: 10px;
							margin-top: 10px;
							margin-bottom: 5px;
							font-size: 16px;
							color: #27AE60;
							font-weight: bold;
							border-left: 3px solid #F1C40F;}

.theme-box h3			{padding-top: 10px;
							vertical-align: middle;
							text-align: center;
							font-size: 1.5em;
							color: #FB9034;}
							
#sns						{overflow: hidden;}

.share					{list-style: none;}

.share li				{width: 30%;
							float: left;
							margin-left: 2.5%;}

.share li a				{display: block;
							color: #fff;
							padding: 10px;
							font-size: 14px;
							text-align: center;
							text-decoration: none;}
							
.share li a:hover		{opacity: 0.8;}
							
.share-tw				{background-color: #55acee;}
							
.share-fb				{background-color: #3b5998;}

.share-g					{background-color: #dd4b39;}
							
footer					{padding: 15px 15px 15px 0;
							text-align: right;
							font-size: 12px;
							color: #fff;
							background-color: #FB9034;}

#mokumoku-join h1					{font-size: 62px;
							text-align: center;
							color: #fff;
							margin : 20px 0;
							}


/***************アンケート**************/							
.ank-h2					{margin-bottom: 20px;
							color: #FB9034;
							font-size: 20px;
							font-weight: bold;}

.ank-h2 i				{margin-right: 0.5em;}

.ank-h3					{color: #FB9034;
							font-size: 16px;
							margin-left: 1em;}

.ank-title				{color: #27AE60;}

.ank-graph				{margin: auto;
							padding: 10px 0 30px 0;}

/****************みんLabo***************/
.howto-h2				{margin-bottom: 10px;
							color: #FB9034;
							font-size: 20px;
							font-weight: bold;}

.howto-h2 i				{margin-right: 0.5em;}

.howto_article			{margin: 0 0 20px 0;}

.howto_article img	{
							float: left;
							margin: 10px 20px 0px 0;
							border: solid 1px #ccc;
							padding: 3px;
							}

.howto_article .author{margin-bottom: 1em;}

.howto_article .caption{margin-bottom: 1em;}

.howto_article .tweet
							{float: right;
							width: 200px;
							padding: 10px;
							margin-top: 2em;
							margin-right: 10px;
							background-color: #F1C40F;
							text-align: center;
							font-size: 16px;
							color: #fff;}

.gotolink
							{float: right;
							width: 200px;
							padding: 10px;
							margin-top: 2em;
							background-color: #27AE60;
							text-align: center;
							font-size: 16px;
							color: #fff;}
								
.gotolink:hover		{opacity: 0.8;}

.gotolink a				{text-decoration: none;
							color: #fff;}

#minlabo-article .howto_article
							{margin-left: 20px;}
							
#minlabo-article .subsection p
							{
							line-height: 1.6em;
							letter-spacing: 1px;
							margin-bottom: 1em;}	

#minlabo-article .img-p
							{text-align: center;}

#minlabo-article .images
							{width: 50%;
							margin: 10px 0 10px 0;}	

#minlabo-article .std-ul
							{list-style:disc;
							margin-left: 3em;
							line-height: 1.6em;
							letter-spacing: 1px;}

#minlabo-article .std-ol
							{list-style: decimal;
							margin-left: 3em;
							line-height: 1.6em;
							letter-spacing: 1px;}
							
#minlabo-article .author img
							{float: none;
							border: 0;
							margin: 0;
							margin-left: 10px;
							padding: 0;}
							
#minlabo-article .subsection ul
							{margin: 20px 0 20px 4em;
							list-style-type: disc;
							}
							
#minlabo-article .subsection　ul li
							{margin-bottom: 0.5em;
							}

#doc .std-ol
							{list-style: decimal;
							margin-left: 3em;
							line-height: 1.6em;
							letter-spacing: 1px;}
									

/*********************599px以下**************************/
@media(max-width: 599px){
	
	.gaiyou					{margin-top: 5px;}
	
	.gaiyou p		 		{font-size: 12px;
								text-align: right;}
	
	#menu ul li				{display: block;
								width: 100%;
								}

	#menu li a				{display: block;
								padding: 10px 0 10px 15px;
								margin: 0;
								text-align: left;
								/*color: #FB9034;*/
								color: #333;
								font-size: 14px;
								text-decoration: none;
								}

	.join-inner				{margin: auto;
								width: 90%;
								padding-left: 15px;
								padding-right: 15px;
								overflow: none;
								}

	.join-1, .join-2, .join-3
								{width: 100%;
								margin-bottom: 15px;
								float: none;
								-moz-box-sizing: border-box;
								-webkit-box-sizing: border-box;
								box-sizing: border-box;
								}
								
	.recently-inner		{overflow: none;
								}
								
	.recently-theme		{float: none;
								width: 100%;
								margin: auto;
								padding: 0 10px;
								box-sizing: border-box;}
								
	.recently-theme h3	{font-size: 30px;
								padding-top: 40px;
								padding-bottom: 40px;}
								
	.recently-theme p		{display: none;}
	
	.recently-theme button 
								{float: none;
								width: 100%;
								}
								
	.recently-detail		{float: none;
								width: 100%;
								margin-top: 10px;
								padding: 0 10px;
								box-sizing: border-box;
								}
								
	.recently-detail ul li 
								{text-indent: 0em;
								margin-bottom: auto;}
								
	.theme-box				{width: 80%;
								margin-left: 10%;
								margin-right: 10%;
								}
								
	.theme-box h3			{font-size: 26px;}
	
	#news time				{float: none;}
	
	.share li				{width: 90%;
								float: none;
								margin: auto;}
	
	.share li a				{margin-bottom: 10px;}
		
	#minlabo-article .images
								{width: 80%;}
	
	.howto_article img	{
								float: none;
								width: 50%;
								margin-bottom: 20px;
								}
								
	#minlabo-article .author img
							{width: 20px;}
	
	#minlabo-article .images
							{width: 100%;}	
	
	.video-wrapper iframe
							{width: 100%;
							height: auto;
							max-width: 100%;}
}

/*********************1040px以上**************************/
@media(min-width: 1040px){

#join, #news, #recently, #sns, #theme, .section
							{width: 1000px;
							margin: auto;
							background-color: rgba(255,255,255,0.6);
							margin-bottom: 40px;
							border-radius: 5px;
							-webkit-border-radius: 5px;
							-moz-border-radius: 5px;
							}

header .inner, #menu .inner
							{width: 1000px;
							margin: auto;}
	
}