@charset "UTF-8";


/* font
----------------------------------------------- */
:root { --mincho: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "MS P明朝", serif; --gothic: 游ゴシック体, YuGothic, 'Yu Gothic', "游ゴシック Medium", "Yu Gothic Medium", 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; }


/* default sp
	----------------------------------------------- */
* { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, section, summary, time, mark, audio, video { padding: 0; margin: 0; font: inherit; word-wrap: break-word; border: 0; vertical-align: baseline; outline: none; }
body { padding: 0; margin: 0; color: #555; font-size: 3.6vw; font-family: 游ゴシック体, YuGothic, 'Yu Gothic', "游ゴシック Medium", "Yu Gothic Medium", 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; -webkit-text-size-adjust: 100%; font-style: normal; line-height: 1; }
article, aside, canvas, details, figcaption, figure, header, footer, hgroup, main, menu, nav, section, summary { display: block; }
blockquote, q { quotes: none; }
strong, b { font-weight: bold; }
ul, ol, li { list-style: none; }
table { border-spacing: 0; border-collapse: collapse; }
img, video, object { height: auto; border: none; display: block; }
ins { background: none; color: #000; text-decoration: none; }
mark { background-color: #ff9; color: #000; font-style: italic; font-weight: bold; }
del { text-decoration: line-through; }
abbr[title], dfn[title] { border-bottom: 1px dotted; cursor: help; }
hr { height: 1px; padding: 0; margin: 1em 0; border: 0; border-top: 1px solid #ccc; display: block; }
*:before, *:after { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
a { color: #555; text-decoration: none; display: block; -moz-transition: all 0.3s cubic-bezier(0.76, 0, 0.24, 1); -o-transition: all 0.3s cubic-bezier(0.76, 0, 0.24, 1); -webkit-transition: all 0.3s cubic-bezier(0.76, 0, 0.24, 1); transition: all 0.3s cubic-bezier(0.76, 0, 0.24, 1); }
a:hover { opacity: 0.6; }
.clearfix:after { content: ''; display: block; clear: both; }
.pc { display: none; }
.sp { display: block; }

.container{position: relative;overflow: hidden;z-index: 1;width: 100%;}
.container img{width:100%;}
.header img{width:20%;margin:0 auto;padding:3% 0;}
.hero {position:relative;}
.hero a{position:absolute;width:80%;left:10%;bottom: 14vw;}

.onayami{position:relative;z-index:2;}
.kaiketu{margin-top: -11vw;position:relative;z-index: 0;}
.kaiketu a{position:absolute;width: 90%;left: 5%;bottom: 12vw;z-index:2;}

.reason{background:#f1f2e9;padding-bottom:5%;}
.reason img{margin-bottom:8vw;}
.reason img:nth-child(1){margin-bottom:6vw;}

.ba{position:relative;z-index: 0;background: url(../images/ba.jpg)no-repeat center top;background-size: 100%;padding: 37% 3% 40% 3%;overflow: hidden;}
.ba .slick-slide{width: 61vw;margin: 0 4px;}
.ba a{position:absolute;width: 90%;left: 5%;bottom: 10vw;z-index:2;}

.gre{position:relative;z-index: 0;}
.gre a{position:absolute;width: 80%;left: 10%;bottom: 14vw;z-index:2;}

.salon{width:90%;margin: 15vw auto 10vw;}
.salon .tit{margin-bottom:8vw;}
.information-title, .contact-title { padding-top: 5vw; margin: 0 auto 10vw; font-family: 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif; text-align: center; position: relative; }
.information-title:after, .contact-title:after {content: '';width: 16vw;height: 1px;background: #000;position: absolute;bottom: -5vw;left: 50%;-moz-transform: translateX(-50%);-ms-transform: translateX(-50%);-webkit-transform: translateX(-50%);transform: translateX(-50%);}
.information-title .jp, .contact-title .jp {margin-bottom: 2vw;font-size: 6.88vw;display: block;}
.information-title .en, .contact-title .en 
.information-box { width: 90vw; margin: 0 auto 4vw; }
.information-box-open .information-items { display: block; }
.information-items { display: none; }
.information-box-title {padding: 3.5vw 2vw;color: #fff;font-size: 4.5vw;background: #600c0d;position: relative;font-family: 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;margin-bottom: 2vw;}
.information-box-title.open:after { -moz-transform: translateY(-50%) rotateX(180deg); -ms-transform: translateY(-50%) rotateX(180deg); -webkit-transform: translateY(-50%) rotateX(180deg); transform: translateY(-50%) rotateX(180deg); }
.information-box-title:after { content: '\f107'; font-family: 'icon'; position: absolute; top: 50%; right: 4vw; -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%); -moz-transition: all 0.2s cubic-bezier(0.05, 0.05, 0.31, 0.97); -o-transition: all 0.2s cubic-bezier(0.05, 0.05, 0.31, 0.97); -webkit-transition: all 0.2s cubic-bezier(0.05, 0.05, 0.31, 0.97); transition: all 0.2s cubic-bezier(0.05, 0.05, 0.31, 0.97); }
.information-items { padding: 1px 6vw; margin: 4vw 0 8vw; background: #fff; -moz-box-shadow: 0 0 12px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 0 0 12px rgba(0, 0, 0, 0.1); box-shadow: 0 0 12px rgba(0, 0, 0, 0.1); }
.information-items li { padding: 6vw 0; border-bottom: 1px dotted #666; }
.information-items li:last-child { border: none; }
.information-item-image { width: 100%; margin-bottom: 4vw; }
.information-item-text dl { margin-bottom: 1vw; font-size: 3.16vw; line-height: 1.4; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; }
.information-item-text dt { width: 20vw; margin-right: 1vw; text-align: justify; text-align-last: justify; text-justify: inter-character; }
.information-item-text dd { flex: 1; }
.information-item-name {margin-bottom: 2.5vw;color: #dc8825;font-size: 4.61vw;font-weight: bold;line-height: 1.2;}
.information-item-name span{display:block;background:#aa8f51;font-size:3.4vw;padding:2% 4%;color:#fff;margin-top:2vw;}

footer p{background:#6d6d6d;color:#fff;padding:3vw;text-align:center;margin-bottom:12vw;}
.fixitem{position:fixed;bottom:0;z-index:20;}

/* pc
----------------------------------------------- */
@media screen and (min-width: 736px) {
	
body{font-size: 16px;background:url(../images/bg.jpg);background-size: 108px;}
.pc { display: block; }
.sp { display: none; }
	
.container{width:700px;margin:0 auto;background:#fff;box-shadow: 0 3px 10px 1px rgb(145 132 106);}
.header img{width:130px;}
.hero a{bottom: 105px;}
.kaiketu{margin-top:-80px;}
.kaiketu a{bottom: 105px;}

.reason img{margin-bottom:50px;}
.reason img:nth-child(1){margin-bottom:50px;}
.ba{padding: 250px 30px 300px 30px;}
.ba .slick-slide{width: 430px;}
.ba a{bottom: 75px;}
.gre a{bottom: 100px;}
	
.salon{margin:120px auto 80px;}
.salon .information-title, .contact-title { padding-top: 0; margin-bottom: 80px; }
.salon .information-title:after, .contact-title:after { width: 70px; height: 2px; bottom: -40px; }
.salon .information-title .jp, .contact-title .jp { margin-bottom: 12px; font-size: 35px; }
.salon .information-title .en, .contact-title .en { font-size: 20px; letter-spacing: 2px; }
.salon .information-box {width: 100%;margin-bottom: 12px;}
.salon .information-box-title {padding: 18px 20px 16px;font-size: 23px;background-size: 100px;cursor: pointer;margin-bottom: 0;}
.salon .information-box-title:after { right: 20px; }
.salon .information-items {padding: 5px 24px;margin: 20px 0 30px;}
.salon .information-items li { padding: 30px 0; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: space-between; justify-content: space-between; -webkit-align-items: flex-start; align-items: flex-start; }
.salon .information-item-image {width: 200px;margin: 0;}
.salon .information-item-text {width: 362px;padding-top: 5px;}
.salon .information-item-text dl {margin-bottom: 5px;font-size: 14.5px;line-height: 1.6;}
.salon .information-item-text dt {width: 85px;margin-right: 5px;}
.salon .information-item-name {margin-bottom: 12px;font-size: 17px;}
.information-item-name span{font-size:12.5px;margin-top:10px;}
footer p{padding: 14px;margin-bottom: 80px;}	
.fixitem{width:700px;}
	


}


/* retina用 ----------------------------------------------- */

@media screen and (min-width: 760px) and (-webkit-min-device-pixel-ratio: 2), screen and (min-width: 760px) and (min-resolution: 2dppx) {
.ba{background: url(../images/ba@2x.jpg) no-repeat center top;background-size: 100%;}

	
}

