:root {
--header-hei: 10rem;
--inner-pd: calc((100% - 1440px) / 2);
--color-point: #01479C;
--color-point01: #EC6D00;
--color-txt: #3C3C3C;
--color-border:#DCDCDC;
--color-bg: #F5F5F5;

}

@media all and (max-width:1440px) {
  :root{
    --inner-pd: calc((100% - 1280px) / 2);
  }
}
@media all and (max-width:1280px) {
  :root{
    --inner-pd: calc((100% - 960px) / 2);
  }
}
@media all and (max-width:640px) {
  :root {
  --header-hei: 8rem;
  }
}




/*트랜지션*/
#header.on, #header.active, #header .inner , #header .gnb > li > a,
#header .gnb .depth,#header .gnb .depth > li > a, #header .gnb .depth > li > a::before,
#header .lang-wr .lang p ,#header .lang-wr .lang,#header .lang-wr .lang .icon,
.btn-st .icon,#header .ham_menu_btn span
#footer .family-wr .family .icon,
#whatApp ,
#sitemap .site-gnb .depth li a,#sitemap .site-gnb .depth li a::before,
#sitemap { transition: .3s; }


.inner { width: 100%; margin: 0 auto; padding: 0 var(--inner-pd); }
.flex { display: flex; justify-content: space-between; align-items: center; }
.icon, .img { display: inline-block; width: auto; max-width: 100%; }
.img-ob { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.ab-center { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
.sec-tp { margin-top:16rem; }
.img-m { display: none; }
.line-wr-sec { position: relative; }
/* .line { display: block; position: absolute; top: 0; left: 50%; width: 1px; height: 100%; background: #000; opacity: .15; z-index: -1; } */
.line:nth-child(1) { margin-left: -25%; }
.line:nth-child(2) { margin-left: -0.5px; }
.line:nth-child(3) { margin-left: 25%; }
.img-mask { -webkit-mask-image: url(/theme/basic/img/mask.png); mask-image: url(/theme/basic/img/mask.png); -webkit-mask-size: contain; mask-size: contain; -webkit-mask-position: bottom; mask-position: bottom; }

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

.tit { font-size: 5.6rem; font-weight: 900; line-height: 7.2rem; }
.tit-h { margin:1rem 0 2.5rem; color: var(--color-point); font-size: 6rem; font-weight: 900; line-height:6.2rem; }
.tit-s { color: var(--color-point01); font-size: 1.8rem; font-weight: 700; line-height:3.2rem; }
.tit-h01 { margin: 1rem 0 2rem; font-size: 4.4rem; font-weight: 900; font-weight: 900; line-height:5.4rem; }
.tit-s01 { font-size: 2rem; font-weight: 700; line-height:3.2rem; }
.txt { color: var(--color-txt); font-size: 1.8rem; font-weight: 500; line-height:3.2rem; }


@media all and (max-width:960px) {
  .inner{padding: 0 40px;}
}
@media all and (max-width:768px) {
  .img-pc { display: none; }
  .img-m { display: block; }
}
@media all and (max-width:480px) {
  .inner{padding: 0 20px;}
  .tit-h{font-size: 4rem;line-height: 4.2rem;}
}
@media all and (max-width:375px) {
  .tit-h{font-size: 3.5rem}
}


/*버튼*/
.btn-st { justify-content: center; width: 19rem; height: 6.4rem; margin-top: 3.4rem; background-color: var(--color-point01); }
.btn-st p { color: #fff; }
.btn-st .icon { filter: invert(1) brightness(100); opacity: 0; visibility: hidden; }
.btn-st:hover .icon { margin-left: 1rem; opacity: 1; visibility: visible; }

/*커서*/
.cursor { position: absolute; width: 0; height: 0; margin-left: -6rem; margin-top: -6rem; background-image: url(/theme/basic/img/cursor.svg); background-position: center; background-size: contain; background-repeat: no-repeat; z-index: 100; pointer-events: none; transition-property: background, transform; opacity: 0; visibility: hidden; transition: .3s; }
.cursor.on { width: 12rem; height: 12rem;opacity: 1; visibility: visible; }

@media all and (max-width:480px) {
  .cursor.on{width: 9rem;height: 9rem;}
}



/*리스트스타일*/
.list-st { margin-left: 2.2rem; }
.list-st li { position: relative; font-size: 1.8rem; line-height: 1.5; }
.list-st li:not(:last-child) { margin-bottom: 1.3rem; }
.list-st li::before { content: ''; display: inline-block; position: absolute; }
.list-st ul li.list-non { margin-left: -2.2rem; }
.list-st ul li.list-non .tit-sub { margin-bottom: 0; }
.list-st ul li.list-non::before { display: none; }
.list-st-bar { margin-left: 1.6rem; }
.list-st-bar li::before { content: '-'; display: inline-block; left: -1.4rem; }
.list-st-cy li::before { top: 1.15rem; left: -1.2rem; width: 0.5rem; height: 0.5rem; border-radius: 50%; background: var(--color-txt); }


/*왓츠앱*/

#whatApp { justify-content: center; position: fixed; bottom: 3rem; right: calc((var(--inner-pd) / 5) + 6.5rem); width: 27rem; height: 5.7rem; padding: 1.2rem; background-color: #25D366; border-radius: .7em; z-index: 10; opacity: 1; visibility: visible; }
#whatApp a { height: 100%; margin-left: 0.5em; }
#whatApp a .icon { margin-top: 0.4rem; }
#whatApp.scroll { opacity: 0; visibility: hidden; }
#whatApp.scroll-non { opacity: 0; visibility: hidden; }
#whatApp.nofixed{bottom: 31.5rem;}

#sub #whatApp{opacity: 0;visibility: hidden;}
#sub #whatApp.on{opacity: 1; visibility: visible;}

@media all and (max-width:960px) {
  #whatApp{width: 23rem;right: 13.5rem}
  #whatApp .icon_call{width: 3.1rem}
  #whatApp a .icon{width: 15rem;}
}
@media all and (max-width:480px) {
  #whatApp{height: 4.7rem;right: 10rem;}
}




/*헤더*/
#header { position: fixed; width: 100%; height: var(--header-hei); background-color: transparent; background-position: 99% 97%; background-size: 30%; background-repeat: no-repeat; z-index: 99; }
#header .logo { width: 12.8rem; height: 5.4rem; background-image: url(/theme/basic/img/logo_w.svg); background-position: center; background-repeat: no-repeat; background-size: contain; }
#header .inner { justify-content: flex-start; width: 100%; height: var(--header-hei); }
#header .gnb { position: relative; margin-left: 9rem; }
#header .gnb > li { height: 100%; line-height: var(--header-hei); padding-right: 6.8rem; }
#header .gnb > li > a { display: block; color: #fff; font-size: 2rem; font-weight: 500; }
#header .gnb .depth { position: absolute; top: var(--header-hei); left: 0; width: 100%; height: auto; padding: 2rem 0; opacity: 0; visibility: hidden; transform: translateY(-1rem); }
#header .gnb .depth > li { display: block; width: max-content; line-height: 2; }
#header .gnb .depth > li > a { position: relative; color: #fff; font-size: 1.8rem; font-weight: 200; line-height: 1.8; }
#header .gnb .depth > li > a::before { display: inline-block; width: 0; height: 1.3rem; margin-right: 0.4em; background: url(/theme/basic/img/icon_deco.svg)no-repeat center / cover; content: ''; }
#header .gnb .depth > li > a:hover { color: var(--color-point01); font-weight: 400; }
#header .gnb .depth > li > a:hover::before { width: .9rem; }
#header .gnb > li:hover .depth { min-height: 23rem; opacity: 1; visibility: visible; transform: translateY(0); }
#header .lang-wr { position: relative; margin-left: auto; cursor: pointer; }
#header .lang-wr .lang { width: 9rem; height: 4rem; padding:0 1.7rem; border: 1px solid #FFF; border-radius: 2rem; }
#header .lang-wr .lang p { color: #fff; }
#header .lang-wr .lang .icon { margin-left: 1rem; }
#header .lang-wr .lang-gp { display: none; position: absolute; top: calc(var(--header-hei) /2); width: 100%; padding: 1rem; border-radius: 1rem; border: 1px solid #dfdfdf; background: #fff; overflow: hidden; }
#header .lang-wr .lang-gp a { display: block; line-height: 2; text-align: center; }
#header.on, #header.on .inner { height: calc(var(--header-hei) / 1.3); }
#header.on .inner ,#header.active .inner { background: #fff; border-bottom: 1px solid var(--color-bg); }
#header.on .logo, #header.active .logo { background-image: url(/theme/basic/img/logo_c.svg); }
#header.on .gnb > li{line-height:  calc(var(--header-hei) / 1.3);}
#header.on .gnb > li > a {font-size: 1.8rem; }
#header.on .gnb > li > a ,#header.active .gnb > li > a { color: #000; }
#header.on .gnb .depth { top: calc(var(--header-hei) / 1.3);}
#header.on .lang-wr .lang , #header.active .lang-wr .lang { border: 1px solid #000; }
#header.on .lang-wr .lang p, #header.active .lang-wr .lang p { color: #000; }
#header.on .lang-wr .lang .icon, #header.active .lang-wr .lang .icon { filter: invert(1); }
#header.on .ham_menu_btn span, #header.active .ham_menu_btn span { background-color: var(--color-point); }
#header.active { display: block; width: 100%; height: 38rem; background-color: var(--color-point); background-image: url(/theme/basic/img/logo_bg.svg); overflow: hidden; }
#header.ham_on .logo {background-image: url(/theme/basic/img/logo_w.svg) !important; }
#header.ham_on .gnb { display: none; }
#header.ham_on .inner {border-bottom: 0 !important; background-color: transparent !important;}
#header.ham_on .lang-wr .lang { border: 1px solid #fff !important; }
#header.ham_on .lang-wr .lang p { color: #fff !important; }
#header.ham_on .lang-wr .lang .icon {    filter: none !important;}

#header .ham_menu_btn { align-content: space-around; grid-gap:0; position: relative; width: 3rem; height: 3rem; margin-left: 2rem; cursor: pointer; }
#header .ham_menu_btn span { width: 100%; height: 2px; background-color: #fff; }
#header.ham_on .ham_menu_btn span { position: absolute; top: 50%; left: 0; background-color: #fff !important;  }
#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:960px) {
  #header .gnb{display: none;}
}
@media all and (max-width:640px) {
  #header .logo{width: 10.8rem}
  #header .lang-wr .lang{height: 3.2rem;}
}



/*모바일 메뉴*/
.ham_menu { display: none; position: fixed; right: 0; top: 0; z-index: 1; width: 0; height: 100vh; padding:var(--header-hei) var(--inner-pd); background: var(--color-point); overflow: hidden; visibility: hidden; transition: .5s; z-index: 3; cursor: pointer; }
.ham_menu a { color: #fff; }
.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: 20px; top: 2.3em; background: #ccc; 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: 3.2rem; font-weight: 600; }
.ham_menu > ul > li > .gnb-depth { display: none; position: relative; padding:0 15px; background: rgba(255, 255, 255, 0.11); font-size: 2rem; }
.ham_menu > ul > li > .gnb-depth a { display: block; line-height: 2; font-weight: 200; }
.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 { width: 100%; visibility: visible; }

/*사이트맵*/
#sitemap { position: fixed; width: 100vw; height: 100vh;  background:var(--color-point) url(/theme/basic/img/site_bg.svg)no-repeat 94% 78% / 66%; z-index: 40; opacity: 0; visibility: hidden; transform: translateY(-5rem); }
#sitemap > .inner { margin-top: -7rem; }
#sitemap .tit-h01, #sitemap .site-gnb * { color: #fff; }
#sitemap .site-gnb { display: grid; grid-template-columns: 14% 14% 26% 14% auto; grid-gap: 8rem; justify-content: space-between; align-items: flex-start; }
#sitemap .site-gnb .tit-s01 { line-height: 6.2rem; font-weight: 500; }
#sitemap .site-gnb .depth li a { position: relative; line-height: 1.7; font-size: 1.8rem; font-weight: 200; }
#sitemap .site-gnb .depth li a::before { display: inline-block; width: 0; height: 1.3rem; background: url(/theme/basic/img/icon_deco.svg)no-repeat center / cover; content: ''; display: none;}
#sitemap .site-gnb .depth li a:hover { color: var(--color-point01); font-weight: 400; }
#sitemap .site-gnb .depth li a:hover::before { width: .9rem; margin-right: 0.4em; }
#sitemap .sitemap-ft { position: absolute; left: 0; bottom: 0; width: 100%; padding-left: var(--inner-pd); padding-right: var(--inner-pd); border-top: 1px solid rgba(255, 255, 255, 0.2); background: var(--color-point); }
#sitemap .sitemap-ft p { color: rgba(255, 255, 255, 0.5); }
#sitemap .family-wr, #sitemap .sitemap-ft .family-wr .family-list { background-color: #fff; }
#sitemap .family-wr .family,#sitemap .family-wr .family-list li a { color: var(--color-txt); }
#sitemap .family-wr .family .icon { filter: invert(1); }
#sitemap.ham_on { transform: translateY(0); opacity: 1; visibility: visible; }
#sitemap .line { background-color: #fff; }
#sitemap > .inner, #sitemap .sitemap-ft p , #sitemap .family-wr { margin-left: -1.5rem; }

@media all and (max-width:1280px) {
  #sitemap .site-gnb{grid-gap: 3rem;}
}
@media all and (max-width:960px) {
  #sitemap .site-gnb{grid-gap: 2rem;}
  #sitemap .sitemap-ft{padding: 2rem 4rem;}
}
@media all and (max-width:480px) {
  #sitemap > .inner, #sitemap .sitemap-ft p, #sitemap .family-wr{margin-left: 0;}
  #sitemap > .inner{margin-top: 0;}
  #sitemap > .inner .mo_scoll{height: 62rem;overflow-y: scroll;}
  #sitemap .tit-h01{display: none;}
  #sitemap .site-gnb{grid-template-columns: 1fr}
  #sitemap .site-gnb .tit-s01{font-size: 2.5rem;}
  #sitemap .site-gnb .depth li a{font-size: 2rem;line-height: 1.8;}
  #sitemap .sitemap-ft{padding: 1.5rem 3rem;}
}


/*하단*/
#footer { background: #000; }
#footer .inner { padding-top: 0 !important; padding-bottom:0 !important; }
#footer .info-wr { padding-top: 6rem; padding-bottom: 6rem; }
#footer .info-wr .logo { width: 14.8rem; }
#footer .info-wr .info { flex-wrap: wrap; max-width: 62rem; }
#footer .info-wr .info li { line-height: 2; }
#footer .info-wr .info li:nth-child(1) { width: 100%; }
#footer .info-wr .info li:not(:last-child) { margin-right: 6rem; }
#footer .info-wr .info li strong { margin-right: 2rem; color: #737272; }
#footer .info-wr .info li span, #footer .info-wr .info li a { color: #fff; }
.copy { padding-top: 3rem; padding-bottom: 3rem; border-top: 1px solid #202020; }
ul.c_flex{display: flex;align-items: center;}
ul.c_flex > li{margin-right: .8rem}
ul.c_flex > li:last-child{margin-right: 0;}
ul.c_flex p{color: #737272; font-size: 1.2rem; letter-spacing: 0; }
#ftAdm > li{margin-right: .5rem}
#ftAdm > li:last-child{margin-right: 0;}
#ftAdm > li > a { display: inline-block; background-color: #000; padding: 0.4em 0.5em; border: 1px solid #737272; border-radius: 1em; font-size: 1rem; color: #838181;line-height: 1;font-weight: 600;}
#ftAdm > li > a:hover{background-color: #737272;color: #c1c1c1;}

.family-wr { position: relative; padding: 1rem 2rem; background-color: #2B2B2B; }
.family-wr .family { width: 16.5rem; height: 2.6rem; color: #fff; font-size: 1.4rem; cursor: pointer; }
.family-wr .family .icon { width: 1.4rem; transform: rotateZ(180deg); }
.family-wr .family.on .icon { transform: rotateZ(360deg); }
.family-wr .family-list { display: none; position: absolute; left: 0; bottom: 5rem; width: 100%; line-height: 1.5; padding: 1rem 2rem; background-color: #2B2B2B; }
.family-wr .family-list li a { color: #fff; }

@media all and (max-width:640px) {
  #footer .info-wr{flex-direction: column;align-items: flex-start;}
  #footer .info-wr .info{padding-top: 2.6rem;}
}
@media all and (max-width:480px) {
  #footer .info-wr{padding-top: 3rem;padding-bottom: 1.5rem;}
  #footer .info-wr .info{flex-direction: column;align-items: flex-start;}
  #footer .info-wr .info li{display: flex;}
  #footer .info-wr .info li:not(:last-child){margin-right: 0}
  #footer .info-wr .info li strong{display: inline-block;width: 5rem;}
  .copy{flex-direction: column;align-items: flex-start;padding-top: 1.5rem;padding-bottom: 2rem}
  .family-wr{margin-top: 2.5rem}

  ul.c_flex{flex-direction: column;align-items: flex-start;}
  ul.c_flex p{margin-right: 0;margin-bottom: .8rem;}
}



/*  */
.rt-btn-wr{display: flex;align-items: center;flex-direction: column;position:fixed; bottom: 3rem;right: calc(var(--inner-pd) / 5); transition: .5s;}
.rt-btn-wr .fx-btn{ display: flex; justify-content: center; align-items: center; width:5.7rem; height:5.7rem; border-radius: 100%;z-index:9; cursor: pointer; opacity: 0; transition: .5s; }
.rt-btn-wr .fx-btn.on{opacity: 1;}
.rt-btn-wr .fx-btn.nofixed {bottom: 31.5rem;}

/* 문의하기 이동 버튼 */
.contact-btn{background-color: #F5F5F5;margin-bottom: 2rem;border: 1px solid #DCDCDC}

/*탑 버튼*/
#btnTop {background:var(--color-point); }
#btnTop .icon { transform: rotateZ(180deg); filter: brightness(100); }


@media all and (max-width:960px) {
  .rt-btn-wr{right: 7rem}
}
@media all and (max-width:640px) {
  .contact-btn{margin-bottom: 1.2rem}
  .rt-btn-wr{right: 3rem}
}



/* 비즈니스 정보 */
.business-wr { background-color: #dddddd3d; }
.business-wr .box-wr .box .box-img { height: 31rem; }
.business-wr .box-wr .box .box-txt { height: 16rem; background-color: #fff; padding: 3rem 5rem; }
.business-wr .box-wr .box .box-txt .tit-s01 { display: inline-flex; margin-bottom: 1rem; font-weight: 800; font-size: 2.8rem;line-height: 4rem}
.business-wr .box-wr .box .box-txt .icon { width: 2rem; margin-left: .5rem; filter: invert(1) brightness(0); }


@media all and (max-width:1280px) {
  .business-wr .box-wr .box .box-txt{padding: 3rem}
}
@media all and (max-width:960px) {
  .business-wr .box-wr .box .box-txt{padding: 2.5rem}
  .business-wr .box-wr .box .box-txt br.br_pc{display: none;}
}
@media all and (max-width:640px) {
  .business-wr .box-wr{grid-template-columns: 1fr;}
}
@media all and (max-width:480px) {
  .business-wr .box-wr .box .box-img{height: 26rem}
}


/*  */
.service-wr .box-wr .box .box-img { height: 31rem; }
.service-wr .box-wr .box .box-txt { height: 12.2rem; background-color: #fff; padding: 3.5rem 5rem; border: 1px solid var(--color-border);}
.service-wr .box-wr .box .box-txt .tit-s01 { display: inline-flex; margin-bottom: 1rem; font-weight: 800; line-height: 2.6rem;}
.service-wr .box-wr .box .box-txt .icon { width: 2rem; margin-left: 1.4rem; filter: invert(1) brightness(0); }

@media all and (max-width:1280px) {
  .service-wr .box-wr .box .box-txt{padding: 2rem 3rem;}
}
@media all and (max-width:960px) {
  .service-wr .grid-3{grid-template-columns: repeat(2,1fr)}
  .service-wr .box-wr .box .box-txt{padding: 2rem 2.5rem}
}
@media all and (max-width:480px) {
  .service-wr .box-wr{grid-template-columns: 1fr;}
  .service-wr .box-wr .box .box-img{height: 26rem}
  .service-wr .box-wr .box .box-txt{height: 11rem}
}



/*문의하기*/
.inquiry-wr { height: 26rem; padding:7.2rem 8.5rem; background: url(/theme/basic/img/contact_bg.jpg)no-repeat center / cover; }
.inquiry-wr .tit-wr * { color: #000; }
.inquiry-wr .tit-wr .tit-h { margin-bottom: 0; }
.inquiry-wr .btn-st { margin-top: 0; background-color: #fff; }
.inquiry-wr .btn-st p { color: var(--color-point01); }
.inquiry-wr .btn-st .icon { filter: none; }

@media all and (max-width:640px) {
  .inquiry-wr{padding: 3rem 3.5rem;height: 22rem;}
}
@media all and (max-width:480px) {
  .inquiry-wr{height: 21rem;padding: 2.2rem 2.5rem;flex-direction: column;align-items: flex-start;}
  .inquiry-wr .tit-wr .tit-s{line-height: 2.6rem;}
  .inquiry-wr .tit-wr .tit-h{margin: .6rem 0 0;}
  .inquiry-wr .btn-st{width: 16rem;height: 5.2rem;}

}