body{overflow-x: hidden;}
/** 서브 네비게이션 **/
.sub_nav { border-bottom: 1px solid #DEDCDF; background: #FFF; } 
.sub_nav .inner { display: flex; align-items: center; padding:1.6875rem 0;gap: 1.25rem;} 
.sub_nav a.home { display: flex; align-items: center; justify-content: center; width:2.75rem; height:auto; } 

.sub_nav .dropdown { display: flex; align-items: center; position: relative; } 
.sub_nav .dropdown button {color: #8A8989;font-size: 1.125rem;font-weight: 600;line-height: 130%;letter-spacing: -0.045rem;display: flex;align-items: center;gap: 4.8125rem;justify-content: space-between;} 
.sub_nav .dropdown button::after { flex-shrink: 0; width:10px; height:7px; background:url("../../images/sub/ico_select.svg") no-repeat center; transition: transform 0.2s ease; content: ""; } 
.sub_nav .dropdown ul { padding:0.625rem 0; border:1px solid rgba(63, 40, 37, 0.28); position: absolute; top:calc(100% + 1px); left:0; z-index: 100; width:100%; visibility: hidden; background: var(--gray-50, #F8F8F8); opacity: 0; border-radius: 10px; } 
.sub_nav .dropdown ul li a { display: block; padding:0.25rem 1.25rem; font-weight: 500; line-height: 160%; color: #555; letter-spacing: -0.68px; } 
.sub_nav .dropdown ul li a:hover { text-decoration: underline; } 

.sub_nav .dropdown.active button::after { transform: rotate(-180deg); } 
.sub_nav .dropdown.active ul { visibility: visible; opacity: 1; } 

@media screen and (max-width:1024px) { 
  .sub_nav .dropdown { flex:1; } 
  .sub_nav .dropdown button { padding:0 0.625rem; width:100%; font-size: 1.125rem;}
}

@media screen and (max-width:640px) { 
 .sub_nav a.home { width:1.5rem; } 
 .sub_nav .line { margin:0 0.625rem; } 
 .sub_nav .dropdown { flex:1; } 
 .sub_nav .dropdown button { padding:0 0.625rem; width:100%; font-size: 1.125rem;} 
 .sub_nav .dropdown ul li a { padding:0.375rem 1.25rem; font-size: 1.125rem; } 
}

@media screen and (max-width:768px) {
 .sub_nav .inner { flex-wrap: wrap; padding:1rem 0; gap:0;}
 .sub_nav .dropdown button { justify-content: space-between; gap:1rem;font-size: .9375rem;}
 .sub_nav .dropdown ul li a{font-size: .9375rem;}
 
}


/** 쓰리 댑쓰 메뉴 **/
.third_nav_box { padding-top:6.875rem; } 
.third_nav_box button { display: none; align-items: center; justify-content: space-between; padding:0 1.25rem; border: 1px solid #D9D4D3; width:100%; height:42px; background-color: #fff; font-weight: 600; color: var(--gray-900, #1A1A1A); text-align: left; letter-spacing: -0.64px; border-radius: 10px; } 

.third_nav_box .third_nav { display: flex; flex-wrap: wrap; flex-wrap: wrap; border: 1px solid #D7D0C8; overflow: hidden; background: var(--gray-0, #FFF); border-radius: 2.5rem; } 
.third_nav_box .third_nav li { flex:1; border-right:1px solid #D7D0C8; height:8.75rem; } 
.third_nav_box .third_nav li:last-child { border-right:0 none; } 
.third_nav_box .third_nav li a { display: flex; align-items: center; justify-content: center; padding:0.625rem; width:100%; height:100%; font-size: 1.15rem; font-weight: 500; line-height: 170%; text-align: center; letter-spacing: -0.8px; transition: font-size 0.3s; } 

.third_nav_box .third_nav li.active a { background: var(--primary, #D81F36); font-size: 1.3rem; font-weight: 600; color: #FFF; letter-spacing: -0.96px; } 

@media screen and (max-width:768px) { 
 .third_nav_box { padding-top:5.25rem; } 
 .third_nav_box button { display: flex; align-items: center; justify-content: center; padding: 1rem; position: relative; width: 100%; height: 60px; background-color: #402A29; font-size: 1.5rem; font-weight: bold; font-weight: 600; color: #fff; text-align: center; letter-spacing: -0.88px; border-radius: 2.375rem; } 
 .third_nav_box button::after { position: absolute; top:50%; right: 2.5rem; font-size:14px; color:#fff; color:#fff; letter-spacing: -0.88px; content: '▼'; pointer-events: none; cursor: pointer; transform: translateY(-50%); border-radius: 2.375rem; } 
 .third_nav_box button.active + .third_nav { display: flex; } 
 .third_nav_box .third_nav { display: none; flex-direction: column; margin-top:2px; border-radius: 20px; } 
 .third_nav_box .third_nav li { border-bottom:1px solid #D7D0C8; border-right:0 none; height:3.75rem; } 
 .third_nav_box .third_nav li:last-child { border-bottom:0 none; } 
 .third_nav_box .third_nav li.active a { background-color: transparent; background-color: #fafafa; font-size: 1.25rem; color:#000; } 
 
}






/* 타이틀 */
.sub_title{display: flex;gap:20px;flex-direction: column;margin-bottom: 8.75rem;}
.sub_title::before{content: '';display: block;width: 4.375rem;height: 0.125rem;background: #000;}
.sub_title p{color: var(--gray-600, #666);font-size: 1.5rem;font-weight: 600;line-height: 100%;letter-spacing: -0.06rem;text-transform: uppercase;}
.sub_title .title{color: var(--gray-000, #000);font-family: "Zalando Sans";font-size: 4rem;font-weight: 700;line-height: 100%;letter-spacing: -0.16rem;text-transform: capitalize;}

@media screen and (max-width:1420px) {
 .sub_title { margin-bottom: 6rem; }
 .sub_title .title { font-size: 3.5rem; }
}

@media screen and (max-width:1024px) {
 .sub_title { gap:16px; margin-bottom: 3.75rem; }
 .sub_title .title { font-size: 3rem; line-height: 1.1; }
}

@media screen and (max-width:768px) {
 .sub_title { margin-bottom: 3rem; }
 .sub_title p { font-size: 1.125rem; }
 .sub_title .title { font-size: 2.25rem; }
}

@media screen and (max-width:400px) {
 .sub_title { gap:12px; margin-bottom: 2.5rem; }
 .sub_title::before { width: 3rem; }
 .sub_title p { font-size: 1rem; }
 .sub_title .title { font-size: 2.1rem; letter-spacing: -0.08rem; }
}


.sub_title02{text-align: center;margin-bottom: 1.25rem;font-size: 3rem;font-weight: 700;letter-spacing: -0.0313rem;padding-top: 2.5rem;}


.content{position: relative;padding-top: 3.75rem;padding-bottom: 9.375rem;overflow-x: hidden;}
.sub_layout{position: relative;}
.sub_layout:after{content: '';display: block;width: 291px;height: 291px;background: url(../../images/sub/sub_bg.svg) no-repeat left center;position: absolute;right: 0;top:130px; animation: subBgFloat 8s  infinite;z-index: -1;}
@keyframes subBgFloat {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform:  rotate(360deg);
  }
}

@media screen and (max-width:1420px) {
 .sub_layout:after { width: 220px; height: 220px; background-size: contain; }
}

@media screen and (max-width:1024px) {
 .content { padding-top: 3.5rem;padding-bottom: 6.25rem;}
 .sub_layout:after { width: 160px; height: 160px; background-size: contain; top: 124px; }

 .sub_title02{padding-top: 3.5rem;font-size: 1.5rem;}

}

@media screen and (max-width:768px) {
 .content { padding-top: 3rem;padding-bottom: 4.375rem; }
 .sub_title02{padding-top: 3rem;}
}

@media screen and (max-width:400px) {
 .inner { width: calc(100% - 28px); }
 .content { padding-top: 2.5rem;}
 .sub_layout:after { width: 120px; height: 120px; }
 .sub_title02{padding-top: 2.5rem;}
}

/* 공통 텍스트 */
.cont_title{color: var(--gray-750, #404040);text-align: center;font-size: 2.625rem;font-weight: 600;line-height: 140%;letter-spacing: -0.105rem;text-transform: uppercase;margin: 6.25rem 0;word-break: keep-all;}

html[lang="en"]  .cont_title{word-break: keep-all;text-transform: capitalize !important;}
html[lang="en"]  .cont_title br{display: none;}
@media screen and (max-width:1420px) {
 .cont_title { margin: 4.5rem 0; font-size: 2.25rem; }
}

@media screen and (max-width:1024px) {
 .cont_title { margin: 3.5rem 0; font-size: 1.85rem; }

}

@media screen and (max-width:768px) {
 .cont_title { margin: 3rem 0; font-size: 1.375rem;word-break: keep-all; }
 .cont_title br { display: none; }
}

@media screen and (max-width:400px) {
 .cont_title { margin: 2.5rem 0; font-size: 1.35rem; }
}

/* box style */
.gray_border_box{border: 1px solid #E5E5E5;background: #FFF;padding: 3.75rem;border-radius: 1.875rem;}
.img_wrap{text-align: center;}
.img_wrap img{max-width: 100%;}

@media screen and (max-width:1420px) {
 .gray_border_box { padding: 2.75rem; }
}

@media screen and (max-width:1024px) {
 .gray_border_box { padding: 2rem; }
}

@media screen and (max-width:768px) {
 .gray_border_box { padding: 1.5rem; }
}

@media screen and (max-width:400px) {
 .gray_border_box { padding: 1rem; }
}

/* flex */
.flex_wrap{display: flex;gap: 3.125rem;}

@media screen and (max-width:1420px) {
 .flex_wrap { gap: 2.25rem; }
}

@media screen and (max-width:1024px) {
 .flex_wrap { flex-direction: column; gap: 2rem; }
}

.bold{font-weight: 600;}

/* table style */
.table_style01{border-top: 2px solid #000;table-layout: fixed;width: 100%;}
.table_style01 caption{position: absolute;left: -9999px;width: 0;height: 0;overflow: hidden;}
.table_style01 tr{border-bottom: 1px solid #e5e5e5;}
.table_style01 th{font-weight: 700;letter-spacing: -0.05rem;}
.table_style01 td{font-weight: 400;}
.table_style01 th,
.table_style01 td{padding: 1.25rem 0;font-size: 1.125rem;line-height: 180%;letter-spacing: -0.01125rem;}

.table_style02{width: 100%;table-layout: fixed;border-collapse: collapse;text-align: center;}
.table_style02 caption{position: absolute;left: -9999px;width: 0;height: 0;overflow: hidden;}
.table_style02 th,
.table_style02 td{height: 4.25rem;padding: .625rem .9375rem;font-size: 1.125rem;line-height: 140%;letter-spacing: -0.045rem;border-right: 1px solid #d9d9d9;word-break: keep-all;}
.table_style02 th:last-child,
.table_style02 td:last-child{border-right: 0;}
.table_style02 th{background: #999;color: #fff;font-weight: 600;text-align: center !important;}
.table_style02 tbody tr:nth-child(odd){background: #fff;}
.table_style02 tbody tr:nth-child(odd):last-child{border-bottom: 1px solid #d9d9d9;}
.table_style02 tbody tr:nth-child(even){background: #f3f3f3;}
.table_style02 td{color: #000;font-weight: 500;}

@media screen and (max-width:768px) {
 .table_wrap { width: 100%; overflow-x: auto; }
 .table_style02 th,
 .table_style02 td { height: 3.875rem; font-size: 1rem; }
  .table_style01 th,
  .table_style01 td { padding: 1rem 0; font-size: 1rem; }
}

@media screen and (max-width:400px) {
 .table_style01 th,
 .table_style01 td { padding: 1rem 0; font-size: 1rem; }
 .table_style02 { min-width: 360px; }
 .table_style02 th,
 .table_style02 td { height: 3.5rem; padding: .625rem; font-size: .9375rem; }
}





/* 마진 */
.mg80{margin: 5rem 0;}
.mg100{margin: 6.25rem auto;}

@media screen and (max-width:1420px) {
 .mg80 { margin: 4rem 0; }
 .mg100 { margin: 5rem auto; }
}

@media screen and (max-width:768px) {
 .mg80 { margin: 3rem 0; }
 .mg100 { margin: 3.5rem auto; }
}