@charset "utf-8";

.inner { width: 100%;  padding: 0 var(--inner-pd);}
.inner2{width: 100%;padding: 0 var(--inner-pd2)}

.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;}
P{font-family: var(--font-pontano)}

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

.more-btn { display: inline-block; background-color: var(--color-point); cursor: pointer; color:#fff; border: 1px solid var(--color-point); font-size:2.5rem; font-weight:500; transition: .3s; padding: 1.3rem 2rem; }
.more-btn:hover img { transform: translateX(15px); transition: .3s; }
.more-btn:hover { font-weight:600; background-color: transparent; color: var(--color-point); }


@media (max-width: 960px) {
.more-btn{font-size: 2.2rem;}
}

@media (max-width: 960px) {
.more-btn{font-size: 1.6rem;padding: .8rem 1.5rem;}
}



.header,
.header.active,
.header.scroll,
.header nav .gnb > li > a,
.header nav .gnb li .depth-gnb,
.header nav .gnb > li:hover > a{transition: .4s ease-in-out;}
.header .hr-btn-wr .cmnBtn{transition: .6s;}


/* ************************************************************************************* */
/*header*/
.header {position: fixed; top:0;left: 0;background: #fff;width:100%; height:var(--header-hei); display:flex; align-items: center; justify-content: space-between; z-index: 99;box-shadow: 0px 4px 7px #00000012;}
.header .inner{justify-content:space-between;  width: 100%;height: 100%;}
.header a{display:inline-block; }
.header .logo{width: 16rem; height:5.2rem;background: url(/theme/basic/img/logo.svg) no-repeat center / contain;}
.header nav{display:flex; align-items: center;height:100%;}
.header nav .gnb{display:flex; align-items: center; height:100%;}
.header nav .gnb > li{position:relative; height:100%; display:flex; align-items: center;text-align: center;}
.header nav .gnb > li:not(:last-child){margin-right: 9.4rem;}
.header nav .gnb > li > a{font-size:2rem;color: #555555;font-weight:600;text-align: center;line-height: normal;}
/* .header nav .gnb li .depth-gnb{
  position: absolute;
  top: 12rem;
  left: 50%;
  z-index: 1;
  width: 14rem;
  transform: translateX(-50%);
  height: auto;
  padding: 3rem 0;
  border-radius: .5rem;
  background-color: var(--color-point);
  opacity: 0;
  visibility: hidden;
}
.header nav .gnb > li:hover > a{color:var(--color-point);}
.header nav .gnb > li:hover .depth-gnb{display:block; opacity: 1;visibility: visible;transform: translate(-50%, -1rem);}
.header nav .gnb li .depth-gnb li{padding: .6rem 0;}
.header nav .gnb li .depth-gnb li:nth-child(1){padding-top:0;}
.header nav .gnb li .depth-gnb li:nth-last-child(1){padding-bottom:0;}
.header nav .gnb li .depth-gnb li a{color:#fff; font-size:1.8rem;font-weight: 400;} */

.header.scroll{background-color: #fff;border-bottom: 1px solid #eee;}
.header.scroll nav .gnb > li > a{color: #000;}
.header.active .cmnBtn, .header.scroll .cmnBtn,
.header .cmnBtn:hover{background-color: var(--color-point);color: #fff;border-color:var(--color-point);}


.header.active{box-shadow: 5px 0 10px rgba(0,0,0,0.16); background: #fff;}
.header.active nav .gnb > li > a{color: #000;}
.header.active nav .gnb > li:hover > a{color: var(--color-point);}

.header.scroll .ham_menu_btn span{background-color: #000;}
.header.active .ham_menu_btn span{background: #000;}
.header.hidden { transform: translateY(calc(var(--header-hei) * -1)); }

.header .hr-btn-wr .login-btn{background-color: #fff;color: var(--color-point);}
.header .hr-btn-wr .join-btn{background-color: transparent;color: #fff;}
.header .hr-btn-wr .login-btn:hover,
.header.active .hr-btn-wr .login-btn{background-color: var(--color-point);border-color: var(--color-point); color: #fff;}
.header .hr-btn-wr .join-btn:hover{background-color: #fff;border-color:var(--color-point);color: var(--color-point);}
.header.active .hr-btn-wr .join-btn{background-color: transparent;border-color:var(--color-point);color: var(--color-point);}
.header .hr-btn-wr > li:not(:last-child){margin-right: 0;}


/*sideMenu*/
.ham_menu_btn{cursor: pointer;opacity: 0;visibility: hidden;display: none;}
.ham_menu_btn span{display: block; width: 28px;height: 3px;background-color: #000;border-radius: 50px;}
.ham_menu_btn span:nth-child(2) {margin: 7px 0;}

.ham_menu .sidemenu_top{position: relative;}
.ham_menu_btn.close_ham {display: block; cursor: pointer;}
.ham_menu_btn.close_ham span {background: #000;transform-origin: center; width: 2.8rem;height: 2px;display: block;border-radius: 50px;}
.ham_menu_btn.close_ham span:nth-child(1){transform: rotate(45deg);}
.ham_menu_btn.close_ham span:nth-child(2) {display: none;}
.ham_menu_btn.close_ham span:nth-child(3){transform: translateY(-2px) rotate(135deg)}

.ham_menu {position: fixed;right: 0;top: 0;z-index: 9999;width: 0;height: 100vh; background-color: #fff; overflow: hidden; visibility: hidden;transition: .3s;}
.ham_menu.active {width: 35%;visibility: visible;}
.ham_menu .sidemenu_top{display: flex;align-items: center;justify-content: space-between;padding: 2rem;}
.ham_menu > ul.gnb {padding: 2rem 2.5rem;}
.ham_menu > ul.gnb > li{width: 100%;line-height: 2;position: relative;padding: 10px 0;}
/* .ham_menu > ul.gnb > li:after {content: "";display: block;width: 20px;height: 2px;position: absolute;right: 5px;top: 5.5em;background: #A59D97;border-radius: 10px; transform:rotate(0deg);transition-duration: 0.4s}
.ham_menu > ul.gnb > li:before {content: "";display: block;width: 20px;height: 2px;position: absolute;right: 5px;top: 5.5em;background: #A59D97;border-radius: 10px;transform:rotate(90deg);transition-duration: 0.4s}
.ham_menu > ul.gnb > li.active:after{transform:rotate(180deg);transition-duration: 0.4s}
.ham_menu > ul.gnb > li.active:before{transform:rotate(360deg);transition-duration: 0.4s} */
.ham_menu > ul.gnb > li.active .gnb-depth{padding: 15px;height: auto;border-radius: 10px;margin-top: .8rem}
.ham_menu > ul.gnb > li.active > a{color: var(--color-point);}

.ham_menu > ul.gnb > li:last-child:after, .ham_menu > ul.gnb > li:last-child:before,
.ham_menu > ul.gnb > li:nth-child(3):after, .ham_menu > ul.gnb > li:nth-child(3):before{display: none}

.ham_menu > ul.gnb > li.active:before, .ham_menu > ul.gnb > li.active:after{background-color: var(--color-point)}

.ham_menu > ul.gnb > li > .gnb-depth {height: 0;overflow: hidden;padding:0 15px;background: #f3f2f2;transition-duration: 0.4s}
.ham_menu > ul.gnb > li > .gnb-depth li{margin-bottom: .5rem;}
.ham_menu > ul.gnb > li > .gnb-depth li:last-child{margin-bottom: 0;}
.ham_menu > ul.gnb > li > a {font-size: 2.2rem;font-weight: 600;color:#000;width: 100%;display: inline-block;}
.ham_menu > ul.gnb > li > .gnb-depth a {display: block;line-height: 23px;font-size: 1.8rem;font-weight: 400;color: #444;font-family: var(--font-pontano);padding: 1rem 0}
.ham_menu > ul.gnb > li > .gnb-depth a br{display: none;}
.ham_menu > ul.gnb > li > .gnb-depth{position: relative;}
.ham_bg.active{position: fixed;width: 100%;background:rgba(29, 42, 40, 0.7); backdrop-filter: blur(3px);left: 0;top: 0;height: 100%;z-index: 999;}

.ham_menu .btn-wr{justify-content: space-between; }
.ham_menu .btn-wr .btn{width: auto; height: 3.5rem;padding: 0 2rem;border-radius: 1rem; font-size:1.6rem;font-weight: 400;line-height: 33px; text-align: center;margin-right: 1rem}
.ham_menu .btn-wr .btn:not(:last-child){margin-right: .8rem;}
.ham_menu .btn-wr .login-btn{background-color: var(--color-point);color: #fff;}
.ham_menu .btn-wr .join-btn{background-color: #fff;color: var(--color-point);border: 1px solid var(--color-point);}



/*  */
@media all and (max-width:1400px){
  .header nav .gnb > li:not(:last-child){margin-right: 6rem;}
}
@media all and (max-width:1400px){
  .header .logo, .sidemenu_top .logo{width: 16rem;height: 4.2rem}
  .header .hr-btn-wr .cmnBtn{padding: .5rem 1.5rem;min-width: 13.7rem;font-size: 1.8rem}
}
@media all and (max-width:960px){
  .header .logo, .sidemenu_top .logo{width: 14rem;height: 3rem;}
  .header .hr-btn-wr .cmnBtn{min-width: 11.5rem;}
  .header nav .gnb > li:not(:last-child){margin-right: 4rem;}
}
@media all and (max-width:768px) {
  .header nav .gnb{display: none;}
  .header .logo, .sidemenu_top .logo{width: 11rem;}
  .header .hr-btn-wr .cmnBtn{display: none}

  .header .hr-btn-wr .btn{display: none;}
  .ham_menu_btn{opacity: 1;visibility: visible;display: block;}
  .ham_menu.active{width: 100%;}

  .ham_menu .btn-wr .btn{line-height: 35px;}
}


/*footer*/
.footer-top{padding:40px 0; border-top:1px solid #2D2626; border-bottom:0.5px solid #2D2626;}
.footer-top ul{display: flex; align-items: center;}
.footer-top ul li:not(:last-child){margin-right: 6rem;}
.footer-top ul li a{font-size:1.9rem;}
.footer-top ul li a:hover{text-decoration: underline;}
.footer .li-bold{font-weight:600;}
.footer-bot{padding:86px 0 116px;}
.footer-bot h2{font-size: 4.9rem;margin-top: 1.2rem;line-height: normal;display: inline-block;cursor: pointer}
.footer-bot h4{font-size:2.1rem; font-weight:500; line-height: normal;}
.footer-bot h1{cursor: pointer; font-size:5rem; font-weight:900; padding-bottom:25px;}
.footer-cont{display:flex;}
.footer-box p{font-size:2.1rem; line-height: 35px; font-weight:400;}
.footer-box p span{font-weight:600;}
.left-box{padding-right:347px;margin-top: 2rem;}

.footer .btm{padding: 3rem 0;}
.footer .btm .inner{align-items: center;justify-content: space-between;}
.footer .btm p{font-size: 1.2rem; color: var(--color-txt03);line-height: 20px;;}
.footer .copy-wr{align-items: center;}
.footer #ftAdm {}
.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 .left-box{padding-right: 15rem;}
}
@media all and (max-width:960px){
.footer-top{padding: 2.5rem 0}
.footer-cont{flex-direction: column;}
.footer-box{margin-top: 3.5rem;}
.footer-bot h2{font-size: 4rem;}
.footer-box p{font-size: 1.8rem;}
.footer-box{padding-right: 0;}
.footer-bot{padding: 8rem 0}
.footer-top ul li:not(:last-child){margin-right: 4rem;}

}

@media all and (max-width:768px){
  .footer-bot h4{font-size: 1.8rem;}
  .footer-bot h2{font-size: 2.5rem;margin-top: .8rem;}
  .footer-top{padding: 1.5rem 0}
  .footer-box{margin-top: 1.5rem;}
  .footer-box p{font-size: 1.5rem;line-height: 25px;}
  .footer-bot{padding: 4rem 0}
  .footer-top ul li:not(:last-child){margin-right: 1.5rem;}
  .footer-top ul li a{font-size: 1.5rem;}
}



.ft-btn-wr{flex-direction: column;justify-content: center;position:fixed;right: 2rem;bottom: 3rem;z-index: 20}
.ft-btn-wr .btn{width: 8rem;height: 8rem;border-radius: 100%;display: flex;align-items: center;justify-content: center;flex-direction: column; box-shadow: 8px 11px 13px 0px rgba(0, 0, 0, 0.09);}
.ft-btn-wr .btn1{background-color: #FFEB00}
.ft-btn-wr .btn2{background-color: #AD936B}
.ft-btn-wr .btn2 .icon{width: 3rem;}
.ft-btn-wr .btnBx{margin-bottom: 1.5rem}
.ft-btn-wr span.white {
  color: #fff !important;
}
.ft-btn-wr{opacity: 0; transition: .5s; }
.ft-btn-wr.on { opacity: 1; }


@media all and (max-width:768px) {
  .ft-btn-wr{right: 1.5rem;bottom: 1.5rem;}
  .ft-btn-wr .btn{width: 5rem;height: 5rem;}
  .ft-btn-wr .btn1 .icon{width: 2.5rem;}
  .ft-btn-wr .btn2 .icon{width: 2.3rem;}
  .ft-btn-wr .btnBx{margin-bottom: 1rem}
  .ft-btn-wr.nofixed { bottom: 14rem;}
}
