@charset "UTF-8";

*{
	margin:0;
	padding:0;
	font-family: Arial, Helvetica, "sans-serif";
	font-weight: bold;
	text-align:center;
	text-decoration: none;
}
a{
	color: #eee;
	cursor: pointer;
  transition: all 0.3s ease 0s;
}
a:hover{
	opacity: 0.5;
	text-decoration: underline;
}
header{
	width:100%;
	height:100px;
	text-align:center;
	display:flex;
	background-color:#000000;
	position: fixed;
	z-index:999;
}
header p{
	margin:auto;
}
#contents{
	width:100%;
	height:13%;
	background-color:#F2B905;
}
main{
	background-color:#F2B905;
	padding:3% 0;
}
.introduction{
	height:100vh;
	display: flex;
	justify-content: center;
	align-items: center;
	margin:auto;
}
h1{
	font-size:350%;
	font-family:'Permanent Marker', cursive;
	margin:auto;
	display: inline;
}
.introduction p{
	font-size:90%;
	display: inline;
}
.content h3{
	font-size: 180%;
	box-shadow: 5px 0px 5px rgba(0,0,0,0.25);
	background-color:#000000;
	color:#F2B905;
	padding:20px 0px;
	margin:0px 0px 20px;
}
.hidden_box{
	margin-bottom:5%;
}
.hidden_box p{
	padding:0 10%;
	font-size:100%;
}
.hidden_box label{
	cursor: pointer;
	transition: all 0.3s ease 0s;
}
/*ボタンホバー時*/
.hidden_box label:hover {
	opacity:0.5;
}
/*チェックは見えなくする*/
.hidden_box input {
    display: none;
}
/*中身を非表示にしておく*/
.hidden_box .hidden_show {
    height: 0;
    overflow: hidden;
    opacity: 0;
    transition: 0.3s;
}
/*クリックで中身表示*/
.hidden_box input:checked ~ .hidden_show {
    padding: 10px 0;
    height: auto;
    opacity: 1;
}

footer{
	margin-top:-10px; 
	padding:20px 0;
	background-color:#000000;
	color: #eee;
}