@charset "utf-8";
/* CSS Document */
/* responsive_gray_style */


#link_about_nano,
#link_about_camp,
#link_post,
#link_agreement
{
margin-top:-6em;
padding-top:6em;
display:inline;

}


#about_contest{
}

#about_contest .left_contents {
float:left;	
width:48%;

}



#about_contest .right_contents{
float:right;
margin-top:2em;
width:48%;
}

#about_contest .right_contents p{
	
display:inline-block;

}


#post .title p.right{
    float:left;
	margin-left:1em;
	max-width:30em;

}

#post .title{
	margin-bottom:2em;
	
}


#post .left_contents{
	
	float:left;
	max-width:70%;
	display:inline-block;
}


#post .right_contents{
	float:right;
	margin-right:1em;
	max-width:30%;
	margin-bottom:2em;

}


#foo{
	
	display:inline-block;
	font-weight:bold;
	font-size:110%;
	line-height:110%;
	margin:2em auto 1em 2em;
	font-family: 'Avenir Next','Avenir', 'Helvetica Neue','Helvetica Neue','Helvetica',YuGothic,'Yu Gothic','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',"メイリオ",Meiryo,"ＭＳＰゴシック",sans-serif;

}



.link_btn{
	background:#897a7a;
	border-radius:10px;
	padding:0.5em 1em;
	width:16em;	
	color:#FFFFFF;
	min-height:3em;
	margin-left:10em;
	font-family: 'Avenir Next','Avenir', 'Helvetica Neue','Helvetica Neue','Helvetica',YuGothic,'Yu Gothic','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',"メイリオ",Meiryo,"ＭＳＰゴシック",sans-serif;
	
}

.link_btn a{
	color:#FFFFFF;
	font-weight:bold;
}


.link_btn .icon{
float:left;	
color:#FFFFFF;
font-size:250%;
padding-top:0.1em;
	
}

.link_btn p{
	float:right;
	margin-bottom:0;
	font-family: 'Avenir Next','Avenir', 'Helvetica Neue','Helvetica Neue','Helvetica',YuGothic,'Yu Gothic','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',"メイリオ",Meiryo,"ＭＳＰゴシック",sans-serif;
	
}

.link_btn button{
	float:left;
	margin-bottom:0;
	color:#FFFFFF;
	font-weight:bold;
	vertical-align:middle;
	background:inherit;
	-webkit-appearance: none;
	border:0;
	font-size:100%;
	padding-top:0.8em;
	margin-left:1em;
font-family: 'Avenir Next','Avenir', 'Helvetica Neue','Helvetica Neue','Helvetica',YuGothic,'Yu Gothic','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',"メイリオ",Meiryo,"ＭＳＰゴシック",sans-serif;
	
}



.link_btn02{
	background:#df0623;
	border-radius:10px;
	padding:0.8em 1em;
	width:16em;	
	color:#FFFFFF;
	min-height:2em;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:2em;
	font-family: 'Avenir Next','Avenir', 'Helvetica Neue','Helvetica Neue','Helvetica',YuGothic,'Yu Gothic','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',"メイリオ",Meiryo,"ＭＳＰゴシック",sans-serif;
	display:block;
	


}

.link_btn02 a{
	color:#FFFFFF;
	font-weight:bold;
}


.link_btn02 .icon{
float:right;	
color:#FFFFFF;
font-size:120%;
padding-top:0.6em;
margin-right:1em;

	
}

.link_btn02 p{
	float:left;
	margin-bottom:0;
	font-family: 'Avenir Next','Avenir', 'Helvetica Neue','Helvetica Neue','Helvetica',YuGothic,'Yu Gothic','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',"メイリオ",Meiryo,"ＭＳＰゴシック",sans-serif;
	padding:0;
	margin-left:2em;
	line-height:120%;
}




hr{
	
background-color: #eee;
border-top: 2px dotted #535ca8;
border-bottom: 1px solid  #eee;
margin-bottom:1em;
	
}




#container nav {
	width:100%;
	margin:0 auto;	
	background:#FFC000;
	
}
nav ul{
	margin-left:auto;
	margin-right:auto;
	margin-bottom:2em;
	display:flex;
/*	justify-content:space-around;*/
	justify-content: center;
	padding-bottom:2em;
	background:#FFC000;
	
	
}

nav li
{
padding:0.5em 2em ;
display:inline-block;
text-align:center;	
background:rgba(161,7,163,1);
margin:0 1em;
height:auto;

	
	
}

nav li a{
color:#FFFFFF;
	font-size:95%;

}

nav li a:hover{
	
background:rgba(161,7,163,0.5);	
}


nav li a:visited{
color:#FFFFFF;
}

nav{
	color:#FFFFFF;
	/*max-width:980px;*/
}


nav ul .fixed{
	
display: -webkit-flex; 
display: flex;
width:100%;
 -webkit-justify-content: space-around; 
 justify-content:space-around;

}
.v-bottom{
	vertical-align:bottom;
}

body{
color:#333;
margin:0;
padding:0;
max-width:100%;
font-family: 'Avenir Next','Avenir', 'Helvetica Neue','Helvetica Neue','Helvetica',YuGothic,'Yu Gothic','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',"メイリオ",Meiryo,"ＭＳＰゴシック",sans-serif;
font-size: 0.95rem;
}

a{
text-decoration:none;	
}

.clearfix:after {
    content:" ";
    display:block;
    clear:both;
}

.align-left{
text-align:left;
display:block;	

}

.cf:before,
.cf:after {
    content: " ";
    display: table;;
}

.cf:after {
    clear: both;
}

.cf {
    *zoom: 1;
}

.f_left{float:left;}
.f_right{float:right;}


em{
font-style:normal;
font-weight:bold;	
	
}


#wrapper{
	text-align:center;
	margin:auto;
	max-width:100%;

}

header{
	background-color:#DF0522;
	text-align:left;
	margin:0;
	padding:0.5em 5%;
}
#container{
	text-align:center; 
	margin-left:auto;
	margin-right:auto;
	width:980px;
	background:#F8F8F8;
}


.clear{clear:both;}



.note {
	margin:1em 0;
	font-size: 90%;
}

#about_camp #inner{
width:600px;	
	
}

#about_camp #inner p{
padding:2em 0;	
}
#about_camp ul li{
	
list-style:disc;
margin-left:2em;
margin-bottom:0.5em;
}

#about_camp ul{
	
margin-bottom:1em;
}



#agreement ul{margin-bottom:1em}
#agreement ul li{
list-style:disc;
margin-left:2em;
margin-bottom:0.5em;
}

		
.pc_only{display:block;}		
.sp_only{display:none;}

p{margin-bottom:1em; text-align:left;}
img{max-width:100%;}
h1{
	margin-top:0.1em;
	padding:0;
	width:80px;
}

h2{
	background: #A107A3;
	padding: 0.5em;
	padding-left:2em;
	margin-bottom: 1em;
	color: #FFFFFF;
	font-weight: bold;
	font-size: 150%;
	max-width: 100%;
	text-align:left;
	
}

h2 img{
max-width:2em;
vertical-align:bottom;
margin-right:0.5em;
}


h3{
	
font-weight:normal;
color:#535ca8;	
font-size:200%;
text-align:left;
margin-bottom:1em;
}


.contents_common{

text-align:left;
padding:2em 3em;


}


.flex{
display: -webkit-flex; 
display: flex;

}


.fixed {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
}

.step{
display:inline-block;
}
nav.fixed ul{
background-color:rgba(255,255,255,0);	
}

@media only screen and (max-width:979px){
	
#post .title p.right{
	max-width:40em;
}
}


@media only screen and (max-width:720px) {
	
	
	
#about_contest .left_contents {
float:none;
width:100%;

}



#about_contest .right_contents{
float:none;
margin-top:1em;
width:100%;
}

	

	
 #foo{
	
	display:inline-block;
	font-weight:bold;
	font-size:110%;
	line-height:110%;
	margin:0;
	padding:0;

	}
	

		
#link_about_nano,
#link_about_camp,
#link_post,
#link_agreement
{

margin-top:18em;
padding-top:-18em;	
	
	}
	
	
	
	
#post .left_contents{
	
	float:none;
	max-width:95%;
	display:inline-block;
	
}
#post .right_contents{
	float:none;	
	margin: 0 auto;
	max-width:95%;
	text-align:center;
	margin-bottom:2em;

}

#post .right_contents img{
	max-width:95%;	
	margin:1em auto;
	
}	
	
#post .left_contents pre{
		
	}	
		
	
#post .title p.right{
	max-width:100%;
}
	
#sp_image img{
		max-width:40%;
		
	}
	
#sp_image{

		text-align:center;
	}
	
	
	
#description{
}


#description p{
	
	background:#535ca8;
	font-size:120%;
	color:#FFFFFF;	
	padding:1em;
	text-align:center;
	font-weight:bold;
}

	
/*インスタリンクボタンとハッシュタグコピーボタン*/
.link_btn{
	background:#897a7a;
	border-radius:10px;
	padding:0.5em 0.8em;  
	max-width:100%;	
	color:#FFFFFF;
	min-height:3em;
	margin:0 auto 1em auto;
	
}
	
	.link_btn p span{
		
	letter-spacing:-0.1em;
	}
	
	
#container{
	text-align:center;
	margin-left:auto;
	margin-right:auto;
	max-width:95%;

}	
.sp_only{display:block;}
.pc_only{display:none;}	
	
nav{
width:100%;
margin-bottom:1em;

	}
	
nav ul{
width:100%;
display: -webkit-flex; 
display: flex;
 -webkit-justify-content: space-around; 
 	justify-content:space-around;
z-index:10;
padding:0;

}
	
nav.fixed	{
		
background-color:rgba(255,255,255,0.5);

	}

nav ul li
{
font-size:80%;
text-align: center;
margin:0.2em;
margin-bottom:1em;
padding:0.5em 1em;
vertical-align:bottom;

	}
	
nav.fixed ul{
background-color:rgba(255,255,255,0);	
display: -webkit-flex; 
display: flex;
width:100%;
flex-wrap:nowrap;
-webkit-flex-wrap:nowrap;
	margin-bottom:0;


}
	

.fixed {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
}

	
nav ul li.low{
		
	padding-top:1em;
	}

	

	
/*ナビゲーション上部固定*/
	
	

#wrapper{max-width:100%;}
	

h1{
	max-width:20%;
}


#header ul img{
max-width:12%;
	
}
		

/*ul li{
margin-bottom:1em; margin-right:1%;text-indent:0; text-align:left;}*/

p{font-size:120%;}

p{max-height:100%;  }




 .intro{
	width:90%;	

 }
	
.contents_common{
padding-left:1em;
padding-right:1em;
text-align:left;


}


#about_camp{
padding-left:1em;
padding-right:1em;
text-align:left;
background-image:none;


}

	
#inner{
	max-width:100%;	

	}
h2{padding-left:1em;
}



}