@charset "utf-8";
* {
	margin:0;
	padding:0;
}

body{
	font-family:"UD Digi Kyokasho NP-R", "ＭＳ ゴシック","ＭＳ Ｐ明朝";
	line-height:1.5;
	background-color:#fff;
}

img {
	border:none;
}

/*アニメ―ションする要素を非表示にする*/
.invisible {
    visibility: hidden;
}

#wrapper {
	width:900px;
	margin:0 auto;
	background-color:#ffde00;
}

#content {
	width:800px;
	margin:0 auto;
}

header {
	background-color:#000;
	width:870px;
	padding:10px 15px;
	filter: drop-shadow(0 5px 2px #333);
	font-family: "UD Digi Kyokasho NP-B";
}

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

nav {
}

nav ul {
}

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

nav li {
	font-size:16px;
	height:50px;
	list-style-type:none;
	text-align:center;
	display:table-cell;
	vertical-align:middle;
	color:#fff;
	padding:0 15px;
	float:left;
}

h1 {
	font-size:18px;
	float:left;
	color:#fff;
	height:100%;
	vertical-align:middle;
	display:flex;
	align-items: center;
	margin-right:50px;
}

h2 {
	font-size:18px;
	color:#fff;
	font-family:"UD Digi Kyokasho NP-B", "ＭＳ ゴシック","ＭＳ Ｐ明朝";
	margin-top:50px;
	margin-bottom:50px;
	padding:10px;
	position:relative;
}

.h2_title {
	text-align:center;
	filter: drop-shadow(2px 2px 2px #333);
	position:absolute;
	z-index:3;
	margin-left:30px;
	top:5px;
}

.orange {
	width:400px;
	height:50px;
	background-color:#fe9d1f;
	position:absolute;
	top:-10px;
	left:0px;
	z-index:1;
}

.cyan {
	width:400px;
	height:50px;
	background-color:#00c0ff;
	position:absolute;
	top:0px;
	left:150px;
	z-index:2;
}

section {
	margin-top:50px;
}

#aboutus_content_box {
	position:relative;
	height:550px;
}

#aboutus_description {
	width:400px;
	left:20px;
	position:static;
	z-index:1;
}

#aboutus_melit_list {
	margin-left:20px;
	margin-bottom:20px;
}

#aboutus_member_type {
	margin-left:20px;
	margin-bottom:20px;
}

#aboutus_image {
	position:absolute;
	top:140px;
	left:0px;
	z-index:0;
}

#aboutus_image2 {
	position:absolute;
	top:100px;
	left:380px;
	z-index:1;
}

#aboutus_table {
	background-color:#fff;
	position:absolute;
	top:550px;
	left:20px;
	border-collapse:collapse;
	width:700px;
}

#aboutus_table th,td {
	border:solid 1px #000000;
	padding:10px;
}

#aboutus_table th {
	width:30%;
}

#aboutus_idol {
	position:absolute;
	top:250px;
	left:400px;
	filter: drop-shadow(2px 2px 2px #333);
	z-index:5;
}

#aboutus_organization {
	margin-left:20px;
}

#aboutus_organization ul {
	margin-left:20px;
}

#theater_content_box {
	position:relative;
	height:650px;
}

#theater_description {
	width:400px;
	left:20px;
	position:static;
	z-index:1;
}

#theater_image {
	position:absolute;
	top:100px;
	right:50px;
	z-index:0;
}

#theater_table {
	background-color:#fff;
	position:absolute;
	top:400px;
	left:20px;
	border-collapse:collapse;
	width:700px;
}

#theater_table th,td {
	border:solid 1px #000000;
	padding:10px;
}

#theater_table th {
	width:30%;
}

#theater_idol {
	position:absolute;
	top:100px;
	right:-150px;
	filter: drop-shadow(2px 2px 2px #333);
	z-index:5;
}

#leader_photo {
	float:left;
}

#leader_description {
	margin-bottom:100px;
}

.member_card {
	background-color:#fff;
	padding:10px;
	width:90%;
	text-align:center;
	border-radius:5px;
	filter: drop-shadow(2px 2px 2px #333);
	margin:10px;
	float:left;
}

.member_card p {
	margin:10px;
	text-align:left;
}

.member_card h4 {
	margin:10px;
	text-align:left;
}

.clear {
	clear:both;
}

#workshop_content_box {
	position:relative;
	height:650px;
}

#workshop_description {
	width:400px;
	left:20px;
	position:static;
	z-index:1;
}

#workshop_image {
	position:absolute;
	top:50px;
	right:50px;
	z-index:0;
}

#workshop_table {
	background-color:#fff;
	position:absolute;
	top:350px;
	left:20px;
	border-collapse:collapse;
	width:700px;
}

#workshop_table th,td {
	border:solid 1px #000000;
	padding:10px;
}

#workshop_idol {
	position:absolute;
	top:-100px;
	right:-150px;
	filter: drop-shadow(2px 2px 2px #333);
	z-index:5;
}

#workshop_table th {
	width:30%;
}

#event_content_box {
	position:relative;
	height:600px;
}

#event_description {
	width:400px;
	left:20px;
	position:absolute;
	z-index:1;
}

#event_image {
	position:absolute;
	top:50px;
	left:350px;
	z-index:0;
}

#event_table {
	background-color:#fff;
	position:absolute;
	top:350px;
	left:20px;
	border-collapse:collapse;
	width:700px;
}

#event_table th,td {
	border:solid 1px #000000;
	padding:10px;
}

#event_idol {
	position:absolute;
	top:0px;
	left:450px;
	filter: drop-shadow(2px 2px 2px #333);
	z-index:5;
}

#event_table th {
	width:30%;
}

#dvd_content_box {
	position:relative;
	height:550px;
}

#dvd_description {
	width:400px;
	left:20px;
	position:static;
	z-index:1;
}

#dvd_image {
	position:absolute;
	top:100px;
	right:50px;
	z-index:0;
}

#dvd_idol {
	position:absolute;
	top:0px;
	right:-100px;
	filter: drop-shadow(2px 2px 2px #333);
	z-index:5;
}

#contact_content_box {
	position:relative;
	height:300px;
}

#contact_table {
	background-color:#fff;
	border-collapse:collapse;
	width:700px;
	margin:30px;
}

#contact_table th,td {
	border:solid 1px #000000;
	padding:10px;
}

#contact_table th {
	width:30%;
}

#contact_description {
	margin-left:30px;
}

@media screen and (max-width:900px) {
	#wrapper {
		width:100%;
		margin:0 auto;
		background-color:#ffde00;
		overflow:hidden;
	}
	
	#content {
		width:95%;
		margin:0 auto;
	}
	header {
		width:95%;
	}

	#aboutus_table {
		background-color:#fff;
		left:10px;
		border-collapse:collapse;
		width:90%;
	}
	
	#theater_table {
		background-color:#fff;
		left:10px;
		border-collapse:collapse;
		width:90%;
		z-index:10;
	}

	#workshop_table {
		background-color:#fff;
		left:10px;
		border-collapse:collapse;
		width:90%;
	}
	
	#event_table {
		background-color:#fff;
		left:10px;
		border-collapse:collapse;
		width:90%;
	}

	#contact_table {
		background-color:#fff;
		border-collapse:collapse;
		width:90%;
		margin:30px;
	}

	#aboutus_description {
		width:90%;
	}

	#theater_description {
		width:90%;
	}

	#leader_description {
		width:90%;
	}

	#workshop_description {
		width:90%;
	}

	#event_description {
		width:90%;
	}

	#dvd_description {
		width:90%;
	}

	#contact_description {
		width:90%;
	}
}