@charset "UTF-8";

body{position: relative;width:100%;height:100%;}
img {max-width:100%;}

.pc{display:block;}
.mo{display:none;}
@media screen and (max-width:640px){
	.pc{display:none;}
	.mo{display:block;}
}

/* 이미지 */
.img_box > img{width:100%;}

/* 말줄임 */
/* 한줄 */
.ellip {text-overflow: ellipsis;word-break: break-word;white-space: nowrap;overflow: hidden;}
/* 두줄 */
.ellipsis{overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}

/* logo */
.logo{width:150px;}
@media screen and (max-width:640px){
	.logo{width:100px;}
}

/* main_menu */
#header_wrap{background: transparent;position: fixed;left: 0;top: 0;width: 100%;z-index: 100;transition:all .3s;}
#header_wrap.ov{background:#fff;border-bottom:1px solid #e3e3e3;}
#header_wrap .bg{opacity:0;visibility:hidden;position: absolute;top: 81px;left: 0;width: 100%;height: 0;border-bottom: 1px solid #dcdcdc;}
.header_inner{width:100%;height:100%;max-width:1620px;margin:0 auto;padding:0 16px;box-sizing:border-box;display: flex;align-items: center;justify-content: space-between;}
@media screen and (max-width:1024px){
	.header_inner{max-width: 100%;padding:16px 16px;box-sizing:border-box;}
}

/* gnb */
#gnb{width: calc(100% - 400px);}
#gnb > ul{display:flex;width: 100%;margin-left: 4%;justify-content: center;align-items: center;}
#gnb > ul > li {display: flex;align-items: center;justify-content: center;width:120px;height: 80px;padding: 15px;text-align:center;font-size:1.11em;font-weight:600;border-top: 4px solid transparent;box-sizing: border-box;position: relative;}
#gnb > ul > li > a{font-family: 'Poppins';font-weight: 400;}
#gnb > ul > li:nth-child(2) .lnb{left: -4px;width: 270px;}
#gnb > ul > li:hover{border-top: 4px solid #2CA9D0;}
@media screen and (max-width:1024px){
	#gnb{display:none;}
}

/* lnb */
.lnb{opacity:0;visibility:hidden;position:absolute;top:75px;left:20px;width: 360px;height:0;text-align: left;}
.lnb.on{opacity:1;visibility:visible;height:230px;display: flex;align-items: baseline;z-index:55;transition:height .3s ease-in-out, opacity .2s .1s ease-in-out;}
 
.lnb > li {width: 100%;padding: 10px 15px;box-sizing: border-box; }
.lnb > li:first-child {padding-top: 40px;}
.lnb > li > a{font-size: 16px;font-weight: 500;font-family: 'Poppins';}
.lnb > li > a.eng{font-weight: 500;}
.lnb > li:hover > a{color:#2CA9D0;}
.lnb > li > ul > li{padding: 5px 0;box-sizing: border-box;}
.lnb > li > ul > li:first-child{padding-top:10px;}
.lnb > li > ul > li > a{font-size:14px; color:#666;}
.lnb > li > ul > li:hover > a{color:#2CA9D0;}

 


/* lang */
.lang{display:flex;align-items: center;justify-content: flex-end;width: 250px;}
.lang > ul{display:flex;margin-right: 16%;}
.lang > ul > li{padding:0 10px;box-sizing:border-box;position:relative;}
.lang > ul > li:last-child:before{content:'';width:2px;height:13px;background:#a9a9a9;position:absolute;top: 3px;left: -1px;}
.lang > ul > li > a{color:#a9a9a9;font-family: 'Poppins';font-weight: 400;}
.lang > ul > li.on > a {font-weight:700;color:#000;}
.btn_store  {display:inline-block;border:1px solid #000;color:#000;font-size:14px;border-radius:50px;text-align:center;padding: 7px 18px;box-sizing: border-box;transition: all 0.3s ease-out;}






.btn_store:hover{background:#2CA8D0;border:1px solid #2CA8D0;color:#fff;}
@media screen and (max-width:1024px){
	.lang{display:none;}
}

/* gnb 활성화 */
#header_wrap.on .bg{opacity:1;visibility:visible;width:100%;height: 340px;background:#fff;transition:height .3s ease-in-out, opacity .2s .1s ease-in-out;}

/* 모바일 메뉴 */
.btn_mobileMenu{display:none;}
@media screen and (max-width:1024px){
	.btn_mobileMenu{display:block;font-size: 35px;}
}
@media screen and (max-width:640px){
	.btn_mobileMenu{display:block;font-size:25px;margin-top: 3px;}
}

@keyframes fadeInLeft {
	0% {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}
.moblie_menu_wrap{display:none; overflow-x: hidden;}
.moblie_menu_wrap.on{display:block;background:#fff;width: 100%;height: 100vh; padding-top:60px; box-sizing:border-box; z-index: 99;animation: fadeInLeft 0.3s; }
.moblie_menu_wrap.on > .moblie_menu{width: 100%;height: 100%;padding:16px;box-sizing:border-box;}
.moblie_menu_wrap.on .lang{display:block;text-align:right;width:100%;}
.moblie_menu_wrap.on .lang > ul{margin-right: 0;justify-content: flex-end;}
.moblie_menu_wrap.on .lang > ul > li >  a{font-size:1.11em;}
.moblie_menu_wrap.on .mo_menu{font-size:20px;padding-top: 20px;box-sizing:border-box;}
.moblie_menu_wrap.on .mo_menu > li{margin-bottom: 20px;padding-bottom: 20px;border-bottom: 1px solid #555;position:relative;transition:height .3s ease-in-out, opacity .2s .1s ease-in-out;}
.moblie_menu_wrap.on .mo_menu > li:first-child{margin-top:20px;padding-top:20px;}
.moblie_menu_wrap.on .mo_menu > li > a{display: flex;justify-content: space-between;align-items: center;padding: 0 10px;font-weight:600;font-family: 'Poppins';}
.moblie_menu_wrap.on .mo_menu > li > a.eng{font-weight: 600;}
.moblie_menu_wrap.on .mo_menu > li > .lnb{position: initial; display:none}
@media screen and (max-width:1024px){
	
}
@media screen and (max-width:640px){
	.moblie_menu_wrap.on .mo_menu > li:first-child{margin-top:0;padding-top:0;}
}

.moblie_menu_wrap.on .mo_menu > li.on > .lnb   {display:block; opacity: 1;width:100%;height:auto;visibility: visible;transition:height .3s ease-in-out, opacity .2s .1s ease-in-out;}
.moblie_menu_wrap.on .mo_menu > li.on > .lnb > li{padding:5px 25px;}
.moblie_menu_wrap.on .mo_menu > li.on > .lnb > li:first-child{padding-top:20px;}
.moblie_menu_wrap.on .mo_menu > li.on > a > i.xi-angle-down.slideUp:before{content:"\e944";}
.moblie_menu_wrap.on .mo_menu > li.on > .lnb > li > a{font-size: 18px;}
.moblie_menu_wrap.on .mo_menu > li.on > .lnb > li > a > br{display:none;}
.moblie_menu_wrap.on .mo_menu > li.on > .lnb > li > ul > li > a{font-size: 16px;}

.moblie_menu_wrap.on > .moblie_menu > .btn_store{display: flex;align-items: center;justify-content: center;margin: 0 auto;width: 80%;padding: 25px;font-size: 20px;;border: 2px solid;font-weight: 600;}

@media screen and (max-width:640px){
	.moblie_menu_wrap.on > .moblie_menu > .btn_store{width: 80%;padding: 15px 20px;font-size: 17px;}
}
@media screen and (max-width:480px){
	.moblie_menu_wrap.on > .moblie_menu > .btn_store{width: 60%;padding: 10px 20px;font-size: 16px;}
}

/* 버튼 */
/* btn_more */
.btn_more{display:inline-block;float: right;margin-top: 5px;font-size:16px;font-weight:600; color:#000;text-align: right;border-bottom:1px solid transparent;transition:all .3s;}
.btn_more:hover{color:#2CA9D0;border-bottom:1px solid #2CA9D0;}
@media screen and (max-width:640px){
	.btn_more{font-size:14px;float: initial;display: block;text-align: left;width: fit-content;margin-top: 15px;}
}

/* footer */
footer{background:#373738;border-top:30px solid #4a4a4b;color:#fff;font-size:16px;}
footer > .inner{padding:50px 30px 75px;}
.ft_top{border-bottom: 1px solid #9c9c9c;}
.ft_top > .logo{width:100%;}

.ft_wrap{display:flex;margin:40px 0;align-items: flex-end;justify-content: space-between;}
.ft_list{width: 70%;}
.ft_list > div{display:flex;margin-bottom: 10px;flex-wrap:wrap;}
.ft_list > div:last-child{margin-bottom:0;}
.ft_list > div > p{margin-right:2%;padding-right:2%;position:relative;box-sizing:border-box;font-weight:400;}
.ft_list > div > p:after{content:'';position:absolute;top:4px;right:0;width:1px;height:10px;background:#fff;}
.ft_list > div > p:last-child:after{display:none;}
.ft_list > div > p > b{font-weight: 600;margin-right: 10px;}

.ft_sns{width:30%;display: flex;align-items: center;justify-content: flex-end;}
.ft_sns > a{width: 55px;height: 55px;margin-left: 10px;display: flex;align-items: center;justify-content: center;background:#fff;border-radius:50px;}
.ft_sns > a:first-child{margin-left:0;}

.ft_btm{display:flex;align-items: flex-end;padding-top: 40px;}
.ft_btm,
.ft_btm > a{color:#a8a8a8;font-size:14px;}
.ft_btm > a{margin-right:30px;}
.ft_btm > a:hover{text-decoration:underline;}
@media screen and (max-width:1024px){
	footer > .inner{padding: 50px 16px;}
}
@media screen and (max-width:768px){
	.ft_wrap{flex-direction: column;}
	.ft_top > .logo,
	.ft_list,
	.ft_sns{width:100%;text-align:center;}
	.ft_list > div,
	.ft_sns{align-items: center;justify-content: center;}
	.ft_list > div > p{margin-bottom: 5px;}
	.ft_sns{margin-top:30px;}
	.ft_btm,
	.ft_btm > a{text-align: center;}
	.ft_btm{justify-content: center;}
}
@media screen and (max-width:640px){
	footer{border-top: 20px solid #4a4a4b;}
	footer > .inner{padding: 30px 16px;}	
	.ft_wrap{margin: 30px 0;}
	.ft_btm{padding-top:30px;}
	.ft_top > .logo{width: 30%;margin: 0 auto;}
	.ft_list > div > p{font-size:12px;}
	.ft_list > div > p > b{font-weight: 600;}

	.ft_sns > a{width: 45px;height: 45px;}
	.ft_sns > a > img{width:50%;}
	.ft_btm,
	.ft_btm > a{font-size:12px;}
	.ft_btm{flex-direction: column;align-items: center;}
	.ft_btm > a{margin:0;margin-bottom:10px;}
}