@media screen and (max-width: 900px) {

}


@media screen and (max-width: 700px) {

}






@media screen and (max-width: 640px) {

.pc {display: none;}
.mb {display: block;}



body .container {
width: 100%;
}

header .container {
display: block;
}

header .sitetitle {
width: 100%;
}
header .sitetitle img {
margin: 0 auto;
}
header .sitetitle h1 {
padding: 10px 0;
font-size: 120%;
text-align: center;
}

header .information {
width: 100%;
margin: 5px 0;
}
header .information p {
padding: 2px 0;
text-align: center;
}
header .information .sns {
margin: 0px auto 10px;
width: 50%;
}






nav #menu{
display: none;
}
nav #menu li{
width: 100%;
background: #ffd5d5;
}
nav #menu li.home {
width: 100%;
}
nav #menu li a{
margin: 0;
padding: 15px 0;
border-bottom: 1px solid #c0c0c0;
}
nav #toggle{
display: block;
position: relative;
width: 100%;
}
nav #toggle a{
display: block;
position: relative;
padding: 12px 0 10px;
border-bottom: 1px solid #c0c0c0;
color: #723838;
text-align: center;
text-decoration: none;
}
nav #toggle:before{
display: block;
content: "";
position: absolute;
top: 50%;
left: 10px;
width: 20px;
height: 20px;
margin-top: -10px;
background: #aa5555;
}
nav #toggle a:before, #toggle a:after{
display: block;
content: "";
position: absolute;
top: 50%;
left: 10px;
width: 20px;
height: 4px;
background: #ffd5d5;
}
nav #toggle a:before{
margin-top: -5.5px;
}
nav #toggle a:after{
margin-top: 2.5px;
}



h2 {
padding: 20px 0 25px 20px;
font-size: 140%;
}

section {
width: 90%;
}



#top section {
width: 100%;
}
#top .imgwrap {
padding: 30px 0 30px;
}
#top .greet {
padding: 10px 20px;
}
#top p {
padding: 10px 0;
line-height: 140%;
font-size: 100%;
}



#coach h3 {
font-size: 120%;
}
#coach h4 {
font-size: 120%;
}
#coach img {
float: none;
margin: 10px auto;
}
#coach h5 {
padding: 10px 0 0 40px;
font-size: 100%;
}
#coach p {
padding: 0 0 0 40px;
font-size: 100%;
}




#fee h3 {
font-size: 110%;
border-left: 15px #ea9595 solid;
}
#fee table {
margin: 0 20px 30px 15px;
font-size: 100%;
}
#fee h3 span {
font-size: 90%;
}
#fee .nenkaihi table {
width: 97%;
}
#fee .nenkaihi table td {
font-size: 120%;
}
#fee .kojin table {
margin: 0 0 50px 15px;
}
#fee .kojin table td.coach {
width: 55%;
}
#fee .takkyudai table th {
width: 50%;
}
#fee .takkyudai table td.hitaiou {
text-align: left;
}
#fee .machine table {
width: 97%;
}
#fee .fee-sonota p {
font-size: 90%;
}
#fee .fee-kyousitu-title p {
font-size: 90%;
}
#fee .fee-kyousitu p {
margin: -1px 0 40px 15px;
width: 80%;
}

#fee .katoyuka p {
width: 100%;
}





#access table {
font-size: 80%;
}
#access table th {
width: 20%;
}
#access iframe {
height: 400px;
}




#schedule h3 {
width: 90%;
margin: 0 auto;
padding: 5px 0;
font-size: 90%;
}
#schedule img {
width: 90%;
margin: 0 auto 30px;
}



#contact textarea.mfjusyo,
#contact textarea.mftoi {
width: 100%;
}



footer nav ul {
padding: 0 0 35px 10px;
}
footer p {
padding: 5px 0 0 10px;
}
footer p.sitetitle {
padding: 20px 0 0 10px;
}
footer p.acc {
float: none;
padding: 5px 1em 0 10px;
}
footer p.cop {
padding: 10px 0 0 10px;
font-size: 70%;
}





}









@media screen and (max-width: 500px) {

header .information .sns {
width: 70%;
}

}



@media screen and (max-width: 400px) {

#fee h3 span {
font-size: 70%;
}

#fee table {
font-size: 90%;
}


}



@media screen and (max-width: 350px) {

header .information .sns {
width: 90%;
}

#fee h3 span {
font-size: 70%;
}

#fee table {
font-size: 90%;
}


}