:root{
	--main-color:#f87105;/*橘*/
	--main-color2:#f87105ee;
	
	--main-light-color:#fe9412;
	--main-light-color2:#fe9412dd;
	--main-light-color3:#fe941244;
	
	--main-daker-color:#F06400;
	--header-first-height:40px;
}
html,body{
	color:#555;
	font-size: 16px;
	font-family: "Microsoft YaHei","Noto Sans TC","思源黑體","Helvetica", "Arial","LiHei Pro", sans-serif;
	height:100%;
	margin: 0;
	padding: 0;
	background-color:#E7E1D1;
	background-repeat:no-repeat;
	background-attachment: fixed;
	background-position:top left;
	background-size: cover;
	background-image:url('../../../img/chinese/lobby/bg.png');

		
}
a:link,a:visited,a:hover,a:active{
	color:var(--main-daker-color);
	text-decoration:none;
}
a:hover{color:var(--main-light-color);}
.filter-white{filter:brightness(0) invert(1);}
/* .wrap -> .main -> .header */

.header{
	color:#fff;
	width:100%;
	text-align: center;
	/*height:45px;
	font-weight:bold;*/
	/*background-color:var(--main-color);*/
	background:         linear-gradient(var(--main-color2), var(--main-light-color2));

}
.headerButton{
	width:var(--header-first-height);
	height:var(--header-first-height);
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-size: 30px 30px;
	line-height:var(--header-first-height);
}
.headerButton img{
	height:100%;
}
.header .leftButton,
.header #btn_home{
	position: absolute;left:0;top:0;
}

.headerCenter{
	font-size: 1.2rem;
	height:var(--header-first-height);
	line-height:calc(var(--header-first-height) + 0.2rem);
    margin: auto;
	color:#fff;
	letter-spacing: 0.1rem;
}
.header .rightButton,
.header #headerMenu{
	position: absolute;right:0;top:0;
}
#headerMenu .dropdown-menu {
	background-color: #f87105;
	border:2px solid var(--main-light-color);
	min-width:2rem;
	border-radius:0.3rem;
	transition: 0.2s ease-out;
	transform:scale(0.5);
	transition-timing-function: cubic-bezier(.4,.9,.5,1.5);
	
}
#headerMenu #dropdownMenuLink {
	height:var(--header-first-height);
	display:inline-block;

}
#headerMenu #dropdownMenuLink img{
		padding:0.2rem 0.5rem;
		 height:100%;
}
#headerMenu .dropdown-item{padding:.25rem .2rem}
#headerMenu .dropdown-item>img{height:28px;}
#headerMenu .dropdown-item:hover,
#headerMenu .dropdown-item:focus {
background-color: #fe9412; 
}

.wrap{
    min-height: 100%;/*置底用*/
	contain: paint;/*超出畫面不顯示*/
}
.wrap .main{
	padding-bottom:0px;/*置底的高*/
}

/* .wrap -> .footer */
.footer{
}



/*--表單--*/
input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus, 
input:-webkit-autofill:active{
	-webkit-box-shadow: 0 0 0 30px #F6F6F6 inset !important;
	border-color:#ddd;
}
.form-control{
	background-color:#ffffffcc;  
	border-color:#ddd;
	border-radius:5rem;	
	padding:.5rem .75rem
}
.popup .form-control{background-color:#F6F6F6;  }
.form-control:focus{
	background-color:#FCE4D3; 
	border-color:#ddd;
	box-shadow: inset 0 0 0 .25rem #FFDEC3;
}
.form-check-input[type=checkbox]{border-radius:1rem;border-color:var(--main-color);}
.form-check-input:focus{box-shadow: 0 0 0 .25rem #FFDEC3;}
.form-check-input:checked{background-color:var(--main-color);}

/*--跑馬燈--*/
.marqueeArea{
	width:100%;
	margin-left:auto;
	margin-right:auto;
	color:#fff;
	background:rgba(255,255,255,0.1);
}
.marqueeArea marquee{
line-height:20px;
font-size:0.9rem;
width:calc(100% - 30px);margin:0;padding:0;
vertical-align:text-bottom;
}
.marqueeArea img{height:20px;vertical-align:text-bottom;}
/*--按鈕--*/
.btn-primary{
	
	--bs-btn-active-shadow:;
	border:0 !important;
}
.btn-danger{
	--bs-btn-bg:#E00000;
	--bs-btn-border-color:;
	--bs-btn-active-bg:#EB4656;
	--bs-btn-active-border-color:;
	--bs-btn-hover-bg:#EB4656;
	--bs-btn-hover-border-color:;
	--bs-btn-active-shadow:;
	border:0 !important;
}
/*登入按鈕區*/
.user-hello {display:inline-block;overflow:hidden;font-size:0; border-radius:999rem;}
.user-hello>*{font-size:0.8rem;height:1.6rem;line-height:1.6rem;display:inline-block;vertical-align:text-bottom;}
.user-hello>span{color:var(--main-color);padding:0rem 0.6rem;}
.user-hello>span:nth-of-type(1){padding:0rem 0.6rem 0rem 1rem;}
.user-hello>a{padding:0.1rem 0.3rem;}
.user-hello>a:nth-last-of-type(1){padding:0.1rem 0.5rem 0.1rem 0.3rem;}
.user-hello>a img{height:100%;}
.user-hello .user-credit{position: relative;padding-left:1.5rem;}
.user-hello .user-credit::before {
	position: absolute;
	top:18%;
	left:0.2rem;
	background-size: contain;
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxZW0iIGhlaWdodD0iMWVtIiB2aWV3Qm94PSIwIDAgMTQgMTQiPjxnIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2Y4NzEwNSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2Utd2lkdGg9IjEiPjxwYXRoIGQ9Ik05IDcuNWMyLjQ4NSAwIDQuNS0uODk1IDQuNS0ycy0yLjAxNS0yLTQuNS0ycy00LjUuODk1LTQuNSAyczIuMDE1IDIgNC41IDIiLz48cGF0aCBkPSJNNC41IDUuNXY2YzAgMS4xIDIgMiA0LjUgMnM0LjUtLjkgNC41LTJ2LTYiLz48cGF0aCBkPSJNMTMuNSA4LjVjMCAxLjEtMiAyLTQuNSAycy00LjUtLjktNC41LTJtNC40LTYuOTkxYTYuNzcgNi43NyAwIDAgMC0zLjktMWMtMi40OSAwLTQuNS45LTQuNSAyYzAgLjU5LjU4IDEuMTIgMS41IDEuNSIvPjxwYXRoIGQ9Ik0yIDEwLjAwOWMtLjkyLS4zOC0xLjUtLjkxLTEuNS0xLjV2LTYiLz48cGF0aCBkPSJNMiA3LjAwOWMtLjkyLS4zOC0xLjUtLjkxLTEuNS0xLjUiLz48L2c+PC9zdmc+");
	display: inline-block;
	width: 1rem;
	height: 1rem;
	content:"";
}
/*--toastr v2.1.4 ( toastr.min.js )--*/
#toast-container ,#toast-container *{pointer-events: none !important;}
#toast-container{position: fixed ; top:35%;left: 50%;transform: translate(-50%, 0%); z-index:999999;width:100%; }
#toast-container>div{
	position:relative;background:none;box-shadow:none;border:0;
	margin:0 0 0.6em;color:#FFF;font-size:1rem;text-align:center;width:100%;
}
.toast-error .toast-message{background-color:#C00000bb}
.toast-info .toast-message{background-color:#000000aa}
.toast-message{display:inline-block;padding:0.4em 1.5em;border-radius:0.4rem;}
/*-- --*/
.area-round{border-radius:0.3rem;}
.area-top-round{border-top-left-radius:0.3rem;border-top-right-radius:0.3rem;}
.area-item-round:nth-last-of-type(1){border-bottom-left-radius:0.3rem;border-bottom-right-radius:0.3rem;}
.area-top-bg{background: linear-gradient(to left,var(--main-color2), var(--main-light-color2));color: #fff;}
.area-bg{background-color:rgba(255, 255, 255, 0.65);}
.area-max{max-width:576px;margin-left:auto;margin-right:auto;}
.pos-relative{position: relative;}
.pos-absolute{position: absolute;right:0;}
@media screen and (max-width: 575px) {
	.area-round,.area-top-round{border-radius:0rem;}
	.data-container >hr.invisible:not(.fixed){display:none;}
	.container{--bs-gutter-x:0;}
}
.container{max-width:950px;}