@charset "UTF-8"; /**/ section { background-color: #ffffff; } section, .container, .container-fluid { position: relative; word-wrap: break-word; } section { background-position: 50% 50%; background-repeat: no-repeat; background-size: cover; } section .mbr-background-video, section .mbr-background-video-preview { position: absolute; bottom: 0; left: 0; right: 0; top: 0; } .mbr-section-btn { margin-left: -0.6rem; margin-right: -0.6rem; font-size: 0; } nav .mbr-section-btn { margin-left: 0rem; margin-right: 0rem; } .mbr-fullscreen .mbr-overlay { min-height: 100vh; } .mbr-fullscreen { display: -webkit-box; display: -ms-flexbox; display: flex; display: -moz-flex; display: -ms-flex; display: -o-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; min-height: 100vh; padding-top: 3rem; padding-bottom: 3rem; } .mbr-arrow-up { bottom: 25px; right: 90px; position: fixed; text-align: right; z-index: 5000; color: #ffffff; font-size: 22px; } .mbr-arrow-up a { background: rgba(0, 0, 0, 0.2); border-radius: 50%; color: #fff; display: inline-block; height: 60px; width: 60px; border: 2px solid #fff; outline-style: none !important; position: relative; text-decoration: none; -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; cursor: pointer; text-align: center; } .mbr-arrow-up a:hover { background-color: rgba(0, 0, 0, 0.4); } .mbr-arrow-up a i { line-height: 60px; } .mbr-arrow-up-icon { display: block; color: #fff; } .mbr-arrow-up-icon::before { content: "\203a"; display: inline-block; font-family: serif; font-size: 22px; line-height: 1; font-style: normal; position: relative; top: 6px; left: -4px; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); } .mbr-arrow { position: absolute; bottom: 45px; left: 50%; width: 60px; height: 60px; cursor: pointer; background-color: rgba(80, 80, 80, 0.5); border-radius: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } @media (max-width: 767px) { .mbr-arrow { display: none; } } .mbr-arrow > a { display: inline-block; text-decoration: none; outline-style: none; -webkit-animation: arrowdown 1.7s ease-in-out infinite; animation: arrowdown 1.7s ease-in-out infinite; color: #ffffff; } .mbr-arrow > a > i { position: absolute; top: -2px; left: 15px; font-size: 2rem; } @media (max-width: 500px) { .mbr-arrow-up { left: 50%; right: auto; } } .menu .navbar-brand { display: -webkit-flex; } .menu .navbar-brand span { display: -webkit-box; display: -ms-flexbox; display: flex; display: -webkit-flex; } .menu .navbar-brand .navbar-caption-wrap { display: -webkit-flex; } .menu .navbar-brand .navbar-logo img { display: -webkit-flex; } @media (min-width: 768px) and (max-width: 991px) { .menu .navbar-toggleable-sm .navbar-nav { display: -webkit-box; display: -ms-flexbox; } } @media (max-width: 991px) { .menu .navbar-collapse { max-height: 93.5vh; } } @media (max-width: 991px) { .menu .navbar-collapse.show { overflow: auto; } } @media (min-width: 992px) { .menu .navbar-nav.nav-dropdown { display: -webkit-flex; } } @media (min-width: 992px) { .menu .navbar-toggleable-sm .navbar-collapse { display: -webkit-flex !important; } } @media (min-width: 992px) { .menu .collapsed .navbar-collapse { max-height: 93.5vh; } } @media (min-width: 992px) { .menu .collapsed .navbar-collapse.show { overflow: auto; } } @media (max-width: 767px) { .menu .navbar-collapse { max-height: 80vh; } } .nav-link .mbr-iconfont { margin-right: .5rem; } .navbar { display: -webkit-flex; -webkit-flex-wrap: wrap; -webkit-align-items: center; -webkit-justify-content: space-between; } .navbar-collapse { -webkit-flex-basis: 100%; -webkit-flex-grow: 1; -webkit-align-items: center; } .nav-dropdown .link { padding: 0.667em 1.667em !important; margin: 0 !important; } .navbar-toggler { -webkit-align-self: flex-start; -ms-flex-item-align: start; align-self: flex-start; padding: 0.25rem 0.75rem; font-size: 1.25rem; line-height: 1; background: rgba(255, 255, 255, 0); border: 1px solid rgba(255, 255, 255, 0); border-radius: 0.25rem; } .navbar-toggler:focus, .navbar-toggler:hover { text-decoration: none; } .navbar-toggler-icon { display: inline-block; width: 1.5em; height: 1.5em; vertical-align: middle; content: ""; background: no-repeat center center; background-size: 100% 100%; } .navbar-toggler-left { position: absolute; left: 1rem; } .navbar-toggler-right { position: absolute; right: 1rem; } .menu .navbar.collapsed:not(.beta-menu) { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .note-air-layout .dropup .dropdown-menu, .note-air-layout .navbar-fixed-bottom .dropdown .dropdown-menu { bottom: initial !important; } .dropup .dropdown-toggle::after { display: none; } form .mbr-section-btn { margin: 0; padding-left: 0.6rem; padding-right: 0.6rem; } .mbr-overlay { background-color: #000; bottom: 0; left: 0; opacity: 0.5; position: absolute; right: 0; top: 0; z-index: 0; pointer-events: none; } @media (min-width: 992px) { .container { padding-left: 16px; padding-right: 16px; } } @media (min-width: 768px) { .container-fluid { padding-left: 32px; padding-right: 32px; } } .nav-tabs .nav-link.active { color: #e6e5de; } .nav-tabs .nav-link:not(.active) { color: #232323; } .mbr-section-btn a.btn:not(.btn-form) { border-radius: 100px; } .nav-tabs .nav-link { border-radius: 100px !important; } .scrollToTop_wraper { display: none; } .lazy-bg { background-image: none !important; } .lazy-placeholder:not(section), .lazy-none { display: block; position: relative; padding-bottom: 56.25%; width: 100%; height: auto; } iframe.lazy-placeholder, .lazy-placeholder:after { content: ''; position: absolute; width: 200px; height: 200px; background: transparent no-repeat center; background-size: contain; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg width='32' height='32' viewBox='0 0 64 64' xmlns='http://www.w3.org/2000/svg' stroke='%23e6e5de' %3e%3cg fill='none' fill-rule='evenodd'%3e%3cg transform='translate(16 16)' stroke-width='2'%3e%3ccircle stroke-opacity='.5' cx='16' cy='16' r='16'/%3e%3cpath d='M32 16c0-9.94-8.06-16-16-16'%3e%3canimateTransform attributeName='transform' type='rotate' from='0 16 16' to='360 16 16' dur='1s' repeatCount='indefinite'/%3e%3c/path%3e%3c/g%3e%3c/g%3e%3c/svg%3e"); } section.lazy-placeholder:after { opacity: 0.5; } /**/ body { background: var(--background_color); display: flex; min-height: 100vh; flex-direction: column; scrollbar-gutter: stable force both-edges; overflow-y: scroll; } section { background-color: var(--background_color) !important; } .footer { padding-top: 45px; padding-bottom: 45px; /**/ background-color: #192730 !important } .mbr-arrow-up { right: 10px !important; bottom: 10px; } section.header_top { padding-top: 1rem; padding-bottom: 0rem; background-color: var(--sp88blue) !important; } #common-footer { padding-top: 3rem; padding-bottom: 4rem; background-color: #e6ebec !important; } #common-footer .list { list-style: none; padding-left: 0; color: #29a; } #common-footer .mbr-text { color: #666; } #common-footer a { color: #16acc0 !important; /**/ } #copyright_footer { padding-top: 45px; padding-bottom: 45px; /**/ background-color: #192730 !important } #copyright_footer .card-img { width: auto; } #copyright_footer .img1 { color: #ffffff; } #copyright_footer .item { margin: 0 1.5rem; display: flex; align-items: center; } #copyright_footer .item h4 { padding-left: 10px; margin: 0; } #copyright_footer .item-title { color: #c1c1c1; } #copyright_footer .mbr-flex { display: flex; justify-content: flex-end; } #copyright_footer .row { align-items: center; } #copyright_footer a { font-weight: 400; } #copyright_footer h4 { color: #c1c1c1; margin: 0; } #copyright_footer section { position: relative; } #menu { display: block; opacity: 0; /**/ height: 0; overflow: hidden; visibility: hidden; transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out; } #menu.open { opacity: 1; height: auto; overflow-y: auto; /**/ visibility: visible; } #menu_top { position: absolute; top: 0px; right: 5px; z-index: 201; } #scrollToTop { right: 10px !important; bottom: 10px; } #sp88_icon { color: #16acc0 !important; vertical-align: top !important; font-size: 1.7rem !important; margin-right: 6px !important; line-height: 48px !important; } @media (max-width: 500px) { .mbr-arrow-up { left: calc(100vw - 45px) !important; } } @media (max-width: 767px) { #common-footer .list { margin-bottom: 0rem; } } @media (max-width: 767px) { #common-footer .row { text-align: center; } } @media (max-width: 767px) { #copyright_footer .item { padding-bottom: 0.5rem; } } @media (max-width: 767px) { #copyright_footer .mbr-flex { align-items: center; flex-direction: column; } } @media (max-width: 991px) { #copyright_footer .align-left, #copyright_footer .align-right { text-align: center; } } @media (max-width: 991px) { #copyright_footer .content > div:not(:last-child) { margin-bottom: 2rem; } } @media (max-width: 991px) { #copyright_footer .mbr-flex { justify-content: center; } } @media (max-width: 991px) { #footer1-b .list { margin-bottom: 0; } } @media (max-width: 575px) { #menu { height: 70vh !important; overflow-y: auto; } } @media (max-width: 767px) { #footer_margin { min-height: 100px; } } @media (min-width: 768px) { #footer_margin { min-height: 90px; } } /**/ .custom-dropdown-item { color: var(--sp88blue); padding: 8px 10px; padding-left: 20px; /**/ text-decoration: none; display: block; /**/ } .custom-dropdown-item:hover { background-color: #f7f7f7; /**/ color: var(--sp88blue); /**/ transition: background-position 2s ease-in-out; /**/ background-position: 0px 1.2em; } .custom-dropdown-menu { position: absolute; top: 50px; right: 10px; /**/ background-color: #ffffff; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /**/ min-width: calc(160px + 40px); /**/ padding: 0px; /**/ list-style: none; /**/ display: none; /**/ overflow: hidden; /**/ z-index: 101; } .mbr-arrow-up a { width: 40px; height: 40px; } .menu-divider { display: flex; align-items: center; margin-top: 20px; margin-bottom: 8px; } .menu-divider::after { content: ""; display: block; height: 1px; background-color: #ccc; flex-grow: 1; margin-left: 20px; } .menu-title { color: #555; font-weight: bold; font-size: 1em; display: block; margin-bottom: 5px; padding-left: 20px; } .menu-title-home { color: var(--sp88blue); font-weight: bold; font-size: 1em; display: block; margin-bottom: 0px; padding: 10px; padding-left: 20px; } .menu-title-home:hover { background-color: #f7f7f7; } @media (max-width: 767px) { .mobile-column { padding-bottom: 5px; padding-top: 5px; position: relative; } } @media (max-width: 767px) { .mobile-column:not(:last-child)::after { border-bottom: 1px solid var(--sp88blue); bottom: 0; content: ""; left: 50%; position: absolute; transform: translateX(-50%); width: 60%; } } /**/ .navbar-nav .nav-link, .dropdown-item { font-size: 1.2rem; } @media (max-width: 767.98px) { .navbar-nav .nav-link, .dropdown-item { font-size: 1.4rem; /**/ } } .navbar .navbar-toggler { margin-top: auto; margin-bottom: auto; } /**/ .bg_ads { background: #f5f5f5; padding: 50px; } .close_ads { position: absolute; top: 5px; right: 3px; width: 22px; height: 22px; cursor: pointer; display: flex; align-items: center; justify-content: center; font-size: 1.5rem; color: rgba(130, 130, 130); } .fixed_ads { position: fixed; bottom: 0; left: 0; width: 100%; background-color: rgba(255, 255, 255, 0.4); display: flex; /**/ justify-content: center; align-items: center; box-shadow: 0 -1px 1px rgba(130, 130, 130, 0.18); } .responsive-div { max-width: 100%; position: relative; } @media (max-width: 767px) { .fixed_ads { height: 100px !important; } } @media (max-width: 767px) { .qrcode { height: 50%; width: 50%; margin: auto; } } @media (max-width: 767px) { .responsive-div { height: 100px; width: 100%; text-align: center; } } @media (min-width: 768px) { .fixed_ads { height: 90px; } } @media (min-width: 768px) { .qrcode { height: 50%; width: 50%; } } @media (min-width: 768px) { .responsive-div { width: 970px; height: 90px; position: relative; } } .container { padding-left: 1.5rem !important; padding-right: 1.5rem !important; } .div_center_all { display: flex; justify-content: center; align-items: center; } .layout-nav-bg, .layout-nav-bg .navbar.fixed-top { background-color: var(--nav_bg_color) !important; } section.banner_top { color: var(--my_txt_color) !important; background: var(--background_color) !important; } .container_txt { display: flex; } .left_txt { flex: 0 1 auto; /**/ } .right_txt { flex: 1; /**/ } .fixed-bottom { position: fixed; /**/ /**/ /**/ left: 0; /**/ width: 100%; /**/ padding-bottom: 20px; /**/ text-align: center; } .gap20 { display: flex; justify-content: center; gap: 20px; /**/ flex-wrap: wrap; } .gap30 { display: flex; justify-content: center; gap: 30px; /**/ flex-wrap: wrap; } #btn_menu:hover { color: #e7e7e7 !important; } @media screen and (max-width: 575.98px) { #menu { height: auto !important;/**/ } } #menu_top { background: var(--anno_bg) !important; }