@charset "utf-8";

/* ------------------------------- RESET ------------------------------- */

html {margin: 0; padding: 0; height: 100%;}
body, div, span, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, a, font, small, strong, b, u, i, center, label, form, fieldset,
input, button, textarea, img, p, table, tr, th, td, dl, dt, dd {
    margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; background: transparent;
}
table {border-collapse: collapse; border-spacing: 0;}
ol, ul, li {list-style: none;}
h1, h2, h3, h4, h5, h6 {font-size: 100%; font-weight: normal;}
input, button, textarea, select, optgroup, option {
    font-family: inherit; font-size: inherit; font-style: inherit; font-weight: inherit;
}
input, button, textarea, select {font-size: 100%; display: block;}
input[type=text], input[type=submit], textarea{-webkit-appearance: none;}
input:-webkit-autofill {
    -webkit-box-shadow: inset 0 0 0 50px #262A2E !important; -webkit-text-fill-color: #FFFFFF !important; color: #FFFFFF !important;
}
select {outline: 0;}
:focus {outline: none;}
* {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
*:before, *:after {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
::-moz-focus-inner {border: 0; padding: 0;}

/* ------------------------------- DEFAULT ------------------------------- */

html {-webkit-tap-highlight-color: rgba(0, 0, 0, 0); scroll-behavior: smooth;}
body {
    background: #FFFFFF; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; direction: ltr;
    color: #1A1919; display: block; min-width: 320px; font-size: 16px; width: 100%; position: relative; font-family: 'SourceSansPro', sans-serif;
    -webkit-font-smoothing: subpixel-antialiased; -moz-osx-font-smoothing: auto;
}
#main_sheet {display: flex; flex-direction: column; min-height: 100vh; height: 100%;}
div, label {display: block; line-height: 135%; letter-spacing: -0.02em;}
h1, h2, h3, h4, h5, h6 {line-height: 110%; letter-spacing: -0.02em;}
p {line-height: 135%; letter-spacing: -0.02em;}
img {width: 100%;}

.btn_primary {
    border-radius: 0; background: none; padding: 0 20px; transition: background .3s ease-in-out, color .3s ease-in-out, border .3s ease-in-out; text-decoration: none;
    font-size: 18px; font-weight: 600; color: #161715; display: flex; align-items: center; -webkit-justify-content: center; height: 58px; width: fit-content; cursor: pointer;
    border: 1px solid #1A1919;
}
.btn_primary.white {background: #FFFFFF; border: 1px solid #FFFFFF;}
.btn_primary.white:hover {background: #F9F9F9; color: #161715; border: 1px solid #FFFFFF;}
.btn_primary.transparent {background: none; color: #FFFFFF; border: 1px solid transparent;}
.btn_primary.transparent:hover {background: none; color: #FFFFFF; border: 1px solid #FFFFFF;}
.btn_primary:hover {background: #1A1919; color: #FFFFFF; border: 1px solid #1A1919;}
.btn_primary > i {font-size: 24px; margin-right: 10px;}

h2 {
    font-size: 48px; font-weight: 500; font-family: 'CormorantGaramond', sans-serif;
}

.wrap {width: 100%; padding: 0 160px; margin-left: auto; margin-right: auto; max-width: 1728px;}

@media only screen and (max-width: 1600px) {
    .wrap {padding: 0 60px;}
}

@media only screen and (max-width: 1400px) {
    .wrap {padding: 0 40px;}
}

@media only screen and (max-width: 800px) {
    .wrap {padding: 0 16px;}
}

/* ------------------------------- INPUTS ------------------------------- */

.input_group {
    display: inline-flex; flex-wrap: wrap; position: relative; background: #F9F9F9; border-bottom: 1px solid #00000080;
    width: 100%; overflow: hidden; padding: 16px; margin-top: 24px; transition: all 0.35s ease-in-out;
}
.input_group:hover {border-bottom: 1px solid #000000;}
.input_group:hover > label {color: #A9ABB0;}

.input_group.hidden {display: none;}
.input_group:has(input.error) {border-bottom: 1px solid #D8292C;}
.input_group:has(input.error) > label {color: #D8292C;}
.input_group > input, .input_group > textarea {
    border: 0; height: 18px; line-height: 18px; width: 100%; color: #1A1919;
    background: none; font-size: 16px; position: relative; top: 0; transition: 0.3s ease-in-out;
}
.input_group > textarea {resize: none; height: 120px;}
.input_group > label {
    color: #80838A; font-size: 16px; position: absolute; top: 16px; left: 16px; pointer-events: none; transition: 0.3s ease-in-out;
}
.input_group.active > input, .input_group.active > textarea {top: 5px;}
.input_group.readonly > input, .input_group.readonly > textarea {top: 5px;}
.input_group.active > label, .input_group.readonly > label {top: 5px; font-size: 12px; color: #80838A;}

.input_group.active_start, .input_group.active {border-bottom: 1px solid #000000;}
.input_group.active_start > input, .input_group.active_start > textarea {top: 5px; transition: none;}
.input_group.active_start > label {top: 5px; font-size: 12px; color: #797979; transition: none;}
.input_group.active_full > input, .input_group.active_full > textarea {top: 5px; transition: none;}
.input_group.active_full > label {top: 5px; font-size: 12px; color: #797979; transition: none;}

.input_group_error.active {display: block; margin-top: 4px;}
.input_group_error {color: #EB3752; line-height: 20px; font-size: 12px; font-weight: normal; display: none;}

.checkbox_group {margin-top: 24px;}
.checkbox_group input {position: absolute; z-index: -1; opacity: 0;}
.checkbox_group input+label::before {
    content: ''; display: block; min-width: 24px; width: 24px; height: 24px; border: 1px solid #1A1919; border-radius: 4px; background-repeat: no-repeat;
    background-position: center center; background-size: 50% 50%; margin-right: 12px; cursor: pointer;
}
.checkbox_group input:checked+label::before {
    background-image: url("data:image/svg+xml,%3Csvg width='16' height='12' viewBox='0 0 16 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 5.5L6.5 10.5L15 1' stroke='%231A1919'/%3E%3C/svg%3E%0A");
}
.checkbox_group label {display: flex; align-items: center; font-size: 12px; line-height: 120%;}
.checkbox_group label a {color: #1A1919;}


/* ------------------------------- MODAL ------------------------------- */

#modal {
    position: fixed; top: 0; bottom: 0; left: 0; width: 100%; height: 100%; overflow: hidden; pointer-events: none;
    transform: scale(1.1); opacity: 0; visibility: hidden; filter: alpha(opacity=0); background: #FFFFFF; z-index: -1;
    transition: z-index .6s step-end, opacity .6s cubic-bezier(.55,0,.1,1), transform .6s cubic-bezier(.55,0,.1,1), visibility .6s cubic-bezier(.55,0,.1,1);
}
#modal.active {
    transform: scale(1); visibility: visible; opacity: 1; filter: alpha(opacity=100);
    z-index: 1000; pointer-events: auto; transition: z-index 0s, opacity .6s cubic-bezier(.55,0,.1,1), transform .6s cubic-bezier(.55,0,.1,1);
}

#modal_container {overflow-y: auto; z-index: 1001; top: 0; bottom: 0; left: 0; width: 100%; height: 100%; text-align: left; direction: ltr; position: fixed;}
#modal_overlay {position: absolute; width: 100%; min-height: 100%; height: 100%; left: 0; top: 0; display: flex; align-items: center;}

.modal_close {
    width: 24px; height: 24px; display: flex; align-items: center; -webkit-justify-content: center;
    position: absolute; top: -40px; right: -40px; cursor: pointer; z-index: 3; transition: .3s ease-in-out;
}
.modal_close > i {color: #525866; transition: .3s ease-in-out; font-size: 24px;}
.modal_close:hover > i {color: #A0A5B3;}

#modal_content {position: relative; height: auto; margin: 55px auto 55px;}

@media only screen and (max-width: 1024px) {
    .modal_close {right: 0;}
}

/* ------------------------------- REQUEST MODAL ------------------------------- */

#request {max-width: 450px; margin: 150px auto 135px; display: flex;}
#request_modal {height: 100%; max-width: 450px; margin: 0 auto; display: flex;}
.request_modal {display: flex; flex-direction: column; -webkit-justify-content: center;}
.request_modal > div {display: none; position: relative;}
.request_modal > div.active {display: block;}
.request_modal > div > .btn_primary {margin: 24px auto 0;}
.request_modal .input_group {margin-top: 50px;}
.request_modal .input_group ~ .input_group {margin-top: 24px;}
.request_title {font-size: 48px; font-weight: 500; text-align: center; font-family: 'CormorantGaramond', sans-serif;}
.request_desc {font-size: 16px; text-align: center; margin-top: 27px;}
.success_message {margin-top: 76px;}
.success_message > img {width: 64px; height: 64px; margin: 0 auto; display: block;}
.success_message > p {margin-top: 24px; text-align: center;}
.request_socials {margin-top: 50px;}
.request_socials > p {text-align: center;}
.request_socials > div {display: flex; align-items: center; -webkit-justify-content: center; margin-top: 24px;}
.request_socials > div > a > i {font-size: 32px; color: #1A1919; display: block;}
.request_socials > div > a > i::before {margin-right: 0; margin-left: 0;}
.request_socials > div > a {margin-right: 32px; width: 32px; height: 32px;}
.request_socials > div > a:last-child {margin-right: 0;}

@media only screen and (max-width: 1024px) {
    #request {margin: 95px auto 75px;}
    .request_modal {padding: 0 16px;}
    .request_title {letter-spacing: -0.05em;}
}

/* ------------------------------- ICONS ------------------------------- */

[class^="icon_"]:before, [class*=" icon_"]:before {
    font-family: "glyphicons"; font-style: normal; font-weight: normal; speak: never;
    display: inline-block; text-decoration: inherit; width: 1em; margin-right: .2em; text-align: center;
    font-variant: normal; text-transform: none; line-height: 1em; margin-left: .2em;
    -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
}

.icon_unlock:before { content: '\e800'; }
.icon_x:before { content: '\e801'; }
.icon_close:before { content: '\e802'; }
.icon_inst:before { content: '\e803'; }
.icon_tg:before { content: '\e804'; }
.icon_discord:before { content: '\e805'; }
.icon_success:before { content: '\e806'; }
.icon_arrow:before { content: '\e807'; }

/* ------------------------------- MENU ------------------------------- */

#menu {padding: 12px 0; background: #FFFFFF; position: sticky; top: 0; z-index: 100; border-bottom: 1px solid transparent; transition: border-bottom .3s ease-in-out, background .3s ease-in-out;}
#menu.sticky {border-bottom: 1px solid #1A1919; background: #FFFFFF;}

.menu {display: flex; align-items: center;}
.menu > .logo {max-width: 89px; min-width: 89px; width: 16%; margin-right: auto; transition: filter .3s ease-in-out;}
.menu > .logo > img {display: block;}
.menu > .menu_links {display: flex; align-items: center; padding: 0 20px; margin-right: auto;}
.menu > .menu_links > div {margin-right: 55px; cursor: pointer; font-size: 16px; color: #1A1919; transition: all .3s ease-in-out;}
.menu > .social_links {display: flex; align-items: center;}
.menu > .social_links > a {
    display: block; color: #1A1919; font-size: 24px; width: 24px;
    height: 24px; margin-right: 32px; transition: color .3s ease-in-out;
}
.menu > .btn_primary {margin-left: 10px; height: 46px;}

#menu.open {background: #253D2F; border-bottom: 1px solid #FFFFFF;}

@media only screen and (max-width: 1400px) {
    .menu > .menu_links > div {margin-right: 20px;}
}

@media only screen and (max-width: 1200px) {
    .menu > .phone {display: none;}
    .menu > .social_links {margin-right: 0;}
    .menu > .btn_primary {display: none;}
    .menu > .menu_links > div {font-size: 16px;}
}

@media only screen and (max-width: 1024px) {
    #menu {padding: 12px 0; height: 61px;}
    .menu {padding: 0;}
    .menu > .menu_links {display: none;}
    .menu > .social_links > a {width: 24px; height: 24px; font-size: 24px; margin-right: 16px;}
    .menu > .btn_primary {display: flex; height: 40px; font-size: 16px; padding: 0 16px;}
}

@media only screen and (max-width: 360px) {
    .menu > .social_links > a {width: 30px; height: 30px; font-size: 30px; margin-right: 4px;}
}

/* ------------------------------- MAIN ------------------------------- */

#main {position: relative; height: calc(100vh - 71px); min-height: 865px; padding-top: 74px;}
#main > video {width: 100%; height: 100%; object-fit: cover; position: absolute; top: 0; left: 0;}
#main > .wrap {position: relative; z-index: 2;}
#main::after {
    content: ""; position: absolute; top: 0; left: 0; z-index: 1;
    width: 100%; height: 100%; background: linear-gradient(360deg, rgba(12, 14, 23, 0.9) 0%, rgba(12, 14, 23, 0.09) 100%);
}
#main .info > h1 {font-size: 82px; font-weight: 700; font-family: 'CormorantGaramond', sans-serif; color: #FFFFFF; max-width: 800px;}
#main .info > .desc {font-size: 24px; margin-top: 46px; color: #FFFFFF;}
#main .info > .counts {display: flex; align-items: center; margin-top: 85px;}
#main .info > .counts > p > span {font-size: 82px; font-weight: 700; font-family: 'CormorantGaramond', sans-serif; margin-right: 24px;}
#main .info > .counts > p {font-size: 24px; color: #FFFFFF;}
#main .info > .counts > div {margin: 0 65px; height: 75px; width: 1px; background: #FFFFFF;}
#main .info > .btn_group {margin-top: 100px; display: flex;}
#main .info > .btn_group > button {margin-right: 32px;}

@media only screen and (max-height: 800px) {
    #main {min-height: 650px; padding-top: 50px;}
    #main .info > .desc {margin-top: 20px;}
    #main .info > .counts {margin-top: 25px;}
    #main .info > .btn_group {margin-top: 50px;}
}

@media only screen and (max-width: 1024px) {
    #main {padding-top: 18px; padding-bottom: 34px; min-height: 645px; height: calc(100vh - 60px);}
    #main .wrap {height: 100%;}
    #main .main {height: 100%;}
    #main .info {flex-direction: column; display: flex; height: 100%;}
    #main .info > h1 {font-size: 54px;}
    #main .info > .desc {font-size: 20px; margin-top: 20px;}
    #main .info > .counts {margin-top: 25px;}
    #main .info > .counts > p > span {font-size: 54px; margin-right: 20px;}
    #main .info > .counts > p {font-size: 20px;}
    #main .info > .counts > div {height: 43px; margin: 0 16px;}
    #main .info > .btn_group {margin-top: auto; flex-direction: column;}
    #main .info > .btn_group > button {margin-right: 0; width: 100%; margin-top: 24px;}
}

/* ------------------------------- ABOUT ------------------------------- */

#about {margin-top: 113px; position: relative;}
#about > .wrap > p {
    font-size: 32px; font-weight: 500; font-family: 'CormorantGaramond', sans-serif; text-align: center;
    max-width: 1045px; margin: 0 auto;
}
#about .about {margin-top: 130px;}
#about .about > hr {
    display: block; margin: 0; padding: 0; position: absolute; left: 0; width: 100%; height: 1px;
    border-bottom: 1px solid #1A1919; z-index: 2; background: none;
}
#about .about > div {display: flex;}
#about .about > div:nth-of-type(1) > hr {display: none;}
#about .about > div:nth-of-type(1) > div {width: 33.3%; padding: 50px 40px; border-left: 1px solid #1A1919;}
#about .about > div:nth-of-type(1) > div:nth-of-type(1) > p {font-size: 16px; margin-top: 24px;}
#about .about > div:nth-of-type(1) > div:nth-of-type(2) > p {font-size: 16px; margin-top: 75px;}
#about .about > div:nth-of-type(1) > img {
    width: 33.3%; border-left: 1px solid #1A1919; border-right: 1px solid #1A1919;
    display: block; object-fit: cover;
}
#about .about > div:nth-of-type(2) > img {
    width: 33.3%; border-left: 1px solid #1A1919; display: block; object-fit: cover;
}
#about .about > div:nth-of-type(2) > div {
    width: 66.6%; border-left: 1px solid #1A1919; border-right: 1px solid #1A1919;
    padding: 80px 70px 180px; position: relative;
}
#about .about > div:nth-of-type(2) > div > p {font-size: 16px; margin-top: 24px; z-index: 2; position: relative;}
#about .about > div:nth-of-type(2) > div > .btn_group {display: flex; margin-top: 40px; z-index: 2; position: relative;}
#about .about > div:nth-of-type(2) > div > .btn_group > button {margin-right: 32px;}
#about .about > div:nth-of-type(2) > div > img {position: absolute; max-width: 290px; width: 33.3%; bottom: 0; right: 0;}

@media only screen and (max-width: 1024px) {
    #about {margin-top: 55px;}
    #about > .wrap > p {font-size: 32px;}
    #about .about {margin-top: 55px;}
    #about .about > div:nth-of-type(1) {flex-wrap: wrap;}
    #about .about > div:nth-of-type(1) > div:nth-of-type(1) {width: 100%; border-left: none; padding: 25px 0 55px;}
    #about .about > div:nth-of-type(1) > div:nth-of-type(2) {width: 50%; border-left: none; padding: 48px 16px 150px 0;}
    #about .about > div:nth-of-type(1) > hr {
        display: block; min-width: calc(100% + 32px); width: calc(100% + 32px); position: relative;
        left: -16px; margin: 0; border-bottom: 1px solid #1A1919;
    }
    #about .about > div:nth-of-type(1) > img {border-left: none; border-right: none; width: 50%; position: relative; left: 16px;}
    #about .about > hr:nth-of-type(3) {display: none;}
    #about .about > div:nth-of-type(2) {flex-direction: column;}
    #about .about > div:nth-of-type(2) > img {width: calc(100% + 32px); left: -16px; position: relative; border-left: none; border-right: none;}
    #about .about > div:nth-of-type(2) > div {width: 100%; border-left: none; border-right: none; padding: 40px 0 0;}
    #about .about > div:nth-of-type(2) > div > .btn_group {flex-direction: column; margin-top: 16px;}
    #about .about > div:nth-of-type(2) > div > .btn_group > button {margin-right: 0; margin-top: 24px; width: 100%;}
    #about .about > div:nth-of-type(2) > div > img {position: relative; width: 100%; max-width: 220px; margin: 40px auto 0; display: block}
}

/* ------------------------------- JOURNEY ------------------------------- */

#journey {margin-top: 100px;}
#journey > .wrap {padding-top: 80px; padding-bottom: 80px;}
#journey > .wrap > h2 {text-align: center;}
#journey > .wrap > p {
    font-size: 16px; text-align: center; max-width: 690px; margin: 24px auto 0;
    letter-spacing: 0;
}
.stage_group {display: flex; margin-top: 72px;}
.stage_group > div {margin-right: 20px;}
.stage_group > div:last-child {margin-right: 0;}
.stage.small {width: 33.3%; padding: 32px; border: 1px solid #1A1919; display: flex; flex-direction: column;}
.stage.small > .head {display: flex; align-items: center;}
.stage.small > .head > .num {font-size: 14px; color: #80838A; margin-right: 24px;}
.stage.small > .head > .desc {font-size: 14px; color: #80838A;}
.stage.small > .title {margin-top: 100px; font-size: 32px; font-weight: 500; font-family: 'CormorantGaramond', sans-serif;}
.stage.small > .desc {margin-top: 12px; font-size: 16px;}
.stage.small > .sub_desc {padding-top: 24px; margin-top: auto; font-size: 16px; color: #80838A;}

.stage.big {width: 100%; padding: 32px; border: 1px solid #1A1919; display: flex;}
.stage.big > div {display: flex; flex-wrap: wrap; width: 66.6%;}
.stage.big > div > .main_info {width: 50%; max-width: 410px; margin-right: auto;}
.stage.big > div > .main_info > .head {display: flex; align-items: center;}
.stage.big > div > .main_info > .head > .num {font-size: 14px; color: #80838A; margin-right: 24px;}
.stage.big > div > .main_info > .head > .desc {font-size: 14px; color: #80838A;}
.stage.big > div > .main_info > .title {margin-top: 30px; font-size: 48px; font-weight: 500; font-family: 'CormorantGaramond', sans-serif;}
.stage.big > div > .main_info > .desc {margin-top: 30px;}
.stage.big > div > .additional_info {width: 50%; max-width: 300px; margin-right: auto;}
.stage.big > div > .additional_info > div {margin-top: 60px;}
.stage.big > div > .additional_info > div > .title {font-size: 18px; font-weight: 600;}
.stage.big > div > .additional_info > div > .desc {font-size: 16px; margin-top: 7px;}
.stage.big > div > .foot {flex-direction: column; width: 100%; margin-top: 30px;}
.stage.big > div > .foot > button {max-width: 242px; width: 100%;}
.stage.big > div > .foot > .sub_desc {font-size: 14px; opacity: 0.6; max-width: 250px; margin-top: 20px;}
.stage.big > img {width: 33.3%; min-height: 100%; display: block; object-fit: cover;}

@media only screen and (max-width: 1024px) {
    #journey {margin-top: 55px;}
    #journey > .wrap {padding-top: 55px; padding-bottom: 55px;}
    .stage_group {flex-direction: column; margin-top: 29px;}
    .stage.small {width: 100%; margin-right: 0; margin-top: 26px; padding: 24px;}
    .stage.big {padding: 20px 24px; flex-direction: column-reverse;}
    .stage.big > img {width: 100%;}
    .stage.big > div {width: 100%; margin-top: 16px; flex-direction: column;}
    .stage.big > div > .main_info {width: 100%;}
    .stage.big > div > .additional_info {width: 100%;}
    .stage.big > div > .foot {margin-top: 60px;}
    .stage.big > div > .foot > button {max-width: 400px;}
    .stage.big > div > .foot > .sub_desc {max-width: 400px;}
}

/* ------------------------------- ARTWORKS ------------------------------- */

#artworks {margin-top: 70px; overflow: hidden;}
#artworks > .wrap > h2 {text-align: center;}
#artworks > .wrap > p {text-align: center; margin-top: 24px;}
.artworks > .items {margin-top: 80px;}
.artworks > .items .item {
    padding: 32px 21px; background: #FFFFFF; border: 1px solid #1A1919;
    width: 300px; margin-right: 22px;
}
.artworks > .items .item > .title {font-size: 32px; font-weight: 500; font-family: 'CormorantGaramond', sans-serif;}
.artworks > .items .item > .desc {margin-top: 9px;}
.artworks > .items .item > .date {margin-top: 180px; display: flex; align-items: center; font-size: 14px; color: #1A191999;}
.artworks > .items .item > .date > i {font-size: 16px; color: #80838A; margin-right: 4px;}
.artworks > .progress {margin-top: 80px; display: flex; align-items: center;}
.artworks > .progress > i {font-size: 15px; color: #1A1919; width: 65px; min-width: 65px; cursor: pointer;}
.artworks > .progress > i:nth-of-type(1) {margin-right: 30px; transform: rotate(-180deg);}
.artworks > .progress > i:nth-of-type(2) {margin-left: 30px;}
.artworks > .progress > .progress_bar {width: 100%; height: 2px; background: #E3E3E3; position: relative; top: -1px;}
.artworks > .progress > .progress_bar > .percent {width: 16.66%; height: 100%; background: #1A1919; transition: .3s ease-in-out;}

@media only screen and (max-width: 1024px) {
    #artworks {margin-top: 0;}
    .artworks > .items {margin-top: 55px;}
    .artworks > .items .item {margin-right: 20px; padding: 32px 16px; width: 70%; max-width: 300px;}
    .artworks > .items .item > .date {margin-top: 120px;}
    .artworks > .progress {margin-top: 30px;}
    .artworks > .progress > .progress_bar > .percent {width: 11.11%;}
    .artworks > .progress > i {width: 55px; min-width: 55px; font-size: 12px;}
    .artworks > .progress > i:nth-of-type(1) {margin-right: 10px;}
    .artworks > .progress > i:nth-of-type(2) {margin-left: 10px;}
    .artworks > .progress > .progress_bar {position: relative; top: 1px;}
}

/* ------------------------------- AUCTION ------------------------------- */

#auction {margin-top: 150px;}
#auction > .wrap > .items {margin-top: 100px; display: flex;}
#auction > .wrap > .items > div {width: 25%; margin-right: 94px;}
#auction > .wrap > .items > div:last-child {margin-right: 0;}
#auction > .wrap > .items > div > .head {display: flex; align-items: flex-start; position: relative;}
#auction > .wrap > .items > div > .head > .num {font-size: 80px; line-height: 95%; font-family: 'CormorantGaramond', sans-serif;}
#auction > .wrap > .items > div > .head > i {font-size: 15px; width: 65px; margin-left: auto; margin-top: 40px;}
#auction > .wrap > .items > div > div > .title {margin-top: 48px; font-size: 32px; font-weight: 500; font-family: 'CormorantGaramond', sans-serif;}
#auction > .wrap > .items > div > div > .desc {margin-top: 8px;}

@media only screen and (max-width: 1024px) {
    #auction {margin-top: 55px;}
    #auction > .wrap > .items {margin-top: 0; flex-direction: column;}
    #auction > .wrap > .items > div {width: 100%; display: flex; align-items: flex-start; margin-top: 55px;}
    #auction > .wrap > .items > div > .head {margin-right: 24px; height: 51px; display: flex; align-items: flex-end; width: 27px;}
    #auction > .wrap > .items > div > .head > i {display: none;}
    #auction > .wrap > .items > div > div > .title {margin-top: 0;}
}

/* ------------------------------- CHARITY ------------------------------- */

#charity {margin-top: 150px;}
.charity {display: flex;}
.charity > img {width: 50%; display: block;}
.charity > div {width: 50%; margin-left: 60px;}
.charity > div > h2 {margin-top: 75px;}
.charity > div > p {margin-top: 17px;}

@media only screen and (max-width: 1024px) {
    #charity {margin-top: 55px;}
    .charity {flex-direction: column;}
    .charity > img {width: 100%;}
    .charity > div {width: 100%; margin-left: 0;}
    .charity > div > h2 {margin-top: 42px;}
}

/* ------------------------------- FOOTER ------------------------------- */

#footer {background: #1A1919;}
.footer {padding: 16px 0; display: flex; align-items: center; color: #FFFFFF;}
.footer > img {width: 89px; max-width: 89px; min-width: 89px; margin-right: 24px;}
.footer > p {font-size: 14px; margin-right: auto;}
.footer > .social_links {display: flex; align-items: center; margin-right: 40px;}
.footer > .social_links > a {
    display: block; color: #FFFFFF; font-size: 24px; width: 24px;
    height: 24px; margin-right: 32px; transition: color .3s ease-in-out;
}
.footer > .btn_primary {height: 46px;}

@media only screen and (max-width: 1024px) {
    .footer {flex-direction: column; align-items: flex-start; padding: 16px 0; position: relative;}
    .footer > p {margin-top: 8px;}
    .footer > .social_links {position: absolute; top: 16px; right: 16px; margin-right: 0;}
    .footer > .social_links > a {width: 24px; height: 24px; font-size: 24px; margin-right: 0; margin-left: 24px;}
    .footer > .btn_primary {margin-top: 24px; max-width: 400px; width: 100%;}
}

/* ------------------------------- MARQUEE ------------------------------- */

.coming_soon {
    width: 100%; overflow: hidden; background: #1A1919; color: #FFFFFF; padding: 8px 0;
    font-size: 16px;
}
.marquee-slider-wrapper {display: flex; position: relative;}
.marquee-slider-slides-wrapper {display: flex; position: relative; white-space: nowrap;}
.marquee-slider-slide {width: fit-content;}

/* ------------------------------- BREADCRUMBS ------------------------------- */

#breadcrumbs {padding-top: 40px;}
.breadcrumbs {display: flex; align-items: center;}
.breadcrumbs > a {font-size: 16px; color: #1A1919; text-decoration: none;}
.breadcrumbs > a:last-of-type {color: #1A1919;}
.breadcrumbs > div {margin: 0 13px; width: 7px; height: 7px; border-radius: 50%; background: #1A1919;}

@media only screen and (max-width: 1024px) {
    #breadcrumbs {padding-top: 60px;}
}

/* ------------------------------- POLICY ------------------------------- */

#policy {padding-top: 80px; padding-bottom: 160px;}
#policy > .wrap > h1 {font-size: 82px; font-weight: 700; color: #1A1919; font-family: 'CormorantGaramond', sans-serif;}
#policy > .wrap p {font-size: 16px; font-weight: 400; line-height: 130%; color: #1A1919; margin-top: 1rem;}
#policy > .wrap p.title {font-weight: 600;}
#policy > .wrap p > a {color: #1A1919;}
#policy > .wrap ul {list-style: disc; padding-inline-start: 20px;}
#policy > .wrap ul li {list-style: disc; color: #1A1919; font-size: 16px;}

@media only screen and (max-width: 1024px) {
    #policy > .wrap > h1 {font-size: 54px;}
    #policy {padding-top: 30px; padding-bottom: 60px;}
}

/* ------------------------------- FLICKITY ------------------------------- */

.flickity-enabled {position: relative;}
.flickity-enabled:focus {outline: none;}

.flickity-viewport {position: relative; height: 100%;}
.flickity-slider {position: absolute; width: 100%; height: 100%;}

/* draggable */

.flickity-enabled.is-draggable {
    -webkit-tap-highlight-color: transparent; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none;
    user-select: none;
}
.flickity-enabled.is-draggable .flickity-viewport {cursor: move; width: 100%; cursor: -webkit-grab; cursor: grab;}
.flickity-enabled.is-draggable .flickity-viewport.is-pointer-down {cursor: -webkit-grabbing; cursor: grabbing;}

/* flickity-button */

.flickity-button {position: absolute; background: #F3F3F3; border: none;}
.flickity-button:hover {background: white; cursor: pointer;}
.flickity-button:focus {outline: none;}
.flickity-button:disabled {opacity: 0; cursor: auto; pointer-events: none;}

.flickity-button-icon {fill: currentColor; color: #232323;}


/* previous/next buttons */

.flickity-prev-next-button {width: 24px; height: 24px; top: 50%; transform: translateY(-50%); background: transparent;}
.flickity-prev-next-button:hover {background: transparent;}
.flickity-prev-next-button:focus {outline: none !important;}
.flickity-prev-next-button.no-svg {color: #777;}
.flickity-prev-next-button.previous {left: -25px;}
.flickity-prev-next-button.next {right: -25px;}

/* page dots */

.flickity-page-dots {
    position: absolute; width: 100%; bottom: -25px; padding: 0; margin: 0; list-style: none; text-align: center; line-height: 1;
}
.flickity-rtl .flickity-page-dots {direction: rtl;}
.flickity-page-dots .dot {
    display: inline-block; width: 10px; height: 10px; margin: 0 8px; background: #333; border-radius: 50%; opacity: 0.25;
    cursor: pointer;
}
.flickity-page-dots .dot.is-selected {opacity: 1;}

/* ------------------------------- SCROLL ------------------------------- */

html.has-scroll-smooth {overflow: hidden;}
html.has-scroll-dragging {-webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}
.has-scroll-smooth body {overflow: hidden;}
.has-scroll-smooth [data-scroll-container] {min-height: 100vh;}
[data-scroll-direction="horizontal"] [data-scroll-container] {height: 100vh; display: inline-block; white-space: nowrap;}
[data-scroll-direction="horizontal"] [data-scroll-section] {
    display: inline-block; vertical-align: top; white-space: nowrap; height: 100%;
}
.c-scrollbar {
    position: absolute; right: 0; top: 0; width: 11px; height: 100vh; transform-origin: center right;
    transition: transform 0.3s, opacity 0.3s; opacity: 0; z-index: 99999;
}
.c-scrollbar:hover {transform: scaleX(1);}
.c-scrollbar:hover, .has-scroll-scrolling .c-scrollbar, .has-scroll-dragging .c-scrollbar {opacity: 1;}
[data-scroll-direction="horizontal"] .c-scrollbar {width: 100%; height: 10px; top: auto; bottom: 0; transform: scaleY(1);}
[data-scroll-direction="horizontal"] .c-scrollbar:hover {transform: scaleY(1.3); }
.c-scrollbar_thumb {
    position: absolute; top: 0; right: 0; background-color: rgba(0, 0, 0, 0.4); width: 7px;
    border-radius: 10px; margin: 2px; cursor: grab;
}
.has-scroll-dragging .c-scrollbar_thumb {cursor: grabbing;}
[data-scroll-direction="horizontal"] .c-scrollbar_thumb {right: auto; bottom: 0;}

.is-inview {opacity: 1; transform: none;}

html.lenis{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto}
.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}
.lenis.lenis-stopped{overflow:hidden}
.lenis.lenis-scrolling iframe{pointer-events:none}
