@import url('reset.css');

.hgg *,.hgg{
  font-family: 'HGGGothicssi';
  font-weight: 400;
  letter-spacing: -1px
}
.hgg .bold *,.hgg .bold{font-weight: 700}
:root{
  --main:#F8F6DE;
  --main3:#0081C5;
  }

.container{    margin: 0 auto;
    width: 100%;
    max-width: 1280px;
    min-width: 1280px;
    position: relative;
    overflow: hidden;}
.container.visible {overflow:visible;}
.flex{display: flex}
.text_center{text-align: center}
.white *{color:#fff}
img{max-width: 100%}

.btn{border-radius: 100px;display: inline-block;width:200px;height: 60px;line-height: 60px;
  font-size: 16px;text-align: center;cursor: pointer;}

/* header */
.header-wrap {
  width: 100%;
  height: 100px;
  z-index: 9999;
  transition: all 0.3s;
  position: fixed;
  left: 0px;
  top: 0px;
}
.header-wrap .header{width: 100%;display: flex;align-items: center;justify-content: space-between;height: 100px;
  max-width: 100%;min-width: inherit;padding: 0 30px;transition: all 0.4s;z-index: 2}
.header-wrap .header>*{z-index: 2}
.header-wrap .hd_logo {
  width: 219px;
  height: 50px;
  background:url('/img/common/logo_c.svg') center center no-repeat;
}
.header-wrap .gnb_w{height: 100%;padding: 20px 0; position: absolute;
    min-width: 780px;
  left: 50%;transform: translateX(-50%);}
.header-wrap .hd_rt p{width:60px;height: 60px;border-radius: 100%;background: #3796F4;box-shadow: 0px 0px 4px 0px #00000029;;
display: inline-flex;align-items: center;justify-content: center}
.header-wrap #gnb {
  display: flex;
  align-items: center;
  gap:65px;
  background: #fff;
  box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.15);
backdrop-filter: blur(10px);
border-radius: 100px;
height: 70px;
padding: 0 60px;
}

.header-wrap #gnb .main_menu {
  text-align: center;
  height: 100%;
line-height: 70px;
}
.header-wrap #gnb .main_menu>a {
  display: block;
  font-size: 16px;
  font-weight: 500;
}

.header-wrap .sub_wrap_menu{position: fixed;background: #EDEDED;width:100%;top:50px;left:0;
  z-index: 1;height: 360px;border-radius: 0 0 20px 20px;display: none;}
.header-wrap .sub_wrap_menu::before{display: inline-block;content: '';width:100%;height: 50px;background: #EDEDED;left:0;
  position:absolute;top:0;z-index: -1}
.header-wrap .sub_wrap_menu .flex{height: 100%;padding-top: 53px;max-width: 1065px; min-width: 1065px;}
.header-wrap .sub_wrap_menu .flex div{height: 100%;text-align: center;padding-top: 53px;flex:1 1 auto;width:20%}
.header-wrap .sub_wrap_menu .flex div + div{border-left:solid 1px #CBCBCB;}
.header-wrap .sub_wrap_menu .flex div .font18{font-weight: 700;margin-bottom: 30px;font-size: 18px;letter-spacing: 0px}
.header-wrap .sub_wrap_menu .flex div ul li{font-size: 16px;line-height: 38px}
.header-wrap .sub_wrap_menu .flex div ul li a{width:100%;letter-spacing: 0px}
.header-wrap.fixed .header{overflow: visible;}
.header-wrap.fixed .header::before{
  display: inline-block;
  content: '';
  width:100%;
  height:100px;
  background: #fff;
  box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
  position: absolute;
  left:0;top:0;z-index: 2;
}
.header-wrap.fixed .hd_logo{background-image:url('/img/common/logo_c.svg')}
.header-wrap.fixed .gnb_w{padding: 0;}
.header-wrap.fixed #gnb{background:none;box-shadow: none;height: 100%;backdrop-filter: none;}
.header-wrap.fixed #gnb .main_menu{line-height: 100px}
.header-wrap.fixed #gnb .main_menu>a{color:#2C2C2C}
.header-wrap.hide .gnb_w{opacity: 0}
.header-wrap.hide .header::before{display: none}

.footer{background: #2D3138;width:100%;padding: 60px 0 0;background-size: cover;z-index: 2;position: relative;border-radius: 60px 60px 0 0;    margin-top: -70px;}
.footer *{color:#C9C7C5;font-size: 14px}
.footer .container{display: flex;justify-content: space-between;gap:75px}

.footer .summary_wrap p{font-size: 18px;color:#fff;font-weight: 700;margin-bottom: 30px;display: flex;align-items: center;gap:9px;line-height: 1}
.footer .summary_wrap p.cont{font-size: 18px}
.footer .summary_wrap>div+div{margin-top: 40px}
.footer .summary_wrap>div:first-child p.cont{font-size: 45px;font-weight: 700;line-height: 1}
.footer .summary_wrap>div:nth-child(2) p.cont *{font-size: 18px;font-weight: 500;letter-spacing: 2px}
.footer .summary_wrap>div:nth-child(2) p.cont b{min-width: 96px;margin-right: 36px;display: inline-flex;justify-content: space-between;}

.footer .info_wrap{width: 370px;}
.footer .info_wrap .info div{width:100%;line-height: 1;display: flex;}
.footer .info_wrap .info div+div{margin-top: 24px;}
.footer .info_wrap .info div>span:first-of-type{font-weight: 700;color:#fff;flex:1;font-size: 18px;letter-spacing: -1px}
.footer .info_wrap .info div>span:last-of-type{font-weight: 300;margin-left: 30px;flex:2;font-size: 18px}
.footer .info_wrap .sns{display: flex;gap:16px;margin-top: 85px}
.footer .info_wrap .sns a{width:50px;height: 50px;border-radius: 100%;display: inline-flex;align-items: center;justify-content: center;}

.footer .ft_bottom{border-top:1px solid rgba(255, 255, 255, 0.2);position: relative;margin-top: 50px}
.footer .ft_bottom .container{display: flex;align-items: center;justify-content: space-between;height: 100px}
.footer .ft_bottom p{color:#A2A9AD;line-height: 1;}
.footer .ft_bottom .ft_btn{display: flex;gap:25px;align-items: center}
.footer .ft_bottom .ft_btn a{color:#A2A9AD;}
.footer .ft_bottom .brand_site{background: var(--main);height: 40px;line-height: 40px;padding: 0 14px;color:#150201;font-weight: 700;border-radius: 300px}
.footer .ft_bottom .brand_site:after{display: inline-block;content: '';background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0.219942 5.16L7.55328 11.8267C7.67994 11.94 7.83994 12 7.99994 12C8.15994 12 8.31994 11.94 8.44661 11.8267L15.7799 5.16C15.9866 4.97333 16.0533 4.68 15.9533 4.42667C15.8533 4.16667 15.6066 4 15.3333 4H0.666609C0.393275 4 0.146608 4.16667 0.0466089 4.42667C-0.0533905 4.68 0.0132751 4.97333 0.219942 5.16Z' fill='%23989680'/%3E%3C/svg%3E%0A");width:16px;height: 16px;margin-left: 16px;vertical-align: middle;}

.ft_bottom .brandBtn {width:100%; height:40px; background:#F8F6DE;position:relative; z-index:5; padding:0 14px; border-radius:80px; position:relative; cursor:pointer;}
.ft_bottom .brandBtn:after {display: inline-block;content: '';background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0.219942 5.16L7.55328 11.8267C7.67994 11.94 7.83994 12 7.99994 12C8.15994 12 8.31994 11.94 8.44661 11.8267L15.7799 5.16C15.9866 4.97333 16.0533 4.68 15.9533 4.42667C15.8533 4.16667 15.6066 4 15.3333 4H0.666609C0.393275 4 0.146608 4.16667 0.0466089 4.42667C-0.0533905 4.68 0.0132751 4.97333 0.219942 5.16Z' fill='%23989680'/%3E%3C/svg%3E%0A");width:16px;height: 16px;margin-left: 16px;vertical-align: middle;
position:absolute; top:50%; transform:translateY(-50%) rotate(180deg); right:13px;}
.ft_bottom .brandBtn p {
font-weight: 700;
font-style: Bold;
font-size: 14px;
leading-trim: CAP_HEIGHT;
line-height: 40px;
letter-spacing: -3%;
color:#150201;

}
.ft_bottom .brandBtn_wrap {position:relative; width:134px;}
.ft_bottom .brandBtnlist_wrap {position:absolute; bottom:0; left:0; border-radius:20px; overflow:hidden; padding-bottom:40px;background:#fff; width:100%; display:none;}
.ft_bottom .brandBtnlist_wrap.active {display:block;}
.ft_bottom .brandBtnlist_wrap li {width:100%;border-top:1px solid #ddd;}
.ft_bottom .brandBtnlist_wrap li:first-child {border-top:0;}
.ft_bottom .brandBtnlist_wrap li a { padding:15px 14px;

font-weight: 700;
font-style: Bold;
font-size: 14px;
leading-trim: CAP_HEIGHT;
line-height: 14px;
letter-spacing: -0.3px;
color:#150201 !important;
display:block;
}
.ft_bottom .brandBtnlist_wrap.active {display:block;}
.ft_bottom .brandBtn.active:after {transform:translateY(-50%) rotate(0deg); margin-top:1px;}

/* 
.layerPop-overlay {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
  z-index: 10000;
  display: none;
}

.layerPop-wrap {
  margin: 0 auto;
  max-width: 1280px;
  position: fixed;
  height: 100%;
  top: 100px;
  z-index: 10001;
  left: 50%;
  transform: translate(-50%);
  text-align: center;
  display: none;
}

.layerPop-wrap .layerPopTop {
  position: relative;
  top: 0;
  right: 0;
  display: block;
  margin-bottom: 16px;
  display: flex;
align-items: center;
justify-content: end;
}

.layerPop-wrap .layerPopTop .label {
  width: auto;
  color: #D7D7D7;
}

.layerPop-wrap .layerPopTop button {
  background: none;
  cursor: pointer;
  vertical-align: text-bottom;
  margin-left: 10px
}

.layerPop-wrap .layerPopCont {
  display: grid;
  grid-template-columns: repeat(4, auto)
}

.layerPop-wrap .layerPop {
  display: inline-block;
  margin-right: 12px;
  width: 311px;
  box-shadow: rgba(0, 0, 0, 0.1) 5px 10px 2px;
  padding: 0px;
  border-radius:12px;
  overflow: hidden
}

.layerPop-wrap .layerPop>a,
.layerPop-wrap .layerPop>p {
  overflow: hidden;
  display: block;
}

.layerPop-wrap .layerPop .popup-bt {
  background: #edf1f3;
  display: flex;
  overflow: hidden;
}

.layerPop-wrap .layerPop .popup-bt>a {
  width: 50%;
  display: block;
  padding: 10px 0;
  text-align: center;
  font-weight: 500;
  border: solid 1px #dddddd;
  font-size: 14px
}

.layerPop-wrap .layerPop1>a>img {
  width: 100%;height: 100%;object-fit: cover;
} */

.sub_popup {
	display:none;
	overflow-x: hidden;
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	z-index: 999999;
	background: rgba(36 36 36 / 50%)
}
.sub_popup .subPopup_wrap{
	position: absolute;
	background: #fff;
	padding: 40px 40px 50px;
	z-index: 1000;
	width: 800px;
	border-radius:12px;
	transform: translate(-50%, -50%);
	left: 50%;
	top: 50%;
}
@media (max-height:1200px){
	.sub_popup .subPopup_wrap {
	top:20px;
	transform: translate(-50%, 0);
	}
	.sub_popup .AgreePop_wrap {
		transform: translate(-50%, -50%);
		left: 50%;
		top: 50%;
	}
}
.sub_popup .subPopupClose {
	text-indent:-9999px;
	overflow:hidden;
	background:transparent;
	cursor:pointer;
	background:url("/sub/img/03/02_subPopupClose.png")no-repeat center;
	width:50px; height:50px;
}

.sub_popup .AgreePop_wrap {height:490px;}
.sub_popup .AgreePop .title {display:flex; justify-content:space-between; align-items:center; padding-bottom:20px;}
.sub_popup .AgreePop .title h3 {

font-family: var(--korean03);
font-weight: 400;
font-style: 80g;
font-size: 40px;
leading-trim: NONE;
line-height: 70px;
letter-spacing: -0.6px;
}
.sub_popup .AgreePop .agree_wrap {background: #FBFBFB; border: 1px solid var(--stroke, #DDDDDD);
height:316px; overflow-y:auto; border-radius:8px; padding:30px 33px;
}