@charset "utf-8";
/* NotoSans */
@font-face {
  font-family: "NotoSans";
  font-weight: 200;
  font-display: swap;
  src: url("../fonts/NotoSansKR-Thin.woff") format("woff"),
    url("../fonts/NotoSansKR-Thin.woff2") format("woff2"),
}
@font-face {
  font-family: "NotoSans";
  font-weight: 300;
  font-display: swap;
  src: url("../fonts/NotoSansKR-Light.woff") format("woff"),
    url("../fonts/NotoSansKR-Light.woff2") format("woff2"),
}
@font-face {
    font-family: "NotoSans";
    font-weight: 400;
    font-display: swap;
    src: url("../fonts/NotoSansKR-Regular.woff") format("woff"),
        url("../fonts/NotoSansKR-Regular.woff") format("woff2"),
}
@font-face {
    font-family: "NotoSans";
    font-weight: 500;
    font-display: swap;
    src: url("../fonts/NotoSansKR-Medium.woff") format("woff"),
        url("../fonts/NotoSansKR-Medium.woff2") format("woff2"),
}
@font-face {
    font-family: "NotoSans";
    font-weight: 700;
    font-display: swap;
    src: url("../fonts/NotoSansKR-Bold.woff") format("woff"),
        url("../fonts/NotoSansKR-Bold.woff2") format("woff2"),
}
/* Jalnan */
@font-face {
    font-family: "Jalnan";
    font-display: swap;
    src: url("../fonts/JalnanOTF.otf") format("opentype"),
}

html {font-size: 10px; letter-spacing: 0;}
body {font-family: "NotoSans", sans-serif; color: #000;}

/* font */
.jal {font-family: "Jalnan", sans-serif;}

/* font size */
.fs14 {font-size: 1.4rem}
.fs15 {font-size: 1.5rem}
.fs16 {font-size: 1.6rem}
.fs17 {font-size: 1.7rem}
.fs18 {font-size: 1.8rem}
.fs19 {font-size: 1.9rem}
.fs20 {font-size: 2.0rem}
.fs21 {font-size: 2.1rem}
.fs22 {font-size: 2.2rem}
.fs23 {font-size: 2.3rem}
.fs24 {font-size: 2.4rem}
.fs25 {font-size: 2.5rem}
.fs26 {font-size: 2.6rem}
.fs27 {font-size: 2.7rem}
.fs28 {font-size: 2.8rem}
.fs29 {font-size: 2.9rem}
.fs30 {font-size: 3rem}
.fs31 {font-size: 3.1rem}
.fs32 {font-size: 3.2rem}
.fs33 {font-size: 3.3rem}
.fs34 {font-size: 3.4rem}
.fs35 {font-size: 3.5rem}
.fs36 {font-size: 3.6rem}
.fs37 {font-size: 3.7rem}
.fs38 {font-size: 3.8rem}
.fs39 {font-size: 3.9rem}
.fs40 {font-size: 4.0rem}

/* font color */
.fc0 {color: #fff}
.fc1 {color: #000}
.fc2 {color: #020202;}
.fc3 {color: #2f2f2f;}
.fc4 {color: #131313;}
.fc5 {color: #313131;}
.fc6 {color: #999999;}
.fc7 {color: #444444;}
.fc8 {color: #e72488;}
.fc9 {color: #222222;}

/* font weight */
.fwt100 {font-weight: 100;}
.fwt200 {font-weight: 200;}
.fwt300 {font-weight: 300;}
.fwt400 {font-weight: 400;}
.fwt500 {font-weight: 500;}
.fwt600 {font-weight: 600;}
.fwt700 {font-weight: 700;}
.fwt800 {font-weight: 800;}
.fwt900 {font-weight: 900;}
.fwtbold {font-weight: bold}

/* css */
.block {display: block}
.inblock {display: inline-block;}

.flex {display: flex;}
.row {flex-direction: row}
.column {flex-direction: column;}
.justy_btw {justify-content: space-between;}
.justy_cnt {justify-content: center;}
.justy_ard {justify-content: space-around;;}
.justy_end {justify-content: flex-end;}
.alc {align-items: center;}
.alstart {align-items: flex-start;}
.alend {align-items: flex-end;}
.fxwrap {flex-wrap: wrap}

.abs {position: absolute;}
.fixed {position: fixed;}
.rel {position: relative;}
.x_center {left: 50%; transform: translateX(-50%);}
.y_center {top: 50%; transform: translateY(-50%);}
.w_center {left: 50%; top: 50%; transform: translate(-50%,-50%);}
.g_center {display: grid; place-items: center;}

.t_center {text-align: center}
.t_right {text-align: right;}
.m_center {margin: 0 auto;}
.w100 {width: 100%;}
.h100 {height: 100%;}

.right0 {right: 0}
.left0 {left: 0}
.top0 {top: 0}
.bottom0 {bottom: 0}

.pointer {cursor: pointer;}

.img > img {width: 100%; display: block;}

.pc_view {display: block;}
.mo_view {display: none;}
.mo_view2 {display: none;}
.pc_view_flex {display: flex;}
.pc_view_flex2 {display: flex;}
.mo_view_flex {display: none;}
.none {display: none;}

@media all and (max-width: 1385px){
    .pc_view {display: none;}
    .mo_view {display: block;}
    .pc_view_flex {display: none;}
    .mo_view_flex {display: flex;}
}

@media all and (max-width: 480px){
}

