#header {z-index: 99999}

.pc_header {background: transparent; transition: 0.4s}
.pc_header .inner {transition: 0.8s; max-width: 156.2rem; padding: 2.6rem 0;}
.pc_header .logo {}
.pc_header .logo a {gap: 0.8rem;}
.pc_header .gnb {gap: 2rem; padding-right: 3.4rem;}
.pc_header .gnb > li {min-width: 18rem;}
.pc_header .gnb > li:hover {font-weight: bold}
.pc_header .gnb > li > a {display: block; text-align: center; padding: 2rem 0}
/* .pc_header .gnb > li > a::before {content: ''; display: block; position: absolute; width: 100%; bottom: 0; height: 1px; background: #fff; display: none}
.pc_header .gnb > li > a:hover::before {display: block;} */
.pc_header .lnb {top: 100%; padding: 2.2rem 0; display: none}
.pc_header .lnb li {color: #000; font-weight: 500;}
.pc_header .lnb li + li {margin-top: 1rem}
.pc_header .lnb li a {text-align: center; display: block;}
.pc_header .lnb li a:hover {font-weight: bold;}
.pc_header .etc {gap: 2.4rem;}
.pc_header .etc a {}
.pc_header .etc span {}

.pc_header.active {background: #0080FF;}
.pc_header.active .inner {max-width: 181.6rem; padding: 0;}
.pc_header.active .logo a img:nth-child(2) {opacity: 0}
.pc_header.active .gnb > li > a {padding: 3.5rem 0}

.pc_header .fullMenu {width: 0; overflow: hidden; transition: 0.5s}
.pc_header .fullInner {background: #0F2341}
.pc_header .fullInner .imgArea {width: 41%;}
.pc_header .fullInner .imgArea::before {content: ''; display: block; position: absolute; width: 100%; height: 100%; background: #0F2341; top: 0; left: 0; z-index: 1; transition: 1.2s;}
.pc_header .fullInner .imgArea img {height: 100%; object-fit: cover}
.pc_header .fullInner .menuArea {width: 59%; color: #52627B}
.pc_header .fullInner .menuArea ul {padding-left: 18.5%; opacity: 0; transition: 1.2s}
.pc_header .fullInner .menuArea li {transition: 0.4s}
.pc_header .fullInner .menuArea li + li {margin-top: 7.2rem;}
.pc_header .fullInner .menuArea li a {display: block; padding-left: 3.2rem;}
.pc_header .fullInner .menuArea li .num {left: 0; top: 0.85rem;}
.pc_header .fullInner .menuArea li:hover {color: #828995}
.pc_header .fullInner .menuArea .icoCancel {top: 10%; right: 10%;}

.pc_header .fullInner.active .imgArea::before {width: 0;}
.pc_header .fullInner.active .menuArea ul {padding-left: 11.5%; opacity: 1;}

.mo_header {z-index: 99; transition: 0.3s; background: #fff;}
.mo_header .mo_head {padding: 0.6rem 0; border-bottom: 1px solid #DDDDDD;}
.mo_header .mo_head .logo {width: 4.4rem; left: 4%}
.mo_header .mo_head .menu_btn {width: 3rem; right: 4%;}
.mo_header .mo_menu_wrap {display: none;}
.mo_header .mo_menu_box {top: -100%; transition: 1s; overflow-y: scroll;}
.mo_header .mo_menu_box::-webkit-scrollbar {width: 8px;}
.mo_header .mo_menu_box::-webkit-scrollbar-thumb {background-color: #fff; border-radius: 10px; background-clip: padding-box; border: 2px solid transparent;}
.mo_header .mo_menu_box::-webkit-scrollbar-track {background-color: #fff;}
.mo_header .menu_logo {padding: 9rem 0 0; width: 18rem; margin: 0 auto;}
.mo_header .menu_gnb {width: 89%; margin: 0 auto; margin-top: 2rem;}
.mo_header .menu_gnb_lst {padding: 1.6rem 0; border-bottom: 1px solid #e1e1e1;}
.mo_header .menu_gnb_lst .gnb_name {display: block;}
.mo_header .menu_lnb {display: none; margin: 1.5rem 0 0 0;}
.mo_header .menu_lnb .menu_lnb_lst {}
/* .mo_header .menu_lnb .menu_lnb_lst + .menu_lnb_lst {border-top: 1px solid #e9e9e9;} */
.mo_header .menu_lnb .menu_lnb_lst a {display: block; padding: 8px 0; color: #5a5a5a; display: block; font-size: 1.3rem;}
.mo_header .menu_login {justify-content: flex-end; padding: 2rem; font-size: 1.2rem; gap: 0.6rem; padding-top: 2rem;}
.mo_header .menu_login li {background: #0080FF; color: #fff; padding: 0.5rem 0.6rem; border-radius: 3px; width: 100%; text-align: center;}
.mo_header .cancel_ico {top: 4%; right: 6%; width: 2.2rem;}


#float {right: 6%; bottom: 12.6rem; z-index: 999}
#float li + li {margin-top: 1.6rem;}
#float li a {}
#float li img {max-width: 9.6rem;}

@media all and (max-width: 880px){
    #float {right: 4%; bottom: 6%;}
    #float li + li {margin-top: 0.6rem;}
    #float li img {max-width: 5.2rem;}
}

#footer {background: #F1ECE6;}
#footer .ftInner {border-top: 1px solid #D6D0CA; border-bottom: 1px solid #D6D0CA;}
#footer .ftCont {max-width: 160rem; margin: 0 auto;}
#footer .ftCont .cont {min-height: 56.3rem; padding: 0 5.6rem;}
#footer .ftCont .cont {border-left: 1px solid #D6D0CA;}
#footer .ftCont .cont:last-child {border-right: 1px solid #D6D0CA;}
#footer .ftCont .cont .title {margin-bottom: 4rem; padding-top: 8rem;}
#footer .ftCont .cont1 {width: 27.85%;}
#footer .ftCont .cont1 .wrt {line-height: 2.8rem}
#footer .ftCont .cont2 {width: 24%;}
#footer .ftCont .cont2 .wrt {}
#footer .ftCont .cont2 .wrt li {}
#footer .ftCont .cont2 .wrt li + li {padding-top: 1rem;}
#footer .ftCont .cont2 .prg {margin-top: 3.2rem; line-height: 2.8rem}
#footer .ftCont .cont3 {width: 28.15%;}
#footer .ftCont .cont3 .wrt {}
#footer .ftCont .cont3 .wrt + .wrt {margin-top: 6rem;}
#footer .ftCont .cont3 .wrt:last-child {margin-top: 3.2rem;}
#footer .ftCont .cont4 {width: 20%;}
#footer .ftCont .cont4 .wrt {}
#footer .ftCont .cont4 .wrt li + li {margin-top: 1.2rem;}
#footer .ftCont .cont4 .wrt li a {width: 100%; text-align: center; padding: 1.4rem 0; border: 1px solid #586C72; border-radius: 32px;}
#footer .ftCont .cont4 .wrt li a:hover {font-weight: bold;}
#footer .ftCont .cont4 .prg {margin-top: 3.2rem;}
#footer .ftBot {padding: 6.4rem 0 7.8rem;}
#footer .ftBot .copy {}
#footer .ftBot .ftGnb {gap: 4rem;}

@media all and (max-width: 880px){
    #footer {}
    #footer .ftLogo {width: 87%; margin: 0 auto; padding: 2.4rem 0; text-align: left;}
    #footer .ftLogo img {max-width: 60%; margin: 0 auto}
    #footer .ftCont {flex-direction: column;}
    #footer .ftCont .cont {min-height: auto; border-left: 0; padding: 0; margin: 0 auto; padding-bottom: 2.8rem;}
    #footer .ftCont .cont:last-child {border-right: 0;}
    #footer .ftCont .cont + .cont {border-top: 1px solid #D6D0CA;}
    #footer .ftCont .cont .title {padding-top: 2.7rem; margin-bottom: 2.4rem; font-size: 1.6rem;}
    #footer .ftCont .cont1 {width: 87%}
    #footer .ftCont .cont2 {width: 87%}
    #footer .ftCont .cont3 {width: 87%}
    #footer .ftCont .cont4 {width: 87%}
    #footer .ftCont .cont1 .wrt {font-size: 1.4rem;}
    #footer .ftCont .cont2 .wrt {font-size: 1.6rem;}
    #footer .ftCont .cont2 .wrt li {justify-content: flex-start; gap: 7.2rem;}
    #footer .ftCont .cont2 .wrt li > div:nth-child(1) {min-width: 8rem;}
    #footer .ftCont .cont2 .prg {font-size: 1.4rem; margin-top: 2.2rem;}
    #footer .ftCont .cont3 .wrt {font-size: 1.6rem;}
    #footer .ftCont .cont3 .wrt span {font-size: 1.4rem;}
    #footer .ftCont .cont3 .wrt + .wrt {margin-top: 4.5rem}
    #footer .ftCont .cont3 .wrt:last-child {margin-top: 4rem;}
    #footer .ftCont .cont4 .wrt {flex-wrap: wrap; gap: 0.8rem 0.4rem; display: flex; font-size: 1.4rem;}
    #footer .ftCont .cont4 .wrt li {width: calc((100% - 0.4rem) / 2);}
    #footer .ftCont .cont4 .wrt li + li {margin: 0;}
    #footer .ftCont .cont4 .wrt li a {padding: 1rem 0;}
    #footer .ftCont .cont4 .prg {font-size: 2.4rem; position: absolute; margin: 0; top: 10%; right: 10%;}
    #footer .ftBot {padding: 3.1rem 0 6.8rem; width: 88.9%; margin: 0 auto; flex-direction: column-reverse; gap: 1.5rem; align-items: center;}
    #footer .ftBot .copy {font-size: 1rem;}
    #footer .ftBot .ftGnb {font-size: 1rem;}
}


/** applyBar *****************/
#applyBar {position: fixed; bottom: 0; left: 50%; transform: translateX(-50%); width: 134rem; padding: 3rem 0; border-radius: 3rem 3rem 0 0; background: #0080FF; display: flex; justify-content: center; align-items: center; z-index: 99; transition: transform .35s ease; transform: translate(-50%, 100%);}
#applyBar .barBtn {font-size: 1.6rem; font-weight: bold; background: #0080FF; color: #fff; display: flex; align-items: center; position: absolute; bottom: 100%; padding: 1.1rem 3.4rem; gap: 1rem; border-radius: 2rem 2rem 0 0; cursor: pointer}
#applyBar .barBtn img {transition: 0.3s;}
#applyBar .logo {margin-right: 3rem;}
#applyBar .logo img {max-width: 21rem;}
#applyBar .formWrap {margin-right: 6rem; display: flex; gap: 1rem;}
#applyBar .formWrap .inputArea {display: flex; flex-wrap: wrap; gap: 1rem; width: min-content;}
#applyBar .formWrap .inputArea .list {display: flex; gap: 1rem;}
#applyBar .formWrap .inputArea .list li {width: 17rem;}
#applyBar .formWrap .inputArea .list input {display: block; width: 100%; height: auto; padding: 1rem; box-sizing: border-box; font-size: 1.4rem; border: none; background: #fff; border-radius: 5px; font-family: inherit;}
#applyBar .formWrap .inputArea .list input:focus {outline: none; border: 0 !important; box-shadow: none;}
#applyBar .formWrap .inputArea .list select {display: block; width: 100%; height: auto; padding: 1rem; box-sizing: border-box; font-size: 1.4rem !important; border: none; border-radius: 5px; appearance: none; -webkit-appearance: none; -moz-appearance: none; background: #fff url('../img/apply_ic_slide.svg') right 10% center no-repeat; font-family: inherit;}
#applyBar .formWrap .inputArea .list select:focus {outline: none; border: 0 !important; box-shadow: none;}
#applyBar .formWrap .inputArea .list li:last-child {width: 20rem;}
#applyBar .formWrap .inputArea .check {display: flex; align-items: center; color: #fff;}
#applyBar .formWrap .inputArea .check input {background: #fff; border: none; width: 1.5rem; height: 1.5rem; margin-top: -0.3rem; margin-right: 0.6rem;}
#applyBar .formWrap .inputArea .check a {margin-left: 0.6rem; color: #fff;}
#applyBar .formWrap .applyBtn {flex-shrink: 0; width: 10rem; display: flex; align-items: center; justify-content: center; background: #fff; height: 6.8rem; border-radius: 5px; color: #0080FF; font-family: inherit; font-weight: bold;}
#applyBar .formWrap .applyBtn i {display: none; font-style: normal;}
#applyBar .callWrap {color: #fff;}
#applyBar .callWrap .txt {margin-bottom: 0.3rem;}
#applyBar .callWrap .tit {line-height: 1.2;}

#applyBar.active .barBtn img {transform: rotate(180deg);}

#applyBar.open {transform: translate(-50%, 0);}

@media all and (max-width: 880px) {
    #applyBar {width: 100%; padding: 2rem 1rem 1.5rem 1rem; box-sizing: border-box; border-radius: 0; z-index: 99999;}
    #applyBar .formWrap {flex-wrap: wrap; gap: 2rem; margin-right: 0;}
    #applyBar .formWrap .inputArea {width: 100%; flex-wrap: wrap; row-gap: 1.9rem;}
    #applyBar .formWrap .inputArea .list {flex-wrap: wrap; gap: 0.8rem; margin-bottom: 0;}
    #applyBar .formWrap .inputArea .list li {width: 100%;}
    #applyBar .formWrap .inputArea .list li:last-child {width: 100%;}
    #applyBar .formWrap .inputArea .list input {font-size: 1.6rem; line-height: 1.1; padding: 0.9rem 1rem;}
    #applyBar .formWrap .inputArea .list select {font-size: 1.6rem !important; background-position: right 5% center;}
    #applyBar .formWrap .inputArea .check {font-size: 1.8rem;}
    #applyBar .formWrap .inputArea .check input {width: 1.4rem; height: 1.4rem; margin-right: 0.4rem;}
    #applyBar .formWrap .inputArea .check label {font-size: 1.1rem}
    #applyBar .formWrap .inputArea .check a {font-size: 1.1rem; margin-left: 0.2rem;}
    #applyBar .formWrap .applyBtn {width: auto; height: auto; font-size: 1.4rem; padding: 0.6rem 2.3rem; border-radius: 23px; position: absolute; font-weight: 800; bottom: -0.7rem; right: 0;}
    #applyBar .formWrap .applyBtn i {display: inline;}
}

























.
