@charset "UTF-8"; /**/ input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active { -webkit-transition-delay: 9999s; transition-delay: 9999s; -webkit-transition-property: background-color, color; transition-property: background-color, color; } textarea[type="hidden"] { display: none; } .hidden { visibility: hidden; } figure { margin-bottom: 0; overflow: hidden; } figure[mbr-media-size] { -webkit-transition: width 0.1s; transition: width 0.1s; } img, iframe { display: block; width: 100%; } .card { background-color: rgba(255, 255, 255, 0); border: none; } .card-box { width: 100%; } .card-img { text-align: center; -ms-flex-negative: 0; flex-shrink: 0; -webkit-flex-shrink: 0; } .media { max-width: 100%; margin: 0 auto; } .mbr-figure { -ms-flex-item-align: center; -ms-grid-row-align: center; align-self: center; } .mbr-figure img, .card-img img { width: 100%; } @media (max-width: 991px) { .media { width: auto; } } @media (max-width: 991px) { .mbr-figure { width: 100% !important; } } .btn { border-width: 1px; margin: 0.6rem 0.6rem; white-space: normal; -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; word-break: break-word; } .btn-sm { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .btn-md { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .btn-lg { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .btn .mbr-iconfont, .btn.btn-sm .mbr-iconfont { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; cursor: pointer; margin-left: 0.5rem; vertical-align: sub; } .btn.btn-md .mbr-iconfont, .btn.btn-md .mbr-iconfont { margin-left: 0.8rem; } [type="submit"] { -webkit-appearance: none; } .map { height: 25rem; position: relative; } .map iframe { width: 100%; height: 100%; } #scrollToTop a i::before { content: ""; position: absolute; display: block; border-bottom: 2.5px solid #fff; border-left: 2.5px solid #fff; width: 27.8%; height: 27.8%; left: 50%; top: 50%; -webkit-transform: rotate(135deg); transform: translateY(-30%) translateX(-50%) rotate(135deg); } @keyframes arrowdown { 0% { -webkit-transform: translateY(0px); transform: translateY(0px); } 50% { -webkit-transform: translateY(-5px); transform: translateY(-5px); } 100% { -webkit-transform: translateY(0px); transform: translateY(0px); } } @-webkit-keyframes arrowdown { 0% { -webkit-transform: translateY(0px); transform: translateY(0px); } 50% { -webkit-transform: translateY(-5px); transform: translateY(-5px); } 100% { -webkit-transform: translateY(0px); transform: translateY(0px); } } @keyframes gradient-animation { from { background-position: 0% 100%; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } to { background-position: 100% 0%; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } } @-webkit-keyframes gradient-animation { from { background-position: 0% 100%; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } to { background-position: 100% 0%; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } } .nav { display: -webkit-flex; -webkit-flex-wrap: wrap; } .row { display: -webkit-flex; -webkit-flex-wrap: wrap; } .justify-content-center { -webkit-justify-content: center; } .form-inline { display: -webkit-flex; } .card-wrapper { -webkit-flex: 1; } .carousel-control { z-index: 10; display: -webkit-flex; } .carousel-controls { display: -webkit-flex; } .media { display: -webkit-flex; } .form-group:focus { outline: none; } .jq-selectbox__select { padding: 7px 0; position: relative; } .jq-selectbox__dropdown { overflow: hidden; border-radius: 10px; position: absolute; top: 100%; left: 0 !important; width: 100% !important; } .jq-selectbox__trigger-arrow { right: 0; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .jq-selectbox li { padding: 1.07em 0.5em; } input[type="range"] { padding-left: 0 !important; padding-right: 0 !important; } .modal-dialog, .modal-content { height: 100%; } .modal-dialog .carousel-inner { height: calc(100vh - 1.75rem); } @media (max-width: 575px) { .modal-dialog .carousel-inner { height: calc(100vh - 1rem); } } .carousel-item { text-align: center; } .carousel-item img { margin: auto; } .card-img { width: auto; } .carousel-item.active, .carousel-item-next, .carousel-item-prev { display: -webkit-box; display: -ms-flexbox; display: flex; } .form-control-label { position: relative; cursor: pointer; margin-bottom: 0.357em; padding: 0; } .alert { border-radius: 0; border: 0; margin-bottom: 1.875rem; padding: 1.25rem; position: relative; text-align: center; } .alert.alert-form::after { background-color: inherit; bottom: -7px; content: ""; display: block; height: 14px; left: 50%; margin-left: -7px; position: absolute; -webkit-transform: rotate(45deg); transform: rotate(45deg); width: 14px; } .form-control { background-color: #ffffff; background-clip: border-box; height: auto; padding: 0.6rem 1.2rem; -webkit-transition: border-color 0.25s ease 0s; transition: border-color 0.25s ease 0s; border: 1px solid transparent !important; border-radius: 4px; -webkit-box-shadow: rgba(0, 0, 0, 0.07) 0px 1px 1px 0px, rgba(0, 0, 0, 0.07) 0px 1px 3px 0px, rgba(0, 0, 0, 0.03) 0px 0px 0px 1px; box-shadow: rgba(0, 0, 0, 0.07) 0px 1px 1px 0px, rgba(0, 0, 0, 0.07) 0px 1px 3px 0px, rgba(0, 0, 0, 0.03) 0px 0px 0px 1px; } .form-active .form-control:invalid { border-color: red; } form .row { margin-left: -0.6rem; margin-right: -0.6rem; } form .row [class*="col"] { padding-left: 0.6rem; padding-right: 0.6rem; } form .btn { display: -webkit-box; display: -ms-flexbox; display: flex; padding: 0.6rem 1.2rem; margin: 0; } form .form-check-input { margin-top: .5; } .form-group { margin-bottom: 1.2rem; } .form-control, form .btn { min-height: 48px; } .form-control:focus { -webkit-box-shadow: none; box-shadow: none; } :focus { outline: none; } blockquote { padding: 3rem; position: relative; border-left: 3px solid; } ul, ol, pre, blockquote { margin-bottom: 2.3125rem; } .mt-4 { margin-top: 2rem !important; } .mb-4 { margin-bottom: 2rem !important; } @media (min-width: 992px) { .row { margin-left: -16px; margin-right: -16px; } } @media (min-width: 992px) { .row > [class*="col"] { padding-left: 16px; padding-right: 16px; } } @media (min-width: 768px) and (max-width: 991px) { .mbr-container { padding-left: 32px; padding-right: 32px; } } @media (max-width: 767px) { .mbr-container { padding-left: 16px; padding-right: 16px; } } .card-wrapper, .item-wrapper { overflow: hidden; } .btn { border-width: 2px; } .btn { padding: 0.6rem 1.2rem; border-radius: 4px; } .btn-sm { padding: 0.6rem 1.2rem; border-radius: 4px; } .btn-md { padding: 0.6rem 1.2rem; border-radius: 4px; } .btn-lg { padding: 1rem 2.6rem; border-radius: 4px; } .bg-primary { background-color: #e6e5de !important; } .bg-success { background-color: #2cccce !important; } .bg-info { background-color: #19bcd3 !important; } .bg-warning { background-color: #ffff00 !important; } .bg-danger { background-color: #e85d75 !important; /**/ } .btn-primary, .btn-primary:active { background-color: #e6e5de !important; border-color: #e6e5de !important; box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.2); } .btn-primary:hover, .btn-primary:focus, .btn-primary.focus, .btn-primary.active { background-color: #c1bead !important; border-color: #c1bead !important; box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.2); } .btn-primary.disabled, .btn-primary:disabled { background-color: #c1bead !important; border-color: #c1bead !important; } .btn-secondary, .btn-secondary:active { background-color: #ff6666 !important; border-color: #ff6666 !important; box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.2); } .btn-secondary:hover, .btn-secondary:focus, .btn-secondary.focus, .btn-secondary.active { background-color: #ff0f0f !important; border-color: #ff0f0f !important; box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.2); } .btn-secondary.disabled, .btn-secondary:disabled { background-color: #ff0f0f !important; border-color: #ff0f0f !important; } .btn-info, .btn-info:active { background-color: #19bcd3 !important; border:0 !important; box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.2); } .btn-info:hover, .btn-info:focus{ background-color: #007284 !important; border: 0 !important; box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.2); } .btn-info:disabled { background-color: #aaa!important; border-color: #bbb!important; pointer-events: none; cursor: default } .btn-success, .btn-success:active { background-color: #2cccce !important; border-color: #2cccce !important; box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.2); } .btn-success:hover, .btn-success:focus, .btn-success.focus, .btn-success.active { background-color: #1d8587 !important; border-color: #1d8587 !important; box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.2); } .btn-success.disabled, .btn-success:disabled { background-color: #1d8587 !important; border-color: #1d8587 !important; } .btn-warning, .btn-warning:active { background-color: #ffff00 !important; border-color: #ffff00 !important; box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.2); } .btn-warning:hover, .btn-warning:focus, .btn-warning.focus, .btn-warning.active { background-color: #a8a800 !important; border-color: #a8a800 !important; box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.2); } .btn-warning.disabled, .btn-warning:disabled { background-color: #a8a800 !important; border-color: #a8a800 !important; } .btn-danger, .btn-danger:active { background-color: #e85d75 !important; border-color: #e85d75 !important; box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.2); } .btn-danger:hover, .btn-danger:focus, .btn-danger.focus, .btn-danger.active { background-color: #ff0653 !important; border-color: #ff0653 !important; box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.2); } .btn-danger.disabled, .btn-danger:disabled { background-color: #ff0653 !important; border-color: #ff0653 !important; } .btn-white, .btn-white:active { background-color: #fafafa !important; border-color: #fafafa !important; box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.2); } .btn-white:hover, .btn-white:focus, .btn-white.focus, .btn-white.active { background-color: #cfcfcf !important; border-color: #cfcfcf !important; box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.2); } .btn-white.disabled, .btn-white:disabled { background-color: #cfcfcf !important; border-color: #cfcfcf !important; } .btn-black, .btn-black:active { background-color: #232323 !important; border-color: #232323 !important; box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.2); } .btn-black:hover, .btn-black:focus, .btn-black.focus, .btn-black.active { background-color: #000000 !important; border-color: #000000 !important; box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.2); } .btn-black.disabled, .btn-black:disabled { background-color: #000000 !important; border-color: #000000 !important; } .btn-primary-outline, .btn-primary-outline:active { background-color: transparent !important; border-color: #e6e5de; } .btn-primary-outline:hover, .btn-primary-outline:focus, .btn-primary-outline.focus, .btn-primary-outline.active { background-color: transparent!important; border-color: #c1bead !important; box-shadow: none!important; } .btn-primary-outline.disabled, .btn-primary-outline:disabled { background-color: #e6e5de !important; border-color: #e6e5de !important; } .btn-secondary-outline, .btn-secondary-outline:active { background-color: transparent !important; border-color: #ff6666; } .btn-secondary-outline:hover, .btn-secondary-outline:focus, .btn-secondary-outline.focus, .btn-secondary-outline.active { background-color: transparent!important; border-color: #ff0f0f !important; box-shadow: none!important; } .btn-secondary-outline.disabled, .btn-secondary-outline:disabled { background-color: #ff6666 !important; border-color: #ff6666 !important; } .btn-info-outline, .btn-info-outline:active { background-color: transparent !important; border-color: #19bcd3; } .btn-info-outline:hover, .btn-info-outline:focus, .btn-info-outline.focus, .btn-info-outline.active { background-color: transparent!important; border-color: #138a9e !important; box-shadow: none!important; } .btn-info-outline.disabled, .btn-info-outline:disabled { background-color: #19bcd3 !important; border-color: #19bcd3 !important; } .btn-success-outline, .btn-success-outline:active { background-color: transparent !important; border-color: #2cccce; } .btn-success-outline:hover, .btn-success-outline:focus, .btn-success-outline.focus, .btn-success-outline.active { background-color: transparent!important; border-color: #1d8587 !important; box-shadow: none!important; } .btn-success-outline.disabled, .btn-success-outline:disabled { background-color: #2cccce !important; border-color: #2cccce !important; } .btn-warning-outline, .btn-warning-outline:active { background-color: transparent !important; border-color: #ffff00; } .btn-warning-outline:hover, .btn-warning-outline:focus, .btn-warning-outline.focus, .btn-warning-outline.active { background-color: transparent!important; border-color: #a8a800 !important; box-shadow: none!important; } .btn-warning-outline.disabled, .btn-warning-outline:disabled { background-color: #ffff00 !important; border-color: #ffff00 !important; } .btn-danger-outline, .btn-danger-outline:active { background-color: transparent !important; border-color: #e85d75; } .btn-danger-outline:hover, .btn-danger-outline:focus, .btn-danger-outline.focus, .btn-danger-outline.active { background-color: transparent!important; border-color: #ff0653 !important; box-shadow: none!important; } .btn-danger-outline.disabled, .btn-danger-outline:disabled { background-color: #e85d75 !important; border-color: #e85d75 !important; } .btn-black-outline, .btn-black-outline:active { background-color: transparent !important; border-color: #232323; } .btn-black-outline:hover, .btn-black-outline:focus, .btn-black-outline.focus, .btn-black-outline.active { background-color: transparent!important; border-color: #000000 !important; box-shadow: none!important; } .btn-black-outline.disabled, .btn-black-outline:disabled { background-color: #232323 !important; border-color: #232323 !important; } .btn-white-outline, .btn-white-outline:active { background-color: transparent !important; border-color: #fafafa; } .btn-white-outline:hover, .btn-white-outline:focus, .btn-white-outline.focus, .btn-white-outline.active { background-color: transparent!important; border-color: #cfcfcf !important; box-shadow: none!important; } .btn-white-outline.disabled, .btn-white-outline:disabled { background-color: #fafafa !important; border-color: #fafafa !important; } .alert-success { background-color: #70c770; } .alert-info { background-color: #19bcd3; } .alert-warning { background-color: #ffff00; } .alert-danger { background-color: #e85d75; } .mbr-gallery-filter li a { border-radius: 100px !important; } .mbr-gallery-filter li.active .btn { background-color: #e6e5de; border-color: #e6e5de; } .mbr-gallery-filter li.active .btn:focus { box-shadow: none; } .form-control:hover, .form-control:focus { box-shadow: rgba(0, 0, 0, 0.07) 0px 1px 1px 0px, rgba(0, 0, 0, 0.07) 0px 1px 3px 0px, rgba(0, 0, 0, 0.03) 0px 0px 0px 1px; border-color: #e6e5de !important; } blockquote { border-color: #e6e5de; } .mbr-form .input-group-btn a.btn { border-radius: 100px !important; } .mbr-form .input-group-btn a.btn:hover { box-shadow: 0 10px 40px 0 rgba(0, 0, 0, 0.2); } .mbr-form .input-group-btn button[type="submit"] { border-radius: 100px !important; padding: 1rem 3rem; } .mbr-form .input-group-btn button[type="submit"]:hover { box-shadow: 0 10px 40px 0 rgba(0, 0, 0, 0.2); } .jq-selectbox li:hover, .jq-selectbox li.selected { background-color: #e6ebec; } .jq-number__spin { transition: 0.25s ease; } .jq-number__spin:hover { border-color: #e6e5de; } .jq-selectbox .jq-selectbox__trigger-arrow, .jq-number__spin.minus:after, .jq-number__spin.plus:after { transition: 0.4s; border-top-color: #353535; border-bottom-color: #353535; } .jq-selectbox:hover .jq-selectbox__trigger-arrow, .jq-number__spin.minus:hover:after, .jq-number__spin.plus:hover:after { border-top-color: #e6e5de; border-bottom-color: #e6e5de; } .jq-selectbox__trigger-arrow{ right:10px; } .jq-selectbox__trigger-arrow { position: absolute; top: 50%; transform: translateY(-50%); right: 20px; border-top: 5px solid #999; border-right: 5px solid transparent; border-left: 5px solid transparent; /**/ } .xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_default, .xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_current, .xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box > div > div.xdsoft_current { background-color: #e6e5de !important; box-shadow: none !important; } .xdsoft_datetimepicker .xdsoft_calendar td:hover, .xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box > div > div:hover { background: #ff6666 !important; box-shadow: none !important; } /**/ button:disabled { background-color: #ccc !important; } button:focus { outline: 1px dotted; } .btn { border-radius: 28px !important; } .btn:disabled { color: #fff !important; background-color: #ddd !important; border-color: #ddd !important; pointer-events: none; cursor: default; } .btn-info, .btn-info:active { background-color: var(--sp88blue) !important; } .btn-info:focus, .btn-info:hover { background-color: var(--sp88blue_hover) !important; } .btn-secondary, .btn-secondary:active { background-color: #FF6666 !important; border: 0 !important; } .btn.focus, .btn:focus, .btn_cancel:focus, .btn_clear:focus, .btn_confirm:focus, .swal2-cancel:focus, .swal2-cancel:hover, .swal2-confirm:focus, .swal2-confirm:hover, .swal2-styled:focus, .swal2-styled:hover { box-shadow: none !important; background-image: none !important; } .btn_cancel, .btn_clear, .btn_confirm { border: 3px solid rgba(255,255,255,0.1) !important; padding: 0.3rem 0.7rem; /**/ border-radius: 5em !important; min-width: 130px; margin: 10px; } .btn_cancel { color: white; /**/ background-color: #999 !important; } .btn_cancel:hover { background-color: #aaa !important; } .btn_clear { color: white; /**/ background-color: #ff0f0f !important; } .btn_confirm { color: white; /**/ background-color: var(--sp88blue) !important; } .btn_confirm:focus, .btn_confirm:hover { background-color: var(--sp88blue_hover) !important; } .btn_copy, .btn_download { display: inline-block !important; margin-bottom: 20px !important; } .btn_signin_popup { color: white; background-color: var(--sp88blue_hover) !important; border: 3px solid rgba(255,255,255,0.1) !important; padding: 0.1rem 0.3rem; /**/ border-radius: 3em !important; min-width: 90px; margin: 5px; } .btn_small { padding: 3px 7px !important; min-height: 12px !important; display: inline !important; border-radius: 28px !important; } @media (max-width: 767px) { .btn_cancel, .btn_clear, .btn_confirm, .btn_signin_popup { border: 3px solid rgba(255, 255, 255, 0.1) !important; padding: 0.1rem 0.3rem; border-radius: 3em !important; min-width: 90px; margin: 5px; } } /**/ ::placeholder { color: #B0B0B0 !important; } form { padding: 0; margin: 0; } input, textarea { display: inline-block; margin-right: 3px; vertical-align: middle; color: #333 !important; } textarea { line-height: 1.4em !important; } .alert-success { color: #DD0000; background-color: transparent; padding: 0; } .checkbx-lg { width: 20px; height: 20px; line-height: 20px; } .field-input, .form-control, .form-control:hover, .form-control option { color: #555 !important; font-weight: 400 !important; /**/ } .field-input, input.form-control, option.form-control, select.form-control { color: #555; font-weight: 400; font-size: 1.2rem; } .field-input:focus, .field-input:hover, .form-control:focus, .form-control:hover { border-color: #26bcd2 !important; } .form-check-label { margin-left: 5px !important; vertical-align: middle !important; } .form-control { padding: 0.2rem 0.8rem !important; border-bottom-width: .05em !important; height: calc(1.5em + .75rem + 2px); } .form-group { margin-bottom: 1.5rem; } .hint, .hint2 { color: #f66; font-size: 1rem; margin-left: 5px; } .input_20 { width: 20px; height: 20px; } .placeholder1, .placeholder2 { color: #B0B0B0 !important; } .rdo_20 { width: 20px; height: 20px; margin-right: -5px; } input.form-control.input_short { height: 30px !important; min-height: 30px !important; padding-top: 0rem !important; padding-bottom: 0rem !important; } label.disable { pointer-events: none; cursor: default; } label.form-check-label { pointer-events: auto; cursor: pointer; } textarea.form-control { line-height: 1.8rem !important; } @media (max-width: 479px) { .hint { display: block; font-size: 1rem; margin-top: 10px; margin-left: 35px; } } @media (max-width: 479px) { .hint2 { display: inline; font-size: 1rem; margin-top: 10px; margin-left: 0px; } } /**/ .badge { padding: .5em 1em; margin-bottom: 2px; box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.2); } .badge-danger { color: #b03d50; background-color: #fae4e8; /**/ } .badge-dark { color: #ff8040; background-color: #fff5f0; } .badge-info { color: #3b7e94; background-color: #e5f4f8; /**/ } .badge-light { color: #ff62ff; background-color: #ffeeff; } .badge-primary { color: #2f5ab5; background-color: #e2eaf7; /**/ } .badge-secondary { color: #40426d; background-color: #f1f2f3; /**/ } .badge-sp88 { color: var(--sp88blue); background-color: #f0fcfd; } .badge-success { color: #0c622e; background-color: #dcf1e4; /**/ } .badge-warning { color: #896110; background-color: #fbf1dd; /**/ } .popupAlert { max-width: 98%; width: 520px; padding: 16px 0px 30px !important; } .swal2-container { z-index: 2000; } .swal2-html-container input, .swal2-html-container label, .swal2-html-container span { line-height: 26px !important; } .swal2-html-container::-webkit-scrollbar { width: 5px; height: 5px; /**/ } .swal2-html-container::-webkit-scrollbar-thumb { background-color: rgba(122, 122, 122, 0.3); border-radius: 4px; /**/ } .swal2-html-container::-webkit-scrollbar-thumb:hover { background-color: rgba(122, 122, 122, 0.5); } .swal2-html-container::-webkit-scrollbar-track { background-color: rgba(122, 122, 122, 0.1); } .swal2-modal { padding: 20px; } .swal2-title { line-height: 1.2; } @media (max-width: 767px) { .popupAlert { max-width: 98% !important; min-width: 320px; padding: 16px 0px 30px !important; } } /**/ .disabled { pointer-events: none; cursor: default; color: #c0c0c0 !important; } .divider { border-top: 1px solid #ddd; margin: 10px 0; } .shadow-box { overflow-y: auto; overflow-x: hidden; border-radius: 4px; box-shadow: rgba(0, 0, 0, 0.07) 0px 1px 1px 0px, rgba(0, 0, 0, 0.07) 0px 1px 3px 0px, rgba(0, 0, 0, 0.03) 0px 0px 0px 1px; } .top-left-icon { position: absolute; color: white; top: 0; left: 0; padding: 5px 10px; z-index: 102; /**/ } #list, #result { background: #FFF !important; color: #555 !important; height: 300px; font-weight: 400 !important; line-height: 2rem !important; font-size: 1.2rem !important; padding: .5rem !important; border-radius: 4px; /**/ } #warning_copy { display: block; } button, .btn, .nav-link, .badge, .menu-title, .nobr { white-space: nowrap; } input, textarea { display: inline-block; margin-right: 1px; vertical-align: middle; } button:disabled, button:disabled:hover, button.disabled { background-color: #ccc !important; color: #fff !important; } input::placeholder, textarea::placeholder { color: #b0b0b0 !important; } label { margin-bottom: 0rem; color: #5b5b5b; font-size: 1rem; } label.disable { pointer-events: none; cursor: default; } label, label.form-check-label { pointer-events: auto; cursor: pointer; } a[class*="text-"]:not(.nav-link):not(.dropdown-item):not([role]) { transition: none !important; background-image: none !important; } .dropdown-item.active, .dropdown-item:active { background-color: #e9e9e9; } .copy { cursor: default; position: relative; } .bubble { font-size:0.8rem; color:#FFF; background:var(--sp88blue); border-radius: 6px; z-index: 1; position: absolute; line-height:1rem !important; padding:2px 8px 2px 5px; top:-15px; left:2px; } .selected { background-color:#e2f9fc !important; } .shadow-box { overflow-y: auto; overflow-x: hidden; border-radius: 4px; box-shadow: rgba(0, 0, 0, 0.07) 0px 1px 1px 0px, rgba(0, 0, 0, 0.07) 0px 1px 3px 0px, rgba(0, 0, 0, 0.03) 0px 0px 0px 1px !important; } .icon_color { color: var(--icon_color) !important; } .icon_color:hover { color: var(--icon_color) !important; } .form-control:hover, .form-control:focus, .field-input:hover, .field-input:focus { border-color: var(--icon_color) !important; } .form-control { min-height: 36px !important; } .form-control { border-color: #dddddd !important; } form.btn { display: inline-block !important; } .btn.disabled, .btn:disabled { opacity: 0.8 !important; } .btn_small { font-size: 0.9rem; padding: 0.1rem 0.5rem !important; vertical-align: bottom; white-space: nowrap; margin: 0.3rem 0.1rem !important; min-height: 24px !important; } .my_btn { background-color: var(--sp88blue) !important; color: #ffffff !important; transition: background-color 0.3s ease, color 0.3s ease; } .my_btn:hover, .my_btn:focus { background: var(--sp88blue_hover) !important; } .btn_op { background-color: var(--icon_color) !important; color: var(--icon_txt_color) !important; transition: background-color 0.3s ease, color 0.3s ease; } .btn_op:hover, .btn_op:focus { background: var(--icon_color_hover) !important; } .btn_icon { display: inline-flex; /**/ justify-content: center; /**/ align-items: center; /**/ width: 27px; /**/ height: 27px; /**/ text-decoration: none; /**/ background-color: #fff; /**/ border: none; /**/ border-radius: 3px; /**/ /**/ cursor: pointer; /**/ color: #7a7a7a; box-shadow: rgba(0, 0, 0, 0.07) 0px 1px 1px 0px, rgba(0, 0, 0, 0.07) 0px 1px 3px 0px, rgba(0, 0, 0, 0.03) 0px 0px 0px 1px; margin-bottom: 2px !important; } .btn_icon:hover { background-color: rgba(20, 157, 181, 0.1); /**/ box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.2); } .btn_icon.bgred:hover { color: #c6150c !important; background-color: rgba(198, 21, 12, 0.1); /**/ box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.2); } @media screen and (max-width: 767px) { .btn_icon { width: 26px; /**/ height: 24px; /**/ } } .status { display: flex; flex-direction: row; align-items: center; flex-wrap: wrap; justify-content: center; } ul.advanced > li > label, label.agree { pointer-events: auto; cursor: pointer; margin: 0 !important; vertical-align: middle !important; line-height: 20px !important; font-size: 18px; align-items: center; } .publishAt { text-overflow: clip; white-space: normal !important; } .fullscreen { top: 0 !important; left: 0 !important; width: 100% !important; height: 100vh !important; /**/ } .user_avatar_28 { display:inline-block; width:28px; height:28px; border-radius:50%; vertical-align:middle; } .div_readonly { position: absolute; width: 100%; height: 100%; color: red; z-index: 9999; /**/ display: none; /**/ } .swal2-container { z-index: 10000 !important; /**/ } .swal2-html-container { margin-left: 2em !important; margin-right: 2em !important; } @media screen and (max-width: 767px) { .swal2-html-container { margin-left: 1em !important; margin-right: 1em !important; } } .iconset { min-height: 38px; } #previewTable td { max-width: 100px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } #previewTable img { max-width: 20px; height: auto; display: inline; border-radius: 50%; /**/ overflow: hidden; /**/ } #prize_table input, .border_form input[type="text"], .border_form input[type="number"] .border_form textarea, .border_form select, #pubForm textarea { border: 1px solid #bcbcbc !important; border-color: #bcbcbc !important; padding: 4px; min-height: 36px; border-radius: 4px; } .border_form select option { padding: 8px; /**/ margin: 5px 0; /**/ background-color: #fff; /**/ color: #333; /**/ } #pubForm textarea:hover, .border_form textarea:focus, .border_form input[type="text"]:focus, .border_form input[type="date"]:focus, .border_form input[type="password"]:focus .border_form select:focus, .border_form textarea:hover, .border_form input[type="text"]:hover, .border_form input[type="date"]:hover, .border_form input[type="password"]:hover, .border_form input[type="number"]:hover, .border_form select:hover { border-color: #26bcd2 !important; } .popup-social { background: #f5f5f5 !important; } .popup-social .swal2-close { color: #999 !important; font-size: 45px !important; position: relative !important; top: -10px !important; } .popup-social .swal2-close:hover { color: #333 !important; } .popup-social .swal2-html-container { margin: 10px 0px 0px 0px !important; padding: 0px !important; } .popupAlert { /**/ max-width: 98% !important; padding: 16px 0px 30px !important; border: 1px solid var(--sp88blue) !important; /**/ } .popupFilter { max-width: 98% !important; width: 430px !important; padding: 16px 30px 30px !important; } @media screen and (max-width: 575.98px) { .popupFilter { padding: 1.5rem 1.5rem 2em 2em !important; } } ul.dash, ul.star { list-style-type: none; /**/ padding-left: 0; } ul.dash li, ul.star li { margin-bottom: 5px; position: relative; /**/ padding-left: 20px; /**/ } ul.dash li::before { content: "-" !important; /**/ position: absolute; left: 0; color: gray !important; /**/ font-size: 1.2em; /**/ } ul.star li::before { content: "★"; /**/ position: absolute; left: 0; color: red; /**/ font-size: 1.2em; /**/ } .th_blue th { border-top: solid var(--sp88blue) 2px; color: var(--sp88blue); } table.sp88 td { color: #5b5b5b; } table.sp88 th { border-top: solid var(--sp88blue) 2px; color: var(--sp88blue); } thead th.text_left_col { text-align: left !important; } thead th.text_left_col:nth-of-type(1), tbody td:nth-child(1) { text-align: left !important; } thead th.text_center_col { text-align: center; } thead th.text_center_col:nth-of-type(n), tbody td:nth-child(n) { text-align: center; } #msg_warning { display: flex; align-items: center; justify-content: center; background: #f0f0f0; color: #666; padding: 10px; font-size: 1em; } #msg_warning::before { content: "!"; display: inline-block; width: 1.5em; min-width: 1.5em; height: 1.5em; margin: 0 0.625em; border-radius: 50%; background-color: #f27474; color: #fff; font-weight: 600; line-height: 1.5em; text-align: center; } #popup_title { font-size: 30px !important; font-weight: normal !important; } .btn_circle { border-radius: 50%; width: 40px; height: 40px; border: none; box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.2); } .numbered-list { list-style: none; /**/ counter-reset: list-counter; /**/ padding-left: 0px; /**/ } .numbered-list li { counter-increment: list-counter; /**/ position: relative; margin-bottom: 10px; /**/ padding-left: 26px; /**/ text-indent: 0; /**/ } .numbered-list li::before { content: counter(list-counter); /**/ position: absolute; left: 0; /**/ top: 0; /**/ width: 20px; /**/ height: 20px; /**/ border-radius: 50%; /**/ /**/ color: white; /**/ display: flex; justify-content: center; align-items: center; /**/ font-size: 12px; /**/ font-weight: bold; } .numbered-list li span { display: inline-block; line-height: 1.5; /**/ word-break: break-word; /**/ } .list_bg_red li::before { background-color: #e80808; /**/ } .list_bg_orange li::before { background-color: #ff9000; /**/ } .list_bg_purple li::before { background: #bf67f2; } .list_bg_green li::before { background-color: #acb700; /**/ } .list_bg_pink li::before { background: #f96294; } .icon_bg_red { background: #e80808; } .icon_bg_orange { background: #ff9000; } .icon_bg_green { background: #60c447; } .icon_bg_pink { background: #f96294; } .mfp_popup { position: relative; background: #fff; width: auto; max-width: 600px; margin: 20px auto; border-radius: 6px; /**/ padding: 30px; padding-top: 20px; min-height: 270px; } .mfp_popup textarea, .mfp_popup input[type="text"], .mfp_popup input[type="date"], .mfp_popup input[type="tel"], .mfp_popup input[type="password"] .mfp_popup select { font-size: 1em; border-radius: 4px; border: solid 0.05em #ccc; padding: 10px; width: 100%; height: auto !important; } .mfp_popup button { font-size: 1em; } .message { color: #f00; /**/ } .mfp-close { font-size: 2em !important; } .mfp-bg { background-color: rgba(0, 0, 0, 0.8) !important; } .pz-link { text-decoration: underline; color: var(--sp88blue); } .pz-link:hover { text-decoration: underline; background: #d9e7e9; color: var(--sp88blue_hover); } tr.stop td, a.stop { color: #c0c0c0 !important; } .ul_prize { padding-inline-start: 10px; padding-bottom: 2px; list-style-type: none; } @media screen and (max-width: 991.98px) { .table-sm td, .table-sm th { padding: 0rem; } } #note { min-height: 60px; height: auto; } #swal2-textarea { display: none !important; } .input_icon { position: absolute; top: 0; right: 0; z-index: 111; display: block; width: 50px; height: 50px; line-height: 50px; text-align: center; pointer-events: none; } .half_hr { display: flex; align-items: center; text-align: center; margin: 15px 0; } .half_hr::before, .half_hr::after { content: ''; flex: 1; border-bottom: 1px solid #ddd; } .half_hr:not(:empty)::before { margin-right: .5em; } .half_hr:not(:empty)::after { margin-left: .5em; } #btn_draw_area .btn, .draw-flow-popup .swal2-actions .btn, #btn_copy, #btn_download { transition: none !important; }