@import url('https://fonts.googleapis.com/css2?family=Archivo+Black&family=Noto+Sans+TC:wght@300;400;500;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@300;400;500;700;900&display=swap');

/* import bootstrap-icons-1.5.0 */
@import url(../fontawesome/css/all.css);
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.2/font/bootstrap-icons.css");


html, body {font-family: 'Roboto','微軟正黑體', 'Archivo Black',sans-serif, 'Lao UI', Geneva, Tahoma, Verdana, Arial,Lato !important;}
.no-focus-outline a:focus,.no-focus-outline button:focus {outline: none !important;}
.btn.focus, .btn:focus, input,select,label,textarea {outline: 0;box-shadow: 0 0 0 0rem rgba(0,123,255,0) !important;}
input:-internal-autofill-selected {background-color: rgba(255, 255, 255,0) !important;}
input:-webkit-autofill,input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active{-webkit-box-shadow: 0 0 0 0 transparent !important;}
:root {
	--bs-hcolor-a:#492620;
	--bs-hcolor-b:#DC5513;
	--bs-hcolor-a-rgb: 73, 38, 32;
	--bs-hcolor-b-rgb: 220, 85, 19;
	--bs-gocolor:#ff4081;
	--bs-gocolor-rgba:255,64,129;
}
a {color:var(--bs-hcolor-a);}
.bg-light {background-color:#ffffff !important;z-index:9999 !important;top: 0;right: 0;left: 0;}
.navbar-brand {margin:0 auto;}
.navbar-brand img {width:15rem;margin:0;}
footer {padding-bottom:1rem;}
.col-foot {height:100px;font-size:0.8rem;padding-top:1rem;}
.col-foot a, .col-foot a:link {color:var(--bs-hcolor-a);text-decoration: none;}
.col-foot a:hover {text-decoration:underline;}
footer.bg-foot {padding-top:5rem;background-color:#ffffff;position:relative;}

.col-foots {font-size:0.8rem;padding-top:1rem;}
.col-foots a, .col-foot a:link {color:var(--bs-hcolor-a);text-decoration: none;}
.col-foots a:hover {text-decoration:underline;}
.smlink a {display:inline-block;padding:0 0.3rem;}
.smlink img {width:40px;}
.smlink .addline img {width:auto;}

.cookiealert.show {opacity: 1;transform: translateY(0%);transition-delay: 1000ms;}
.cookiealert {position: fixed;bottom: 0;left: 0;width: 100%;padding: 2rem 0;margin: 0 !important;z-index: 999;opacity: 0;border-radius: 0;background:var(--bs-hcolor-a);transform: translateY(100%);transition: all 500ms ease-out;transition-delay: 0s;color: #ecf0f1;}
.cookiealert .acceptcookies {margin-left: 10px;vertical-align: baseline;}
.cookiealert a {color: #ffffff;text-decoration: underline;}
.btn-cook {color:#000000;background-color:#F2B600;border: 0 solid transparent !important;border-radius: 5rem;}
.btn-cook:hover {color: #fff;background-color:#DC5513;border:0 !important;}

.display-none{visibility:hidden;}

.xxx {border:1px solid #ff0000;}

/* 入口網頁開始 ================================ */
.luxury-portal {display: flex;height: 60vh;overflow: hidden;}

/* 單一 panel ================================ */
.panel {position: relative;flex-grow: 1;overflow: hidden;text-decoration: none;color: inherit;transition: flex-grow 0.9s cubic-bezier(.25,.8,.25,1);}

/* 背景圖 ================================ */
.panel-bg {position: absolute;inset: 0;background-image: var(--bg-image);background-size: cover;background-position: center;transform: scale(2.1);transition: transform 1.2s ease;filter: brightness(0.6);}

.luxury-portal:hover .panel-bg,.luxury-portal:hover .panel-title {filter: brightness(0.4);}
.bg-1 {background-image: url(../images/temp-bg-1.jpg);background-position: 0rem 3rem;}
.bg-2 {background-image: url(../images/temp-bg-2.jpg);background-position:-5rem 7rem;}
.bg-3 {background-image: url(../images/temp-bg-3.jpg);background-position: 3rem 5rem;}

/* 標題（右上直排）================================ */
.panel-title {position: absolute;top: 40px;right: 40px;z-index: 2;writing-mode: vertical-rl;text-orientation: upright;font-size: 2.5rem; /* 約 40pt */font-weight: 900;letter-spacing: 0.15em;color: #ffffff;transition: transform 0.5s ease;}

/* Hover 互斥伸縮（核心）================================ */
.luxury-portal:hover .panel {flex-grow: 1;}
.luxury-portal .panel:hover {flex-grow: 3;}
.luxury-portal .panel:hover .panel-bg {transform: scale(1);filter: brightness(1);background-position: center !important;}
.luxury-portal .panel:hover .panel-title {top: 80px;right: 40px;transform: scale(1.3);filter: brightness(1);/* color: #dc5513; */color: #ffffff;text-shadow: 0 3px 12px rgba(0,0,0,0.75), 0 0 4px rgba(0,0,0,0.95);}
.luxury-portal .panel:hover .bg-2 {background-position:0 -2rem !important;}
/* 手機版 ================================ */
@media (max-width: 767.999px) {
.luxury-portal {flex-direction: column;height: auto;}
.luxury-portal .panel {flex-grow: 1;height: 33vh;}
.luxury-portal:hover .panel,.panel:hover {flex-grow: 3;}
.panel-bg {transform: scale(1);}
.bg-1,.bg-2,.bg-3 {background-position: center !important;}
.panel-title {writing-mode: horizontal-tb !important;font-size: 1.6rem;letter-spacing: 0.2em !important;top: 50% !important;left: 50% !important;right: auto !important;bottom: auto !important;transform: translate(-50%, -50%) !important;text-align: center !important;width:100% !important;}
}



/* Small devices (landscape phones, 100px and up) */
@media (max-width: 767.999px) {
	.navbar-brand img {width:15rem;}


}/* END Small devices */

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px){
}/* END Medium devices */

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px){

}/* END Large devices */

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {

}/* END Extra large devices */