/* ------------------------------ */

/* 20230111 加簽 for coupon.php

/* ------------------------------ */



#coupon #main { padding-top: 0; }

.experience-coupon-section { position: relative; font-family: 'Noto Sans TC', sans-serif; }



/* 背景 */

.experience-coupon-section .bgImgContainer { width: 100%; height: 100%; position: absolute; }

.experience-coupon-section .bgImgContainer img { max-width: 100%; height: 100%; width: 100%; object-fit: cover; object-position: top left; }

.experience-coupon-section .bgImgContainer .bg-mobile { display: none; height: 100%; }

.experience-coupon-section .bgImgContainer .bg-pc { display: block; height: 100%; }



/* 表單內容 */

.experience-coupon-section .container.containerCustom { max-width: 430px; width: 100%; }

.experience-coupon-section .couponForm {

    width: 100%; margin: 0 auto;

    padding: 25px 24px 53px;

    -webkit-filter: drop-shadow(0px 0px 15px rgba(0, 0, 0, 0.25));

    filter: drop-shadow(0px 0px 15px rgba(0, 0, 0, 0.25));

}

.experience-coupon-section .couponForm img { max-width: 100%; height: auto; }

.experience-coupon-section .couponForm .bottom {

    background: #fff;

    border-radius: 0px 0px 5px 5px;

    padding: 40px 20px 17px;

}

.experience-coupon-section .row { margin: 0 -5px; }

.experience-coupon-section .cols { padding: 0 5px; margin-bottom: 8px; }



/* 主標題 */

.experience-coupon-section .couponTitle {

    font-size: 25px;

    font-weight: 500;

    line-height: 52px;

    font-family: 'Noto Sans TC', sans-serif;

    text-align: center;

    color: #201F1D;

    margin-bottom: 12px;

}

.experience-coupon-section .couponTitle .number {

    font-family: 'Roboto', sans-serif;

    font-size: 35px;

    line-height: 41px;

    font-weight: 600;

}

.experience-coupon-section .couponTitle .day {

    font-family: 'Noto Sans TC', sans-serif;

    font-size: 35px;

    line-height: 52px;

    font-weight: 500;

}



/* 表單 標籤 輸入框 提示文字 */

.experience-coupon-section form .formLabel {

    color: #201F1D; font-size: 16px; background: #fff; margin-bottom: 0; margin-left: 15px; padding: 0 5px;  transform: translateY(50%);

}

.experience-coupon-section form .form-control {

    border-color: #ADADAD;

    line-height: 40px;

    color: #201F1D;

    font-weight: 400;

    padding-left: 20px;

    font-size: 20px;

}

.experience-coupon-section form .form-control:focus { box-shadow: none; border-color: #000; }

.experience-coupon-section form .form-control option:checked { color: #ff0; }

.experience-coupon-section .formBox.boxFocus .form-control { border-color: #000; box-shadow: none; outline: none; }



.experience-coupon-section .redHint {

    font-size: 14px;

    font-weight: 400;

    line-height: 21px;

    font-family: 'Noto Sans TC', sans-serif;

    color: #D10E0A;

    text-align: center;

    padding-top: 7px;

}



.experience-coupon-section input::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */

    font-family: 'Noto Sans TC', sans-serif;

    color: rgba(32, 31, 2.9, 0.5);

    font-weight: 400;

    font-size: 18px;

    line-height: 27px;

    letter-spacing: 0.05em;

    padding-top: 7px; padding-left: 0px;

    opacity: 1; /* Firefox */

}

.experience-coupon-section input:-ms-input-placeholder { /* Internet Explorer 10-11 */

    font-family: 'Noto Sans TC', sans-serif;

    color: rgba(32, 31, 2.9, 0.5);

    font-weight: 400;

    font-size: 18px;

    line-height: 27px;

    letter-spacing: 0.05em;

    padding-top: 7px; padding-left: 0px;

}

.experience-coupon-section input::-ms-input-placeholder { /* Microsoft Edge */

    font-family: 'Noto Sans TC', sans-serif;

    color: rgba(32, 31, 2.9, 0.5);

    font-weight: 400;

    font-size: 18px;

    line-height: 27px;

    letter-spacing: 0.05em;

    padding-top: 7px; padding-left: 0px;

}



/* 下拉選單 */

.experience-coupon-section form select {

    appearance: none;

    -moz-appearance: none;

    -webkit-appearance: none;

    background: url(../styles/images/static/coupon/dropdownArrow.png) no-repeat right center rgba(0,0,0,0);

    background-position-x: calc(100% - 15px);

}

.experience-coupon-section form select.form-control:not([size]):not([multiple]) { font-size: 18px; height: 54px; padding-left: 16px; }

.experience-coupon-section form .form-control.couponSelectPicker { color: rgba(32, 31, 2.9, 0.5); width: 100%; }

.experience-coupon-section form .form-control.couponSelectPicker.clicked { color: #000; }

.experience-coupon-section form .form-control.couponSelectPicker .dropdown-toggle::after { width: 50px; }

.experience-coupon-section form .form-control.couponSelectPicker option { color: #000; }



/* 可勾選區塊 */

.experience-coupon-section .checkBlock {

    color: #969696;

    position: relative;

    padding-top: 12px; padding-bottom: 21px;

}

.experience-coupon-section .checkBlock .checkContainer {

    display: block;

    position: relative;

    padding-left: 48px;

    line-height: 20px;

    -webkit-user-select: none;

    -moz-user-select: none;

    -ms-user-select: none;

    user-select: none;

}

.experience-coupon-section .checkBlock .checkContainer input {

    position: absolute;

    opacity: 0;

    cursor: pointer;

    height: 0;

    width: 0;

}

.experience-coupon-section .checkBlock .checkContainer .checkmark {

    position: absolute;

    top: 4px;

    left: 0;

    height: 29px;

    width: 29px;

    background-color: #fff;

    border: 1px solid #D9D9D9;

    border-radius: 3px;

    cursor: pointer;

}

.experience-coupon-section .checkBlock .checkContainer:hover input ~ .checkmark { background-color: #fff; }

.experience-coupon-section .checkBlock .checkContainer input:checked ~ .checkmark { background-color: #fff; }

.experience-coupon-section .checkBlock .checkContainer input:checked ~ .checkmark:after { display: block; }

.experience-coupon-section .checkBlock .checkContainer .checkmark:after {

    position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);

    content: url(images/static/coupon/checkedMarkRed.svg);

    width: 18px; height: 18px;

    display: none;

}



.experience-coupon-section .checkBlock .checkText {

    color: #969696; font-size: 14px; line-height: 21px; font-weight: 400;

    display: block; text-align: justify;

}



/* 送出按鈕 */

.experience-coupon-section .couponSentBtnRow { display: flex; justify-content: center; }

.experience-coupon-section .couponSentBtnRow .btnStyle {

    background: rgba(206, 1, 0, 1); color: #fff; font-size: 26px; font-weight: bold; line-height: 30px;

    border-radius: 10px;

    width: 342px; height: 80px; display: flex; justify-content: center; align-items: center;

    padding: 24px 16px 26px;

    transition: background .3s; -webkit-transition: background .3s;

}

.experience-coupon-section .couponSentBtnRow .btnStyle:hover {

    background: rgba(206, 1, 0, 0.6); transition: background .3s; -webkit-transition: background .3s;

}



/* recapcha */

.experience-coupon-section .recapchaRow { display: flex; justify-content: flex-end; align-items: center; margin-top: 16px; }



/* RWD */

@media screen and (max-width: 991px) {

    .experience-coupon-section .redHint { text-align: center; }

}



@media screen and (max-width: 575px) {

    .experience-coupon-section .bgImgContainer .bg-mobile { display: block; }

    .experience-coupon-section .bgImgContainer .bg-pc { display: none; }

    .experience-coupon-section .recapchaRow { margin-right: -9px; }

}



@media screen and (max-width: 360px) {

    .experience-coupon-section .couponForm .bottom { padding-top: 25px; }

    .experience-coupon-section .couponTitle { line-height: 40px; margin-bottom: 8px; }

    .experience-coupon-section .couponSentBtnRow .btnStyle { font-size: 24px; }

}





/* ------------------------------ */

/* 20230112 加簽 for club-qr-code.php

/* ------------------------------ */



#clubqrcode #main { padding-top: 0; }

.club-qr-code-section { position: relative; min-height: 100vh; font-family: 'Noto Sans TC', sans-serif; text-align: center; }



/* 背景 */

.club-qr-code-section .bgImgContainer { width: 100%; height: 100%; position: absolute; z-index: 1; }

.club-qr-code-section .bgImgContainer img { max-width: 100%; height: 100%; width: 100%; object-fit: cover; object-position: top left; }

.club-qr-code-section .bgImgContainer .bg-mobile { display: none; height: 100%; }

.club-qr-code-section .bgImgContainer .bg-pc { display: block; height: 100%; }



.club-qr-code-section .infoContainer.container {

    width: 100%;

    max-width: 450px;

    margin: 0 auto;

    padding-left: 15px;

    padding-right: 15px;

    position: relative;

    z-index: 15;

    padding-top: 61px;

    padding-bottom: 50px;

}

.club-qr-code-section .infoContainer img { max-width: 100%; height: auto; }



/* .titleBlock */

.club-qr-code-section .infoContainer .title {

    font-size: 42px;

    font-weight: 700;

    color: #fff;

    line-height: 100%;

    margin-bottom: 20px;

}

.club-qr-code-section .infoContainer .doc, .club-qr-code-section .infoContainer .info {

    font-size: 22px;

    line-height: 33px;

    font-weight: 500;

    color: #fff;

    max-width: 328px;

}

.club-qr-code-section .infoContainer .doc { margin: 0 auto 33px; }

.club-qr-code-section .infoContainer .info { margin: 0 auto 50px; }



/* .logoBlock */

.club-qr-code-section .infoContainer .logoBlock { margin-bottom: 25px; }



/* .qrCodeBlock */

.club-qr-code-section .infoContainer .qrCodeBlock {

    background: #fff;

    border-radius: 10px;

    width: 100%; height: 100%;

    max-width: 240px; max-height: 240px;

    padding: 20px;

    display: flex; justify-content: center; align-items: center;

    margin: 0 auto;

}



/* .dotTextBlock */

.club-qr-code-section .infoContainer .dotTextBlock {

    margin: 50px auto 0;

    padding-left: 10px;

    max-width: 380px;

}

.club-qr-code-section .infoContainer .dotText {

    font-weight: 500;

    font-size: 18px;

    line-height: 27px;

    position: relative;

    color: #fff;

    text-align: left;

    padding-left: 17px;

    margin-bottom: 10px;

}

.club-qr-code-section .infoContainer .dotText::before {

    position: absolute;

    left: 2px; top: 13px;

    content: '';

    width: 3px; height: 3px;

    background: #fff;

    border-radius: 50%;

}



/* RWD */

@media screen and (max-width: 575px) {

    .club-qr-code-section .infoContainer.container { padding-bottom: 60px; }

    .club-qr-code-section .bgImgContainer .bg-mobile { display: block; }

    .club-qr-code-section .bgImgContainer .bg-pc { display: none; }

}



@media screen and (max-width: 360px) {

    .club-qr-code-section .infoContainer .title { font-size: 38px; }

    .club-qr-code-section .infoContainer .doc, .club-qr-code-section .infoContainer .info { font-size: 20px; }

}



/* ------------------------------ */

/* 20230113 加簽 信託查詢

/* ------------------------------ */



.trust-search-section .trustSearchConsultBlock { display: none; }



.trust-search-section .banner .banner-display .banner-display-inner {

    padding-top: 160px;

    padding-left: 17px;

}

.trust-search-section .banner .banner-display .banner-display-inner .title {

    margin-top: 52px;

}

.trust-search-section .banner .banner-display .pic {

    margin-top: 0;

    background-position: top center !important;

    background-repeat: no-repeat;

    background-size: cover;

}



.trust-search-section .breadcrumb { color: #fff; }

.trust-search-section .recruit-banner .banner-display .banner-display-inner .breadcrumb { color: #fff; }

.trust-search-section .breadcrumb li+li::before { vertical-align: 0; }



.trust-search-section .rowCustom {

    display: flex; display: -ms-flexbox; flex-wrap: wrap; -ms-flex-wrap: wrap;

    justify-content: space-between;

}

.trust-search-section .rowCustom .colLeft, .trust-search-section .rowCustom .colRight {

    position: relative; width: 100%; min-height: 1px;

}



.trust-search-section .fromStyle { max-width: 920px; padding-bottom: 0; margin-top: 0; border-radius: 20px; margin-bottom: 120px; }

.trust-search-section .fromStyle form { padding: 0px; }

.trust-search-section .fromStyle form .topBlock { padding: 60px 60px 50px; }

.trust-search-section .fromStyle form .topBlock .row { margin-left: -10px; margin-right: -10px; }

.trust-search-section .fromStyle form .topBlock .row .cols { padding-left: 10px; padding-right: 10px; }

.trust-search-section .fromStyle form .topBlock .colLeft { -ms-flex: 0 0 60%; flex: 0 0 60%; max-width: 60%; }

.trust-search-section .fromStyle form .topBlock .colRight { -ms-flex: 0 0 37.5%; flex: 0 0 37.5%; max-width: 37.5%; }

.trust-search-section .fromStyle form .codeBox { position: relative; }

.trust-search-section .fromStyle form .codeBox input { padding-right: 120px; }

.trust-search-section .fromStyle form .codeBox .imgBox {

    position: absolute; right: 13px; top: 50%; transform: translateY(-50%); width: 99px; height: 34px;

}

.trust-search-section .fromStyle form .btnBox { margin-top: 50px; }

.trust-search-section .fromStyle form .btnBox .btnStyle { width: 174px; transform: skew(-15deg); }

.trust-search-section .fromStyle form .btnBox .btnStyle span {

    transform: skew(15deg);

    font-size: 17px;

    padding-top: 2px;

}



.trust-search-section .fromStyle form .bottomBlock {

    border-top: 1px solid #E5E5E5;

    padding: 50px 60px 60px;

    text-align: left;

    font: 500 16px 'Noto Sans TC', sans-serif;

    line-height: 24px;

}



.trust-search-section .fromStyle form .bottomBlock .titleRow {

    background-color: #FE0000;

    color: #fff;

    display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap;

    padding: 10.5px 20px;

}

.trust-search-section .fromStyle form .bottomBlock .titleRow .colLeft, .trust-search-section .fromStyle form .bottomBlock .titleRow .colRight {

    display: flex; flex-wrap: wrap;

}



.trust-search-section .fromStyle form .bottomBlock .detailRow {

    display: flex;

    border-bottom: 1px dashed #CBCBCB;

}

.trust-search-section .fromStyle form .bottomBlock .detailRow .colLeft {

    width: 130px;

    background-color: #F6F8F9;

    padding: 10px 20px;

}

.trust-search-section .fromStyle form .bottomBlock .detailRow .colRight {

    width: calc(100% - 130px);

    padding: 10px 20px;

    background-color: #fff;

}



.trust-search-section table { width: 100%; }

.trust-search-section input { padding-left: 19px; }

.trust-search-section .fromStyle form .bottomBlock .titleRow .colLeft .type, .trust-search-section .fromStyle form .bottomBlock .titleRow .colLeft .des { display: inline-block; word-break: break-all; }

.trust-search-section .fromStyle form .bottomBlock .titleRow .colRight { word-break: break-all; }

.trust-search-section .fromStyle form .bottomBlock .titleRow .colLeft .des { letter-spacing: .3px; }

.trust-search-section .fromStyle form .bottomBlock .detailBlock .expireDate .des { letter-spacing: .5px; }



@media screen and (max-width: 1200px) {

    .trust-search-section .banner .banner-display .pic { margin-top: 0; }

    .trust-search-section .banner .banner-display .banner-display-inner { padding-top: 100px; padding-left: 0px; }

    .trust-search-section .banner .banner-display .banner-display-inner .title { margin-top: 60px; margin-bottom: 60px; }

    .trust-search-section .fromStyle form .bottomBlock .titleRow .colLeft { flex-wrap: wrap; }

}



@media screen and (max-width: 991px) {

    .trust-search-section .banner .banner-display .banner-display-inner { padding-top: 30px; padding-bottom: 0px; }

    .trust-search-section .banner .banner-display .banner-display-inner .title { margin-top: 45px; margin-bottom: 45px; }

    .trust-search-section .fromStyle { margin-bottom: 90px; }

}



@media screen and (max-width: 767.98px) {

    .trust-search-section .banner .banner-display .banner-display-inner { height: 100%; padding-top: 20px;}

    .trust-search-section .banner .banner-display .banner-display-inner .title { margin-top: 30px; margin-bottom: 30px; }

    .trust-search-section .container { width: calc(100% - 30px); }

}



@media screen and (max-width: 767px) {

    .trust-search-section .fromStyle form .bottomBlock .titleRow { flex-direction: column; align-items: flex-start; }

    .trust-search-section .fromStyle form .bottomBlock .titleRow .colLeft { margin-bottom: 6px; }

    .trust-search-section .fromStyle form .topBlock .colLeft, .trust-search-section .fromStyle form .topBlock .colRight { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;  }

    .trust-search-section .fromStyle form .topBlock .colLeft { margin-bottom: 20px; }

    .trust-search-section .banner .banner-display .banner-display-inner .title { margin-top: 15px; margin-bottom: 15px; padding-top: 10px; padding-bottom: 25px; }

    .trust-search-section .fromStyle form .topBlock { padding: 40px 40px 30px; }

    .trust-search-section .fromStyle form .bottomBlock { padding: 30px 40px 40px; }

    .trust-search-section .fromStyle form .topBlock .btnBox { margin-top: 30px; }

}



@media screen and (max-width: 575px) {

    .trust-search-section .fromStyle { margin-bottom: 60px; }

    .trust-search-section .fromStyle form .topBlock { padding: 30px 22px 23px; }

    .trust-search-section .fromStyle form .topBlock .btnBox { margin-top: 23px; }

    .trust-search-section .fromStyle form .bottomBlock { padding: 23px 22px 30px; }

    .trust-search-section .fromStyle form .bottomBlock .detailBlock .colLeft { width: 100px; }

    .trust-search-section .fromStyle form .bottomBlock .detailBlock .colRight { width: calc(100% - 100px); display: flex; align-items: center; }

    .trust-search-section .fromStyle form .bottomBlock .titleRow { padding: 10px; }

    .trust-search-section .fromStyle form .bottomBlock .detailRow .colLeft { padding: 10px; }

    .trust-search-section .fromStyle form .bottomBlock .detailRow .colRight { padding: 10px; }

}



/* ------------------------------ */

/* 20230202 recruit 修改

/* ------------------------------ */



#worklistModal .modal-body .col-md-auto .workInfo:before {

    content: "";

    background-color: rgba(0,0,0,.5);

    display: block;

    width: 100%;

    height: 100%;

    position: absolute;

    border-radius: 50%;

    z-index: 1;

}

#worklistModal .apply { position: relative; z-index: 15; }

#worklistModal .workName { z-index: 15; }

#worklistModal .modal-body .col-md .workExp { padding-left: 0; }