@import url(https://fonts.googleapis.com/earlyaccess/notosansjp.css);
/* fontDesignation - 'Noto Sans JP' */
@import url('https://fonts.googleapis.com/css?family=Amarante');
/* font-family: 'Amarante', cursive; */

html,body { font-family:'Noto Sans JP'; }

body {
    padding: 24px;
    box-sizing: border-box;
    
    background: rgb(234,212,163);
    background: -moz-linear-gradient(top, rgba(234,212,163,1) 0%, rgba(253,237,202,1) 50%, rgba(249,245,237,1) 99%);
    background: -webkit-linear-gradient(top, rgba(234,212,163,1) 0%,rgba(253,237,202,1) 50%,rgba(249,245,237,1) 99%);
    background: linear-gradient(to bottom, rgba(234,212,163,1) 0%,rgba(253,237,202,1) 50%,rgba(249,245,237,1) 99%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ead4a3', endColorstr='#f9f5ed',GradientType=0 );
    
    }

@media only screen and (max-width: 767px) {
body { padding: 12px 12px 42px; }
}

#container {
    border: solid 1px #ad9f7d;
    background: #FFF;
    }

#containerInner {
    overflow: hidden;
    width: 100%;
    padding-left: 188px;
    box-sizing: border-box;
    padding-top: 24px;
    padding-right: 24px;
    }

#main { width: 100%; }
p {margin: 0; padding: 0;}
a:hover {opacity: 1;}

.pageWrap {
	}

.footerIframe {
    width: 1px;
    height: 1px;
    border: none;
    }

::selection {
    background: #ec9c07;
    color: #fff;
	}

::-moz-selection {
    background: #ec9c07;
    color: #fff;
	}

/* site main color #ec9c07 */
/* site sub color  #ad9f7d */

/*=================================================
    pager
=================================================*/

.pager {
    position: relative;
    overflow: hidden;
    margin: 0;
    bottom: -42px;
    }

.pager ul { margin: 0; }
.pager ul li {
    margin: 0 1px;
    position: relative;
    left: -50%;
    float: left;
    border: solid 1px #333;
    background: #EEE;
    border-radius: 6px;
    }

.pager ul li a {
    background: #FFF;
    color: #333;
    text-decoration: none;
    transition: .2s;
    border-radius: 6px;
    }

.pager ul li a:hover {
    background: #ec9c07;
    color: #FFF;
    }

@media only screen and (max-width: 1024px) {

.pager { bottom: -36px; }

}

/*=================================================
    pan-kuzu
=================================================*/

.pan ul {
    display: block;
    font-size: 0;
    margin: 16px auto ;
    }

.pan ul li {
    position: relative;
    display: inline-block;
    font-size: 12px;
    line-height: 24px;
    padding: 0 12px;
    border: solid 1px #333;
    border-radius: 30px;
    }

.pan ul li:nth-child(n+2) { margin-left: 18px;}
.pan ul li:nth-child(n+2)::before {
    content: "〉";
    position: absolute;
    left: -13px;
    }

.pan ul li a { color: #333; transition: .2s; }
.pan ul li a:hover { color: #ec9c07; }

@media only screen and (max-width: 1024px) {
.pan ul li { line-height: 18px; }
}

@media only screen and (max-width: 767px) {
.pan ul li { margin-bottom: 6px;}
}

/*=================================================
	mandara-animation
=================================================*/

.mandara-anime {
    position: absolute;
    background: url(/img/upload/2018/12/mandala04.png) no-repeat;
    background-size: 480px;
    width: 480px;
    height: 480px;
    z-index: 0;
    top: -70px;
    left: 90px;
    animation: spin 120s linear infinite;
    }

.mandara-anime02 {
    position: absolute;
    background: url(/img/upload/2018/12/mandala05.png) no-repeat;
    background-size: 480px;
    width: 480px;
    height: 480px;
    z-index: 0;
    top: -90px;
    right: -120px;
    animation: spin-re 120s linear infinite;
    }

@keyframes spin {
	0% {transform: rotate(0deg);}
	100% {transform: rotate(360deg);}
    }

@keyframes spin-re {
	0% {transform: rotate(0deg);}
	100% {transform: rotate(-360deg);}
    }

@media only screen and (max-width: 1024px) {

.mandara-anime { top: -58px; left: 24px; }
.mandara-anime02 { top: -68px; }

}

/*=================================================
	pintarest icon
=================================================*/

@media only screen and (min-width: 768px) {

	.pinterestBtn { margin: 0; }
	
	.pinterestBtn span {
		height: 30px !important;
		width: 30px !important;
		background: url(/img/upload/2018/12/social_icons_pin.png) !important;
		background-position: center !important;
		background-size: 30px 30px !important;
		box-shadow: none;
		}
	
	.pinterestBtn span:hover { opacity: 0.5; }

}

@media only screen and (max-width: 767px) {

	.pinterestBtn { margin: 0; }
	
	.pinterestBtn span {
		height: 26px !important;
		width: 26px !important;
		background: url(/img/upload/2018/12/social_icons_pin.png) !important;
		background-position: center !important;
		background-size: 26px 26px !important;
		box-shadow: none;
		}

}

/*=================================================
	header
=================================================*/

#spFixBtn { display: none; }
.headerSp { display: none; }

header { border: none; }
#vivarthHeader {
    position: fixed;
    text-align: center;
    width: 140px;
    top: 48px;
    left: 48px;
    }

#vivarthHeader .headerBox {
    border: solid 1px #000;
    border-radius: 12px;
    overflow: hidden;
    }

header .mandara-header-left {
    position: absolute;
    background: url(/img/upload/2018/12/mandala_header_left.png) no-repeat;
    background-size: 120px;
    width: 120px;
    height: 120px;
    top: 24px;
    left: 24px;
    }

header .mandara-header-center {
    position: absolute;
    background: url(/img/upload/2018/12/mandala03.png) no-repeat;
    background-size: 240px;
    width: 240px;
    height: 50px;
    top: 21px;
    left: 50%;
    margin-left: -120px;
    z-index: 1000;
    }

header .mandara-header-right {
    position: absolute;
    background: url(/img/upload/2018/12/mandala_header_right.png) no-repeat;
    background-size: 120px;
    width: 120px;
    height: 120px;
    top: 24px;
    right: 24px;
    z-index: 1000;
    }

#vivarthHeader h1 {
    padding: 12px;
    margin: 0;
    }

#vivarthHeader h1 a { transition: .2s; }
#vivarthHeader h1 a:hover {
    -webkit-filter:brightness(125%);
    -moz-filter:brightness(125%);
    -ms-filter:brightness(125%);
    filter:brightness(125%);
    }

#vivarthHeader nav ul { margin: 0; }

/*
#vivarthHeader nav ul::-webkit-scrollbar {
    display: none;
}
*/

#vivarthHeader nav ul li { border-bottom: dotted 1px #EEE; }
#vivarthHeader nav ul li:last-child { border: none; }

#vivarthHeader nav ul li a {
    position: relative;
    display: block;
    padding: 8px 0;
    font-family: 'Amarante', cursive;
    font-size: 12px;
    letter-spacing: 1px;
    font-weight: bold;
    color: #333;
    transition: .3s;
    overflow: hidden;
    }

#vivarthHeader nav ul li a:hover { color: #FFF; }
#vivarthHeader nav ul li a::before {
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    content: '';
    width: 120%;
    height: 100%;
    background: #ec9c07;
    transform-origin: right top;
    transform: skewX(-30deg) scale(0, 1);
    transition: transform .3s;
    }

#vivarthHeader nav ul li a:hover::before {
    transform-origin: left top;
    transform: skewX(-30deg) scale(1, 1);
    }

#vivarthHeader .headerSide {
    position: absolute;
    width: 36px;
    top: 90px;
    left: -36px;
    }

#vivarthHeader .headerSide li { transition: .2s; }
#vivarthHeader .headerSide li:hover {
    -webkit-filter:brightness(125%);
    -moz-filter:brightness(125%);
    -ms-filter:brightness(125%);
    filter:brightness(125%);
    }

@media only screen and (max-width: 1024px) {

#vivarthHeader h1 { padding: 12px; }
#vivarthHeader { width: 140px; }
#containerInner { padding-left: 188px; }

}

@media only screen and (max-width: 767px) {
/* Sp Fix Start */

#spFixBtn {
    position: fixed;
    width: 90%;
    display: block;
    bottom: 6px;
    left: 50%;
    margin-left: -45%;
    z-index: 9999;
    }

#spFixBtn ul {
    display: block;
    width: 100%;
    margin: 0;
    padding: 0;
    font-size: 0;
    }

#spFixBtn ul li {
    display: inline-block;
    width: 50%;
    }

/* Sp Fix End */
/* Sp Nav Start */

.headerSp { display: block; }

.buttonWrap {
    position: relative;
    width: 18px;
    }


.button_container {
    position: absolute;
    top: 48px;
    left: 38%;
    height: 14px;
    width: 80px;
    cursor: pointer;
    z-index: 100;
    border: solid 1px #333;
    padding: 9px;
    border-radius: 6px;
    text-align: left;
    transition: .2s;
    }

.button_container p {
    font-size: 14px;
    padding-left: 32px;
    font-weight: bold;
    margin-top: -1px;
    }

.button_container.active {
    position: fixed;
    border-color: #FFF;
    width: 260px;
    left: 50%;
    margin-left: -140px;
    background: rgba(255,255,255,.25);
    }

.button_container.active p { color: #FFF; }
.button_container.active .top {
    -webkit-transform: translateY(6px) translateX(0) rotate(45deg);
    transform: translateY(6px) translateX(0) rotate(45deg);
    background: #FFF;
    }

.button_container.active .middle {
    opacity: 0;
    background: #FFF;
    }

.button_container.active .bottom {
    -webkit-transform: translateY(-6px) translateX(0) rotate(-45deg);
    transform: translateY(-6px) translateX(0) rotate(-45deg);
    background: #FFF;
    }

.button_container span {
    background: #333;
    border: none;
    height: 2px;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    transition: all .35s ease;
    cursor: pointer;
    }

.button_container span:nth-of-type(2) { top: 6px; }
.button_container span:nth-of-type(3) { top: 12px; }

.overlay {
    position: fixed;
    background: #ec9c07;
    top: 0;
    left: 0;
    width: 100%;
    height: 0%;
    opacity: 0;
    visibility: hidden;
    transition: opacity .35s, visibility .35s, height .35s;
    overflow: hidden;
    }

.overlay.open {
    opacity: .9;
    visibility: visible;
    height: 100%;
    }

.overlay.open li {
  -webkit-animation: fadeInRight .5s ease forwards;
          animation: fadeInRight .5s ease forwards;
  -webkit-animation-delay: .35s;
          animation-delay: .35s;
    }

.overlay.open li:nth-of-type(2) {
  -webkit-animation-delay: .35s;
          animation-delay: .35s;
    }

.overlay nav {
    position: relative;
    height: auto;
    top: 50%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    font-family: 'Vollkorn', serif;
    font-weight: 400;
    text-align: center;
    }

.overlay ul {
    list-style: none;
    padding: 0;
    margin: 0 auto;
    display: inline-block;
    position: relative;
    height: 100%;
    }

#vivarthHeader nav ul { margin: 0; }
#vivarthHeader nav ul li { border-bottom:none; }
#vivarthHeader nav ul li a {
    position: relative;
    display: block;
    padding: 10px 0;
    font-family: 'Amarante', cursive;
    font-size: 21px;
    letter-spacing: 1px;
    font-weight: bold;
    color: #FFF;
    transition: .3s;
    overflow: hidden;
    }

.overlay ul li {
    display: inline-block;
    width: 40%;
    height: auto;
    min-height: auto;
    position: relative;
    opacity: 0;
    }

.overlay ul li a {
    display: block;
    position: relative;
    color: #FFF;
    text-decoration: none;
    overflow: hidden;
    }

.overlay ul li a:hover:after,
.overlay ul li a:focus:after,
.overlay ul li a:active:after {
    width: 100%;
    }

.overlay ul li a:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 0%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    height: 3px;
    background: #FFF;
    transition: .35s;
    }

@-webkit-keyframes fadeInRight {
  0% {
    opacity: 0;
    left: 20%;
  }
  100% {
    opacity: 1;
    left: 0;
  }
}

@keyframes fadeInRight {
  0% {
    opacity: 0;
    left: 20%;
  }
  100% {
    opacity: 1;
    left: 0;
  }
}

/* Sp Nav End */

header {
    border: none;
    height: 84px;
    }

.headerBox nav,
.headerSide { display: none; }

#vivarthHeader {
    position: absolute;
    text-align: center;
    width: 100%;
    padding: 24px;
    top: 0;
    left: 0;
    z-index: 1000;
    box-sizing: border-box;
    }

#vivarthHeader .headerBox {
    width: 30%;
    border: none;
    border-radius: inherit;
    }

#vivarthHeader h1 { padding: 0; }

header .mandara-header-left {
    background-size: 60px;
    width: 60px;
    height: 60px;
    top: 12px;
    left: 12px;
    }

header .mandara-header-right {
    background-size: 60px;
    width: 60px;
    height: 60px;
    top: 12px;
    right: 12px;
    }

header .mandara-header-center {
    background-size: 120px;
    width: 120px;
    height: 25px;
    top: 11px;
    margin-left: -60px;
    }

#containerInner { padding: 0 12px; }

}

/*=================================================
	footer
=================================================*/

footer li.spRecruit { display: none; }

footer {
    position: relative;
    width: 100%;
    left: 0;
    padding: 0;
    background-color: inherit;
    }

footer .mandara-footer-left {
    position: absolute;
    background: url(/img/upload/2018/12/mandala_header_left.png) no-repeat;
    background-size: 120px;
    width: 120px;
    height: 120px;
    bottom: 0;
    left: -288px;
    transform: rotate(-90deg);
    }

footer .mandara-footer-right {
    position: absolute;
    background: url(/img/upload/2018/12/mandala_header_right.png) no-repeat;
    background-size: 120px;
    width: 120px;
    height: 120px;
    bottom: 0;
    right: -24px;
    z-index: 1000;
    transform: rotate(90deg);
    }

footer .footerBox {
    position: absolute;
    display: block;
    width: 80%;
    min-width: 750px;
    margin-left: -40%;
    bottom: 36px;
    left: 50%;
    z-index: 5000;
    }

footer .footerBox-top { margin-bottom: 36px; }
footer .footerBox-top ul {
    display: block;
    text-align: center;
    margin: 0;
    }

footer .footerBox-top ul li {
    display: inline-block;
    vertical-align: middle;
    text-align: left;
    }

footer .footerBox-top ul li:first-child a,
footer .footerBox-bottom ul li a { transition: .2s; }
footer .footerBox-top ul li:first-child a:hover,
footer .footerBox-bottom ul li a:hover {
    -webkit-filter:brightness(125%);
    -moz-filter:brightness(125%);
    -ms-filter:brightness(125%);
    filter:brightness(125%);
    }

footer .footerBox-top ul li:first-child { width: 120px; }
footer .footerBox-top ul li:nth-child(2) {
    padding: 0 24px;
    font-size: 12px;
    line-height: 18px;
    border-right: dotted 2px #CCC;
    }

footer .footerBox-top ul li p.salonName {
    font-family: 'Amarante', cursive;
    font-weight: bold;
    font-size: 16px;
    letter-spacing: 1px;
    margin-bottom: 3px;
    }

footer .footerBox-top ul li p.footerTel {
    font-family: 'Amarante', cursive;
    font-size: 24px;
    line-height: 36px;
    }

footer .footerBox-top ul li p.footerTel a { color: #333; transition: .2s; }
footer .footerBox-top ul li p.footerTel a:hover { color:#ec9c07; }

footer .businessHourWrapper {
    display: flex;
    align-items: center;
    font-size: 10px;
    line-height: 14px;
    }

footer .businessHourWrapper div.businessHour { padding: 0 24px; }
footer .businessHourWrapper p,
footer .businessHour p{
    font-weight: bold;
    font-size: 14px;
    margin: 0 0 6px !important;
    }

footer .businessHourWrapper dl,
footer .businessHour dl{
    margin: 0;
    line-height: 16px;
    }

footer .footerBox-center {
    margin-bottom: 12px;
    padding-bottom: 12px;
    border-bottom: dotted 2px #CCC;
    }

footer .footerBox-center ul {
    display: flex;
    align-items: center;
    margin: 0;
    }

footer .footerBox-center ul li {
    width: 25%;
    text-align: center;
    margin-right: 12px;
    background: #FFF;
    }

footer .footerBox-center ul li:last-child { margin-right: 0; }
footer .footerBox-center ul li a {
    position: relative;
    display: block;
    border: solid 1px #333;
    padding: 6px 0;
    font-size: 12px;
    font-weight: bold;
    color: #333;
    border-radius: 6px;
    transition: .3s;
    overflow: hidden;
    z-index: 1;
    }

footer .footerBox-center ul li a:hover { color: #FFF; }
footer .footerBox-center ul li a::before {
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    content: '';
    width: 120%;
    height: 100%;
    background: #ec9c07;
    transform-origin: right top;
    transform: skewX(-30deg) scale(0, 1);
    transition: transform .3s;
    }

footer .footerBox-center ul li a:hover::before {
    transform-origin: left top;
    transform: skewX(-30deg) scale(1, 1);
    }

footer .footerBox-bottom ul {
    float: left;
    text-align: left;
    font-size: 0;
    }

footer .footerBox-bottom ul li {
    display: inline-block;
    width: 24px;
    margin-right: 6px;
    }

footer .footerBox-bottom .copy {
    float: right;
    font-size: 11px;
    font-weight: bold;
    letter-spacing: 0.5px;
    }

footer .footer-bar {
    position: relative;
    bottom: 324px;
    width: 100%;
    height: 9px;
    background: url(/img/upload/2018/12/footerbar.png) repeat-x;
    }

a#goTop {
    position: absolute;
    display: block;
    width: 58px;
    margin: 0;
    padding: 0;
    background: initial;
    background-position: center;
    text-align: center;
    color: #333;
    clear: left;
    letter-spacing: .11em;
    right: 3px;
    bottom: 96px;
    transition: .2s;
    }

a#goTop:hover {
    bottom: 108px;
    -webkit-filter:brightness(125%);
    -moz-filter:brightness(125%);
    -ms-filter:brightness(125%);
    filter:brightness(125%);
    }

@media only screen and (max-width: 1279px) {

footer .footerBox { margin-left: 0; left: 0; }

}

@media only screen and (max-width: 1180px) {

footer .footerBox { min-width: auto; }
footer .footerBox-top ul li:nth-child(2) {
    border: none;
    padding: 0 0 0 24px;
    }

footer .footerBox-top ul li:last-child {
    display: block;    
    margin-top: 24px;
    }

footer .businessHourWrapper {
    display: block;
    text-align: center;
    }

footer .businessHourWrapper div.businessHour {
    padding: 0 24px 0 0;
    display: inline-block;
    }

footer .businessHourWrapper div.finalAcceptance { display: inline-block; }
footer .footer-bar { bottom: 444px; }

}

@media only screen and (max-width: 1024px) {

footer .footer-bar { bottom: 452px; }
footer .footerBox-top ul li:first-child { width: 104px; }
footer .footerBox-top ul li:nth-child(2) {
    padding: 0 0 0 18px;
    font-size: 11px;
    }

footer .mandara-footer-left { left: -228px; }

}

@media only screen and (max-width: 767px) {

footer li.spRecruit { display: block; }

footer .footerBox {
    width: 100%;
    z-index: 900;
    bottom: 100px;
    }

footer .footer-bar { bottom: 832px; }
footer .footerBox-top { margin-bottom: 24px; }
footer .footerBox-center ul { flex-wrap: wrap; }
footer .footerBox-center ul li {
    width: 100%;
    text-align: center;
    margin-right: 0;
    margin-bottom: 12px;
    background: #FFF;
    }

footer .footerBox-top ul li:nth-child(2) { padding: 0; }
footer .footerBox-top ul li:first-child {
    width: 100%;
    margin-bottom: 24px;
    }

footer .footerBox-top ul li:first-child a {
    display: block;
    width: 120px;
    margin: 0 auto;
    }

footer .footerBox-center { margin-bottom: 24px; }
footer .footerBox-bottom ul {
    float: none;
    text-align: center;
    font-size: 0;
    }

footer .footerBox-bottom .copy {
    float: none;
    text-align: center;
    font-size: 11px;
    font-weight: bold;
    letter-spacing: 0.5px;
    margin: 24px auto 0;
    }

footer .mandara-footer-right {
    background-size: 60px;
    width: 60px;
    height: 60px;
    right: -12px;
    }

footer .mandara-footer-left {
    background-size: 60px;
    width: 60px;
    height: 60px;
    left: -12px;
    }

a#goTop {
    width: 42px;
    margin-left: -21px;
    right: auto;
    left: 50%;
    bottom: 12px;
    }

a#goTop:hover { bottom: 12px; }

}

/*=================================================
    sidebar
=================================================*/

#sub {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    }

#sub .subBox .titleArea {
    text-align: center;
    margin: 0 auto 48px;
    border-bottom: 1px solid #ad9f7d;
    }

#sub .subBox .titleArea p {
    position: relative;
    float: none;
    display: inline-block;
    margin: 0;
    padding: 0 36px;
    color: #333;
    font-weight: normal;
    bottom: -18px;
    background: #FFF;
    }

#sub .subBox .titleArea p::before {
    content: "≪";
    position: absolute;
    color: #ad9f7d;
    left: -3px;
    bottom: 5px;
    font-size: 24px;
    }

#sub .subBox .titleArea p::after {
    content: "≫";
    position: absolute;
    color: #ad9f7d;
    right: -3px;
    bottom: 5px;
    font-size: 24px;
    }

#sub .subBox .titleArea p span.en {
    font-size: 36px;
    font-family: 'Amarante', cursive;
    letter-spacing: 0;
    }

#subCategory ul {
    display: block;
    text-align: center;
    font-size: 0;
    }

#subCategory ul li {
    display: inline-block;
    font-size: 12px;
    }

#sub #subStaff ul li a,
#sub #subCategory ul li a,
#sub #subFaq ul li a,
#sub #subNewscate ul li a,
#sub #subMedicate ul li a,
#sub #subBlogcate ul li a {
    position: relative;
    display: block;
    margin: 6px;
    padding: 6px 24px;
    color: #333;
    font-size: 14px;
    border: solid 1px #333;
    border-radius: 6px;
    transition: .3s;
    overflow: hidden;
    z-index: 1;
    }

#sub #subStaff ul li a:hover,
#sub #subCategory ul li a:hover,
#sub #subFaq ul li a:hover,
#sub #subNewscate ul li a:hover,
#sub #subMedicate ul li a:hover,
#sub #subBlogcate ul li a:hover { color: #FFF; }

#sub #subStaff ul li a::before,
#sub #subCategory ul li a::before,
#sub #subFaq ul li a::before,
#sub #subNewscate ul li a::before,
#sub #subMedicate ul li a::before,
#sub #subBlogcate ul li a::before {
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    content: '';
    width: 120%;
    height: 100%;
    background: #ec9c07;
    transform-origin: right top;
    transform: skewX(-30deg) scale(0, 1);
    transition: transform .3s;
    }

#sub #subStaff ul li a:hover::before,
#sub #subCategory ul li a:hover::before,
#sub #subFaq ul li a:hover::before,
#sub #subNewscate ul li a:hover::before,
#sub #subMedicate ul li a:hover::before,
#sub #subBlogcate ul li a:hover::before {
    transform-origin: left top;
    transform: skewX(-30deg) scale(1, 1);
    }

#sub #subStaff ul,
#sub #subBlogcate ul,
#sub #subFaq ul { text-align: center }
#sub #subStaff ul li,
#sub #subBlogcate ul li,
#sub #subFaq ul li { display: inline-block; }

@media only screen and (max-width: 1024px) {

#sub .subBox { margin: 0; }
#sub .subBox .titleArea {
    margin: 0 auto 48px;
    padding: 0;
    }

}

@media only screen and (max-width: 1024px) {

#sub .subBox .titleArea p { padding: 0 24px; letter-spacing:0; bottom: -20px; }
#sub .subBox .titleArea p span.en { font-size: 30px; }
#sub .subBox .titleArea p span.jp { font-family:'Noto Sans JP'; }

}

/*=================================================
	contents
=================================================*/

body.top #content,
body.lower #content {
    display: block;
    width: 100%;
    padding-bottom: 360px; /* footer size */
    }

body.lower.onecolumn #content #main { width: 100%; }

@media only screen and (max-width: 1180px) {

body.top #content,
body.lower #content {
    padding-bottom: 460px; /* footer size */
    }

}

@media only screen and (max-width: 767px) {

body.top #content,
body.lower #content {
    padding-bottom: 840px; /* footer size */
    }

}

body.lower #pageTitleArea {
    position: relative;
    margin: 0 auto;
    padding: 84px 0;
    width: 100%;
    height: auto;
    background: url(/img/upload/2018/12/titlebk01.jpg) no-repeat;
    background-size: 1920px;
    background-position: center center;
    border-radius: 12px;
    }

body.lower #pageTitleArea h2 {
    position: relative;
    margin: 0;
    padding: 0;
    text-align: center;
    font-size: 1.8rem;
    font-weight: bold;
    color: #FFF;
    text-shadow: 0 0 5px #000, 0 0 10px #000;
    z-index: 10;
    }

body.lower #pageTitleArea h2 span {
    display: block;
    margin-bottom: 0;
    font-size: 84px;
    font-weight: normal;
    font-family: 'Amarante', cursive;
    letter-spacing: 0;
    }

body.lower #pageTitleArea .titleFrame {
    position: absolute;
    width: 480px;
    height: 140px;
    border: solid 1px #FFF;
    top: 51%;
    left: 50%;
    margin-top: -70px;
    margin-left: -240px;
    transform: rotate(3deg);
    background: rgba(255,255,255,.25);
    }

body.lower #pageTitleArea .titleFrame2 {
    position: absolute;
    width: 420px;
    height: 140px;
    border: solid 1px #FFF;
    top: 49%;
    left: 50%;
    margin-top: -70px;
    margin-left: -210px;
    transform: rotate(-3deg);
    background: rgba(255,255,255,.25);
    }

@media only screen and (max-width: 1024px) {

#content { padding: 0; }
body.lower #pageTitleArea h2 { font-size: 1.6rem; }
body.lower #pageTitleArea h2 span { font-size: 64px; }
body.lower #pageTitleArea { background-size: 820px; }
body.lower #pageTitleArea .titleFrame {
    width: 360px;
    height: 120px;
    margin-top: -60px;
    margin-left: -180px;
    }

body.lower #pageTitleArea .titleFrame2 {
    width: 300px;
    height: 120px;
    margin-top: -60px;
    margin-left: -150px;
    }

}

@media only screen and (max-width: 767px) {

body.lower #pageTitleArea h2 { font-size: 1.4rem; }
body.lower #pageTitleArea h2 span { font-size: 36px; }
body.lower #pageTitleArea .titleFrame {
    width: 250px;
    height: 80px;
    margin-top: -40px;
    margin-left: -125px;
    }

body.lower #pageTitleArea .titleFrame2 {
    width: 220px;
    height: 80px;
    margin-top: -40px;
    margin-left: -110px;
    }

body.lower #pageTitleArea {
    background-size: 520px;
    padding: 48px 0;
    }

}

/*=================================================
	top
=================================================*/

.wrapper {
    position: relative;
    margin-bottom: 0;
    z-index: 10;
    }

.swiper-container-horizontal > .swiper-pagination-bullets { bottom: 12px; }
#mainVisual { border-radius: 12px; margin-bottom: 36px; }
#mainVisual .swiper-wrapper { margin-bottom: 0; }

/* -- TOP NEWS START -- */

body.top .topNews {
    position: relative;
    width: 100%;
    display: block;
    background: #f3ebd6;
    padding: 60px 24px;
    margin: 120px 0;
    box-sizing: border-box;
    border-radius: 12px;
    }

body.top .topNewsWrap {
    display: flex;
    flex-wrap: wrap;
    }

body.top .topNews ul {
    display: flex;
    align-items: center;
    margin: 0;
    width: 50%;
    padding: 1%;
    box-sizing: border-box;
    transition: .2s;
    }

body.top .topNews ul:hover {
    background: rgba(165,158,122,.25);
    border-radius: 12px;
    }

body.top .topNews ul li:first-child {
    width: 256px;
    padding-right: 24px;
    box-sizing: border-box;
    }

body.top .topNews ul li:last-child a  {
    display: inline-block;
    vertical-align: middle;
    font-size: 12px;
    line-height: 18px;
    color: #000;
    }

body.top .topNews .topNews-date {
    font-weight: bold;
    font-size: 14px !important;
    margin-right: 12px;
    }

body.top .topNews .topMews-cat {
    border: solid 1px #000;
    padding: 2px 12px;
    font-size: 10px !important;
    border-radius: 30px;
    background: #FFF;
    transition: .2s;
    }

body.top .topNews .topMews-cat:hover {
    border: solid 1px #ec9c07;
    background: #ec9c07;
    color: #FFF;
    }

body.top .topNews .info_title a {
    font-size: 14px !important;
    font-weight: bold;
    padding: 6px 0;
    }

body.top .topNews h3 {
    position: absolute;
    font-family: 'Amarante', cursive;
    font-size: 108px;
    font-weight: normal;
    color: #333;
    margin: 0 0 12px;
    top: -72px;
    }

body.top .topNews h3 span {
    font-size: 18px;
    font-weight: bold;
    margin-left: 12px;
    }

/* -- TOP NEWS END -- */
/* -- TOP BLOG START -- */

body.top .topBlog {
    position: relative;
    display: block;
    width: 100%;
    background: #f3ebd6;
    padding: 60px 24px;
    margin: 180px 0 60px;
    box-sizing: border-box;
    border-radius: 12px;
    }

body.top .topBlogWrap {
    display: flex;
    flex-wrap: wrap;
    }

body.top .topBlog ul {
    display: flex;
    align-items: center;
    margin: 0;
    width: 50%;
    padding: 1%;
    box-sizing: border-box;
    transition: .2s;
    }

body.top .topBlog ul:hover {
    background: rgba(165,158,122,.25);
    border-radius: 12px;
    }

body.top .topBlog ul li:first-child {
    width: 256px;
    padding-right: 24px;
    box-sizing: border-box;
    }

body.top .topBlog ul li:last-child a  {
    display: inline-block;
    font-size: 12px;
    line-height: 18px;
    color: #000;
    }

body.top .topBlog .topBlog-date {
    font-weight: bold;
    font-size: 14px !important;
    margin-right: 12px;
    }

body.top .topBlog .topBlog-cat {
    border: solid 1px #000;
    padding: 2px 12px;
    font-size: 10px !important;
    border-radius: 30px;
    background: #FFF;
    transition: .2s;
    }

body.top .topBlog .topBlog-cat:hover {
    border: solid 1px #ec9c07;
    background: #ec9c07;
    color: #FFF;
    }

body.top .topBlog .info_title a {
    font-size: 14px !important;
    font-weight: bold;
    padding: 3px 0;
    }

body.top .topBlog h3 {
    position: absolute;
    font-family: 'Amarante', cursive;
    font-size: 108px;
    font-weight: normal;
    color: #333;
    margin: 0 0 12px;
    top: -72px;
    }

body.top .topBlog h3 span {
    font-size: 18px;
    font-weight: bold;
    margin-left: 12px;
    }

body.top .topBlog .info_name a {
    display: inline-block;
    background: #ec9c07;
    color: #FFF !important;
    font-size: 11px !important;
    letter-spacing: 1px;
    padding: 2px 9px;
    border-radius: 6px;
    margin-top: 6px;
    }

/* -- TOP BLOG END -- */

.moreBtn {
    position: absolute;
    text-align: center;
    width: 240px;
    margin: 0 0 0 -120px;
    left: 50%;
    }

.topNews .moreBtn,
.topBlog .moreBtn { bottom: -18px; }

.moreBtn a {
    position: relative;
    display: block;
    background: #FFF;
    color: #000;
    padding: 12px 0;
    font-family: 'Amarante', cursive;
    font-size: 18px;
    letter-spacing: .5px;
    border: solid 1px #333;
    border-radius: 6px;
    transition: .3s;
    overflow: hidden;
    z-index: 1;
    }

.moreBtn a:hover { color: #FFF; }
.moreBtn a::before {
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    content: '';
    width: 120%;
    height: 100%;
    background: #ec9c07;
    transform-origin: right top;
    transform: skewX(-30deg) scale(0, 1);
    transition: transform .3s;
    }

.moreBtn a:hover::before {
    transform-origin: left top;
    transform: skewX(-30deg) scale(1, 1);
    }

body.top section.sect {
    position: relative;
    margin: 0 auto 120px;
    }

body.top section.sect .titleArea {
    margin: 0 auto 20px;
    border-bottom: none;
    }

body.top section.sect .titleArea h2 {
    position: relative;
    padding: 0 0 5px 24px;
    z-index: 10;
    }

body.top section.sect .titleArea h2 span.en {
    font-family: 'Amarante', cursive;
    font-size: 108px;
    font-weight: normal;
    color: #333;
    margin: 0 0 12px;
    letter-spacing: 0;
    }

body.top section.sect .titleArea h2 span.jp {
    font-size: 18px;
    font-weight: bold;
    margin-left: 12px;
    letter-spacing: 0;
    color: #333;
    }

body.top section.sect.sect01 ul.wrapper li {
    margin: 0px 1.33% 36px 0;
    width: 24%;
    }

body.top section.sect.sect01 ul.wrapper li img {
    width: 100%;
    vertical-align: bottom;
    }

body.top section.sect.sect01 ul.wrapper li img,
body.top section.sect.sect02 ul.wrapper li img,
body.top section.sect ul.wrapper li a.txt h3 { transition: .2s; }
body.top section.sect ul.wrapper li a.img { margin: 0 0 12px; }

body.top section.sect.sect01 ul.wrapper li:hover img,
body.top section.sect.sect02 ul.wrapper li:hover img {
    -webkit-filter:brightness(75%);
    -moz-filter:brightness(75%);
    -ms-filter:brightness(75%);
    filter:brightness(75%);
    } 

body.top section.sect ul.wrapper li a.txt h3 {
    margin: 0 0 12px;
    color: #FFF;
    background: #333;
    font-size: 12px;
    line-height: 18px;
    font-weight: bold;
    padding: 6px 9px;
    box-sizing: border-box;
    border-radius: 6px;
    }

body.top section.sect ul.wrapper li:hover a.txt h3 { background: #ec9c07; }
body.top section.sect ul.wrapper li a.txt p {
    color: #333;
    font-size: 12px;
    line-height: 18px;
    }

body.top section.sect.sect02 ul.wrapper li {
    width: 19%;
    height: auto;
    display: inline-block;
    vertical-align: top;
    line-height: 1.4;
    margin: 0px 1.25% 36px 0;
    }

@media only screen and (max-width: 1024px) {

/* -- TOP NEWS START -- */
body.top .topNews h3 {
    font-size: 64px;
    top: -42px;
    }

body.top .topNews h3 span {
    font-family:'Noto Sans JP';
    font-size: 14px;
    }

body.top .topNews {
    padding: 36px 18px;
    margin: 84px 0;
    }

body.top .topNews ul {
    margin: 12px 0;
    width: 100%;
    padding: 0;
    }

body.top .topNews .info_title a { padding: 3px 0; }
body.top .topNews .topMews-cat { padding: 0 12px; }
.moreBtn a {
    padding: 9px 0;
    font-size: 16px;
    }
/* -- TOP NEWS END -- */

body.top section.sect .titleArea h2 { padding: 0 0 5px 18px; }
body.top #main section.sect .titleArea h2 span.en { font-size: 64px; }
body.top #main section.sect .titleArea h2 span.jp {
    font-family:'Noto Sans JP';
    font-size: 14px;
    margin-left: 12px;
    }

body.top #main section.sect .titleArea {
    margin: 0 auto 12px;
    padding: 0;
    border-bottom: none;
    }

/* -- TOP STYLE START -- */
body.top #main section.sect.sect01 ul.wrapper li {
    margin: 0 2% 24px 0;
    width: 32%;
    }

body.top #main section.sect.sect01 ul.wrapper li:nth-child(3n+2) { margin: 0 2% 24px 0; }
body.top #main section.sect.sect01 ul.wrapper li:nth-child(3n) { margin: 0 0 24px 0; }
body.top #main section.sect.sect01 ul.wrapper li:nth-child(n+7) { display: none; }

body.top #main section.sect ul.wrapper li a.img { margin: 0 0 12px; }
body.top #main section.sect ul.wrapper li a.txt h3 {
    margin: 0 0 12px;
    color: #FFF;
    font-size: 12px;
    line-height: 18px;
    font-weight: bold;
    }

body.top #main section.sect ul.wrapper li a.txt p {
    font-size: 12px;
    line-height: 18px;
    }

body.top #main section.sect { margin: 0 auto 96px; }
/* -- TOP STYLE END -- */
/* -- TOP MEDIA START -- */
body.top #main section.sect.sect02 ul.wrapper li {
    margin: 0 2% 24px 0;
    width: 32%;
    }

body.top #main section.sect.sect02 ul.wrapper li:nth-child(3n+2) { margin: 0 2% 24px 0; }
body.top #main section.sect.sect02 ul.wrapper li:nth-child(3n) { margin: 0 0 24px 0; }
body.top #main section.sect.sect02 ul.wrapper li:nth-child(n+4) { display: none; }
/* -- TOP MEDIA END -- */
/* -- TOP BLOG START -- */
body.top .topBlog h3 {
    font-size: 64px;
    top: -42px;
    }

body.top .topBlog h3 span {
    font-family:'Noto Sans JP';
    font-size: 14px;
    }

body.top .topBlog {
    padding: 36px 18px;
    margin: 136px 0 48px;
    }

body.top .topBlog ul {
    margin: 12px 0;
    width: 100%;
    padding: 0;
    }

body.top .topBlog .info_title a { padding: 3px 0; }
body.top .topBlog .topBlog-cat { padding: 0 12px; }
/* -- TOP BLOG END -- */

}

@media only screen and (max-width: 767px) {

/* -- TOP NEWS START -- */
body.top .topNews {
    padding: 18px 12px;
    margin: 48px 0;
    }

body.top .topNews h3 {
    font-size: 42px;
    top: -28px;
    }

body.top .topNews h3 span { font-size: 14px; }
body.top .topNews ul li:first-child { padding-right: 12px; }
body.top .topNews ul li:last-child a.topNews-date { font-size: 12px !important; }
/* -- TOP NEWS END -- */
/* -- TOP STYLE START -- */
body.top #main section.sect .titleArea h2 span.en { font-size: 42px; }

.mandara-anime  {
    background-size: 360px;
    width: 360px;
    height: 360px;
    }

body.top #main section.sect { margin: 0 auto 84px; }
body.top #main section.sect.sect01 ul.wrapper li { width: 49%; }
body.top #main section.sect.sect01 ul.wrapper li:nth-child(3n) { margin: 0 2% 24px 0; }
body.top #main section.sect.sect01 ul.wrapper li:nth-child(2n) { margin-right: 0; }
/* -- TOP STYLE END -- */
/* -- TOP MEDIA START -- */
.mandara-anime02 {
    background-size: 420px;
    width: 420px;
    height: 420px;
    }

body.top #main section.sect.sect02 ul.wrapper li { width: 49%; }
body.top #main section.sect.sect02 ul.wrapper li:nth-child(3n+2) { margin: 0 2% 24px 0; }
body.top #main section.sect.sect02 ul.wrapper li:nth-child(3n) { margin: 0 2% 24px 0; }
body.top #main section.sect.sect02 ul.wrapper li:nth-child(2n) { margin: 0 0 24px 0; }
body.top #main section.sect.sect02 ul.wrapper li:nth-child(n+4) { display: inline-block; }
body.top #main section.sect.sect02 ul.wrapper li:nth-child(n+5) { display: none; }
/* -- TOP MEDIA END -- */
/* -- TOP BLOG START -- */
body.top .topBlog { padding: 18px 12px 24px; margin: 106px 0 48px; }
body.top .topBlog h3 { font-size: 42px; top: -28px; }
body.top .topBlog ul li:first-child { padding-right: 12px; }
body.top .topBlog ul li:last-child a.topBlog-date { font-size: 12px !important; }
/* -- TOP BLOG END -- */

}

/*=================================================
	concept
=================================================*/

body.concept.onecolumn #content #main {
    width: 100%;
    max-width: 1024px;
    }

body.concept h3 {
    text-align: center;
    font-size: 30px;
    line-height: 42px;
    font-family: 游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN","Hiragino Mincho Pro",HGS明朝E,メイリオ,Meiryo,serif;
    padding: 0 0 36px;
    margin: 0 0 36px;
    border-bottom: dotted 2px #CCC;
    }

body.concept section.sect p {
    margin: 0 24px;
    box-sizing: border-box;
    }

@media only screen and (max-width: 1024px) {

body.concept h3 {
    font-size: 24px;
    line-height: 36px;
    padding: 0 0 18px;
    margin: 0 0 18px;
    }

body.concept section.sect p { margin: 0 12px; }

.swiper-container {
    margin-top: 24px;
    margin-bottom: 24px;
    }

}

@media only screen and (max-width: 767px) {

body.concept h3 {
    font-size: 18px;
    line-height: 24px;
    }

}

/*=================================================
	informations
=================================================*/

body.news #content #main {
    width: 100%;
    max-width: 1280px;
    margin-bottom: 64px
    }

body.news #main .couponArea {
    position: relative;
    display: block;
    width: 100%;
    background: #f3ebd6;
    padding: 24px;
    margin: 0;
    box-sizing: border-box;
    border-radius: 12px;
    }

.newsWrap {
    display: flex;
    flex-wrap: wrap;
    }

.newsWrap ul {
    display: flex;
    align-items: center;
    margin: 0;
    width: 50%;
    padding: 1%;
    box-sizing: border-box;
    transition: .2s;
    }

.newsWrap ul:hover {
    background: rgba(165,158,122,.25);
    border-radius: 12px;
    }

.newsWrap ul li:first-child {
    width: 256px;
    padding-right: 24px;
    box-sizing: border-box;
    }

.newsWrap ul li:last-child a  {
    display: inline-block;
    vertical-align: middle;
    font-size: 12px;
    line-height: 18px;
    color: #000;
    }

.newsWrap .newsDate {
    font-weight: bold;
    font-size: 14px !important;
    margin-right: 12px;
    }

.newsWrap .newsCat {
    border: solid 1px #000;
    padding: 2px 12px;
    font-size: 10px !important;
    border-radius: 30px;
    background: #FFF;
    transition: .2s;
    }

.newsWrap .NewsCat:hover {
    border: solid 1px #ec9c07;
    background: #ec9c07;
    color: #FFF;
    }

.newsWrap .info_title a {
    font-size: 14px !important;
    font-weight: bold;
    padding: 6px 0;
    }

.newsWrap h3 {
    position: absolute;
    font-family: 'Amarante', cursive;
    font-size: 108px;
    font-weight: normal;
    color: #333;
    margin: 0 0 12px;
    top: -72px;
    }

.newsWrap h3 span {
    font-size: 18px;
    font-weight: bold;
    margin-left: 12px;
    }

@media only screen and (max-width: 1024px) {

body.news #content #main { margin-bottom: 36px; }
body.news #main .couponArea { padding: 18px; }
.newsWrap ul {
    width: 100%;
    margin: 0 0 12px;
    padding: 0;
    }

.newsWrap .newsCat { padding: 0 12px; }
.newsWrap .info_title a { padding: 3px 0; }

}

@media only screen and (max-width: 767px) {

body.news #content #main { margin-bottom: 24px; }
body.news #main .couponArea { padding: 18px 12px; }
.newsWrap ul { margin: 12px 0; }
.newsWrap ul li:first-child { padding-right: 12px; }
.newsWrap ul li:last-child a.newsDate { font-size: 12px !important; }

}

/*=================================================
	information
=================================================*/

body.news #main .sect {
    width: 100%;
    margin: 36px 0 0;
    }

body.news #main .sect .titleArea {
    margin: 0 auto 12px;
    border-bottom: 1px solid #ad9f7d;
    }

body.news #main .sect .titleArea h3 { font-weight: bold; }

body.news #main .sect .wrapper li {
    float: left;
    margin-right: 10px;
    padding: 3px 12px;
    color: #333;
    font-size: 1rem;
    background-color: #FFF;
    border: solid 1px #333;
    border-radius: 30px;
    }

body.news #main .articleTxt {
    margin-top: 24px;
    font-size: 14px;
    }

body.news #main .newsTime {
    font-size: 14px;
    font-weight: bold;
    color: #666;
    display: block;
    margin-bottom: 0;
    }

@media only screen and (max-width: 1024px) {

body.news #main .sect { padding: 0; }

body.news #main .newsTime {
    font-size: 14px !important;
    font-weight: bold !important;
    }

}

/*=================================================
	menu
=================================================*/

body.menu #content #main {
    width: 100%;
    max-width: 1280px;
    margin-bottom: 0;
    }

body.menu #main .sect {
    width: 100%;
    column-gap: 4%;
    column-count: 2;
    }

body.menu .menuBox {
    display: inline-block;
    vertical-align: top;
    width: 100%;
    margin: 0 0 24px 0;
    }

body.menu #main .sect .titleArea {
    margin: 0 auto 12px;
    border-bottom: 1px solid #000;
    }

body.menu #main .sect .titleArea h3 span.en {
    font-size: 18px;
    letter-spacing: 1px;
    font-weight: bold;
    font-family: 'Noto Sans JP';
    }

body.menu #main .sect .table tr {
    border-top: 1px dotted #000;
    display: block;
    }

body.menu #main .sect .table td {
    font-size: 14px;
    font-weight: bold;
    line-height: 24px;
    }

body.menu #main .sect .table td:nth-child(2n) { font-size: 14px; }
body.menu #main .sect p { font-weight: normal; }

@media only screen and (max-width: 1024px) {

body.menu #content #main { width: 100%; }
body.menu #main .sect .table tr { margin-bottom: 18px; }
body.menu #main .sect { margin-bottom: 0; }
body.menu .menuBox { margin: 0; }
body.menu #main .sect {
    width: 100%;
    column-gap: 0;
    column-count: 1;
    }

body.menu #main .sect table { table-layout: fixed; }
body.menu #main .sect .table > tbody > tr > td:first-child { width: 84%; }
body.menu #main .sect .table td:nth-child(2n) { text-align: right; width: 200px; }

}

@media only screen and (max-width: 767px) {

body.menu #main .sect {
    column-gap: 0;
    column-count: 1;
    }

body.menu #main .sect .table > tbody > tr > td:first-child { width: 72%; }

}

/*=================================================
	coupon
=================================================*/

body.coupon #content #main {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    }

body.coupon #main section.sect01 .titleArea {
    text-align: center;
    width: 100%;
    margin: 0 auto 48px;
    border-bottom: 1px solid #ad9f7d;
    }

body.coupon #main section.sect01 .titleArea h3 {
    position: relative;
    float: none;
    display: inline-block;
    margin: 0;
    padding: 0 36px;
    color: #333;
    font-weight: normal;
    bottom: -18px;
    background: #FFF;
    }

body.coupon #main section.sect01 .titleArea h3::before {
    content: "≪";
    position: absolute;
    color: #ad9f7d;
    left: -3px;
    bottom: 5px;
    font-size: 24px;
    }

body.coupon #main section.sect01 .titleArea h3::after {
    content: "≫";
    position: absolute;
    color: #ad9f7d;
    right: -3px;
    bottom: 5px;
    font-size: 24px;
    }

body.coupon #main section.sect01 .titleArea h3 span.en {
    font-size: 36px;
    font-family: 'Amarante', cursive;
    letter-spacing: 0;
    }

body.coupon #main section.sect01 .titleArea h3 span.jp {
    margin-left: 0.6em;
    font-size: 1.2rem;
    }

body.coupon #main section.sect01 .filterArea {
    margin: 0 auto 48px;
    padding: 24px 20px;
    width: 100%;
    background-color: #f6f6f6;
    box-sizing: border-box;
    border-radius: 12px;
    }

body.coupon #main section.sect01 .filterArea dl {
    margin: 0 auto 12px;
    width: 100%;
    background-color: #fff;
    box-sizing: border-box;
    border-radius: 9px;
    }

body.coupon #main section.sect01 .filterArea dl dt {
    width: 100%;
    box-sizing: border-box;
    }

body.coupon #main section.sect01 .filterArea dl dd {
    float: left;
    padding: 10px 10px 10px 40px;
    margin: 0;
    width: 100%;
    font-size: 1.4rem;
    box-sizing: border-box;
    }

body.coupon #main section.sect01 .filterArea dl dd ul li { margin-right: 18px; }
body.coupon #main section.sect01 .filterArea .btn { margin: 24px 0 0; }
body.coupon #main section.sect01 .filterArea .btn button {
    padding: 12px 0;
    color: #fff;
    width: 240px;
    font-family: 'Noto Sans JP';
    font-size: 14px;
    line-height: 14px;
    font-weight: bold;
    letter-spacing: 10px;
    background-color: #ec9c07;
    border: none;
    text-align: center;
    border-radius: 6px;
    cursor: pointer;
    transition: .2s; 
    }

body.coupon .twoResult {
	display: block;
	width: 100%;
	margin: 0 auto;
	padding: 0;
	font-size: 0;
	}

body.coupon .twoResultWrap {
	display: inline-block;
	vertical-align: top;
	width: 49%;
	margin: 0 2% 36px 0;
	font-size: 12px;
	border: solid 1px #000;
	box-sizing: border-box;
	}

body.coupon .twoResultWrap:nth-child(2n) { margin: 0 0 24px; }
body.coupon .twoResult-target,
body.coupon .twoResult-content {
	display: table-cell;
    vertical-align: middle;
	box-sizing: border-box;
	}

body.coupon .twoResult-target {
    background: #ad9f7d;
    background-size: 750%;
    color: #FFF;
    text-align: center;
    width: 30px;
    padding: 0 6px;
    font-size: 14px;
    line-height: 28px;
    font-weight: bold;
	}

body.coupon .twoResult-content {
	padding: 12px;
	overflow: hidden;
	}

body.coupon .twoResult-inBox ul {
	width: 100%;
	display: table;
	table-layout: fixed;
	margin: 0;
	padding: 0;
	}

body.coupon .twoResult-inBox li {
	display: table-cell;
	vertical-align: top;
	box-sizing: border-box;
	}

body.coupon .twoResult-inBox li:first-child { width: 30%; }
body.coupon .twoResult-inBox li:last-child {
	width: 70%;
	padding-left: 2%;
	}

body.coupon .twoResult-inBox li h5 {
    font-size: 16px;
    line-height: 22px;
    font-weight: bold;
    margin: 0 0 6px;
	}

body.coupon li .twoResult-category span {
    display: inline-block;
    text-align: center;
    background: #FFF;
    color: #000;
    border: solid 1px #000;
    padding: 2px 6px;
    margin-bottom: 6px;
    margin-right: 6px;
	}

body.coupon li .twoResult-price {
    font-family: 'Amarante', cursive;
    text-align: right;
    margin: 12px 0;
    font-size: 30px;
    letter-spacing: 1px;
    font-weight: bold;
    color: #f75255;
    }

body.coupon li .twoResult-text {
	font-size: 12px;
	line-height: 18px;
	}

body.coupon li .twoResult-reserve a {
	position: relative;
    display: block;
    width: 100%;
    text-align: center;
    padding: 9px 0;
    margin-top: 12px;
    color: #333;
    background: #FFF;
    font-size: 14px;
    font-weight: bold;
	box-sizing: border-box;
    border: solid 1px #333;
    border-radius: 6px;
    transition: .3s;
    overflow: hidden;
    z-index: 1;
	}

body.coupon li .twoResult-reserve a:hover { color: #FFF; }
body.coupon li .twoResult-reserve a::before {
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    content: '';
    width: 120%;
    height: 100%;
    background: #ec9c07;
    transform-origin: right top;
    transform: skewX(-30deg) scale(0, 1);
    transition: transform .3s;
    }

body.coupon li .twoResult-reserve a:hover::before {
    transform-origin: left top;
    transform: skewX(-30deg) scale(1, 1);
    }

body.coupon .two-rule {
	border-top: dotted 2px #666;
	margin-top: 12px;
	padding-top: 12px;
	}

body.coupon .two-rule p {
    display: inline-block;
    font-size: 11px;
    line-height: 16px;
    margin-right: 12px;
	}

body.coupon .two-rule p span {font-weight: bold;}

@media only screen and (max-width: 1024px) {

body.coupon #main section.sect01 .filterArea dl dd ul li {
    margin-right: 18px;
    margin-bottom: 6px;
    }

body.coupon .twoResult {
	display: block;
	width: 100%;
	margin: 0 auto;
	padding: 0;
	font-size: 0;
	}

body.coupon .twoResultWrap {
    display: block;
    vertical-align: top;
    width: 100%;
    margin: 0 2% 12px 0;
    font-size: 12px;
    border: solid 1px #000;
    box-sizing: border-box;
	}

body.coupon .twoResultWrap:nth-child(2n) { margin: 0 0 12px; }
body.coupon .twoResult-target,
body.coupon .twoResult-content {
	display: table-cell;
    vertical-align: middle;
	box-sizing: border-box;
	}

body.coupon .twoResult-target {
    background: #ad9f7d;
    color: #FFF;
    text-align: center;
    width: 30px;
    padding: 0 6px;
    font-size: 14px;
    line-height: 28px;
    font-weight: bold;
	}

body.coupon .twoResult-content {
	padding: 12px;
	overflow: hidden;
	}

body.coupon .twoResult-inBox ul {
	width: 100%;
	display: table;
	table-layout: fixed;
	margin: 0;
	padding: 0;
	}

body.coupon .twoResult-inBox li {
	display: table-cell;
	vertical-align: top;
	box-sizing: border-box;
	}

body.coupon .twoResult-inBox li:first-child { width: 30%; }
body.coupon .twoResult-inBox li:last-child {
	width: 70%;
	padding-left: 4%;
	}

body.coupon .twoResult-inBox li h5 {
    font-size: 14px;
    line-height: 18px;
    font-weight: bold;
    margin: 0 0 6px;
	}

body.coupon li .twoResult-category span {
    display: inline-block;
    text-align: center;
    background: #FFF;
    color: #000;
    border: solid 1px #000;
    padding: 2px 6px;
    margin-bottom: 6px;
    margin-right: 6px;
	}

body.coupon li .twoResult-price {
    text-align: right;
    margin: 12px 0;
    font-size: 24px;
    font-weight: bold;
	color: #F00;
	}

body.coupon li .twoResult-text {
	font-size: 12px;
	line-height: 18px;
	}

body.coupon li .twoResult-reserve a {
	position: relative;
    display: block;
    width: 100%;
    text-align: center;
    padding: 9px 0;
    margin-top: 12px;
    border: solid 1px #000;
    color: #000;
    font-size: 12px;
    font-weight: bold;
	}

body.coupon li .twoResult-reserve a::after {
	position: absolute;
	z-index: -1;
	display: block;
	content: "";
	top: 0;
	width: 50%;
	height: 100%;
	background-color: #FFF;
	}

body.coupon li .twoResult-reserve a,
body.coupon li .twoResult-reserve a::before,
body.coupon li .twoResult-reserve a::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .3s;
	transition: all .3s;
	}

body.coupon li .twoResult-reserve a::before { right: 0; }
body.coupon li .twoResult-reserve a::after { left: 0; }

body.coupon .two-rule {
	border-top: dotted 2px #666;
	margin-top: 12px;
	padding-top: 12px;
	}

body.coupon .two-rule p {
    display: inline-block;
    font-size: 11px;
    line-height: 16px;
    margin-right: 12px;
	}

body.coupon .two-rule p span {font-weight: bold;}

}

@media only screen and (max-width: 767px) {

body.coupon #main section.sect01 .titleArea { margin: 0 auto 30px; }
body.coupon #main section.sect01 .titleArea h3 { padding: 0 30px; }
body.coupon #main section.sect01 .titleArea h3 span.en { font-size: 30px; }
body.coupon #main section.sect01 .filterArea { margin: 0 auto 30px; }
body.coupon #main section.sect01 .filterArea dl dd { padding: 10px 10px 10px 24px; }
body.coupon #main section.sect01 .filterArea dl dd ul { margin: 0; }
body.coupon #main section.sect01 .filterArea .btn button { width: 200px; }

}

/*=================================================
	staffs
=================================================*/

body.stylist #content #main {    
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    }

ul.wrapper_stylist li {
    margin: 0px 1.33% 36px 0;
    width: 24%;
    }

body.stylist #main .sect02 ul.wrapper_stylist li a.img { margin: 0 0 12px; }
body.stylist #main .sect02 ul.wrapper_stylist li a.img img {
    width: 100%;
    vertical-align: bottom;
    margin: 0;
    transition: .2s;
    }

body.stylist #main .sect02 ul.wrapper_stylist li a.txt h3 {
    margin: 0 0 9px;
    color: #FFF;
    background: #333;
    font-size: 14px;
    letter-spacing: 1px;
    line-height: 18px;
    font-weight: bold;
    padding: 6px 9px;
    box-sizing: border-box;
    border-radius: 6px;
    transition: .2s;
    }

body.stylist #main .sect02 ul.wrapper_stylist li:hover a.txt h3 { background: #ec9c07; }
body.stylist #main .sect02 ul.wrapper_stylist li a.txt p {
    padding: 3px 12px;
    color: #333;
    font-size: 12px;
    font-weight: bold;
    border: solid 1px #333;
    border-radius: 30px;
    }

body.stylist #main .sect02 ul.wrapper_stylist li:hover a.img img {
    -webkit-filter: brightness(75%);
    -moz-filter: brightness(75%);
    -ms-filter: brightness(75%);
    filter: brightness(75%);
    }

body.stylist #main .staffCat {
    position: relative;
    width: 100%;
    }

body.stylist #main .staffCat span {
    position: relative;
    display: inline-block;
    color: #ad9f7d;
    background: #FFF;
    font-size: 18px;
    font-weight: bold;
    margin: 12px auto 24px;
    padding: 0 12px 0 0;
    z-index: 10;
    }

body.stylist #main .staffCat::before {
    position: absolute;
    content: "";
    width: 100%;
    height: 1px;
    background: #ad9f7d;
    top: 22px;
    z-index: 1;
    }

@media only screen and (max-width: 1024px) {

body.stylist #main .staffCat span { margin: 6px auto 18px; }

ul.wrapper_stylist li {
    margin: 0 2% 24px 0;
    width: 32%;
    }

ul.wrapper_stylist li:nth-child(3n) { margin: 0 0 24px 0; }
body.stylist #main .staffCat::before { top: 18px; }

}

@media only screen and (max-width: 767px) {

body.stylist #main .staffCat span { font-size: 16px; }
body.stylist #main .staffCat span { margin: 8px auto 12px; }
ul.wrapper_stylist li { width: 49%; }
ul.wrapper_stylist li:nth-child(3n) { margin: 0 2% 24px 0;}
ul.wrapper_stylist li:nth-child(2n) { margin: 0 0 24px; }

}

/*=================================================
	staff
=================================================*/

body.stylist #main .stylistBox .visualInfo {
    width: 27%;
    margin-right: 3%;
    }

body.stylist #main .stylistBox .txtInfo { width: 70%; position: relative; }
body.stylist #main .stylistBox .visualInfo .photo img { width: 100%; }
body.stylist #main .stylistBox .visualInfo .calendar .calendarInner table { width: auto; }

body.stylist #main .stylistBox h3.staffName {
    font-size: 24px;
    margin: 0 0 9px;
    }

body.stylist #main .stylistBox h3.staffName p {
    font-size: 12px;
    letter-spacing: 1px;
    margin: 3px 0 0;
    }

body.stylist #main .stylistBox p.job {
    display: inline-block;
    padding: 3px 12px;
    border: solid 1px #333;
    font-size: 12px !important;
    border-radius: 30px;
    }

body.stylist #main .stylistBox .txtInfo p.catch02 { margin: 12px 0; }
body.stylist #main .stylistBox .txtInfo p.catch02 span {
    display: inline-block;
    padding: 6px 18px;
    line-height: 18px;
    font-size: 14px;
    font-weight: bold;
    color: #FFF;
    background: #ec9c07;
    border-radius: 6px;
    }

body.stylist #main .stylistBox .txtInfo p.staffComment {
    font-size: 14px;
    line-height: 24px;
    margin-bottom: 12px;
    padding-bottom: 12px;
    border-bottom: dotted 2px #CCC;
    }

body.stylist #main .stylistBox .txtInfo ul.sns {
    position: absolute;
    margin: 0;
    text-align: inherit;
    top: 0;
    right: 0;
    }

body.stylist #main .stylistBox .txtInfo ul.sns li {
    width: 30px;
    display: inline-block;
    margin-left: 3px;
    transition: .2s;
    }

body.stylist #main .stylistBox .txtInfo ul.sns li:hover { opacity: .75; }
body.stylist #main .stylistBox .txtInfo .career dl dt { width: 160px; margin-right: 12px; }
body.stylist #main .stylistBox .txtInfo .career dl dt span {
    display: inline-block;
    text-align: center;
    font-size: 12px;
    padding: 6px 0;
    width: 100%;
    background: #333;
    color: #FFF;
    box-sizing: border-box;
    border-radius: 6px;
    }

body.stylist #main .stylistBox .txtInfo .career dl,
body.style #main .styleBox .txtInfo .box dl {
    width: 100%;
    background: none;
    }

body.stylist #main .stylistBox .txtInfo .career dl dd {
    padding: 3px 0 0;
    line-height: 18px;
    }

body.stylist #main .stylistBox .txtInfo .blogArea ul {
    display: flex;
    align-items: center;
    margin: 0;
    width: 100%;
    padding: 1%;
    box-sizing: border-box;
    transition: .2s;
    }

body.stylist #main .stylistBox .visualInfo .calendar .calendarInner { border: 1px solid #ad9f7d; }
body.stylist #main .stylistBox .visualInfo .calendar .calendarInner .month { background-color: #ad9f7d; }
body.stylist #main .stylistBox .visualInfo .calendarTxt { margin: 6px 0; font-size: 14px; }
body.stylist #main .stylistBox .visualInfo .calendarTxt span { color: #f98b8a }

/* -- Stylist Blog Start -- */

body.stylist #main .stylistBox .txtInfo .blogArea .titleArea {
    text-align: center;
    margin: -12px auto 36px;
    padding: 0;
    border-bottom: 1px solid #ad9f7d;
    }

body.stylist #main .stylistBox .txtInfo .blogArea .titleArea h3 {
    position: relative;
    float: none;
    display: inline-block;
    margin: 0;
    padding: 0 36px;
    color: #333;
    font-weight: normal;
    bottom: -18px;
    background: #FFF;
    }

body.stylist #main .stylistBox .txtInfo .blogArea .titleArea h3::before {
    content: "≪";
    position: absolute;
    color: #ad9f7d;
    left: -3px;
    bottom: 5px;
    font-size: 24px;
    }

body.stylist #main .stylistBox .txtInfo .blogArea .titleArea h3::after {
    content: "≫";
    position: absolute;
    color: #ad9f7d;
    right: -3px;
    bottom: 5px;
    font-size: 24px;
    }

body.stylist #main .stylistBox .txtInfo .blogArea .titleArea h3 span.en {
    font-size: 36px;
    font-family: 'Amarante', cursive;
    letter-spacing: 0;
    }

body.stylist #main .stylistBox .txtInfo .blogArea .titleArea h3 span.jp {
    margin-left: .6em;
    font-size: 1.2rem;
    }

body.stylist #main .stylistBox .txtInfo .blogArea .stylistBlogWrap {
    position: relative;
    display: block;
    background: #f3ebd6;
    padding: 12px;
    margin: 0;
    box-sizing: border-box;
    border-radius: 12px;
    }

body.stylist #main .stylistBox .txtInfo .blogArea ul:hover {
    background: rgba(165,158,122,.25);
    border-radius: 12px;
    }

body.stylist #main .stylistBox .txtInfo .blogArea ul li:first-child {
    width: 256px;
    padding-right: 24px;
    box-sizing: border-box;
    }

body.stylist #main .stylistBox .txtInfo .blogArea ul li:last-child a  {
    display: inline-block;
    vertical-align: middle;
    font-size: 12px;
    line-height: 18px;
    color: #000;
    }

body.stylist #main .stylistBox .txtInfo .blogArea .stylistBlog-date {
    font-weight: bold;
    font-size: 14px !important;
    margin-right: 12px;
    }

body.stylist #main .stylistBox .txtInfo .blogArea .stylistBlog-cat {
    border: solid 1px #000;
    padding: 2px 12px;
    font-size: 10px !important;
    border-radius: 30px;
    background: #FFF;
    transition: .2s;
    }

body.stylist #main .stylistBox .txtInfo .blogArea .stylistBlog-cat:hover {
    border: solid 1px #ec9c07;
    background: #ec9c07;
    color: #FFF;
    }

body.stylist #main .stylistBox .txtInfo .blogArea .info_title a {
    font-size: 14px !important;
    font-weight: bold;
    padding: 6px 0;
    }

body.stylist #main .stylistBox .txtInfo .blogArea .moreBtn {
    margin: -24px 0 0 -120px;
    z-index: 10;
    }

/* -- Stylist Blog End -- */
/* -- Stylist Style Start -- */

body.stylist #main .styleArea {
    position: relative;
    margin-bottom: 84px;
    }

body.stylist #main .sect02 .titleArea {
    text-align: center;
    margin: -12px auto 36px;
    border-bottom: 1px solid #ad9f7d;
    }

body.stylist #main .sect02 .titleArea h3 {
    position: relative;
    float: none;
    display: inline-block;
    margin: 0;
    padding: 0 36px;
    color: #333;
    font-weight: normal;
    bottom: -18px;
    background: #FFF;
    }

body.stylist #main .sect02 .titleArea h3::before {
    content: "≪";
    position: absolute;
    color: #ad9f7d;
    left: -3px;
    bottom: 5px;
    font-size: 24px;
    }

body.stylist #main .sect02 .titleArea h3::after {
    content: "≫";
    position: absolute;
    color: #ad9f7d;
    right: -3px;
    bottom: 5px;
    font-size: 24px;
    }

body.stylist #main .sect02 .titleArea h3 span.en {
    font-size: 36px;
    font-family: 'Amarante', cursive;
    letter-spacing: 0;
    }

body.stylist #main .sect02 .titleArea h3 span.jp {
    margin-left: .6em;
    font-size: 1.2rem;
    }

body.stylist #main .sect02 ul.wrapper {
    margin: 0 auto;
    width: 100%;
    }

body.stylist #main .sect02 ul.wrapper li {
    display: inline-block;
    vertical-align: top;
    float: none;
    margin: 0px 1.33% 36px 0;
    width: 24%;
    }

body.stylist #main .sect02 ul.wrapper li:nth-child(4n) { margin: 0 0 36px 0; }
body.stylist #main .sect02 ul.wrapper li a.img img {
    width: 100%;
    vertical-align: bottom;
    transition: .2s;
    }

body.stylist #main .sect02 ul.wrapper li:hover a.img img {
    -webkit-filter: brightness(75%);
    -moz-filter: brightness(75%);
    -ms-filter: brightness(75%);
    filter: brightness(75%);
    }

body.stylist #main .sect02 ul.wrapper li a.txt h3 {
    margin: 12px 0;
    color: #FFF;
    background: #333;
    font-size: 12px;
    line-height: 18px;
    font-weight: bold;
    padding: 6px 9px;
    box-sizing: border-box;
    border-radius: 6px;
    transition: .2s;
    }

body.stylist #main .sect02 ul.wrapper li:hover a.txt h3 { background: #ec9c07; }

/* -- Stylist Style End -- */
/*-- Stylist Coupon Start --*/

body.stylist .twoResult,
body.style .twoResult {
    text-align: center;
    }

body.stylist .twoResultWrap,
body.style .twoResultWrap {
	display: inline-block;
	vertical-align: top;
	width: 100%;
    max-width: 640px;
	margin: 0 0 36px 0;
	font-size: 12px;
	border: solid 1px #000;
	box-sizing: border-box;
	}

body.stylist .twoResult-target,
body.stylist .twoResult-content,
body.style .twoResult-target,
body.style .twoResult-content {
	display: table-cell;
    vertical-align: middle;
	box-sizing: border-box;
	}

body.stylist .twoResult-target,
body.style .twoResult-target {
    background: #ad9f7d;
    background-size: 750%;
    color: #FFF;
    text-align: center;
    width: 30px;
    padding: 0 6px;
    font-size: 14px;
    line-height: 28px;
    font-weight: bold;
	}

body.stylist .twoResult-content,
body.style .twoResult-content {
	padding: 12px;
	overflow: hidden;
	}

body.stylist .twoResult-inBox ul,
body.style .twoResult-inBox ul {
	width: 100%;
	display: table;
	table-layout: fixed;
	margin: 0;
	padding: 0;
	}

body.stylist .twoResult-inBox li,
body.style .twoResult-inBox li {
	display: table-cell;
	vertical-align: top;
	box-sizing: border-box;
	}

body.stylist .twoResult-inBox li:first-child,
body.style .twoResult-inBox li:first-child { width: 30%; }
body.stylist .twoResult-inBox li:last-child,
body.style .twoResult-inBox li:last-child {
    text-align: left;
	width: 70%;
	padding-left: 2%;
	}

body.stylist .twoResult-inBox li h5,
body.style .twoResult-inBox li h5 {
    font-size: 16px;
    line-height: 22px;
    font-weight: bold;
    margin: 0 0 6px;
	}

body.stylist li .twoResult-category span,
body.style li .twoResult-category span {
    display: inline-block;
    text-align: center;
    background: #FFF;
    color: #000;
    border: solid 1px #000;
    padding: 2px 6px;
    margin-bottom: 6px;
    margin-right: 6px;
	}

body.stylist li .twoResult-price,
body.style li .twoResult-price {
    font-family: 'Amarante', cursive;
    text-align: right;
    margin: 12px 0;
    font-size: 30px;
    letter-spacing: 1px;
    font-weight: bold;
    color: #F00;
	}

body.stylist li .twoResult-text,
body.style li .twoResult-text {
	font-size: 12px;
	line-height: 18px;
	}

body.stylist li .twoResult-reserve a,
body.style li .twoResult-reserve a {
	position: relative;
    display: block;
    width: 100%;
    text-align: center;
    padding: 9px 0;
    margin-top: 12px;
    color: #333;
    background: #FFF;
    font-size: 14px;
    font-weight: bold;
	box-sizing: border-box;
    border: solid 1px #333;
    border-radius: 6px;
    transition: .3s;
    overflow: hidden;
    z-index: 1;
	}


body.stylist li .twoResult-reserve a:hover,
body.style li .twoResult-reserve a:hover { color: #FFF; }
body.stylist li .twoResult-reserve a::before,
body.style li .twoResult-reserve a::before {
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    content: '';
    width: 120%;
    height: 100%;
    background: #ec9c07;
    transform-origin: right top;
    transform: skewX(-30deg) scale(0, 1);
    transition: transform .3s;
    }

body.stylist li .twoResult-reserve a:hover::before,
body.style li .twoResult-reserve a:hover::before {
    transform-origin: left top;
    transform: skewX(-30deg) scale(1, 1);
    }

body.stylist .two-rule,
body.style .two-rule {
    text-align: left;
	border-top: dotted 2px #666;
	margin-top: 12px;
	padding-top: 12px;
	}

body.stylist .two-rule p,
body.style .two-rule p {
    display: inline-block;
    font-size: 11px;
    line-height: 16px;
    margin-right: 12px;
	}

body.stylist .two-rule p span {font-weight: bold;}
body.style .two-rule p span {font-weight: bold;}

/*-- Stylist Coupon End --*/

@media only screen and (max-width: 1024px) {

body.stylist #main .stylistBox {
    display: flex;
    flex-direction: row-reverse;
    }

body.stylist #main .stylistBox .visualInfo {
    display: inline-block;
    width: 37%;
    min-width: 180px;
    margin-right: 18px;
    }

body.stylist #main .stylistBox .txtInfo {
    display: inline-block;
    width: 58%;
    width: -webkit-calc(100% - 198px);
    width: calc(100% - 198px);
    float: right;
    position: relative;
    }

body.stylist #main .stylistBox .txtInfo .career dl dt { width: 130px; }
body.stylist #main .stylistBox .txtInfo p.catch02 span { padding: 3px 12px; }
body.stylist #main .stylistBox .txtInfo .blogArea .stylistBlog-cat { padding: 0 12px; }
body.stylist #main .stylistBox .txtInfo .blogArea .titleArea,
body.stylist #main .sect02 .titleArea { padding: 0; }

body.stylist #main .stylistBox .txtInfo .blogArea .titleArea h3 span.jp,
body.stylist #main .sect02 .titleArea h3 span.jp { font-family:'Noto Sans JP'; }

body.stylist #main .sect02 ul.wrapper li {
    margin: 0 2% 24px 0;
    width: 32%;
    }

body.stylist #main .sect03 ul.wrapper li:nth-child(3n+2) { margin: 0 2% 24px 0; }
body.stylist #main .sect03 ul.wrapper li:nth-child(3n) { margin: 0 0 24px 0; }
body.stylist #main .sect03 ul.wrapper li:nth-child(n+4) { display: none;}

}

@media only screen and (max-width: 767px) {

body.stylist #main .stylistBox { display: table; }
body.stylist #main .stylistBox .visualInfo { display: table-header-group; }
body.stylist #main .stylistBox .txtInfo {
    display: table-footer-group;
    width: 100%;
    float: none;
    }

body.stylist #main .stylistBox h3.staffName { margin: 12px 0; }
body.stylist #main .stylistBox .txtInfo .blogArea ul li:last-child a { font-size: 12px !important; }
body.stylist #main .stylistBox .txtInfo .blogArea ul li:first-child { width: 100%; padding-right: 12px; }
body.stylist #main .stylistBox .txtInfo .blogArea .info_title a { padding: 3px 0; }
body.stylist #main .stylistBox .txtInfo .career dl dt { width: 120px; }
body.stylist #main .sect02 ul.wrapper li {
    margin: 0 2% 24px 0;
    width: 49%;
    }

body.stylist #main .sect03 ul.wrapper li:nth-child(3n+2) { margin: 0 2% 24px 0; }
body.stylist #main .sect03 ul.wrapper li:nth-child(3n) { margin: 0 2% 24px 0; }
body.stylist #main .sect03 ul.wrapper li:nth-child(2n) { margin: 0 0 24px 0; }
body.stylist #main .sect03 ul.wrapper li:nth-child(n+4) { display: inline-block; }

/* twoResult sp */
body.stylist .twoResult-inBox li h5,
body.style .twoResult-inBox li h5 { font-size: 14px; }

body.stylist li .twoResult-reserve a,
body.style li .twoResult-reserve a { font-size: 12px; }

body.stylist li .twoResult-price,
body.style li .twoResult-price { font-size: 24px; }

}

/*=================================================
	styles
=================================================*/

body.style #content #main {    
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    }

body.style #main .sect02 ul.wrapper { margin: 0 auto; }
body.style #main .sect02 ul.wrapper li {
    margin: 0px 1.33% 36px 0;
    width: 24%;
    }

body.style #main .sect02 ul.wrapper li a.img { margin: 0; }
body.style #main .sect02 ul.wrapper li a.img img {
    width: 100%;
    vertical-align: bottom;
    transition: .2s;
    }

body.style #main .sect02 ul.wrapper li:hover a.img img {
    -webkit-filter: brightness(75%);
    -moz-filter: brightness(75%);
    -ms-filter: brightness(75%);
    filter: brightness(75%);
    }

body.style #main .sect02 ul.wrapper li a.txt h3 {
    margin: 12px 0;
    color: #FFF;
    background: #333;
    font-size: 12px;
    line-height: 18px;
    font-weight: bold;
    padding: 6px 9px;
    box-sizing: border-box;
    border-radius: 6px;
    transition: .2s;
    }

body.style #main .sect02 ul.wrapper li:hover a.txt h3 { background: #ec9c07; }
body.style #main .sect02 .pager,
body.media #main .sect02 .pager,
body.movie .pager {
    position: relative;
    overflow: hidden;
    margin: 12px 0;
    bottom: 0;
    }

@media only screen and (max-width: 1024px) {

body.style #main .sect02 ul.wrapper li {
    margin: 0 2% 24px 0;
    width: 32%;
    }

body.style #main .sect02 ul.wrapper li:nth-child(3n+2) { margin: 0 2% 24px 0; }
body.style #main .sect02 ul.wrapper li:nth-child(3n) { margin: 0 0 24px 0; }

}

@media only screen and (max-width: 767px) {

body.style #main .sect02 ul.wrapper li { width: 49%; }
body.style #main .sect02 ul.wrapper li:nth-child(3n+2) { margin: 0 2% 24px 0; }
body.style #main .sect02 ul.wrapper li:nth-child(3n) { margin: 0 2% 24px 0; }
body.style #main .sect02 ul.wrapper li:nth-child(2n) { margin: 0 0 24px 0; }

}

/*=================================================
	style
=================================================*/

body.style #main .styleBox .visualInfo {
    width: 27%;
    margin-right: 3%;
    }

body.style #main .styleBox .txtInfo { width: 70%; position: relative; }
body.style #main .styleBox .txtInfo h2 {
    margin: 0 auto 14px;
    font-size: 18px;
    font-weight: bold;
    line-height: 18px;
    }

body.style #main .styleBox .visualInfo .photo {
    margin: 0 0 20px;
    width: 100%;
    height: auto;
    overflow: hidden;
    }

body.style #main .styleBox .txtInfo .box dl dt { width: 100px; margin-right: 12px; }
body.style #main .styleBox .txtInfo .box dl dt span {
    display: inline-block;
    text-align: center;
    font-size: 12px;
    padding: 6px 0;
    width: 100%;
    background: #333;
    color: #FFF;
    box-sizing: border-box;
    border-radius: 6px;
    }

body.style #main .styleBox .txtInfo .box dl dd { line-height: 24px; }
.recommend dd ul li { padding: 0 6px; }
body.style #main .styleBox .txtInfo .box dl dd ul { margin: 0; }

.style-arrenge-point-text {
    line-height: 21px;
    font-size: 14px;
    }

body.style #main .styleBox .txtInfo .box p.styleTitle {
    position: relative;
    margin: 18px 0;
    border-bottom: none;
    }

body.style #main .styleBox .txtInfo .box p.styleTitle span {
    position: relative;
    display: inline-block;
    padding: 0 12px 0 0;
    font-size: 16px;
    font-weight: bold;
    color: #ad9f7d;
    background: #FFF;
    z-index: 10;
    }

body.style #main .styleBox .txtInfo .box p.styleTitle::before {
    position: absolute;
    content: "";
    width: 100%;
    height: 1px;
    background: #ad9f7d;
    top: 8px;
    z-index: 2;
    }

.hairMenu {
    font-size: 14px;
    font-weight: bold;
    }

body.style #main .commentArea {
    margin: 0 auto 48px;
    padding: 0;
    background-color: inherit;
    width: 100%;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    box-sizing: border-box;
    }

body.style #main .commentArea .img {
    position: relative;
    width: 120px;
    text-align: center;
    }

body.style #main .commentArea .img img { margin: 0; }
body.style #main .commentArea .img a {
    position: absolute;
    display: block;
    color: #333;
    font-size: 12px;
    width: 100%;
    line-height: 24px;
    border: solid 1px #000;
    background: #FFF;
    bottom: 12px;
    left: 12px;
    transition: .2s;
    }

body.style #main .commentArea .img a:hover { color: #ec9c07; }
body.style #main .commentArea .txt {
    position: relative;
    width: 86%;
    padding: 24px;
    margin-left: 36px;
    border: solid 1px #333;
    box-sizing: border-box;
    border-radius: 12px;
    }

body.style #main .commentArea .txt::before {
	content: "";
	position: absolute;
	top: 50%;
	left: -23px;
 	margin-top: -12px;
	border: 12px solid transparent;
	border-right: 12px solid #FFF;
 	z-index: 2;
    }

body.style #main .commentArea .txt::after {    
	content: "";
	position: absolute;
	top: 50%;
	left: -27px;
 	margin-top: -14px;
	border: 14px solid transparent;
	border-right: 14px solid #555;
 	z-index: 1;
    }

body.style #main .commentArea .txt h4 {
    font-size: 1.4rem;
    font-weight: bold;
    margin: 0 0 6px;
    padding: 0 0 6px;
    border-bottom: dotted 2px #CCC;
    }

body.style #main .styleStyle {
    position: relative;
    margin-bottom: 64px;
    }

body.style #main .sect02 .titleArea {
    text-align: center;
    margin: -12px auto 36px;
    border-bottom: 1px solid #ad9f7d;
    }

body.style #main .sect02 .titleArea h3 {
    position: relative;
    float: none;
    display: inline-block;
    margin: 0;
    padding: 0 36px;
    color: #333;
    font-weight: normal;
    bottom: -18px;
    background: #FFF;
    }

body.style #main .sect02 .titleArea h3::before {
    content: "≪";
    position: absolute;
    color: #ad9f7d;
    left: -3px;
    bottom: 5px;
    font-size: 24px;
    }

body.style #main .sect02 .titleArea h3::after {
    content: "≫";
    position: absolute;
    color: #ad9f7d;
    right: -3px;
    bottom: 5px;
    font-size: 24px;
    }

body.style #main .sect02 .titleArea h3 span.en {
    font-size: 36px;
    font-family: 'Amarante', cursive;
    letter-spacing: 0;
    }

body.style #main .sect02 .titleArea h3 span.jp {
    margin-left: .6em;
    font-size: 1.2rem;
    }

body.style #main .styleBox .txtInfo ul.sns li {
    width: 30px;
    transition: .2s;
    }

body.style #main .styleBox .txtInfo ul.sns li:hover { opacity: .75; }

@media only screen and (max-width: 1024px) {

body.style #main .styleBox {
    display: flex;
    flex-direction: row-reverse;
    }

body.style #main .styleBox .visualInfo { width: 40%; }
body.style #main .styleBox .txtInfo .box dl dt:first-of-type { width: 25%; }
.style-arrange-point { margin-top: 24px; }
body.style #main .styleBox .txtInfo .box { margin: 24px auto; }
body.style #main .commentArea .img { width: 160px; }
body.style #main .commentArea .img img { width: 100%; }
body.style #main .commentArea .txt {
    padding: 18px;
    margin-left: 24px;
    }

body.style #main .commentArea .txt::before {
    left: -24px;
    margin-top: -13px;
    border: 13px solid transparent;
    border-right: 13px solid #FFF;
    }

body.style #main .commentArea .img a {
    margin: 0;
    padding: 0;
    text-decoration: none;
    }

body.style #main .sect02 .titleArea { padding: 0; }
body.style #main .sect02 .titleArea h3 { bottom: -19px; }
body.style #main .sect02 .titleArea h3 span.jp { font-family:'Noto Sans JP'; }
body.style.detail #main .sect02 ul.wrapper li:nth-child(n+4) { display: none; }

}

@media only screen and (max-width: 767px) {

body.style #main .styleBox {
    display: block;
    flex-direction: inherit;
    }

body.style #main .styleBox .txtInfo h2 { margin: 18px auto; }
body.style #main .styleBox .txtInfo ul.sns { margin: 12px auto; }
body.style #main .styleBox .txtInfo ul.sns li { width: 26px; }
body.style #main .styleBox .txtInfo .box { margin: 12px auto; }
body.style #main .styleBox .txtInfo .box ul li { width: 46px; }
.hairMenu { margin-bottom: 18px; }

body.style #main .commentArea .img a {
    position: relative;
    display: inline-block;
    margin: 0;
    padding: 0;
    top: 6px;
    bottom: auto;
    left: 0;
    box-sizing: border-box;
    }

body.style #main .commentArea .txt { margin-left: 18px; }
body.style #main .commentArea .txt::before { top: 48px; }
body.style #main .commentArea .txt::after { top: 48px; }
body.style.detail #main .sect02 ul.wrapper li:nth-child(n+4) { display: inline-block; }

}

/*=================================================
	media
=================================================*/

body.media #content #main {    
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    }

body.media #main .sect02 ul.wrapper li {
    width: 19%;
    height: auto;
    margin: 0 1.25% 36px 0;
    display: inline-block;
    vertical-align: top;
    }

body.media #main .sect02 ul.wrapper li a.img img {
    width: 100%;
    vertical-align: bottom;
    margin-bottom: 0 !important;
    transition: .2s;
    }

body.media #main .sect02 ul.wrapper li:hover a.img img {
    -webkit-filter: brightness(75%);
    -moz-filter: brightness(75%);
    -ms-filter: brightness(75%);
    filter: brightness(75%);
    }

body.media #main .sect02 ul.wrapper li a.txt h3 {
    margin: 12px 0;
    color: #FFF;
    background: #333;
    font-size: 12px;
    line-height: 18px;
    font-weight: bold;
    padding: 6px 9px;
    box-sizing: border-box;
    border-radius: 6px;
    transition: .2s;
    }

body.media #main .sect02 ul.wrapper li:hover a.txt h3 { background: #ec9c07; }
body.media #main .sect02 ul.wrapper li a.txt p {
    color: #333;
    font-size: 12px;
    line-height: 18px;
    margin-bottom: 12px;
    overflow: hidden;
    }

.media-right {
    text-align: center;
    padding: 3px 0;
    color: #666;
    display: block;
    border: solid 1px #333;
    border-radius: 30px;
    }

.publisher span {
    font-size: 12px;
    margin: 0 0 6px;
    padding: 0 18px;
    display: inline-block;
    border: solid 1px #333;
    border-radius: 30px;
    }

@media only screen and (max-width: 1024px) {

body.media #main .sect02 ul.wrapper li {
    width: 32%;
    margin: 0 2% 24px 0;
    }

body.media #main .sect02 ul.wrapper li:nth-child(2n) { margin: 0 2% 24px 0; }
body.media #main .sect02 ul.wrapper li:nth-child(3n) { margin: 0 0 24px 0; }

}

@media only screen and (max-width: 767px) {

body.media #main .sect02 ul.wrapper li { width: 49%; }
body.media #main .sect02 ul.wrapper li:nth-child(3n) { margin: 0 2% 24px 0; }
body.media #main .sect02 ul.wrapper li:nth-child(2n) { margin: 0 0 24px 0; }

}

/*=================================================
	gallery
=================================================*/

body.gallery #content #main {    
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    }

body.gallery #main .sect02 ul.wrapper { margin: 16px auto; }
body.gallery #main .sect02 ul.wrapper li {
    width: 24%;
    margin: 0 1.33% 12px 0;
    display: inline-block;
    vertical-align: top;
    height: auto;
    }

body.gallery #main .sect02 li a img {
    width: 100%;
    vertical-align: bottom;
    margin-bottom: 0 !important;
    transition: .2s;
    }

body.gallery #main .sect02 li:hover a img {
    -webkit-filter: brightness(75%);
    -moz-filter: brightness(75%);
    -ms-filter: brightness(75%);
    filter: brightness(75%);
    }

body.gallery .galleryCat a {
    position: relative;
    display: inline-block;
    text-align: center;
    padding: 3px 12px;
    font-size: 12px !important;
    font-weight: bold;
    letter-spacing: 1px;
    color: #333 !important;
    background: #FFF;
    transition: .3s;
    overflow: hidden;
	box-sizing: border-box;
    border-radius: 6px;
    border: solid 1px #333;
    z-index: 1;
    }

body.gallery .galleryCat a:hover { color: #FFF !important; }
body.gallery .galleryCat a::before {
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    content: '';
    width: 120%;
    height: 100%;
    background: #ec9c07;
    transform-origin: right top;
    transform: skewX(-30deg) scale(0, 1);
    transition: transform .3s;
    }

body.gallery .galleryCat a:hover::before {
    transform-origin: left top;
    transform: skewX(-30deg) scale(1, 1);
    }

@media only screen and (max-width: 1024px) {

body.gallery #main .sect02 ul.wrapper { text-align: left; }
body.gallery #main .sect02 ul.wrapper li {
    width: 49%!important;
    margin: 0 2% 12px 0 !important;
    }

body.gallery #main .sect02 ul.wrapper li:nth-child(2n) { margin-right: 0 !important; }

}

/*=================================================
	movie
=================================================*/

body.movie #content #main {    
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    }

.movie-cap {
    font-size: 14px;
    margin-bottom: 48px;
    }

@media only screen and (max-width: 1024px) {

.youtube { margin-bottom: 12px; }
.movie-cap { margin-bottom: 36px; }

}

/*=================================================
	blogs
=================================================*/

body.blog #content #main {    
    width: 100%;
    max-width: 1280px;
    margin: 0 auto 64px;
    }

body.blog #main .couponArea {
    position: relative;
    display: block;
    width: 100%;
    background: #f3ebd6;
    padding: 24px;
    margin: 0;
    box-sizing: border-box;
    border-radius: 12px;
    }

.blogWrap {
    display: flex;
    flex-wrap: wrap;
    }

.blogWrap ul {
    display: flex;
    align-items: center;
    margin: 0;
    width: 50%;
    padding: 1%;
    box-sizing: border-box;
    transition: .2s;
    }

.blogWrap ul:hover {
    background: rgba(165,158,122,.25);
    border-radius: 12px;
    }

.blogWrap ul li:first-child {
    width: 256px;
    padding-right: 24px;
    box-sizing: border-box;
    }

.blogWrap ul li:last-child a  {
    display: inline-block;
    vertical-align: middle;
    font-size: 12px;
    line-height: 18px;
    color: #000;
    }

.blogWrap .blogDate {
    font-weight: bold;
    font-size: 14px !important;
    margin-right: 12px;
    }

.blogWrap .blogCat {
    border: solid 1px #000;
    padding: 2px 12px;
    font-size: 10px !important;
    border-radius: 30px;
    background: #FFF;
    transition: .2s;
    }

.blogWrap .blogCat:hover {
    border: solid 1px #ec9c07;
    background: #ec9c07;
    color: #FFF;
    }

.blogWrap .info_title a {
    font-size: 14px !important;
    font-weight: bold;
    padding: 3px 0;
    }

.blogWrap h3 {
    position: absolute;
    font-family: 'Amarante', cursive;
    font-size: 108px;
    font-weight: normal;
    color: #333;
    margin: 0 0 12px;
    top: -72px;
    }

.blogWrap h3 span {
    font-size: 18px;
    font-weight: bold;
    margin-left: 12px;
    }

.blogWrap ul li .info_name a {
    display: inline-block;
    background: #ec9c07;
    color: #FFF;
    font-size: 11px;
    letter-spacing: 1px;
    padding: 2px 9px;
    border-radius: 6px;
    margin-top: 6px;
    }

@media only screen and (max-width: 1024px) {

body.blog #main .couponArea { padding: 18px; }
.blogWrap ul {
    margin: 0 0 12px;
    width: 100%;
    padding: 0;
    }

.blogWrap .blogCat { padding: 0px 12px; }

}

@media only screen and (max-width: 767px) {

body.blog #main .couponArea { padding: 18px 12px; }
.blogWrap ul li:first-child { padding-right: 12px; }
.blogWrap ul li:last-child a.blogDate { font-size: 12px !important; }
body.blog #main a.postUser { margin-left: 0; }
body.blog #main .articleTxt { margin: 24px 0; }

}

/*=================================================
	blog
=================================================*/

body.blog #main .sect {
    width: 100%;
    margin: 36px 0 0;
    }

body.blog #main .sect .titleArea {
    margin: 0 auto 12px;
    border-bottom: 1px solid #ad9f7d;
    }

body.blog #main .sect .titleArea h3 { font-weight: bold; }
body.blog #main .sect .wrapper li {
    float: left;
    margin-right: 10px;
    padding: 3px 12px;
    color: #333;
    font-size: 1rem;
    background-color: #FFF;
    border: solid 1px #333;
    border-radius: 30px;
    }

body.blog #main .sect .wrapper li a { color: #333; transition: .2s; }
body.blog #main .sect .wrapper li a:hover { color: #ec9c07; }
body.blog #main .articleTxt { margin: 36px 0; }

body.blog #main .newsTime {
    font-size: 14px !important;
    font-weight: bold;
    color: #666;
    display: inline-block;
    margin-bottom: 0;
    }

body.blog #main a.postUser {
    display: inline-block;
    background: #ec9c07;
    color: #FFF;
    font-size: 11px;
    letter-spacing: 1px;
    padding: 2px 9px;
    border-radius: 6px;
    margin-left: 6px;
    }

body.blog #main .blogTags {
    font-size: 12px;
    color: #666;
    border-top: dotted 2px #ad9f7d;
    padding: 6px;
    }

dl.search2 dd button:hover { background: #8b7b53; }
dl.search2 dd button {
    background-color: #ad9f7d;
    border: 1px solid #ad9f7d;
    border-radius: 6px;
    cursor: pointer;
    }

dl.search2 dt{ padding: 0;}
dl.search2 dt input {
    padding: 13px;
    box-sizing: border-box;
    }

@media only screen and (max-width: 1024px) {

body.blog #main .sect { padding: 0; }

}

/*=================================================
	voice
=================================================*/

body.voice #content #main {    
    width: 100%;
    max-width: 1280px;
    margin: 0 auto 64px;
    }

body.voice #main .voiceBox {
    padding: 18px;
    margin: 0 auto 24px;
    width: 100%;
    border: solid 1px #333;
    border-radius: 12px;
    box-sizing: border-box;
    }

body.voice #main .voiceBox .voiceInner {
    margin: 0 auto 25px;
    padding: 25px 20px 20px;
    width: 100%;
    background-color: #eee;
    position: relative;
    box-sizing: border-box;
    border-radius: 9px;
    }

body.voice #main .voiceBox.pickUp .voiceInner { background-color: #faf6e9; }
body.voice #main .voiceBox .review h3,
body.voice #main .voiceBox .reply h3 {
    font-size: 1.4rem;
    padding-bottom: 5px;
    border-bottom: 2px dotted #ad9f7d;
    }

body.voice #main .voiceBox .review dl dd { color: #ec9c07; }
body.voice #main .voiceBox .voiceInner p.voicemenu {
    margin: 0;
    padding: 6px 12px;
    font-size: 12px;
    font-weight: bold;
    line-height: 18px;
    border: solid 1px #333;
    border-radius: 6px;
    background: #FFF;
    }

body.voice #main .voiceBox .voiceInner dl dd { margin: 0 0 0 12px; }
body.voice #main .voiceBox .voiceInner dl dd:before { left: -8px; }
body.voice #main .voiceBox .reply { margin: 0; }

body.voice #main .voiceBox .voiceInner p {
    margin: 0 0 12px;
    font-size: 14px;
    line-height: 21px;
    }

@media only screen and (max-width: 767px) {

body.voice #main .voiceBox { padding: 12px; }
body.voice #main .voiceBox .voiceInner { padding: 18px 12px 12px; }
body.voice #main .voiceBox .voiceInner dl { display: block; }
body.voice #main .voiceBox .voiceInner dl dt,
body.voice #main .voiceBox .voiceInner dl dd { display: inline-block; margin-bottom: 6px; }

}

/*=================================================
	FAQ
=================================================*/

body.faq #content #main {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto 24px;
    }

body.faq #sub { float: none !important; }
body.faq #main { float: none !important; }

body.faq #main .sect .titleArea {
    margin: 0 auto 18px;
    padding: 0;
    border-bottom: 1px solid #ad9f7d;
    }

body.faq #main .sect .titleArea h3 span.jp {
    font-size: 18px;
    font-weight: bold;
    }

div.accordion > ul > li > a {
    background-color: #ad9f7d;
    margin: 6px auto;
    border-radius: 12px;
    }

body.faq #main .styleBox { margin: 0 auto; }
div.accordion > ul > li > ul > li { padding: 24px; }

@media only screen and (max-width: 1024px) {

div.accordion > ul > li > a { border-radius: 9px; }
div.accordion > ul > li > ul > li { padding: 18px; }

}

@media only screen and (max-width: 767px) {

div.accordion > ul > li > ul > li { padding: 12px; }

}

/*=================================================
	Access
=================================================*/

body.access.onecolumn #content #main {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto 24px;
    }

body.access #main section { width: 100%; margin: 0 auto; }
body.access #main .shopdate { width: 100%; margin: 0 auto 64px; }

body.access #main .shopdate table { width: 100%; }
body.access #main .shopdate td:nth-child(2n) {
    padding-right: 0;
    padding: 6px 0;
    width: 100%;
    }

body.access #main .shopdate td {
    padding: 10px 40px 0 0;
    font-size: 1.2rem;
    line-height: 1.6;
    width: 120px;
    }

body.access #main .shopdate p {
    font-size: 14px;
    line-height: 1.6;
    overflow: auto;
    }

body.access #main .shopdate a {
    color: #333;
    text-decoration: none;
    }

body.access section .shopdate .titleArea {
    margin: 0 auto 12px;
    border-bottom: 1px solid #ad9f7d;
    }

body.access #main .shopdate h3 span.en {
    font-family: 'Amarante', cursive;
    font-size: 36px;
    letter-spacing: 0;
    }

body.access #main .shopdate h3 span.jp {
    font-family: 'Noto Sans JP';
    margin-left: 6px;
    font-size: 14px;
    }

@media only screen and (max-width: 1024px) {

body.access #main .shopdate td { padding: 10px 0 0 0; }

}

@media only screen and (max-width: 767px) {

body.access #main .shopdate h3 span.en { font-size: 30px; }
body.access #main .shopdate td {
    padding: 10px 0 0 0;
    width: 84px;
    }
body.access #main .shopdate { margin: 0 auto 36px; }

}

/*=================================================
	company & recruit
=================================================*/

body.recruit.onecolumn #content #main,
body.company.onecolumn #content #main {
    width: 100%;
    max-width: 1280px;
    margin: 24px auto;
    }

table.recruit,
table.company {
  border-collapse: separate;
  border-spacing: 0px 6px;
  }

table.recruit > tbody > tr:not(:last-child) > td,
table.company > tbody > tr:not(:last-child) > td {
    line-height: 1.8;
    }

table.recruit > tbody > tr > td:first-child,
table.company > tbody > tr > td:first-child {
    background: #FFD;
    font-weight: bold;
    border: solid 1px #333;
    border-right: dotted 2px #333;
    border-radius: 6px 0 0 6px;
    width: 180px;
    }

table.recruit > tbody > tr > td,
table.company > tbody > tr > td {
    padding: 12px;
    }

table.recruit > tbody > tr > td:nth-child(2),
table.company > tbody > tr > td:nth-child(2) {
    background: #FFF;
    border: solid 1px #333;
    border-left: none;
    border-radius: 0 6px 6px 0;
    }

body.recruit section.sect p,
body.company section.sect p {
    margin:24px;
    box-sizing: border-box;
    }

body.recruit h3,
body.company h3 {
    text-align: center;
    font-size: 30px;
    line-height: 42px;
    font-family: 游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN","Hiragino Mincho Pro",HGS明朝E,メイリオ,Meiryo,serif;
    padding: 0 0 36px;
    margin: 0 0 36px;
    border-bottom: dotted 2px #CCC;
    }

@media only screen and (max-width: 1024px) {

body.recruit h3,
body.company h3 {
    font-size: 24px;
    padding: 0 0 18px;
    margin: 0 0 18px;
    }

body.recruit section.sect p,
body.company section.sect p {
    margin: 18px;
    }

table.recruit > tbody > tr > td:first-child,
table.company > tbody > tr > td:first-child {
    width: 100px;
    }

table.recruit > tbody > tr:not(:last-child) > td,
table.company > tbody > tr:not(:last-child) > td {
    line-height: 24px;
    }

}

/*=================================================
    privacy
=================================================*/

body.privacy #content #main {
    width: 100%;
    max-width: 1280px;
    margin: 24px auto;
    }

body.privacy #main .shopdate h3 {
    color: #333;
    font-size: 18px;
    font-family: 'Noto Sans JP';
    font-weight: bold;
    margin-bottom: 8px;
    }

body.privacy #main .shopdate ol li { padding-bottom: 12px; }
body.privacy #main section { margin: 24px auto; }

/*=================================================
    sitemap
=================================================*/

body.sitemap #content #main {
    width: 100%;
    max-width: 1280px;
    margin: 24px auto;
    }

body.sitemap #main section { margin: 0; }
body.sitemap #main .shopdate ul a {
    text-decoration: underline;
    color: #333;
    padding-left: 21px;
	}

.main_page_link li {
	position: relative;
    display: inline-block;
    vertical-align: top;
    line-height: 1.6;
    color: #333;
    font-size: 1.4rem;
    font-weight: normal;
    width: 32%;
    margin: 0 0 0 0;
    padding: 12px 0;
    border-bottom: none;
    box-sizing: border-box;
	}

.main_page_link li:nth-child(2n) { margin: 0; }
.main_page_link li::before {
	position: absolute;
	content: "";
	vertical-align: middle;
	top: 16px;
	width: 14px;
	height: 14px;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	background: #ec9c07;
	}

.main_page_link li::after {
    position: absolute;
    content: "";
    vertical-align: middle;
    top: 18px;
    left: 5px;
    box-sizing: border-box;
    width: 5px;
    height: 5px;
    border: 5px solid transparent;
    border-left: 5px solid #fff;
	}

@media only screen and (max-width: 767px) {

.main_page_link li {
    font-size: 1.2rem;
    width: 49%;
	}

body.sitemap #main .shopdate { margin: 0 auto; }

}

/*=================================================
    contact
=================================================*/

body.contact #content #main {
    width: 100%;
    max-width: 1280px;
    margin: 24px auto;
    }

body.contact #main .confirm .contactInner dl {
    border-bottom: dotted 1px #CCC;
    padding-bottom: 6px;
    }

body.contact #main .input .contactInner dl dt {
    margin: 0 auto 12px;
    width: 93%;
	}

body.contact #main .input .contactInner dl dd {
    text-align: center;
    margin: 0;
    padding: 0;
	}

body.contact #main .input .btn input#btnReset,
body.contact #main .confirm .btn input#btnBack {
    background-color: #eee;
	cursor: pointer;
    font-family:'Noto Sans JP';
	}

body.contact #main .input .btn input#btnConfirm,
body.contact #main .confirm .btn input#btnSend {
    color: #fff;
    background: #ec9c07;
	cursor: pointer;
    font-family:'Noto Sans JP';
	}

body.contact #main .confirm .btn {
    width: 630px;
    margin: 0 auto;
	}

body.contact #main .btn input {
    display: inline-block;
    width: 300px;
    height: 40px;
    text-align: center;
    border: none;
    font-size: 1.4rem;
    font-weight: bold;
    margin: 0 6px;
    border-radius: 12px;
	}

#content .input p.error {
    text-align: center;
    width: 100%;
    font-size: 14px;
    font-weight: bold;
    color: #FFF;
    background: #f75255;
    margin: 12px auto 36px;
    padding: 12px;
    border-radius: 6px;
    box-sizing: border-box;
    }

body.contact #main p.message {
    width: 100%;
    margin: 0 auto 40px;
    text-align: center;
    font-size: 14px;
    font-weight: bold;
    color: #FFF;
    background: #4c91da;
    border-radius: 6px;
    padding: 12px 0;
    }

body.contact #main .confirm .contactInner dl { width: 90%; }
body.contact #main .confirm .contactInner dl dt { width: 200px; }
body.contact #main .confirm .contactInner dl dd { width: 100%; }

body.contact #main .complete a.returnTop {
    margin: 64px auto;
    border-radius: 12px;
    }

@media only screen and (max-width: 1024px) {

body.contact #main .contactInner { width: 96% !important; }
body.contact #main .input .contactInner dl { font-size: 14px; }
body.contact #main .input .contactInner dl dt { width: 100% !important; }
body.contact #main .input .contactInner dl dd input {
    padding: 12px;
    font-size: 14px !important;
    border: 1px solid #e1e1e1;
    width: 100%;
    box-sizing: border-box;
    }

body.contact #main .confirm .contactInner dl {
    display: flex;
    width: 100%;
    font-size: 14px;
    border-bottom: dotted 1px #CCC;
    padding-bottom: 6px;
    }
body.contact #main .confirm .btn { width: 100%; }
body.contact #main .confirm .contactInner dl dt { width: 200px; }
body.contact #main p.message { width: 90%; }
body.contact #main .contactInner { width: 90%; }

input[type="button"], input[type="text"], input[type="email"],
input[type="submit"], input[type="reset"], textarea {
    -webkit-appearance: none;
    }

}

@media only screen and (max-width: 767px) {

body.contact #main .input .contactInner dl dt {
    margin: 0 auto 6px;
    width: 100%;
    font-size: 14px;
	}

body.contact #main .confirm .btn { width: 100%; }
body.contact #main .btn input { margin: 0 6px 24px; }
body.contact #main .input .btn input#btnConfirm,
body.contact #main .input .btn input#btnReset { width: 45%;	}
body.contact #main .confirm .contactInner dl { display: block; }
body.contact #main .input .contactInner dl dd input {
    padding: 1rem 4%;
    border: 1px solid #e1e1e1;
    width: 100%;
    font-size: 13px;
    box-sizing: border-box;
	}

body.contact #main .input .btn { width: 100%; }
body.contact #main p.message { width: 90%; }
body.contact #main .contactInner { width: 90%; }

}

/*=================================================
    404
=================================================*/

body.notfound #content #main {
    }

h3.notfound_title {
    font-size: 24px;
    font-weight: bold;
    margin: 36px auto;
    }

p.notfound_txt {
    font-size: 14px;
    line-height: 24px;
    }

@media only screen and (max-width: 1024px) {

h3.notfound_title {
    font-size: 18px;
    margin: 24px auto;
    }

p.notfound_txt { margin-bottom: 24px; }

}