#header {z-index: 999}
#header .inner {max-width: 90%; margin: 0 auto; padding: 1.8rem 0; transition: 0.4s}
#header .logo {max-width: 24rem}
#header .gnb {}
#header .gnb li {}
#header .gnb li + li {padding-left: 2rem; margin-left: 2rem;}
#header .gnb li + li::before {content: ''; display: block; position: absolute; left: 0; height: 70%; top: 50%; transform: translateY(-50%); background: #000; width: 1px;}
#header .gnb li a {display: block;}
#header.fix .inner {padding: 1.4rem 0}

#wrap {padding-top: 6rem}

/** 섹션9 **/
.s9 .cont {padding-top: 24rem}
.s9 .s9_swiper {overflow: hidden;}
.s9 .s9_swiper .s9_prev,
.s9 .s9_swiper .s9_next {width: 4.8rem; height: 4.8rem;}
.s9 .s9_swiper .s9_prev::after,
.s9 .s9_swiper .s9_next::after {display: none}
.s9 .s9_swiper .s9_prev {background: url('../img/main/s9_prev.png') no-repeat center/contain; left: 11.6rem;}
.s9 .s9_swiper .s9_next {background: url('../img/main/s9_next.png') no-repeat center/contain; right: 11.6rem;}

/** 섹션11 **/
.s11 .ico1 {bottom: 50%; left: 59%; width: 18%;}
.s11 .ico2 {bottom: 37.4%; left: 59%; width: 21%;}
.s11 .ico3 {bottom: 24.8%; left: 59%; width: 21%;}


#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;}

#footer {padding-bottom: 10rem}

@keyframes colorChange{
    0% {background: #FF7A00}
    30% {background: #3EC7F4}
    70% {background: #FF7A00}
    100% {background: #3EC7F4}
}


@media all and (max-width: 800px){
    #header .logo {max-width: 50%}
    #header .logo img {width: 100%; display: block;}
    #header .inner {flex-direction: column; gap: 1rem; padding: 1.2rem 0; max-width: 95%;}
    #header .gnb {font-size: 1.1rem}
    #header .gnb li + li {padding-left: 0.8rem; margin-left: 0.8rem;}
    #header.fix .inner {padding: 1.2rem 0}

    .s9 {}
    .s9 .cont {padding-top: 8rem;}
    .s9 .s9_swiper .s9_prev,
    .s9 .s9_swiper .s9_next {width: 2.4rem; height: 2.4rem; top: 57%;}
    .s9 .s9_swiper .s9_prev {left: 2.2rem;}
    .s9 .s9_swiper .s9_next {right: 2.2rem;}

    .s11 .ico1 {bottom:26%; left: 48%; transform: translateX(-50%); width: 47%;}
    .s11 .ico2 {bottom: 17%; left: 50%; transform: translateX(-50%); width: 50%;}
    .s11 .ico3 {bottom: 8%; left: 50%; transform: translateX(-50%); width: 50%;}

    #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}

    #footer {padding-bottom: 14rem;}
}

#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}
}
