@charset "UTF-8";
/* =============================================================================
   mixin extend
   ========================================================================== */
#site-header .c-section:after, .navList:after, .guideStepList:after, .salonBlockPhoto:after {
 content: "";
 display: table;
 clear: both;
}
img {
 max-width: 100%;
 height: auto;
}
.lt-ie9 img {
 width: auto;
}
/* =============================================================================
   project utility
   ========================================================================== */
.u-pc-none {
 display: none;
}
@media only screen and (max-width: 640px) {
 .u-sp-none {
  display: none;
 }
 .u-pc-none {
  display: block;
 }
}
/**
 * BxSlider v4.1.2 - Fully loaded, responsive content slider
 * http://bxslider.com
 *
 * Written by: Steven Wanderski, 2014
 * http://stevenwanderski.com
 * (while drinking Belgian ales and listening to jazz)
 *
 * CEO and founder of bxCreative, LTD
 * http://bxcreative.com
 */
/** RESET AND LAYOUT
===================================*/
.bx-wrapper {
 position: relative;
 *zoom: 1;
}
.bx-wrapper img {
 max-width: 100%;
 display: block;
}
/** THEME
===================================*/
.bx-wrapper .bx-viewport {
 /*fix other elements on the page moving (on Chrome)*/
 -webkit-transform: translatez(0);
 transform: translatez(0);
}
.bx-wrapper .bx-pager, .bx-wrapper .bx-controls-auto {
 position: absolute;
 bottom: -30px;
 width: 100%;
}
/* LOADER */
.bx-wrapper .bx-loading {
 min-height: 50px;
 background: url(images/bx_loader.gif) center center no-repeat #fff;
 height: 100%;
 width: 100%;
 position: absolute;
 top: 0;
 left: 0;
 z-index: 2000;
}
/* PAGER */
.bx-wrapper .bx-pager {
 text-align: center;
 font-size: .85em;
 font-family: Arial;
 font-weight: bold;
 color: #666;
 padding-top: 20px;
}
.bx-wrapper .bx-pager .bx-pager-item, .bx-wrapper .bx-controls-auto .bx-controls-auto-item {
 display: inline-block;
 *zoom: 1;
 *display: inline;
}
.bx-wrapper .bx-pager.bx-default-pager a {
 background: #666;
 text-indent: -9999px;
 display: block;
 width: 10px;
 height: 10px;
 margin: 0 5px;
 outline: 0;
 border-radius: 5px;
}
.bx-wrapper .bx-pager.bx-default-pager a:hover, .bx-wrapper .bx-pager.bx-default-pager a.active {
 background: #000;
}
/* DIRECTION CONTROLS (NEXT / PREV) */
.bx-wrapper .bx-prev {
 left: 3.3%;
 background: url(../images/slide-prev.png) no-repeat 0 0;
}
.bx-wrapper .bx-next {
 right: 3.3%;
 background: url(../images/slide-next.png) no-repeat 0 0;
}
.bx-wrapper .bx-prev:hover {
 transition: opacity 0.3s linear;
}
.bx-wrapper .bx-prev:hover:hover {
 opacity: 0.6;
 filter: alpha(opacity=60);
 -ms-filter: "alpha( opacity=60 )";
}
@media only screen and (max-width: 640px) {
 .bx-wrapper .bx-prev:hover:hover {
  opacity: 1;
  filter: alpha(opacity=100);
  -ms-filter: "alpha( opacity=100 )";
 }
}
.bx-wrapper .bx-next:hover {
 transition: opacity 0.3s linear;
}
.bx-wrapper .bx-next:hover:hover {
 opacity: 0.6;
 filter: alpha(opacity=60);
 -ms-filter: "alpha( opacity=60 )";
}
@media only screen and (max-width: 640px) {
 .bx-wrapper .bx-next:hover:hover {
  opacity: 1;
  filter: alpha(opacity=100);
  -ms-filter: "alpha( opacity=100 )";
 }
}
.bx-wrapper .bx-controls-direction a {
 position: absolute;
 top: 50%;
 margin-top: -23px;
 outline: 0;
 width: 25px;
 height: 46px;
 text-indent: -9999px;
 z-index: 9999;
}
@media only screen and (max-width: 640px) {
 .bx-wrapper .bx-controls-direction a {
  width: 15px;
  height: 28px;
  margin-top: 18px;
  background-size: 15px 28px;
 }
}
.bx-wrapper .bx-controls-direction a.disabled {
 display: none;
}
/* AUTO CONTROLS (START / STOP) */
.bx-wrapper .bx-controls-auto {
 text-align: center;
}
.bx-wrapper .bx-controls-auto .bx-start {
 display: block;
 text-indent: -9999px;
 width: 10px;
 height: 11px;
 outline: 0;
 background: url(images/controls.png) -86px -11px no-repeat;
 margin: 0 3px;
}
.bx-wrapper .bx-controls-auto .bx-start:hover, .bx-wrapper .bx-controls-auto .bx-start.active {
 background-position: -86px 0;
}
.bx-wrapper .bx-controls-auto .bx-stop {
 display: block;
 text-indent: -9999px;
 width: 9px;
 height: 11px;
 outline: 0;
 background: url(images/controls.png) -86px -44px no-repeat;
 margin: 0 3px;
}
.bx-wrapper .bx-controls-auto .bx-stop:hover, .bx-wrapper .bx-controls-auto .bx-stop.active {
 background-position: -86px -33px;
}
/* PAGER WITH AUTO-CONTROLS HYBRID LAYOUT */
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager {
 text-align: left;
 width: 80%;
}
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-controls-auto {
 right: 0;
 width: 35px;
}
/* IMAGE CAPTIONS */
.bx-wrapper .bx-caption {
 position: absolute;
 bottom: 0;
 left: 0;
 background: #666 \9;
 background: rgba(80, 80, 80, 0.75);
 width: 100%;
}
.bx-wrapper .bx-caption span {
 color: #fff;
 font-family: Arial;
 display: block;
 font-size: .85em;
 padding: 10px;
}
/**
 *
 * Base css
 *
 * Extract normalize.css 2011-06-21T18:23 UTC
 *  http://github.com/necolas/normalize.css
 *
 * Modify reset.css ver 1.4 with jQuery [2009/04/24]
 *  This document validates as CSS level 2.1
 *  GNU General Public License v3
 *  http://higash.net/labo/
 * Modify basic.css ver 1.2 with jQuery [2009/04/24]
 *  This document validates as CSS level 2.1
 *  GNU General Public License v3
 *  http://higash.net/labo/
 *
 * Modify YUI Reset CSS, YUI Fonts CSS
 *  Copyright (c) 2008, Yahoo! Inc. All rights reserved.
 *  http://developer.yahoo.com/yui/license.html
 *
 */
/* =============================================================================
   HTML5 display definitions
   ========================================================================== */
/*
 * Corrects block display not defined in IE6/7/8/9 & FF3
 */
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section, main {
 display: block;
}
/*
 * Corrects inline-block display not defined in IE6/7/8/9 & FF3
 */
audio[controls], canvas, video {
 display: inline-block;
 *display: inline;
 zoom: 1;
}
/*
 * Addresses margin not present in IE6/7/8/9, S5, O11
 */
figure {
 margin: 0;
}
/* =============================================================================
   Base
   ========================================================================== */
/*
 * html InitialStyle
 */
html {
 background: #fff;
 color: #333;
 font-size: 62.5%;
}
/*
 * body InitialStyle
 */
body {
 font-family: Verdana, "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
 line-height: 150%;
 text-align: center;
 -webkit-tap-highlight-color: transparent;
 -webkit-text-size-adjust: 100%;
 -ms-text-size-adjust: 100%;
 height: 100%;
 line-height: 1.5;
}
/*
 * All InitialStyle
 */
body, div, pre, p, blockquote, form, fieldset, input, textarea, select, option, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, embed, object, main {
 margin: 0;
 padding: 0;
 vertical-align: baseline;
}
div, h1, h2, h3, h4, h5, h6, p, dl, dt, dd, ol, ul, li, form, input, textarea, button, table, tr, th, td, article, aside, footer, header, hgroup, nav, section, main {
 -o-box-sizing: border-box;
 -ms-box-sizing: border-box;
 box-sizing: border-box;
}
/* =============================================================================
   Links
   ========================================================================== */
a {
 border: 0;
 color: #333;
 cursor: pointer;
 outline: none;
 overflow: hidden;
 text-decoration: none;
}
/*
 * Addresses outline displayed oddly in Chrome
 */
/*
 * Improves readability when focused and also mouse hovered in all browsers
 * people.opera.com/patrickl/experiments/keyboard/test
 */
a:hover, a:active, a:focus {
 outline: 0;
}
.dd {
 color: #81511c;
 font-size: 20px;
 font-weight: bold;
}
a {
 overflow: hidden;
}
/* =============================================================================
   Typography
   ========================================================================== */
/*
 * Addresses styling not present in IE7/8/9, S5, Chrome
 */
abbr[title] {
 border-bottom: 1px dotted;
}
/*
 * Addresses styling not present in S5, Chrome
 */
dfn {
 font-style: italic;
}
/*
 * Addresses styling not present in IE6/7/8/9
 */
mark {
 background: #ff0;
 color: #000;
}
/*
 * Improves readability of pre-formatted text in all browsers
 */
pre {
 white-space: pre;
 white-space: pre-wrap;
 word-wrap: break-word;
}
/*
 * Prevents sub and sup affecting line-height in all browsers
 * gist.github.com/413930
 */
sub, sup {
 font-size: 75%;
 line-height: 0;
 position: relative;
 vertical-align: baseline;
}
sup {
 top: -0.5em;
}
sub {
 bottom: -0.25em;
}
q {
 quotes: none;
}
q:before, q:after {
 content: '';
 content: none;
}
/* =============================================================================
   Forms
   ========================================================================== */
button, fieldset, form, input, label, legend, select, textarea {
 font-family: inherit;
 font-size: 100%;
 font-style: inherit;
 font-weight: inherit;
 margin: 0;
 padding: 0;
 vertical-align: baseline;
 *vertical-align: middle;
}
/*
 * 1. Corrects color not being inherited in IE6/7/8/9
 * 2. Corrects text not wrapping in FF3
 * 3. Corrects alignment displayed oddly in IE6/7
 */
legend {
 border: 0;
 /* 1 */
 padding: 0;
 white-space: normal;
 /* 2 */
 *margin-left: -7px;
 /* 3 */
}
/*
 * Addresses FF3/4 setting line-height on 'input' using !important in the UA stylesheet
 */
button, input {
 line-height: normal; /* 1 */
}
input {
 padding: 0.1em;
 vertical-align: middle;
}
/*
 * 1. Improves usability and consistency of cursor style between image-type 'input' and others
 * 2. Corrects inability to style clickable 'input' types in iOS
 * 3. Removes inner spacing in IE7 without affecting normal text inputs
 *    Known issue: inner spacing remains in IE6
 */
button, input[type="button"], input[type="reset"], input[type="submit"] {
 cursor: pointer;
 /* 1 */
 -webkit-appearance: button;
 /* 2 */
 *overflow: visible;
 /* 3 */
}
/*
 * Re-set default cursor for disabled elements
 */
button[disabled], input[disabled] {
 cursor: default;
}
input[type="checkbox"], input[type="radio"] {
 box-sizing: border-box;
 padding: 0;
 vertical-align: baseline;
}
/*
 * 1. Addresses appearance set to searchfield in S5, Chrome
 * 2. Addresses box-sizing set to border-box in S5, Chrome (include -moz to future-proof)
 */
input[type="search"] {
 -webkit-appearance: textfield;
 /* 1 */
 /* 2 */
 box-sizing: content-box;
}
/*
 * Removes inner padding and search cancel button in S5, Chrome on OS X
 */
input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button {
 -webkit-appearance: none;
}
/*
 * Removes inner padding and border in FF3+
 * www.sitepen.com/blog/2008/05/14/the-devils-in-the-details-fixing-dojos-toolbar-buttons/
 */
button::-moz-focus-inner, input::-moz-focus-inner {
 border: 0;
 padding: 0;
}
legend {
 background: #FFF;
 color: #333;
 padding: 0.3em;
}
select {
 padding: 0;
 vertical-align: baseline;
}
/* for IE6 */
* html select {
 vertical-align: middle;
}
/* for IE7 */
*:first-child + html select {
 vertical-align: -0.2em;
}
textarea {
 line-height: 1.4;
 padding: 0.1em;
 vertical-align: middle;
}
/*
 * 1. Removes default vertical scrollbar in IE6/7/8/9
 * 2. Improves readability and alignment in all browsers
 */
textarea {
 overflow: auto;
 /* 1 */
 vertical-align: top; /* 2 */
}
/* =============================================================================
   Tables
   ========================================================================== */
table {
 border-collapse: collapse;
 border-spacing: 0;
 font-size: 100%;
}
/* =============================================================================
   Image
   ========================================================================== */
img {
 border: 0;
}
img {
 vertical-align: bottom;
 line-height: 0px;
}
/*
 * Improves image quality when scaled in IE7
 * code.flickr.com/blog/2008/11/12/on-ui-quality-the-little-things-client-side-image-resizing/
 */
img {
 -ms-interpolation-mode: bicubic;
}
/* =============================================================================
   Others
   ========================================================================== */
ing, abbr, acronym, fieldset {
 border: 0;
}
/*
 * Define consistent border, margin, and padding
 */
fieldset {
 margin: 0 2px;
 padding: 0.35em 0.625em 0.75em;
}
/*
 * Corrects overflow displayed oddly in IE9
 */
svg:not(:root) {
 overflow: hidden;
}
address, caption, cite, code, dfn, em, strong, th, var {
 font-style: normal;
 font-weight: normal;
}
caption, th {
 text-align: left;
}
code, kbd, pre, samp, tt {
 font-family: monospace;
 _font-family: 'courier new', monospace;
 line-height: 100%;
}
/* for IE7 */
*:first-child + html code, *:first-child + html kbd, *:first-child + html pre, *:first-child + html samp, *:first-child + html tt {
 font-size: 108%;
}
/* =============================================================================
   Common Style
   ========================================================================== */
h1, h2, h3, h4, h5, h6 {
 font-size: 100%;
 font-weight: normal;
}
hr, legend {
 display: none;
}
object, embed {
 vertical-align: top;
}
ol, ul {
 list-style-type: none;
}
abbr, acronym {
 cursor: help;
}
caption {
 text-align: center;
}
b, em, strong {
 font-weight: bold;
}
/* =============================================================================
   common
   ========================================================================== */
/* =============================================================================
   component
   ========================================================================== */
.c-text-box, .c-txt-area {
 font-size: 14px;
 font-size: 1.4rem;
 line-height: 1.7;
 border: 1px solid #9e9e9e;
 width: 100%;
 height: 28px;
}
@media only screen and (max-width: 640px) {
 .c-text-box, .c-txt-area {
  -webkit-appearance: none;
 }
}
.error .c-text-box, .error .c-txt-area {
 background-color: #f8e2e2;
}
.c-text-box--narrow {
 width: 45%;
}
.c-txt-area {
 height: 163px;
}
.c-combo-box {
 border: 1px solid #9e9e9e;
 height: 28px;
}
.error .c-combo-box {
 background-color: #f8e2e2;
}
@media only screen and (max-width: 640px) {
 .c-combo-box {
  margin-bottom: 10px;
 }
}
.c-radio-btn {
 display: inline-block;
 *display: inline;
 *zoom: 1;
 margin-right: 5px;
}
/* =============================================================================
   layout
   ========================================================================== */
.c-section {
 width: 960px;
 margin: 0 auto;
 text-align: left;
}
@media only screen and (max-width: 640px) {
 .c-section {
  width: 92%;
 }
}
.c-section-block {
 padding-top: 80px;
 margin-bottom: 376px;
}
@media only screen and (max-width: 640px) {
 .c-section-block {
  padding-top: 35px;
  margin-bottom: 80px;
 }
}
html, body {
 height: 100%;
}
#wrapper {
 opacity: 0;
 filter: alpha(opacity=0);
 -ms-filter: "alpha( opacity=0 )";
}
#site-header {
 position: fixed;
 top: 0;
 left: 0;
 width: 100%;
 background-color: #fff;
 z-index: 9999;
}
#site-header .c-section {
 padding: 12px 0;
}
.site-title {
 float: left;
}
@media only screen and (max-width: 640px) {
 .site-title {
  width: 100px;
 }
}
.site-nav {
 float: right;
 padding-top: 6px;
}
@media only screen and (max-width: 640px) {
 .navList {
  width: 100%;
  display: table-cell;
  vertical-align: middle;
 }
}
.navListItem {
 float: left;
}
@media only screen and (max-width: 640px) {
 .navListItem {
  display: table;
  text-align: center;
  margin-left: 0;
  border-bottom: 1px solid #a4a4a4;
  width: 100%;
  height: 14%;
 }
}
.navListItem a {
 background: url("../images/head-nav.png") top left no-repeat;
 display: block;
 text-indent: -9999px;
 width: 696px;
 height: 41px;
 transition: opacity 0.3s linear;
}
.navListItem a:hover {
 opacity: 0.6;
 filter: alpha(opacity=60);
 -ms-filter: "alpha( opacity=60 )";
}
@media only screen and (max-width: 640px) {
 .navListItem a:hover {
  opacity: 1;
  filter: alpha(opacity=100);
  -ms-filter: "alpha( opacity=100 )";
 }
}
@media only screen and (max-width: 640px) {
 .navListItem a {
  background: none;
  font-size: 12px;
  font-size: 1.2rem;
  display: table-cell;
  text-indent: inherit;
  vertical-align: middle;
  height: 100%;
  width: auto !important;
  line-height: 100%;
 }
}
@media only screen and (max-width: 640px) {
 .navListItem a span {
  display: block;
  margin-bottom: 10px;
  font-size: 15px;
  font-size: 1.5rem;
 }
}
.navListItem--home a {
 width: 51px;
 background-position: 0 0;
 margin-right: 22px;
}
.navListItem--concept a {
 width: 82px;
 background-position: -80px 0;
 margin-right: 28px;
}
.navListItem--menu a {
 width: 82px;
 background-position: -189px 0;
 margin-right: 34px;
}
.navListItem--guide a {
 width: 72px;
 background-position: -306px 0;
 margin-right: 30px;
}
.navListItem--salon a {
 width: 58px;
 background-position: -423px 0;
 margin-right: 30px;
}
.navListItem--contact a {
 width: 98px;
 background-position: -516px 0;
 margin-right: 20px;
}
.navListItem--blog a {
 width: 47px;
 background-position: -650px 0;
}
@media only screen and (max-width: 640px) {
 .site-navOverlay {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: rgba(255, 255, 255, 0.9);
  display: table;
  visibility: hidden;
  -webkit-transform: translate3d(0, -100%, 0);
  transform: translate3d(0, -100%, 0);
  transition: -webkit-transform 0.4s ease-in-out, visibility 0s 0.4s;
  transition: transform 0.4s ease-in-out, visibility 0s 0.4s;
 }
 .site-navOverlay.open {
  visibility: visible;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  transition: -webkit-transform 0.4s ease-in-out;
  transition: transform 0.4s ease-in-out;
 }
}
.site-sp-menu {
 display: none;
}
@media only screen and (max-width: 640px) {
 .site-sp-menu {
  display: block;
  position: fixed;
  width: 60px;
  height: 60px;
  top: 0;
  right: 1%;
  transition-duration: 0.5s;
  cursor: pointer;
 }
 .site-sp-menu .icon {
  transition-duration: 0.25s;
  position: absolute;
  width: 30px;
  height: 2px;
  top: 30px;
  left: 15px;
  background-color: #000;
 }
 .site-sp-menu .icon.white {
  background-color: #fff;
 }
 .site-sp-menu .icon.white:before, .site-sp-menu .icon.white:after {
  background-color: #fff;
 }
 .site-sp-menu .icon:before, .site-sp-menu .icon:after {
  transition-duration: 0.25s;
  position: absolute;
  width: 30px;
  height: 2px;
  background-color: #000;
  content: "";
 }
 .site-sp-menu .icon:before {
  top: -7px;
  left: 0;
 }
 .site-sp-menu .icon:after {
  top: 7px;
  left: 0;
 }
 .site-sp-menu.open {
  transition-duration: 1s;
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
 }
 .site-sp-menu.open .icon {
  transition-duration: 0.5s;
  background-color: transparent;
 }
 .site-sp-menu.open .icon:before {
  transition-duration: 0.5s;
  top: 0;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
 }
 .site-sp-menu.open .icon:after {
  transition-duration: 0.5s;
  top: 0;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
 }
}
#site-footer small {
 font-size: 12px;
 font-size: 1.2rem;
}
@media only screen and (max-width: 640px) {
 #site-footer small {
  font-size: 10px;
  font-size: 1rem;
 }
}
/* =============================================================================
   top
   ========================================================================== */
.p-kv {
 width: 100%;
 height: 100%;
 overflow: hidden;
}
.p-kv .slider {
 width: 100%;
 height: 100%;
}
.kv-img {
 width: 100%;
 height: 100%;
}
.kv-img01 {
 background: url("../images/kv-img01.jpg") center center no-repeat;
 background-size: cover;
}
.kv-img02 {
 background: url("../images/kv-img02.jpg") center center no-repeat;
 background-size: cover;
}
.kv-img03 {
 background: url("../images/kv-img03.jpg") center center no-repeat;
 background-size: cover;
}
.p-concept {
 text-align: center;
}
.conceptMainTitle {
 position: relative;
 z-index: 1;
}
@media only screen and (max-width: 640px) {
 .conceptMainTitle {
  width: 115px;
  margin: 0 auto;
 }
}
.conceptSubTitle {
 margin-top: -17px;
 position: relative;
 z-index: 0;
}
@media only screen and (max-width: 640px) {
 .conceptSubTitle {
  margin: 0 auto 15px;
  width: 388px;
 }
}
@media only screen and (max-width: 420px) {
 .conceptSubTitle {
  width: 320px;
 }
}
@media only screen and (max-width: 350px) {
 .conceptSubTitle {
  width: 280px;
 }
}
.conceptSentence01 {
 font-size: 16px;
 font-size: 1.6rem;
}
@media only screen and (max-width: 640px) {
 .conceptSentence01 {
  font-size: 14px;
  font-size: 1.4rem;
  margin-top: 10px;
 }
}
.conceptSentence02 {
 margin: 15px 0 16px;
}
@media only screen and (max-width: 640px) {
 .conceptSentence02 {
  width: 97%;
  margin: 15px auto 5px;
 }
}
.conceptSentence03 {
 font-size: 13px;
 font-size: 1.3rem;
}
@media only screen and (max-width: 640px) {
 .conceptSentence03 {
  font-size: 12px;
  font-size: 1.2rem;
 }
}
.p-menu {
 text-align: center;
}
.menuMainTitle {
 margin-bottom: 39px;
}
@media only screen and (max-width: 640px) {
 .menuMainTitle {
  width: 77px;
  margin: 0 auto 19px;
 }
}
@media only screen and (max-width: 640px) {
 .menuSubTitle {
  width: 198px;
  margin: 0 auto;
 }
}
.menuBlock {
 margin-top: 38px;
}
@media only screen and (max-width: 640px) {
 .menuBlock {
  margin-top: 28px;
 }
}
.menuBlockTitle {
 margin-bottom: 18px;
}
@media only screen and (max-width: 640px) {
 .menuBlockTitle {
  margin-bottom: 10px;
 }
}
@media only screen and (max-width: 640px) {
 .menuBlockTitle--01 {
  width: 70px;
  margin-left: auto;
  margin-right: auto;
 }
}
@media only screen and (max-width: 640px) {
 .menuBlockTitle--02 {
  width: 100px;
  margin-left: auto;
  margin-right: auto;
 }
}
.menuBlockSentence {
 font-size: 14px;
 font-size: 1.4rem;
 line-height: 1.7;
}
@media only screen and (max-width: 640px) {
 .menuBlockSentence {
  font-size: 13px;
  font-size: 1.3rem;
  line-height: 1.7;
 }
}
.menuBlockPrice {
 margin: 17px auto 11px;
 width: 586px;
 border: 1px solid #a47a4a;
 padding: 3px;
}
@media only screen and (max-width: 640px) {
 .menuBlockPrice {
  width: 100%;
 }
}
.menuBlockPriceTbl {
 display: table;
 width: 100%;
 background-color: #f7eee4;
 padding: 15px 0 13px 60px;
}
@media only screen and (max-width: 640px) {
 .menuBlockPriceTbl {
  display: block;
  padding-left: 20px;
  padding-right: 20px;
 }
}
.menuBlockPriceTbl--02 {
 padding-left: 80px;
}
@media only screen and (max-width: 640px) {
 .menuBlockPriceTbl--02 {
  padding-left: 20px;
 }
}
.menuBlockPriceTblRow .th, .menuBlockPriceTblRow .td {
 font-size: 14px;
 font-size: 1.4rem;
 display: table-cell;
 color: #856a4c;
 padding: 6px 0;
 vertical-align: middle;
}
@media only screen and (max-width: 640px) {
 .menuBlockPriceTblRow .th, .menuBlockPriceTblRow .td {
  display: block;
  padding: 0;
  width: 100%;
 }
}
.menuBlockPriceTblRow .th {
 font-weight: bold;
 text-align: right;
 width: 200px;
}
.menuBlockPriceTbl--02 .menuBlockPriceTblRow .th {
 text-align: left;
 width: auto;
}
@media only screen and (max-width: 640px) {
 .menuBlockPriceTbl--02 .menuBlockPriceTblRow .th {
  text-align: center;
 }
}
@media only screen and (max-width: 640px) {
 .menuBlockPriceTblRow .th {
  margin-bottom: 3px;
  width: auto;
  text-align: center;
 }
}
.menuBlockPriceTblRow .td {
 text-align: left;
 padding-left: 6px;
}
@media only screen and (max-width: 640px) {
 .menuBlockPriceTblRow .td {
  padding: 0;
  margin-bottom: 25px;
  text-align: center;
 }
}
@media only screen and (max-width: 640px) {
 .menuBlockPriceTblRow.last-el-child .td {
  margin-bottom: 0px;
 }
}
@media only screen and (max-width: 640px) {
 .menuBlockPriceTblRow:last-child .td {
  margin-bottom: 0px;
 }
}
.guideMainTitle {
 margin-bottom: 55px;
 text-align: center;
}
@media only screen and (max-width: 640px) {
 .guideMainTitle {
  width: 84px;
  margin: 0 auto 19px;
 }
}
.guideStep {
 width: 882px;
 margin: 0 auto;
}
@media only screen and (max-width: 640px) {
 .guideStep {
  width: 100%;
 }
}
.guideStepList {
 margin-bottom: 30px;
}
@media only screen and (max-width: 640px) {
 .guideStepList {
  margin-bottom: 0;
 }
}
.guideStepListItem {
 width: 250px;
 float: left;
}
@media only screen and (max-width: 640px) {
 .guideStepListItem {
  width: 95%;
  float: none;
  margin: 0 auto;
 }
}
.guideStepListArrow {
 margin-top: 34px;
 float: left;
}
@media only screen and (max-width: 640px) {
 .guideStepListArrow {
  margin: 15px 0;
  float: none;
  text-align: center;
 }
}
.guideStepListArrow--pcnone {
 display: none;
}
@media only screen and (max-width: 640px) {
 .guideStepListArrow--pcnone {
  display: block;
 }
}
.guideStepListItemTitle {
 margin-bottom: 11px;
}
@media only screen and (max-width: 640px) {
 .guideStepListItemTitle {
  width: 20%;
 }
}
.guideStepListItemImg {
 border: 1px solid #b28850;
 margin-bottom: 15px;
}
@media only screen and (max-width: 640px) {
 .guideStepListItemImg img {
  width: 100%;
 }
}
@media only screen and (max-width: 640px) {
 .guideStepListItem--01 .guideStepListItemSentence dt {
  width: 48px;
 }
 .guideStepListItem--02 .guideStepListItemSentence dt {
  width: 33px;
 }
 .guideStepListItem--03 .guideStepListItemSentence dt {
  width: 65px;
 }
 .guideStepListItem--04 .guideStepListItemSentence dt {
  width: 33px;
 }
 .guideStepListItem--05 .guideStepListItemSentence dt {
  width: 34px;
 }
}
.guideStepListItemSentence dd {
 font-size: 14px;
 font-size: 1.4rem;
 line-height: 1.7;
 letter-spacing: -.04em;
 margin-top: 10px;
}
.guideStepListItemSentence dd p {
 margin-bottom: 18px;
}
.guideStepListItemSentence dd p.last-el-child {
 margin-bottom: 0;
}
.guideStepListItemSentence dd p:last-child {
 margin-bottom: 0;
}
.guideCaution {
 padding-left: 38px;
 font-size: 14px;
 font-size: 1.4rem;
 line-height: 1.7;
}
.guideCaution .sentence {
 margin-bottom: 18px;
}
.guideCaution .sentence.last-el-child {
 margin-bottom: 0;
}
.guideCaution .sentence:last-child {
 margin-bottom: 0;
}
@media only screen and (max-width: 640px) {
 .guideCaution {
  padding-left: 0;
  margin-top: 30px;
 }
}
.salonMainTitle {
 margin-bottom: 42px;
 text-align: center;
}
@media only screen and (max-width: 640px) {
 .salonMainTitle {
  width: 84px;
  margin: 0 auto 19px;
 }
}
.salonBlock {
 margin-bottom: 45px;
}
.salonBlock.last-el-child {
 margin-bottom: 0;
}
.salonBlock:last-child {
 margin-bottom: 0;
}
@media only screen and (max-width: 640px) {
 .salonBlock {
  margin-bottom: 30px;
 }
}
.salonBlockTitle {
 margin-bottom: 20px;
}
@media only screen and (max-width: 640px) {
 .salonBlockTitle {
  margin-bottom: 15px;
 }
}
@media only screen and (max-width: 640px) {
 .salonBlock--landscape .salonBlockTitle {
  width: 180px;
 }
}
@media only screen and (max-width: 640px) {
 .salonBlock--access .salonBlockTitle {
  width: 120px;
 }
}
@media only screen and (max-width: 640px) {
 .salonBlock--info .salonBlockTitle {
  width: 90px;
 }
}
.salonBlockPhotoItem {
 float: left;
 margin-right: 12px;
}
.salonBlockPhotoItem.last-el-child {
 margin-right: 0;
}
.salonBlockPhotoItem:last-child {
 margin-right: 0;
}
@media only screen and (max-width: 640px) {
 .salonBlockPhotoItem {
  width: 48%;
  margin-right: 2%;
  margin-bottom: 2.2%;
 }
}
.salonBlockMap {
 border: 1px solid #81511c;
}
.salonBlockMap #map {
 width: 100%;
 height: 385px;
}
.salonBlockTbl {
 width: 100%;
 margin-bottom: 1%;
}
.salonBlockTbl th, .salonBlockTbl td {
 border: 1px solid #81511c;
 padding: 8px 0 6px;
 font-size: 14px;
 font-size: 1.4rem;
}
@media only screen and (max-width: 640px) {
 .salonBlockTbl th, .salonBlockTbl td {
  font-size: 13px;
  font-size: 1.3rem;
 }
}
.salonBlockTbl th {
 text-align: center;
 background-color: #faf3ea;
 width: 214px;
}
@media only screen and (max-width: 640px) {
 .salonBlockTbl th {
  width: 30%;
 }
}
.salonBlockTbl td {
 padding-left: 35px;
}
@media only screen and (max-width: 640px) {
 .salonBlockTbl td {
  padding-left: 15px;
  padding-right: 15px;
 }
}
.p-contact {
 margin-bottom: 70px;
}
.contactMainTitle {
 margin-bottom: 54px;
 text-align: center;
}
@media only screen and (max-width: 640px) {
 .contactMainTitle {
  width: 113px;
  margin: 0 auto 19px;
 }
}
.contactSubTitle {
 text-align: center;
}
@media only screen and (max-width: 640px) {
 .contactSubTitle {
  width: 80px;
  margin: 0 auto;
 }
}
.contactSentece {
 font-size: 14px;
 font-size: 1.4rem;
 line-height: 1.8;
 margin: 15px 0 27px;
 text-align: center;
}
.contactTel {
 display: flex;
 flex-wrap: wrap;
 justify-content: center;
}
.contactTel li {
 width: 40%;
	margin: 0 20px;
}
.contactTel li p:nth-of-type(1){
	margin: 0 auto 10px;
 font-size: 2.4rem;
	font-weight: 600;
}
.contactTel li p:nth-of-type(2){
 font-size: 1.5rem;
	font-weight: 600;
}
.contactTel li img {
 width: 100%;
 display: block;
}
@media only screen and (max-width: 640px) {
 .contactTel li {
 width: 100%;
  margin: 0 20px 10px;
 }
}
.contactForm {
 width: 438px;
 margin: 0 auto;
}
@media only screen and (max-width: 640px) {
 .contactForm {
  width: 100%;
 }
}
.contactFormBlock {
 margin-bottom: 18px;
 font-size: 14px;
 font-size: 1.4rem;
}
.contactFormBlock dt {
 margin-bottom: 8px;
}
.contactFormBlock dt .req {
 color: #7d0000;
}
.contactFormBlock .sentence {
 display: inline-block;
 *display: inline;
 *zoom: 1;
 margin-left: 10px;
}
.contactFormBlock .error span {
 display: block;
 color: #FF3E3E;
 font-size: 12px;
 font-size: 1.2rem;
 margin-top: 5px;
}
.contactFormBlock--gender dt, .contactFormBlock--gender dd {
 display: inline-block;
 *display: inline;
 *zoom: 1;
 margin-right: 25px;
}
.contactFormBlock--gender dt label, .contactFormBlock--gender dd label {
 display: inline-block;
 *display: inline;
 *zoom: 1;
 margin-right: 25px;
}
.contactBtn {
 width: 200px;
 margin: 30px auto 0;
}
.contactBtn a {
 display: block;
 border: 2px solid #c79f72;
 border-radius: 7px;
 background: linear-gradient(#997145, #6e4519);
 padding: 15px 0;
 text-align: center;
 transition: opacity 0.3s linear;
}
.contactBtn a:hover {
 opacity: 0.6;
 filter: alpha(opacity=60);
 -ms-filter: "alpha( opacity=60 )";
}
@media only screen and (max-width: 640px) {
 .contactBtn a:hover {
  opacity: 1;
  filter: alpha(opacity=100);
  -ms-filter: "alpha( opacity=100 )";
 }
}
.no-cssgradients .contactBtn a {
 background-color: #997145;
}
.p-aftersend {
 font-size: 14px;
 font-size: 1.4rem;
 line-height: 1.8;
 padding: 150px 0 70px;
}
.p-aftersend a {
 transition: opacity 0.3s linear;
}
.p-aftersend a:hover {
 opacity: 0.6;
 filter: alpha(opacity=60);
 -ms-filter: "alpha( opacity=60 )";
}
@media only screen and (max-width: 640px) {
 .p-aftersend a:hover {
  opacity: 1;
  filter: alpha(opacity=100);
  -ms-filter: "alpha( opacity=100 )";
 }
}
/* =============================================================================
   link
   ========================================================================== */
#link .link_bg {
 width: 100%;
 margin-bottom: 30px;
 padding: 30px 0;
 background-color: #f7eee4;
}
#link .link_bg .inner {
 width: 650px;
 margin: 0 auto;
 overflow: hidden;
}
#link .link_bg .inner .menuMainTitle {
 margin-bottom: 20px;
}
#link .link_bg .inner .left {
 float: left;
 with: 286px;
}
#link .link_bg .inner .right {
 float: right;
 width: 300px;
}
#link .link_bg .inner a {
 display: block;
 padding-bottom: 10px;
}
#link .link_bg .inner span {
 display: block;
 font-size: 1.2em;
}
@media only screen and (max-width: 640px) {
 #link .link_bg .inner {
  width: 100%;
 }
 #link .link_bg .inner .left, #link .link_bg .inner .right {
  width: 60%;
  margin: auto;
  float: none;
 }
}
h2 {
 font-size: 18px;
 font-size: 1.8rem;
 font-weight: bold;
}
@media only screen and (max-width: 640px) {
 h2 {
  font-size: 15px;
  font-size: 1.5rem;
 }
}