@charset "utf-8";
@font-face {
    font-family: 'Hana2';
    src: url('../font/Hana2.0_TTF/Hana2-Light.ttf') format('truetype');
    font-weight: 300; /* Light */
    font-style: normal;
}

@font-face {
    font-family: 'Hana2';
    src: url('../font/Hana2.0_TTF/Hana2-Regular.ttf') format('truetype');
    font-weight: 400; /* Regular */
    font-style: normal;
}

@font-face {
    font-family: 'Hana2';
    src: url('../font/Hana2.0_TTF/Hana2-Medium.ttf') format('truetype');
    font-weight: 500; /* Medium */
    font-style: normal;
}

@font-face {
    font-family: 'Hana2';
    src: url('../font/Hana2.0_TTF/Hana2-Bold.ttf') format('truetype');
    font-weight: 700; /* Bold */
    font-style: normal;
}

@font-face {
    font-family: 'Hana2';
    src: url('../font/Hana2.0_TTF/Hana2-Heavy.ttf') format('truetype');
    font-weight: 900; /* Heavy */
    font-style: normal;
}

* {padding: 0; margin: 0; box-sizing: border-box !important; font-family: 'Manrope', "Noto Color Emoji", sans-serif !important; font-weight: 400; line-height: normal; font-optical-sizing: auto; font-weight: 400; scrollbar-width: thin; scrollbar-color: #225BE4 #fff; --scrollbar-size: 6px;}
.hana-font {font-family: 'Hana2', sans-serif !important;}

html{scroll-behavior: smooth;font-size: 17px;}
html.hidden{overflow: hidden;}
body{font-size: 1rem;}
html, body {line-height: 1.2; color: #000;}
li {list-style: none;}
a {color: inherit; text-decoration: none; display: inline-block; cursor: pointer;}
span{display: inline-block;}
i {font-style: normal;}
button {color: #000; background: inherit; border: none; box-shadow: none; border-radius: 0; padding: 0; overflow: visible; cursor: pointer;}
table {border-collapse: collapse;border-spacing: 0;width: 100%;}
table, th, td {border: none;padding: 0;margin: 0;}
.sound_only,
#skip_to_container,
#skip_to_container a {font-size: 0 !important; height: 0!important;}

@media screen and (min-width: 1921px) {
    html { font-size: 18px; }
}

@media screen and (max-width: 1600px) {
    html { font-size: 17px; }
}

@media screen and (max-width: 1440px) {
    html { font-size: 16px; }
}

@media screen and (max-width: 768px) {
    /* html { font-size: 15px; } */
}

@media screen and (max-width: 600px) {
    /* html { font-size: 14px; } */
}

@media screen and (max-width: 480px) {
    html { font-size: 15px; }
}