/*　for iPhone Landscape　*/
@media screen and (max-width:850px) { 
	/* flaot解除*/
	#wrapper, #container, header, footer, .visual,  .info, .page, .link, .side01, .side02, dt.fo,dd.rm,.cont{
    float: none;
    margin: 0;
	width: auto;
  }
img{ max-width: 100%; height: auto; }

#wrapper{ /*padding-top:30px;*/  position:relative; overflow: hidden; }
header{ height: auto; }
.tell { padding:0 0 20px; float: none; margin: 0 auto; border-style: none; display: none; }
.visual img{ max-width: 100%; height: auto; }
img.photo{ float: none; margin-left: 0; }

h2{ margin-bottom: 20px; }
.page p{ clear: both; margin: 20px 15px 30px; }
.info{ margin-bottom: 50px; }
.info dl { height: 5em; }

.message a:hover span.remark {
    background: none repeat scroll 0 0 #EEFFEE;
    border: 1px solid #CCCCCC;
    color: #000000;
    display: block;
    line-height: 1.5em;
    margin: 0.3em;
    padding: 0.3em;
    position: absolute;
    top: 1.2em;
    width: 17em;
}

.schedule a{
 font-size: 20px;
  display:block;
  height:100px;
  margin:1em 0;
  padding: 1.2em 1.5em 1.5em;
  line-height:30px;
  color:#fff;
  border-radius:50px;
  text-decoration:none;
  text-align:center;
}


.resp { display: block; margin: 0 auto 20px; text-align: center; }
.motto{ text-align: left; }

.link p{ margin: -10px 0 20px; }
.infoout { margin: 20px 0;}
.posters { width: 100%; text-align: center; }
table.calendar{ width: 100%}
textarea{ width: 100%; }
textarea,input{ margin-left: 5px; }
.cont{ height: auto; }
.sent{ width: 100%; margin-left: 0; }

table.member{ width: 100%; }
/*
table.member th{ width: 100%; display: none; border-style: none; }
.shikanamea{ background-color: #eee; }
table.member td { display: block; width: 100%; border-style: none; text-align: center;}
.kuu{ width: 100%; }
*/
h2{ font-size: 28px; }
h3.katsudou01{ font-size: 25px; }
h3.katsudou02{ font-size: 25px; }
h3.katsudou03{ font-size: 25px; }

h1{ text-align: center; }
h2{ letter-spacing: 0; }
h3{ padding: 0 10px; margin:0 0 10px; }

h5{ margin: 0 10px; }
.box02 li{ margin: 0 15px; }

nav { 
	width: auto;
	padding: none;
	margin: 15px 0 20px;
}

.gnavi{ padding: 20px 10px 5px; }
.gnavi li +li{ border-style: none; }
.gnavi ul li{ display:inline-block; width: 290px; height: auto;  }
.gnavi img{ margin: -5px 20px 10px; padding-bottom: 5px;}

.gnavi ul li {
  position: relative;
  padding: 0.3em 0.3em 0.5em 0.3em;
  text-align: left;
}



/*

li.blu:before {
  position:absolute;
  content:'';
  top: 0.5em;
  left: 0.2em;
  height:0;
  width:0;
  border-style: solid;
  border-width: 6px 0 6px 9px;
  border-color: transparent transparent transparent #3F51B5;}

li.oren:before {
  position:absolute;
  content:'';
  top: 0.5em;
  left: 0.2em;
  height:0;
  width:0;
  border-style: solid;
  border-width: 6px 0 6px 9px;
  border-color: transparent transparent transparent #EE5A24;}

*/

.gnavi a:hover{ 
	padding: 0;
	margin: 0;
	background: transparent;
}




/* --- */


nav { 
  margin-top: 0;
  width: 100%;
  padding: 0;
  background: transparent;
  border-style: none;
}

.gnavi ul li{ 
  display: block; 
  width: 100%; 
  padding: 12px 30px 10px; 
  margin-left: 10px;
  background-color: #c9e7f4; 
  border-bottom: 
  solid 3px #99d1ea;
}


.gnavi ul li.oren{ background-color: #f8b300; }

.gnavi img{ margin: 0 0 0 5px; padding-bottom: 5px;}

/*

li.blu:before {
  position:absolute;
  content:'';
  top: 1em;
  left: 1em;
  height:0;
  width:0;
  border-style: solid;
  border-width: 6px 0 6px 9px;
  border-color: transparent transparent transparent #3F51B5;}

li.oren:before {
  position:absolute;
  content:'';
  top: 1em;
  left: 1em;
  height:0;
  width:0;
  border-style: solid;
  border-width: 6px 0 6px 9px;
  border-color: transparent transparent transparent #eb5a09;}

*/

/* --- */


.arrow_blu {
  position: relative;
  display: inline-block;
  padding-left: 20px;
  color: #333;
  text-decoration: none;
}
.arrow_blu:before {
  content: '';
  width: 18px;
  height: 18px;
  background: #3F51B5;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: -3px;
  margin-top: -9px;
}
.arrow_blu:after {
  content: '';
  width: 6px;
  height: 6px;
  border: 0;
  border-top: solid 2px #fff;
  border-right: solid 2px #fff;
  position: absolute;
  top: 50%;
  left: 0;
  margin-top: -3px;
  margin-left: 2px;
  transform: rotate(45deg);
}

.arrow_oren {
  position: relative;
  display: inline-block;
  padding-left: 20px;
  color: #333;
  text-decoration: none;
}
.arrow_oren:before {
  content: '';
  width: 18px;
  height: 18px;
  background: #eb5a09;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: -3px;
  margin-top: -9px;
}
.arrow_oren:after {
  content: '';
  width: 6px;
  height: 6px;
  border: 0;
  border-top: solid 2px #fff;
  border-right: solid 2px #fff;
  position: absolute;
  top: 50%;
  left: 0;
  margin-top: -3px;
  margin-left: 2px;
  transform: rotate(45deg);
}

.gnavi li  a:hover{ 
  padding-left: 20px;
  background: transparent;
}



/* --- */


table.mem002 {
    width: 100%;
  }
table.mem002 tr{  display: block; float: left; }
table.mem002 tr td, 
table.mem002 tr th {
    border-left: none;
    display: block;
    height: 70px;
  }
table.mem002 thead {
    display: block;
    float: left;
    width: 60%;
  }
table.mem002 thead tr {
    width: 100%;
  }
table.mem002 tbody {
    display: block;
    float: left;
    width: 40%;
  }
table.mem002 tbody tr {
    width: 100%;
  }






}

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

.hm_wrap{ display: none; }

}