@import url("../../css/reset.css");
@import url("https://hangeul.pstatic.net/hangeul_static/css/nanum-square-neo.css");

@font-face {
    font-family: 'GmarketSans';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansBold.woff') format('woff');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'Pretendard';
    src: url(/common/font/Pretendard-Light.woff);
    font-weight: 200;
    font-style: normal;
}

@font-face {
    font-family: 'Pretendard';
    src: url(/common/font/Pretendard-Regular.woff);
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: "Pretendard";
    src: url(/common/font/Pretendard-Medium.woff);
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: "Pretendard";
    src: url(/common/font/Pretendard-SemiBold.woff);
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: "Pretendard";
    src: url(/common/font/Pretendard-Bold.woff);
    font-weight: 600;
    font-style: normal;
}

body,
html {
    overflow-x: hidden;
    font-family: 'Pretendard', sans-serif !important;
    margin: 0;
    padding: 0;
    font-variant-numeric: tabular-nums;
    /* scroll-behavior: smooth;  */ /* 부드러운 스크롤 */
}

.only-pc {
    display: block !important;
}

.only-mo {
    display: none !important;
}

/* wrap */

.wrap {
    position: relative;
}

/* header */

.header {
    display: flex;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 78px;
    justify-content: space-between;
    align-items: center;
    z-index: 999;
    padding: 15px 70px;
    backdrop-filter: blur(30px);
    border-bottom: solid 1px rgba(255, 255, 255, 0.12);
    background-color: rgba(0, 0, 0, 0.05);
    box-sizing: border-box;
}

.logo-taxwatch,
.logo-douzone {
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-position: center;
    height: 18px;
}

.logo-taxwatch {
    width: 128px;
    background-image: url(../images/logo-taxwatch.png);
}

.logo-douzone {
    width: 110px;
    background-image: url(../images/logo-douzone.png);
}

.logo-taxwatch a,
.logo-douzone a {
    display: block;
    width: 100%;
    height: 100%;
}

/* section01 */

.section01 {
    position: relative;
    box-sizing: border-box;
    width: 100%;
    height: 1080px;
    text-align: center;
    background-image: url("/html/event/250912/images/img_section01.webp");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    padding-top: 150px;
}

.section01 .title {
    width: 100%;
    height: 587px;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url("/html/event/250912/images/text_section01.png");
}

.section01 .s1_btn_01 {
    cursor: pointer;
    position: absolute;
    bottom:224px;
    left: 50%;
    transform: translate(-50%);
    width: 484px;
    height: 80px;
    background: url(../images/apply_btn.png) no-repeat center/contain;
    z-index: 10;
    transition: background 0.3s;
}

.section01 .s1_btn_01:hover {
    background: url(../images/apply_btn_hover.png) no-repeat center/contain;
}

.section01 .s1_btn_01 a {
    display: block;
    width: 100%;
    height: 100%;
}

.section02 {
    background-image: url(../images/img_section02.jpg);
    width: 100%;
    height: 818px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    padding-top: 166px;
    box-sizing: border-box;
}

.section02 div {
    background-image: url(../images/text_section02.png);
    width: 1016px;
    height: 486px;
    text-align: center;
    margin: 0 auto;
}

/* 프로그램 일정*/
.section03 {
    position: relative;
    background-image: url(../images/img_section03.png);
    text-align: center;
    width: 100%;
    background-repeat: no-repeat;
    background-position: center;
    height: 905px;
}


.section04 {
    position: relative;
    width: 100%;
    height: 1571px;
    background-image: url("../images/img_section04.png");
    background-repeat: no-repeat;
    background-position: top;
    background-color: #f4f5f9;
}
.section04 .s4_btn_01 {
    display: inline-block;
    position: absolute;
    bottom:72px;
    left: 50%;
    transform: translate(-50%);
    width: 312px;
    height: 64px;
    background: url(../images/interview_btn.png) no-repeat center/contain;
}

.section04 .s4_btn_01:hover {
    background: url(../images/interview_btn_hover.png) no-repeat center/contain;
}

.section04 .s4_btn_01 a {
    display: inline-block;
    width: 100%;
    height: 100%;
}

.section05 {
    position: relative;
    width: 100%;
    height: 777px;
    background-image: url("../images/img_section05.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    background-color: #e9ecf3;
}

.section06 {
    position: relative;
    box-sizing: border-box;
    text-align: center;
    width: 100%;
    background-color: #f4f5f9;
    color: #1d1d1f;
    padding: 72px 24px;
}
.section06 .box {
    height: 89px;
    margin-bottom: 48px;
}
.section06 .title {
    font-size: 38px;
    font-weight: bold;
}

.section06 .address {
    font-size: 19px;
    padding-top: 22px;
    font-weight: 300;
    letter-spacing: -0.38px;
}

.section06 #map {
    width: 1016px;
    height: 320px;
    text-align: center;
    border-radius: 24px;
    border: solid 1px rgba(0, 0, 0, 0.1);
}


/* section07 */

.section07 {
    background-color: #e9ecf3;
    height: 461px;
    width: 100%;
    position: relative;
    padding-top: 72px;
    box-sizing: border-box;
}

.section07 .text {
    width: 100%;
    height: 213px;
    box-sizing: border-box;
    background: url(../images/img_section06.png) no-repeat center;
}

.section07 .btns {
    padding-top: 48px;
    text-align: center;
}

.section07 .btns a {
    display: inline-block;
    width: 312px;
    height: 64px;

}

.section07 .btns a.s7_btn_01 {
    background: url(../images/taxwatch_btn.png) no-repeat center/contain;
    margin-right: 10px;
    margin-bottom: 0;
}

.section07 .btns a.s7_btn_01:hover {
    background: url(../images/taxwatch_btn_hover.png) no-repeat center/contain;
}

.section07 .btns a.s7_btn_02 {
    background: url(../images/taxwatch_naver_btn.png) no-repeat center/contain;
}

.section07 .btns a.s7_btn_02:hover {
    background: url(../images/taxwatch_naver_btn_hover.png) no-repeat center/contain;
}

/* section08 */

.section08 {
    width: 100%;
    background-color: #fff;
    min-height: 780px;
    max-height: 1370px;
    padding-top: 72px;
    box-sizing: border-box;
    text-align: center;
    padding-bottom: 60px;
}

.section08 p.title {
    padding-bottom: 35px;
    font-size: 38px;
    color: #1d1d1f;
    line-height: 1.4;
    letter-spacing: -0.76px;
    font-weight: bold;
}

.section08 .faq {
    width: 1016px;
    text-align: left;
    margin: 0 auto;
    border-top: 1px solid #1d1d1f;
}

.toggle-header {
    cursor: pointer;
    padding: 0 24px;
    box-sizing: border-box;
    height: 88px;
    line-height: 88px;
    color: #1d1d1f;
    font-size: 18px;
    font-weight: 600;
    position: relative;
    border-bottom: 1px solid #dfdfdf;
}

.toggle-header span {
    font-size: 20px;
    color: #1d1d1f;
    font-family: 'NanumSquareNeoExtraBold', sans-serif;
    display: inline-block;
    margin-right: 16px;
}

.toggle-header span.arrow {
    content: "";
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%) rotate(0deg);
    width: 25px;
    height: 25px;
    background-image: url(../images/ic-chevron-down.png);
    background-size: contain;
    background-repeat: no-repeat;
    transition: transform 0.3s ease;
}

.toggle-content {
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    padding: 0 0;
    transition: max-height 0.4s ease, padding 0.4s ease, opacity 0.4s ease, visibility 0.4s ease;
    font-size: 18px;
    color: #6e6e73;
    border-bottom: 1px solid transparent;
}

.toggle-content p {
    height: auto;
    display: flex;
    box-sizing: border-box;
    background-color: #f7f8fc;
    padding: 24px;
    line-height: 28px;
    border-radius: 16px;
}

.toggle-content span {
    color: #2882ff;
    font-family: 'NanumSquareNeoExtraBold', sans-serif;
    display: inline-block;
    margin-right: 16px;
    font-size: 20px;
}

.toggle-wrap.active {
    transition: all 0.5s ease;
}

.toggle-wrap.active .toggle-header {
    border-color: transparent;
    transition: all 0.3s ease;
}

.toggle-wrap.active span.arrow {
    transform: translateY(-50%) rotate(180deg);
    transition: transform 0.3s ease;
}

.toggle-wrap .toggle-content {
    transition: all 0.3s ease;
}

.toggle-wrap.active .toggle-content {
    border-bottom: 1px solid #dfdfdf;
    opacity: 1;
    max-height: 300px;
    padding-bottom: 15px;
    transition: all 0.5s ease;
}

/* section09 */

.section09 {
    width: 100%;
    height: 371px;
    position: relative;
    background-image: url(../images/img_section09.webp);
    padding-top: 72px;
    box-sizing: border-box;
    text-align: center;
}

.section09 .txt {
    text-align: center;
    margin: 0 auto;
    width: 968px;
    height: 131px;
}

.section09 .s9_btn_01 {
    display: inline-block;
    width: 257px;
    height: 64px;
    margin-top: 48px;
    background-image: url(../images/btn_last.png);
}

.section09 .s9_btn_01:hover {
    background-image: url(../images/btn_last_hover.png);
}

@media screen and (max-width: 798px) {
    .only-pc {
        display: none !important;
    }

    .only-mo {
        display: block !important;
        margin: 0 auto;
        text-align: center; /* 부모 요소에 적용 */
    }

    .inner {
        padding: 0 20px;
    }

    /* header */
    .header {
        height: 70px;
        padding: 24px;
        -webkit-backdrop-filter: blur(30px);
        backdrop-filter: blur(30px);
        border-bottom: solid 1px rgba(255, 255, 255, 0.12);
        background-color: rgba(0, 0, 0, 0.05);
    }

    .logo-taxwatch {
        width: 85px;
        height: 12px;
        background-image: url(../images/logo-taxwatch.png);
    }

    .logo-douzone {
        width: 73px;
        height: 12px;
        background-image: url(../images/logo-douzone.png);
    }

    /* section01 */
    .section01 {
        height: 904px;
        padding-top: 110px;
        background-image: url("/html/event/250912/images/m_img_section01.webp");
    }

    .section01 .title {
        height: 635px;
        background-repeat: no-repeat;
        background-position: center;
        background-image: url("/html/event/250912/images/m_text_section01.png");
    }



    .section01 .s1_btn_01 {
        background: url(../images/apply_btn.png) no-repeat center/cover;
        width: 294px;
        height: 55px;
        bottom:72px;
    }
    .section01 .s1_btn_01:hover {
        background: url(../images/apply_btn_hover.png) no-repeat center/cover;
    }

    /*section02*/
    .section02 {
        background-image: url(../images/m_img_section02.jpg);
        height: 592px;
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
        padding-top: 61px;
        box-sizing: border-box;
    }

    .section02  div {
        width: 100%;
        height: 592px;
        background-image: none;

    }

    .section02 div.book {
        width: 148px;
        height: 175px;
        background-image: url(../images/m_img-book.png);
        background-repeat: no-repeat;
        background-position: center;
        margin-bottom: 15px;
    }
    .section02 div.text {
        width: 312px;
        height: 279px;
        background-image: url(../images/m_txt-book.png);
        background-repeat: no-repeat;
        background-position: center;
    }

    .section03 {
        height: 1136px;
        background-image: url(../images/m_img_section03.png);
        background-color: #f4f5f9;
        background-repeat: no-repeat;
        background-position: center;
    }

    /* section04 */
    .section04 {
        background-image: url("../images/m_img_section04.jpg");
        height: 2810px;
    }

    .section05 {
        height: 1165px;
        background-image: url("../images/m_img_section05.jpg");
    }
    /* section06 오시는 길*/
    .section06 .title{
        font-size: 30px;
    }
    .section06 .address {
        line-height: 1.4;
    }

    .section06 #map {
        width: 312px;
        height: 320px;
        border-radius: 24px;
    }


    .section07 {
        height: 693px;
    }

    .section07 .text {
        height: 357px;
        background: url(../images/m_img_section06.png) no-repeat center;
    }

    .section07 .btns a.s7_btn_01 {
        margin-right: 0;
        margin-bottom: 13px;
    }

    /* section08 */
    .section08 {
        /*height: auto;*/
        max-height: 1799px;

    }

    .section08 .faq {
        width: 340px;
    }

    .toggle-header {
        line-height: 1.4;
        padding: 30px 20px 24px;
        box-sizing: border-box;
    }

    .toggle-header p {
        display: flex;
    }

    .toggle-header,
    .toggle-content,
    .toggle-header span {
        font-size: 17px;
    }

    .toggle-header span.arrow {
        width: 20px;
        height: 20px;
    }

    .toggle-content p {
        height: auto;
        line-height: 1.4;
        box-sizing: border-box;
        background-color: #f7f8fc;
        padding: 24px;
        border-radius: 16px;
        display: flex;
    }

    .toggle-content span {
        color: #2882ff;
        font-family: 'NanumSquareNeoExtraBold', sans-serif;
        display: inline-block;
        margin-right: 16px;
        font-size: 17px;
    }

    .toggle-wrap.active {
        transition: all 0.5s ease;
    }

    .toggle-wrap.active .toggle-header {
        border-color: transparent;
        transition: all 0.3s ease;
    }

    .toggle-wrap.active span.arrow {
        transform: translateY(-50%) rotate(180deg);
        transition: transform 0.3s ease;
    }

    .toggle-wrap .toggle-content {
        transition: all 0.3s ease;
    }

    .toggle-wrap.active .toggle-content {
        border-bottom: 1px solid #dfdfdf;
        opacity: 1;
        max-height: 300px;
        padding-bottom: 15px;
        transition: all 0.5s ease;
    }

    /* section09 */
    .section09 {
        height: 441px;
        background-size: cover;
        background-repeat: no-repeat;
        background-image: url(../images/m_img_section09.webp);
    }

    .section09 .txt {
        width: 312px;
        height: 169px;
        background-image: url(../images/m_txt_section09.png);
    }

}