@charset "shift_jis";

@import url('https://fonts.googleapis.com/css2?family=Barlow:wght@400;500&family=Dancing+Script:wght@700&family=Noto+Sans+JP:wght@400;500;700&display=swap');

/*----------------■初期設定----------------*/
* {
	margin:  0;
	padding:  0;
	font-weight:  normal;
	font-style:  normal;
	font-size: 100%;
}
ul,ol  {
	list-style:  none;
}
table  {
	border-collapse:  collapse;
}
th,td  {
	text-align:  left;
	vertical-align:  top;
}
img {
	border: none;
	vertical-align:top;
	max-width:100%;
}
iframe{max-width:100%;}

 /* リンク色の初期値 */
a:link { text-decoration:underline;color:#00b;font-weight:bold;}
a:visited { text-decoration:underline;color:#00b;font-weight:bold;}
a:hover { text-decoration:underline;color:#f00;font-weight:bold;}
a:active { text-decoration:underline;color:#333;font-weight:bold;}
a[name]:hover { text-decoration:none;color:#000;font-weight:bold;}
 
/*----------------■よく使うもの----------------*/
.clear  {
	clear:  both;
}
.clearfix:after {
	content:".";
	display:  block;
	clear:  both;
	height:  0;
	visibility:  hidden;
	overflow: hidden;/* 隙間対応 */
	font-size: 0.1em;/* 隙間対応 */
	line-height: 0;/* 隙間対応 */
}
.clearfix  {
	zoom:  1;
}

/*----------------■基本設定----------------*/

body {
	background:  #fff;
	color: #000;
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 15px;
	line-height:  1.4;
	text-align:center;
}


.head{text-align:left;padding:20px 5%;}
.head img{width:219px;}
.head a:hover img { /* 画像オンマウス処理 */
	-moz-opacity:0.7;
	opacity:0.7;
	filter: alpha(opacity=70);
}

.foot{padding:30px 0;background:#ddd;}

.main{background:url(../image/bg.png);margin:0 auto;max-width:1000px;background-size:100% auto;}

h1{position:relative;}
#block01,#block02,#block03{margin-top:20px;position:relative;}
.btn01,.btn02,.btn03,.btn04{position:absolute;display:block;}
.btn03 a:after,.btn04 a:after{font-size:0;content:".";width:100%;border-radius:60px;height:100%;top:0;left:0;display:block;position:absolute;box-shadow:15px 15px 0px 0px rgba(0, 0, 0, 0.2);}
.btn03 img,.btn04 img{transition:all .4s;}
.btn03:hover img,.btn04:hover img{transform:translate(4px,4px);-webkit- transform:translate(4px,4px);}
.btn03 a,.btn04 a{position:relative;display:block;margin:0 auto;}

.kome_text{background:#F0EDE6;}
.kome_text p{color:#102C69;font-weight:500;}

.white{background:#fff;padding:30px 0;text-align:left;}

.open_notice_btn{cursor:pointer;padding:10px 0;font-size:20px;text-align:center;font-weight:bold;border:1px solid #000;}
.open_notice_btn i{margin-left:20px;}

.panel-down #notice_btn_open{display:none;}
.panel-up #notice_btn_close{display:none;}

#notice{display:none;background:#eee;padding:20px 5%;font-size:95%;}

/*----------------■大画面----------------*/
@media screen and (min-width: 767px) {

.dis_sp{display:none;}
.head{padding:30px 0;margin:0 auto;max-width:940px;}

.btn01,.btn02{width:50%;}
.btn01{top:60%;left:25%;}
.btn02{top:80%;left:25%;}

.btn03,.btn04{width:30%;top:89%;left:35%;}

.kome_text{padding:20px 0;font-size:18px;}

}




/*----------------■小画面----------------*/
@media screen and (max-width: 766px) {

.dis_pc{display:none;}

.btn01,.btn02{width:70%;}
.btn01{top:50%;left:15%;}
.btn02{top:75%;left:15%;}

.btn03,.btn04{width:50%;top:86.5%;left:25%;}
.kome_text{padding:20px 5%;text-align:left;}

.white{padding-left:5%;padding-right:5%;}

}


.notice li {
	text-indent: -1.2em;
	margin-left: 1.2em;
}

.notice > ul > li {
	margin-bottom: 0.25em;
}

.notice > ul {
	margin-bottom: 1em;
}

@media (max-width: 1000px) {
	.notice {
		width: 94%;
		margin: 2em auto 1em;
		font-size: 90%;
	}
}


#notice section {
	margin: 2em 0;
}

@media (max-width: 1000px) {
	#notice {
		width: 94%;
		margin: auto;
	}
}

#notice section h2 {
	color: #e60012;
	font-size: 1.3rem;
	font-weight: bold;
	margin-top: 1.5rem;
}

#notice section h3 {
	color: #e60012;
	font-size: 1rem;
	font-weight: bold;
	margin-top: 0.7em;
}

#notice section h4 {
	font-weight: bold;
	margin-top: 0.52rem;
}

#notice section ul li {
	text-indent: -1.2em;
	margin-left: 1.2em;
}

#notice section > ul > li:first-letter {
	color: #e60012;
}

#notice section table {
	width: 100%;
	margin:1em 0;
	border-bottom: solid 1px #666;
}

#notice section th {
	border-top: solid 1px #666;
	border-right: solid 1px #666;
	padding: 0.25em 0.5em 0.25em 0;
}

#notice section .no1 th,
#notice section .no2 th {
	width: 30%;
}

#notice section td {
	border-top: solid 1px #666;
	padding: 0.25em 0 0.25em 0.5em;
}

#notice section .note {
	text-indent: -1em;
	margin: 0.25em 0 0.25em 1em;
}

@media (max-width: 1000px) {
	#notice section .no1 th,
	#notice section .no2 th {
		width: 35%;
	}
}