@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%;
	}
	#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%;
	}
	/*---------------------------------

	  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;
		background: #000;
		padding: 5px;
		z-index: 1000;
		box-sizing: border-box;
		height: 50px;
	}
	#header .logo img {
		height: 40px;
		width: auto;
		margin-left: 5px;
	}
	#menu {
		display: none;
		width: 100%;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 90;
		color: #fff;
		background: #000;
		box-sizing: border-box;
		text-align: left;
		float: none;
		margin: 0;
	}
	#menu > ul {
		text-align: left;
		margin: 0;
		padding: 0;
	}
	#menu li {
		display: block;
		width: 100%;
		padding: 0px;
		margin: 0 auto;
		box-sizing: border-box;
		font-size: 20px;
		border-bottom: 1px dotted #fff;
	}
	#menu li:last-child {
		border-bottom: none;
	}
	#menu li a {
		display: block;
		padding: 5px 10px;
		color: #fff;
	}
	#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 0.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: 4px;
		background-color: #fff;
		border-radius: 4px;
	}
	.menu-trigger span:nth-of-type(1) {
		top: 0;
	}
	.menu-trigger span:nth-of-type(2) {
		top: 9px;
	}
	.menu-trigger span:nth-of-type(3) {
		bottom: 0;
	}
	/*---------------------------------

	  スマホメニュートリガー エフェクト

	---------------------------------*/
	.menu-trigger.active span:nth-of-type(1) {
		-webkit-transform: translateY(9px) rotate(-45deg);
		transform: translateY(9px) rotate(-45deg);
	}
	.menu-trigger.active span:nth-of-type(2) {
		opacity: 0;
	}
	.menu-trigger.active span:nth-of-type(3) {
		-webkit-transform: translateY(-9px) rotate(45deg);
		transform: translateY(-9px) rotate(45deg);
	}
	.sns {
		margin-top: 4px;
	}
	.sns a img {
		width: 18%;
		height: auto;
	}
	.tel {
		position: absolute;
		font-size: 20px;
		color: #fff;
		top: 10px;
		right: 65px;
	}
	.tel a {
		color: #fff;
	}
	.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;
	}
	#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: 3px;
	}
	#footer .spbtn .fa-phone {
		color: orange;
		margin-right: 3px;
	}
	#footer .spbtn .fa-chevron-circle-up {
		color: white;
		margin-right: 3px;
	}

	/*---------------------------------

		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.9);
		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;
	}
	#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;
	}
}
