@charset "utf-8";
@import url("page.css");
/* CSS Document */


#bn-objective {
	background-image: url(../images/activity/bn-mokuhyou.gif);
	background-size: contain;
	background-repeat: no-repeat;
	text-indent: -9999px;
	display: block;
	margin: 0 auto;
	padding-top: 61.57%;
	height: 0px;
	width: 96%;
}

#bt-qbig {
	display: block;
	margin: 30px auto 0;
	width: 96%;
}

#ct01 h2 {
	background-image: url(../images/guidance/ti_01_sp.png);
	background-size: contain;
	background-repeat: no-repeat;
	display: block;
	text-indent: -9999px;
	margin: 0 0 30px;
	padding-top: 7.08%;
	height: 0;
	width: 100%;
}

#philosophy {
	display: block;
	margin: 30px 0 0;
	width: 100%;
}

#philosophy h2{
	background-image: url(../images/activity/ti_01_sp.png);
	background-size: contain;
	background-repeat: no-repeat;
	display: block;
	text-indent: -9999px;
	margin: 0 0 30px;
	padding-top: 7.08%;
	height: 0;
	width: 100%;
}

#philosophy p {
	line-height: 1.8em;
	display: block;
	margin: 0.5em auto;
	width: 96%;
}

#goal {
	display: block;
	margin: 40px auto;
	width: 96%;
}

#goal h2 {
	background-image: url(../images/guidance/ti_01_sp.png);
	background-size: contain;
	background-repeat: no-repeat;
	display: block;
	text-indent: -9999px;
	margin: 0 0 30px;
	padding-top: 7.08%;
	height: 0;
	width: 100%;
}

#goal p {
	font-size: 16px;
	font-weight: 900;
	margin: 0 auto;
	width: 96%;
}

#hope {
	display: block;
	margin: 40px auto;
	width: 96%;
}

#hope h2 {
	background-image: url(../images/activity/ti_03_sp.png);
	background-size: contain;
	background-repeat: no-repeat;
	display: block;
	text-indent: -9999px;
	margin: 0 0 30px;
	padding-top: 7.08%;
	height: 0;
	width: 100%;
}

#hope dl {
	margin: 20px 0;
	width: 100%;
}

#hope dt {
	background-image: url(../images/activity/hope_sp.png);
	background-size: contain;
	background-repeat: no-repeat;
	display: block;
	text-indent: -9999px;
	margin: 0 0 30px;
	padding-top: 26.8%;
	height: 0;
	width: 100%;
}

#hope dd img {
	margin: 0 auto 20px;
	height: auto;
	width: 100%;
}

#hope dd li {
	font-size: 16px;
	font-weight: 900;
	line-height: 1.8em;
}

.method01 {
	color: #FF645B;
}

.method02 {
	color: #3333CC;
}

.method03 {
	color: #009900;
}

.method04 {
	color: #FF6600;
}

#regular {
	display: block;
	margin: 40px auto;
	width: 96%;
}

#regular h2 {
	background-image: url(../images/activity/ti_04_sp.png);
	background-size: contain;
	background-repeat: no-repeat;
	display: block;
	text-indent: -9999px;
	margin: 0 0 30px;
	padding-top: 7.08%;
	height: 0;
	width: 100%;
}


#movbox {
	display: block;
	margin: 0 auto;
	padding-top: 10px;
	width: 96%;
}
#movbox video {
	height: auto;
	width: 100%;
}
#regular_box {
	margin: 30px auto 0;
}

#regular_box p {
	font-size: 16px;
}

#regular_box dt {
	font-size: 15px;
	font-weight: 600;
	margin: 2em 0 0.5em;
}

#regular_box dd {
	margin-left: 1em;
}


#special {
	display: block;
	margin: 40px auto;
	width: 96%;
}

#special h2 {
	background-image: url(../images/activity/ti_05_sp.png);
	background-size: contain;
	background-repeat: no-repeat;
	display: block;
	text-indent: -9999px;
	margin: 0 0 30px;
	padding-top: 7.08%;
	height: 0;
	width: 100%;
}

#special img {
	display: block;
	margin: 1em auto;
	width: ; 217px;
}

.ti01-01 {
	font-weight: 600;
	color: #FF3366;
	margin: 10px auto 5px;
	padding: 3px;
	width: 96%;
	border: solid 1px #FF3366;
}
.ti01-02 {
	font-weight: bold;
	color: #FF6600;
	margin: 10px auto 5px;
	padding: 3px;
	width: 96%;
	border: solid 1px #FF6600;
}
.ti01-03 {
	font-weight: 600;
	color: #336600;
	margin: 10px auto 5px;
	padding: 3px;
	width: 96%;
	border: solid 1px #336600;
}

.ti01-04 {
	font-weight: 600;
	color: #0066CC;
	margin: 10px auto 5px;
	padding: 3px;
	width: 96%;
	border: solid 1px #0066CC;
}

#special dd {
	margin: 0 auto;
	width: 92%;
}

#drum {
	display: block;
	margin: 40px auto;
	width: 96%;
}

#drum h2 {
	background-image: url(../images/activity/ti_06_sp.png);
	background-size: contain;
	background-repeat: no-repeat;
	display: block;
	text-indent: -9999px;
	margin: 0 0 30px;
	padding-top: 7.08%;
	height: 0;
	width: 100%;
}

#drum img {
	display: block;
	margin: 1em auto;
	width: ; 150px;
}

#drum dl {
	color: #336600;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin: 1em auto 0;
	width: 270px;
}

#drum dt {
	text-align: left;
	vertical-align: top;
	width: 50px;
}

#drum dd {
	padding-left: 2em;
	width: 215px;
	box-sizing: border-box;
}

#drum dd::before {
	content: "･･･";
	margin-left: -2em;
	padding-right: 0.5em;
}


#library {
	display: block;
	margin: 40px auto;
	width: 96%;
}

#library h2 {
	background-image: url(../images/activity/ti_07_sp.png);
	background-size: contain;
	background-repeat: no-repeat;
	display: block;
	text-indent: -9999px;
	margin: 0 0 30px;
	padding-top: 7.08%;
	height: 0;
	width: 100%;
}

#library p {
	display: block;
	margin: 0 auto;
	width: 96%;
}

#extension {
	display: block;
	margin: 40px auto;
	width: 96%;
}

#extension h2 {
	background-image: url(../images/activity/ti_08_sp.png);
	background-size: contain;
	background-repeat: no-repeat;
	display: block;
	text-indent: -9999px;
	margin: 0 0 30px;
	padding-top: 7.08%;
	height: 0;
	width: 100%;
}

#extension p.ex {
	color: #FF3366;
	display: block;
	margin: 0 auto;
	width: 96%;
}

#extension dl {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin: 1.5em auto;
	width: 270px;
}

#extension dt {
	text-align: left;
	vertical-align: top;
	width: 50px;
}

#extension dd {
	width: 215px;
}

#extension p {
	display: block;
	margin: 0 auto;
	width: 96%;
}

#extracurricular {
	display: block;
	margin: 40px auto;
	width: 96%;
}

#extracurricular h2 {
	background-image: url(../images/activity/ti_09_sp.png);
	background-size: contain;
	background-repeat: no-repeat;
	display: block;
	text-indent: -9999px;
	margin: 0 0 30px;
	padding-top: 7.08%;
	height: 0;
	width: 100%;
}

#extracurricular p {
	color: #FF3366;
	display: block;
	margin: 0 auto;
	width: 96%;
}

#extracurricular table {
	margin: 1em auto 2em;
	border: 2px #FF3366 solid;
	border-collapse: collapse;
	width: 96%;
}

#extracurricular th {
	background-color: #FFE7CE;
	text-align: left;
	padding: 5px;
	width: 40%;
	border: 2px #FF3366 solid;
	box-sizing: border-box;
}
#extracurricular td {
	border: 2px #FF3366 solid;
	padding: 5px;
	text-align: left;
}
#extracurricular td.extracurricular {
	border: 2px #FF3366 solid;
	padding: 5px;
	background-color: #FFFFCC;
	text-align: center;
	width: 2%;
	box-sizing: border-box;
}

#mon-chan {
	display: block;
	margin: 40px auto;
	width: 96%;
}

#mon-chan h2 {
	background-image: url(../images/activity/mon-house/tit-mon.png);
	background-size: contain;
	background-repeat: no-repeat;
	display: block;
	text-indent: -9999px;
	margin: 0 0 30px;
	padding-top: 50.16%;
	height: 0;
	width: 100%;
}

#mon-house {
	background-image: url(../images/activity/mon-house/ph_mon-house.jpg);
	background-size: contain;
	background-repeat: no-repeat;
	display: block;
	text-indent: -9999px;
	margin: 0 0 30px;
	padding-top: 141.55%;
	height: 0;
	width: 100%;
}

#mon-schedule {
	background-image: url(../images/activity/mon-house/schedule_sp.png);
	background-size: contain;
	background-repeat: no-repeat;
	display: block;
	text-indent: -9999px;
	margin: 0 0 30px;
	padding-top: 32%;
	height: 0;
	width: 100%;
}

#mon-reservation {
	display: block;
	margin: 10px auto 0;
	width: 96%;
}
#mon-reservation a {
	background-image: url(../images/activity/mon-house/btn_reservation.png);
	background-size: contain;
	background-repeat: no-repeat;
	display: block;
	text-indent: -9999px;
	margin: 0 0 30px;
	padding-top: 13.68%;
	height: 0;
	width: 100%;
}

/*年間行事*/
#event {
	display: block;
	margin: 10px auto 0;
	width: 96%;
}

#event h2 {
	background-image: url(../images/activity/ti_10_sp.png);
	background-size: contain;
	background-repeat: no-repeat;
	display: block;
	text-indent: -9999px;
	margin: 0 0 30px;
	padding-top: 7.08%;
	height: 0;
	width: 100%;
}


#annual {
	display: block;
	margin: 20px auto 0;
	width: 96%;
}

#annual div {
	display: block;
	margin: 10px 0;
	width: 100%;
}

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

#title {
	border: 1px solid #F1F6DF;
	background: linear-gradient(90deg, rgba(216,182,215,1), rgba(255,255,255,1));
}

#anchor {
	width: 600px;
}

#bn-objective {
	background-size: auto;
	padding-top: 0;
	height: 346px;
	width: 562px;
}

#philosophy {
	display: block;
	margin: 30px auto 0;
	width: 1015px;
}

#philosophy h2{
	background-image: url(../images/activity/ti_01.png);
	background-size: auto;
	padding-top: 0;
	height: 34px;
	width: 1015px;
}

#bt-qbig {
	display: block;
	margin: 40px 0 0 10px;
	width: 550px;
}

#bt-qbig a:hover {
	opacity: 0.7;
}

#goal {
	display: block;
	margin: 50px auto;
	width: 1015px;
}

#goal h2 {
	background-image: url(../images/activity/ti_02.png);
	background-size: auto;
	padding-top: 0;
	height: 34px;
	width: 1015px;
}

#goal p {
	font-size: 16px;
	font-weight: 900;
	width: 980px;
}

#hope {
	display: block;
	margin: 50px auto;
	width: 1015px;
}

#hope h2 {
	background-image: url(../images/activity/ti_03.png);
	background-size: auto;
	padding-top: 0;
	height: 34px;
	width: 1015px;
}

#hope dt {
	background-image: url(../images/activity/hope.png);
	background-size: auto;
	padding-top: 0;
	height: 37px;
	width: 841px;
}
#hope dd img {
	margin: 0 0 20px;
	height: auto;
	width: 416px;
}

#regular {
	display: block;
	margin: 50px auto;
	width: 1015px;
}

#regular h2 {
	background-image: url(../images/activity/ti_04.png);
	background-size: auto;
	padding-top: 0;
	height: 34px;
	width: 1015px;
}

#movbox {
	margin: 30px auto;
	width: 900px;
}

#special {
	display: block;
	margin: 50px auto;
	width: 1015px;
	clear: both;
}

#special h2 {
	background-image: url(../images/activity/ti_05.png);
	background-size: auto;
	padding-top: 0;
	height: 34px;
	width: 1015px;
}

#special dl {
	margin-top: 1.5em;
}

#special img {
	float: right;
}

.ti01-01 {
	margin: 10px 0 5px;
	width: 300px;
}
.ti01-02 {
	margin: 10px 0 5px;
	width: 300px;
}
.ti01-03 {
	margin: 10px 0 5px;
	width: 300px;
}

.ti01-04 {
	margin: 10px 0 5px;
	width: 300px;
}

#drum {
	display: block;
	margin: 50px auto;
	width: 1015px;
	clear: both;
}

#drum h2 {
	background-image: url(../images/activity/ti_06.png);
	background-size: auto;
	padding-top: 0;
	height: 34px;
	width: 1015px;
}

#drum img {
	margin: 0 3em 8em 1em;
	float: left;
}

#drum dl {
	margin: 2em 0 0;
}

#library {
	display: block;
	margin: 50px auto;
	width: 1015px;
}

#library h2 {
	background-image: url(../images/activity/ti_07.png);
	background-size: auto;
	padding-top: 0;
	height: 34px;
	width: 1015px;
}

#extension {
	display: block;
	margin: 50px auto;
	width: 1015px;
}

#extension h2 {
	background-image: url(../images/activity/ti_08.png);
	background-size: auto;
	padding-top: 0;
	height: 34px;
	width: 1015px;
}

#extension dl {
	margin: 1em 0 1em 2.2em;
}

#extracurricular {
	display: block;
	margin: 50px auto;
	width: 1015px;
}

#extracurricular h2 {
	background-image: url(../images/activity/ti_09.png);
	background-size: auto;
	padding-top: 0;
	height: 34px;
	width: 1015px;
}

#extracurricular table {
	margin: 1em 0 0 2em;
	width: 660px;
}

#extracurricular th {
	width: 200px;
}
#extracurricular td {
	width: auto;
}
#extracurricular td.extracurricular {
	width: 2em;
}


#mon-chan {
	display: block;
	margin: 50px auto;
	width: 1015px;
}

#mon-chan h2 {
	background-image: url(../images/activity/mon-house/tit-mon.png);
	background-size: auto;
	padding-top: 0;
	height: 318px;
	width: 634px;
}

#mon-house {
	background-image: url(../images/activity/mon-house/ph_mon-house.jpg);
	background-size: auto;
	margin: 30px auto;
	padding-top: 0;
	height: 1366px;
	width: 965px;
}

#mon-schedule {
	background-image: url(../images/activity/mon-house/schedule.png);
	background-size: auto;
	margin: 10px auto;
	padding-top: 0;
	height: 160px;
	width: 759px;
}

#mon-reservation {
	display: block;
	margin: 10px auto 0;
	width: 965px;
}

#mon-reservation a {
	background-image: url(../images/activity/mon-house/btn_reservation.png);
	background-size: auto;
	padding-top: 0;
	height: 132px;
	width: 965px;
}

#mon-reservation a:hover {
	opacity: 0.7;
}


/*年間行事*/
#event {
	display: block;
	margin: 50px auto;
	width: 1015px;
}

#event h2 {
	background-image: url(../images/activity/ti_10.png);
	background-size: auto;
	padding-top: 0;
	height: 34px;
	width: 1015px;
}

#annual {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin: 30px auto;
	width: 800px;
}

#annual div {
	display: block;
	margin: 0;
	width: 384px;
}

}