﻿
@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 .sitetitle h1 {
font-size: 80%;
}
header .sitetitle h2 {
padding: 1px 0;
font-size: 140%;
}

header .headertop .sitetitle h1 {
padding: 8px 0 0;
text-align: left;
font-size: 150%;
line-height: 100%;
}
header .headertop .sitetitle h1 span {
display: block;
font-size: 50%;
}







nav #menu{
display: none;
}
nav #menu li{
width: 100%;
border-top: 0px #333333 solid;
border-bottom: 0px #333333 solid;
border-right: 0px #333333 solid;
border-legt: 0px #333333 solid;
}
nav #menu li.home {
width: 100%;
border: 0px #333333 solid;
}

nav #menu li a{
margin: 0;
padding: 15px 0;
border-bottom: 1px solid #c0c0c0;
}
nav #menu li.flow a {
padding: 15px 0;
font-size: 100%;
}

nav #toggle{
display: block;
position: relative;
width: 100%;
}
nav #toggle a{
display: block;
position: relative;
padding: 12px 0 10px;
border-top: 1px solid #c0c0c0;
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: #725538;
}
nav #toggle a:before, #toggle a:after{
display: block;
content: "";
position: absolute;
top: 50%;
left: 10px;
width: 20px;
height: 4px;
background: #ffffff;
}
nav #toggle a:before{
margin-top: -5.5px;
}
nav #toggle a:after{
margin-top: 2.5px;
}



#top .mokuteki p {
font-size: 120%;
}

#top .sien {
width: 233px;
}
#top .sien p {
font-size: 100%;
}




#chairman .container {
display: block;
}
#chairman .portrait img {
display: block;
margin: 30px auto;
}
#chairman p {
letter-spacing: 0.1em;
line-height: 150%;
font-size: 100%;
}



#chairman p.junbi,
#youtube p.junbi {
font-size: 150%;
}





#association table,
#association th,
#association td {
font-size: 90%;
}
#association table {
width: 95%;
}
#association th {
padding: 20px 2px;
width: 70px;
}






#access section.access {
margin: 30px 10px;
}
#access section.access p {
font-size: 120%;
}
#access section.access p span {
font-size: 75%;
}









#media section {
width: 90%;
}





#contact table {
width: 95%;
}
#contact th {
width: 20%;
}

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




footer {
margin: 80px 0 0;
}
footer p {
text-align: center;
line-height: 180%;
font-size: 90%;
}
footer p.sitetitle {
font-size: 130%;
}





}









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



#contact th {
padding: 10px  3px;
width: 80px;
}


}






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


#contact td input {
width: 160px;
}


}


























