@charset "utf-8";
/* CSS Document */

/*　reset
─────────────────────────────────────────*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}
body {line-height:1;}
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {display:block;}
ul {list-style:none;}
blockquote, q {quotes:none;}
blockquote::before, blockquote::after,
q::before, q::after {
    content:'';
    content:none;
}
a {
    margin:0;
    padding:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
    text-decoration: none;
}
ins {
    background-color:#ff9;
    color:#000;
    text-decoration:none;
}
mark {
    background-color:#ff9;
    color:#000;
    font-style:italic;
    font-weight:bold;
}
var , i {font-style: normal;}
del {text-decoration: line-through;}
abbr[title], dfn[title] {
    border-bottom:1px dotted;
    cursor:help;
}
table {
    border-collapse:collapse;
    border-spacing:0;
}
hr {
    display:block;
    height:1px;
    border:0;
    border-top:1px solid #cccccc;
    margin:1em 0;
    padding:0;
}
input, select {vertical-align:middle;}
input[type="button"] ,
input[type="submit"] ,
input[type="select"] ,
input[type="option"] ,
input[type="text"] ,
input[type="password"] {
	-webkit-appearance: none;
	-webkit-appearance: button;
}
textarea {
	-webkit-appearance: none;
	-webkit-appearance: button;
}
select , button {
  -webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}


/*	clearfix
─────────────────────────────────────────*/
.clearfix::after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */



/*　common
─────────────────────────────────────────*/
::selection {background-color: rgba(56, 38, 40, 0.5); color:#382628;}
/* Firefox */
::-moz-selection {background-color: rgba(56, 38, 40, 0.5); color:#382628;}

*, *:before, *:after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}

body {
	/*color: #321603;*/
	color: #573B28;
	font-size: 14.5px;
	font-family: ヒラギノ角ゴ Pro,Hiragino Kaku Gothic Pro,メイリオ,Meiryo,Osaka,ＭＳ Ｐゴシック,MS PGothic,sans-serif;
	/*font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;*/
	background-color: #fff;
	line-height: 1;
	overflow-x: hidden;
	text-rendering: auto;
	word-wrap: break-word;
	-webkit-text-size-adjust: none;
	word-break: break-all;
}
/*body a {outline: none;}*/

/*　font
─────────────────────────────────────────*/
@font-face {
    font-family: 'de_valenciaregular';
    src: url('../fonts/De-Valencia.eot');
    src: url('../fonts/De-Valencia.eot?#iefix') format('embedded-opentype'),
         url('../fonts/De-Valencia.woff') format('woff'),
         url('../fonts/De-Valencia.ttf') format('truetype'),
         url('../fonts/De-Valencia.svg#de_valenciaregular') format('svg');
    font-weight: normal;
    font-style: normal;

}
/*.eng111 {
    font-family: 'English111 Presto BT';
	font-size: 800% !important;
}*/


button,textarea,input,select {
	font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
}
.wf-sawarabimincho {
	font-family: "Sawarabi Mincho";
	font-weight: 400;
}
.mincho {
	font-family: "Times New Roman","ヒラギノ明朝 Pro","Hiragino Mincho Pro","游明朝",YuMincho,"HGS明朝E","ＭＳ Ｐ明朝","MS PMincho",serif;
}
.gothic {
	font-family:'Helvetica Neue',Helvetica,Arial,  "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "游ゴシック", "游ゴシック体", YuGothic, "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
.de_valenciaregular {
	font-family: 'de_valenciaregular';
	font-weight: normal;
}


/*　news
─────────────────────────────────────────*/
/*#news {
	background-color: rgba(0, 0, 0, 0.9);
	color: #fff;
	height: 100%;
	left: 0;
	line-height: 2;
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 10000;
}
#news .news-title {
	font-size: 28px;
	font-weight: bold;
	margin-bottom: 40px;
}
#news p {
	font-size: 18px;
}*/

/*　wrap
─────────────────────────────────────────*/
#wrap {
	display: none;
}
#wrap a img {vertical-align: top;}
/*#wrap ,
.transEf {
	transition:all 0.3s ease;
	-webkit-transition:all 0.3s ease;
	-moz-transition:all 0.3s ease;
	-ms-transition:all 0.3s ease;
}*/

/*[class^="inner-"] {
	margin: 0 auto;
}*/


/*　navi
─────────────────────────────────────────*/
/*#gnav.fixed {
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 1000;
}*/
nav .inner {
	position: relative;
}
nav .logo a {
	display: block;
}
nav .logo img {
	display: block;
	width: 100%;
}
nav .menu ul {
	text-align: center;
}
nav .menu a {
	display: block;
	letter-spacing: 0.1em;
	transition: all .5s;
}
nav .menu a:hover {
	color: #b39d6b;
}
nav #contactmenu {
	background: linear-gradient(-20deg, #203737, #2f4f4f);
	color: #fff;
	cursor: pointer;
	font-weight: bold;
	text-align: center;
	/*text-shadow: 1px 1px 2px darkslategrey;*/
	transition: all .5s;
}
nav #contactmenu:hover {
	color: #321603;
}
/* contact contents 表示・非表示 */
nav #contactnav {
	/*background-color: rgba(56, 38, 40, 0.5);*/
	background-color: rgba(0, 0, 0, 0.5);
	height: 0;
	left: 0;
	opacity: 0;
	overflow: hidden;
	position: absolute;
	width: 0;
	visibility: hidden;
	z-index: 1000;
}
nav #contactnav li {
	opacity: 0;
}
nav dl {
	color: #fff;
	font-size: 110%;
	font-weight: bold;
}
.open {
	margin-bottom: 10px;
	padding-bottom: 10px;
}
#contactnav .open {
	border-bottom: 1px solid #fff;
}
footer .open {
	border-bottom: 1px solid #fff;
}
.open dl {
	letter-spacing: -0.4em;
}
.open dt, .open dd {
	display: inline-block;
	letter-spacing: 0.1em;
}
.open dd:last-child {
	margin-top: 10px;
}
.card dt {
	margin-bottom: 10px;
}
#gnav .card dd {
	display: inline-block;
	margin-right: 5px;
	vertical-align: middle;
}
#gnav .card dd img {
	display: block;
}
footer .tel dt {
	margin-bottom: 10px;
}
footer .tel dd {
	letter-spacing: 0.4em;
}
footer .tel li {
	display: inline-block;
	font-size: 94%;
	margin: 0 2px 5px 0;
}
footer .tel li::after {
	content: "/";
	margin-left: 2px;
}

/*　contactnav btn
─────────────────────────────────────────*/
#contactnav a {
	border: 4px solid #fff;
	color: #fff;
	display: block;
	font-size: 120%;
	font-weight: bold;
	letter-spacing: 0.1em;
	position: relative;
	text-align: center;
	transition: .6s;
}
#contactnav a:hover {
	border: 4px solid transparent;
	color: #fff;
}
#contactnav a:before,
#contactnav a:after {
	content: "";
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	transform: scale(0);
	transition: .4s;
	width: 100%;
	z-index: 3;
}
#contactnav a:before {
	border-bottom: 4px solid #fff;
	border-left: 4px solid #fff;
	transform-origin: 100% 0%;
}
#contactnav a:after {
	border-top: 4px solid #fff;
	border-right: 4px solid #fff;
	transform-origin: 0% 100%;
}
#contactnav a:hover:after,
#contactnav a:hover:before {
	transform: scale(1);
}

/*　btn
─────────────────────────────────────────*/
.btn a {
	border: 2px solid #321603;
	color: #321603;
	display: block;
	font-family: "Oswald", "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
	font-weight: 600;
	line-height: 54px;
	letter-spacing: 0.26em;
	text-align: center;
	transition: all .5s;
}
.btn a:hover {
	border-color: #b39d6b;
	background-color: #b39d6b;
	color: #fff;
}

.blue {
	color: cornflowerblue;
	text-decoration: underline;
}

/*　h2
─────────────────────────────────────────*/
h2 {
	font-size: 200%;
	letter-spacing: 0.1em;
}

/*　about
─────────────────────────────────────────*/
footer .maxwidth {
	background-color: #222;
}
#about_bnr h2 {
	margin-bottom: 40px;
}
#about_bnr li a {
	color: inherit;
}
#about_bnr figcaption {
	font-size: 120%;
	font-weight: 700;
}
#about_bnr img {
	display: block;
	width: 100%;
}

/*　footer
─────────────────────────────────────────*/
footer {
	background-color: darkslategrey;
	color: #fff;
	/*text-align: center;*/
}
footer a {
	color: #fff;
}
footer .contact a {
	border: 2px solid #fff;
	display: block;
	font-family: "Oswald", "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
	font-weight: bold;
	letter-spacing: 0.26em;
	text-align: center;
	transition: all .5s;
}
footer .contact a:hover {
	background-color: #203737;
}
#footernav {
	font-weight: bold;
}
#footernav .footerlist a {
	transition: all .5s;
}
/*#footernav .footerlist a:hover {
	color: #e2cc9b;
}*/

/*footer .mail dt {
	border-bottom: 1px solid #321603;
	margin-bottom: 10px;
}*/
.service-time dd {
	font-size: 90%;
	line-height: 1.4;
	margin-top: 8px;
}
footer .mail {
	border-bottom: 1px solid #fff;
	margin-bottom: 10px;
	padding-bottom: 10px;
}
footer .mail dd {
	margin-top: 10px;
}
footer .mail a {
	display: block;
	letter-spacing: 0.1em;
}
footer .logo {
	text-align: center;
}
footer .logo a,
footer .logo img {
	display: inline-block;
	width: 130px;
}
footer .guide {
	margin: 40px 0 0;
	text-align: center;
}
#copyright {
	font-size: 80%;
	text-align: center;
}
/*──────────────────────────────────────────────────────────────────────

  PC｜layout

──────────────────────────────────────────────────────────────────────*/
@media screen and (min-width: 1367px) {
	/*#news {
		padding: 200px 30% 0;
	}*/
	body {
		background: rgba(56, 38, 40, 0.1);
	}
	#wrap {
		background-color: #fff;
		max-width: 1920px;
		margin: 0 auto;
	}
	nav .inner {
		background-color: #fff;
		display: flex;
		height: 124px;
		max-width: 1720px;
		width: 90%;
	}
	#spnavbtn {
		display: none;
	}
	nav .logo {
		margin: 20px 0 0 20px;
		width: 90px;
	}
	/*nav .logo a {
		padding: 30px 20px 30px 30px;
	}*/
	nav .menu {
		width: calc(100% - 105px);
	}
	nav .menu ul {
		margin-right: -12%;
	}
	nav .menu li {
		display: inline-block;
	}
	nav .menu a {
		color: #321603;
		padding: 55px 20px;
	}
	nav #contactmenu {
		height: 124px;
		padding: 55px 40px;
		width: 180px;
	}
	nav #contactnav {
		display: flex;
		padding: 40px 60px 60px 60px;
		top: 124px;
		transition: all 1s;
	}
	nav #contactmenu:hover + #contactnav,
	nav #contactnav:hover {
		height: 272px;
		opacity: 1;
		width: 100%;
		visibility: visible;
	}
	nav #contactnav li {
		/*border-right: 1px solid #321603;*/
		height: 100%;
		padding: 40px;
		width: calc(100% / 3);
	}
	/*nav #contactnav li:last-child {
		border-right: none;
	}*/
	nav #contactmenu:hover + #contactnav li,
	nav #contactnav:hover li {
		opacity: 1;
	}
	#contactnav .open dt,
	#contactnav .card dt {
		margin-right: 10px;
	}
	#contactnav .card dt {
		display: inline-block;
	}
	.card img {
		width: 40px;
	}
	#contactnav a {
		padding: 32px 44px;
	}
	.btn {
		margin: 60px;
	}
	.btn a {
		width: 260px;
	}
	#sctl .btn a,
	#about .btn a,
	#option .btn a,
	#beginner .btn a {
		margin: 0 auto;
	}
	.br,
	.sp_br {
		display: block;
	}
	#container.fixed {
		padding-top: 124px;
	}
	#container .maxwidth {
		max-width: 1480px;
		margin: 0 auto;
	}
	footer .maxwidth {
		max-width: 1520px;
		margin: 0 auto;
	}
	#about_bnr {
		margin-bottom: 100px;
		padding: 40px 60px;
	}
	/*#about_bnr .about_inner {
		margin: 0 40px;
	}*/
	#about_bnr .flex {
		display: -webkit-box;
		display: -ms-flexbox;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
	}
	#about_bnr li {
		width: calc(94% / 3);
	}
	#about_bnr .imgwrap {
		overflow: hidden;
		/*height: 256px;
		width: 456px;*/
	}
	#about_bnr img {
		transform: scale(1);
		transition: all 6s ease-in-out 0s;
	}
	#about_bnr img:hover {
		transform: scale(1.2);
	}
	#about_bnr figcaption {
		margin-top: 20px;
	}
	footer .inner {
		padding: 100px 60px 60px;
	}
	footer .contact {
		margin: 60px;
	}
	footer .contact a {
		margin: 0 auto;
		padding: 30px;
		width: 780px;
	}
	footer #footernav {
		margin: 40px auto 60px;
		overflow: hidden;
		width: 780px;
	}
	#footernav .footerlist {
		float: left;
		width: 50%;
	}
	#footernav .footerlist:first-child {
		padding-right: 20px;
	}
	#footernav .footerlist:last-child {
		padding-left: 20px;
	}
	/*footer .mail dt {
		padding-bottom: 34px;
	}*/
	footer .salon dt {
		display: inline-block;
		margin-right: 10px;
	}
	/*footer .mail dl {
		margin-left: 40px;
	}
	footer .mail a {
		margin-top: 35px;
	}*/
	/*footer #footernav,
	#footernav .footerlist {
		display: inline-block;
	}
	#footernav .footerlist + li {
		margin-left: 30px;
	}*/
	#copyright {
		padding: 30px;
	}
}

/*──────────────────────────────────────────────────────────────────────

  laptop｜layout

──────────────────────────────────────────────────────────────────────*/
@media screen and (min-width: 1280px) and (max-width: 1366px) {
	/*#news {
		overflow-y: scroll;
		padding: 100px 16% 0;
	}*/
	nav .inner {
		background-color: #fff;
		display: flex;
		height: 124px;
		max-width: 1720px;
		width: 90%;
	}
	#spnavbtn {
		display: none;
	}
	nav .logo {
		margin: 20px 0 0 15px;
		width: 90px;
	}
	/*nav .logo a {
		padding: 40px 20px 30px 30px;
	}*/
	nav .menu {
		width: calc(100% - 105px);
	}
	nav .menu ul {
		margin-right: -12%;
	}
	nav .menu li {
		display: inline-block;
	}
	nav .menu a {
		color: #321603;
		padding: 55px 20px;
	}
	nav #contactmenu {
		height: 124px;
		padding: 55px 40px;
		width: 180px;
	}
	nav #contactnav {
		display: flex;
		padding: 40px;
		top: 124px;
		transition: all 1s;
	}
	nav #contactmenu:hover + #contactnav,
	nav #contactnav:hover {
		height: 198px;
		opacity: 1;
		width: 100%;
		visibility: visible;
	}
	nav #contactnav li {
		height: 100%;
		padding-right: 20px;
		width: calc(100% / 3);
	}
	nav #contactnav li:last-child {
		padding-right: 0;
	}
	nav #contactmenu:hover + #contactnav li,
	nav #contactnav:hover li {
		opacity: 1;
	}
	.card img {
		width: 40px;
	}
	#contactnav a {
		padding: 32px 0;
	}
	.btn {
		margin: 60px;
	}
	.btn a {
		width: 260px;
	}
	#sctl .btn a,
	#about .btn a,
	#option .btn a,
	#beginner .btn a {
		margin: 0 auto;
	}
	.br,
	.sp_br {
		display: block;
	}
	#container.fixed {
		padding-top: 124px;
	}
	#container .maxwidth {
		max-width: 1180px;
		margin: 0 auto;
	}
	footer .maxwidth {
		max-width: 1520px;
		margin: 0 auto;
	}
	#about_bnr {
		margin-bottom: 100px;
		padding: 20px;
	}
	/*#about_bnr .about_inner {
		margin: 0 80px;
	}*/
	#about_bnr .flex {
		display: -webkit-box;
		display: -ms-flexbox;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
	}
	#about_bnr li {
		width: calc(94% / 3);
	}
	#about_bnr .imgwrap {
		overflow: hidden;
		/*height: 189px;
		width: 336px;*/
	}
	#about_bnr img {
		transform: scale(1);
		transition: all 6s ease-in-out 0s;
	}
	#about_bnr img:hover {
		transform: scale(1.2);
	}
	#about_bnr figcaption {
		margin-top: 20px;
	}
	footer .inner {
		padding: 100px 60px 60px;
	}
	footer .contact {
		margin: 60px;
	}
	footer .contact a {
		margin: 0 auto;
		padding: 30px;
		width: 780px;
	}
	footer #footernav {
		margin: 40px auto 60px;
		overflow: hidden;
		width: 780px;
	}
	#footernav .footerlist {
		float: left;
		width: 50%;
	}
	#footernav .footerlist:first-child {
		padding-right: 20px;
	}
	#footernav .footerlist:last-child {
		padding-left: 20px;
	}
	/*footer .mail dt {
		padding-bottom: 34px;
	}*/
	footer .salon dt {
		display: inline-block;
		margin-right: 10px;
	}
	/*footer .mail dl {
		margin-left: 40px;
	}
	footer .mail a {
		margin-top: 35px;
	}*/
	#copyright {
		padding: 30px;
	}
}

/*──────────────────────────────────────────────────────────────────────

  Tablet｜layout

──────────────────────────────────────────────────────────────────────*/
@media screen and (min-width: 835px) and (max-width: 1279px) {
	/*#news {
		padding: 100px 16% 0;
	}*/
	nav .inner {
		background-color: #fff;
		display: flex;
		height: 124px;
		max-width: 1720px;
		width: 90%;
	}
	#spnavbtn {
		display: none;
	}
	nav .logo {
		margin: 20px 0 0 20px;
		width: 100px;
	}
	/*nav .logo a {
		padding: 40px 20px 30px 30px;
	}*/
	nav .menu {
		width: calc(100% - 120px);
	}
	nav .menu li {
		display: inline-block;
	}
	nav .menu a {
		color: #321603;
		padding: 55px 14px;
	}
	nav #contactmenu {
		height: 124px;
		padding: 55px 30px;
		width: 180px;
	}
	nav #contactnav {
		display: flex;
		padding: 30px;
		top: 124px;
		transition: all .5s;
	}
	nav #contactnav.opennav {
		height: 214px;
		opacity: 1;
		width: 100%;
		visibility: visible;
	}
	nav #contactnav li {
		/*border-right: 1px solid #321603;*/
		height: 100%;
		padding: 20px 5px;
		width: calc(100% / 3);
	}
	nav #contactnav li:last-child {
		padding-right: 0;
	}
	nav #contactnav.opennav li {
		opacity: 1;
	}
	/* laptop hover 対応 */
	.js_isPc nav #contactmenu:hover + #contactnav,
	.js_isPc nav #contactnav:hover {
		height: 199px;
		opacity: 1;
		width: 100%;
		visibility: visible;
	}
	.js_isPc nav #contactmenu:hover + #contactnav li,
	.js_isPc nav #contactnav:hover li {
		opacity: 1;
	}
	/* laptop hover 対応 */
	.card img {
		width: 36px;
	}
	#contactnav a {
		padding: 32px 0;
	}
	.btn {
		margin: 60px;
	}
	.btn a {
		width: 260px;
	}
	#sctl .btn a,
	#about .btn a,
	#option .btn a,
	#beginner .btn a {
		margin: 0 auto;
	}
	.br,
	.sp_br {
		display: block;
	}
	#container.fixed {
		padding-top: 124px;
	}
	#about_bnr {
		margin: 0 0 100px;
		padding: 20px;
	}
	#about_bnr .flex {
		display: -webkit-box;
		display: -ms-flexbox;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
	}
	#about_bnr li {
		width: calc(96% / 3);
	}
	#about_bnr figcaption {
		margin-top: 20px;
	}
	footer .inner {
		padding: 100px 60px 60px;
	}
	footer .contact {
		margin: 60px;
	}
	footer .contact a {
		padding: 30px;
		width: 100%;
	}
	footer #footernav {
		margin: 40px auto 60px;
		overflow: hidden;
		width: 780px;
	}
	#footernav .footerlist {
		float: left;
		width: 50%;
	}
	#footernav .footerlist:first-child {
		padding-right: 20px;
	}
	#footernav .footerlist:last-child {
		padding-left: 20px;
	}
	/*footer .mail dt {
		padding-bottom: 34px;
	}*/
	footer .salon dt {
		display: inline-block;
		margin-right: 10px;
	}
	/*footer .mail dl {
		margin-left: 40px;
	}
	footer .mail a {
		margin-top: 35px;
	}*/
	#copyright {
		padding: 30px;
	}
}
@media screen and (min-width: 569px) and (max-width: 834px) {
	/*#news {
		padding: 100px 16% 0;
	}*/
	nav .inner {
		background-color: #fff;
		display: flex;
		height: 92px;
		max-width: 1720px;
		width: 90%;
	}
	#spnavbtn {
		display: none;
	}
	nav .logo {
		margin: 10px 0 0 15px;
		width: 90px;
	}
	/*nav .logo a {
		padding: 30px 20px 20px;
	}*/
	nav .menu {
		width: calc(100% - 105px);
	}
	/*nav .menu ul {
		display: flex;
	}
	nav .menu li {
		width: calc(100% / 3);
	}*/
	nav .menu li {
		display: inline-block;
	}
	nav .menu a {
		color: #321603;
		font-size: 12px;
		padding: 40px 14px;
	}
	nav #contactmenu {
		font-size: 12px;
		height: 92px;
		padding: 40px 25px;
		width: 140px;
	}
	nav #contactnav {
		padding: 40px 120px;
		top: 92px;
		transition: all .5s;
	}
	nav #contactnav.opennav {
		height: 435px;
		opacity: 1;
		width: 100%;
		visibility: visible;
	}
	nav #contactnav li {
		padding: 10px;
		/*width: calc(100% / 3);*/
	}
	/*nav #contactnav li:first-child {
		width: 35%;
	}
	nav #contactnav li:nth-child(2),
	nav #contactnav li:nth-child(3),
	nav #contactnav li:last-child {
		padding-top: 20px;
		width: calc(65% / 3);
	}
	nav #contactnav li:last-child {
		padding-right: 0;
	}*/
	nav #contactnav.opennav li {
		opacity: 1;
	}
	#contactnav .open dt {
		margin-bottom: 5px;
	}
	#contactnav .card dt {
		display: inline-block;
	}
	#contactnav .card img {
		width: 30px;
	}
	#contactnav a {
		margin-top: 18px;
		padding: 20px 0;
	}
	.btn {
		margin: 60px;
	}
	.btn a {
		width: 260px;
	}
	#sctl .btn a,
	#about .btn a,
	#option .btn a,
	#beginner .btn a {
		margin: 0 auto;
	}
	.br,
	.sp_br {
		display: block;
	}
	#container.fixed {
		padding-top: 92px;
	}
	#about_bnr {
		margin: 0 0 100px;
		padding: 20px;
	}
	#about_bnr .overflow {
		overflow-x: auto;
		overflow-scrolling: touch;
		-webkit-overflow-scrolling: touch;
		/*padding-bottom: 40px;*/
	}
	#about_bnr ul {
		display: inline-table;
		max-width: 100%;
		padding: 5px 0;
	}
	#about_bnr li {
		display: table-cell;
		min-width: 320px;
		width: calc(100% / 3);
	}
	#about_bnr figure {
		margin-right: 20px;
	}
	#about_bnr figcaption {
		margin-top: 20px;
	}
	footer .inner {
		padding: 80px 40px 60px;
	}
	footer .contact {
		margin: 60px;
	}
	footer .contact a {
		padding: 30px;
		width: 100%;
	}
	footer #footernav {
		margin: 40px 0;
		/*overflow: hidden;*/
		padding: 0 60px 20px;
	}
	/*#footernav .footerlist {
		float: left;
		width: 50%;
	}*/
	#footernav .footerlist:first-child {
		margin-bottom: 40px;
	}
	#footernav .footerlist:last-child {
	}
	footer .open dt {
		display: block;
		margin-bottom: 10px;
	}
	/*footer .mail dt {
		padding-bottom: 58px;
	}*/
	footer .tel dt {
		display: inline-block;
		margin-right: 5px;
	}
	/*footer .mail dl {
		margin-left: 40px;
	}*/
	#footernav .card img {
		width: 28px;
	}
	/*footer .mail a {
		margin-top: 35px;
	}*/
	#copyright {
		padding: 30px;
	}
}

/*──────────────────────────────────────────────────────────────────────

  smartphone｜layout

──────────────────────────────────────────────────────────────────────*/
@media screen and (max-width: 568px) {
	/*#news {
		overflow-y: scroll;
		padding: 60px 10%;
	}
	#news p {
		padding-bottom: 60px;
	}*/
	#wrap {
		overflow-x: hidden;
	}
	nav .inner {
		background-color: #fff;
		display: flex;
		height: 94px;
		max-width: 1720px;
		position: relative;
		width: 90%;
		transition: all .5s;
	}
	nav .logo {
		padding: 10px 0 10px 10px;
		width: 24%;
	}
	/*nav .logo a {
		padding: 30px 20px 10px;
	}*/
	.spnav {
		width: calc(76% / 2);
	}
	#spnavbtn {
		/*background-color: beige;*/
		cursor: pointer;
		font-size: 90%;
		font-weight: bold;
		padding: 40px 0;
		text-align: center;
	}
	nav .menu ul {
		background-color: rgba(0, 0, 0, 0.5);
		/*display: flex;*/
		left: -100%;
		/*opacity: .5;*/
		padding: 20px 40px;
		position: absolute;
		top: 94px;
		transition: all .5s;
		width: 100%;
		z-index: 100;
	}
	nav .menu ul.action {
		left: 0;
		/*opacity: 1;*/
	}
	nav .menu li {
		/*width: calc(100% / 3);*/
		padding: 10px 0;
	}
	nav .menu a {
		border: 4px solid #fff;
		color: #fff;
		font-weight: bold;
		font-size: 120%;
		padding: 20px 0;
	}
	nav #contactmenu {
		font-size: 90%;
		height: 94px;
		padding: 40px 0;
	}
	nav #contactnav {
		padding: 20px 20px 30px;
		top: 94px;
		transition: all .2s;
	}
	nav #contactnav.opennav {
		/*height: 394px;*/
		height: 300px;
		opacity: 1;
		width: 100%;
		visibility: visible;
	}
	nav #contactnav li {
		padding: 10px 20px;
	}
	nav #contactnav.opennav li {
		opacity: 1;
	}
	#contactnav .open dt {
		margin-bottom: 5px;
	}
	.card img {
		width: 36px;
	}
	#contactnav a {
		padding: 20px 0;
	}
	.btn {
		margin: 60px 20px;
	}
	.btn a {
		width: 100%;
	}
	#container.fixed {
		padding-top: 94px;
	}
	#about_bnr {
		margin-bottom: 80px;
	}
	#about_bnr h2 {
		text-align: center;
	}
	#about_bnr .overflow {
		overflow-x: auto;
		overflow-scrolling: touch;
		-webkit-overflow-scrolling: touch;
		/*padding-bottom: 40px;*/
	}
	#about_bnr ul {
		display: inline-table;
		max-width: 100%;
		padding: 10px 0 10px 10px;
	}
	#about_bnr li {
		border-right: 10px solid #222;
		display: table-cell;
		min-width: 340px;
		width: calc(100% / 3);
	}
	#about_bnr li img {
		/*min-height: 220px;
		object-fit: cover;*/
		width: 100%;
	}
	/*#about_bnr li:first-child img,
	#about_bnr li:nth-child(2) img {
		object-position: center;
	}
	#about_bnr li:last-child img {
		object-position: left center;
	}*/
	/*#about_bnr figure {
		margin-right: 10px;
	}*/
	#about_bnr figcaption {
		margin-top: 10px;
	}
	footer .inner {
		padding: 60px 20px 60px;
	}
	footer .contact a {
		padding: 30px;
	}
	footer #footernav {
		margin: 40px 0;
	}
	#footernav .footerlist {
		display: block;
		margin-bottom: 40px;
	}
	/*#footernav .footerlist:first-child {
		margin-bottom: 40px;
	}*/
	/*footer .mail dt {
		padding-bottom: 10px;
	}
	footer .mail a {
		margin-top: 10px;
	}*/
	#copyright {
		padding-top: 30px;
	}
}
@media screen and (min-width: 320px) and (max-width: 359px) {
	nav .menu a {
		font-size: 88%;
	}
	nav #contactnav.opennav {
		height: 280px;
	}
	nav #contactnav li {
		padding: 5px;
	}
	footer .contact a {
		padding: 30px 0;
	}
	footer .open dt {
		margin-bottom: 5px;
	}
}