@import url('../css/_icon.css'); /* v20260325 */
:root {
--bs-Dark-blue:#000735;
--bs-Dark-blue-rgb:0,7,53;
--bs-Original-blue:#00479d;
--bs-Original-blue-rgb:0,71,157;
--bs-light-blue:#e9f8ff;
--bs-gold:#b28600;
--bs-claret:#9b0042;
--bs-green:#005e15;
--bs-white:#ffffff;
--bs-black:#000000;
--bs-Magenta:#ff00ff;
--bs-Magenta-rgb:255,0,255;
--bs-Blue:#0000ff;
--bs-green:#008000;
--bs-Orange:#FF7300;
--bs-Orange-rgb:255,115,0;
--bs-light-grey:#dee2e6;
--bs-grey50:#a0a0a0;
--bs-gold-rgb:178,134,0;
--bs-claret-rgb:155,0,66;
--bs-white-rgb:255,255,255;
--bs-black-rgb:0,0,0;
--bs-green-rgb:0,128,0;
--bs-Creamy-Yellow:#FFF8CA;
--bs-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.3);
--bs-box-shadow-sm: 0 0.125rem 0.5rem rgba(0, 0, 0, 0.3);
--bs-gradient-gb: linear-gradient(180deg, var(--bs-gold), var(--bs-Dark-blue) 100%);
--bs-gradient-bb: linear-gradient(180deg, var(--bs-Original-blue), var(--bs-Dark-blue) 100%);
}
@media (prefers-color-scheme: dark) {/* 如果是夜晚模式，文字黑色，背景是白色 */ :root {--text-color: #000000;--bg-color: #ffffff;}}

body, html{font-family:'微軟正黑體','Source Sans Pro', sans-serif, Lao UI, Geneva, Tahoma, Verdana, Arial,Lato !important;  height: 100%; overflow-x: hidden; /* 避免水平超出 */ background:var(--bs-Dark-blue);padding-top: env(safe-area-inset-top, 0px);}
.btn,.btn:hover,.btn-check + .btn:hover ,.btn:focus-visible ,.btn-check:focus-visible + .btn ,.btn-check:checked + .btn,:not(.btn-check) + .btn:active,.btn:first-child:active,.btn.active,.btn.show {border-color:transparent;text-decoration: none;}
a, a:link ,a:visited, a:hover, a:active {text-decoration: none;}
/* 行距 */
*{line-height:1;}
.modal .modalqr-txt * , .col-course *, .col-Rules * ,.overview-slide * , .col-store-list .list-group-item *,.col-store-info *, .cmg-box *,.cmg-setbox *, .cmg-box-list *, .col-sysmessage *, .col-myaccount *, .col-register *,.txt-lh {line-height:1.5;}
.col-teacherinfo * {line-height:2;}
.contbody {background:var(--bs-white);padding-bottom:6rem;height:100%;}
.fc-gold {color:var(--bs-gold) !important;}
.fc-Claret {color:var(--bs-claret) !important;}
.fc-white {color:var(--bs-white) !important;}
.fc-black {color:var(--bs-black) !important;}
.fc-red {color:red;}
.fls-1 {letter-spacing:1rem;}
.fls-03 {letter-spacing:0.3rem;}
.fls-0 {letter-spacing:0;}
.pt-6r {padding-top:6rem !important;}
.pt-4r {padding-top:4rem !important;}
.pt-3r {padding-top:3rem !important;}

/* align */
.vh-c{display: flex !important;align-items: center !important;}

/* 通用格式 */
.col-page h4 {font-size:1.8rem;}
.col-page p {line-height:1.5;}

/* footer 主選單 */
.footer .footnav .col-auto {padding:0 0.7rem;}
.footer {background-color:rgba(var(--bs-Dark-blue-rgb), 1);padding:0.8rem 0;}
.footer .footnav .btn{width:3.2rem;height:3.2rem;padding:0;font-size:0.8rem;color:var(--bs-white);text-align:center;background:transparent;border-radius: 3rem;border:0.2rem solid var(--bs-Dark-blue);line-height: 1.5;}
.footer .footnav a {padding-top:0.35rem !important;}
.footer .footnav .btn span {display:block;margin-top:0.1rem;}
.footer .footnav .btn.active {border:0.2rem solid var(--bs-gold);padding:0 !important;display: inline-flex !important;justify-content: center !important;}
.footer .footnav .btn.active .infcon {margin-top:0.6rem;}
.footer .footnav .btn.active span {display:none;}

/* footer */
.footer .btn{font-size:0.8rem;color:var(--bs-white);text-align:center;background:transparent;border-radius: 3rem;border:0.2rem solid var(--bs-Dark-blue);line-height: 1.5;}
.footer-goldbg {background-color:rgba(var(--bs-gold-rgb), 1);}
.footer-goldbg .btn,.footer-nonebg .btn {border:0;}
.footer-nonebg {background:transparent !important;}

/* 密碼切換 */
.password-container {position: relative;}
.password-container input {width: 100%;padding: 8px 35px 8px 10px;font-size: 16px;}
.toggle-password {position: absolute;right: 10px;top: 50%;transform: translateY(-50%);cursor: pointer;color:var(--bs-block);width:2rem;height:2rem;}
.toggle-password:hover {color:var(--bs-block);/* color: #007bff; */}

/* Button */
.btn-xclose {font-size:1.5rem;color:var(--bs-gold);border:0;padding:0;background:transparent;}
.btn {background-color:var(--bs-Dark-blue);color:var(--bs-Creamy-Yellow);font-size:1.2rem;}
.btn-go,.btn-go:link,.btn-go:hover,.btn-go:active,.btn-go:visited {font-size:1.5rem;color:var(--bs-gold);border:0;padding:0;background-color:transparent;}
.btn-go-a,.btn-go-a:link,.btn-go-a:hover,.btn-go-a:active,.btn-go-a:visited {background-color:var(--bs-gold);color:var(--bs-white);text-align:center;width:100%;padding:1rem 0;font-size:1.5rem;font-weight:900;letter-spacing:1rem;}
.btn-go-b,.btn-go-b:link,.btn-go-b:hover,.btn-go-b:active,.btn-go-b:visited {background-color:var(--bs-gold);color:var(--bs-white);text-align:center;width:100%;padding:0.5rem 0;font-size:1.2rem;font-weight:900;letter-spacing:0.1rem;}
.btn-basic {color:var(--bs-Creamy-Yellow);}
.btn-go-p {font-size:1.2rem;color:var(--bs-gold);border:0;padding:0;background-color:transparent;}
.btn-go-n {background-color:var(--bs-gold) !important;color:var(--bs-white);text-align:center;width:100%;padding:0.5rem 0;font-size:1.2rem !important;font-weight:900;letter-spacing:0.5rem;border-radius: 0 !important;}
.btn-submit {background-color:var(--bs-gold) !important;color:var(--bs-white);text-align:center;padding:0.5rem 0;font-size:1.2rem !important;font-weight:900;border-radius: 0 !important;}
.btn-next-cw {font-size:1.1rem;background-color:var(--bs-Dark-blue);color:var(--bs-Creamy-Yellow);text-align:center;width:100%;padding:0.8rem 0;font-weight:900;}
.btn-go-bl {background-color:var(--bs-Dark-blue) !important;color: var(--bs-fit-dark) !important;}
.btn-go-bl900 {background-color:var(--bs-Dark-blue) !important;color: var(--bs-blue) !important;}
.btn-go-cw {background-color:var(--bs-Dark-blue);color: var(--bs-fit-dark);}
.btn-alert-ok {font-size:1rem;background:rgba(var(--bs-gold-rgb),1) !important;color:var(--bs-white) !important;border-radius: 0 !important;}
.btn-alert {font-size:1rem;background:rgba(var(--bs-black-rgb),0.1) !important;color:var(--bs-black) !important;border-radius: 0 !important;}
.btn-ent {background-color:var(--bs-gold);color:var(--bs-white);font-size:1rem;font-weight:900;border:0;}
.btn-disabled { pointer-events: none; /* 禁止滑鼠事件 */ opacity: 0.5; /* 顯示灰掉效果 */ cursor: not-allowed; }
.btn-adxclose {font-size:2.5rem;color:var(--bs-gold);border:0;padding:0;background:transparent;}
.btn-reload {font-size:1.2rem;font-weight:900;color:var(--bs-block);border:0;padding:0;background:transparent;}
.btn-reload i {color:var(--bs-claret);}
/* Page */
.page-container {background:var(--bs-white);border-top: 5.5rem solid var(--bs-white) !important;border-bottom: 5.5rem solid var(--bs-white) !important;min-height: 100vh;min-height: 100dvh;}
.page-heading {color:var(--bs-white);text-align:center;background-color:var(--bs-Dark-blue);padding:0.5rem 0;}
.page-heading h2 {font-size:1.5rem;font-weight:900;margin:0;padding:0.5rem 0;line-height:1;}
.page-heading div[class^=col] {display: flex !important;justify-content: center !important;}
.page-heading .fa-solid {font-size:2rem;}
.page-headbg {background:var(--bs-Dark-blue) url(../images/bglogo_top.png) no-repeat 0 0;}
.page-headbg-date {background:var(--bs-Dark-blue) url(../images/bglogo_date.png) no-repeat 12px 0;}

/* Modal PopWindows */
#alertModal .modal-header {border:0;padding:0.5rem 0;background:var(--bs-claret);}
#alertModal .modal-title {width:100%;font-weight:900;color:var(--bs-white);text-align:center;}
#alertModal .modal-content {border-radius: 1rem;}
#alertModal .modal-body {padding:1rem;padding-top:3rem;padding-bottom:2rem;}
.Alert-cancel {font-size:1.6rem !important;font-weight:900 !important;color:var(--bs-claret);text-align:left !important;}

/* Modal PopWindows */
.modal {--bs-modal-zindex: 9999 !important;z-index:9999 !important;}
.modal .modal-content {background-color:var(--bs-white) !important;}
.modal .modal-header {border:0;padding:0.5rem 0;background:var(--bs-Dark-blue);}
.modal .modal-body {border:0;padding:0;}
.modal .modal-title {color:var(--bs-white);text-align:center;}
.modal .modal-title h2 {font-size:1.5rem;font-weight:600;padding:0.3rem;margin:0;}
.modal .modal-title div[class^=col] {display: flex !important;justify-content: center !important;}
.modal .news-txt {color:var(--bs-black);padding: 3rem 1rem;line-height:1.5;}
.modal .news-txt span {color:var(--bs-white);background:var(--bs-gold);padding:0.2rem 0.8rem;border-radius: 0.3rem;margin-right:0.5rem;}
.modal .news-txt h3 {margin:2rem 0;line-height:1.5;}
.modal-footer {/* display: block; */border:transparent;justify-content: normal;}
.modal-backdrop {background:var(--bs-Dark-blue) !important;}
.modal-backdrop.show {opacity: 0.9 !important;}
.modal .modalqr-txt {color:var(--bs-black);padding: 3rem 1rem;}
.modal .modalqr-txt span {color:var(--bs-white);background:var(--bs-gold);padding:0.2rem 0.8rem;border-radius: 0.3rem;margin-right:0.5rem;}
.modal .modalqr-txt h3 {margin:2rem 0;}
.Alertborder {border:0.3rem solid var(--bs-claret);}
.Alertborder p {font-size:1.4rem;font-weight:900;text-align:center;line-height:1.5;margin:0;}
.Alertborder span {font-size:1.2rem;font-weight:900;text-align:center;line-height:1.5;margin:0;}
.Alertborder input{border-radius: 0 !important;font-size: 1.2rem !important;}
.Alertborder .toggle-password {font-size:1.5rem;}

/* 跳出視窗 進出掃描 QRcode */
.qrbodybg {background-color:var(--bs-white);}
.qrimg {width:290px;background-color:var(--bs-white);margin:0 auto;}
.qr-wrapper {width:100%;position: relative; display: inline-block;z-index:1111;margin:2rem 0;text-align:center;}
.qr-wrapper img {position:absolute;top:50%;left:50%;transform: translate(-50%, -50%);z-index:2222;width:80px;height:80px;}
.xxx {border:1px solid #ff0000 !important;}

.validation-input input {border:0.3rem solid var(--bs-black);border-radius: 0;}
.sms-input div {width:5rem;}
.sms-input input {font-size:1.5rem;}