:root {
	--color-1: #6A5C3A;
	--color-2: #FFE69B;
	--color-3: #F6F5F2;
	--color-4: #999999;
	--color-5: #D2CCBD;
	--rgb-1: 102,92,58;
	--rgb-2: 255,230,155;
	--font-e: 'Poppins', sans-serif;
	--font-k: 'Noto Sans KR', sans-serif;
}
/* ===============================================================
    * common
=============================================================== */
body {font-family: var(--font-k); font-size: 16px; font-weight: normal; line-height: 1; overflow-x: hidden; color: var(--color-4);}
/* font */
.fonte {font-family: var(--font-e);}
.fontm {font-family: var(--font-k);}
.thin {font-weight: 100;} .exlight {font-weight: 200;} .light {font-weight: 300;} .regular {font-weight: 400;} .medium {font-weight: 500;} .semibold {font-weight: 600;} .bold {font-weight: 700;} .exbold {font-weight: 800;} .fblack {font-weight: 900;}
.ttu {text-transform: uppercase;} .ttc {text-transform: capitalize;} .tal {text-align: left;} .tac {text-align: center;} .tar {text-align: right;}
em {font-style: normal;}
/* title */
.tit1 {font-size: 40px; font-family: var(--font-e); font-weight: 500;}
.tit2 {font-size: 32px; font-family: var(--font-e); font-weight: 500;}
.tit3 {font-size: 24px; font-family: var(--font-e); font-weight: 500;}
.tit4 {font-size: 16px; margin-top: 10px; font-family: var(--font-k); font-weight: 400;}
/* color */
.c1 {color: var(--color-1);}
.c2 {color: var(--color-2);}
.c3 {color: var(--color-3);}
.c4 {color: var(--color-4);}
.c5 {color: var(--color-5);}
.cf {color: #fff;}
/* display */
.width-max {max-width: 1320px; width: 100%; margin: 0 auto; padding: 0 20px;}
.dpb {display: block; width: 100%; height: 100%;}
.dib {display: inline-block;}
.fl {float:left;} .fr {float:right;} .clear:after {content:''; display: block; clear:both;}
.none-pc {display: none;}
/* classed */
.bg-img {background-repeat: no-repeat; background-size: cover; background-position: center; width: 100%; height: 100%;}
.full-img {width: 100%; height: 100%; object-fit: cover;}
.wrap {padding: 100px 0;}
.pct {margin-top: 70px;}
@media (max-width: 992px){
	.none-pc {display: block !important;}
	.none-mo {display: none !important;}
	.tit1 {font-size: 16px;}
	.tit2 {font-size: 20px;}
	.tit3 {font-size: 16px;}
	.tit4 {font-size: 14px;}
	.wrap {padding: 60px 0;}
	.pct {margin-top: 50px;}
	.mot {margin-top: 50px;}
}
/* ===============================================================
    * animate
=============================================================== */
.effect {position: relative; transform: translateY(-50px); opacity: 0; transition: .6s;}
.effect.animate {transform: translateY(0); opacity: 1;}
/* ===============================================================
    * full slide
=============================================================== */
.full-slider {position: relative; width: 100%; height: 1080px;}
.full-container .swiper-slide {position: relative; width: 100%; height: 1080px; overflow: hidden;}
.full-container .swiper-slide img {position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);}
.full-ctrl {position: absolute; z-index: 10; left: 50%; top: 50%; transform: translate(-50%,-50%); display: flex; justify-content: space-between; align-items: center; pointer-events: none;}
.full-ctrl .nav-btn {pointer-events: all; font-size: 40px; color: #fff;}
.nav-btn {cursor: pointer;}
.dot-pager {position: absolute; z-index: 10; left: 0; right: 0; bottom: 40px !important; text-align: center;}
.dot-pager .swiper-pagination-bullet {width: 10px; height: 10px; border: 1px solid #fff; background: none; border-radius: 0; margin: 0 5px !important; opacity: 1; transition: .4s;}
.dot-pager .swiper-pagination-bullet-active {transform: scale(2); background: #fff; margin: 0 10px !important;}
@media (max-width: 992px){
	.full-slider {height: auto;}
	.full-container .swiper-slide {height: auto; padding-bottom: 56.25%;}
	.full-ctrl .nav-btn {font-size: 24px;}
	.dot-pager {bottom: 20px !important;}
	.dot-pager .swiper-pagination-bullet {width: 5px; height: 5px; margin: 0 2px !important}
	.dot-pager .swiper-pagination-bullet-active {margin: 0 4px !important}
}
/* ===============================================================
    * banner
=============================================================== */
.banner {position: relative; width: 100%; height: 530px;}
.banner .tit {position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); text-transform: uppercase;}
@media (max-width: 992px){
	.banner {height: 220px;}
	.banner .tit {font-size: 16px;}
}