
        :root {
            --footerH: 100px;
            --black: #000;
            --blue: rgb(0, 32, 189, 1);
            --primary: rgb(0, 32, 189, 1);

            --navy-blue: rgba(0, 10, 60, 1);

            --navy: rgba(4, 13, 33, 1);
            --navy-50: rgba(4, 13, 33, .5);
            --navy-10: rgba(4, 13, 33, .1);

            --light: rgba(248, 249, 250, 1);
            --light-50: rgba(248, 249, 250, .5);
            --light-10: rgba(248, 249, 250, .1);

            --mint: rgba(48, 255, 147, 1);
            --mint-50: rgba(48, 255, 147, .5);
            --mint-10: rgba(48, 255, 147, .1);
            --mint-dark: rgba(0, 186, 80, 1);
            --white-50: rgba(255, 255, 255, .5);
            --white-10: rgba(255, 255, 255, .1);

            --black-50: rgba(0, 0, 0, .5);
            --black-10: rgba(0, 0, 0, .1);

            --dark-50: rgba(52, 58, 64, .5);
            --dark-10: rgba(52, 58, 64, .1);

            --warning: rgba(247,255,45,1);
            --warning-dark: rgba(15, 39, 0, 1);

            --orange: rgb(255 124 35);

            --danger: rgba(255,29,50,1);
            --danger-dark: rgba(157, 0, 15, 1);

            --body: rgba(0, 0, 0, 0.85);
        }

        dl, ol, ul {
            padding-inline-start: 20px;
            margin-bottom: 2rem;
        }

        .h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6, li {
            margin-bottom: 1rem;
        }

        * {
            box-sizing: border-box;
            user-select: none;
            -webkit-user-drag: none;
            outline: 0px;
        }

        figure, textarea {
            display: block;
        }

        figure.table { position: relative; overflow-x: auto; }
        figure.table:after { content: ''; position: absolute; right: 0; top: 0; bottom: 0; display: block; height: 100%; width: 20px; background: #ffffff; background: linear-gradient(90deg,rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 80%); }
        figure.table table { 
            width: 100%;
            min-width: 500px;
            margin-bottom: 1rem;
            border-bottom: 1px solid #dee2e6;
        }

        a { color: var(--navy); transition: color 0.3s, background-color 0.3s; }
        a:hover { color:var(--navy); text-decoration: none; }
        a:active, a:focus { color: var(--navy); text-decoration: none; }

        html, body { width: 100%; height: 100%; }

        body {
            background: var(--white);
            width: 100%;
            font-size: 17px;
            line-height: 1.5;
            cursor: default;
        }

        @media(max-width: 1240px) {
            body { font-size: 16px; }
        }

        .font-75 { font-size: 0.75rem; }
        .font-80 { font-size: 0.80rem; }
        .font-85 { font-size: 0.85rem; }
        .font-90 { font-size: 0.90rem; }
        .font-95 { font-size: 0.95rem; }
        .font-100 { font-size: 1rem; }
        .font-110 { font-size: 1.1rem; }
        .font-120 { font-size: 1.2rem; }
        .font-130 { font-size: 1.3rem; }
        .font-140 { font-size: 1.4rem; }
        .font-150 { font-size: 1.5rem; }
        .font-200 { font-size: 200rem; }

        .cursor-pointer { cursor: pointer; }

        .line-height { line-height: 1; }
        .line-height-0 { line-height: 0; }
        .line-height-2 { line-height: 2; }

        .wrap { min-height: 100%; }
        footer { min-height: var(--footerH); padding: 1rem 0; }

        .badge { font-weight: inherit; font-size: inherit; }

        .navbar { padding: 0 1rem; }
        .navbar-dark .navbar-nav .nav-link { padding: 1.5rem .7rem; }

        .dropdown-menu { margin: 0; padding: 0; }
        .dropdown-item { padding: 1rem 1.5rem; }

        .border-gray { border-color: var(--black-10); }

        .text-white { color: var(--white) !important; }
        .text-white > a { color: var(--white) !important; }

        .text-warning { color: var(--warning) !important; }
        .text-warning > a { color: var(--warning) !important; }

        .text-danger { color: var(--danger) !important; }
        .text-danger > a { color: var(--danger) !important; }

        .text-primary { color: var(--primary) !important; }
        .bg-primary { background-color: var(--primary) !important; }
        .badge-primary { background-color: var(--primary) !important; }

        .text-navy { color: var(--navy) !important; }
        .bg-navy { background-color: var(--navy) !important; }

        .bg-warning { background-color: var(--warning) !important; }
        .bg-danger { background-color: var(--danger) !important; }

        .badge-navy { background-color: var(--navy) !important; }

        .text-navy-50 { var(--navy-50); }

        .dropdown-divider { margin: 0; }

        .card { overflow: hidden; background-color: var(--white); border-radius: 0rem; }

        .card.card-contents { padding: 5rem; }
        .card-header:first-child { border-radius: 0rem; }

        .card-title { min-height: 42px; word-break: break-all; overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; margin-bottom: .5rem; }
        .card-description { word-break: break-all; overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; margin-bottom: .5rem; }

        .ribbon {
            width: 150px;
            height: 150px;
            overflow: hidden;
            position: absolute;
            z-index: 1;
        }
        .ribbon-top-left {
            top: -10px;
            left: -10px;
        }
        .ribbon-top-left::before {
            top: 0;
            right: 0;
        }
        .ribbon-top-left::after {
            bottom: 0;
            left: 0;
        }
        .ribbon-top-left::before, .ribbon-top-left::after {
            border-top-color: transparent;
            border-left-color: transparent;
        }
        .ribbon::before, .ribbon::after {
            position: absolute;
            z-index: -1;
            content: '';
            display: block;
            border: 5px solid #2980b9;
        }
        .ribbon-top-left span {
            right: 5px;
            top: 10px;
            transform: rotate(-45deg);
        }
        .ribbon span {
            position: absolute;
            display: block;
            width: 225px;
            padding: 15px 0;
            background-color: #3498db;
            box-shadow: 0 5px 10px rgba(0, 0, 0, .1);
            color: #fff;
            font: 700 18px / 1 'Lato', sans-serif;
            text-shadow: 0 1px 1px rgba(0, 0, 0, .2);
            text-transform: uppercase;
            text-align: center;
        }

        .navbar-expand-lg .navbar-nav .nav-item { margin-bottom: 0; }
        .navbar-expand-lg .navbar-nav .nav-item .nav-link { padding: .5rem 1rem; }

        /**
        dark
        */
        body.theme-dark { background-color: var(--body); color: var(--navy); }
        body.theme-dark .navbar { background-color: var(--black) !important; }
        body.theme-dark .navbar-dark .navbar-brand { color: var(--white); }
        body.theme-dark .navbar-dark .navbar-nav .nav-link { color: var(--white); }

        body.theme-dark .header { background-color: var(--navy); }
        body.theme-dark .header { position: sticky; top: 0; z-index: 999; }
        body.theme-dark .header .navbar-brand { position: relative; }
        body.theme-dark .header .navbar-brand .navbar-logo {  }
        body.theme-dark .header .navbar-brand .navbar-logo h1 { display: flex; padding-leftdd: 33px; padding-top: 10px; padding-bottom: 10px; margin-bottom: 0; }
        body.theme-dark .header .navbar-nav .active>.nav-link, body.theme-dark .header .navbar-nav .nav-link.active, body.theme-dark .header .navbar-nav .nav-link.show, body.theme-dark .header .navbar-nav .show>.nav-link { color: var(--white); }
        body.theme-dark .header .navbar-nav .active>.nav-link:hover {
            color: #fff0c8;
            text-shadow: 0 0 17px #ef7c00, 0 0 22px #ef7c00, 0 0 2px #ef7c00;
            transition: all 300ms;
            text-shadow: 0 0 5px var(--white), 0 0 10px #ff8100, 0 0 15px #f00, 0 0 5px #ef7c00, 0 0 5px #ef7c00, 0 0 10px #f92552, 0 0 20px #ef7c00, 0px 0 40px #ef7c00;
            animation: beat .25s infinite alternate;
        }

        body.theme-dark .header .navbar-nav .nav-link {
            color: rgba(255, 255, 255, .5);
        }

        body.theme-dark .header .navbar-nav .nav-link svg {
            width: 24px;     display: inline-block;     vertical-align: middle;
            font-size: 24px;
            color: rgba(255, 255, 255, .5);
        }

        body.theme-dark .nav .nav-link {
            color: rgba(255, 255, 255, 1);
        }

        body.theme-dark .nav .nav-link svg {
            display: inline-block;
            vertical-align: middle;
            color: rgba(255, 255, 255, 1);
            margin-right: 5px;
            width: 17px;
            height: 17px;
        }

        body.theme-dark .header .navbar-nav .nav-link:focus, body.theme-dark .header .navbar-nav .nav-link:hover {
            color: rgba(255, 255, 255, .75);
        }

        body.theme-dark .header .navbar-nav .nav-link.nav-link-sub { color: rgba(48, 255, 147, .5); }
        body.theme-dark .header .navbar-nav .nav-link.nav-link-sub:focus, body.theme-dark .header .navbar-nav .nav-link.nav-link-sub:hover { 
            color: var(--white) !important;
            text-shadow: 0 0 17px #00ff7a, 0 0 22px #00ff7a, 0 0 2px #00ff7a;
            transition: all 300ms;
            text-shadow: 0 0 5px var(--white), 0 0 10px #00ff7a, 0 0 15px #00ffeb, 0 0 5px #00ff7a, 0 0 5px #00ff7a, 0 0 10px #00ff7a, 0 0 20px #00ff7a, 0px 0 40px #00ff7a;
            animation: beat .25s infinite alternate;
        }

        body.theme-dark .header .navbar-nav .active>.nav-link.nav-link-sub, body.theme-dark .header .navbar-nav .nav-link.nav-link-sub.active, body.theme-dark .header .navbar-nav .nav-link.nav-link-sub.show, body.theme-dark .header .navbar-nav .show>.nav-link.nav-link-sub {
            color: var(--mint);
        }
        body.theme-dark .navbar-expand-lg .navbar-nav .dropdown-menu { background-color: var(--navy); }
        body.theme-dark .navbar-expand-lg .navbar-nav .dropdown-menu .dropdown-item { color: var(--white); }

        body.theme-dark .navbar-expand-lg .navbar-nav .dropdown-menu .dropdown-item:focus, body.theme-dark .navbar-expand-lg .navbar-nav .dropdown-menu .dropdown-item:hover {
            color: var(--white);
            background-color: var(--navy);
        }
        body.theme-dark .header.fixed .navbar .navbar-brand {  }
        body.theme-dark .title-area { position: relative; z-index: 1; text-align: center; margin-bottom: 2rem; }
        body.theme-dark .title-site { position: absolute; top: -1.5rem; left: 50%; transform: translateX(-50%); color: var(--white-50); font-size: 0.75rem; margin-bottom: 1rem; }
        body.theme-dark .title-text { padding: 0 20%; margin: 0 auto; font-weight: bold; font-size: 2rem; color: var(--white); }
        body.theme-dark .title-area:beforedd { content: ''; display: block; width: 30%; height: 1px; background-color: var(--white-10); position: absolute; top: 50%; left: 0; }
        body.theme-dark .title-area:afterdd { content: ''; display: block; width: 30%; height: 1px; background-color: var(--white-10); position: absolute; top: 50%; right: 0; }

        body.theme-dark .header-box { position: relative; z-index: 1020; background-color: var(--danger); }
        body.theme-dark .header-box a { color: var(--white); }

        body.theme-dark .card-thumb { background-color: var(--white); border: 0px solid rgba(0, 0, 0,0.2); transition: all 0.5s; box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075); }
        body.theme-dark .card-thumb:hover { box-shadow: 0px 0px 5px #10df8b, 0px 0px 10px #10df8b, 0px 0px 20px #10df8b; }
        body.theme-dark .card-thumb .card-header img { filter: grayscale(0.1) brightness(0.9); }
        body.theme-dark .card-thumb .card-header .card-effect {
            position: absolute;
            display: block;
            left: 0;
            top: 0;
            right: 0;
            bottom: 0;
            background: linear-gradient(135deg, hsla(0, 0%, 100%, .1) 25%, transparent 0, transparent 50%, hsla(0, 0%, 100%, .1) 0, hsla(0, 0%, 100%, .1) 75%, transparent 0, transparent);
            background-size: 60rem 60rem;
            filter: blur(2px);
            animation: effect_animate_glossy 4s linear infinite;
            opacity: 0.3;
        }
        body.theme-dark .card-thumb:hover .card-header .card-effect { opacity: 1; }
        body.theme-dark .card-thumb:hover .card-header img { filter: grayscale(0) brightness(1); }
        body.theme-dark .card-thumb .card-body { padding: 0.5rem; background-color: var(--white); }
        body.theme-dark .alert { color: var(--white); background: linear-gradient(180deg, var(--navy-50), var(--navy)); border-color: var(--navy-50) var(--navy) #232324 #2c3339; }
        body.theme-dark .alert-close { color: var(--white); }

        body.theme-dark footer { text-align: center; color: var(--white); background-color: var(--black); padding: 1rem 0; }


        body.theme-dark .quick-top { position: fixed; right: 10px; bottom: 10px; }
        body.theme-dark .btn-quick-top { display: flex; justify-content: center; align-items: center; width: 3rem; height: 3rem; background-color: var(--black); color: var(--white-50); border: 1px solid var(--white-10); border-radius: 1.5px; text-indent: -9999rem; box-shadow: 0 0 5px rgba(0,0,0,0.2); }
        body.theme-dark .btn-quick-top:hover { color: var(--white); }
        body.theme-dark .btn-quick-top:active, .btn-quick-top:focus { color: var(--white-50); }

        body.theme-dark .breadcrumb {  }
        body.theme-dark .breadcrumb .breadcrumb-item {  }
        body.theme-dark .breadcrumb .breadcrumb-item a { color: var(--white-50); }

        body.theme-dark .sidebar { background-color: var(--black) !important; }

        /**
        light
        */
        body.theme-light { background-color: #FFF; color: var(--navy); }
        body.theme-light .navbar { background-color: var(--white) !important; }
        body.theme-light .navbar-dark .navbar-brand { color: var(--black); }
        body.theme-light .navbar-dark .navbar-nav .nav-link { color: var(--black); }

        body.theme-light .header { background-color: var(--navy-blue); }
        body.theme-light .header { position: sticky; top: 0; z-index: 999; }
        body.theme-light .header .navbar-brand { position: relative; }
        body.theme-light .header .navbar-brand .navbar-logo {  }
        body.theme-light .header .navbar-brand .navbar-logo h1 { display: flex; padding-leftddd: 33px; padding-top: 10px; padding-bottom: 10px; margin-bottom: 0; }
        body.theme-light .header .navbar-brand .navbar-logo-fixed img {  }
        body.theme-light .header .navbar-nav .active>.nav-link, body.theme-light .header .navbar-nav .nav-link.active, body.theme-light .header .navbar-nav .nav-link.show, body.theme-light .header .navbar-nav .show>.nav-link { color: var(--black); }
        body.theme-light .header .navbar-nav .active>.nav-link:hover {

        }

        body.theme-light .header .navbar-nav .nav-link {
            color: var(--black-50);
        }

        body.theme-light .header .navbar-nav .nav-link svg {
            width: 24px;     display: inline-block;     vertical-align: middle;
            font-size: 24px;
            color: var(--black-50);
        }

        body.theme-light .header .navbar-nav .nav-link:focus, body.theme-light .header .navbar-nav .nav-link:hover {
            color: var(--black-50);
        }

        body.theme-light .header .navbar-nav .nav-link.nav-link-sub { color: rgba(48, 255, 147, .5); }
        body.theme-light .header .navbar-nav .nav-link.nav-link-sub:focus, body.theme-light .header .navbar-nav .nav-link.nav-link-sub:hover { 

        }

        body.theme-light .header .navbar-nav .active>.nav-link.nav-link-sub, body.theme-light .header .navbar-nav .nav-link.nav-link-sub.active, body.theme-light .header .navbar-nav .nav-link.nav-link-sub.show, body.theme-light .header .navbar-nav .show>.nav-link.nav-link-sub {
            color: var(--mint-dark);
        }
        body.theme-light .navbar-expand-lg .navbar-nav .dropdown-menu { background-color: var(--white); }
        body.theme-light .navbar-expand-lg .navbar-nav .dropdown-menu .dropdown-item { color: var(--navy)f; }

        body.theme-light .navbar-expand-lg .navbar-nav .dropdown-menu .dropdown-item:focus, body.theme-light .navbar-expand-lg .navbar-nav .dropdown-menu .dropdown-item:hover {
            color: var(--navy);
            background-color: var(--white);
        }
        body.theme-light .header.fixed .navbar .navbar-brand {  }
        body.theme-light .title-area { position: relative; z-index: 1; text-align: center; }
        body.theme-light .title-site { position: absolute; top: -1.5rem; left: 50%; transform: translateX(-50%); color: var(--navy-50); font-size: 0.75rem; margin-bottom: 1rem; }
        body.theme-light .title-text { padding: 0 20%; margin: 0 auto; font-weight: bold; font-size: 2rem; color: var(--navy); }
        body.theme-light .title-area:beforedd { content: ''; display: block; width: 30%; height: 1px; background-color: var(--navy-10); position: absolute; top: 50%; left: 0; }
        body.theme-light .title-area:afterdd { content: ''; display: block; width: 30%; height: 1px; background-color: var(--navy-10); position: absolute; top: 50%; right: 0; }

        body.theme-light .header-box { position: relative; z-index: 1020; background-color: var(--danger); }
        body.theme-light .header-box a { color: var(--white); }

        body.theme-light .card-thumb { border: 1px solid rgba(32, 38, 52,0.1); transition: all 0.5s; box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .0); }
        body.theme-light .card-thumb:hover { box-shadow: 0px 0px 5px var(--dark-10), 0px 0px 10px var(--dark-10), 0px 0px 20px var(--dark-10); }
        body.theme-light .card-thumb .card-header img { filter: grayscale(0.5) brightness(0.8); }
        body.theme-light .card-thumb .card-header .card-effect {
            position: absolute;
            display: block;
            left: 0;
            top: 0;
            right: 0;
            bottom: 0;
            background: linear-gradient(135deg, hsla(0, 0%, 100%, .1) 25%, transparent 0, transparent 50%, hsla(0, 0%, 100%, .1) 0, hsla(0, 0%, 100%, .1) 75%, transparent 0, transparent);
            background-size: 60rem 60rem;
            filter: blur(2px);
            animation: effect_animate_glossy 4s linear infinite;
            opacity: 0.3;
        }
        body.theme-light .card-thumb:hover .card-header .card-effect { opacity: 1; }
        body.theme-light .card-thumb:hover .card-header img { filter: grayscale(0) brightness(1); }
        body.theme-light .card-thumb .card-body { padding: 0.5rem; background-color: var(--white); }
        body.theme-light .alert { color: var(--white); background-color: var(--navy-blue); border-color: #DDD; }
        body.theme-light .alert-close { color: var(--white); }

        body.theme-light footer { text-align: center; color: var(--navy); background-color: var(--light); padding: 1rem 0; }


        body.theme-light .quick-top { position: fixed; right: 30px; bottom: 10px; }
        body.theme-light .btn-quick-top { display: flex; justify-content: center; align-items: center; width: 3rem; height: 3rem; background-color: var(--light); color: var(--navy-50); border: 1px solid var(--navy-10); border-radius: 1.5px; text-indent: -9999rem; box-shadow: 0 0 5px rgba(0,0,0,0); }
        body.theme-light .btn-quick-top:hover { color: var(--navy); }
        body.theme-light .btn-quick-top:active, .btn-quick-top:focus { color: var(--navy-50); }

        body.theme-light .breadcrumb {  }
        body.theme-light .breadcrumb .breadcrumb-item {  }
        body.theme-light .breadcrumb .breadcrumb-item a {  }

        body.theme-light .sidebar { background-color: var(--light) !important; }

        .sidebar {
            position: fixed;
            top: 0;
            bottom: 0;
            left: 0;
            z-index: 100;
            padding: 110px 0 0;
            box-shadow: inset -1px 0 0 rgba(0, 0, 0, .1);
        }
        @supports ((position: -webkit-sticky) or (position: sticky)) {
            .sidebar-sticky {
                position: -webkit-sticky;
                position: sticky;
            }
        }

        .sidebar-sticky {
            position: relative;
            top: 0;
            height: calc(100vh - 110px);
            overflow-x: hidden;
            overflow-y: auto;
        }


        .navbar .navbar-toggler {
            top: .0rem;
            right: 1rem;
        }

        .screen-reader-text {
            border: 0;
            clip: rect(1px, 1px, 1px, 1px);
            height: 1px;
            margin: -1px;
            overflow: hidden;
            padding: 0;
            position: absolute;
            width: 1px;
            word-wrap: normal !important;
        }

        .elementor-screen-only, .screen-reader-text, .screen-reader-text span, .ui-helper-hidden-accessible {
            top: 0 !important;
        }

        .screen-reader-text {
            border: 0;
            clip-path: inset(50%);
            height: 1px;
            margin: -1px;
            overflow: hidden;
            padding: 0;
            position: absolute;
            width: 1px;
            word-wrap: normal !important;
        }

        .container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl {
            padding-right: 5px;
            padding-left: 5px;
        }

        .row {
            margin-right: -5px;
            margin-left: -5px;
        }

        .col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto {
            padding-right: 5px;
            padding-left: 5px;
        }

        .alert { margin-bottom: inherit; }


        @keyframes effect_animate_glossy {
            0% {
                background-position: 0;
            }
            100% {
                background-position: 60rem;
            }
        }

        .navbar .navbar-toggler { border: 0; }

        .btn-danger {
            color: var(--white);
            background-color: var(--danger);
            border-color: var(--danger);
        }

        .btn-danger:hover {
            color: var(--white);
            background-color: var(--danger);
            border-color: var(--danger);
        }

        .btn-danger:not(:disabled):not(.disabled).active, .btn-light:not(:disabled):not(.disabled):active, .show>.btn-light.dropdown-toggle {
            color: var(--white);
            background-color: var(--danger);
            border-color: var(--danger);
        }

        .btn-light {
            color: var(--navy);
            background-color: var(--white);
            border-color: #DDD;
        }

        .btn-light:hover {
            color: var(--navy);
            background-color: var(--white);
            border-color: #DDD;
        }

        .btn-light:not(:disabled):not(.disabled).active, .btn-light:not(:disabled):not(.disabled):active, .show>.btn-light.dropdown-toggle {
            color: var(--navy);
            background-color: var(--white);
            border-color: #DDD;
        }

        .btn-mint {
            color: var(--navy);
            background-color: var(--mint);
            border-color: var(--mint);
        }

        .btn-mint:hover {
            color: var(--navy);
            background-color: var(--mint);
            border-color: var(--mint);
        }

        .btn-mint:not(:disabled):not(.disabled).active, .btn-mint:not(:disabled):not(.disabled):active, .show>.btn-mint.dropdown-toggle {
            color: var(--navy);
            background-color: var(--mint);
            border-color: var(--mint);
        }


        .btn-block+.btn-block { margin-top: inherit; }

        .btn-outline-secondary {
            color: var(--navy);
            border-color: var(--navy);
        }

        .btn-outline-secondary:hover {
            color: var(--navy);
            background-color: inherit;
            border-color: var(--navy);
        }

        .btn-outline-secondary:not(:disabled):not(.disabled).active, .btn-outline-secondary:not(:disabled):not(.disabled):active, .show>.btn-outline-secondary.dropdown-toggle {
            color: var(--navy);
            background-color: inherit;
            border-color: var(--navy);
        }

        .btn-outline-secondary.focus, .btn-outline-secondary:focus {
            color: var(--navy);
            box-shadow: 0 0 0 .2rem rgba(108, 117, 125, .01);
        }

        hr { margin-top: 1rem; margin-bottom: 1rem; border: 0; border-top: 1px solid rgba(255,255,255, .1); }

        .only-pc {  }
        .only-m { display: none; }


        .modal-body img { max-width: 100%; }
        .modal-content { animation: modalOpen .2s ease-in-out forwards; box-shadow: 0 0 30px rgba(0,0,0,0.3); }

        .modal-header { position: sticky; z-index: 2; top: 0; left: 0; right: 0; align-items: center; align-items: center; width: 100%; border: 0; background-color: var(--blue); border-radius: 0; }
        .modal-title { font-weight: bold; font-size: 1rem; color: var(--white); text-shadow: 1px 2px 3px 0; }
        .modal-header .close { margin: 0; padding: 0.3rem; line-height: 0; color: var(--white); background-color: rgba(0,0,0,0); border-radius: 0%; transition: all 0.5s; text-shadow: inherit; opacity: 1; }
        .modal-header .close:hover { background-color: rgba(0,0,0,0.9); }

        .modal.mini-modal .modal-header { background-color: var(--black); padding: 0.5rem; }
        .modal.mini-modal .modal-header .modal-title { font-size: 0.85rem; }


        @keyframes modalOpen {
            0% {
                transform: scale(0);
            }
            100% {
                transform: scale(1);
            }
        }

        .modalClose {
            animation: modalClose .2s ease-in-out forwards
        }

        @keyframes modalClose {
            0% {
                transform: scale(1)
            }

            to {
                transform: scale(0)
            }
        }

        .carousel {  }
        .carousel-control-next, .carousel-control-prev {  width: 40px; height: 40px; background-color: var(--navy); border-radius: 50%; top: 50%; transform: translateY(-50%); padding: 10px; opacity: 0; transition: all 0.5s ease ; }
        .carousel-control-next { right: -100px; }
        .carousel-control-prev { left: -100px; }
        .carousel .carousel-control-next, .carousel .carousel-control-prev {  }
        .carousel:hover .carousel-control-next, .carousel:hover .carousel-control-prev { opacity: 1; }
        .carousel:hover .carousel-control-next { right: 10px; }
        .carousel:hover .carousel-control-prev { left: 10px; }

        .carousel-control-next-icon, .carousel-control-prev-icon { width: 1.2em; height: 1.2em; } 
        .carousel-control-next-icon {
            background-image: url("data:image/svg+xml,%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' x='0px' y='0px' width='50px' height='100px' viewBox='0 0 50 100' fill='white'%3E%3Cpolygon points='0,0.093 0,25.702 24.323,50.026 0,74.349 0,99.955 49.929,50.026 '%3E%3C/polygon%3E%3C/svg%3E") ;
        }
        .carousel-control-prev-icon {
            background-image: url("data:image/svg+xml,%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' x='0px' y='0px' width='50px' height='100px' viewBox='0 0 50 100' fill='white'%3E%3Cpolygon points='50,0.093 50,25.702 25.677,50.026 50,74.349 50,99.955 0.071,50.02 '%3E%3C/polygon%3E%3C/svg%3E") ;
        }

        .carousel-indicators {
            bottom: 20px;
        }

        .carousel-indicators li {
            box-sizing: content-box;
            -ms-flex: 0 1 auto;
            flex: 0 1 auto;
            width: 16px;
            height: 16px;
            margin-right: 3px;
            margin-left: 3px;
            border-radius: 20px 20px 20px 20px;
            text-indent: -999px;
            cursor: pointer;
            background-color: var(--white);
            background-clip: padding-box;
            border-top: 0px solid transparent;
            border-bottom: 0px solid transparent;
            opacity: .5;
            transition: opacity .6s ease;
        }

        .carousel-indicators li.active {
            background: var(--white);
            box-shadow: 0 0 10px #ff6c00, 0 0 30px #ff6c00;
            transition: all .5s;
            width: 48px;
        }

        .five_game {
            background: linear-gradient(180deg, #272727, #161616);
            border-color: #424242 #181818 #232324 #2c3339;
        }

        /**
        dark
        */
        body.theme-dark .header .btn-aside {
            display: none;
        }
        body.theme-dark .header .btn-aside .hambug {
        }
        body.theme-dark .header .btn-aside .hambug div {
            width: 35px;
            height: 2px;
            background-color: var(--white);
            margin-top: 10px;
            transition: width 0.8s;
        }
        body.theme-dark .header .btn-aside .hambug div.hambug1 {
            margin: 0px;
        }
        body.theme-dark .header .btn-aside.active .hambug div.hambug2 {
            width: 20px;
        }


        /**
        light
        */
        body.theme-light .header .btn-aside {
            display: none;
        }
        body.theme-light .header .btn-aside .hambug {
        }
        body.theme-light .header .btn-aside .hambug div {
            width: 35px;
            height: 2px;
            background-color: var(--white);
            margin-top: 10px;
            transition: width 0.8s;
        }
        body.theme-light .header .btn-aside .hambug div.hambug1 {
            margin: 0px;
        }
        body.theme-light .header .btn-aside.active .hambug div.hambug2 {
            width: 20px;
        }

        .aside { transform: translateX(100%); position: fixed; z-index: 9999; right: 0; top: 0; bottom: 0; width: 95%; height: 100%; transition: all 0.2s; }
        .aside .inner { width: 100%; height: 100%; background-color: var(--navy-blue); overflow-y: auto; }
        .aside.show { transform: translateX(0%); }

        .aside .aside-header { display: flex; padding: 1rem; -ms-flex-align: center; align-items: center; -ms-flex-pack: justify; justify-content: space-between; }
        .aside .aside-header a {  }
        .aside .aside-header a h1 { display: flex; font-weight: 700; text-transform: uppercase; color: var(--white); padding-leftddd: 33px; padding-top: 10px; padding-bottom: 10px; margin-bottom: 0; }

        .aside .aside-member { padding: 1rem; background-color: rgba(48, 255, 147, 1) }

        .aside .aside-copy { color: rgba(255, 255, 255, .5); padding: 1rem; font-size: .875em; }

        .aside-backdrop { display: none; position: fixed; z-index: 8; left: 0; right: 0; top: 0; bottom: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 1); opacity: 0.7; }
        .aside-backdrop.show { display: block; }

        .btn-aside-close {
            display: ;
        }
        .btn-aside-close .hambug {
        }
        .btn-aside-close .hambug div {
            width: 35px;
            height: 2px;
            background-color: var(--white);
            transform: rotate(0deg) translate(0px, 0px);
            margin-top: 10px;
            transition: width 0.8s;
        }
        .btn-aside-close.active .hambug div.hambug1 {
            margin: 0px;
            transform: rotate(45deg) translate(3px, 4px);
        }
        .btn-aside-close.active .hambug div.hambug2 {
            width: 0px;
            transform: rotate(0deg) translate(0px, -5px);
        }
        .btn-aside-close.active .hambug div.hambug3 {
            margin: 0px;
            transform: rotate(135deg) translate(-6px, 7px);
        }

        .aside .inner .nav-item { border-bottom: 1px solid var(--white-10); }
        .aside .inner .nav-item .nav-link {
            color: var(--white);
            padding: 1rem;
            border-top: 1px solid var(--white-10);
        }

        .aside .inner .nav-item .nav-link.nav-link-sub {
            color: var(--mint);
        }

        .aside .inner .nav-item .nav-link:hover {
            color: var(--white);
            text-shadow: 0 0 17px #ef7c00, 0 0 22px #ef7c00, 0 0 2px #ef7c00;
            transition: all 300ms;
            text-shadow: 0 0 5px var(--white), 0 0 10px #ff8100, 0 0 15px #f00, 0 0 5px #ef7c00, 0 0 5px #ef7c00, 0 0 10px #f92552, 0 0 20px #ef7c00, 0px 0 40px #ef7c00;
            animation: beat .25s infinite alternate;
        }

        .aside .inner .nav-item .nav-link.nav-link-sub:hover {
            color: var(--white) !important;
            text-shadow: 0 0 17px #00ff7a, 0 0 22px #00ff7a, 0 0 2px #00ff7a;
            transition: all 300ms;
            text-shadow: 0 0 5px var(--white), 0 0 10px #00ff7a, 0 0 15px #00ffeb, 0 0 5px #00ff7a, 0 0 5px #00ff7a, 0 0 10px #00ff7a, 0 0 20px #00ff7a, 0px 0 40px #00ff7a;
            animation: beat .25s infinite alternate;
        }

        @keyframes beat {
            100% {
                transform: scale(1.0);
            }
        }

        .popup-blind-box {
            background: rgba(0, 0, 0, 0.7);
            width: 100%;
            min-width: 280px;
            height: 100%;
            left: 0;
            top: 0;
            position: fixed;
            z-index: 9998;
            display: flex;
            align-items: center;
            align-content: center;
            justify-content: center;
            gap: 10px;
            padding: 10px;
            flex-wrap: wrap;
        }

        .popup-box {
            top: 150px;
            border-radius: 5px;
            transition: none;
            box-shadow: 0 0 20px rgba(0,0,0,0.2);
            overflow: hidden;
        }
        .popup-btn-box {
            background-color: var(--navy-blue);
            background-imagedd: linear-gradient(134deg, #3f3f3f9e 0, #101010 5%, #1c1c1cad 30%, rgb(0 0 0 / 45%) 50%, #29292996 70%, #101010 95%, #0000008f);
        }
        .popup-box .popup-content {
            overflow: hidden;
        }

        .btn-one-day {
            display: inline-block;
            padding: 10px 12px;
            font-size: 12px;
            cursor: pointer;
            color: #fff;
        }
        .btn-close {
            display: inline-block;
            padding: 6px 12px 5px;
            font-size: 18px;
            float: right;
            cursor: pointer;
            color: #fff;
        }
        .btn-one-day i {
            font-size: 14px;
            margin-right: 5px;
        }

        @media(max-width: 980px) {
            .popup-box { top: 50%; left: 50%; position: fixed; transform: translate(-50%, -50%); }
        }
        /*
        .pop-blind-box { background:rgba(0,0,0,0.3);width:100%;height:100%;left:0;top:0;position:fixed;z-index:9998; }
        .popup-box { border-radius:5px;overflow:hidden;position:absolute;transition:none; box-shadow: 0 0 10px rgba(0,0,0,0.5); }
        .popup-box .popup-content {  }
        .popup-btn-box {
            display: flex;
            align-items: center;
            justify-content: space-between;
            background-color: var(--navy);
            background-imagedd: linear-gradient(134deg,#3f3f3f9e 0,#101010 5%,#1c1c1cad 30%,rgb(0 0 0 / 45%) 50%,#29292996 70%,#101010 95%,#0000008f);
        }
        .popup-title { color:#ffe418;font-size:18px;text-align:center;padding:10px 0;text-shadow: 2px 2px 2px rgba(0,0,0,0.7); }
        .btn-one-day { display:block;padding:10px 12px;font-size:12px;cursor:pointer; color: var(--white); }
        .btn-one-day  i { font-size:14px;margin-right:5px; }
        .btn-close { display:block;padding:6px 12px 5px;font-size:18px;float:right;cursor:pointer; color: var(--white); }
        */



        @media (max-width: 992px) {

            .only-pc { display: none; }
            .only-m { display: block; }

            .title-text { font-size: 1rem !important; }


            body { font-size: 14px; letter-spacing: -0.1px; }

            .h1, h1 {
                font-size: 1.5rem;
            }

            .btn { font-size: 0.75rem; }

            .header .btn-aside .hambug div { width: 35px; height: 2px; margin-top: 8px; }

            .btn-aside-close .hambug div {
                width: 45px;
                height: 2px;
                margin-top: 10px;
            }

            .wrap { /* min-width: 260px; max-width: 480px; */ margin: 0 auto; padding: 0 0px; box-shadow: 0 0 40px rgba(0, 0, 0, 0.2); }
            footer { /* min-width: 260px; max-width: 480px; */ margin: 0 auto; padding: 0 0px; }

            .carousel-indicators { bottom: 10px; }
            .carousel-indicators li { width: 8px; height: 8px; }
            .carousel-indicators li.active { width: 25px; }

            .modal-dialog { margin: 0 auto; }
            .modal-header { paddingddd: 0.5rem; }

            .row.row-thumb .col-12 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50% ; }

            .carousel-control-next-icon, .carousel-control-prev-icon { width: 1em; height: 1em; } 
            .carousel-control-next, .carousel-control-prev {  width: 30px; height: 30px; padding: 5px; }


            /**
            dark
            */
            body.theme-dark .header .btn-aside { display: inline-block; }
            body.theme-dark .header.fixed .navbar .navbar-brand .navbar-logo { top: -35px; }
            body.theme-dark .header.fixed .navbar .navbar-brand { width: 73px; }

            body.theme-dark .title-area { margin-bottom: 1rem; }
            body.theme-dark .title-area:before {  display: none; }
            body.theme-dark .title-area:after { display: none; }

            /**
            light
            */
            body.theme-light { background-color: #d1d7e3; }
            body.theme-light .header .btn-aside { display: inline-block; }
            body.theme-light .header.fixed .navbar .navbar-brand .navbar-logo { top: -35px; }
            body.theme-light .header.fixed .navbar .navbar-brand { width: 73px; }
            body.theme-light .wrap { background-color: var(--white); }

            body.theme-light .title-area { margin-bottom: 1rem; }
            body.theme-light .title-area:before {  display: none; }
            body.theme-light .title-area:after { display: none; }


            .card.card-contents { padding: 1rem; }

        }


        @-webkit-keyframes skeleton-gradient {
            0% {
                background-color: rgba(165, 165, 165, 0.1);
            }

            50% {
                background-color: rgba(165, 165, 165, 0.3);
            }

            100% {
                background-color: rgba(165, 165, 165, 0.1);
            }
        }

        @keyframes skeleton-gradient {
            0% {
                background-color: rgba(165, 165, 165, 0.1);
            }

            50% {
                background-color: rgba(165, 165, 165, 0.3);
            }

            100% {
                background-color: rgba(165, 165, 165, 0.1);
            }
        }

        /*해당되는 컴포넌트에 적용*/
        .skeleton-list-item {
            -webkit-animation: skeleton-gradient 1.8s infinite ease-in-out;
            animation: skeleton-gradient 1.8s infinite ease-in-out;
        }


        svg.bd-placeholder-img text { stroke:#FFF;  stroke-width: 1px; stroke-dasharray: 326px; animation: svg-stroke 7s linear infinite; }

        @keyframes svg-stroke {
            0% {
                stroke-dashoffset: 326px;
            }
            100% {
                stroke-dashoffset: 0px;
            }
        }


        .modal-backdrop { background-color: rgba(0, 0, 0, 0.7) !important; }

        .modal-backdrop.show { opacity: 1; !important 
            background-color: rgba(0, 0, 0, 0.7); /* 디버깅용 */}

        /* 모달2가 위로 오도록 z-index 조절 */
        .mini-modal {
            z-index: 1055;
        }
        .modal2-backdrop {
            z-index: 1051 !important;
            background-color: rgba(0, 0, 0, 0.7); /* 디버깅용 */
        }

        figure.image { text-align: center; }

        .quick { max-width: 1130px; height: 0px; background-color: red; margin: 0 auto; }
        .quick .quick-inner { position: fixed; z-index: 10; top: 140px; }
        .quick .quick-inner.left { left: 50%; transform: translateX(-730px); }
        .quick .quick-inner.right { right: 50%; transform: translateX(730px); }
        .quick .quick-inner .quick-inner-bnr { max-width: 150px; }
        .quick .quick-inner .quick-inner-bnr a {  }
        .quick .quick-inner .quick-inner-bnr a svg {  }

        @media(max-width: 1480px) {
            .quick { display: none; }
        }