@charset "utf-8";

.inner { width: 100%;  padding: 0 var(--inner-pd);}
.flex{display: flex;align-items: center;}
.grid-2{display: grid;grid-template-columns: repeat(2,1fr);}
.grid-3{display: grid;grid-template-columns: repeat(3,1fr);}
.grid-4{display: grid;grid-template-columns: repeat(4,1fr);}
.grid-5{display: grid;grid-template-columns: repeat(5,1fr);}
.grid-6{display: grid;grid-template-columns: repeat(6,1fr);}

br.br_pc{display: inline-block;}
br.br_mo{display: none;}

.fw-300{font-weight: 300;}
.fw-400{font-weight: 400;}
.fw-500{font-weight: 500;}
.fw-600{font-weight: 600;}
.bold, .fw-700{font-weight: bold;}
.fw-800{font-weight: 800;}



/* ******************************************************** */
/*헤더*/
.header { position: fixed; top: 0; left: 0; width: 100%; height: var(--header-hei); background-color: transparent; background-position: 99% 97%; background-size: 30%;transition: .3s; background-repeat: no-repeat; z-index: 99; overflow: hidden; }
.header .logo { width: 18.7rem; height: 4.7rem; background-image: url(/theme/basic/img/cmn/logo.png); background-position: center; background-repeat: no-repeat; background-size: contain; }
.header .inner { justify-content: space-between; width: 100%; height: var(--header-hei); padding: 0 var(--inner-pd); }
.header .gnb > li { position: relative; height: 100%; line-height: var(--header-hei); }
.header .gnb > li:not(:last-child) { margin-right: 18rem; }
.header .gnb > li > a { display: block;font-size: 1.6rem; color: #181817}
.header .gnb .depth { position: absolute; top: var(--header-hei); left: 50%; width: auto; height: auto; padding-bottom:4rem; opacity: 0; visibility: hidden; transform: translate(-50%, -1rem); }
.header .gnb .depth > li { display: block; width: 13rem; line-height: 2; text-align: center; }
.header .gnb .depth > li > a { position: relative; color: #000; font-size: 1.6rem; line-height: 2.3; }
.header .gnb .depth > li > a:hover { color: var(--color-point01); font-weight: 400; }
.header .gnb::after { position: absolute; width: 100%; height: 200%; content: ''; z-index: -1; }
.header .rt-btn-wr{gap: 1.6rem;justify-content: flex-end;}
.header .rt-btn-wr > li{}
.header .rt-btn-wr > li > a{font-family:'Gmarket Sans';display: inline-block;border-radius: 2rem;width: 100%;height: 100%;background-color: #000;padding: 1rem 1.6rem;font-size: 1.6rem;color: #fff;text-align: center;font-weight: 500;}
.header .rt-btn-wr > li > a:hover{opacity: .8}

.header.hidden { transform: translateY(calc(var(--header-hei) * -1)); }
.header.on { border-radius: 0 0 3rem 3rem; }
.header.on,.header.scroll { background-color: #fff; }
 /*.header.on .logo,.header.scroll .logo { background-image: url(/theme/basic/img/logo_c.svg); }  */
.header.on .gnb > li:hover > a {color: var(--color-point);}
.header.on .gnb > li .depth { min-height: 23rem; opacity: 1; visibility: visible; transform: translate(-50%, 0); }
.header.on .gnb > li .depth a { color: var(--color-txt); font-weight: 500; }
.header.on .gnb > li .depth a:hover { color: var(--color-txt); font-weight: 500; }
.header.on,.header.scroll { filter: drop-shadow(1px 1px 4px rgba(0,0,0,.2)); }



/*헤더 메뉴 버튼*/
.header .ham_menu_btn { display: none; align-content: space-around; grid-gap:0; position: relative; width: 3rem; height: 3rem; margin-left: 2rem; }
.header .ham_menu_btn span { width: 100%; height: 2px; background-color: #000; }
.header.ham_on .ham_menu_btn {}
.header.ham_on .ham_menu_btn span { position: absolute; top: 50%; left: 0; }
.header.ham_on .ham_menu_btn span:nth-child(2) { opacity: 0; visibility: hidden; }
.header.ham_on .ham_menu_btn span:nth-child(1) { transform: rotateZ(45deg); }
.header.ham_on .ham_menu_btn span:nth-child(3) { transform: rotateZ(-45deg); }



@media all and (max-width:1400px) {
  .header .gnb > li:not(:last-child) { margin-right: 3.8rem; }
  .header .gnb .depth > li > a { font-size: 1.6rem; }
  .header.on .gnb > li .depth { min-height: 15.6rem; }
  .header .rt-btn-wr{gap: 1rem}
  .header .rt-btn-wr > li > a{padding: .8rem 1.5rem}
 }
@media all and (max-width:768px) {
  .header .logo{width: 15rem;height: 3.8rem;}
  .header .gnb { display: none; }
  .header .rt-btn-wr{display: none;}
  .header .ham_menu_btn { display: grid; }
  .header.hidden{transform: inherit}
  .header .rt-btn-wr{gap: .8rem}
  .header .rt-btn-wr > li > a{font-size: 1.5rem;padding: .6rem 1rem}
}
@media all and (any-pointer:coarse) {
  .header .logo{width: 15rem;height: 3.8rem;}
  .header .gnb { display: none; }
  .header .rt-btn-wr{display: none;}
  .header .ham_menu_btn { display: grid; }
  .header.hidden{transform: inherit}
  .header .rt-btn-wr{gap: .8rem}
  .header .rt-btn-wr > li > a{font-size: 1.5rem;padding: .6rem 1rem}
}


/*모바일 메뉴*/
.ham_menu { display: block; position: fixed; right: 0; top: 0; z-index: 1; width: 100vw; height: 100vh; padding:var(--header-hei) var(--inner-pd); background: var(--color-point); overflow: hidden; opacity: 0; visibility: hidden; transition: .5s; z-index: 10; transform: translateX(100%); }
.ham_menu > ul { width: 100%; padding-top: var(--header-hei); }
.ham_menu > ul > li { width: 100%; line-height: 2; position: relative; }
.ham_menu > ul > li::after,.ham_menu > ul > li::before { content: ""; display: block; width: 20px; height: 1px; position: absolute; right: 1rem; top: 2.3rem; background: #fff; transform:rotate(0deg); transition-duration: 0.4s }
.ham_menu > ul > li::after { transform:rotate(0); }
.ham_menu > ul > li::before { transform:rotate(90deg); }
.ham_menu > ul > li > a { font-size: 2.5rem; font-weight: 600; color: #fff;width: 100%;display: inline-block;}
.ham_menu > ul > li > .gnb-depth { display: none; position: relative; padding:1.5rem 2rem; background: rgba(255, 255, 255, 0.11); font-size: 2rem; }
.ham_menu > ul > li > .gnb-depth a { display: block; line-height: 2; font-weight: 300; font-size: 1.8rem;color: #fff;}
.ham_menu > ul > li.active::after { transform:rotate(180deg); transition-duration: 0.4s }
.ham_menu > ul > li.active::before { transform:rotate(360deg); transition-duration: 0.4s }
.ham_menu.ham_on { opacity: 1; visibility: visible; transform: translateX(0); }
.ham_menu > ul > li:nth-child(1)::before, .ham_menu > ul > li:nth-child(1)::after{display: none;}
.ham_menu .ham-btn-wr{justify-content: space-between;gap: 1rem;margin-top: 2.5rem;}
.ham_menu .ham-btn-wr .btn{width: 100%;border-radius: 1rem; font-size: 1.6rem;text-align: center;color: #fff;border: 1px solid #fff;padding: .8rem 1.5rem;height: auto;line-height: normal;font-weight: 500}



/* ******************************************************** */
/*풋터*/
.footer{padding: 5rem 0;min-height: 35.7rem;}
.footer .inner{}
.footer .ft-list{justify-content: space-between;align-items: center;}
.footer .i-txt > li{font-size: var(--fontSize-15);letter-spacing: -0.3px;line-height: 27px;}
.footer .small-tit, .footer .tel{font-family:'Poppins';}
.footer .small-tit{display: block; font-size: var(--fontSize-18);font-weight: 600;line-height: 24px;}
.footer .tel{display: block; font-size: var(--fontSize-40);font-weight: 600;line-height: normal;}

.footer .lt-bx .i-list{margin-top: 1.2rem;gap: 7.4rem;padding-right: 6rem;}
.footer .rt-bx .i-list{gap: 7.4rem;padding-right: 12rem;}
.footer .rt-bx .i-list > li{}
.footer .btm-list{margin-top: 3rem;gap: 1.5rem}
.footer .btm-list > li{position: relative;}
.footer .btm-list > li::after{position: absolute;content: '';width: 1px;height: 13px;background-color: #4D4D4D;top: 50%;right: -.9rem;transform: translateY(-50%);}
.footer .btm-list > li:last-child::after{display: none;}
.footer .lt-bx .i-list > li,
.footer .rt-bx .i-list,
.footer .btm-list > li > a,
.copy{font-size: var(--fontSize-15);color: #4D4D4D;letter-spacing: -0.3px;line-height: 28px;}
.footer .btm-list > li > a:hover{color: #000;}
.footer #ftAdm {padding-top: .5rem;}
.footer #ftAdm li:not(:last-child) {margin-right: .5rem}
.footer #ftAdm li a { display: inline; padding: 0.3em 0.5em; border: 1px solid #b1b1b1; border-radius: 1em; font-size: 1rem; color: #b1b1b1;}

@media all and (max-width:1400px) {
  .footer .rt-bx .i-list{flex-direction: column;align-items: flex-start;padding-right: 0;gap: 2rem}
}
@media all and (max-width:960px) {
  .footer .tel{font-size: 3.3rem;}
}
@media all and (max-width:768px) {
  .footer{padding: 3rem 0}
  .footer .ft-list{flex-direction: column;align-items: flex-start;gap: 2.5rem}
  .footer .lt-bx .i-list{margin-top: .8rem;}
  .footer .rt-bx .i-list{gap: 1rem}
  .footer .tel{font-size: 2.5rem;line-height: 30px;margin-top: .2rem;}
  .footer .lt-bx .i-list > li,
  .footer .rt-bx .i-list{font-size: 1.4rem}
  .footer .btm-list > li > a{font-size: 1.3rem;}
  .copy{font-size: 1.2rem;line-height: 19px;margin-top: .3rem;}
}
@media all and (max-width:640px) {

}



/*탑 버튼*/
#top_btn { display: flex;align-items: center;justify-content: center;position:fixed; bottom:20px; right: 3rem; width:50px; height:50px; line-height:46px; border:1px solid #cdcdcd; border-radius: 100%; color:var(--color-txt); text-align:center; font-size:15px; z-index:90; background:rgba(255,255,255,0.5); cursor: pointer; opacity: 0; transition: .5s; }
#top_btn .material-symbols-rounded { display: block; }
#top_btn.on { opacity: 1; }
/* #top_btn:hover { border-color:#fff; background:#fff; } */
#top_btn.nofixed { bottom: 35rem; }


@media all and (max-width:768px) {
  #top_btn.nofixed { bottom: 12rem;right: 2rem}
}
