@charset "UTF-8";
/* リセット */
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td {
  margin: 0;
  padding: 0;
  font-size: 100%;
  list-style: none;
}
img {
  vertical-align: bottom;
  max-width: 100%;
}
body {
  /*	font-family: '游明朝','Yu Mincho',YuMincho,'Hiragino Mincho Pro',serif;*/
  font-family: 'Arial', YuGothic, 'Yu Gothic', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'メイリオ', Meiryo, 'ＭＳ ゴシック', sans-serif
}

/* ヘッダー設定 */
.contener_menu{
  width: 300px;
  position: fixed;
float: left;
}
@media (max-width: 900px){
  .contener_menu{
    display: none;
  }
}
.top_logo {
  width: 175px;
  margin-top: 1.4em;
  margin-left: auto;
  margin-right: auto;
}
@media (max-width: 900px){
  .top_logo {
    width: 150px;
  }
}
.menu{
  margin-top: 2em;
  text-align: center;
}
.menu ul a{
  text-decoration: none;
  font-size: 15px;
  color: #000;
  line-height: 2.6em;
}
.menu ul a:hover{
  color: #7F789C;
  webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
.adress_top{
  margin-top: 3em;
  font-size: 14px;
  color: #000;
  text-align: center;
  line-height: 1.8em;
}
.sns{
  margin-top: 1em;
width: 100%;
 text-align: center;
}
/* メニューのデザイン*/
.nav_content {
  width: 300px;
  height: 100%;
  position: fixed;
  top: 0%;
  right: 100%; /* メニューを画面の外に飛ばす */
  z-index: 99;
  background: #FFF;
  transition: .5s;
  text-align: center;
  /* padding-top: 20px; */
}
@media (max-width: 900px){
  .nav_content {
    width: 270px;
  }
}
.nav_list{
  padding-top: 20px;
}
.nav_content li a{
  color: #000;
  text-decoration: none;
    font-size: 15px;
    color: #000;
    line-height: 2.6em;
}
@media (min-width: 900px){
  .nav_content {
    display: none;
  }
}

/* アイコンがクリックされたらメニューを表示 */
#drawer_input:checked ~ .nav_content {
  right: 0;
}

/* CSSコード */
.header {
  /* padding: 0 20px; */
  position: relative;
}

/* ここから下がハンバーガーメニューに関するCSS */

/* チェックボックスを非表示にする */
.drawer_hidden {
  display: none;
}

/* ハンバーガーアイコンの設置スペース */
.drawer_open {
  position: absolute;
  left: 14px;
  top: 27px;
  z-index: 100;
  cursor: pointer;
    font-weight: bold;
}
.box{
  position: absolute;
  position: fixed;
  left: 0px;
  top: 0px;
  padding: 1.5em 1.5em;
  border: solid 4px #FFFFFF;
  background: #FFFFFF;
  opacity: 0.5;
}
.drawer_hidden{
}

/* ハンバーガーメニューのアイコン */
.drawer_open span,
.drawer_open span:before,
.drawer_open span:after {
  content: '';
  display: block;
  height: 3px;
  width: 30px;
  border-radius: 3px;
  background: #333;
  transition: 0.5s;
  position: absolute;
  ;

}
.drawer_open{
  position: fixed;
}

@media (min-width: 900px){
  .drawer_open{
    display: none;
  }
}

/* 三本線の一番上の棒の位置調整 */
.drawer_open span:before {
  bottom: 10px;
}

/* 三本線の一番下の棒の位置調整 */
.drawer_open span:after {
  top: 10px;
}

/* アイコンがクリックされたら真ん中の線を透明にする */
#drawer_input:checked ~ .drawer_open span {
  background: rgba(255, 255, 255, 0);
}

/* アイコンがクリックされたらアイコンが×印になように上下の線を回転 */
#drawer_input:checked ~ .drawer_open span::before {
  bottom: 0;
  transform: rotate(45deg);
}

#drawer_input:checked ~ .drawer_open span::after {
  top: 0;
  transform: rotate(-45deg);
}

/* FV設定 */
.contener_main{
  margin-left: 300px;
  background: #F1F1F1;
  padding-bottom: 1em;
}
.contener_photo{
  width: auto;
height: 38vh;
margin-bottom: 0;
background-image: url(../img/contact-top.png);
background-position: center center;
background-size: cover;
background-color: #464646;
}
.contener_mma{
  margin-top: 4em;
  text-align: center;
}
.contener_mma h1{
  font-size: 26px;
  margin-bottom: 0.4em;
}
.contener_mma h1 br{
  display: none;
}
.contener_mma h3{
  margin-top: 1em;
  line-height: 1.8em;
  font-size: 15px;
  font-weight: normal;
}
.contener_mma h3 span{
  margin-top: 0em;
  font-size: 20px;
  font-weight: bold;
}
@media (max-width: 580px){
  .contener_mma{
    width: auto;
    padding-left: 1.2em;
    padding-right: 1.2em;
    text-align: center;
  }
  .contener_mma h1 br{
    display: block;
  }
  .contener_mma h3 {
    text-align: justify;
  }
  .contener_mma h3 br{
    display: none;
  }
}
@media (max-width: 900px){
  .contener_main{
    margin-left: 0px;
  }
}
/* class紹介設定 */
.contener_class{
  margin-top: 4em;
  margin-bottom: 5em;
}
.contener_class:after{
  content: "";
  display: block;
  clear: both;
}
.contener_class h1{
  font-size: 26px;
  width: 130px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 0.4em;
}
.contener_class img{
  margin: auto;
  display: block;
}
.class-box{
  width: 75%;
  margin-left: auto;
  margin-right: auto;
  margin-top: 2em;
}
@media (max-width: 580px){
  .class-box {
    width: 90%;
}
}
.contener_class h3{
  /* margin-top: 1em; */
  line-height: 1.8em;
  font-size: 18px;
  margin-bottom: .8em;
  text-align: center;
  background: #D3DCF0;
  padding: 6px 0 6px 0;
}
.contener_class h4{
  /* margin-top: 1em; */
  line-height: 1.8em;
  font-size: 18px;
  margin-bottom: .8em;
  text-align: center;
  background: #efd3e6;
  padding: 6px 0 6px 0;
}

.class_mma ul li {
    text-align: justify;
    padding-bottom: 1.5em;
}
.class_kids ul li {
    text-align: justify;
}
.contener_class p{
  font-size: 16px;
}
/* 料金設定 */
.contener_price{
  margin-top: 4em;
  text-align: center;
    padding-bottom: 2em;
}
.contener_price h1{
  font-size: 26px;
  margin-bottom: 0.4em;
}
.contener_price h3{
  margin-top: 1em;
  line-height: 1.8em;
  font-size: 16px;
  font-weight: normal;
}
@media (max-width: 580px){
  .contener_price{
    width: auto;
    padding-left: 1.2em;
    padding-right: 1.2em;
  }
  .contener_price h3 {
      text-align: justify;
  }
  .contener_price h3 br {
    display: none;
}
}

/* テーブルデザイン設定 */
.table_design {
 width: 75%;
 border-collapse: collapse;
 border-spacing: 0;
margin-left: auto;
margin-right: auto;
border-bottom: dashed 1px #778ca3;
}
.table_design tr {
 border-top: dashed 1px #778ca3;
 font-size: 14px;
}
.table_design th {
 padding: 0px 20px 0px 20px;
 height: 4.5em;
 background: #e9faf9;
}
.table_design td {
 padding-left: 3em;
 height: 4.5em;
 /* background: #FFF; */
}
@media (max-width: 580px){
  .table_design {
   width: 90%;
  }
  .table_design td {
    padding-left: 1em;
}
.table_design th {
 height: 6em;
}
}


/* テキストフォーム設定 */
form{
  width:auto;
	margin-top: 2.2em;
  /* margin:0 auto; */
}
form input[type="text"],
form input[type="email"]{
  width: 80%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}
form textarea {
  width: 100%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}
@media (max-width: 768px){
  form{
  width: 100%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
  }
  form input[type="text"],
  form input[type="email"]{
    width: 100%;
  }
}
.item{
  overflow: hidden;
  margin-bottom: 2em;
}
.label{
	float: left;
	margin-right: 20px;
	width: 100%;
	padding-bottom: .4em;
}
input[type="text"],input[type="email"]{
  border: solid 1px #aaa;
  border-radius:5px;
  padding:10px;
  font-size: 15px;
}
input[type=checkbox] {
  transform: scale(1);
}

textarea{
  border: solid 1px #aaa;
  border-radius:5px;
  padding: 10px;
  height: 160px;
  font-size: 15px;
}
.btn-area{
  text-align: center;
}

input[type="submit"]{
	background: #2e235e;
	border: none;
	color: #ffffff;
	font-size: 17px;
	font-weight: normal;
	padding: 10px 60px;
	margin-bottom: 2em;
	/* margin: 0 5px; */
	border-radius: 6px;
}

input[type="submit"]:hover{
	opacity:0.7;
  webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
.item span{
	color:#ffffff;
	background: #cc0022;
	font-size: 12px;
	padding: .3em;
	margin-left: .5em;
}
/* チェックボックス設定 */
input[type=checkbox] {
  transform: scale(1.5);
	margin-left: .5em;
	margin-bottom: .5em;
	margin-right:.5em;
}
/* テーブル設定 */
table th{
	font-weight: normal;
}
.table table{
	width: 100%;
	border-collapse: collapse;
	padding: 0;
	background: #000000;
	color: #ffffff;
	width: 100%;
}
.table a{
	text-decoration: none;
	color: #ffffff;
	padding-top: 2em;
}
.first{
	border-top: solid 1px #ffffff;
}
.first th{
	padding-top: 1em;
	padding-bottom: 1em;
}
.second th{
	border-top: solid 1px #ffffff;
	border-bottom: solid 1px #ffffff;
	padding-top: 1em;
	padding-bottom: 1em;
}
@media (min-width: 1080px){
	.table{
		display: none;
	}
}

/* 自由に編集下さい */
#formWrap {
	width:650px;
	margin:0 auto;
	color:#555;
	line-height:120%;
	font-size:90%;
}
table.formTable{
	width:650px;
	margin:0 auto;
	border-collapse:collapse;
}
table.formTable td,table.formTable th{
	border:1px solid #ccc;
	padding:10px;
  background: #FFF;
}
table.formTable th{
	width:30%;
	font-weight:normal;
	background:#d7d7d7;
	text-align:left;
}
p.error_messe{
	margin:5px 0;
	color:red;
}
input[type="submit"]{
	margin-top: 2em;
}

/*　簡易版レスポンシブ用CSS（必要最低限のみとしています。ブレークポイントも含め自由に設定下さい）　*/
@media screen and (max-width:680px) {
#formWrap {
	width:100%;
	margin:0 auto;
}
table.formTable th, table.formTable td {
	width:auto;
	display:block;
}
table.formTable th {
	margin-top:5px;
	border-bottom:0;
}
input[type="submit"], input[type="reset"], input[type="button"] {
	display:block;
	width:80%;
	height:40px;
	margin-top: 2em;
	margin-bottom: 3em;
}
table.formTable{
	width: auto;
}
}
.mail-cyuui{
	margin-top: .6em;
}
.mail-cyuui p{
	line-height: 1.5em;
}

  /* footer設定 */
  footer {
    background: #2E235E;
    margin-left: 300px;
  }
  @media (max-width: 900px) {
    footer {
      margin-left: 0px;
    }
}
  .footer_wrapper {
    width: 330px;
    margin-left: auto;
    margin-right: auto;
  	text-align: center;
  }
  .footer_wrapper img {
    margin-top: 1em;
  	margin-bottom: .5em;
  }
    @media (max-width: 900px) {
      .footer_wrapper {
        width: 100%;
      }
    }
  /* 問合せボタン */
  .contact_buttom {
    text-align: center;
    background: #FFF;
    color: #2E235E;
    padding: .4em .4em;
    font-size: 16px;
    border-radius: 6px;
    width: 160px;
    margin-top: .4em;
    margin-left: auto;
    margin-right: auto;
  }
  .contact_buttom a {
    text-decoration: none;
    color: #2E235E;
  }
  .contact_buttom:hover {
    opacity: 0.7;
    webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
  }
  .footer_tel {
    text-align: center;
    margin-top: .4em;
  }
  .footer_tel p {
    font-size: 18px;
    font-weight: bold;
    color: #FFF;
  }
  .footer_tel span {
    font-size: 14px;
    font-weight: normal;
  }
  .footer_ad p {
    font-size: 14px;
    color: #FFF;
    text-align: center;
    margin-top: .2em;
  }

  /* コピーライト設定 */
  .copyright {
    background-color: #2E235E;
  }
  .copyright p {
    font-size: 15px;
    padding-top: 1.2em;
    padding-bottom: 1.8em;
    color: white;
    text-align: center;
  }