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



/*===============================================
●smartphone.css  画面の横幅が640pxまで
===============================================*/


@media screen and (max-width:640px){
body{width:100%; line-height:1.5rem}	
	
#wrap{min-width: 320px;}
	
.sp {display: block !important;}
.pc {display: none;}
	
img{width:100%}
.ml30{margin-left:10px}

/*　ハンバーガーメニュー　*/
nav.menu{ width:30px; height:30px; top: 20px; right:20px; position:fixed; cursor:pointer; overflow:hidden; z-index:9999; }
nav .menu1{ width:30px; height:3px; background-color: #fff; top:0px; position:absolute; } 
nav .menu2{ width:30px; height:3px; background-color: #fff; top:11px; position:absolute; } 
nav .menu3{ width:30px; height:3px; background-color: #fff; top:23px; position:absolute; }

nav .menu1,nav .menu2,nav .menu3
{ transition: all 0.5s ease-out; -o-transition: all 0.5s ease-out; /* Opera */ -moz-transition: all 0.5s ease-out; /* Firefox */
-webkit-transition: all 0.5s ease-out; /* GoogleChrome, Safari */ -ms-transition: all 0.5s ease-out; /* IE */ }

nav .menuclick1	{ top:8px; -o-transform: rotate(405deg); -moz-transform: rotate(405deg); -webkit-transform: rotate(405deg);-ms-transform: rotate(405deg); transform: rotate(405deg); }
nav .menuclick2	{ background-color:rgba(255,255,255,0);  }
nav .menuclick3	{ top:8px; -o-transform: rotate(-405deg); -moz-transform: rotate(-405deg);-webkit-transform: rotate(-405deg); -ms-transform: rotate(-405deg); transform: rotate(-405deg); }

#menu{
position: fixed;
display: none;
right: 0px;
top: 40px;
list-style-type: none;
background-color: rgba(0, 28, 88, 0.8);
padding: 20px;
z-index: 9999;
font-size:200%;
line-height:2em;
}
ul#menu li{border-bottom:1px solid #fff; padding-bottom:5px; margin-top:5px}
/*　ハンバーガーメニュー　*/

#fut01{
	background-img: url(../img/back01.jpg);
	background-size:150%;
	width: 100%;
	min-height: 230px;
	padding:0 0 30px;
	position: relative;
}
#fut01::before{
	background-color: rgba(0, 28, 88, 0.3);
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	content: ' ';
}

#fut01 h1{z-index:100; position:relative}
#fut01 h1 img{ width:60%}
.res_coat{height:28px; top: 20px; right:60px; position:fixed !important;z-index:9999;}
.res_coat img{height:28px; width:auto}

.logo{float:none; padding-top:30px}

.news{
	margin: 0;
	padding: 20px 0 10px 30px;
	border-bottom: 3px solid #FFF;
	width: 80%
}

#guide, #reservation, #league{
	background: url(../img/bg.jpg) repeat; 
	background-size:auto;
	width: auto;
	min-height: auto;
	padding-top:30px;
}

h2{margin:0; border-top:2px solid #fff; border-right:2px solid #fff; border-bottom:2px solid #fff; padding:10px 30px; display:inline; font-size:120%}

.inside{
	margin: 30px 0 40px 10px;
	box-shadow: none;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	background-color:rgba(0, 0, 0, 0);
	padding: 0;
	width: 95%
}
.inside2{
	margin: 30px 0 40px 10px;
	padding:0; width:95%
}

h3.mt40{margin-top:20px}

.btn-grad {
	font-size: 130%;
	width: auto;
	margin: 0 0 0 20px;
	padding: 20px;
	top:30px
}

.aft_btn{
	margin: 40px 0 0 10px;
	font-size: 90%
}
.league_btn_pre{margin-bottom:15px}
.league_btn_aft{margin-top:70px}

.lineBox{
	width: 90%;
	padding: 10px;
	margin: 40px 0
}

#school{
	width: 100%;
	min-height: auto;
	padding-top: 30px;
	background: url(../img/back05.jpg) ;
	background-size: auto 102%;
	padding-bottom: 10px;
}
.school_box_L,.school_box_R{
	margin: 20px auto;
	float: none;
	width: 85%;
	min-width: 300px;
	overflow: hidden;
	border: 1px solid #fff;
}
.school_box_in img{width:47%}
.mr30{ margin-right:10px}

dl.ladies dt{float:none; width:100%}
dl.ladies dd{ float:none; width:100%}

ul.foot{position:relative; bottom:-2px; left:10px}
ul.foot li{float:none; margin-right:0}

}