.menu .menu_box aside{ background:#D9CEC5; display:none; }
.menu .menu_box aside ul{ background:#D9CEC5; padding:24px 12px; display:flex; flex-direction:row; flex-wrap:wrap; gap:8px 36px; max-width:300px; margin:0 auto; }
.menu .menu_box aside ul li{ width:100%; }
.menu .menu_box aside ul li a{ display:block; width:100%; padding:8px 0;}
.menu .menu_box aside ul li a.btn.underline:before,.menu .menu_box aside ul li a.btn.underline:after{ height:1px; background:#AA8875; }
.menu .menu_box aside ul li a p{ margin-bottom:4px; line-height:1; }
.menu .menu_box aside ul li a p.en{ font-size:1.4rem; text-align:left; letter-spacing:0; color:#966E3F; padding:0; box-shadow:unset; width:100%;}
.menu .menu_box aside ul li a p.en:after{ position:absolute; left:unset; right:0; bottom:16px; font-size:.7em; }
.menu .fixedBar{ position:sticky; top:0; left:0; display:flex; flex-direction:row; justify-content:space-evenly; align-items:center; background:#F2F2F2; height:56px; z-index:88; }
.menu .fixedBar .btn{ font-size:clamp(1.8rem, 4.8vw, 2.4rem); letter-spacing:0;}
.menu hr.straight{ margin-top:64px; }
.menu .main_group .info{ padding:24px 20px; width:100%; max-width:700px; margin:0 auto; }
.menu .main_group .info p{ text-align:center; }
.menu .main_group .info p.big{ letter-spacing:0; }
/*.menu .main_group .info br{ display:none; }*/
.menu .main_group .title h2{ font-size:clamp(3.4rem, 8vw, 4.8rem); }
.menu .main_group .menu_list li{ width:100%; padding:12px 36px; }
.menu .main_group .menu_list figure{ position:relative; display:flex; align-items:flex-start; flex-direction:column; justify-content:center; }
.menu .main_group .menu_list .icon{ position:absolute; top:-24px; right:0; z-index:2; color:#EBEBEA; font-size:2rem; line-height:1.4; font-weight:500; width:90px; height:90px; border-radius:50% 50% 50% 0; display:flex; justify-content:center; align-items:center; } .menu .main_group .menu_list .icon.brown{ background:#A68C6D; }
.menu .main_group .menu_list .icon.green{ background:#4A584C; }
.menu .main_group .menu_list .icon.brown{ background:#A68C6D; }
.menu .main_group .menu_list .icon.gold{ background:#E5D2A2; color:#976D3F; }
.menu .main_group .menu_list .images_block{ width:75%; max-width:300px; margin:0 auto 24px; overflow:hidden; border-radius:150px;}
.menu .main_group .menu_list .images_block img{ transition:all .6s ease-out; } 
.menu .main_group .menu_list .images_block.slick-slider{ overflow:unset; }
.menu .main_group .menu_list .images_block.slick-slider .slick-list{ overflow:hidden; border-radius:150px; }
.menu .main_group .menu_list .images_block.slick-slider .slick-dots{ position:absolute; bottom:-24px; width:100%; }
.menu .main_group .menu_list .images_block.slick-slider .slick-dots li{ width:auto; padding:0; }
.menu .main_group .menu_list a:hover .images_block img{ transform:scale(1.1);  } 
.menu .main_group .menu_list figcaption{ display:flex; align-items:flex-start; flex-direction:column; text-align:left; width:100%; }
.menu .main_group .menu_list figcaption .title{ display:flex; align-items:flex-start; flex-direction:column; text-align:left; gap:8px; margin-bottom:16px;}
.menu .main_group .menu_list figcaption .title > *{ margin-bottom:0; }
.menu .main_group .menu_list figcaption .title h3{ font-size:clamp(2.8rem, 7vw, 3.4rem); }
.menu .main_group .menu_list figcaption .title h3.en{ font-size:1.8rem; }
.menu .main_group .menu_list figcaption .title h3 .icon_group{ display:inline-block; font-size:.6em; }
.menu .main_group .menu_list figcaption p.small{ font-size:clamp(1.2rem, 4.2vw, 1.4rem); }
.menu .main_group .menu_list figcaption .btn_group{ display:flex; gap:0 16px; }
.menu .main_group .menu_list figcaption .btn_group.column{ flex-direction:column; align-items:flex-start; } 
/*.menu .main_group .menu_list figcaption .btn{ margin-top:16px; }*/
.menu .main_group{ width:100%; max-width:986px; background:top repeat-y; background-size:100% auto; padding-bottom:48px;}
.menu .main_group .note_block{ margin:48px 1em 0 2em; text-align:left; font-size:1.6rem; list-style:disc; }

.menu.reserveBar .main_group{ background-image:url(../images/reserveBar/main_group_bg.jpg);}
.menu.reserveBar .main_group .info{ max-width:900px;  }
.menu.reserveBar .main_group .info p{ text-align:justify; }

.menu.mixologyBar .main_group{ background-image:url(../images/mixologyBar/main_group_bg.jpg);}
/*.menu.mixologyBar .main_group .info p.big br{ display:none; }*/
.menu.teavanaBar .main_group{ background-image:url(../images/teavanaBar/main_group_bg.jpg);}
/*.menu.teavanaBar .main_group .info p.big br{ display:none; }*/
.menu.bakery .main_group{ background-image:url(../images/bakery/main_group_bg.jpg);}

.menu .pdf_group{ width:100%; max-width:986px; }
.menu .pdf_group img.cover,.menu .pdf_group img.border-bottom{ border-bottom:solid 2px transparent; }


.menu.retail{ padding-bottom:80px; }
.menu.retail hr.straight{ position:relative; width:1px; height:120px; margin:0 auto; transform-origin:top; border:0; background:#3D3935; margin-top:80px; overflow:clip; }
.menu.retail .fixedBar{ flex-wrap:wrap; justify-content:center; gap:16px; height:auto; padding:8px 0 12px; }
.menu.retail .product_group{ margin-bottom:80px; }
.menu.retail .product_group .light .figcaption{ color:#3D3935; }
.menu.retail .product_group .dark .figcaption{ color:#fff; }
.menu.retail .product_group figure.info figcaption{ padding:32px 30px 32px 20px; margin:auto; }
.menu.retail .product_group figure.info figcaption h2{ margin-bottom:24px; }
.menu.retail .product_group figure.info figcaption h4{ font-size:clamp(1.8rem, 4vw, 2.4rem); font-weight:500; margin-bottom:0; }
.menu.retail .product_group .title{ padding:32px 30px 32px 20px; margin:auto; max-width:670px; text-align:center; }
.menu.retail .product_group .title h3{ font-size:clamp(2rem, 6vw, 3.8rem); margin-bottom:.2em; }
.menu.retail .product_group .title .for_mobile{ display:block; }
.menu.retail .product_group .title .for_pc{ display:none; }
.menu.retail .product_group .product_list{ display:flex; flex-wrap:wrap; justify-content:center; align-items:stretch; gap:40px 44px; }
.menu.retail .product_group .product_list + .product_list{ margin-top:40px; }
.menu.retail .product_group .product_list > li{ width:260px; }
.menu.retail .product_group .product_list > li > a{ width:100%; height:100%; }
.menu.retail .product_group .product_list figure{ height:100%; border:solid 1px #D9CEC5; border-radius:8px; overflow:clip; display:flex; flex-direction:column; text-align:left; box-shadow:4px 4px 0 0 #fff, 4px 4px 0 1px #d9cfc5; transition:all .6s ease;}
.menu.retail .product_group .product_list figure .image_block{ pointer-events:none; }
.menu.retail .product_group .product_list figure figcaption{ position:relative; padding:16px 12px 24px; flex:auto; }
.menu.retail .product_group .product_list figure figcaption h4{ font-size:clamp(1.6rem, 4vw, 2rem); font-weight:400; margin:0; line-height:1.4;}
.menu.retail .product_group .product_list figure figcaption .btn{ font-size:1.4rem; background:#976D3F; color:#fff; border-radius:1.5em; padding:.4em .7em; line-height:0; position:absolute; right:0; bottom:24px;}
.menu.retail .product_group .product_list > li > a:hover figure{ transform:translate(4px,4px); box-shadow:0 0 0 0 transparent; }
.menu.retail .product_group .extra{ width:90%; max-width:1020px; margin:0 auto 36px; }
.menu.retail .product_group .extra figure{ width:100%; padding:2px; border-radius:161px 161px 28px 28px; overflow:clip; }
.menu.retail .product_group .extra figure .images_block{ width:100%; max-width:412px; background:#fff; border-radius:161px 161px 12px 12px; overflow:clip;} 
.menu.retail .product_group .extra figure .images_block img{ width:100%; aspect-ratio:412 / 312; object-fit:scale-down; }
.menu.retail .product_group .extra figure figcaption{ padding:24px 16px; text-align:left; }
.menu.retail .product_group .extra figure figcaption h4{ font-size:clamp(2rem, 6.4vw, 2.4rem); font-weight:500; margin:0; line-height:1.4; }
.menu.retail .product_group .extra figure figcaption h4.en{ font-size:clamp(1.6rem, 4vw, 2rem); margin-bottom:12px;  }
.menu.retail .product_group .extra figure figcaption p{ margin-bottom:0;  }
.menu.retail .product_group .extra figure figcaption .btn{ margin-top:16px;  }
.menu.retail .berbrick .starting{ background:url(../images/retail/berbrick/starting_bg.png); background-size:cover; color:#E5D2A2; }
.menu.retail .berbrick .starting hr.straight{ margin-top:unset; background:#E5D2A2; }
.menu.retail .berbrick .starting .title{ padding-bottom:unset; }
.menu.retail .berbrick .starting p{ text-align:center; }
.menu.retail .berbrick .images_block{ position:relative; overflow:clip;}
.menu.retail .berbrick .images_block .logo{ position:absolute;  } 
.menu.retail .berbrick .images_block .copyright{ position:absolute; bottom:12px; right:16px; width:308px; max-width:calc(100% - 32px); } 
.menu.retail .berbrick .images_block .kv img{ width:100%; object-fit:cover; }
.menu.retail .berbrick .point_list{ display:flex; flex-direction:column; gap:48px; }
.menu.retail .berbrick .point_list li figure figcaption{ position:relative; padding:48px 30px 0 20px; margin:0 8px; max-width:358px; box-sizing:content-box; /*background:#FFFFFFCC; border-radius:40px;*/ } 
.menu.retail .berbrick .point_list li figure figcaption:before{ content:''; position: absolute; top:0; left:0; display:block; width:47%; padding-top:50%; border-radius:40px 0 0 0; border:solid 1px #EDBAAD; border-right:none; border-bottom:none; }
.menu.retail .berbrick .point_list li figure figcaption .title{ padding:0; text-align:left; gap:4px; margin-bottom:12px; }
.menu.retail .berbrick .point_list li figure figcaption .title h3{ margin-bottom:0; font-size:clamp(1.4rem, 5.3vw, 2.4rem); letter-spacing:0.03em; font-weight:500;} 
.menu.retail .berbrick .point_list li figure figcaption .title h4{ margin-bottom:0; font-size:clamp(1.4rem, 4vw, 1.8rem); font-weight:400; }
.menu.retail .berbrick .point_list li figure figcaption p{ font-size:clamp(1.4rem, 3.8vw, 1.8rem); }
.menu.retail .berbrick .point_list li figure figcaption h5{ font-size:clamp(1.2rem, 3.2vw, 1.4rem); text-align:left; line-height:1.4; }
.menu.retail .berbrick .point_list li figure figcaption .btn_group{ text-align:left; margin:16px 0; }
.menu.retail .berbrick .point_list li figure .images_rmbg{ width:150px; margin:24px auto -24px; z-index:2; overflow:clip; } 
.menu.retail .berbrick .point_list li figure .images_rmbg img{ width:100%; height:auto; }
.menu.retail .berbrick .point_list li > div{ display:flex; flex-wrap:wrap; align-items:center; }
.menu.retail .berbrick .point_list li .images_group{ width:75%; margin-right:40px; margin-left:auto; } 
.menu.retail .berbrick .point_list li .images_group > div{ max-width:490px; width:calc(100% - 42px); aspect-ratio:245/164; overflow:clip; }
.menu.retail .berbrick .point_list li:nth-of-type(3) .images_group > div{ aspect-ratio:unset; width:254px;} 
.menu.retail .berbrick .point_list li .images_group > div img{ width:100%; height:100%; object-fit:cover; }
.menu.retail .berbrick .point_list li .images_group > div:nth-of-type(2){ margin-top:10px; margin-left:42px; }
.menu.retail .berbrick .point_list li:nth-of-type(1) figure figcaption .title{ color:#963002; }
.menu.retail .berbrick .point_list li:nth-of-type(3) figure .images_rmbg{ width:105px; } 
.menu.retail .berbrick .video_bg{ aspect-ratio:16 / 9; margin:auto; }
.menu.retail .berbrick .video_container{ max-width:unset;}


/* 直式 */
@media (orientation:portrait){
.menu.retail .berbrick{ display:flex ; flex-direction:column; }
.menu.retail .berbrick .video_bg{ width:100%; height:auto; }
.menu.retail .berbrick .video_bg ,.menu.retail .berbrick .point_list{ order:1; }
.menu.retail .berbrick .starting{ padding:16px 0 36px; }
.menu.retail .berbrick .starting .straight{ display:none; }
.menu.retail .berbrick .images_block .logo{ max-width:44%; top:4%; left:28%; } 
.menu.retail .berbrick .images_block .kv img{ height:140vw;  }

}

/* 橫式 */
@media (orientation:landscape){
.menu.retail .berbrick .starting{ padding:36px 0 16px; }
.menu.retail .berbrick .video_bg{ width:auto; height:calc(var(--vh, 1vh) * 100 - 56px); }
.menu.retail .berbrick .images_block{ margin-bottom:48px;}
/*.menu.retail .berbrick .images_block .kv img{  height:100vh;  }*/
.menu.retail .berbrick .images_block .kv img{ height:calc(var(--vh, 1vh) * 100 - 56px); }
.menu.retail .berbrick .images_block .logo{ width:244px; bottom:12px; left:16px; }

}
/* lg applies to medium devices (tablets, less than 992px) */
@media (min-width:991.98px) { 
.menu .fixedBar{ justify-content:center; gap:64px; }
.menu.retail .fixedBar{ gap:24px; }
.menu .main_group .kv img{ width:100%; height:407.5px; object-fit:cover; } 
.menu .main_group .info br{ display:block; }
.menu .menu_box aside{ position:sticky; top:56px; z-index:88; display:block;}
.menu .menu_box aside ul{ max-width:unset; padding:24px 36px; box-shadow:0 4px 4px #5e564d3d;}
.menu .menu_box aside ul li{ flex:1 1 auto; width:auto;}
.menu .main_group .menu_list{ margin-left:132px; border-left:solid 1px #3D3935 }
.menu .main_group .menu_list figure{ flex-direction:row-reverse; align-items:center; gap:48px;  } 
.menu .main_group .menu_list li:nth-of-type(even) figure{ flex-direction:row; }
.menu .main_group .menu_list .images_block{ flex:0 0 300px; }
.menu .main_group .menu_list .icon{ position:absolute; top:0; left:-37px; transform:translateX(-100%); border-radius:50% 50% 0 50%;}
.menu.reserveBar .main_group .note_block{ margin:48px 1em 0 74px;}
.menu.reserveBar .main_group .info p{ text-align:left; }
.menu.mixologyBar .main_group .info p.big br{ display:block; }
.menu.teavanaBar .main_group .info p.big br{ display:block; }

.menu.retail .product_group .title p{ text-align:center; }
.menu.retail .product_group .title .for_mobile{ display:none; }
.menu.retail .product_group .title .for_pc{ display:block; }
.menu.retail .product_group figure.info{ display:flex; align-items:center; }
.menu.retail .product_group figure.info .images_block{ flex:0 0 50%; }
.menu.retail .product_group figure.info figcaption{ padding:32px 20px; }
.menu.retail .product_group .extra figure{ display:flex; border-radius:161px 161px 161px 0; align-items:center; }
.menu.retail .product_group .extra figure .images_block{ border-radius:161px 161px 161px 0; } 
.menu.retail .product_group .extra figure figcaption{ /*width:412px;*/ text-align:left; }
/*.menu.retail .product_group .extra figure figcaption .btn{ position:absolute; right:0;}*/

.menu.retail .berbrick .point_list li figure figcaption{ padding:60px 36px; margin:unset; } 
.menu.retail .berbrick .point_list li figure figcaption .title{ gap:8px; }
.menu.retail .berbrick .point_list li .images_group{ width:40%; margin:unset;} 
.menu.retail .berbrick .point_list li .images_group > div:nth-of-type(2){ margin-top:30px; }
.menu.retail .berbrick .point_list li a{ justify-content: center; }
.menu.retail .berbrick .point_list li:nth-of-type(2) a{ flex-direction:row-reverse; }
.menu.retail .berbrick .point_list li figure figcaption .btn_group{ text-align:right; margin:0; }
}

/* xl applies to large devices (desktops, less than 1200px) */
@media (min-width: 1199.98px) { 
.menu .fixedBar{ margin-bottom:8px; }
.menu.retail .fixedBar{ gap:24px 64px; }
.menu .menu_box{ display:flex; justify-content:center; padding:0 20px; margin-left:-82px;} 
.menu .menu_box aside{ background:unset; }
.menu .menu_box aside ul{ width:210px; padding:24px 12px; flex-direction:column; box-shadow:unset; position:sticky; top:56px;}

.menu.retail .berbrick .point_list li > div{ width:100%; justify-content:space-between;}
.menu.retail .berbrick .point_list li:nth-of-type(even) > div{ flex-direction:row-reverse; }
.menu.retail .berbrick .point_list li figure{ display:flex; align-items:center; width:60vw; }
.menu.retail .berbrick .point_list li figure .images_rmbg{ width:unset; max-width:350px; }
.menu.retail .berbrick .point_list li .images_group{ width:35vw; }
.menu.retail .product_group figure.info figcaption h4 br{ display:none; }
.menu.retail .product_group .extra figure figcaption p br{ display:none; }





/* xxl applies to x-large devices (large desktops, less than 1400px) */
@media (min-width: 1399.98px) {
.menu.retail .berbrick .point_list li > div{ justify-content:center; gap:22px;}
.menu.retail .berbrick .point_list li figure{ width:unset; }


 }