﻿
@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;500&family=Cormorant+Garamond:wght@400&display=swap');

.cinzel {
                font-family: "Cinzel", serif;
                font-weight: 400;
                font-style: normal;
                }

.garamond {
                font-family: "Cormorant Garamond", serif;
                font-weight: 400;
                font-style: normal;
                }

.gothic{
                font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
                }

/* =======================

調整


@media screen and (min-width: 1100px) {
nav:not(.salonArea nav) {
                z-index: 14;
                width: 100%;
                min-width: 768px;
                height: 80px;
                position: fixed;
                display: flex !important;
                align-items: center;
                justify-content: flex-end;
                top: 0;
                right: 0;
                pointer-events: none;
                n-bottom: 0;
                }
	}

@media screen and (min-width: 768px) and (max-width: 1100px) {
.navi__item a {
                padding: 0 10px;
                font-size: 11px;
                color: #fff;
                position: relative;
                line-height: 40px;
                letter-spacing: 0;
                display: block;
                min-width: auto;
                text-align: center;
                background: #48322a;
                border: 1px solid #48322a;
                box-sizing: border-box;
                font-weight: 500;
                }
.navi__item {
                float: left;
                margin-right: 3px;
                }
._popup_wrap .popup_content {
                position: relative;
                align-self: center;
                width: 60%;
                box-sizing: border-box;
                background: #fff;
                transition: 0.5s;
                box-shadow: 0 0 5px rgba(0, 0, 0, 0.7);
                }
.headLine svg {
                width: 180px;
                height: 29.5px;
                fill: #48322a;
                }
                }

======================= */

#gHeader {
                z-index: 101;
                transition: transform 0.5s;
                min-width: 100%;
                background: rgba(255, 255, 255, 100) !important;
                }
@media screen and (min-width: 768px) {
#gHeader {
                padding: 0 0 10px;
                min-width: 100%;
                }
                }
@media screen and (min-width: 1100px) {
#gHeader {
                padding: 25px 0 10px;
                min-width: 100%;
                }
                }

#gFooter {
                opacity: 1;
                }

@media screen and (min-width: 768px) {
#gFooter .menu {
                width: 90%;
                }
                }
@media screen and (min-width: 1100px) {
#gFooter .menu {
                width: 900px;
                }
                }


.footGood {
                padding: 34px 0 100px;
                }
@media screen and (min-width: 1100px) {
.footGood {
                padding: 34px 0 34px;
                }
                }

.dress #pagePath {
                box-sizing: border-box;
                }

body{
                margin-bottom: 40px;
                overflow-x:hidden;
                }
@media screen and (min-width: 1100px) {
body{
                margin-bottom: 0;
                }
	}

#gHeader.js_hide {
                transform: translateY(-100%);
                }

.ad_js_view {
                transform: translateY(48px);
	-webkit-transition: all .6s;
	-ms-transition: all .6s;
	transition: all .6s;
                }
@media screen and (min-width: 1100px) {
.ad_js_view {
                transform: translateY(77px);
                }
                }

.hide {
                transform: translateY(110px) !important; 
	opacity: 1 !important;
                }

.sharehide {
                transform: translateY(-110px) !important; 
	opacity: 1 !important;
                }

/* =======================

__CP 

======================= */

#__CP {
                -ms-touch-action: manipulation;
                touch-action: manipulation;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
                width: 100%;
	/*font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;*/
                font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
                font-weight: 400;
                font-size: 13px;
                color: #081633;
                min-height: 100vh;
                }

#__CP img {
                vertical-align: bottom;
                }

#__CP h1,
#__CP h2,
#__CP h3,
#__CP h4,
#__CP h5,
#__CP p {
                margin: 0;
                padding:0;
                }

#__CP a {
                color: #001734;
                }

#__CP .pc {display: none !important;}
#__CP .pci {display: none !important;}
#__CP .sp {display: block !important;}
#__CP .spi {display: inline !important;}
@media screen and (min-width: 768px) {
#__CP .pc {display: block !important;}
#__CP .pci {display: inline !important;}
#__CP .sp {display: none !important;}
#__CP .spi {display: none !important;}
	}

#__CP *{
	box-sizing: border-box;
                font-size: 13px;
                }


.adf{
                transform: scale(.85);
	opacity: 0;
                }
._fadeScalefast {
                transform: scale(1) !important;
	opacity: 1;
                transition: all 1s ease-out;
                }

.adfd{
	opacity: 0;
                }
._fadeScaledown {
	opacity: 1;
                transition: all 1s ease-out;
                }

.adln{
                transform: scale(1, 3);
	opacity: 0;
                }
._fadeLine {
                transform: scale(1,1) !important;
	opacity: 1;
                transition: all 1s ease-out;
                }



/* =======================

ad_nav 

======================= */

#ad_nav {
                position: -webkit-sticky;
                position: sticky;
                top: 48px;
                margin-top: 48px;
                height: 48px;
                width: 100svw;
	background-color: rgba(255, 255, 255, 0.5);
	display: flex;
	align-items: stretch;
	justify-content: space-between;
	flex-wrap: nowrap;
	flex-direction: row;
                -webkit-backdrop-filter: blur(6px);
                backdrop-filter: blur(6px);
                z-index:10;
                }
@media screen and (min-width: 540px) {
#ad_nav {
                margin-top: 48px;
                height: 48px;
                }
	}
@media screen and (min-width: 768px) {
#ad_nav {
                margin-top: 50px;
                height: 48px;
                top: 50px;
                }
	}
@media screen and (min-width: 1100px) {
#ad_nav {
                margin-top: 77px;
                height: 60px;
                top: 77px;
                }
	}

#ad_nav div{
                height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
                }

#ad_nav div:first-child{
                width: 25%;
	justify-content: flex-start;
                }

#ad_nav div:first-child a{
                width: 100%;
                height: 100%;
	display: flex;
	align-items: center;
                padding-left: 12px;
                }
@media screen and (min-width: 540px) {
#ad_nav div:first-child img{
                padding-left: 12px;
                }
	}
@media screen and (min-width: 768px) {
#ad_nav div:first-child a{
                padding-left: 30px;
                }
	}

#ad_nav div:first-child img{
                height: 45%;
                }
@media screen and (min-width: 540px) {
#ad_nav div:first-child img{
                height: 50%;
                }
	}

#ad_nav div:last-child{
                width: 70%;
	justify-content: flex-end;
                padding-right: 10px;
                }
@media screen and (min-width: 768px) {
#ad_nav div:last-child{
                padding-right: 18px;
                }
	}

#ad_nav div:last-child a{
	display: flex;
	align-items: center;
                height: 100%;
                padding: 0 .6em;
                }
@media screen and (min-width: 540px) {
#ad_nav div:last-child a{
                padding: 0 1em;
                }
	}

#ad_nav div:last-child a p{
                margin-top: 2px;
                font-size: .85em;
                font-weight: 500;
                text-align: center;
	white-space: nowrap;
	word-wrap: break-word;
                line-height: 1.1em;
                letter-spacing: 0;
                border-bottom: 1px solid transparent;
	-webkit-transition: border-bottom .6s;
	-ms-transition: border-bottom .6s;
	transition: border-bottom .6s;
                }
@media screen and (min-width: 540px) {
#ad_nav div:last-child a p{
                font-size: .9em;
                line-height: 1.1em;
                }
	}
@media screen and (min-width: 768px) {
#ad_nav div:last-child a p{
                font-size: .9em;
                line-height: 1.1em;
                }
	}
@media screen and (min-width: 1100px) {
#ad_nav div:last-child a p{
                font-size: 1em;
                line-height: 1.1em;
                }
                }

#ad_nav div:last-child a:hover p{
                border-bottom: 1px solid rgba(8, 22, 51, .5);
                }

#ad_nav div:last-child a.ad_stay p{
                border-bottom: 1px solid rgba(8, 22, 51, .5);
                }

#ad_nav div:last-child a p span{
                font-size: .8em;
                }
@media screen and (min-width: 540px) {
#ad_nav div:last-child a p span{
                font-size: .9em;
                line-height: 1.1em;
                }
	}
@media screen and (min-width: 1100px) {
#ad_nav div:last-child a p span{
                font-size: 1em;
                line-height: 1.1em;
                }
                }










