/* 헤더 영역 */
.header-area {
    height: 8rem;
    width: 100%;
    position: fixed;
    top: 0;
    z-index: 100;
}
.header-area.active {
    background-color: #FFEFCC;
}
.header-area .wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 100%;
    max-width: 148rem;
}
.header-area .logo {
    width: 10.4rem;
}
.header-area ul {
    gap: 4.8rem;
}
.header-area ul li a {
    font-weight: 500;
    font-size: 2rem;
    line-height: 1.4;
    color: #4F1C00;
}
.header-area ul li a.active {
    font-weight: 700;
    color: #000;
}
.header-area ul li a.apply {
    background-color: #4F1C00;
    color: #FFEFCC;
    padding: 1.6rem 3.2rem;
    text-align: center;
    line-height: 1.2;
    width: 21.8rem;
    margin-left: 1.2rem;
    transition: .3s;
}
.header-area ul li a.apply:hover {
    background-color: #EA401F;
}
.header-area .menu-btn {
    display: none;
    width: 3.2rem;
    height: 3.2rem;
    background: url(../img/ico_menu.svg)no-repeat center/cover;
    cursor: pointer;
}
.header-area .close-btn {
    width: 3.2rem;
    height: 3.2rem;
    background: url(../img/ico_close.svg)no-repeat center/cover;
    cursor: pointer;
}

/* 사이드바 */
.side-area {
    z-index: 1000;
    position: fixed;
    top: 0;
    right: -100%;
    width: 100%;
    height: 100vh;
    transition: 0.3s;
}
.side-area.active {
    right: 0;
}
.side-area .header-area .wrap {
    justify-content: space-between;
}
.side-area .logo-box {
    padding: 4.8rem 4rem 4.4rem;
}
.side-area .logo-box a {
    width: 17.7rem;
}
.side-area .middle-box {
    margin-top: 14rem;
    height: 100%;
}
.side-area .middle-box ul {
    gap: 4.8rem;
}
.side-area .middle-box ul li a {
    font-size: 2rem;
    font-weight: 500;
    display: block;
    color: #4F1C00;
    text-align: center;
    margin-top: 1.2rem;
}
.side-area .middle-box ul li a.active {
    color: #000;
    font-weight: 700;
}
.side-area .middle-box ul li .apply {
    font-size: 1.8rem;
    color: #fff;
    background-color: #4F1C00;
    padding: 1.6rem;
    width: 21.8rem;
}
.side-area .obj-1 {
    bottom: 1.5rem;
    height: 20%;
    right: 0;
}

/* 플로팅 버튼 */
.floating {
    height: 6rem;
    visibility: hidden;
    opacity: 0;
    transition: .3s;
}

@media (max-width: 1279px) {

    .header-area {
        height: 6.8rem;
    }
    .header-area .logo {
        width: 7rem;
    }
    .header-area ul {
        display: none;
    }
    .header-area .menu-btn {
        display: block;
    }
    .floating.active {
        visibility: visible;
        opacity: 1;
    }

}

@media (max-width: 800px) {

    .header-area {
        height: 5.6rem;
    }
    .header-area .logo {
        width: 5rem; 
    }
    .header-area .close-btn,
    .header-area .menu-btn {
        width: 2.4rem;
        height: 2.4rem;
    }

}
/* //헤더 영역 */


/* ------------------------------------------------------------------------------- */


/* 메인 비주얼 영역 */
.main-visual-area {
    overflow: hidden;
    padding-top: 2rem;
    height: 100dvh;
}
.main-visual-area .wrap {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    max-width: 86rem;
}
.main-visual-area .title-1 {
    max-width: 26.2rem;
}
.main-visual-area .title-2 {
    margin-bottom: 1.2rem;
    max-width: 62rem;
}
.main-visual-area .visual {
    width: 90%;
    margin-top: 2rem;
    margin-bottom: 4.8rem;
}
.main-timer-area {
    width: 87%;
}
.main-timer-area .timer {
    gap: .6rem;
}
.main-timer-area .timer .box > div {
    width: 6.4rem;
}
.main-timer-area .timer .box > div,
.main-timer-area .timer .time-circle {
    font-size: 6rem;
}
.main-timer-area > a {
    padding: 1.6rem 3.8rem;
    transition: .3s;
}
.main-timer-area > a:hover {
    background-color: #EA401F;
}
.visual {
    width: 86rem;
}
.visual .item-2 {
    width: 33.1111%;
    left: 1.7%;
    top: 1.6%;
}
.visual .item-3 {
    top: 4%;
    left: 5.2%;
    width: 17.2%;
}
.visual .item-4 {
    width: 13.3%;
    top: -1%;
    left: 36.75%;
}
.visual .item-5 {
    width: 27.2%;
    top: 0;
    right: 1.5%;
}
.visual .item-6 {
    top: 9%;
    right: 27%;
    width: 9.25%;
}
.visual .item-7 {
    width: 11.9%;
    bottom: 10%;
    left: 15.8%;
}
.visual .item-8 {
    width: 27.8%;
    top: 41.8%;
    left: 19%;
}
.visual .item-9 {
    width: 33.2%;
    bottom: -4.8%;
    left: -8.5%;
}
.visual .item-10 {
    width: 50.1%;
    bottom: -4%;
    right: 6%;
}

@media (max-width: 1279px) {
    .main-visual-area .title-2 {
        max-width: 60rem;
    }
    .main-visual-area .title-3 {
        font-size: 2rem;
    }
    .main-visual-area .wrap {
        max-width: 76rem;
    }
    .main-timer-area > a {
        font-size: 2rem;
        padding: 1.6rem 3.2rem;
    }
}
@media (max-width: 800px) {
    .main-visual-area .title-1 {
        max-width: 16.2rem;
    }
    .main-visual-area .title-2 {
        margin-top: .8rem;
        margin-bottom: 1.6rem;
    }
    .main-visual-area .title-2 img {
        content: url(../img/kv-title-m.svg);
    }
    .main-visual-area .title-3 {
        font-size: 1.5rem;
    }
    .main-visual-area .visual {
        width: 100%;
        max-width: 40rem;
        margin-top: 2rem;
        margin-bottom: 3rem;
    }
    .main-timer-area {
        width: 100%;
        max-width: 25rem;
        flex-direction: column;
        gap: 2rem;
    }
    .main-timer-area .timer {
        gap: .4rem;
    }
    .main-timer-area .timer .box > div {
        width: 4.8rem;
    }
    .main-timer-area .timer .box > div, .main-timer-area .timer .time-circle {
        font-size: 4.4rem;
    }
    .main-timer-area .timer .box span {
        font-size: 1rem;
    }
    .main-timer-area > a {
        width: 100%;
        padding: 1.2rem 0;
        font-size: 1.5rem;
    }
}

@media (min-width: 801px) and (max-width: 1279px) and (min-height: 700px) and (max-height: 800px) {
    .main-visual-area .visual {
        width: 58vh;
    }
}

/* //메인 비주얼 영역 */


/* ------------------------------------------------------------------------------- */


/* 챌린지 영역 */
.challenge-area {
    padding: 24rem 0;
}
.challenge-area .wrap .item-box {
    gap: 4rem;
    max-width: 92rem;
    margin-bottom: 10rem;
}
.challenge-area .wrap .item-box .item:nth-of-type(3) img {
    animation-delay: .3s;
}
.challenge-area .wrap .text-box h1 {
    font-size: 5.6rem;
}
.challenge-area .wrap .text-box p:nth-child(2) {
    margin-top: 3.2rem;
    margin-bottom: 5.2rem;
}
.challenge-area .obj-3 {
    left: 12rem;
}

@media (max-width: 1279px) {
    .challenge-area {
        padding: 16rem 0 26rem 0;
    }
    .challenge-area .obj-1 {
        width: 40.8rem;
    }
    .challenge-area .obj-2 {
        width: 31.6rem;
    }
    .challenge-area .obj-3 {
        width: 18rem;
        left: 3.3rem;
    }
    .challenge-area .wrap .item-box {
        gap: 2.4rem;
        max-width: 55.2rem;
        margin-bottom: 6rem;
    }
    .challenge-area .wrap .text-box h1 {
        font-size: 4rem;
    }
    .challenge-area .wrap .text-box p {
        font-size: 1.8rem;
    }
    .challenge-area .wrap .text-box p:nth-child(2) {
        margin-top: 2.4rem;
        margin-bottom: 4rem;
    }
}

@media (max-width: 800px) {
    .challenge-area .obj-1 {
        width: 26.8rem;
    }
    .challenge-area .obj-2 {
        width: 21.2rem;
    }
    .challenge-area .obj-3 {
        width: 14rem;
        left: 1rem;
    }
    .challenge-area .wrap .item-box {
        gap: 1rem;
        max-width: 30.2rem;
        margin-bottom: 4rem;
    }
    .challenge-area .wrap .text-box h1 {
        font-size: 2.8rem;
    }
    .challenge-area .wrap .text-box p {
        font-size: 1.5rem;
    }
    .challenge-area .wrap .text-box p:nth-child(2) {
        margin: 2.8rem 0;
    }
}
/* //챌린지 영역 */


/* ------------------------------------------------------------------------------- */


/* 공모전 소개 영역 */
.contest-area .title {
    margin-bottom: 6rem;
}
.contest-area .how-to-party {
    gap: 2rem;
    padding: 4rem 8rem;
    border-radius: 4rem;
    border-radius: 40px;
    margin-bottom: 10rem;
}
.contest-area .how-to-party .party-type {
    gap: 2.4rem;
}
.contest-area .how-to-party .party-type .type {
    padding: 2rem 0;
    width: 26rem;
    border-radius: 4rem;
}
.contest-area .card-box {
    grid-template-columns: 1fr 1fr;
    gap: 4rem;
}
.contest-area .card-box .card .tag {
    padding: 2rem 0;
    width: 32rem;
    text-align: center;
    border-radius: 4rem;
    border: .2rem solid #000;
}
.contest-area .card-box .card .conts {
    gap: 4rem;
    border-radius: 16rem 16rem 6rem 6rem;
    border-color: #000;
    border-style: solid;
    border-top-width: .2rem;
    border-left-width: .2rem;
    border-right-width: .2rem;
    border-bottom-width: .6rem;
}
.contest-area .card-box .card-1 .conts .card-img {
    animation-delay: .3s;
}
.contest-area .card-box .card .conts .card-text {
    padding-top: 4rem;
    border-top: .1rem solid #4F1C00;
}
.contest-area .card-box .card-2 .conts .card-text {
    border-color: #fff;
}
.contest-area .obj-1 {
    top: 19.6rem;
    left: -5.5rem;
}
.contest-area .obj-2 {
    top: 22.5rem;
    left: -13.5rem;
}
.contest-area .obj-2 img {
    animation-delay: .3s;
}
.contest-area .obj-3 {
    bottom: -6.8rem;
    right: -11rem;
}
.contest-area .obj-3 img {
    animation-delay: .6s;
}
.contest-area .obj-4 {
    top: -2.5rem;
    right: 41.5rem;
}
.contest-area .obj-4 img {
    animation-delay: .6s;
}

@media (max-width: 1279px) {
    .contest-area .wrap {
        max-width: 76rem;
    }
    .contest-area .obj-4 {
        top: -3.5rem;
        right: 20rem;
        width: 4rem;
    }
    .contest-area .obj-1 {
        top: 23rem;
        left: 5rem;
        width: 10.5rem;
    }
    .contest-area .obj-2 {
        top: 25rem;
        left: .5rem;
        width: 9.8rem;
    }
    .contest-area .obj-3 {
        bottom: -5rem;
        right: 1rem;
        width: 10.4rem;
    }
    .contest-area .how-to-party {
        padding: 2.8rem 0;
        width: 100%;
        max-width: 60rem;
        align-items: center;
    }
    .contest-area .how-to-party p {
        font-size: 2.8rem;
    }
    .contest-area .how-to-party .party-type .type {
        padding: 1.2rem 2.8rem;
        width: 20rem;
        font-size: 2.4rem;
    }
    .contest-area .card-box {
        gap: 2.3rem;
    }
    .contest-area .card-box .card {
        padding-top: 3.4rem;
    }
    .contest-area .card-box .card .tag {
        padding: 1.2rem;
        width: 18rem;
        font-size: 2.2rem;
    }
    .contest-area .card-box .card .conts {
        border-radius: 8rem 8rem 3rem 3rem;
        padding-top: 4.6rem;
        gap: 2.4rem;
    }
    .contest-area .card-box .card .conts .card-title h2 {
        font-size: 3.6rem;
    }
    .contest-area .card-box .card .conts .card-title p {
        font-size: 2.8rem;
    }
    .contest-area .card-box .card .conts .card-img {
        max-width: 22rem;
    }
    .contest-area .card-box .card .conts .card-text {
        font-size: 1.7rem;
        padding-top: 2.4rem;
    }
}

@media (max-width: 800px) {
    .contest-area .wrap {
        max-width: 34rem;
    }
    .contest-area .title {
        margin-bottom: 4rem;
    }
    .contest-area .how-to-party {
        background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='18' ry='18' stroke='%23333' stroke-width='4' stroke-dasharray='4%2c 10' stroke-dashoffset='0' stroke-linecap='square'/%3e%3c/svg%3e");
        border-radius: 1.8rem;
        gap: 1.2rem;
        padding: 1.6rem 0;
        max-width: 28rem;
        margin-bottom: 4.8rem;
    }
    .contest-area .how-to-party p {
        font-size: 1.8rem;
    }
    .contest-area .how-to-party .party-type {
        gap: 1.2rem;
    }
    .contest-area .how-to-party .party-type .type {
        padding: .8rem 2rem;
        width: auto;
        font-size: 1.6rem;
    }
    .contest-area .card-box {
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%;
    }
    .contest-area .card-box .card {
        padding-top: 3rem;
        width: 100%;
    }
    .contest-area .card-box .card .tag {
        width: 16rem;
        font-size: 1.8rem;
    }
    .contest-area .card-box .card .conts {
        border-radius: 6rem 6rem 2.4rem 2.4rem;
        padding-top: 4.3rem;
        gap: 2rem;
        border-bottom-width: .4rem;
    }
    .contest-area .card-box .card .conts .card-title h2 {
        font-size: 3.2rem;
    }
    .contest-area .card-box .card .conts .card-title P {
        font-size: 2.4rem;
    }
    .contest-area .card-box .card .conts .card-img {
        max-width: 20rem;
    }
    .contest-area .card-box .card .conts .card-text {
        font-size: 1.5rem;
        padding-top: 2rem;
    }
    .contest-area .obj-4 {
        top: -2.5rem;
        right: 7rem;
        width: 3rem;
    }
    .contest-area .obj-1,
    .contest-area .obj-2 {
        display: none;
    }
    .contest-area .obj-3 {
        width: 8.4rem;
    }
}
/* //공모전 소개 영역 */


/* ------------------------------------------------------------------------------- */


/* 수상자 혜택 영역 */
.benefit-area .wrap {
    max-width: 106rem;
}
.benefit-area .title {
    margin-bottom: 12rem;
}
.benefit-area .card-box {
    gap: 4rem;
}
.benefit-area .card-box .card .tag {
    padding: 1.6rem 4rem;
    border-radius: 4rem;
    border: .2rem solid #000;
}
.benefit-area .card-box .card .conts {
    gap: 3rem;
    border-radius: 8rem 8rem 4rem 4rem;
    border-color: #000;
    border-style: solid;
    border-top-width: .2rem;
    border-left-width: .2rem;
    border-right-width: .2rem;
    border-bottom-width: .6rem;
}
.benefit-area .card-box .card .conts .card-img {
    background-color: rgba(255, 255, 255, .3);
    border-radius: 2rem;
}
.benefit-area .guide-box {
    gap: 4.8rem;
    padding: 6rem;
    border-radius: 4rem;
    border-color: #000;
    border-style: solid;
    border-top-width: .2rem;
    border-left-width: .2rem;
    border-right-width: .2rem;
    border-bottom-width: .6rem;
    margin-top: 4.8rem;
}
.benefit-area .guide-box .guide {
    gap: 2rem;
}
.benefit-area .obj-3 {
    width: 11.5rem;
    left: 30rem;
    top: 12rem;
}
.benefit-area .obj-4 {
    width: 28.9rem;
    right: -2rem;
    bottom: -3rem;
}
.benefit-area .obj-4 img {
    animation-delay: .3s;
}

@media (max-width: 1279px) {
    .benefit-area {
        padding: 14rem 0;
    }
    .benefit-area .wrap {
        max-width: 76rem;
    }
    .benefit-area .title {
        margin-bottom: 6rem;
    }
    .benefit-area .card-box {
        gap: 2rem;
        overflow-x: auto;
        scroll-behavior: smooth;
        -webkit-overflow-scrolling: touch;
    }
    .benefit-area .card-box:-webkit-scrollbar {
        display: none;
    }
    .benefit-area .card-box .card {
        padding-top: 2.4rem;
        min-width: 21.2rem;
    }
    .benefit-area .card-box .card .tag {
        padding: 1rem 0;
        width: 12rem;
        text-align: center;
        font-size: 2rem;
    }
    .benefit-area .card-box .card .conts {
        gap: 2rem;
        border-radius: 6rem 6rem 3rem 3rem;
        padding: 4.6rem 2.4rem 2.4rem;
        border-bottom-width: .4rem;
    }
    .benefit-area .card-box .card .conts .card-img {
        border-radius: 1.4rem;
    }
    .benefit-area .card-box .card .conts h2 {
        font-size: 2rem;
    }
    .benefit-area .guide-box {
        border-radius: 3rem;
        border-bottom-width: .4rem;
        padding: 3rem;
        gap: 3.6rem;
    }
    .benefit-area .guide-box .guide {
        gap: 1.6rem;
    }
    .benefit-area .guide-box .guide p {
        font-size: 2rem;
    }
    .benefit-area .guide-box .guide .dot-list li {
        font-size: 1.7rem;
    }
    .benefit-area .obj-1 {
        width: 34.5rem;
    }
    .benefit-area .obj-2 {
        width: 44.7rem;
    }
    .benefit-area .obj-3 {
        width: 7.8rem;
        left: 10rem;
        top: 6.5rem;
    }
    .benefit-area .obj-4 {
        width: 20.5rem;
        right: 2.5rem;
        bottom: -6rem;
    }
}

@media (max-width: 800px) {
    .benefit-area {
        padding: 10rem 0 16rem 0;
    }
    .benefit-area .title {
        margin-bottom: 4rem;
    }
    .benefit-area .guide-box {
        border-radius: 1.4rem;
        padding: 2rem;
        gap: 2rem;
    }
    .benefit-area .guide-box .guide {
        gap: 1.2rem;
    }
    .benefit-area .guide-box .guide p {
        font-size: 1.6rem;
    }
    .benefit-area .guide-box .guide .dot-list li {
        font-size: 1.5rem;
    }
    .benefit-area .obj-4 {
        width: 10rem;
        right: auto;
        bottom: -13rem;
        left: 50%;
        transform: translateX(-50%);
    }
    .benefit-area .obj-1 {
        width: 20rem;
    }
    .benefit-area .obj-2 {
        width: 22.8rem;
    }
    .benefit-area .obj-3 {
        width: 4.3rem;
        left: 4rem;
        top: 4rem;
    }
}
/* //수상자 혜택 영역 */


/* ------------------------------------------------------------------------------- */


/* 지원방법 영역 */
.apply-area .title {
    margin-bottom: 7rem;
}
.apply-area .apply-box {
    gap: 2.8rem;
    max-width: 93rem;
    margin: 0 auto;
}
.apply-area .apply-box .apply-box-text {
    gap: 4.8rem;
    word-break: keep-all;
}
.apply-area .apply-box .apply-box-text li {
    gap: 2rem;
}
.apply-area .apply-box .apply-box-text li .tag {
    border: .2rem solid #000;
    border-radius: 4rem;
    padding: 1.6rem 4rem;
    white-space: nowrap;
}
.apply-area .apply-box .grid-box {
    grid-template-columns: 1fr 1fr;
    gap: 4rem;
}
.apply-area .apply-box .grid-box .box h3 {
    padding: 1.6rem 4rem;
    border-top: .2rem solid #000;
    border-bottom: .1rem solid #000;
}
.apply-area .apply-box .grid-box .box .dot-list li::before {
    /* background-color: #4F1C00; */
}
.apply-area .obj-1 {
    top: -16rem;
    left: 0;
}
.apply-area .obj-2 {
    top: -6.5em;
    right: -2rem;
    width: 24rem;
}
.apply-area .apply-box .grid-box .box p {
    word-break: keep-all;
}
@media (max-width: 1279px) {
    .apply-area {
        padding: 14rem 0;
    }
    .apply-area .title {
        margin-bottom: 6rem;
    }
    .apply-area .apply-box {
        max-width: 76rem;
    }
    .apply-area .apply-box .apply-box-text {
        gap: 3.2rem;
    }
    .apply-area .apply-box .apply-box-text li {
        gap: 1.2rem;
    }
    .apply-area .apply-box .apply-box-text li .tag {
        padding: 1rem 2.8rem;
        font-size: 2rem;
    }
    .apply-area .apply-box .apply-box-text li p {
        font-size: 1.7rem;
    }
    .apply-area .apply-box .grid-box {
        gap: 3.2rem 2.4rem;
    }
    .apply-area .apply-box .grid-box .box h3 {
        padding: 1.2rem 0;
        font-size: 1.5rem;
    }
    .apply-area .apply-box .grid-box .box p {
        padding-top: 1.6rem;
        font-size: 1.6rem;
    }
    .apply-area .apply-box .grid-box .box .dot-list li,
    .apply-area .apply-box .grid-box .box span {
        font-size: 1.5rem;
    }
    .apply-area .obj-1 {
        top: -14rem;
        left: 4rem;
        width: 10.5rem;
    }
    .apply-area .obj-2 {
        top: -2em;
        right: 2rem;
        width: 13rem;
    }
}

@media (max-width: 800px) {
    .apply-area {
        padding: 10rem 0;
    }
    .apply-area .title {
        margin-bottom: 4rem;
    }
    .apply-area .apply-box {
        gap: 2rem;
    }
    .apply-area .apply-box .apply-box-text {
        gap: 2.4rem;
    }
    .apply-area .apply-box .apply-box-text li {
        gap: .8rem;
        flex-direction: column;
        align-items: flex-start;
    }
    .apply-area .apply-box .apply-box-text li .tag {
        padding: .8rem 2rem;
        font-size: 1.6rem;
    }
    .apply-area .apply-box .apply-box-text li p {
        font-size: 1.5rem;
    }
    .apply-area .apply-box .grid-box {
        grid-template-columns: 1fr;
        gap: 2rem;
    }
    .apply-area .apply-box .grid-box .box h3,
    .apply-area .apply-box .grid-box .box p,
    .apply-area .apply-box .grid-box .box .dot-list li,
    .apply-area .apply-box .grid-box .box span {
        font-size: 1.4rem;
        word-break: keep-all;
    }
    .apply-area .apply-box .grid-box .box .dot-list,
    .apply-area .apply-box .grid-box .box span {
        margin-top: 1.2rem;
    }
    .apply-area .obj-1 {
        top: -10rem;
        left: 2rem;
        width: 5.2rem;
    }
    .apply-area .obj-2 {
        top: -1em;
        right: 2rem;
        width: 7rem;
    }
}
/* //지원방법 영역 */


/* ------------------------------------------------------------------------------- */


/* 전형안내 영역 */
.step-area .wrap picture {
    max-width: 92.8rem;
}
.step-area .border-dashed {
    padding: 2.8rem 4rem;
    background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='40' ry='40' stroke='%23333' stroke-width='3' stroke-dasharray='3%2c10' stroke-dashoffset='0' stroke-linecap='square'/%3e%3c/svg%3e");
    border-radius: 4rem;
    margin-top: 4.5rem;
}
.step-area .border-dashed p {
    position: relative;
    padding-left: 2.4rem;
    font-size: 2rem;
}
.step-area .border-dashed p::before {
    position: absolute;
    content: '※';
    left: 0;
}
.step-area .obj-1 {
    top: -11rem;
    left: -2rem;
}
.step-area .obj-2 {
    top: 6rem;
    right: 8rem;
}
.step-area .obj-3 {
    bottom: -2rem;
    right: 11rem;
    width: 13.3rem;
}
.step-area .obj-3 img {
    animation-delay: .3s;
}

@media (max-width: 1279px) {
    .step-area {
        padding: 14rem 0;
    }
    .step-area .wrap {
        max-width: 75.4rem;
    }
    .step-area .border-dashed {
        padding: 2rem 3.2rem;
        margin-top: 6rem;
    }
    .step-area .border-dashed p {
        font-size: 1.8rem;
    }
    .step-area .obj-1 {
        top: -12rem;
        left: 4rem;
        width: 16.4rem;
    }
    .step-area .obj-2 {
        top: 9rem;
        right: -1rem;
        width: 5rem;
    }
    .step-area .obj-3 {
        bottom: -7.2rem;
        right: 3rem;
        width: 8.3rem;
    }
}

@media (max-width: 800px) {
    .step-area {
        padding: 10rem 0;
    }
    .step-area .title {
        margin-bottom: 4rem;
    }
    .step-area .border-dashed {
        padding: 2rem 2rem;
        background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='18' ry='18' stroke='%23333' stroke-width='3' stroke-dasharray='4%2c8' stroke-dashoffset='0' stroke-linecap='square'/%3e%3c/svg%3e");
        border-radius: 1.8rem;
        margin-top: 4rem;
    }
    .step-area .border-dashed p {
        font-size: 1.4rem;
        padding-left: 1.8rem;
    }
    .step-area .obj-1 {
        display: none;
    }
    .step-area .obj-2 {
        top: -2rem;
        right: 10rem;
        width: 2.6rem;
    }
    .step-area .obj-3 {
        bottom: -4.2rem;
        right: 2rem;
        width: 6.3rem;
    }
}
/* //전형안내 영역 */


/* ------------------------------------------------------------------------------- */


/* faq 영역 */
.faq-area .wrap {
    max-width: 108rem;
}
.faq-area .list-box {
    gap: 1.6rem;
}
.faq-area .list-box > li {
    border-radius: 4rem;
    border-color: #000;
    border-style: solid;
    border-top-width: .2rem;
    border-left-width: .2rem;
    border-right-width: .2rem;
    border-bottom-width: .6rem;
    overflow: hidden;
}
.faq-area .list-box li .area-1 {
    cursor: pointer;
    padding: 4rem;
}
.faq-area .list-box li .area-1 .left-box {
    gap: 2.3rem;
    align-items: flex-start;
}
.faq-area .list-box li .area-1 .left-box span:nth-of-type(2) {
    line-height: 1.5;
}
.faq-area .list-box li .area-1 .icon-arrow {
    background-image: url(../img/ico_chevron.svg);
    width: 2.4rem;
    height: 2.4rem;
    transform: rotate(180deg);
    transition: .3s;
}
.faq-area .list-box li .area-2 {
    padding-left: 5.6rem;
    padding-top: .4rem;
    padding-bottom: 2rem;
    padding: .4rem 4rem 6rem 9.5rem;
    display: none;
}
.faq-area .list-box > li.active {
    background-color: #FFEFCC;
}
.faq-area .list-box > li.active .area-1 .icon-arrow {
    transform: rotate(0);
}
.faq-area .obj-1 {
    top: -3rem;
    left: -6rem;
    width: 6.2rem;
}

@media (max-width: 1279px) {
    .faq-area {
        padding: 14rem 0;
    }
    .faq-area .list-box > li {
        border-radius: 2.8rem;
        border-bottom-width: .4rem;
    }
    .faq-area .list-box li .area-1 {
        padding: 2.8rem 2.4rem;
        gap: 4rem;
        transition: .3s;
    }
    .faq-area .list-box li .area-2 {
        padding: 0 2.4rem 2.8rem 6.2rem;
    }
    .faq-area .list-box li .area-1 .left-box {
        gap: 1.4rem;
    }
    .faq-area .list-box li .area-1 .left-box span {
        font-size: 2rem;
        line-height: 1.5;
    }
    .faq-area .list-box li .area-2 ul li {
        font-size: 1.8rem;
    }
    .faq-area .list-box > li.active .area-1 {
        padding-bottom: 1.6rem;
    }
    .faq-area .obj-1 {
        top: -2rem;
        left: -4rem;
        width: 3.6rem;
    }
     .faq-area .list-box li .area-2 ul li strong.f22 {font-size: 1.8rem;}
}

@media (max-width: 800px) {
    .faq-area {
        padding: 10rem 0;
    }
    .faq-area .obj-1 {
        top: -1rem;
        left: -3rem;
        width: 2.6rem;
    }
    .faq-area .list-box {
        gap: 1.2rem;
    }
    .faq-area .list-box > li {
        border-radius: 2rem;
    }
    .faq-area .list-box li .area-1 {
        padding: 2rem;
        gap: .8rem;
    }
    .faq-area .list-box li .area-1 .icon-arrow {
        width: 2.0rem;
        height: 2.0rem;
    }
    .faq-area .list-box li .area-1 .left-box span:nth-of-type(1) {
        font-size: 2.4rem;
        line-height: 1;
    }
    .faq-area .list-box li .area-1 .left-box span:nth-of-type(2) {
        font-size: 1.6rem;
        padding-top: .1rem;
    }
    .faq-area .list-box li .area-2 {
        padding: 0 2rem 2rem 5.2rem;
    }
    .faq-area .list-box li .area-2 ul li {
        font-size: 1.5rem;
    }
     .faq-area .list-box li .area-2 ul li strong.f22 {font-size: 1.5rem;}
}
/* //faq 영역 */


/* ------------------------------------------------------------------------------- */


/* 타이머 영역 */
.timer-area .timer {
    margin-top: 5.2rem;
}
.timer-area .timer .box {
    gap: .8rem;
}
.timer-area .timer .box > div,
.timer-area .timer .time-circle {
    font-size: 15rem;
    text-align: center;
}
.timer-area .timer .box > div {
    width: 16rem;
}
.timer-area .obj-1 {
    width: 9.4rem;
    top: -2.4rem;
    right: -2rem;
}

@media (max-width: 1279px) {
    .timer-area {
        padding: 12rem 0;
    }
    .timer-area .title p {
        font-size: 5.2rem;
    }
    .timer-area .timer {
        margin-top: 4rem;
    }
    .timer-area .timer .box > div {
        width: 10.8rem;
    }
    .timer-area .timer .box > div, .timer-area .timer .time-circle {
        font-size: 10rem;
    }
    .timer-area .timer .box span {
        font-size: 1.6rem;
    }
    .timer-area .obj-1 {
        width: 5.4rem;
        top: -2rem;
        right: 1rem;
    }
}

@media (max-width: 800px) {
    .timer-area {
        padding: 8rem 0;
    }
    .timer-area .title {
        font-size: 2rem;
    }
    .timer-area .title p {
        font-size: 2.8rem;
    }
    .timer-area .timer {
        margin-top: 2rem;
    }
    .timer-area .timer .box {
        gap: .4rem;
    }
    .timer-area .timer .box > div {
        width: 5.2rem;
    }
    .timer-area .timer .box > div, .timer-area .timer .time-circle {
        font-size: 4.8rem;
    }
    .timer-area .timer .box span {
        font-size: 1rem;
    }
    .timer-area .obj-1 {
        width: 2.8rem;
        top: -1rem;
        right: 0rem;
    }
}
/* //타이머 영역 */


/* ------------------------------------------------------------------------------- */


/* footer 영역 */
footer {
    padding: 2rem 0;
}

@media (max-width: 1279px) {
    footer {
        padding-bottom: 8rem;
    }
    footer img {
        width: 8rem;
    }
}

@media (max-width: 800px) {
    footer img {
        width: 6rem;
    }
}
/* //footer 영역 */