@charset "utf-8";

html{font-size:100px;height: 100%;}
body{overflow: inherit;height: 100%;padding-top: 170px;}
body, input, select, textarea{font-family: 'NotoSansKR', Poppins, Playfair, parta, notokrL, gothamL, '맑은고딕','Malgun Gothic','Dotum','arial','AppleGothic', sans-serif; font-weight: normal; font-style: normal;}
body.on{overflow: hidden;}
.layout{position:relative;margin:0 auto;width:100%;max-width:1400px;}
#wrap{height: 100%;}
.nodata{padding:50px 0;text-align: center;}
.nodata p{margin-top:16px;font-weight: 400;font-size: 12px;line-height: 14px;color:#999;}
.overlay{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.5);z-index: 1000;}

/* margin */
.mt-10{margin-top:-10px !important;}
.mt0{margin-top:0px !important;}
.mt10{margin-top:10px !important;}
.mt30{margin-top:30px !important;}
.mt45{margin-top:45px !important;}
.mt55{margin-top:55px !important;}
.mt58{margin-top:58px !important;}
.mt70{margin-top:70px !important;}
.mb60{margin-bottom:60px !important;}
.mgt35b60{margin-top:30px !important; margin-bottom:60px !important}
.ml46{margin-left:46px !important;}

/* padding */
.pt0{padding-top:0 !important;}
.pt95{padding-top:95px !important;}
.pb0{padding-bottom:0 !important;}
.pdtb60{padding-top:60px !important; padding-bottom:60px !important;}
.pl120{padding-left:120px !important;}

/* dl style */
.dl-type1{}
.dl-type1 dt{clear:left;float:left;}
.dl-type1 dd{width:100%;}
.dl-type1 dd:after {content: "";display: table;clear: both;}

/* text align */
.txt-left{text-align: left !important}
.txt-center{text-align: center!important}
.txt-right{text-align: right !important}

/* color */
.fc-g{color:#888 !important;}
.fc-green{color: #55d670 !important;}
.fc-skyblue{color: #379edf !important;}
.fc-red{color:#ff0000 !important;}

/* paging */
#paging{margin-top:200px;display: flex;gap:7px;justify-content:center;align-items: center;}
#paging a{display: flex;justify-content:center;align-items: center;font-size: 16px;font-weight: bold;letter-spacing: -0.28px;text-align: center;color: #c1c1c1;width:auto;height:30px; padding:0 10px;}
#paging a + a{margin-left:12px;}
#paging a.on{position:relative; color:#000;}
#paging a.on::after{position:absolute; content:''; bottom:3px; width:calc(100% - 16px); height:2px; background:#000;}
#paging .paging-first,
#paging .paging-prev,
#paging .paging-next,
#paging .paging-end{width:30px; padding:0;}
#paging .paging-prev{margin-right:-10px;}
#paging .paging-prev,
#paging .paging-next, 
#paging .paging-end{margin-left:0;}
#paging .paging-prev img{transform:rotate(180deg);}
#paging .paging-prev img, 
#paging .paging-next img, 
#paging .paging-first img,
#paging .paging-end img{display: block; width:auto; height:14px;}


.filebox{display:flex;}
.filebox input[type="file"] {position: absolute;width: 1px;height: 1px;padding: 0;margin: -1px;overflow: hidden;clip:rect(0,0,0,0);border: 0;}
.filebox label {margin-left:30px;display: inline-block;vertical-align: middle;cursor: pointer;width:126px;height:64px;line-height:64px;background:#333;text-align: center;color:#fff;font-size: 18px;font-weight: normal;}
.filebox .upload-name {width: 100%;max-width: calc(100% - 156px);height: 64px;border: 1px solid #ddd;padding: 0 24px;font-size: 16px;font-weight: normal;background:#fff;color:rgba(34,34,34,0.4);}


/* checkbox style */
.checkbox-type1{position:relative;display:inline-block;font-size:0;}
.checkbox-type1 input[type="checkbox"]{position:absolute;opacity:0;}
.checkbox-type1 label{position:relative;display:inline-block;padding-left:40px; font-size: 20px;font-weight: normal;letter-spacing: -0.6px;color: #252525;cursor:pointer;}
.checkbox-type1 label:before{content:"";display:inline-block;width:28px;height:28px;border:1px solid #ccc;border-radius: 100%;position:absolute;left:0;}
.checkbox-type1 label:after {content: "";display: block;position: absolute;top: 4px;left: 10px;width: 8px;height: 15px;border-right: 2px solid #aeaeae;border-bottom: 2px solid #aeaeae;transform: rotate(45deg);}
.checkbox-type1 input[type="checkbox"]:checked + label:before{border-color:#000;background:#000;}
.checkbox-type1 input[type="checkbox"]:checked + label:after{border-color:#fff;}
.checkbox-type1.w100p{display:block; margin-bottom:38px;}

.checkbox-type2{position:relative;display:inline-block;font-size:0;}
.checkbox-type2 input[type="checkbox"]{position:absolute;opacity:0;}
.checkbox-type2 label{position:relative;display:inline-block; border: solid 1px #ddd;background-color: #fff;line-height: 52px;font-size: 18px;color:#222;padding:0 30px;cursor: pointer;}
.checkbox-type2 input[type="checkbox"]:checked + label{background-color: #333;border-color:#333;color:#fff;}



/* radio style */
.radio-type1{position:relative;display:inline-block;font-size:0;}
.radio-type1 input[type="radio"]{position:absolute;opacity:0;}
.radio-type1 label{position:relative;display:inline-block;padding-left:40px; font-size: 20px;font-weight: normal;letter-spacing: -0.6px;color: #252525;cursor:pointer;}
.radio-type1 label:before{content:"";display:inline-block;width:28px;height:28px;border:1px solid #aeaeae;border-radius: 100%;position:absolute;left:0;}
.radio-type1 label:after {content: "";display: block;position: absolute;top: 4px;left: 10px;width: 8px;height: 15px;border-right: 2px solid #aeaeae;border-bottom: 2px solid #aeaeae;transform: rotate(45deg);}
.radio-type1 input[type="radio"]:checked + label:before{border-color:#000;background:#000;}
.radio-type1 input[type="radio"]:checked + label:after{border-color:#fff;}


.tab{display: flex;justify-content: center;gap:40px;}
.tab .button{font-size: 22px;font-weight: normal;letter-spacing: -0.66px;color: #b1b1b1; white-space: nowrap;}
.tab .button.active{position:relative; color:#020202;font-weight:bold;}
.tab .button.active::after{position:aboslute; bottom:0; content:''; display:block; width:100%; height:1px; background:#252525;}


header{position: fixed;top:0;left:0;width:100%;z-index: 1000;padding:50px 0;background:#000;}
header, header .layout{height:100px;}
header .layout{max-width:1540px;;display: flex;align-items: center;justify-content: space-between;}
header .layout{
	max-width:100%;display: block;
}
header .layout .logo{position:relative; z-index:30;display: flex; align-items: center; justify-content: flex-start; height: 100%;}
header .layout .logo {
  position: absolute;
  top: 20px; /* 원하는 상단 여백 */
  left: 50%;
  transform: translateX(-50%);
}
header .layout .logo img{width:260px;}

/* 좌측 상단 */
header .gnb-wrap-left {
  position: absolute;
  top: 20px;
  left: 20px;
}
header .gnb-wrap{display: flex;align-items: center;gap:66px;}
header .gnb-wrap {
  position: absolute;
  top: 20px;       /* 상단 여백 (조정 가능) */
  right: 20px;     /* 우측 여백 (조정 가능) */
  display: flex;align-items: center;gap:16px;
}
header .gnb-wrap .gnb{display: flex;gap:25px;}
header .gnb-wrap .gnb li a{display: block;font-size: 15px;font-weight: normal;letter-spacing: -0.45px;color: #fff;}
header .gnb-wrap .gnb li:hover a{position:relative;}
header .gnb-wrap .gnb li:hover a::after{position:absolute; bottom:0; content:''; display:block; width:100%; height:1px; background:#fff;}
header .gnb-wrap .gnb p{display: block;font-size: 15px;font-weight: normal;letter-spacing: -0.45px;color: #fff;}
header .gnb-wrap .navi-menu{font-size:0;width:45px;height:40px;background: url('../images/ico/ico_navi_02.png') no-repeat;background-size: 45px auto;}
header.scroll{background: #000;}
header.white{background: #fff;border-bottom: 1px solid #c8c8c8;}
/* header.white .logo{z-index:15;} */
header.white .gnb-wrap .gnb li a{color:#252525;}
header.white .gnb-wrap .gnb li:hover a{position:relative;}
header.white .gnb-wrap .gnb li:hover a::after{position:absolute; bottom:0; content:''; display:block; width:100%; height:1px; background:#252525;}
header.white .gnb-wrap .navi-menu{background-image: url('../images/ico/ico_navi_b_02.png');}
header .gnb-wrap .flex-box{display: flex; align-items: center; gap: 30px;}

.lang-wrap{position:relative;}
.lang-wrap .btn-lang{font-size:15px; color:#fff; border-bottom:1px solid #fff; padding-bottom:7px; cursor:pointer;}
.lang-wrap .btn-lang strong{display:inline-block; font-size:inherit; color:inherit; vertical-align:middle;}
.lang-wrap .btn-lang .arrow{display:inline-block; width:15px; height:15px; vertical-align:middle; background:url('/web/kr/images/ico/ico_bottom_w.png') no-repeat center / 15px auto; margin-left:8px;}
.lang-wrap .list{display:none; position:absolute; width: 100%; margin-top: 4px;}
.lang-wrap .list .opt{display:none; width:100%; font-size:15px; color:#000; line-height:30px; text-align:center; background:#fff; cursor:pointer;}
.lang-wrap .list .opt.on{display:block;}
.lang-wrap .btn-lang.on .arrow{transform:rotate(180deg);}
.lang-wrap .btn-lang.on + .list{display:block;}
header.white .lang-wrap .btn-lang{color:#000; border-bottom-color:#000; padding-bottom:7px;}
header.white .lang-wrap .btn-lang .arrow{background-image:url('/web/kr/images/ico/ico_bottom_b.png');}
header.white .lang-wrap .list .opt{color:#fff; background:#000;}

/* 네비게이션 바 */
.navbar {
  background: #000;
  width: 100%;
  height: 80px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 15px;
  font-weight: normal;
  letter-spacing: -0.45px;
  z-index: 1000;
  position: relative;
  margin-top: 100px;
}

/* 메인 메뉴 */
.main-menu {
  display: flex;
  list-style: none;
  gap: 40px;
  padding: 0;
}

.main-menu li a {
  color: #fff;
  text-decoration: none;
  padding: 10px 20px;
  display: block;
  transition: background 0.3s;
}

.main-menu li:hover a {
  background-color: #333;
}

/* 서브메뉴 전체 감싸는 래퍼 */
.tab-content-wrapper {
  display: none;
  background: rgba(255, 255, 255, 0.9); /* 배경을 더 투명하게 (보이도록) */
  padding: 40px 60px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 999;
}

/* 서브메뉴가 보여질 때 */
.tab-content-wrapper.show {
  display: flex;
  justify-content: center;
  gap: 60px;
  flex-wrap: wrap;
}

/* 각 탭 콘텐츠 */
.tab-content {
  display: none;
  gap: 40px;
  flex-wrap: wrap;
  width:100%;
  max-width:1400px;
  border: 0px solid red; /* 디버깅용 */
  height:auto;
  font-size: 18px;
  font-weight: normal;
  letter-spacing: -0.45px;  
}

.tab-content.active {
  display: flex;
}

/* 메뉴 블록 하나 */
.menu-block {
  display: flex;
  align-items: center;  
  justify-content: flex-start; /* 좌측 정렬 */
  flex-direction: row;
  flex-wrap: nowrap;  
  gap: 100px; /* 제목과 리스트 사이의 간격 */
  min-width: 1024px;
  max-width: max-content;
  height:100%;
  width:100%;
  align-content: center;
}

.menu-block h4 {
  font-size: 32px;
  margin: 0;
  color: #000; /* 흰색이 아니라 검정으로 변경하셨네요 */
  white-space: nowrap;
  font-weight: bold;
  margin-top:70px;
  letter-spacing: -1.65px;
}

/* 오른쪽 항목 리스트 (가로 정렬) */
.menu-block ul {
  display: flex; /* 리스트를 수평으로 정렬 */
  gap: 0px; /* 리스트 항목 간 간격 */
  list-style: none;
  margin: 0;
  padding: 0;
  margin-top: 70px;
}

/* li는 상대 위치여야 서브메뉴가 절대 위치 가능 */
.menu-block ul li {
  position: relative;
  min-width: max-content;
  
}

.menu-block li + li::before {
  content: "|";
  margin: 0 14px;
  color: #000;
  font-size: 11px;
  position: relative;
  top: -10%;
}

/* 리스트 항목 */
.menu-block ul li a {
  display: inline-block;
  
  padding: 4px 0;
  color: #000;
  text-decoration: none;
  transition: color 0.2s;
  
}

.menu-block ul li a:hover {
  color: #af6252;
}

/* 하위 서브메뉴 (3차 메뉴) */
.menu-block ul li ul.submenu {
  display: none;
  position: absolute;
  top: -110%;  
  left: 0;
  background: rgba(255, 255, 255, 0.95);
  padding: 10px 20px;
  border-radius: 4px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  flex-direction: row;  
  gap: 0px;             
  white-space: nowrap;
  z-index: 1000;
}



/* 마우스 올리면 보여짐 */
.menu-block ul li:hover ul.submenu {
  display: flex;
}

.menu-block ul li ul.submenu li + li::before {
  content: "|";
  margin: 0 14px;
  color: #000;
  font-size: 11px;
  position: relative;
  top: -10%;
}

/* 서브서브 항목 */
.menu-block ul li ul.submenu li a {
  color: #333;
  font-size: 13px;
  padding: 5px 0;
  text-decoration: none;
  transition: color 0.2s;
}

.menu-block ul li ul.submenu li a:hover {
  color: #af6252;
}


footer{background: #111;}
footer .layout{max-width:1540px;}
footer .f-top{display: flex;height:140px;align-items: center;}
footer .f-bottom{position:relative;padding:50px 0;}
footer .f-bottom nav{display: flex;gap:25px;}
footer .f-bottom nav a{font-size: 14px;font-weight: normal;letter-spacing: -0.42px;color: #fff;}
footer .f-bottom address{margin-top:34px;}
footer .f-bottom address p{display: flex;gap:26px;}
footer .f-bottom address p + p{margin-top:5px;}
footer .f-bottom address p span{position:relative;display:inline-block;font-size: 13px;font-weight: normal;letter-spacing: -0.39px;color: #999;}
footer .f-bottom address p span:before{content: "";position:absolute;top:4px;left:-13px;display: inline-block;width:1px;height:10px;background: #999;}
footer .f-bottom address p span:first-child:before{display: none;}
footer .f-bottom .f-sns{font-size:0;position:absolute;top:0;right:0;display: flex;align-items: center;gap:19px;}
footer .f-bottom .f-sns a + a{margin-left:10px;}
footer .f-bottom .f-sns .site-list{display:none;position: absolute;top: 50%;right: -10px;transform: translateX(100%) translateY(-50%);background: #000;letter-spacing: 0;padding: 6px 10px;border: 1px solid #aaa;}
footer .f-bottom .f-sns .site-list li{}
footer .f-bottom .f-sns .site-list li a{display: inline-block;font-size: 12px;color: #aaa;line-height: 18px;white-space: nowrap;border-bottom: 1px solid transparent;}