/* =========================
 공통
========================= */
::-webkit-scrollbar { width: .4rem; background: transparent; } 
::-webkit-scrollbar-thumb { height: 30%; background: var(--color-point); border-radius: 1rem; } 
::-webkit-scrollbar-track { background: transparent; } 

.vertical-text { position: sticky; bottom: 10.8rem; left: calc(var(--inner-pd) / 2 - .9rem); margin-top: -29rem; color: #817F7F; font-weight: 400; z-index: 2; writing-mode: vertical-rl; text-orientation: mixed; } 
@media all and (max-width:1280px){
 .vertical-text { font-size: 1.3rem; } 
 }
@media all and (max-width:1024px) { /*961까지*/
 .vertical-text { display: none; } 
 }

.inner { width: 100%; max-width: 1920px; margin: auto; padding:0 var(--inner-pd); } 
.icon, .img { display: inline-block; width: auto; max-width: 100%; } 
.img-obj { width: 100%; height: 100%; object-fit: cover; object-position: center; } 
.img-obj-c { width: 100%; height: 100%; object-fit: contain; object-position: center; } 
.txt { word-break: keep-all; } 
.deco { position: absolute; } 
.under { text-decoration: underline; text-underline-offset: 2px; } 
.t-cnt { text-align: center; } 
.t-left { text-align: left; } 
.t-right { text-align: right; } 
.border-ra { border-radius: 1rem; } 
.bx-br { border: 1px solid #E9E9E9; } 
.bx-br1 { border: 3px solid #1F171A; } 

.tit, .tit-b, .tit-s { font-family: var(--font-fm-p); line-height: 1.4; font-weight: 900; } 
.tit { font-size: var(--font-39); } 
.tit-b { color: #221916; font-size: var(--font-46); } 
.tit-s { font-size: var(--font-30); } 

.cl-r { color: var(--color-point); } 

.highlight { position: relative; display: inline-block; font-weight: 600; } 
.highlight::after { content: ""; position: absolute; left: -.5rem; bottom: 0.12em; width: calc(100% + 1rem); height: .7rem; background: linear-gradient( 90deg, #BE9B10 0%, #BE9B10 100% ); z-index: -1; } 
.highlight.feat::after { background: linear-gradient( 90deg, #BE9B10 0%, #BE9B10 100% ); } 
.highlight.inter::after { background: linear-gradient( 90deg, #ec8720 0%, #ec8720 100% ); } 
.highlight.inf::after { background: linear-gradient( 90deg, #B3947A 0%, #B3947A 100% ); } 

.bx-hover { overflow: hidden; } 
.bx-hover img { transition: var(--transi); } 
.bx-hover:hover img { transform: scale(1.05); } 

.swiper-pagination { position: relative; display: flex; gap: 0.8rem; } 
.swiper-pagination-bullet { background: #fff; opacity: .7; transition: var(--transi); } 
.swiper-pagination-bullet-active { width: 2.2rem; border-radius: 2rem; background: #fff; opacity: 1; } 
.swiper-btn { width: 3.4rem; height: 3.4rem; } 
.swiper-button-prev, .swiper-container-rtl .swiper-button-next,
.swiper-button-next, .swiper-container-rtl .swiper-button-prev { position: relative; margin-top: 0; background-image:none; top: auto; left: auto; right: auto; bottom: auto; } 


/* =========================
 HEADER
========================= */
header.header { position: fixed; width: 100%; height: var(--header-hei); background: #fff; z-index: 99; transition: var(--transi); } 
header.header .inner { display: flex; justify-content: space-between; align-items: center; padding: 0 var(--inner-pd); } 
header.header .logo { width: 39rem; height: var(--header-hei); background-image: url("../img/logo_h_c.svg"); background-repeat: no-repeat; background-position: center; background-size: contain; } 
header.header .gnb { display: flex; justify-content: center; line-height: var(--header-hei); text-align: center; } 
header.header .gnb > li { width: auto; cursor: pointer; } 
header.header .gnb > li + li { margin-left: 5.2rem; } 
header.header .gnb > li a { position: relative; display: block; color: #000; font-family: var(--font-fm-p); font-size: var(--font-23); font-weight: 600; transition: var(--transi); } 
header.header .gnb > li:hover > a { color: var(--color-point); } 
header.header .ham-wr { width: 17rem; } 
header.header .ham_menu_btn { display: flex; justify-content: space-between; flex-direction: column; align-items: flex-start; width: 3.5rem; height: 2.4rem; margin-left: auto; cursor: pointer; } 
header.header .ham_menu_btn span { width: 100%; height: 2px; background: #2D2D2D; border-radius: 2px; } 
@media all and (max-width:1280px) {header.header .logo { width: 29rem; } 
 }
@media all and (max-width:1440px) { header.header .ham-wr { width: auto; } 
 }
@media all and (max-width:1024px) { header.header .gnb { display: none; } 
 }
 @media all and (max-width:768px) { header.header .logo { width: 14rem; background-image: url("../img/logo_c.svg"); } 
 }


.ham_menu { display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start; position:fixed; right:0; top:0; width:40vw; height:100vh; padding:3rem 5rem 5rem 5rem; background:#DBE9E5; overflow:hidden; opacity:0; visibility:hidden; transition:.5s; z-index:101; transform:translateX(100%); } 
.ham_menu .gnb { width:100%; margin-top: 1rem; padding-top: 1rem; border-top: 1px solid #b3c8c2; } 
.ham_menu .gnb > li { width:100%; line-height:2; position:relative; cursor: pointer; } 
.ham_menu .gnb > li:after,
.ham_menu .gnb > li:before { content:""; display:block; width:20px; height:1px; position:absolute; right:20px; top:3rem; background:#000; transform:rotate(0deg); transition-duration:0.4s; } 
.ham_menu .gnb > li:after { transform:rotate(0); } 
.ham_menu .gnb > li:before { transform:rotate(90deg); } 
.ham_menu .gnb > li.non:after,
.ham_menu .gnb > li.non:before { display: none; } 
.ham_menu .gnb > li > a, .li-link {  font-size: var(--font-30); font-weight: 600; font-family: var(--font-fm-p); } 
.ham_menu .gnb > li .gnb-depth { display:none; position:relative; max-height: 30rem; padding:1.5rem 2rem; background:rgba(255,255,255,.4); font-size: var(--font-18);  overflow: hidden; overflow-y: scroll; } 
.ham_menu .gnb > li .gnb-depth a { display:block; color: #595959; line-height:1.7; font-weight:400; } 
.ham_menu .gnb > li .gnb-depth a:hover { color: #000; font-weight: 500; } 
.ham_menu .gnb > li .gnb-depth li { margin-left: 2rem; list-style: 'ㅡ '; } 
.ham_menu .gnb > li .gnb-depth li:not(:last-child) { margin-bottom: 0.8rem; } 
.ham_menu .gnb > li .gnb-depth li::marker { margin-right: 1rem;  font-size: 1.6rem; } 
.ham_menu .gnb > li .gnb-depth li.s-tit { margin-left: 0; list-style: none; font-family: 'Abril Fatface'; font-size: var(--font-24); } 
.ham_menu .gnb > li .s-tit:not(:first-child) { margin-top: 1rem; } 
.ham_menu .li-link { width: 100%; margin-top: 1rem; padding-top: 1rem; border-top: 1px solid #b3c8c2; } 
.ham_menu .li-link img { filter: invert(1); } 

.ham_menu .icon_we { width: 13rem;filter: invert(1);} 
.ham_menu .close_ham { display: block; cursor: pointer; } 
.ham_menu .vertical-text { position: absolute; bottom: 3.7rem; left: 1.5rem; top: 3.5rem; margin-top: 0; font-size: var(--font-16); font-weight: 400; } 
.ham_menu .ham-header { width: 100%; } 
.ham_menu.ham_on { opacity:1; visibility:visible; transform:translateX(0); } 
.ham_bg.on { position: fixed; width: 100%; background: rgb(255 255 255 / 60%); backdrop-filter: blur(3px); left: 0; top: 0; height: 100%; z-index: 100; transition: var(--transi); } 

@media all and (max-width:1280px){
 .ham_menu .fl { flex-direction: row; } 
 }
@media all and (max-width:1024px){
 .ham_menu { width: 50vw; } 
.ham_menu .vertical-text { display: block; } 
 }
@media all and (max-width:968px){
 .ham_menu { width: 70vw; } 
 }
@media all and (max-width:768px){
 .ham_menu { width: 80vw; padding: 3rem 3rem 3rem 5rem; } 
.ham_menu .gnb > li > a { font-size: var(--font-35); } 
.ham_menu .gnb > li .s-tit { font-size:var(--font-30); } 
.ham_menu .gnb > li .gnb-depth { font-size: var(--font-24); } 
 }
@media all and (max-width:568px){
 .ham_menu .ham-header { padding-left: 2rem; } 
.ham_menu { width: 85vw; padding: 3rem; padding-bottom: 8rem; } 
.ham_menu .gnb > li > a { font-size: var(--font-33); } 
.ham_menu .gnb > li .gnb-depth li.s-tit { line-height: 1.2; font-size: var(--font-26); } 
.ham_menu .gnb > li .gnb-depth { font-size: var(--font-22); } 
.ham_menu .gnb > li .gnb-depth li { margin-left: 0; list-style:none; } 
.ham_menu .gnb > li .gnb-depth a { line-height: 1; } 
.li-link .icon { width: 3rem; } 
 }
 @media all and (max-width:400px){
 .ham_menu .gnb > li > a { font-size: var(--font-30); } 
 .ham_menu .gnb > li:after, .ham_menu .gnb > li:before { right: 0px; top: 2.3rem; width: 15px; } 
 .ham_menu .gnb > li .gnb-depth li.s-tit { font-size: var(--font-20); } 
 .ham_menu .logo { width: 14rem; } 
 .ham_menu .vertical-text { font-size: var(--font-14); } 
 .ham_menu .icon_we { width: 10rem; } 
 }

/* =========================
 FOOTER
========================= */
.footer { padding-top: 4rem; padding-bottom: 4rem; background: #FBFBFB; border-top: 1px solid #EEEEEE; text-align: center; } 
.footer .info { margin-top:3rem; color: #817F7F; } 
.footer .info li { line-height: 1.5; } 
.footer .copy { margin-top: 2rem; padding-top: 2rem; border-top: 1px solid #E8E8E8; color: #9E9E9E; font-size: var(--font-12); } 

.btn-top { position:fixed; bottom: 6.5rem; right: calc(var(--inner-pd) / 2); width: var(--btn-top); height: var(--btn-top); border-radius: .5rem; border: 1px solid #000; background: rgba(255, 255, 255, 0.30); backdrop-filter: blur(.4rem); z-index:9; cursor: pointer; opacity: 0; visibility: hidden; transition: var(--transi); } 
.btn-top.on { opacity: 1; visibility: visible; }