@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable.min.css");
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+KR:wght@200..900&display=swap');

/*공통*/
:root {
    --main_txt_color: #ddba94;
    --main_btn_col: #d2bba4;
    --main_btn_txt_col: #49392e;
    --txt_col: #3B312C;
    --header_h: 90px;

    --sub_con_19: 19px;
    --pagi_btn: 40px;

    --noto_serif: "Noto Serif KR", serif;
    --pretendard: "Pretendard Variable", Pretendard, sans-serif;
}


.main_container :where(section,
    div,
    p,
    h1,
    h2,
    h3,
    h4,
    span,
    li,
    a,
    button) {
    font-family: var(--pretendard);
    font-weight: 400;
    color: var(--txt_col);
}

.sub_container :where(section,
    div,
    p,
    h1,
    h2,
    h3,
    h4,
    span,
    li,
    a,
    button) {
    font-family: sans-serif;
    color: var(--txt_col);
}

.wrap_1400 {
    max-width: 1440px;
    padding-inline: 20px;
    width: 100%;
    margin-inline: auto;
}

.icon_wrap img {
    display: inline-block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.img_wrap img {
    display: inline-block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.M_only {
    display: none;
}

._flex {
    display: flex;
}

.sr_only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/*공통*/

/*헤더*/

header {
    position: fixed;
    top: 0;
    z-index: 999;
    width: 100%;
    height: var(--header_h);
}

.main_container header {
    /* border-bottom: 1px solid #E1E6DF; */
    /* border-bottom: 1px solid #e6e2df5c; */
}

.main_container.is_online header {
    border-bottom: 0;
}

.sub_container header,
.main_container.is_login header {
    background-color: #302a26d6;
}

/* header::before {
    content: "";
    display: inline-block;
    width: 100%;
    height: 1px;
    background-color: #E1E6DF;
    position: absolute;
    left: 0;
    top: var(--header_h);
} */

header .wrap_1400 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 100%;
}

header h1 {
    width: 250px;
    position: relative;
    z-index: 999;
}
header h1 a{
    display: inline-block;
    width: 100%;
    height: 100%;
}
header h1 img {
    display: inline-block;
    width: 100%;
    object-fit: contain;
}

header .nav_wrap {
    display: flex;
    flex-direction: row-reverse;
    gap: 25px;

    /* gap: 45px; */
    align-items: center;
    z-index: 9;
}

header .nav_wrap .utility_wrap {
    display: inline-flex;
    height: 100%;
    gap: 10px;
    align-items: center;
    z-index: 9;
}

header .nav_wrap .utility_wrap a {
    color: #c9c9c9;
    font-size: 15px;
    transition: 0.3s;
}

header .nav_wrap .utility_wrap a.active {
    color: #fff;
    transition: 0.3s;
}



header nav ul {
    display: flex;
    align-items: center;
    height: 100%;
    /* gap: 40px; */
}

header nav ul.depth_01 li {
    position: relative;
}

header nav ul.depth_01 a {
    color: #fff;
    font-size: 20px;
    transition: 0.3s;
    position: relative;
}

header nav ul.depth_01>li {
    padding: 32px;
}



header nav ul.depth_01>li.active>a {
    color: var(--main_txt_color);
    position: relative;
    transition: 0.3s;
}

header nav ul.depth_01>li>a::before {
    content: "";
    display: inline-block;
    width: 100%;
    height: 1px;
    position: absolute;
    bottom: -2px;
    left: 0;
    background-color: transparent;
    transition: 0.3s;
}



header nav ul.depth_01 .online_memorial a {
    color: var(--main_txt_color);
    transition: 0.3s;
}

header nav ul.depth_01 .online_memorial img {
    vertical-align: middle;
    margin-top: -4px;
    margin-right: 5px;
}

header nav ul.depth_01 .online_memorial a:hover {
    filter: brightness(1.2);
    transition: 0.3s;
}

header nav ul.depth_02 {
    position: absolute;
    left: 50%;
    top: 100%;
    transform: translate(-50%);
    flex-direction: column;
    white-space: nowrap;
    gap: 20px;
    transition: all .3s;
    width: 100%;
    height: 170px;
    background: transparent;
    padding-top: 32px;
    opacity: 0;
    visibility: hidden;
}



header nav ul:hover .depth_02 {
    opacity: 1;
    visibility: visible;
}

header nav ul.depth_02 a {
    color: #fff;
    font-size: 16px;
    font-weight: 500;
}

header nav ul.depth_01::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 258px;
    background: #3B312C;
    transition: all .3s;
    transform: translateY(-258px);
}



/*헤더*/

/*메인*/
.main_container {
    background-image: url(../images/user/main_bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    height: 100vh;
    position: relative;
    padding-top: var(--header_h);
    display: flex;
    flex-direction: column;
}

.main_container.is_login {
    min-height: 100vh;
    height: auto;
}

/* .main_container.is_online {
    background-image: url(../images/user/online_bg.gif);
    min-height: 100vh;
    height: auto;
} */

.main_container.is_online {
    background: unset;
    min-height: 100vh;
    height: auto;
}

.video_bg_wrap {
    display: inline-block;
    width: 100%;
    position: absolute;
    top: -43px;
    left: 0;
    height: calc(100% + 43px);
    overflow: hidden;
}

.video_bg {
    position: relative;
    left: 0%;
    width: 100%;
    object-fit: cover;
    height: 110%;
}

.video_bg source {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.main {
    flex: 1;

}


.main .wrap_1400 {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100%;
    padding-top: calc(var(--header_h) + 65px);
    padding-bottom: 100px;
    gap: 25px;
}

.main .wrap_1400>p {
    font-size: 20px;
    color: #fff;
    text-align: center;
    word-break: keep-all;
}

.main .wrap_1400 p.main_desc {
    font-size: 50px;
    font-family: var(--noto_serif);
    font-weight: 600;
    line-height: 1.3;
}

/*메인*/

/*푸터*/
.contact_wrap {
    background-color: #354055;
    padding: 20px;
    margin-bottom: 30px;
    width: calc(100% - 40px);
}

.contact_wrap .con_tit {
    color: #fff;
    font-weight: 600;
    font-size: 20px;
    text-align: center;
    margin-right: 10px;
    width: calc(30% - 70px);
}

.contact_wrap form>label {
    margin-right: 10px;
}

.contact_wrap label input[type=text] {
    height: 48px;
    background-color: #fff;
    border: none;
    padding: 10px 15px;
    font-size: 18px;
    color: var(--txt_col);
    width: 100%;
    max-width: 230px;
}

.contact_wrap label input[name=ct_ph] {
    max-width: 345px;
    min-width: 345px;
}

.contact_wrap label input::placeholder {
    color: #b5b5b5;
    font-size: 18px;
}

.contact_wrap form {
    display: flex;
    align-items: center;
}

.contact_wrap .ct_btn {
    background-color: var(--main_btn_col);
    color: var(--main_btn_txt_col);
    cursor: pointer;
    height: 48px;
    width: 180px;
    margin-right: 10px;
    font-size: 18px;
    font-weight: 600;

}

.contact_wrap .ct_chk {
    display: flex;
    align-items: center;
    width: 200px;
}

.contact_wrap .ct_chk input {
    accent-color: var(--main_btn_col);
    -ms-transform: scale(1.2);
    /* IE */

    -moz-transform: scale(1.2);
    /* FF */

    -webkit-transform: scale(1.2);
    /* Safari and Chrome */

    -o-transform: scale(1.2);
    /* Opera */
    margin-top: 4px;

}

.contact_wrap .ct_chk span {
    color: #fff;
    font-size: 15px;
    margin-left: 3px;
}

.main_container .ft_wrap {
    margin-bottom: 35px;
}

.main_container.is_online .contact_wrap {
    display: none;
}

.main_container.is_online .ft_wrap {
    margin-bottom: 0;
    background: #120b07;
    padding-block: 40px 30px;
}

.ft_wrap,
footer {
    width: 100%;

}

footer .wrap_1400 {
    display: flex;
    justify-content: space-between;
}

footer .left_part p {
    color: #c3c3c3;
    font-size: 15px;
    margin-bottom: 7px;
    font-weight: 400;
}

footer .left_part p.main_col span {
    color: var(--main_txt_color);
    font-weight: 600;
}

footer .left_part p.main_col {
    color: var(--main_txt_color);
    font-size: 18px;
    margin-bottom: 10px;
}

footer .right_part {
    margin-top: 20px;
}

footer .select_wrap {
    position: relative;
    width: 170px;
}

footer .selected {
    color: #c9c9c9;
    font-size: 18px;
    border: 1px solid #c9c9c9;
    padding-inline: 15px 45px;
    height: 35px;
    background-image: url(../images/user/select_icon.png);
    background-size: 7%;
    background-repeat: no-repeat;
    background-position: calc(100% - 10px);
    width: 100%;
    cursor: pointer;
}

footer .select_wrap ul {
    position: absolute;
    top: -35px;
    width: 100%;
    opacity: 0;
    transition: 0.3s ease-in-out;
    clip-path: inset(100% 0 0 0);
}

footer .select_wrap.active ul {
    opacity: 1;
    clip-path: inset(0 0 0 0);
    transition: 0.3s ease-in-out;
}

footer .select_wrap ul li button {
    display: inline-flex;
    width: 100%;
    height: 35px;
    align-items: center;
    padding-inline: 12px;
    background-color: #e4e4e4d3;
    font-size: 15px;
    font-weight: 500;
    cursor: pointer;
    transition: 0.2s;

}

footer .select_wrap ul li button:where(:hover, .active) {
    background-color: #c9c9c9e5;
    transition: 0.2s;
}

.main_container footer .select_wrap ul li button:where(:hover, .active) {
    background-color: #e9e9e9;
    transition: 0.2s;
}

.sub_container .contact_wrap {
    max-width: unset;
    width: 100%;
}

.sub_container .contact_wrap form {
    max-width: 1440px;
    margin-inline: auto;
}

.sub_container footer {
    margin-bottom: 40px;
}

.sub_container .contact_wrap {
    margin-bottom: 40px;
}

.sub_container footer .left_part p.main_col {
    color: #C49E79;
}

.sub_container footer .left_part p.main_col span {
    color: #C49E79;
    font-weight: 600;
}

.sub_container footer .left_part p {
    color: #686868;
    font-weight: 500;
}

/*푸터*/

/* *** 서브메뉴 메인화면 공통 **** */
.sub_tab_sel {
    display: none;
}

section.sub .sub_main {
    height: 536px;
    /* margin-bottom: -65px; */
    overflow: hidden;
}

section.sub .sub_main_inner {
    overflow: hidden;
    height: 100%;
    position: relative;
    border-bottom: 1px solid #fff;
}

section.sub .main_bg {
    width: 100%;
    height: 100%;
    background-image: url(../images/user/sub_main.png);
    background-repeat: no-repeat;
    background-size: cover;
    position: absolute;
    animation: visual_scale 5s forwards;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(1.2);
    border-bottom: 1px solid #fff;
}

@keyframes visual_scale {
    100% {
        transform: translate(-50%, -50%) scale(1.1);
    }
}

section.sub .main_txt {
    color: #fff;
    text-align: center;
    padding: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
}

section.sub .main_txt h2 {
    font-size: 50px;
    font-family: var(--noto_serif);
    margin-bottom: 37px;
}

section.sub .main_txt p {
    font-size: 24px;
    line-height: 140%;
    word-break: keep-all;
}

section.sub .main_txt p .br {
    display: contents;
}

section.sub .main_txt h2,
section.sub .main_txt p {
    color: #fff;
    z-index: 1;
    position: relative;
}

section.sub .sub_sec {
    z-index: 1;
    position: relative;
    top: -66px;
}

section.sub .sec_con {
    background: #fff;
    padding-bottom: 82px;
}

section.sub .sec_inner {
    max-width: 1120px;
    margin: 0 auto;
    padding-top: 109px;
}

section.sub .sub_tab {
    max-width: 1120px;
    margin: 0 auto;
}

section.sub .sub_tab ul {
    display: flex;
    height: 65px;
}

section.sub .sub_tab ul li {
    flex: 1;
    border: 1px solid #D5BA9D;
    border-bottom: 0;
    text-align: center;
    background: #281A11;
}

section.sub .sub_tab ul li a {
    color: #D5BA9D;
    font-weight: 400;
    font-size: 24px;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

section.sub .sub_tab ul li.active a {
    color: #3B312C;
    font-weight: 600;
}

section.sub .sub_tab ul li.active {
    background: #fff;
    border: 1px solid #fff;
}

/* *** 서브메뉴 메인화면 공통 **** */

/*페이지네이션*/
.pagination {
    display: flex;
    margin-top: 40px;
    justify-content: center;
}

.pagination ul {
    display: flex;
    justify-content: center;

}

.pagination a:not(.arrow) {
    font-size: var(--sub_con_19);
    width: var(--pagi_btn);
    height: var(--pagi_btn);
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

.pagination span.on {
    font-size: var(--sub_con_19);
    color: #fff;
    background-color: var(--txt_col);
    width: var(--pagi_btn);
    height: var(--pagi_btn);
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

.pagination a.arrow {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: var(--pagi_btn);
    height: var(--pagi_btn);
    background-image: url(../images/user/pagi.png);
    background-repeat: no-repeat;
    background-position: center;
    border: 1px solid #E6E6E6;
}

.pagination a.arrow.first {
    background-image: url(../images/user/pagi_d.png);
}

.pagination .first+.prev {
    border-left: 0;

}

.pagination a.arrow.next {
    transform: rotate(180deg);
}

.pagination a.arrow.last {
    background-image: url(../images/user/pagi_d.png);
    transform: rotate(180deg);
    border-right: 0;
}

.pagination a.arrow img {
    display: none;
}

/*페이지네이션*/
.help_btn_wrap span{
    font-weight: bold;
    font-size: 20px;
}
@media(max-width: 1400px) {

    /*공통 1400px*/
    section.sub .sub_main_inner {
        padding-top: 0;
    }

    section.sub .sec_inner {
        max-width: 926px;
    }

    section.sub .main_txt h2 {
        font-size: 48px;
        font-family: var(--noto_serif);
        margin-bottom: 33px;
    }

    section.sub .sub_tab ul li a {
        font-size: 20px;
    }

    section.sub .sub_tab {
        max-width: 926px;
    }

    section.sub .main_txt p {
        font-size: 22px;
    }

    /*공통 1400px*/

    /*헤더 1400px*/
    header h1 {
        width: 190px;
    }

    header .nav_wrap {
        gap: 30px;
    }

    header nav ul.depth_01>li>a {
        font-size: 18px;
    }

    header nav ul.depth_02 a {
        font-size: 15px;
    }

    header nav ul.depth_02 {
        gap: 18px;
        height: 145px;
        padding-top: 21px;
    }

    header nav ul.depth_01::before {
        height: 236px;
    }

    header nav ul.depth_01>li {
        padding: 35px 32px;
    }

    /*헤더 1400px*/

    /*메인 1400px*/
    /*메인 1400px*/

    /*푸터 1400px*/

    .contact_wrap label input[type=text] {
        height: 48px;
        background-color: #fff;
        border: none;
        padding: 10px 15px;
        font-size: 18px;
        color: var(--txt_col);
        width: 100%;
        max-width: 200px;
    }

    .contact_wrap label input[name=ct_ph] {
        max-width: 345px;
        min-width: 290px;
    }

    .contact_wrap label input::placeholder {
        color: #b5b5b5;
        font-size: 18px;
    }

    .contact_wrap form {
        display: flex;
        align-items: center;
    }

    /*푸터 1400px*/

}

@media(max-width: 1200px) {

    /*공통 1200px*/
    /*공통 1200px*/

    /*헤더 1200px*/
    header nav ul.depth_01>li {
        padding: 35px 15px;
    }

    header nav ul.depth_01>li>a {
        font-size: 16px;
    }

    header .nav_wrap {
        gap: 20px;
    }

    /*헤더 1200px*/

    /*메인 1200px*/
    .main .wrap_1400 {
        gap: 15px;
    }

    .main .wrap_1400 p.main_desc {
        font-size: 40px;
    }

    .main .wrap_1400>p {
        font-size: 18px;
        line-height: 1.3;
    }

    /*메인 1200px*/

    /*푸터 1200px*/
    .contact_wrap .con_tit {
        font-size: 18px;
        width: 250px;
    }

    .contact_wrap label input[type=text] {
        height: 42px;
        padding: 10px 15px;
        font-size: 16px;
    }

    .contact_wrap label input[name=ct_ph] {
        min-width: 260px;
    }

    .contact_wrap label input::placeholder {
        font-size: 16px;
    }

    .contact_wrap .ct_btn {
        height: 42px;
        width: 150px;
        font-size: 16px;

    }

    .contact_wrap .ct_chk {
        width: 166px;
    }

    /*푸터 1200px*/

}

@media(min-width: 1025px) {

    /* 호버, 액티브 */
    header nav ul.depth_01>li:not(.online_memorial):where(:hover, .active)>a::before {
        background-color: var(--main_txt_color);
        transition: 0.3s;
    }

    header .nav_wrap .utility_wrap a:hover {
        color: #fff;
        transition: 0.3s;
    }

    header nav ul.depth_01>li:hover>a {
        color: var(--main_txt_color);
        position: relative;
        transition: 0.3s;
    }

    header nav ul.depth_02:hover {
        background: #D5BA9D;
    }

    header nav ul.depth_02:hover a {
        color: #3B312C;
    }

    header nav ul.depth_02 a:hover {
        font-weight: 700;
    }

    header nav ul.depth_01:hover::before {
        transform: translateY(0);
    }
}

@media(max-width: 1024px) {
    :root {
        --sub_con_19: 17px;
        --pagi_btn: 34px;
    }

    .video_bg_wrap {
        display: none;
    }

    /*공통 1024px*/
    :root {
        --header_h: 70px;
    }

    .M_only {
        display: revert;
    }

    /*공통 1024px*/

    /* 서브 공통 */
    section.sub.info .sec_inner {
        padding: 50px 28px 0;
    }

    section.sub .sub_tab ul li a {
        font-size: 19px;
    }

    section.sub .main_txt p {
        font-size: 21px;
    }

    section.sub .main_txt h2 {
        font-size: 45px;
        margin-bottom: 26px;
    }

    /*헤더 1024px*/

    header::before {
        background-color: var(--main_btn_col);
    }

    header .nav_wrap {
        position: fixed;
        top: 0;
        left: 0;
        z-index: 100;
        width: 100%;
        height: 100%;
        transition: transform 1s;
        transform: translateX(100%);
        flex-direction: column;
        background-color: #000000d6;
        padding-top: var(--header_h);
        gap: 20px;
        align-items: flex-start;
    }

    header .nav_wrap.active {
        display: flex;
        transition: transform 1s;
        transform: translateX(0);
    }

    header nav ul.depth_02 {
        max-height: 0;
        overflow: hidden;
        transform: none;
        transition: max-height .3s ease, transform .3s ease;
        visibility: visible;
        opacity: 1;

        /* 기존 속성 유지 */
        position: static;
        flex-direction: column;
        white-space: nowrap;
        gap: 2px;
        width: 100%;
        background: none;
        padding-top: 0;
        height: auto;
    }

    header nav ul.depth_02 li:nth-of-type(1) {
        margin-top: 10px;
    }

    header nav .depth_01 li.active ul.depth_02 {
        max-height: 400px;
        transform: none;
    }

    header nav ul.depth_02.open {
        max-height: 400px;
        transform: none;
    }


    header nav .depth_01 li.active ul.depth_02 li.active a {
        color: var(--main_txt_color);
        text-decoration: underline;
    }

    header nav ul.depth_02 a {
        position: relative;
        margin-left: 20px;
        padding: 0;
    }

    header nav ul.depth_02 a::before {
        content: "";
        position: absolute;
        width: 0;
        height: 1px;
        background: var(--main_txt_color);
        left: 50%;
        transform: translate(-50%, 0);
        bottom: -2px;
    }

    header nav ul.depth_02 a.active::before {
        width: 100%;
    }

    header nav ul:hover .depth_02 {
        transform: none;
    }

    header nav ul.depth_01:hover::before {
        display: none;
    }
    .menu_btn {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        right: 14px;
        padding: 15px;
        cursor: pointer;
        z-index: 101;
        -webkit-transition: 0.3s;
        transition: 0.3s;
        border: none;
        background-color: transparent;
        z-index: 101;
    }

    .menu_button .bar:nth-of-type(1) {
        margin-top: 0px;
    }

    .menu_button .bar:nth-of-type(3) {
        margin-bottom: 0px;
    }

    .bar {
        position: relative;
        display: block;

        width: 20px;
        height: 2px;

        margin: 6px auto;
        background-color: #fff;

        -webkit-transition: 0.3s;
        transition: 0.3s;
    }

    .cross .bar {
        background-color: #ccc;
    }

    .cross .bar:nth-of-type(1) {
        -webkit-transform: translateY(9px) rotate(-45deg);
        -ms-transform: translateY(9px) rotate(-45deg);
        transform: translateY(9px) rotate(-45deg);
    }

    .cross .bar:nth-of-type(2) {
        opacity: 0;
    }

    .cross .bar:nth-of-type(3) {
        -webkit-transform: translateY(-7px) rotate(45deg);
        -ms-transform: translateY(-7px) rotate(45deg);
        transform: translateY(-7px) rotate(45deg);
    }

    header nav ul li a {
        padding-inline: 20px;

    }

    header .nav_wrap nav {
        width: 100%;
    }

    header nav ul {
        gap: unset;
    }

    header nav ul li {
        width: 100%;
        padding-block: 5px;
    }

    header nav ul.depth_01 {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        border-top: 1px solid #d2bba470;
    }

    header nav ul.depth_01>li {
        display: flex;
        flex-direction: column;
        border-bottom: 1px solid #d2bba470;
        padding-block: 20px 15px;
    }

    header nav ul.depth_01 a {
        color: #fff;
        font-size: 18px;
    }


    header nav ul.depth_02 a {
        color: #fff;
        font-size: 16px;
    }

    header .nav_wrap .utility_wrap {
        margin-top: 20px;
        padding-inline: 20px;
        height: unset;
    }

    /*헤더 1024px*/

    /*메인 1024px*/
    .main_container.is_online {
        background-image: url(../images/user/online_bg.jpg);
        min-height: 100vh;
        height: auto;
        background-size: cover;
        background-position: center;
    }

    /*메인 1024px*/

    /*푸터 1024px*/
    .contact_wrap form {
        flex-wrap: wrap;
        position: relative;
    }

    .contact_wrap .con_tit {
        font-size: 18px;
        width: 100%;
        text-align: left;
        margin-bottom: 15px;
    }

    .contact_wrap form>label {
        margin-right: 10px;
        flex: 1;
    }

    .contact_wrap label input[type=text] {
        width: 100%;
        max-width: unset;
    }

    .contact_wrap form>label.ct_ph {
        flex: 2;
    }

    .contact_wrap label input[name=ct_ph] {
        max-width: unset;
    }

    .contact_wrap ._flex {
        flex: 1;
    }

    .contact_wrap .ct_btn {
        margin-right: 0;
        width: 100%;
    }

    .contact_wrap .ct_chk {
        position: absolute;
        top: 0;
        right: 0;
    }



    footer .right_part {
        margin-top: 0;

    }

    footer .selected {
        font-size: 15px;
        padding-inline: 10px 25px;
        height: 30px;
        background-size: 12px;
        text-align: left;
    }

    footer .select_wrap ul {
        position: absolute;
        top: -30px;
    }

    footer .select_wrap ul li button {
        height: 30px;
        padding-inline: 10px;
        font-size: 14px;
    }

    /*푸터 1024px*/

}

@media(max-width: 768px) {
    :root {
        --sub_con_19: 16px;
    }

    /*공통 768px*/
    section.sub .sub_tab ul li a {
        font-size: 18px;
    }

    section.sub .main_txt h2 {
        font-size: 39px;
        margin-bottom: 20px;
    }

    section.sub .main_txt p {
        font-size: 19px;
    }



    /*공통 768px*/

    /*헤더 768px*/
    /*헤더 768px*/

    /*메인 768px*/
    .main_container {
        height: unset;
    }

    .main .wrap_1400 {
        padding-top: calc(var(--header_h) + 0px);
        height: 70vh;
    }

    .main .wrap_1400 p.main_desc {
        font-size: 32px;
    }

    section.sub .main_txt p .br {
        display: block;
        font-size: 15px;
    }


    /*메인 768px*/

    /*푸터 768px*/
    .contact_wrap form>label {
        margin-right: 0;
        flex: 1;
    }

    .contact_wrap .con_tit {
        margin-bottom: 10px;
    }

    .contact_wrap form>label+label {
        margin-left: 10px;
    }

    .contact_wrap ._flex {
        flex-direction: column-reverse;
        margin-top: 10px;
        flex: 100%;
    }

    .contact_wrap .ct_btn {
        width: 100%;
        margin-top: 7px;
    }

    .contact_wrap .ct_chk {
        position: unset;
    }

    .main_container .ft_wrap {
        margin-bottom: 20px;
    }

    footer .left_part p.main_col {
        font-size: 16px;
        margin-bottom: 7px;
    }

    footer .left_part p {
        margin-bottom: 5px;
    }

    footer .wrap_1400 {
        flex-direction: column-reverse;
    }

    footer .right_part {
        margin-bottom: 20px;
    }

    /*푸터 768px*/
    .mark img{
        width: 240px;
    }
}

@media(max-width: 640px) {
    :root {
        --sub_con_19: 16px;
    }

    /*공통 640px*/
    /*공통 640px*/

    /*헤더 640px*/
    /*헤더 640px*/

    /*메인 640px*/
    /*메인 640px*/

    /*푸터 640px*/
    .contact_wrap .con_tit {
        font-size: 17px;
    }

    .contact_wrap form>label {
        flex: 100%;
    }

    .contact_wrap form>label.ct_ph {
        flex: 100%;
        margin-top: 10px;
        margin-left: 0;
    }

    .contact_wrap label input[type=text] {
        height: 35px;
    }

    .contact_wrap .ct_btn {
        width: 100%;
        height: 35px;
        margin-top: 7px;
    }


}

/*푸터 640px*/
@media(max-width: 500px) {

    /*공통 500px*/
    section.sub .sub_sec {
        top: -65px;
    }

    section.sub .sub_main {
        height: unset;

    }

    section.sub .sub_main_inner {
        height: unset;
        padding-block: calc(var(--header_h) + 60px);
    }

    .sub_tab_sel {
        display: block;
        background: #fff;
        border: 1px solid #fff;
        width: 100%;
        height: 65px;
        text-align: left;
        color: #3B312C;
        font-weight: 600;
        padding: 0 18px;
        font-size: 16px;
        border-bottom: 1px solid #e6e6e6;
        position: relative;
    }

    section.sub .main_txt h2 {
        font-size: 24px;
        margin-bottom: 19px;
    }

    section.sub .main_txt p {
        font-size: 15px;
    }

    .sub_tab_sel span {
        display: inline-block;
        width: 14px;
        position: absolute;
        right: 18px;
        transform: rotate(0);
        transition: 0.3s;
        height: 20px;
    }

    .sub_tab_sel span img {
        display: inline-block;
        width: 100%;
        height: 100%;
        object-fit: contain;
    }

    .sub_tab_sel.on span {
        transform: rotate(180deg);
        transition: 0.3s;
    }

    section.sub .sub_tab ul {
        width: 100%;
        position: absolute;
        display: none;
        flex-direction: column;
        z-index: 1;
    }

    section.sub .sub_tab ul li button {
        display: block;
    }

    section.sub .sub_tab ul li a {
        justify-content: space-between;
        padding: 0 18px;
        font-size: 16px;
    }

    section.sub .sub_tab ul li.active {
        /* display: none; */

        visibility: hidden;
        height: 0;
        font-size: 0px;
        border: 0;
    }

    section.sub .sub_tab ul li {
        width: 100%;
        height: 100%;
        border: 0;
        border-bottom: 1px solid #e6e6e6;
    }

    section.sub.info .sec_inner {
        padding: 30px 18px 0;
    }

    /*공통 500px*/

    .main .wrap_1400 .help_btn_wrap{
        flex-direction: column;
        gap: 15px;
    }
}