@font-face {
	font-family: 'Pretendard Variable';
	font-weight: 100 900;
	font-style: normal;
	src: url('../font/PretendardVariable.woff2') format('woff2-variations');
    font-display: swap;
}
.red-hat-display {
  font-family: "Red Hat Display", sans-serif;
  font-optical-sizing: auto;
  font-weight: weight;
  font-style: normal;
}
/* @font-face {
	font-family: 'impact';
	font-weight: 'Regular';
	font-style: normal;
	font-display: swap;
	src: url('../fonts/impact.woff2') format('woff2');
} */

/* ------------------------------------------------------------------------------- */

html {font-size: 62.5%;}

body {
    min-width: 320px;
    font-family: "Pretendard Variable";
    font-weight: 400;
    font-size: 1.6rem;
    scroll-behavior: smooth;
}

* {
    font-family: 'Pretendard Variable';
    font-size: 1.6rem;
    line-height: 1;
    box-sizing: border-box;
}


/* ------------------------------------------------------------------------------- */


.tl {font-weight: 300;}
.tr {font-weight: 400;}
.tm {font-weight: 500;}
.tsb {font-weight: 600;}
.tb {font-weight: 700;}
.teb {font-weight: 800;}
.tbl {font-weight: 900;}
.suit-q {font-family: 'SUIT Variable';}
.impact {font-family: 'impact';}
/* .dr {font-family: "Dinbol-regular";}
.psb {font-family: "Poppins-SemiBold";} */


/* ------------------------------------------------------------------------------- */

/* 기본 노말라이징 */
* {margin: 0; padding: 0; list-style: none; text-decoration: none; color: inherit;}
input:focus, select:focus, textarea:focus {outline: none;}
input, select, textarea {font-family: "Paperlogy"; -webkit-appearance: none; -moz-appearance: none; appearance: none; display: block;}
textarea {resize: none;}
select::-ms-expand {display:none;}
input::-ms-clear, input::-ms-reveal {display: none; width:0; height:0}
input::-webkit-search-decoration, input::-webkit-search-cancel-button, input::-webkit-search-results-button, input::-webkit-search-results-decoration {display:none;}
table {width: 100%; border-collapse: collapse;}
button {border: none; border-radius: 0; background: transparent; display: block; font-size: inherit; cursor: pointer; box-sizing: border-box;}

/* ------------------------------------------------------------------------------- */

/* 옵션 */
body {overflow-x: hidden;}
body.active {overflow-y: hidden;}
.hidden {overflow: hidden;}
.img-box > img {width:100%; display:block;}
.none {display:none;}
.block {display:block;}
.inblock {display:inline-block;}
.inline {display:inline;}
.grid {display:grid;}
.flex {display:flex;}
.inflex {display:inline-flex;}
.ais {align-items: flex-start;}
.aic {align-items: center;}
.aie {align-items: flex-end;}
.jcs {justify-content: flex-start;}
.jcc {justify-content: center;}
.jce {justify-content: flex-end;}
.jcsb {justify-content: space-between;}
.fdc {flex-direction: column;}
.fdcr {flex-direction: column-reverse;}
.fww {flex-wrap: wrap;}
.tdu {text-decoration: underline;}
.tdm {text-decoration: line-through;}
.rel {position: relative;}
.abs {position: absolute;}
.fixed {position: fixed;}
.zi1 {z-index: 1;}
.zi2 {z-index: 2;}
.zi3 {z-index: 3;}
.zi4 {z-index: 4;}
.zi5 {z-index: 5;}
.zi6 {z-index: 6;}
.zi7 {z-index: 7;}
.zi8 {z-index: 8;}
.zi9 {z-index: 9;}
.zi10 {z-index: 10;}
.zi100 {z-index: 100;}
.zi1000 {z-index: 1000;}
.zi10000 {z-index: 10000;}
.xy-middle {top: 50%; left: 50%; transform: translate(-50%,-50%);}
.x-middle {left: 50%; transform: translateX(-50%);}
.y-middle {top: 50%; transform: translateY(-50%);}
.xy-tl {top: 0; left: 0;}
.xy-tr {top: 0; right: 0;}
.xy-bl {bottom: 0; left: 0;}
.xy-br {bottom: 0; right: 0;}
.x-l {left: 0;}
.x-r {right: 0;}
.y-t {top: 0;}
.y-b {bottom: 0;}
.tac {text-align: center;}
.tal {text-align: left;}
.tar {text-align: right;}
.cp {cursor: pointer;}
a {display: block;}

/* ------------------------------------------------------------------------------- */

/* width, height */
.wh100per {width: 100%; height: 100%;}

.w100per {width: 100%;}
.w50per {width: 50%;}

.h100per {height: 100%;}
.h50per {height: 50%;}

/* ------------------------------------------------------------------------------- */

/* margin */
.mgc {margin: 0 auto;}

.mt4 {margin-top: .4rem;}
.mt8 {margin-top: .8rem;}
.mt12 {margin-top: 1.2rem;}
.mt16 {margin-top: 1.6rem;}
.mt20 {margin-top: 2rem;}
.mt24 {margin-top: 2.4rem;}
.mt28 {margin-top: 2.8rem;}
.mt32 {margin-top: 3.2rem;}
.mt36 {margin-top: 3.6rem;}
.mt40 {margin-top: 4rem;}
.mt50 {margin-top: 5rem;}
.mt60 {margin-top: 6rem;}
.mt70 {margin-top: 7rem;}
.mt80 {margin-top: 8rem;}
.mt90 {margin-top: 9rem;}
.mt100 {margin-top: 10rem;}
.mt110 {margin-top: 11rem;}
.mt120 {margin-top: 12rem;}
.mt130 {margin-top: 13rem;}
.mt140 {margin-top: 14rem;}
.mt150 {margin-top: 15rem;}
.mt160 {margin-top: 16rem;}
.mt170 {margin-top: 17rem;}
.mt180 {margin-top: 18rem;}
.mt190 {margin-top: 19rem;}
.mt200 {margin-top: 20rem;}

.mr4 {margin-right: .4rem;}
.mr8 {margin-right: .8rem;}
.mr12 {margin-right: 1.2rem;}
.mr16 {margin-right: 1.6rem;}
.mr20 {margin-right: 2rem;}
.mr24 {margin-right: 2.4rem;}
.mr28 {margin-right: 2.8rem;}
.mr32 {margin-right: 3.2rem;}
.mr36 {margin-right: 3.6rem;}
.mr40 {margin-right: 4rem;}
.mr50 {margin-right: 5rem;}
.mr60 {margin-right: 6rem;}
.mr70 {margin-right: 7rem;}
.mr80 {margin-right: 8rem;}
.mr90 {margin-right: 9rem;}
.mr100 {margin-right: 10rem;}
.mr110 {margin-right: 11rem;}
.mr120 {margin-right: 12rem;}
.mr130 {margin-right: 13rem;}
.mr140 {margin-right: 14rem;}
.mr150 {margin-right: 15rem;}
.mr160 {margin-right: 16rem;}
.mr170 {margin-right: 17rem;}
.mr180 {margin-right: 18rem;}
.mr190 {margin-right: 19rem;}
.mr200 {margin-right: 20rem;}

.mb4 {margin-bottom: .4rem;}
.mb8 {margin-bottom: .8rem;}
.mb12 {margin-bottom: 1.2rem;}
.mb16 {margin-bottom: 1.6rem;}
.mb20 {margin-bottom: 2rem;}
.mb24 {margin-bottom: 2.4rem;}
.mb28 {margin-bottom: 2.8rem;}
.mb32 {margin-bottom: 3.2rem;}
.mb36 {margin-bottom: 3.6rem;}
.mb40 {margin-bottom: 4rem;}
.mb50 {margin-bottom: 5rem;}
.mb60 {margin-bottom: 6rem;}
.mb70 {margin-bottom: 7rem;}
.mb80 {margin-bottom: 8rem;}
.mb90 {margin-bottom: 9rem;}
.mb100 {margin-bottom: 10rem;}
.mb110 {margin-bottom: 11rem;}
.mb120 {margin-bottom: 12rem;}
.mb130 {margin-bottom: 13rem;}
.mb140 {margin-bottom: 14rem;}
.mb150 {margin-bottom: 15rem;}
.mb160 {margin-bottom: 16rem;}
.mb170 {margin-bottom: 17rem;}
.mb180 {margin-bottom: 18rem;}
.mb190 {margin-bottom: 19rem;}
.mb200 {margin-bottom: 20rem;}

.ml4 {margin-left: .4rem;}
.ml8 {margin-left: .8rem;}
.ml12 {margin-left: 1.2rem;}
.ml16 {margin-left: 1.6rem;}
.ml20 {margin-left: 2rem;}
.ml24 {margin-left: 2.4rem;}
.ml28 {margin-left: 2.8rem;}
.ml32 {margin-left: 3.2rem;}
.ml36 {margin-left: 3.6rem;}
.ml40 {margin-left: 4rem;}
.ml50 {margin-left: 5rem;}
.ml60 {margin-left: 6rem;}
.ml70 {margin-left: 7rem;}
.ml80 {margin-left: 8rem;}
.ml90 {margin-left: 9rem;}
.ml100 {margin-left: 10rem;}
.ml110 {margin-left: 11rem;}
.ml120 {margin-left: 12rem;}
.ml130 {margin-left: 13rem;}
.ml140 {margin-left: 14rem;}
.ml150 {margin-left: 15rem;}
.ml160 {margin-left: 16rem;}
.ml170 {margin-left: 17rem;}
.ml180 {margin-left: 18rem;}
.ml190 {margin-left: 19rem;}
.ml200 {margin-left: 20rem;}

/* ------------------------------------------------------------------------------- */

/* padding */
.pt4 {padding-top: .4rem;}
.pt8 {padding-top: .8rem;}
.pt12 {padding-top: 1.2rem;}
.pt16 {padding-top: 1.6rem;}
.pt20 {padding-top: 2rem;}
.pt24 {padding-top: 2.4rem;}
.pt28 {padding-top: 2.8rem;}
.pt32 {padding-top: 3.2rem;}
.pt36 {padding-top: 3.6rem;}
.pt40 {padding-top: 4rem;}
.pt50 {padding-top: 5rem;}
.pt60 {padding-top: 6rem;}
.pt70 {padding-top: 7rem;}
.pt80 {padding-top: 8rem;}
.pt90 {padding-top: 9rem;}
.pt100 {padding-top: 10rem;}
.pt110 {padding-top: 11rem;}
.pt120 {padding-top: 12rem;}
.pt130 {padding-top: 13rem;}
.pt140 {padding-top: 14rem;}
.pt150 {padding-top: 15rem;}
.pt160 {padding-top: 16rem;}
.pt170 {padding-top: 17rem;}
.pt180 {padding-top: 18rem;}
.pt190 {padding-top: 19rem;}
.pt200 {padding-top: 20rem;}

.pr4 {padding-right: .4rem;}
.pr8 {padding-right: .8rem;}
.pr12 {padding-right: 1.2rem;}
.pr16 {padding-right: 1.6rem;}
.pr20 {padding-right: 2rem;}
.pr24 {padding-right: 2.4rem;}
.pr28 {padding-right: 2.8rem;}
.pr32 {padding-right: 3.2rem;}
.pr36 {padding-right: 3.6rem;}
.pr40 {padding-right: 4rem;}
.pr50 {padding-right: 5rem;}
.pr60 {padding-right: 6rem;}
.pr70 {padding-right: 7rem;}
.pr80 {padding-right: 8rem;}
.pr90 {padding-right: 9rem;}
.pr100 {padding-right: 10rem;}
.pr110 {padding-right: 11rem;}
.pr120 {padding-right: 12rem;}
.pr130 {padding-right: 13rem;}
.pr140 {padding-right: 14rem;}
.pr150 {padding-right: 15rem;}
.pr160 {padding-right: 16rem;}
.pr170 {padding-right: 17rem;}
.pr180 {padding-right: 18rem;}
.pr190 {padding-right: 19rem;}
.pr200 {padding-right: 20rem;}

.pb4 {padding-bottom: .4rem;}
.pb8 {padding-bottom: .8rem;}
.pb12 {padding-bottom: 1.2rem;}
.pb16 {padding-bottom: 1.6rem;}
.pb20 {padding-bottom: 2rem;}
.pb24 {padding-bottom: 2.4rem;}
.pb28 {padding-bottom: 2.8rem;}
.pb32 {padding-bottom: 3.2rem;}
.pb36 {padding-bottom: 3.6rem;}
.pb40 {padding-bottom: 4rem;}
.pb50 {padding-bottom: 5rem;}
.pb60 {padding-bottom: 6rem;}
.pb70 {padding-bottom: 7rem;}
.pb80 {padding-bottom: 8rem;}
.pb90 {padding-bottom: 9rem;}
.pb100 {padding-bottom: 10rem;}
.pb110 {padding-bottom: 11rem;}
.pb120 {padding-bottom: 12rem;}
.pb130 {padding-bottom: 13rem;}
.pb140 {padding-bottom: 14rem;}
.pb150 {padding-bottom: 15rem;}
.pb160 {padding-bottom: 16rem;}
.pb170 {padding-bottom: 17rem;}
.pb180 {padding-bottom: 18rem;}
.pb190 {padding-bottom: 19rem;}
.pb200 {padding-bottom: 20rem;}

.pl4 {padding-left: .4rem;}
.pl8 {padding-left: .8rem;}
.pl12 {padding-left: 1.2rem;}
.pl16 {padding-left: 1.6rem;}
.pl20 {padding-left: 2rem;}
.pl24 {padding-left: 2.4rem;}
.pl28 {padding-left: 2.8rem;}
.pl32 {padding-left: 3.2rem;}
.pl36 {padding-left: 3.6rem;}
.pl40 {padding-left: 4rem;}
.pl50 {padding-left: 5rem;}
.pl60 {padding-left: 6rem;}
.pl70 {padding-left: 7rem;}
.pl80 {padding-left: 8rem;}
.pl90 {padding-left: 9rem;}
.pl100 {padding-left: 10rem;}
.pl110 {padding-left: 11rem;}
.pl120 {padding-left: 12rem;}
.pl130 {padding-left: 13rem;}
.pl140 {padding-left: 14rem;}
.pl150 {padding-left: 15rem;}
.pl160 {padding-left: 16rem;}
.pl170 {padding-left: 17rem;}
.pl180 {padding-left: 18rem;}
.pl190 {padding-left: 19rem;}
.pl200 {padding-left: 20rem;}


/* ------------------------------------------------------------------------------- */


/* font-size */
h1, h2, h3, h4, h5, h6 {font-weight: inherit; font-size: inherit;}

.f100 {font-size: 10rem;}
.f90 {font-size: 9rem;}
.f80 {font-size: 8rem;}
.f70 {font-size: 7rem;}
.f60 {font-size: 6rem;}
.f50 {font-size: 5rem;}
.f48 {font-size: 4.8rem;}
.f40 {font-size: 4rem;}
.f36 {font-size: 3.6rem;}
.f32 {font-size: 3.2rem;}
.f30 {font-size: 3rem;}
.f28 {font-size: 2.8rem;}
.f27 {font-size: 2.7rem;}
.f26 {font-size: 2.6rem;}
.f25 {font-size: 2.5rem;}
.f24 {font-size: 2.4rem;}
.f23 {font-size: 2.3rem;}
.f22 {font-size: 2.2rem;}
.f21 {font-size: 2.1rem;}
.f20 {font-size: 2rem;}
.f19 {font-size: 1.9rem;}
.f18 {font-size: 1.8rem;}
.f17 {font-size: 1.7rem;}
.f16 {font-size: 1.6rem;}
.f15 {font-size: 1.5rem;}
.f14 {font-size: 1.4rem;}
.f13 {font-size: 1.3rem;}
.f12 {font-size: 1.2rem;}
.f11 {font-size: 1.1rem;}
.f10 {font-size: 1rem;}

.lh100 {line-height: 1;}
.lh110 {line-height: 1.1;}
.lh120 {line-height: 1.2;}
.lh130 {line-height: 1.3;}
.lh140 {line-height: 1.4;}
.lh150 {line-height: 1.5;}
.lh160 {line-height: 1.6;}
.lh170 {line-height: 1.7;}
.lh180 {line-height: 1.8;}
.lh190 {line-height: 1.9;}
.lh200 {line-height: 2;}

/* ------------------------------------------------------------------------------- */

/* 스크롤 타입 */
.scr-type-1 {
    overflow-x: auto;
    overflow-y: auto;
}
.scr-type-1::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}
.scr-type-1::-webkit-scrollbar-thumb {
    border-radius: 4px;
    background: #333;
}
.scr-type-1::-webkit-scrollbar-track {
    border-radius: 4px;
    background: #999;
}

/* ------------------------------------------------------------------------------- */

/* 스와이퍼 */

/* 기본 */
.swiper {
    width: 100%;
    height: 100%;
}
.swiper .swiper-slide {
    text-align: center;
    font-size: 18px;
    background: #fff;
    /* Center slide text vertically */
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}
.swiper .swiper-slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* 페이지네이션 */
.swiper-pagination {
    bottom: -50px !important;
    z-index: 2 !important;
}
.swiper-pagination .swiper-pagination-bullet {
    width: 10px !important;
    height: 10px !important; 
    background: #2B2B2B !important;
    /* opacity: 0.1 !important; */
    opacity: 1 !important;
    margin: 0 4px !important;
}
.swiper-pagination .swiper-pagination-bullet-active {
    /* opacity: 0.5 !important; */
    opacity: 1 !important;
    background: #6F6F6F !important;
}

/* 이전, 다음 버튼 */
.swiper-button-prev,
.swiper-button-next {
    transform: translateY(-50%);
    width: 65px !important;
    height: 65px !important;
    margin-top: 0 !important;
    z-index: 2 !important;
}
.swiper-button-prev {
    left: -150px !important;
    right: auto !important;
}
.swiper-button-next {
    left: auto !important;
    right: -150px !important;
}
.swiper-button-prev::after, 
.swiper-button-next::after {
    display: none !important;
}
.swiper-button-prev::before,
.swiper-button-next::before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
}
.swiper-button-prev::before {
    background: url(../img/prev-btn.svg)no-repeat center/cover;
}
.swiper-button-next::before {
   background: url(../img/next-btn.svg)no-repeat center/cover;
}

.swiper-button-prev:hover::before {
    background: url(../img/prev-btn-hover.svg)no-repeat center/cover;
}
.swiper-button-next:hover::before {
   background: url(../img/next-btn-hover.svg)no-repeat center/cover;
}



.swiper-button-prev-2 {
    left: 50px !important;
    right: auto !important;
}
.swiper-button-next-2 {
    left: auto !important;
    right: 50px !important;
}