@charset "utf-8";
@media (max-width: 1024px) {
	/*---------------------------------
	
		全体設定
		
	---------------------------------*/
	html {
		height: auto;
	}
	body {
		overflow: auto;
	}
	.mainv_bg{
		  height: 0;
		  padding-top: calc(100%*1000/2000);/* (画像の高さ / 画像の横幅) × 100 */
		  margin-top: 50px;
	}
	#mainv:after {
		content: normal;
		display: none;
	}
	.link_list:nth-of-type(1)>.link_txt_wrap:after, .link_list:nth-of-type(2)>.link_txt_wrap:after, .link_list:nth-of-type(3)>.link_txt_wrap:after, .link_list:nth-of-type(4)>.link_txt_wrap:after {
		display: none;
	}
	.head_change #menu li {
		padding: 8px 6px;
	}
	.about-in {
		width: 95%;
		margin: 0 auto;
	}
	.about-in>.fl_wrap>div {
		width: 31%;
		height: 200px;
		box-sizing: border-box;
		padding: 15px;
		margin-left: 3.5%;
	}
	.about-in>.fl_wrap>div:first-child {
		margin-left: 0;
	}
	#front_news, #front_blog {
		width:43%;
		padding-bottom:20px;
		margin:3%;
	}
	#insta{
		padding:20px 0;
	}
	#map iframe{
		width:100%;
	}
	#map h2 {
		width:100%;
		padding-left: 20px;
		font-size: 2em;
		box-sizing: border-box;
	}
	#map.bg-gray {
		background: white;
	}
	#shopinfo img {
		  width: 30%;
	}
	#shopinfo .fl_right {
		  margin-left: 5%;
		  width: 60%;
	}
	#front_news li .date,
	#front_blog li .date {
		  width: 20%;
	}
	#front_news li .txt, 
	#front_blog li .txt {
		  width: 80%;
	}
	section {
		padding: 40px 20px;
	}
	#breadcrumb ol {
		padding-left: 0;
	}
	/*---------------------------------
	
		20180224 add start
		
	---------------------------------*/
	.w900,
	.w1000,
	.w1200{
		  width: 100%;
		  margin:  0 auto;
	}
	/*---------------------------------
	
		20180224 add end
		
	---------------------------------*/
	.banner img {
		width:90%;
	}
	.course_list>.fl_left{
		width:33%;
	}
	.course_list>.fl_right{
		width:63%;
	}
	#header{
		display: block;
	}
	#head_change{
		display: none;
	}
	#header {
		display: block;
		position: fixed;
		top:0;
		left: 0;
		width: 100%;
		margin:0;
		padding:10px;
		z-index:10;
		background: white;
		box-sizing: border-box;
		height: 50px;
	}
	#header .logo img{
		height:25px;
		width:auto;
		margin-left: 5px;
	}
	#title01 div,#point1 div,#point2 .point,#point2 .link_left p,#point3 div,#point4 div,#point5 div {
		max-width: 600px;
		margin: 0 auto;
	}
	.top_link {
		flex-direction: column;
	}
	.link_list {
		width: 100%;
	}
	.link_right p,#point2 .link_left {
		margin: 2em 0;
	}
	.link_left p {
		margin-bottom: 2em;
	}
	#point4 .imgbox img {
		max-width: 100%;
	}
	.about_slider .prev-arrow {
		left: 10px;
	}
	.about_slider .next-arrow {
		right: 10px;
	}
	.page-description {
		margin-left: 40px;
	}
	.accordion2 {
		max-width: 600px;
		margin: 0 auto;
	}
	#staff_all ul li {
		width: 50%;
	}
	#single_contents {
		padding: 20px 40px;
	}
	.staff_info dl dt {
		width: 20vw;
		padding-right: 1em;
		box-sizing: border-box;
	}
	.staff_detail {
		padding: .5em;
	}
	.sns-selector {
		margin-bottom: 3em;
	}
	.sns-selector i {
		font-size: 2rem;
	}
	#gallery_archive {
		padding: 20px; 
	}
	#gallery_archive #grid-content {
		width: 100%;
	}
	#gallery_archive aside {
		width: 40%;
	}
	#grid-content li {
		width: 33%;
	}
	#gallery_archive aside>div {
		width: 200px;
	}
	/*---------------------------------
	
		スマホメニュートリガー エフェクト
		
	---------------------------------*/
	#menu {
		display: none;
		width: 70vw;
		height: 100%;
		position: fixed;
		top: 0;
		right: 0;
		z-index: 900;
		color: #000;
		background: #fff;
		box-sizing: border-box;
		text-align: left;
		overflow-y: auto;
	}
	#menu > ul {
		text-align: left;
		margin:0;
		padding: 4em 10px 1em;
	}
	#menu li {
		display: block;
		width: 100%;
		padding: 5px;
		margin: 0 auto;
		box-sizing: border-box;
		font-size: 1em;
		border-bottom: 1px dotted #fff;
		width: 100%;
	}
	#menu li:last-child {
		border-bottom: none;
	}
	#menu li a {
		display: block;
		padding: 5px 10px;
		color: #754c24;
		position: relative;
	}
	#menu li a:after {
		font-family: 'Material Icons';
		content: "chevron_right";
		font-size: 1em;
		text-align: right;
		position: absolute;
		right: 0;
	}
	#menu li .sub-nav {
		opacity: 1;
		position: relative;
		left: auto;
		top: auto;
		width: auto;
		margin-left: 8px;
		text-align: left;
		border-top: 1px dashed #999;
	}
	#menu li .sub-nav li {
		display: block;
		padding: 0;
		border-bottom: 1px dashed #999;
	}
	#menu li .sub-nav li:last-child {
		border-bottom: none;
	}
	#menu li .sub-nav a {
		width: auto;
		padding: 3px 10px 3px 10px;
		color: #FFF;
		background: #000;
	}
	.menu-trigger,
	.menu-trigger span {
		display: inline-block;
		transition: all .4s;
		box-sizing: border-box;
	}
	.menu-trigger {
		position: fixed;
		width: 30px;
		height: 22px;
		top:12px;
		right:10px;
		z-index:2000;
		cursor:pointer;
	}
	.menu-trigger span {
		position: absolute;
		left: 0;
		width: 100%;
		height: 2px;
		background-color: #754c24;
		border-radius: 4px;
	}
	.menu-trigger span:nth-of-type(1) {
		top: 0;
	}
	.menu-trigger span:nth-of-type(2) {
		top: 10px;
	}
	.menu-trigger span:nth-of-type(3) {
		bottom: 0;
	}
	.menu-trigger.active span:nth-of-type(1) {
		-webkit-transform: translateY(10px) rotate(-45deg);
		transform: translateY(10px) rotate(-45deg);
	}
	.menu-trigger.active span:nth-of-type(2) {
		opacity: 0;
	}
	.menu-trigger.active span:nth-of-type(3) {
		-webkit-transform: translateY(-10px) rotate(45deg);
		transform: translateY(-10px) rotate(45deg);
	}
	.overlay {
		content: "";
		display: block;
		width: 0;
		height: 100vh;
		background-color: rgba(0, 0, 0, 0.5);
		position: absolute;
		top: -50px;
		left: 0;
		z-index: 11;
		opacity: 0;
		-webkit-transition: opacity .5s ;
		-o-transition: opacity .5s ;
		transition: opacity .5s ;
	}
	.overlay.open {
		width: 100%;
		height: 100%;
		opacity: 1;
	}
/* ここまで */
	#about {
		margin-top: 0;
	}	
	.sns {
		margin-top: 4px;
	}
	.sns a img {
		width:18%;
		height:auto;
	}
	.tel {
		font-size: 20px;
		top: 10px;
		right: 65px;
	}
	.tel i {
		color: #754c24;	
	}
	.reserv_link a {
	    background: #754c24;
	    border-radius: 20px;
	    padding: 1px 13px;
	    margin: 0 5px 0 10px;
	    color: white;
	    display: block;
	    letter-spacing: .1em;
	}
	.row {
		align-items: flex-start;
	}
	.logo {
		justify-content: space-between;
		margin-right: 40px;
		align-items: center;
	}
	.logo span {
		display: none;
	}
	.ggmap iframe,
	.ggmapr object,
	.ggmap embed {
		width: 100%;
		height: 100%;
	}
	#footer .spbtn {
	 	display:-webkit-box;
		display:-ms-flexbox;
		display:flex;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		position: fixed;
		width: 100%;
		bottom: 0px;
		background:rgb(255,255,255);
		border-top:solid #ccc 1px;
		box-sizing: border-box;
	}
	#footer .spbtn div{
		text-align: center;
		display: block;
		font-size:17px;
		width: 50%;
		box-sizing: border-box;
		padding: 20px 0;
	}
	#footer .spbtn div a{
		display: block;
	}
	#footer .spbtn div{
		border-right:solid #ccc 1px;
	}
	#footer .spbtn div:last-child{
		border-right:none;
	}
	#footer .spbtn .fa-map,#footer .spbtn .fa-calendar{
		color:green;
		margin-right: 7px;
	}
	#footer .spbtn .fa-phone{
		color:orange;
		margin-right: 7px;
	}
	#footer .spbtn .fa-chevron-circle-up{
		color:white;
		margin-right: 7px;
	}
	/*---------------------------------
	
		slick
		
	---------------------------------*/
	.top-slider{
		  margin-top: 50px;
	}
	.top-slider .slick-slide img {
		width: 100%;
		height: 45vw;
	}


/* 	フッターナビ */
	#footer .spbtn2 {
	 	display:-webkit-box;
	  	display:-ms-flexbox;
	  	display:flex;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: space-around;
		position: fixed;
		width: 100%;
		bottom: 0px;
		background:rgba(248, 248, 248, 0.90);
		box-sizing: border-box;
		align-items: flex-start;
		padding-top: 5px;
		z-index: 9999;
		color: black!important;
	}
	#footer .spbtn2 .spbtn_3 {
		text-align: center;
		display: block;
		font-size:12px;
		width: calc(100% / 3);
		padding: 5px;
		border-right: 1px solid #ccc;
		margin-top: 5px;
		margin-bottom: 5px;
	}
	#footer .spbtn2 .spbtn_4 {
		text-align: center;
		display: block;
		font-size:12px;
		width: calc(100% / 4);
		padding: 5px;
		border-right: 1px solid #ccc;
	}
	#footer .spbtn2 p {
		line-height: 1;
		margin: 5px 0;
	}
	#footer .spbtn2 div:last-child {
		border-right: 0;
	}
	#footer .spbtn2 img{
		max-width: 30px;
	}
	#footer .spbtn2 a{
		color: #517d99;
	}
}