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




	#conteiner{
		width: 100%;
		background: #fff;
		font-size: 12px;
	}
	.none{
		display: none;
	}






body{
	font-size: 80%;
}

/* drawer menu */
.drawer-menu {
    box-sizing: border-box;
    position: fixed;
    top: 0;
    right: 0;
    width: 300px;
    height: 100%;
    padding:50px 0;
    background: #222;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: .5s;
    transition-duration: .5s;
    -webkit-transition-delay: 0s;
    transition-delay: 0s;
    -webkit-transform-origin: right center;
    -ms-transform-origin: right center;
    transform-origin: right center;
    -webkit-transform: perspective(500px) rotateY(-90deg);
    transform: perspective(500px) rotateY(-90deg);
    opacity: 0;
}
.drawer-menu ul {
	list-style-type:none;
}
.drawer-menu li {
    text-align: center;
	margin: 0%;
	    color: #fff;
}

.drawer-menu li a {
    display: block;
    height: 50px;
    line-height: 50px;
    font-size: 14px;
    color: #fff;
    -webkit-transition: all .8s;
    transition: all .8s;
}

.drawer-menu li a:hover {
    color: #1a1e24;
    background: #fff;
}

/* checkbox */
.check {
    display: none;
}

/* menu button - label tag */
.menu-btn {
    position: fixed;
    display: block;
    top: 0px;
    right: 0px;
    display: block;
    width: 44px;
    height: 45px;
    font-size: 10px;
    text-align: center;
	background: #F3EEFF;
    cursor: pointer;

    z-index: 3;
}

.bar {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 36px;
    height: 1px;
	margin: 0 0 0 4px;
    background: #454545;

    -webkit-transition: all .5s;
    transition: all .5s;
    -webkit-transform-origin: left top;
    -ms-transform-origin: left top;
    transform-origin: left top;
}
.bar.top {
    top: 5px;
    opacity: 1;
}

.bar.middle {
    top: 15px;
    opacity: 1;
}

.bar.bottom {
    top: 25px;
    -webkit-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
}

.menu-btn__text {
    position: absolute;
    top: 30px;
    bottom: -15px;
    left: 0;
    right: 0;
    margin: auto;
    color: #454545;
    -webkit-transition: all .5s;
    transition: all .5s;
    display: block;
    visibility: visible;
    opacity: 1;
}

.menu-btn:hover .bar {
    background: #999;
}

.menu-btn:hover .menu-btn__text {
    color: #999;
}

.close-menu {
    position: fixed;
    top: 0;
    right: 300px;
    width: 100%;
    height: 100vh;
    background: rgba(0,0,0,0);
    cursor: url(http://theorthodoxworks.com/demo/images/cross.svg),auto;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: .3s;
    transition-duration: .3s;
    -webkit-transition-delay: 0s;
    transition-delay: 0s;
    visibility: hidden;
    opacity: 0;
}

/* checked */
.check:checked ~ .drawer-menu {
    -webkit-transition-delay: .3s;
    transition-delay: .3s;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
    opacity: 1;
    z-index: 2;
}




.title{
	width: 40%;
	margin: 3% 5% 2% 5%;
	z-index: 10;
	float: left;
}
.tel{
	width: 35%;
	border:1px solid #000;
	margin: 13% 5% 0% 5%;
	padding: 0.7% 1.5%;
	float: right;
}
.news{
	border:1px solid #000;
	margin: 0% 5% 1% 5%;
	padding: 1% 3%;
}
.menu{

	padding: 0% 0% 1% 0%;
	clear: both;



}

.insta{
	width: 90%;
	margin: 0% 5%;
	background: #f00;
}
.ins2{
	margin: 0% auto;

}
.menumenu2{
	width: 86%;
	margin: 0% 7%
}
.main-menu{
	border-left:1px solid #999;
   text-shadow:2px 2px 0 #FFF, -2px -2px 0 #FFF,
              -2px 2px 0 #FFF, 2px -2px 0 #FFF,
              0px 2px 0 #FFF,  0px -2px 0 #FFF,
              -2px 0 0 #FFF, 2px 0 0 #FFF;

}
.main-menu2{
	border-right:1px solid #999;
	border-left:1px solid #999;
  text-shadow:2px 2px 0 #FFF, -2px -2px 0 #FFF,
              -2px 2px 0 #FFF, 2px -2px 0 #FFF,
              0px 2px 0 #FFF,  0px -2px 0 #FFF,
              -2px 0 0 #FFF, 2px 0 0 #FFF;

}
.menu ul {
	top: 15%;
	right: 0px;
	width: 100%;
	list-style-type: none;
	margin: 0% 0% 0% 0%;
	padding: 0% 0%;
	overflow: hidden;
	background: linear-gradient(25deg, rgba(255, 224,192,0.2), rgba(255,250,244, 0.2)) ,url(../jpg/mbg.jpg);
	z-index: 10;

}
.menu li {
	float: left;
	width: 16.6%;
	margin: 0% 0% 0% 0%;

}

.menu li a {
	display: block;
	color:#1A0D00;
	text-align: center;
	padding: 42% 10%;
	text-decoration: none;

}

.menu li a:hover:not(.active) {
	background: #fff;

}
.care{
	margin: 1% 0% 0% 0%;
}
.yykl img{
	float: right;
	width: 50%;
	margin: 3% auto;
	float: left;
/*  box-shadow: 2px 2px #432200;
  z-index: 1;
  box-sizing: border-box;*/
}

.ctel img{
	float: left;
	width: 50%;
	margin: 3% auto;
	float: right;
/*   box-shadow: 2px 2px #432200;
  z-index: 1;
  box-sizing: border-box;*/
}

.yyk{
	clearfix:"";
	width: 100%;
	margin: 0% auto;

}
.smenu{

	width: 96%;
	margin: 0% 0% 0% 5%;
	padding: 0% 2%;
	clear:both;
	border-bottom: 1px solid #999;
}

.menu2:after {
	content: "";
	display: block;
	clear: both;
}
 
.menu2:before {
　　　　content: "";
	display: block;
	clear: both;
}
 
.menu2 {
	display: block;
	margin: 0% 0% 0% 3%;
	padding: 0% 2% 2% 0%;
}

.menu2 font{
	color:#f00;
	font-size: 120%;
}
.menu2 table{
	border-spacing:0;
	margin: 1% 0%;
	width: 100%;
}
.menu2 .bg{
	background: #FFF7EF;
}
.menu2 .bg2{
	border:1px solid #EEC296;
}

.menu2 .bg2 .en{
	color:#f00;
	font-size: 140%;
}
.menu2 .bg2 .en2{
	color:#1A0D00;
	font-size: 100%;
	text-decoration: line-through; 
}
.menu2 td{
	width: 60%;
	padding: 1.5% 2% 1% 2%;
	border: none;
	font-size: 80%;
}
.menu2 p{
	
	width: 100%;
	margin: 3% 5% 3% 0%; 
	font-size: 80%;
}
.smenu img{


}
.smenu h4{
	background-image:url(../jpg/h4.gif);
	background-repeat:  no-repeat;            
    	background-position: 0% 5%;   
  background-size: 6%;

	width: 94%;
	padding: 0% 0% 0.5% 6%;
	margin: 2% 0% 0% 0%;
	font-size: 120%;
	font-weight: normal;

}
.menu3{
	float: left;
	width: 100%;
}
.menusp{
	width: 100%;
	margin: 2% 0%;
}

.menu-img{
	float: right;
	width: 48%;
}
.menu-img2{
	float: right;
	width: 48%;
}
.menu-imgsp{
	width: 90%;
}
.img2{
	float: right;
	width: 50%;
}
.menu2 .kome{
	clear: both;

}
.kome2{
	text-align: left;
	width: 100%;
	margin: 0% 0%;
	padding-left:1em;
	text-indent:-1em;
}
.kome2 img{
	width: 100%;
}
.kome3{
	width:100%;
	margin:3% 0% 0% 0%;
	font-size: 80%;
	padding-left:1em;
	text-indent:-1em;
}
.kome4{
	width:100%;
	margin:3% 0% 0% 0%;
	font-size: 80%;
	padding-left:1em;
	text-indent:-1em;
}
.tmenu{

	width: 90%;
	margin: 0% 0% 0% 5%;
	padding: 0% 2%;
	clear:both;

}

.thn{
	overflow:auto;
	margin: 1% 0% 0% 3%;
	padding: 0% 2% 2% 0%;
	font-size: 60%;
}

.thn-right{
	float: right;
	width: 58%;
}
.thn img{
	width: 88%;
	margin: 0% 6%;
	
}
.thn strong{
	font-size: 180%;
	font-weight: normal;
	font-family:serif;
	color: #EA811B;
}
.thn font{
	font-size: 150%;
	color: #F00;
}
.thn-m{
	margin: 2% 1%;
}
/*ボタン装飾*/
.hidden_box h4  {
	background: none;
    padding: 1% 1% ;
    border: solid 1px #E87500;
	width: 90%;
	text-align: center;
	margin: 2% 5% 0% 5%;
	font-size: 110%;
	font-weight: normal;
cursor: pointer;
cursor: hand;

}
/*ボタンホバー時*/
.hidden_box h4:hover {
    background: #E87500;
}

/*チェックは見えなくする*/
.hidden_box input {
    display: none;
}

/*中身を非表示にしておく*/
.tmenu .thn {
    height: 0;
    padding: 0;
	margin: 1% 2%;
    overflow: hidden;
    opacity: 0;
    transition: 1s;
}

/*クリックで中身表示*/
.hidden_box input:checked ~ .thn {
    padding: 1% 0;
    height: auto;
    opacity: 1;
}

.order{
	width: 80%;
	margin: 6% auto 8% auto;
	padding: 2% 1%;
	text-align: center;
	border: 1px solid #E87500;
}
.order a{
	color:#3D1F00;
}
.thn-m .order:hover {
    background: #E87500;
	color: #fff;
}

.access .alist{
	padding: 1% 0% 2% 2%;

}
.access .alist2{
	border-top: 1px solid #999;
	padding: 3% 2% 3% 2%;
}
.access .alist2 a{
	color: #000;
}
.access .alist3{
	clear: both;
	border-top: 1px solid #999;
	border-bottom: 1px solid #999;
	padding: 1% 2%;

}
.access .alist3::after{
content:"";
clear: both;
display:block;

}

.gallery li {
	list-style-type: none;
  float: left;
  position: relative;
  width: 23%;
  margin: 0.5% 2% 2% 0%;
  border: 5px solid #fff;
  background: #fff;
  box-shadow: 5px 5px 5px #222;
  z-index: 1;
  box-sizing: border-box;
}
.gallery .photo1 {
  transform: rotate(-5deg);
}
.gallery .photo2 {
  transform: rotate(3deg);
}
.gallery .photo3 {
  transform: rotate(-3deg);
}
.gallery .photo4 {
  transform: rotate(5deg);
}
.gallery .photo5 {
  transform: rotate(5deg);
}
.gallery .photo6 {
  transform: rotate(-3deg);
}
.gallery .photo7 {
  transform: rotate(3deg);
}
.gallery .photo8 {
  transform: rotate(-5deg);
}
.gallery li:hover {
  z-index: 10;
  transform: scale(4) rotate(0deg);
}

.a-left{
	float: left;
	width: 20%;
}
.a-right{
	float: left;
	width: 80%;
}



.staff{
		clear: both;
}
.prf{
	width: 65%;
	margin: 1% 0% 5% 0%;
	float: right;

}
.prf .name{
	font-size: 100%;
	margin: 2% 0% 0% 0%;
}
.prf .list{
	margin: 3% 0% 0% 0%;
	padding: 0% 0% 0% 0%;
	border-top: 1px solid #999;
	border-bottom: 1px solid #999;

}
.prf ul{
	margin: 0% 0% 0% 0%;
	padding: 0% 0% 0% 0%;
	border-bottom: 1px solid #999;
	list-style-type: none;

}
.prf li{
	margin: 0% 0% 0% 3%;
	padding: 3% 0% 3% 0%;
	font-size: 80%;
}
.prf2{
	width: 25%;
	margin: 0% 1% 0% 5%;
	float: left;
}
.prf .name font{
	font-size: 80%;
}
.comment{
	margin: 0% 3%;
	clear: both;
}
.comment p{
	width: 96%;
	margin: 0% 0% 0% 4%;
}





/*==================================================
スライダーのためのcss
===================================*/
.slider {/*横幅94%で左右に余白を持たせて中央寄せ*/
    width:94%;
    margin:0 auto;
}

.slider img {
    width:70vw;/*スライダー内の画像を60vwにしてレスポンシブ化*/
    height:auto;
}

.slider .slick-slide {
	transform: scale(0.8);/*左右の画像のサイズを80%に*/
	transition: all 1s;/*拡大や透過のアニメーションを0.5秒で行う*/
	opacity: 0.5;/*透過50%*/
}

.slider .slick-slide.slick-center{
	transform: scale(1);/*中央の画像のサイズだけ等倍に*/
	opacity: 1;/*透過なし*/
}


/*矢印の設定*/

/*戻る、次へ矢印の位置*/
.slick-prev, 
.slick-next {
    position: absolute;/*絶対配置にする*/
    top: 42%;
    cursor: pointer;/*マウスカーソルを指マークに*/
    outline: none;/*クリックをしたら出てくる枠線を消す*/
    border-top: 2px solid #666;/*矢印の色*/
    border-right: 2px solid #666;/*矢印の色*/
    height: 15px;
    width: 15px;
}

.slick-prev {/*戻る矢印の位置と形状*/
    left: -1.5%;
    transform: rotate(-135deg);
}

.slick-next {/*次へ矢印の位置と形状*/
    right: -1.5%;
    transform: rotate(45deg);
}

/*ドットナビゲーションの設定*/

.slick-dots {
    text-align:center;
	margin:20px 0 0 0;
}

.slick-dots li {
    display:inline-block;
	margin:0 5px;
}

.slick-dots button {
    color: transparent;
    outline: none;
    width:8px;/*ドットボタンのサイズ*/
    height:8px;/*ドットボタンのサイズ*/
    display:block;
    border-radius:50%;
    background:#ccc;/*ドットボタンの色*/
}

.slick-dots .slick-active button{
    background:#333;/*ドットボタンの現在地表示の色*/
}

.contents-top{
	margin: 0% 0% 0% 0%;
	padding: 1% 0%;
	display: flex;
	flex-direction: column;
	background-color:rgba(255,224,192,1);
 	background-image:url(../jpg/bg.png);
	background-repeat:no-repeat;
	background-position:100% 100%;

}
.contents{
	margin: 2% 0%;
	clear: both;
}




.con{
	margin: 2% 8% 1% 8%;
	text-align: left;

}

.cal80{
	width: 90%;
}
.img{
	width: 100%;
	display: flex;
	flex-direction: row;
}
.aa{
	width: 90%;
	margin: 5%;
}
.yarenai{
	text-align: left;
	font-size: 120%;

}
.yarenai ul {
	list-style-type: none;
	margin: 1% 0% 0% 2%;
}
.bec{
	width: 70%;
	margin: 0% 5%;
}

.contents .text{
	margin: 0.5% 0% 0.5% 1%;
}
.course{
	display:flex;
	flex-flow: colmun nowrap;
	justify-content: center;
	align-items:flex-start;
}
.text2{
	width: 55%;
	margin: 0% 0% 0% 0%;


}
.cn{
	margin: 0% 0% 1% 5%;
}
.cn font{
	font-size: 150%;
	color: #f00;
}


.time{
	text-align: center;
}

.course table, td{
	border-collapse: seprate;
	border-spacing:0px;
	border: 1px solid #666;
}
.course .day{
	width: 30%;
	text-align: center;
}
.cal{
	width: 60%;
}
.cal2{
	width: 80%;
	margin:0% 10% 0% 5%;
}
.height{
	height: 50px;
}
.height2{
	height: 100px;
}
.form{
	display:flex;
	flex-decoration:row;
	justify-content:flex-start;
	width: 80%;
	margin: 0% 10% 1% 7%;
}
.mail{

  width:40%;
  height:50px;
  background:gold;
  border-radius:50px;
	text-align:center;
	margin: 0% 2% 1% 0%;
	padding: 15px 0px 0px 0px;
}
.mail a {
	color: #000;
}
.line{
  width:40%;
  height:50px;
  background:limegreen;
  border-radius:50px;
	text-align:center;
	margin: 0% 1% 1% 0%;
	padding: 15px 0px 0px 0px;
}
.map{
	margin:0% 5% 0% 5%;
}

footer{
  position: relative;
	width:100%;	
	margin: 0%;
	padding: 1% 1% 0.5% 1%;
	background: #3B1E00;
	text-align: right;
	bottom: 0%;
	z-index:10;
	color:#fff;
	height: 200px;
	font-size: 80%;
}
footer A:link{
	color: #ccc;
	text-decoration: none;
}
footer A:visited{
	color: #ccc;
	text-decoration: none;
}
footer A:hover{
	color: #999;
}
.copy{
	text-align: right;
	padding: 1% 1% 0.5% 1%;
}
.cr{
	text-align:center;
	margin: 0% 0% 5% 0%;
}
.date{
	margin: 0% 0% 0% 3%;
}

.date2{
	margin: 0% 0% 0% 5%;
}



#page_top{
	z-index:10;
width: 50px;
height: 50px;
position: fixed;
right: 5%;
bottom: 5%;
background: #000; /*ボタンの色*/
opacity: 0.6;
color:#fff;
padding: 2% 0% 0% 0%;
}
#page_top a{
position: relative;
display: block;
width: 50px;
height: 50px;
text-decoration: none;
text-align:center;

font-size: 150%;
color:#fff;
}

.line-b{
z-index:10;
width: 7%;
position: fixed;
left: 2%;
bottom: 3%;
background:rgba(255,255,255,0.6)
}
.line-b a{
position: relative;
display: block;


}
.sns{
	display:flex;
	margin: 1% 0% 2% 60%;
	width: 40%;

}
.sns img{
	width: 90%;
}
}