body {padding-bottom: 7rem;}

#header {z-index: 99999; transition: 0.4s;}
.header {}
.header .logo {padding: 2.2rem 0;}
.header .logo img {max-width: 29.2rem;}
.header .gnb {gap: 8rem;}
.header .gnb::before {content: ''; display: block; position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 88%; height: 1px; background: #C1C1C1}
.header .gnb li {}
.header .gnb li  a {display: inline-block; padding: 2.5rem 0;}

@media all and (max-width: 800px){
    body {padding-bottom: 18rem;}

    .moHeader .logo {padding: 1.2rem 0;}
    .moHeader .logo img {max-width: 55%}
    .moHeader .gnb {font-size: 1.35rem; gap: 0; font-weight: bold;}
    .moHeader .gnb::before {content: ''; display: block; position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 88%; height: 1px; background: #C1C1C1}
    .moHeader .gnb li + li {padding-left: 6px; margin-left: 6px;}
    .moHeader .gnb li + li::before {content: ''; display: block; position: absolute; left: 0; top: 50%; transform: translateY(-50%); background: #000; height: 30%; width: 1px;}
    .moHeader .gnb li a {padding: 1.5rem 0; display: inline-block;}
}

#aside_right {top: 25%; z-index: 9;}
#aside_right ul {background: #fff}
#aside_right ul li {padding: 1.9rem 0 1.2rem; width: 11rem;}
#aside_right ul li:nth-child(6) {background: rgb(238,223,200); background: linear-gradient(180deg, rgba(238,223,200,1) 0%, rgba(210,179,132,1) 100%);}
#aside_right ul li + li {border-top: 1px solid #E8E8E8;}
#aside_right ul li a {}
#aside_right ul li a img {max-width: 3.2rem; margin-bottom: 0.8rem}
#aside_right .top {background: #092142; padding: 1.5rem 0;}

@media all and (max-width: 800px){
    #aside_right {right: 2rem; top: auto; bottom: 25%;}
    #aside_right ul {background: none;}
    #aside_right ul li {width: auto; padding: 3px 0; text-align: center;}
    #aside_right ul li:nth-child(1) {background: none}
    #aside_right ul li + li {border: 0}
    #aside_right ul li a img {max-width: 100%; margin: 0; max-width: 4.2rem; filter: drop-shadow(0 0 3px rgba(0,0,0,0.2));}
    #aside_right ul li.top {width: 4.2rem; height: 4.2rem; background: #092142; display: grid; place-items: center; color: #fff; border-radius: 100%; margin: 3px 0; font-size: 1.1rem}
}

#consult {background: #312D2B; z-index: 999; font-size: 1.4rem}
#consult .inner {max-width: 122rem; padding: 2.6rem 0;}
#consult form {}
#consult .title {padding-right: 2.2rem}
#consult .form_area {gap: 1.5rem; margin-right: 1.5rem;}
#consult .form_area input {height: 4.5rem; border: 0; border-radius: 0; box-shadow: none; background: #fff; width: 18rem}
#consult .form_area select {height: 4.5rem; border: 0; border-radius: 0; box-shadow: none; background: #fff; width: 18rem}
#consult .form_area input.phone {width: 23rem;}
#consult .from_box {gap: 1.5rem;}
#consult .agree_area {}
#consult .submit_btn {margin-left: auto; padding: 1.1rem 3.3rem; border-radius: 30px; background: #FF7A00; animation: colorChange 1s step-end infinite;}

@keyframes colorChange{
    0% {background: #FF7A00}
    30% {background: #3EC7F4}
    70% {background: #FF7A00}
    100% {background: #3EC7F4}
}

@media all and (max-width: 800px){
    #consult .inner {max-width: 34rem; padding: 1rem 0;}
    #consult form {flex-direction: column;}
    #consult .form_area {gap: 3px; flex-direction: column; width: 100%; margin-right: 0;}
    #consult .form_area input {width: 15.5rem; height: 3rem;}
    #consult .form_area select {position: absolute; top: calc(-100% + -3px); right: 0; height: 3rem;}
    #consult .form_area input.phone {width: 100%;}
    #consult .from_box {gap: 5px}
    #consult .agree_area {flex-direction: row; padding: 0.5rem 0; gap: 1rem; align-items: center;}
    #consult .agree_area a {padding: 1px 2px; font-size: 1rem;}
    #consult .agree_area div {padding-top: 0; font-size: 1rem;}
    #consult .agree_area input {width: 11px; height: 11px;}
    #consult .submit_btn {padding: 0.4rem 6rem; margin-left: 0; font-size: 2.4rem}

    #consult .link_bot {padding: 7px;}
    #consult .link_bot li {flex: 1}
    #consult .link_bot li:last-child {border-left: 1px solid #E9E9E9}
    #consult .link_bot li a {padding:1.8rem 0; padding-left: 20%;}

    #consult .form_area input {font-size: 16px}
    #consult .form_area select {font-size: 16px}

}

#main {padding-top: 18rem; }

#s18 {}
#s18 .cont {width: 100%;}
#s18 .cont .mapArea {width: 50%;}
#s18 .cont .mapArea .root_daum_roughmap .wrap_controllers {display: none}
#s18 .cont .img {width: 50%}

.linkArea {width: 12.7%; height: 40%; top: 39%;}
.linkArea a {display: block; height: 100%}
.linkArea1 {left: 9.5%}
.linkArea2 {left: 23.5%}
.linkArea3 {left: 36.7%}
.linkArea4 {left: 50.7%}
.linkArea5 {left: 64.3%}
.linkArea6 {left: 77.7%}

@media all and (max-width: 800px){
    #main {padding-top: 12rem; padding-bottom: 0}

    .linkArea {width: 36%; height: 22%;}
    .linkArea1 {left: 11.5%; top: 20%;}
    .linkArea2 {left: 51.5%; top: 20%;}
    .linkArea3 {left: 11.7%; top: 44%;}
    .linkArea4 {left: 51.7%; top: 44%;}
    .linkArea5 {left: 11.3%; top: 68%;}
    .linkArea6 {left: 52%; top: 68%;}
}
