/*guest-proom child CSS*/
.pindex.proom h3 {
    writing-mode: initial;
}
.proom .pGr p {
    margin-bottom: 45px;
    line-height: 2.2em;
	margin-top: -0.6em;
}
.pindex.proom h3,
.pindex.proom .s-intro h3,
.proom .s-intro img,
.proom .imGr > img,
.proom .imGr .flexbox,
.proom .wrap-dl {
    margin-bottom: 60px;
}

/*intro*/
@media only screen and (min-width:1000px) {
	.proom .s-intro {
		padding: 0 var(--u-gc);
	}
}
.proom .t-desc .s-intro {
    justify-content: center;
}
.pindex.proom .s-intro h3 {
    display: inline-flex;
    align-items: center;
    width: 100%;
    line-height: 2;
    writing-mode: vertical-rl;
    margin: 0 auto;
	margin-bottom: 60px;
}

/*psec*/
.proom #pageMain .psec:last-of-type {
	margin-bottom: 200px;
}
.proom .pGr {
	padding: 0 var(--u-gc);
}
.proom .imGr .flexbox {
    margin: 0 -30px 60px;
}
	.proom .imGr .flexbox > * {
		width: 50%;
		padding: 0 30px;
	}
.proom .noteGr {
    margin-bottom: var(--u-sec-bottom);
}
@media only screen and (min-width:640px) {
	.proom .pbox-r {
		padding-left: 170px;
	}
	.proom #pageMain .psec:last-of-type {
		margin-bottom: 120px;
	}
}

/*button*/
.proom .bt.bt-wh {
    width: 100%;
    padding-top: 3.125em;
    padding-bottom: 3.125em;
}
.proom .bt.bt-wh + .bt-text-wrap {
    margin-top: 40px;
}
.proom .bt-text-wrap {
    text-align: right;
}
.proom .box-bt .bt.bt-text {
	width: initial;
}

/**/
.proom .tate.tit-wrap.flexbox {
    align-items: center;
}
.proom .imGr .flexbox:first-of-type,
.proom .imGr > img:first-of-type {
	margin-bottom: var(--u-gutter);
}
.proom .imGr .flexbox:last-of-type,
.proom .imGr > img:last-of-type {
	margin-bottom: 60px;
}
.proom .tate.tit-wrap.flexbox p {
    padding: 0;
    margin-bottom: 25px;
}
@media only screen and (min-width:641px) {
    
    
}
@media only screen and (max-width:640px) {
	.pindex .psec h2,
	.pindex.proom h3,
	.pindex.proom .s-intro h3,
	.proom .s-intro img,
	.proom .imGr > img,
	.proom .imGr .flexbox,
    .proom .bt.bt-wh + .bt-text-wrap {
		margin-bottom: 36px;
	}
	.proom .wrap-dl {
		margin-bottom: 30px;
	}
	.proom .tate.tit-wrap.flexbox p {
        margin-bottom: 21px;
    }
	.proom .hero-wrap,
    .proom .noteGr {
		margin-bottom: 120px;
	}
    .proom .psec + .psec {
        margin-top: 120px;
    }
    .proom .imGr .flexbox {
		margin: 0 -6px 36px;
	}
	.proom .imGr .flexbox:last-of-type {
		margin-bottom: 36px;
	}
	.proom .imGr .flexbox > * {
		width: 50%;
		padding: 0 6px;
	}
	.proom .imGr.imGr-s1 img {
        margin-bottom: var(--u-gutter);
    }
    .proom .imGr.imGr-s1 > img:last-of-type,
	.proom .imGr > img:last-of-type {
        margin-bottom: 36px;
    }
	.proom .imGr.imGr-s1 .flexbox img {
		margin-bottom: 0;
	}
	.pindex.proom .s-intro h3 {
		font-size: 19px;
	}
	.pindex.proom h3 {
		font-size: 16px;
	}	
    .proom dt {
        min-width: calc(var(--u-grid) * 2 + var(--u-column));
    }
	.proom dl {
        padding: 1.35em 0 1.4em;
    }
    .proom .bt.bt-wh {
        font-size: 15px;
        padding: 1.8em var(--u-gc);
        padding-bottom: 1.8em;
        background-size: 50px auto;
        background-position: right var(--u-gc) center;
    }
    .proom .bt.bt-text {
        font-size: 13px;
        background-size: 47px auto;
        padding-right: 62px;    
    }
}

/*フローティングボタン設置*/
body.proom {
    position: relative;
    z-index: 1;
}
.proom #pageMain {
    position: relative;
    z-index: 1;
}
.box-floating-bt {
    position: fixed;
    z-index: 2;
    width: calc(100% - var(--u-base-s) * 2);
    bottom: 57px;
    left: 50%;
    transform: translate(-50%,-100%);
    text-align: center;
    font-size: 16px;
}
    .box-floating-bt.blur-effect::before,
    .box-floating-bt a.bt.bt-floating  {
        position: absolute;
        display: inline-block;
        width: 100%;
        bottom: 0;
        left: 50%;
        transform: translate(-50%,0); 
        font-size: 1em;
        line-height: 1.9em;
    }
    .box-floating-bt.blur-effect::before {
        height: 4.3em;
    }
    .box-floating-bt a.bt.bt-floating {
        letter-spacing: 0.03em;
        margin: auto;
        padding-top: 1.2em;
        padding-bottom: 1.2em;
        background-size: 3em auto;
        background-image: var(--ui-bt-base-hovericon);
    }
        .box-floating-bt a.bt.bt-floating:hover {
            background-image: var(--ui-bt-base-icon);
        }
@media only screen and (min-width:641px) {
    .box-floating-bt {
        max-width: 403px;
    }    
}
@media only screen and (max-width:640px) {     
	.box-floating-bt {
		bottom: var(--u-base-s);
	}
        .box-floating-bt {
            font-size: 1em;
        }
}

/*Reservation*/
#floatBtReservation {
    transition: all 0.3s;
    opacity: 1;
}
#floatBtReservation[data-hidden="true"] {
    z-index: -1;
    opacity: 0;
}

/**/
@media only screen and (min-width:1000px) {
    .proom .lo-right {
        padding-right: var(--u-gc);
    }
}