@charset "UTF-8";
/* ===================================================================
CSS information

file name  : rooms.css
author     : Abilive
style info : お部屋
=================================================================== */
#l-contents .l-intr { position: relative; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: space-between; justify-content: space-between; margin-top: 100px; margin-bottom: 100px; }
#l-contents .l-intr .b-intr { width: 42.01681%; }
#l-contents .l-intr .b-intr h4 { margin-bottom: 60px; }
#l-contents .l-intr .b-intr .b-01 { width: 200px; }
#l-contents .l-intr .b-intr .b-01 a span:after { content: ""; margin-left: .3em; font-family: 'Font Awesome 6 Free'; font-weight: 900; }
#l-contents .l-intr .pho { width: 50.42017%; }
#l-contents .l-intr > .ic1, #l-contents .l-intr .ic2, #l-contents .l-intr .ic3 { position: absolute; pointer-events: none; z-index: 1; }
#l-contents .l-intr > .ic1 { width: 224px; left: -18.31933%; top: 66.66667%; }
#l-contents .l-intr > .ic2 { width: 224px; left: 50%; margin-left: -190px; top: 25px; }
#l-contents .l-intr > .ic3 { width: 150px; right: -13.02521%; top: 81.66667%; }

.l-ank { position: relative; padding: 40px 0; }
.l-ank .bg { background: #efeae3; width: 161.34454%; height: 100%; display: block; position: absolute; top: 0; left: 50%; -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -webkit-transform: translateX(-50%); transform: translateX(-50%); z-index: 0; }
.l-ank .bg::before { content: ''; width: 0; height: 0; border-style: solid; border-width: 101px 176px 0 0; border-color: #fff transparent transparent transparent; position: absolute; top: 0; left: 0; }
.l-ank .bg::after { content: ''; width: 0; height: 0; border-style: solid; border-width: 0 0 101px 176px; border-color: transparent transparent #312522 transparent; position: absolute; bottom: 0; right: 0; }
.l-ank ul { display: -webkit-flex; display: flex; -webkit-justify-content: center; justify-content: center; position: relative; z-index: 1; }
.l-ank ul:nth-of-type(1) { margin-bottom: 2.34375%; }
.l-ank ul li { width: 25.21008%; }
.l-ank ul li:first-child a { border-left: 1px solid #c96a6a; }
.l-ank ul li a { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; text-decoration: none !important; border-right: 1px solid #c96a6a; padding: 3.33333% 6.66667%; -moz-transition: background 0.4s; -o-transition: background 0.4s; -webkit-transition: background 0.4s; transition: background 0.4s; }
.l-ank ul li a:hover { background: #c96a6a; }
.l-ank ul li a:hover .st { color: #fff; }
.l-ank ul li a .img { width: 46.33205%; }
.l-ank ul li a .st { width: 53.66795%; text-align: center; -moz-transition: color 0.4s; -o-transition: color 0.4s; -webkit-transition: color 0.4s; transition: color 0.4s; }
.l-ank ul li a .st span { line-height: 1; font-family: 'Crimson Text', "Times New Roman", Times, Garamond, Georgia, serif; letter-spacing: 0.06em; display: block; font-size: 188%; }
.l-ank ul li a .st em { font-size: 113%; font-weight: 900; letter-spacing: 0.28em; display: block; line-height: 1.6; }

.l-kura { padding: 135px 0 70px; position: relative; margin-bottom: 150px; }
.l-kura::before { content: ''; width: 202.10526%; height: 100%; display: block; position: absolute; left: -63.68421%; top: 0; background: url(../../rooms/images/bg_kura.jpg) no-repeat center top/cover; z-index: -1; }
.l-kura h4 { width: 155px; margin: 0 auto 140px; }
.l-kura .b-pho { position: relative; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: space-between; justify-content: space-between; }
.l-kura .b-pho li:nth-child(1) { width: 47.36842%; position: relative; }
.l-kura .b-pho li:nth-child(1)::before { content: ''; width: 411px; height: 80px; display: block; position: absolute; bottom: 0; right: 0; background: #312522; z-index: 1; }
.l-kura .b-pho li:nth-child(1) .ic1 { width: 50%; position: absolute; left: -23.77778%; top: -21.89142%; z-index: 1; }
.l-kura .b-pho li:nth-child(2) { width: 37.89474%; position: relative; }
.l-kura .b-pho li:nth-child(2) .img2 { width: 81.94444%; position: absolute; left: -27.77778%; top: -76.92308%; }
.l-kura .b-pho li:nth-child(2) .ic2 { width: 50.27778%; position: absolute; left: 82.77778%; top: 78.84615%; z-index: 1; }
.l-kura .b-pho li:nth-child(2) .ic3 { width: 64.44444%; position: absolute; left: 36.11111%; top: -142.30769%; z-index: 1; }
.l-kura .b-kura { display: -webkit-flex; display: flex; -webkit-align-items: flex-start; align-items: flex-start; -webkit-justify-content: flex-end; justify-content: flex-end; -moz-transform: translateY(-45px); -ms-transform: translateY(-45px); -webkit-transform: translateY(-45px); transform: translateY(-45px); position: relative; z-index: 2; }
.l-kura .b-kura .b-txt { width: 40%; position: relative; }
.l-kura .b-kura .b-txt .txt { color: #fff; white-space: nowrap; margin: 25px 0; }
.l-kura .b-kura .b-txt table th { width: 32.14286%; padding-left: 1em; }
.l-kura .b-kura .b-txt .btns { overflow: hidden; margin-top: 30px; }
.l-kura .b-kura .b-txt .btns li { width: 48.68421%; }
.l-kura .b-kura .b-txt .btns li.b-02 { float: left; }
.l-kura .b-kura .b-txt .btns li.b-01 { float: right; }
.l-kura .b-kura .b-txt .btns li.b-01 a { background: #46302a; }
.l-kura .b-kura .b-txt .btns li.b-01 a:before { background: #fff; }
.l-kura .b-kura .b-txt .btns li.b-01 a span { color: #46302a; }
.l-kura .b-kura .b-txt .btns li.b-01 a:hover span { color: #fff; }
.l-kura .b-kura .lay { margin-left: 4.73684%; width: 47.89474%; }

.l-roo { position: relative; }
.l-roo h3 { text-align: center; margin-bottom: 50px; }
.l-roo .b-roo { margin-bottom: 120px; display: -webkit-flex; display: flex; -webkit-align-items: flex-start; align-items: flex-start; -webkit-flex-wrap: wrap; flex-wrap: wrap; position: relative; }
.l-roo .b-roo .pho { width: 100%; margin-bottom: 40px; }
.l-roo .b-roo .b-txt { width: 50%; }
.l-roo .b-roo .b-txt .txt { margin: 20px 0 25px; }
.l-roo .b-roo .b-txt .tbl_basic { width: 100%; }
.l-roo .b-roo .b-txt .tbl_basic th { width: 29.78723%; }
.l-roo .b-roo .b-txt .btns { overflow: hidden; max-width: 370px; margin-top: 40px; }
@media only screen and (min-width: 984px) { .l-roo .b-roo .b-txt .btns li.b-02 { float: left; width: 50%; } }
@media only screen and (min-width: 984px) { .l-roo .b-roo .b-txt .btns li.b-01 { float: right; width: 47.2973%; } }
.l-roo .b-roo .lay { width: 47.89474%; margin-left: 2.10526%; }
.l-roo .b-roo .ic, .l-roo .b-roo .ic1, .l-roo .b-roo .ic2 { position: absolute; z-index: -1; }
.l-roo .b-roo#niwa1 .ic { width: 232px; top: -160px; right: -200px; }
.l-roo .b-roo#niwa2 .ic, .l-roo .b-roo#koya2 .ic { width: 224px; top: -100px; left: -205px; }
.l-roo .b-roo#koya1 .ic { width: 232px; top: -100px; right: -200px; }
.l-roo .b-roo#koya3 .ic1 { width: 224px; top: -100px; right: -205px; }
.l-roo .b-roo#koya3 .ic2 { width: 232px; bottom: -100px; left: -200px; }

.l-conn { position: relative; padding: 80px 40px 60px; background: #fff; box-sizing: border-box; margin-top: 210px; margin-bottom: 160px; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: space-between; justify-content: space-between; }
.l-conn::before { content: ''; width: 0; height: 0; border-style: solid; border-width: 63px 147px 0 0; border-color: #efeae3 transparent transparent transparent; position: absolute; top: 0; left: 0; }
.l-conn::after { content: ''; width: 0; height: 0; border-style: solid; border-width: 0 0 63px 147px; border-color: transparent transparent #efeae3 transparent; position: absolute; bottom: 0; right: 0; }
.l-conn .bg { width: 202.10526%; height: 124%; display: block; position: absolute; top: -12%; left: -63.68421%; background: #efeae3; z-index: -1; }
.l-conn .pho { width: 47.12644%; }
.l-conn .b-conn { width: 48.27586%; }
.l-conn .ic1 { width: 150px; position: absolute; left: -105px; bottom: 30px; }
.l-conn .ic2 { width: 224px; position: absolute; right: -155px; top: 60px; }

.l-check { position: relative; }
.l-check .line_p:before { content: ''; width: 94.73684%; height: 1px; display: block; position: absolute; top: 0; right: 0; background: #c96a6a; }
.l-check .line_p::after { content: ''; width: 1px; height: 80.76923%; display: block; position: absolute; top: 0; right: 0; background: #c96a6a; }
.l-check .line_g:before { content: ''; width: 94.73684%; height: 1px; display: block; position: absolute; bottom: 0; left: 0; background: #828e94; }
.l-check .line_g::after { content: ''; width: 1px; height: 80.76923%; display: block; position: absolute; bottom: 0; left: 0; background: #828e94; }
.l-check .b-check { width: 52.87356%; }
.l-check .b-check h4 { margin-bottom: 35px; }
.l-check .b-check .b-01 { width: 220px; }
.l-check .b-check .b-01 a span:after { content: ""; margin-left: .3em; font-family: 'Font Awesome 6 Free'; font-weight: 900; }
.l-check .b-01 { width: 220px; position: absolute; left: 40px; bottom: 40px; }
.l-check .b-01 a span:after { content: ""; margin-left: .3em; font-family: 'Font Awesome 6 Free'; font-weight: 900; }
.l-check .pho { width: 44.82759%; }

.l-ov { background: #efeae3; margin-top: 90px; position: relative; padding: 60px 40px 70px; box-sizing: border-box; }
.l-ov::before { content: ''; width: 0; height: 0; border-style: solid; border-width: 63px 147px 0 0; border-color: #fff transparent transparent transparent; position: absolute; top: 0; left: 0; }
.l-ov::after { content: ''; width: 0; height: 0; border-style: solid; border-width: 0 0 63px 147px; border-color: transparent transparent #fff transparent; position: absolute; bottom: 0; right: 0; }
.l-ov h3 { text-align: center; }
.l-ov .img { margin: 45px auto; width: 91.95402%; }
.l-ov table { width: 100%; }
.l-ov table th { width: 17.81609%; }
.l-ov .ic { width: 23.57895%; position: absolute; top: 7.43243%; right: -13.15789%; z-index: 1; }