.cf::before,
.cf::after {
    display: block;
    content: "";
    clear: both;
}

.en {
    letter-spacing: 0;
}

.dn {
    display: none;
}

.dis_no {
    display: none !important;
}

.hidden {
    opacity: 0;
    visibility: hidden;
}

.hidden.not {
    opacity: 1;
    visibility: visible;
    transition: opacity 0.3s ease;
}

.input_hidden {
    width: 0;
    height: 0;
    opacity: 0;
}
.clearfix:before,
.clearfix:after {
    content: "";
    display: block;
    clear: both;
}

.f_c {
    display: flex;
    align-items: center;
    justify-content: center;
}

.f_cs {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.f_b {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.f_ba {
    display: flex;
    align-items: center;
}


.f_e {
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
}

.f_fs {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
}

.f_wrap {
    flex-wrap: wrap;
}

.f_row_reverse {
    flex-direction: row-reverse;
}

.f_a_s {
    align-items: flex-start !important;
}

.f_a_c {
    align-items: center !important;
}

.f_a_e {
    align-items: flex-end !important;
}

.f_d_c {
    flex-direction: column;
}

.grid_box {
    display: grid; 
    grid-template-columns: 1fr; 
    gap: 2rem;
}

.tablet_l {
    display: none;
}

.mo,
.tablet_1280,
.mo_1024 {
    display: none;
}

.ani_load {
    transition: transform 1s ease, opacity 1s ease, filter 1s ease;
    opacity: 0;
}
.img_box img.ani_load {
    opacity: 1;
    transform: scale(1.2);
}
.btt {
    transform: translate(0, 5rem);
}
.ltr {
    transform: translate(-5rem, 0);
}
.rtl {
    transform: translate(5rem, 0);
}
.ttb {
    transform: translate(0, -5rem);
}
.ani_load.ani_view {
    transform: translate(0, 0);
    opacity: 1;
}

/* scroll */
body.no-scroll {
    overflow: hidden;
}
.scroll::-webkit-scrollbar {
    width: 1.8rem;
    position: relative;
    margin-right: 1.6rem;
}

.scroll::-webkit-scrollbar-thumb {
    height: 45%;
    border-radius: 2rem;
    border: 0.7rem solid transparent;
    background-color: #e4e4e4;
    background-clip: content-box;
}

.scroll::-webkit-scrollbar-track {
    width: 1rem;
    background-color: transparent;
    position: absolute;
    top: -50rem;
    right: -3rem;
}

/* 텍스트 말줄임 */
.txt_box_line {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    white-space: normal;
}

.txt_box_line2 {
    -webkit-line-clamp: 2;
}

/* section contents */
.sec_title_box {
    padding-bottom: 5rem;
    text-align: center;
}

.sec_title {
    padding: 1rem 0 3rem;
    line-height: 1;
}

.sec_desc {
    color: #222;
    padding-top: 1rem;
}

/* font size */
.head_line1 {
    font-size: clamp(4rem,2.8125vw,5.4rem);
    font-weight: bold;
}

.head_line1 .en {
    font-size: clamp(4.4rem, 2.7083vw, 5.2rem);
}

.head_line2 {
    font-size: 4.6rem;
    font-weight: bold;
}

.head_line2 .en {
    font-size: 5rem;
}

.head_line3 {
    font-size: 3.6rem;
}

.head_line3 .en {
    font-size: 4rem;
}

.head_line4 {
    font-size: 3.4rem;
    font-weight: bold;
}

.head_line4 .en {
    font-size: 3.8rem;
}

.head_line5 {
    font-size: clamp(2.6rem, 2.3438vw, 3rem);
    font-weight: bold;
}

.title1 {
    font-size: 2.6rem;
    font-weight: bold;
}

.title2 {
    font-size: 2.2rem;
    line-height: 1.82;
}

.sub_title1 {
    font-size: 2.2rem;
}

.sub_title2 {
    font-size: clamp(1.8rem, 1.5625vw, 2rem);
}

.sub_title3 {
    font-size: 1.8rem;
}
.sub_txt {
    font-size: clamp(2rem, 2.1094vw, 2.7rem);
}

.tit_box {
    text-align: center;
}
.tit_box h2 + p {
    margin-top: clamp(3rem, 4.6875vw, 6rem);
}

/* svg */
.icon svg {
    width: clamp(3.8rem, 3.75vw, 4.8rem);
}

/* color */
.main_color {
    color: var(--mainColor) !important;
}
.grad_txt {
    background: linear-gradient(90deg, var(--mainColor), var(--black));
    -webkit-text-fill-color: transparent;
    background-clip: text;
}
.count_num,
.count_num + strong {
    font-weight: 900;
    font-size: clamp(3rem,3.125vw,4rem);
    line-height: 1.1;
    color: var(--mainColor);
}

/* 말머리 dots */
.dot_wr {
    margin-top: 2rem;
}
.dots {
    position: relative;
    padding-left: 2rem;
}
.dots::before {
    content: '';
    display: inline-block;
    width: .8rem;
    height: .8rem;
    background-color: var(--white);
    border-radius: 50%;
    position: absolute;
    top: 1.2rem;
    left: 0;
}
.dots.black {
    text-align: left;
}
.dots.black::before{
    background-color: var(--black);
    width: 0.6rem;
    height: 0.6rem;
    top: 1.2rem;
}
.dots.chk::before{
    content: '✔';
    background: transparent;
    top: 0;
}

/* header */
.header {
    position: absolute;
    top: 0;
    width: 100%;
    height: 10rem;
    padding-left: clamp(15rem, 16.4063vw, 21rem);
    padding-right: clamp(15rem, 16.4063vw, 21rem);
    transition: background-color .2s linear, box-shadow .2s linear;
    z-index: 999;
}
.header.fixed {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 999;
    background-color: #111;
    box-shadow: 0 0.1rem 1rem 0 #00000040;
}
.header .nav_wr {
    height: 100%;
}
.header .nav_wr .logo {
    width: clamp(10rem, 11.7188vw, 15rem);
}
.header .top_nav {
    display: flex;
}
.header .top_nav .cont {
    cursor: pointer;
    position: relative;
    padding: 4rem;
}
.header .top_nav .cont > a {
    color: #fff;
    transition: all .3s ease;
    font-weight: 500;
}
.header .top_nav .cont:hover > a {
    opacity: .75;
}
.header .top_nav .cont ul {
    position: absolute;
    top: 7.5rem;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    max-height: 0;
    opacity: 1;
    overflow: hidden;
    transition: max-height .3s ease;
    padding: 0;
    margin: 0;
    background: rgba(0, 0, 0, 0.6);
    border-radius: 1rem;
    z-index: 999;
}
.header .top_nav .cont ul li {
    width: 100%;
    text-align: center;
    margin: 0 auto;
}
.header .top_nav .cont ul li + li {
    margin-top: 1rem;
}
.header .top_nav .cont ul li:first-child {
    padding-top: 1rem;
}
.header .top_nav .cont ul li:last-child {
    padding-bottom: 1rem;
}
.header .top_nav .cont ul li a {
    color: var(--white);
    font-weight: 500;
}
.header .top_nav .cont ul li a:hover {
    opacity: .75;
}
.header .top_nav .cont:hover > ul {
    max-height: 50rem;
}
.header.white_on,
.sub_pg .header.fixed {
    background-color: var(--white);
}
.header:not(.white_on) .bk_logo,
.header.white_on .wt_logo,
.sub_pg .header.fixed .wt_logo {
    display: none;
}
.sub_pg .header.fixed .bk_logo {
    display: block;
}
.header.white_on .top_nav .cont > a,
.sub_pg .header.fixed .top_nav .cont > a {
    color: var(--black);
}
.header.white_on .top_nav .cont ul,
.sub_pg .header.fixed .top_nav .cont ul {
    background: rgba(255,255,255,0.9);
    box-shadow: 5px 5px 10px -5px rgb(0, 0, 0, 0.1);
}
.header.white_on .top_nav .cont ul li a,
.sub_pg .header.fixed .top_nav .cont ul li a {
    color: var(--black);
}

/* 스크롤 탑 버튼 */
.scr_top {
    position: fixed;
    left: 50%;
    bottom: 5%;
    transform: translateX(-50%);
    z-index: 99;
    transition: all 0.3s ease;
}
.scr_top .txt {
    font-size: clamp(1.8rem, 1.5625vw, 2rem);
    font-weight: bold;
    color: var(--white);
    transition: opacity 0.3s ease;
}
.scr_top button {
    width: clamp(8rem, 5.2083vw, 10rem);
    height: clamp(8rem, 5.2083vw, 10rem);
    border-radius: 50%;
    background: var(--mainColor);
    border: none;
    color: var(--white);
    font-weight: bold;
    font-size: clamp(1.6rem, 2.3438vw, 1.8rem);
    display: none;
    transition: transform 0.3s ease;
}
.scr_top.show {
    cursor: pointer;
    left: 95%;
    bottom: 7%;
}
.scr_top.show button {
    display: flex;
}

.scr_top.show .txt {
    display: none;
}

.scr_top button:hover {
    background: #a3141e;
    transform: scale(1.1);
}

.scr_top .scroll_hint{
    text-align: center;
    margin-bottom:.8rem;
}

.scr_top .mouse{
    width: 2.3rem; height: 3.4rem;
    border: .2rem solid var(--white);
    border-radius: 1.2rem;
    position: relative;
    display: inline-flex;
    align-items: flex-start;
    justify-content: center;
    box-shadow: 0 0 .4rem rgba(0,0,0,.15) inset;
    font-size: 0;
}

.scr_top .mouse .wheel{
    width:.3rem; height:.7rem; 
    background: #fff; 
    border-radius:.2rem;
    margin-top:.5rem;
    animation: wheel-down 1.8s ease-in-out infinite;
}

@keyframes wheel-down{
    0%   { transform: translateY(0); opacity:1;}
    60%  { transform: translateY(1.2rem); opacity:0; }
    100% { transform: translateY(1.2rem); opacity:0; }
}

.scr_top.show .scroll_hint,
.scr_top.show .txt{
    display:none;
}

.sub_pg .scr_top {
    left: 95%;
}
.sub_pg .scr_top .txt,
.sub_pg .scr_top .scroll_hint {
    display: none;
}

@media screen and (max-width: 768px) {
    .sub_pg .scr_top,
    .scr_top.show {
        left: 90%;
    }
}
@media screen and (max-width: 500px) {
    .sub_pg .scr_top,
    .scr_top.show {
        left: 86%;
    }
}

/*  카드 type01 - 호버형 */
.card_wr .card_box {
    gap: 3rem;
    margin-top: clamp(5rem, 7.8125vw, 10rem);
}
.card_wr .card_box .card_cont {
    text-align: center;
    padding: 2rem;
    border: 1px solid #ddd;
    border-radius: 1rem;
    width: 100%;
    height: 30rem;
    position: relative;
    overflow: hidden;
    transition: transform .35s ease, opacity .35s ease, filter .35s ease;
    will-change: transform;
    transform-origin: center;
}
.card_wr .card_box .card_cont .txt_box {
    height: 100%;
    gap: 3rem;
}
.card_wr .card_box .card_cont .bg {
    position: absolute;
    inset: 0;
    z-index: -1;
}
.card_wr .card_box .card_cont .bg::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;
    background-color: rgba(0, 0, 0, .7);
    transition: opacity .3s ease;
}
.card_wr .card_box .card_cont .sub_txt {
    opacity: 0;
    max-height: 0;
    overflow: hidden;
    transition: opacity .3s ease, max-height .3s ease;
}
.card_wr .card_box .card_cont:hover {
    transform: scale(1.06);
}
.card_wr .card_box .card_cont:hover .sub_txt {
    opacity: 1;
    max-height: 60rem;
}
.card_wr .card_box .card_cont:hover .bg::after {
    opacity: .8;
}

/* 카드 type02 - 목록형 */
.card_wr.type02 {
    width: 100%;
    height:112rem;
}
.card_wr.type02 .card_box li {
    overflow:hidden;
    position:sticky;
    top:13rem;
    display:flex;
    flex-wrap:wrap;
    align-content:space-between;
    width:100%;
    height:30rem;
    padding:5rem;
    border-radius:2rem;
    color:#fff;
    background: #4c4c4c center / cover no-repeat;
}
.card_wr.type02 .card_box li::before {
    content: '';
    display: inline-block;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .5);
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
}
.card_wr.type02 .card_box li.type02::before {
    display: none;
}
.card_wr.type02 .card_box li:nth-child(2) {
    transform:translateY(11rem);
}
.card_wr.type02 .card_box li:nth-child(3) {
    transform:translateY(22rem);
}
.card_wr.type02 .card_box .r_txt {
    position:absolute;
    top:3rem;
    right:4rem;
    font-size:1.3rem;
    font-weight: bold;
    text-align:right;
    text-transform:uppercase;
}
.card_wr.type02 .card_box li > div {
    width:100%
}
.card_wr.type02 .card_box div p:not(.sub_txt) {
    margin-bottom:3.5rem;
    color: var(--white);
}
.card_wr.type02 .card_box .txt_wr .sub_txt {
    font-size: clamp(1.8rem, 1.5625vw, 2rem);
    color: var(--white);
}
.card_wr.type02 .card_box .txt_wr .sub_txt + .sub_txt {
    margin-top: .5rem;
}

/* 카드 type03 - 텍스트 박스형 */
.card_wr.type03 {
    display: grid; 
    gap: 2rem;
    grid-template-columns: repeat(auto-fit, minmax(22rem, 1fr));
    margin: 0 auto;
    margin-top: clamp(5rem, 7.8125vw, 10rem);
}
.card_wr.type03 .card_cont {
    background-color: #fff;
    padding: 2rem 2rem 3rem;
    border-radius: 1.6rem;
    box-shadow: 0 1rem 2.5rem -.5rem rgba(0,0,0,0.08);
    border: 1px solid #e2e8f0;
    text-align: center;
}
.card_wr.type03 .card_cont .tit {
    font-size: clamp(2rem, 2.3438vw, 3rem);
    font-weight: 700;
}
.card_wr.type03 .card_cont .txt {
    font-size: clamp(1.8rem, 1.5625vw, 2rem);
    color: var(--black);
    margin-top: 1rem;
}
.card_wr.type03 .card_cont .txt + div {
    margin-top: 4rem;
}

/* step cont */
.step_wr {
    flex-direction: column; 
    gap: 2.5rem; 
    position: relative;
    max-width: 120rem; 
    margin: 0 auto;
    margin-top: clamp(5rem, 7.8125vw, 10rem);
}
.step_cont {
    flex: 1; 
    width: 100%; 
    text-align: center; 
    border: 2px dashed #d9e2ec;
    padding: 3rem; 
    border-radius: 1.2rem; 
    background-color: #f8f9fa; 
    position: relative;
}
.step_num {
    position: absolute; 
    top: -1em; left: 50%; 
    transform: translateX(-50%);
    background-color: var(--white); 
    padding: 0 0.5em; 
    font-size: clamp(1.8rem, 1.5625vw, 2rem);
    font-weight: bold; 
    color: #829ab1;
}
.step_cont h3 {
    font-size: clamp(1.8rem, 1.5625vw, 2rem);
    color: #102A43; 
    font-weight: bold;
    margin-top: 0.5rem;
}
.step_cont p { 
    font-size: clamp(1.8rem, 1.5625vw, 2rem);
    color: #486581; 
}
.step_cont h3 + p {
    margin-top: 1rem;
}
.step_cont.highlight {
    background-color: var(--mainColor); 
    color: var(--white); 
    border:2px solid var(--mainColor);
    box-shadow: 0 10px 25px -5px rgba(255,107,107,0.3);
}
.step_cont.highlight .step_num { 
    background-color: var(--white); 
    color: var(--mainColor); 
}
.step_cont.highlight h3, 
.step_cont.highlight p {
    color: var(--white);
}

@media (min-width: 768px) {
    .step_wr { 
        flex-direction: row; 
        gap: 2rem; 
    }
    .step_wr:not(.type02)::before {
        content: ''; 
        width: 100%; height: .2rem;
        background-color: #d9e2ec; 
        position: absolute; 
        top: 50%; left: 0; 
        transform: translateY(-50%);
        z-index: 0; 
    }
    .step_num { 
        z-index: 1; 
    }
}
.btn {
    width: max-content;
    margin: 0 auto;
    margin-top: clamp(5rem, 7.8125vw, 10rem);
    font-size: clamp(1.5rem, 1.5625vw, 2rem);
    padding: 2rem 3rem;
    border: .2rem solid transparent;
    border-radius: .6rem;
    font-weight: 600;
    line-height: 1;
    box-shadow: 0 .4rem 1rem rgba(0,0,0,0.06);
    transition: transform 1s ease, opacity 1s ease, filter 1s ease, color .3s ease, border-color .3s ease;
}
.btn:hover {
    border-color: var(--mainColor);
    color: var(--mainColor);
}

/* 탭버튼 */
.tabs {
    margin-top: clamp(5rem, 7.8125vw, 10rem);
    width: 100%;
}
.tab_list {
    gap: 1rem;
}
.tab_list li {
    list-style: none;
}

.tab_btn{
    font-size: clamp(1.8rem, 1.5625vw, 2rem);
    padding: .8rem 1.2rem;
    border: .2rem solid transparent;
    border-radius: .6rem;
    background: #fff;
    font-weight: 600;
    line-height: 1;
    box-shadow: 0 .4rem 1rem rgba(0,0,0,0.06);
    transition: all .3s ease;
}
.tab_btn:hover {
    border-color: var(--mainColor);
    color: var(--mainColor);
}
.tab_btn.act{
    color: var(--mainColor);
    border-color: var(--mainColor);
    box-shadow: 0 .4rem 1.2rem rgba(0,0,0,0.10);
}
.tab_panels {
    margin-top: 1.6rem;
}
.tab_panel{
    display: none;
}
.tab_panel.act{
    display: block;
}

/* 입력폼 */
form {
    margin: 0 auto;
    margin-top: clamp(5rem, 7.8125vw, 10rem);
    max-width: 80rem;
    gap: 1.5rem;
}
form div {
    width: 100%;
}
form .btn {
    margin-top: clamp(5rem, 7.8125vw, 10rem);
    width: 100%;
    font-size: inherit;
    margin: 0;
}
form input + .btn {
    margin: 2rem 0;
}
form input {
    border: 1px solid #ddd;
    border-radius: 1rem;
    width: 100%;
    height: 6rem;
    padding: 0 2rem;
}
form textarea {
    border: 1px solid #ddd;
    border-radius: 1rem;
    width: 100%;
    resize: none;
    padding: 2rem;
}
form input[type="checkbox"] {
    margin-right: 1rem;
    width: 1.8rem;
    height: 1.8rem;
    display: block;
    padding: 0;
}
form input[type="checkbox"] {
    margin-right: 1rem;
    width: 1.8rem;
    height: 1.8rem;
    appearance: none;
    border: .2rem solid #666;
    border-radius: .4rem;
    cursor: pointer;
    position: relative;
}
form input[type="checkbox"]:checked {
    background-color: var(--mainColor);
    border-color: var(--mainColor);
}
form input[type="checkbox"]:checked::after {
    content: "✔";
    color: #fff;
    font-size: 1.4rem;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}
form label:not(.tit) {
    display: flex;
    gap: .2rem;
    cursor: pointer;
}
form .tit {
    display: block;
    margin-bottom: 1rem;
    font-weight: bold;
}

/* 개인정보 팝업창 */
.privacy_wr {
    display: flex;
    align-items: center;
    margin-bottom: 2.5rem;
}
.privacy_wr a {
    color: var(--mainColor);
    text-decoration: underline;
    font-weight: 700;
    cursor: pointer;
}
.submit_btn:disabled {
    background-color: #aaa;
    cursor: not-allowed;
}
.submit_btn:disabled:hover {
    border: .2rem solid transparent;
    color: #000;
}
.popup_wr {
    display: none;
    position: fixed;
    top: 0; left: 0; width: 100%; height: 100%;
    justify-content: center; align-items: center;
    z-index: 1000;
}
.popup_wr.active { display: flex; }
.popup_bg {
    position: absolute; top: 0; left: 0;
    width: 100%; height: 100%;
    background-color: rgba(0, 0, 0, 0.6);
}
.popup_cont {
    position: relative; background-color: #fff;
    padding: 40px; border-radius: 8px;
    width: 90%; max-width: 600px; max-height: 80vh;
    overflow-y: auto; z-index: 1001;
}
.popup_cont h2 { 
    font-size: 1.8rem; 
    font-weight: 800;
    margin-bottom: 2rem;
}
.popup_cont h3 {
    font-weight: bold;
}
.popup_cont p,
.popup_cont li {
    line-height: 1.8;
    color: #444;
}
.popup_cont li {
    text-indent: -.7rem;
    padding-left: .7rem;
}
.popup_cont .cont {
    margin-bottom: 20px;
}
.popup_cont .close_btn {
    position: absolute; top: 4rem; right: 1.5rem;
    cursor: pointer;
}

/* footer */
.footer {
    background: #222;
}
.footer a { 
    width: max-content;
    color: rgba(225, 225, 225, .75);
}
.footer a:hover {
    color: var(--white);
}
.ft_inner {
    margin: 0 auto;
    padding: 4rem 0;
    padding-left: clamp(15rem, 16.4063vw, 21rem);
    padding-right: clamp(15rem, 16.4063vw, 21rem);
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 3rem;
}
.ft_inner .ft_col:nth-child(5){
    grid-column: 5 / span 6;
    grid-row: 1;
}
.ft_inner .ft_col:nth-child(6){
    grid-column: 8 / span 9;
    grid-row: 1;
    position: relative;
}

.ft_col h4 {
    width: max-content;
    margin-bottom: 1.2rem;
    color: var(--white);
}
.ft_col ul li + li {
    margin-top: .6rem;
}
.ft_col p { 
    margin: .4rem 0; 
    gap: .3rem;
    color: var(--white);
}

.sel_menu {
    margin-top: .4rem;
}
.sel_menu .sel_btn_wr {
    display: flex;
    height: 5.5rem;
    background: rgba(0, 0, 0, .4);
    padding: 2rem;
    border-radius: .8rem;
    align-items: center;
    cursor: pointer;
    justify-content: space-between;
}
.sel_menu .sel_btn_wr .sel_btn {
    color: var(--white);
}
.sel_menu .sel_btn_wr svg {
    transition: all .2s ease;
}
.sel_menu.active .sel_btn_wr svg {
    transform: rotate(-180deg);
}
.sel_menu .sel_btn_wr .sel_menu .options {
    display: none;
    position: absolute;
    width: 100%;
    padding: 1rem;
    margin-top: 1rem;
    border-radius: .8rem;
    color: var(--white);
    background: rgba(0, 0, 0, 0.6);
    animation-name: fadeInDown;
    animation-duration: 0.35s;
    animation-fill-mode: both;
}
.sel_menu .options {
    background: #000;
    display: none;
}
.sel_menu .options .option {
    display: flex;
    height: 5.5rem;
    cursor: pointer;
    padding: 0 1.6rem;
    border-radius: .8rem;
    align-items: center;
    color: var(--white);
    background: rgba(0, 0, 0, 0.6);
}
.sel_menu .options .option:hover {
    background: rgb(50 50 50);
}
.sel_menu.active .options {
  display: block;
  opacity: 0;
  animation-name: fadeInUp;
  animation-duration: 0.4s;
  animation-fill-mode: both;
}

.ft_bottom {
    border-top: 1px solid #444;
    padding: 1.5rem 0;
    padding-left: clamp(15rem, 16.4063vw, 21rem);
    padding-right: clamp(15rem, 16.4063vw, 21rem);
    gap: 2rem;
}

.ft_bottom p {
    color: rgba(225, 225, 225, .75);
    font-size: 1.3rem;
}
.ft_links {
    gap: 1rem;
}
.ft_links li a { 
    font-size: 1.3rem;
}

/* 표 공통 css */
.table_wr {
    max-width: 100rem;
    margin: 0 auto;
    margin-top: clamp(3rem, 4.6875vw, 6rem);
    background: rgba(255,255,255,0.9);
    border-radius: 1rem;
    border-left: .7rem solid var(--mainColor);
    box-shadow: 0 .4rem 1.5rem rgba(0,0,0,0.1);
}
.table {
    width: 100%;
    border-collapse: collapse;
    font-size: 1rem;
}
.table th {
    background: #f5f5f5;
    text-align: left;
    padding: 2rem;
    font-weight: bold;
    color: #333;
    width: 25%;
    border-bottom: 1px solid #ddd;
}
.table td {
    padding: 0 2rem;
    border-bottom: 1px solid #ddd;
    color: #555;
}

/* 서브페이지 공통 */
.sub_pg {
    position: relative;
}
.sub_pg .section {
    padding-left: clamp(7rem, 7.8125vw, 15rem);
    padding-right: clamp(7rem, 7.8125vw, 15rem);
}
.sub_pg .section h3 {
    text-align: center;
}
.sub_pg .section + .section:not(.sec02) {
    margin-top: clamp(11rem, 15.625vw, 20rem);
}
.sub_pg .sec01 {
    padding-top: clamp(11rem, 15.625vw, 20rem);
    padding-bottom: clamp(11rem, 15.625vw, 20rem);
}
.sub_pg:not(.about) .sec01 {
    background-color: #f8f9fa;
    /* background: linear-gradient(180deg, #f8f9fa, #FFF); */
    border-bottom: 2px solid rgba(192, 192, 192, 0.3);
}
.sub_pg:not(.about) .sec01 .tit_box .sub_txt {
    font-size: clamp(2rem, 2.0833vw, 4rem);
    background: linear-gradient(90deg, #4c4c4c, var(--black));
    -webkit-text-fill-color: transparent;
    background-clip: text;
}
.sub_pg:not(.about) .sec02 {
    margin-top: clamp(11rem, 15.625vw, 20rem);
}
.sub_pg .section:last-child {
    padding-bottom: clamp(11rem, 15.625vw, 20rem);
}

/* 서브페이지 - 배너영역 */
.sub_bnr {
    position: relative;
    overflow: hidden;
    height: 55rem;
}
.sub_bnr .sub_nav {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: block;
    width: 75%;   
}
.sub_bnr .bnr_bg {
    height: 100%;
}
.sub_bnr .crumb {
    gap: 1rem;
    color: var(--white);
    font-weight: bold;
}
.sub_bnr .crumb svg path,
.sub_bnr .crumb svg polyline {
    color: var(--white); 
}
.sub_bnr h2 {
    color: var(--white); 
    margin-top: clamp(1.5rem, 2.3438vw, 3rem);
}
.sub_bnr_wr .sub_tap_wr {
    margin: 0 auto;
    background: #111;
}
.sub_bnr_wr .sub_tap_wr li {
    transition: border .3s ease;
}
.sub_bnr_wr .sub_tap_wr li a {
    display: block;
    min-width: 16rem;
    height: 6.2rem;
    padding: 0 2rem;
    line-height: 6.2rem;
    text-align: center;
    font-size: clamp(1.6rem, 2.3438vw, 1.8rem);
    color: var(--white);
    transition: background-color .3s ease, border .3s ease;
}
.sub_bnr_wr .sub_tap_wr li.on a,
.sub_bnr_wr .sub_tap_wr li:hover a {
    font-weight: 600;
    color: var(--black);
    background-color: #f8f9fa;
    border: 1px solid #dedede;
    border-top: none;
}

@media screen and (max-width:1280px) {
    .tablet_1280 {
        display: block;
    }
    
    .pc_1280 {
        display: none;
    }
    .tab {
        display: none;
    }

    .header,
    .ft_inner,
    .ft_bottom {
        padding-left: clamp(7rem, 7.8125vw, 15rem);
        padding-right: clamp(7rem, 7.8125vw, 15rem);
    }
    .ft_inner .ft_col:nth-child(5) {
       grid-column: 1 / span 5;
       grid-row: 2; 
    }
}

@media screen and (max-width:1024px) {
    .pc_1024 {
        display: none;
    }

    .mo_1024 {
        display: block;
    }

    .tab_menu2 {
        display: none;
    }

    table.mo_1024 {
        display: table;
    }
}

@media screen and (max-width:768px) {
    * {
        font-size: 1.4rem;
    }

    #main {
        padding-top: 6rem;
    }

    .pc,
    .pc.f_c,
    .table_layout.pc {
        display: none;
    }

    .mo {
        display: block;
    }

    .table_layout.mo {
        display: table;
    }

    .scroll::-webkit-scrollbar {
        width: 0;
    }

    .head_line1 {
        font-size: 2.8rem;
    }

    .head_line1 .en {
        font-size: 2.6rem;
    }

    .head_line2 {
        font-size: 2.1rem;
    }

    .head_line3 {
        font-size: 1.8rem;
    }

    .head_line4 {
        font-size: 1.7rem;
    }

    .head_line5 {
        font-size: 2rem;
    }

    .sub_title2 {
        font-size: 1.4rem;
    }

    .sub_title1,
    .sub_title3 {
        font-size: 1.3rem;
    }

    .title1 {
        font-size: 1.9rem;
    }

    .title2 {
        font-size: 1.6rem;
        line-height: 1.5;
    }
    .sub_txt {
        font-size: clamp(1.6rem, 2.3438vw, 1.8rem);
    }

    /* 말머리 dots */
    .dots::before {
        width: 0.6rem;
        height: 0.6rem;
        top: 0.8rem;
        left: 0.7rem;
    }

    /* header */
    .header {
        padding: 1rem 1.3rem 1rem 3rem;
        height: auto;
    }

    .mo.nav {
        display: flex;
        align-items: center;
        justify-content:space-between;
        position: relative; 
        z-index: 100; 
    }
    .mo.logo { 
        width: 12rem; 
    }

    /* 햄버거 버튼 */
    .ham_btn {
        position: relative;
        width: 4.2rem; 
        height: 4.2rem;
        border: 0; 
        background: transparent; 
        cursor: pointer;
    }
    .ham_btn span,
    .ham_btn span::before,
    .ham_btn span::after {
        content: "";
        display: block;
        width: 2.4rem;
        height: .2rem;
        background: var(--white);
        transition: all 0.3s ease;
        position: relative;
        z-index: 999;
    }
    .sub_pg .ham_btn span,
    .sub_pg .ham_btn span::before,
    .sub_pg .ham_btn span::after {
        background: var(--white);
    }
    .sub_pg .header.fixed .ham_btn span,
    .sub_pg .header.fixed .ham_btn span::before,
    .sub_pg .header.fixed .ham_btn span::after,
    .white_on .ham_btn span,
    .white_on .ham_btn span::before,
    .white_on .ham_btn span::after {
        background: var(--black);
    }

    .ham_btn span::before,
    .ham_btn span::after {
        position: absolute;
        left: 0;
    }

    .ham_btn span::before { 
        top: -.7rem;
    }
    .ham_btn span::after  {
        top: .7rem;
    }

    /* 활성화 시 X 모양 */
    .sub_pg .header.fixed .ham_btn.on span {
        background: transparent; 
    }
    .ham_btn.on span::before {
        width: 2.4rem;
        top: 0;
        background: #000;
        transform: rotate(45deg);
    }
    
    .ham_btn.on span::after {
        width: 2.4rem;
        top: 0;
        background: #000;
        transform: rotate(-45deg);
    }

    /* 드로어 래퍼(오버레이) */
    .ham_wr {
        position: fixed; inset: 0;
        background: rgba(0,0,0,.36);
        opacity: 0; pointer-events: none;
        transition: opacity var(--transition);
    }

    /* 드로어 패널 */
    .ham_wr .inner {
        position: absolute; 
        top: 0; 
        right: 0; 
        bottom: 0;
        width: var(--drawer-w);
        background: #fff;
        transform: translateX(100%);
        transition: transform var(--transition);
        padding: 5rem 2rem;
    }

    /* 햄버거 메뉴 오픈 상태 */
    .ham_wr.on { 
        opacity: 1; 
        pointer-events: auto; 
    }
    .ham_wr.on .inner { 
        transform: translateX(0); 
    }

    /* 바디 스크롤 락 */
    .body-locked { 
        overflow: hidden; 
        touch-action: none; 
    }

    /* 메뉴 리스트 */
    .ham_menu { 
        list-style: none; 
        margin: 0; 
        padding: 0; 
    }
    .ham_menu > li { 
        border-bottom: .1rem solid #eee; 
    }
    .menu_btn {
        width: 100%; 
        text-align: left; 
        font-size: 1.8rem;
        padding: 1.6rem .6rem; 
        background: none; 
        border: 0; 
        cursor: pointer;
    }

    /* ▼ 화살표 */
    .menu_btn::after{
        content:"";
        width:1rem; 
        height:1rem; 
        border-right:.2rem solid #222; 
        border-bottom:.2rem solid #222;
        transform: rotate(45deg); 
        transition: transform var(--transition);
    }
    .menu_btn[aria-expanded="true"]::after{ 
        transform: rotate(-135deg); 
    }

    /* 2뎁스 어코디언 */
    .depth2{
        list-style: none; 
        margin: 0; 
        padding: 0 0 0 .6rem;
        max-height: 0; 
        overflow: hidden; 
        opacity: 0;
        transition: max-height var(--transition), opacity var(--transition);
    }
    .depth2 a{
        display: block; 
        padding: 1rem .4rem; 
        font-size: 1.5rem; 
        color: #333; 
        text-decoration: none;
    }
    .depth2.open{ 
        max-height: 60rem; 
        opacity: 1; 
        padding-bottom: 1rem;
    }
    .ham_menu a, 
    .menu_btn {
        -webkit-tap-highlight-color: transparent;
    }

    /* 카드 type01 - 호버형 */
    .card_wr .card_box {
        flex-direction: column;
        width: 100%;
    }
    .card_wr .card_box .card_cont {
        transform: none !important;
    }
    .card_wr .card_box .card_cont .sub_txt {
        opacity: 1;
        max-height: 20rem;
    }
    .card_wr .card_box .card_cont .bg::after {
        opacity: .5;
    }

    /* 카드 type02 - 목록형 */
    .card_wr.type02 {
        height: auto;
    }
    .card_wr.type02 .card_box li {
        height: auto;
        position: relative;
        top: inherit;
        padding: clamp(3rem, 6.5104vw, 5rem);
    }
    .card_wr.type02 .card_box li + li {
        margin-top: 2rem;
    }
    .card_wr.type02 .card_box li:nth-child(1), 
    .card_wr.type02 .card_box li:nth-child(2), 
    .card_wr.type02 .card_box li:nth-child(3) {
        transform: translateY(0);
    }
    .card_wr.type02 .card_box div p:not(.sub_txt) {
        margin-bottom: 2rem;
    }
    .card_wr.type02 .card_box .txt_wr .sub_txt {
        font-size: clamp(1.6rem, 2.3438vw, 1.8rem);
    }
    .card_wr.type03 .card_cont .txt {
        font-size: clamp(1.6rem, 2.3438vw, 1.8rem);
    }
    .card_wr.type02 .card_box .r_txt {
        top: 1.3rem;
        right: 2rem;
    }

    /* 카드 type03 - 텍스트 박스형 */
    .card_wr.type03 {
        grid-template-columns: 1fr;
    }

    /* step cont */
    .step_num,
    .step_cont p {
        font-size: clamp(1.6rem, 2.3438vw, 1.8rem);
    }

    /* 탭버튼 */
    .tab_list{
        overflow-x: auto;
        gap: .6rem;
        justify-content: flex-start;
    }
    .tab_btn{
        white-space: nowrap;
    }

    /* 개인정보 팝업창 */
    .popup_cont .close_btn {
        right: 3rem;
    }

    /* footer */
    .ft_inner {
        padding: 4rem 3rem;
        grid-template-columns: repeat(2, 1fr);
    }
    .ft_inner .ft_col:nth-child(3){
        grid-column: 1 / span 1;
        grid-row: 2;
    }
    .ft_inner .ft_col:nth-child(4){
        grid-column: 2 / span 1;
        grid-row: 2;
    }
    .ft_inner .ft_col:nth-child(5){
        grid-column: 1 / span 2;
        grid-row: 3;
    }
    .ft_inner .ft_col:nth-child(6){
        grid-column: 1 / span 2;
        grid-row: 4;
    }
    .ft_bottom {
        gap: 1.5rem;
        flex-direction: column-reverse;
        padding: 1.5rem;
    }
    .sel_box select {
        width: 100%;
    }

    .sub_pg .section {
        padding-left: 3rem;
        padding-right: 3rem;
    }

    /* 서브페이지 배너영역 */
    .sub_bnr {
        height: 45rem;
    }
    .sub_bnr .crumb {
        justify-content: center;
        align-items: center;
    }
    .sub_bnr .crumb svg {
        width: 2rem;
    }
    .sub_bnr h2 {
        text-align: center;
    }
}

@keyframes fadeInUp {
  from {
    transform: translate3d(0, 30px, 0);
  }
  to {
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}
@keyframes fadeInDown {
  from {
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
  to {
    transform: translate3d(0, 20px, 0);
    opacity: 0;
  }
}