@charset "utf-8";
@import "font.css";
/************************************************
* 파일명 : common.css
* 작성자 : hw.pak
* 작성일 : 2023-05
* 내용 : 전체 공통
************************************************/
:root{
    --bs-blue: #0d6efd;
    --bs-indigo: #6610f2;
    --bs-purple: #6f42c1;
    --bs-pink: #d63384;
    --bs-red: #dc3545;
    --bs-orange: #fd7e14;
    --bs-yellow: #ffc107;
    --bs-green: #198754;
    --bs-teal: #20c997;
    --bs-cyan: #0dcaf0;
    --bs-white: #fff;
    --bs-gray: #6c757d;
    --bs-gray-dark: #343a40;
    --bs-primary: #0d6efd;
    --bs-secondary: #6c757d;
    --bs-success: #198754;
    --bs-info: #0dcaf0;
    --bs-warning: #ffc107;
    --bs-danger: #dc3545;
    --bs-light: #f8f9fa;
    --bs-dark: #212529;
    --font-default: 10px/1.4 'AppleSDGothicNeo','Noto Sans KR',-apple-system,system-ui,BlinkMacSystemFont,"맑은 고딕","Malgun Gothic","Apple SD Gothic Neo","돋움",dotum,sans-serif;
    --font-family-nanum : 'Nanum Gothic', sans-serif;;
    --font-family-noto : 'Noto Sans KR', sans-serif;
    --font-family-roboto : 'Roboto', sans-serif;
    --color-mv: #4769c5;
}
*{
    margin:0;
    padding:0;
}
*, :before, :after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
html {
    font:var(--font-default);
}
body {
    font-size:1.3rem;
    color:#000;
    letter-spacing: -.5px;
    word-break: keep-all;
}
body.scrollDisable {
    overflow: hidden;
    touch-action: none;
}
ul, ol {
    list-style: none;
}
img{
    max-width:100%;
    border:none;
    outline:none;
    vertical-align:top;
}
.clearfix:after {
    content:"";
    display:block;
    clear:both;
    *zoom:1;
}
a:link, a:visited, a:hover, a:active {
    color: inherit;
    text-decoration: none;
}
em { font-style: normal;}
button {
    border: none;
    background: none;
    cursor: pointer;
    font-family: inherit;
    outline: none;
}

legend,caption {
    display:block;
    overflow:hidden;
    position:absolute;
    text-indent:-9999px;
    top:-9999px;
    font-size:0;
    width:1px;
    height:1px;
    left:-9999px;
    line-height:0
}
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {color:#ccc;}
input:-moz-placeholder,
textarea:-moz-placeholder {color:#ccc;}
input::-moz-placeholder,
textarea::-moz-placeholder {color:#ccc;}
input:-ms-input-placeholder,
textarea:-ms-input-placeholder {color:#ccc;}

input:focus::-webkit-input-placeholder,
textarea:focus::-webkit-input-placeholder {color:transparent;}
input:focus:-moz-placeholder,
textarea:focus:-moz-placeholder {color:transparent;}
input:focus::-moz-placeholder,
textarea:focus::-moz-placeholder {color:transparent;}
input:focus:-ms-input-placeholder,
textarea:focus:-ms-input-placeholder {color:transparent;}

input, textarea, select { outline: transparent; }

.input_text { height: 34px; color: #333; padding: 0 8px; border-radius: 4px; border:1px solid #DFE3EA; outline: none;}
.input_text:focus { border-color:#000; }

.tx_blind { width:0; height:0; font-size: 0; text-indent:-9999px; }
/* ----------------------------------------------------------------
    @공통_폰트
-----------------------------------------------------------------*/
.font-nanum { font-family: var(--font-family-nanum); }
.font-notoKr { font-family: var(--font-family-noto); }
.font-roboto { font-family: var(--font-family-roboto); }

/* ----------------------------------------------------------------
    @공통_패딩마진
-----------------------------------------------------------------*/
.p0 { padding:0 !important;}
.pt5 { padding-top:5px !important; }
.pt7 { padding-top:7px !important; }
.pt10 { padding-top:10px !important; }
.pt15 { padding-top:15px !important; }
.pt20 { padding-top:20px !important; }
.pt25 { padding-top:25px !important; }
.pt30 { padding-top:30px !important; }
.pt35 { padding-top:35px !important; }
.pt40 { padding-top:40px !important; }
.pt45 { padding-top:45px !important; }
.pt50 { padding-top:50px !important; }

.pb0 { padding-bottom:0 !important; }
.pb2 { padding-bottom:2px !important; }
.pb4 { padding-bottom:4px !important; }
.pb5 { padding-bottom:5px !important; }
.pb7 { padding-bottom:7px !important; }
.pb10 { padding-bottom:10px !important; }
.pb14 { padding-bottom:14px !important; }
.pb15 { padding-bottom:15px !important; }
.pb20 { padding-bottom:20px !important; }
.pb30 { padding-bottom:30px !important; }
.pb40 { padding-bottom:40px !important; }
.pb50 { padding-bottom:50px !important; }

.p15 { padding:15px !important; }
.pl0 { padding-left:0 !important;}
.pl5 { padding-left:5px !important;}
.pl15 { padding-left:15px !important; }
.pl20 { padding-left:20px !important; }
.pl25 { padding-left:25px !important; }
.pl40 { padding-left:40px !important; }

.pr0 { padding-right:0 !important;}
.pr10 { padding-right:10px !important;}
.pr15 { padding-right:15px !important; }
.pr20 { padding-right:20px !important; }
.pr30 { padding-right:30px !important; }
.pr40 { padding-right:40px !important; }
.pr50 { padding-right:50px !important; }

.mt0 { margin-top:0; }
.mt3 {margin-top:3px !important;}
.mt5 { margin-top:5px !important; }
.mt10 { margin-top:10px !important; }
.mt15 { margin-top:15px !important; }
.mt20 { margin-top:20px !important; }
.mt25 { margin-top:25px !important; }
.mt30 { margin-top:30px !important; }
.mt35 { margin-top:35px !important; }
.mt40 { margin-top:40px !important; }
.mt45 { margin-top:45px !important; }
.mt50 { margin-top:50px !important; }
.mt100 { margin-top:100px !important; }
.mt300 { margin-top:300px !important; }

.mb0 { margin-bottom:0; }
.mb5 { margin-bottom:5px !important; }
.mb7 {margin-bottom:7px !important;}
.mb10 { margin-bottom:10px !important; }
.mb15 { margin-bottom:15px !important; }
.mb20 { margin-bottom:20px !important; }
.mb25 { margin-bottom:25px !important; }
.mb30 { margin-bottom:30px !important; }
.mb40 { margin-bottom:40px !important; }
.mb50 { margin-bottom:50px !important; }
.mb100 { margin-bottom:100px !important; }

.ml0 { margin-left:0 !important; }
.ml10 { margin-left:10px !important; }
.ml15 { margin-left:15px !important; }
.ml20 { margin-left:20px !important; }
.ml30 { margin-left:30px !important; }
.ml40 { margin-left:40px !important; }
.ml50 { margin-left:50px !important; }


.mr0 { margin-right:0 !important;}
.mr5 { margin-right:5px !important;}
.mr10 { margin-right:10px !important;}
.mr15 { margin-right:15px !important;}
.mr20 { margin-right:20px !important; }
.mr30 { margin-right:30px !important; }
.mr40 { margin-right:40px !important; }
.mr50 { margin-right:50px !important; }


.bold {font-weight:bold!important;}
.nopadding{padding:0!important;}
.nomargin{margin:0!important;}
.nobg{background: none!important;}
.font_default {font-size:12px; color:#333;}
.border_default {border: 1px solid #e0e0e0;}
.vertical_middle {
    display:inline-block;
    vertical-align:middle;
}
.display_none {display:none!important;}
.hidden, .hide { overflow: hidden!important;}
.visible { overflow: visible!important;}

.text_left {text-align: left;}
.text_right {text-align: right;}
.text_center {text-align: center;}

/* ----------------------------------------------------------------
    @공통_말줄임
-----------------------------------------------------------------*/
.tx_shortening_1 {overflow:hidden; white-space: nowrap; word-break: break-all; text-overflow: ellipsis;}
.tx_shortening_2 {overflow:hidden; display:-webkit-box; -o-text-overflow:ellipsis; text-overflow:ellipsis; -webkit-line-clamp:2; -webkit-box-orient:vertical; word-wrap:break-word; word-break:break-all;}
.tx_shortening_3 {overflow:hidden; display:-webkit-box; -o-text-overflow:ellipsis; text-overflow:ellipsis; -webkit-line-clamp:3; -webkit-box-orient:vertical; word-wrap:break-word; word-break:break-all;}
.tx_shortening_4 {overflow:hidden; display:-webkit-box; -o-text-overflow:ellipsis; text-overflow:ellipsis; -webkit-line-clamp:4; -webkit-box-orient:vertical; word-wrap:break-word; word-break:break-all;}

/* ----------------------------------------------------------------
    @공통_폰트사이즈
-----------------------------------------------------------------*/
.font0 {font-size: 0;}
.font12 {font-size: 12px!important;}
.font13 {font-size: 13px!important;}
.font14 {font-size: 14px!important;}
.font15 {font-size: 15px!important;}
.font16 {font-size: 16px!important;}
.font17 {font-size: 17px!important;}
.font18 {font-size: 18px!important;}
.font19 {font-size: 19px!important;}
.font20 {font-size: 20px!important;}

.ft_res { transition: all .5s; }
@media (max-width:767px) {
    .ft_main_tit { font-size: 4.6rem; }
    .ft_row_tit { font-size: 3.2rem; }
    .ft_row_tit2 { font-size: 3.2rem; }
    .ft_cont_tit { font-size: 3rem; }
    .ft_cont_label { font-size: 1.8rem; }
    .ft_cont_desc { font-size: 1.4rem; }
    .ft_cont_summ { font-size: 1.6rem; }
}
@media (min-width:768px) {
    .ft_main_tit { font-size: 5rem; }
    .ft_row_tit { font-size: 4.8rem; }
    .ft_row_tit2 { font-size: 4rem; }
    .ft_cont_tit { font-size: 3rem; }
    .ft_cont_label { font-size: 2.2rem; }
    .ft_cont_desc { font-size: 1.6rem; }
    .ft_cont_summ { font-size: 1.6rem; }
}
@media (min-width:992px) {
    .ft_main_tit { font-size: 6rem; }
    .ft_row_tit { font-size: 5rem; }
    .ft_row_tit2 { font-size: 5rem; }
    .ft_cont_tit { font-size: 3.2rem; }
    .ft_cont_label { font-size: 2.6rem; }
    .ft_cont_desc { font-size: 1.8rem; }
    .ft_cont_summ { font-size: 1.6rem; }
}
@media (min-width:1280px) {
    .ft_main_tit { font-size: 6rem; }
    .ft_row_tit { font-size: 6rem; }
    .ft_row_tit2 { font-size: 5rem; }
    .ft_cont_tit { font-size: 4rem; }
    .ft_cont_label { font-size: 3rem; }
    .ft_cont_desc { font-size: 2rem; }
    .ft_cont_summ { font-size: 1.6rem; }
}
@media (min-width:1400px) {
    .ft_main_tit { font-size: 8rem; }
}

.ft_highlight { word-break: keep-all; background: linear-gradient(to top, #dcebfe 50%, transparent 50%);}
/* ----------------------------------------------------------------
    @공통_테이블
-----------------------------------------------------------------*/
.table { width:100%; border-spacing: 0; border-collapse: collapse; }
.table th { background-color:#f5f5f5; }
.table th,
.table td { font-size: 13px; color: #333; padding: 4px 16px; border:1px solid #eee; }

/* ----------------------------------------------------------------
    @공통_리스트(타입_default_hyphen)
-----------------------------------------------------------------*/
.list_hyphen > li { position:relative; font-size: 13px; padding-left:12px; color:#333; }
.list_hyphen > li:before { content:"-"; font-size: inherit; font-weight: inherit; color:inherit; position: absolute; top:0; left:4px; }

/* ----------------------------------------------------------------
    @공통_리스트(타입_custom)
-----------------------------------------------------------------*/
.list_custom > li { position:relative; font-size: 13px; padding-left:12px; color:#333; }
.list_custom > li:before { content:attr(data-symbol); font-size: inherit; font-weight: inherit; color:inherit; position: absolute; top:0; left:4px; }

/* ----------------------------------------------------------------
    @공통_반응형(container)
-----------------------------------------------------------------*/
.container { position:relative; margin:0 auto; padding:0 20px; }

@media (max-width:767px){ .container {width:100%} }
@media (min-width:768px){ .container{width:750px} }
@media (min-width:992px){ .container{width:970px} }
@media (min-width:1280px){ .container{width:1170px} }
@media (min-width:1400px){ .container {width:1350px} }

/* ----------------------------------------------------------------
    @공통_반응형(column)
-----------------------------------------------------------------*/
.row {display: flex; flex-wrap:wrap; justify-content: flex-start; align-items: center; margin:0 -15px;}
.col {flex:0 0 auto; position: relative; min-height: 1px; padding: 0 15px;}

.col_gap_0 {margin:0;}
.col_gap_0 > .col {padding:0;}
.col_gap_8 {margin:0 -4px;}
.col_gap_8 > .col {padding:0 4px; }
.col_gap_10 {margin:0 -5px;}
.col_gap_10 > .col { padding:0 5px; }
.col_gap_16 {margin:0 -8px;}
.col_gap_16 > .col {padding:0 8px;}

.col_mb0 > .col { margin-bottom: 0!important;}

.flex_nowrap {flex-wrap:nowrap;}
.align_items_flex_start { align-items: flex-start; }
.align_items_flex_end { align-items: flex-end; }
.justify_content_flex_start { justify-content: flex-start; }
.justify_content_flex_end { justify-content: flex-end; }


.col_half {width:50%}
.col_12 {width: 100%;} .col_11 {width: 91.66666667%;} .col_10 {width: 83.33333333%;} .col_9 {width: 75%;} .col_8 {width: 66.66666667%;} .col_7 {width: 58.33333333%;} .col_6 {width: 50%;} .col_5 {width: 41.66666667%;} .col_4 {width: 33.33333333%;} .col_3 {width: 25%;} .col_2 {width: 16.66666667%;} .col_1 {width: 8.33333333%;}

@media (max-width:767px) {
    .col_xs_12 {width: 100%;} .col_xs_11 {width: 91.66666667%;} .col_xs_10 {width: 83.33333333%;} .col_xs_9 {width: 75%;} .col_xs_8 {width: 66.66666667%;} .col_xs_7 {width: 58.33333333%;} .col_xs_6 {width: 50%;} .col_xs_5 {width: 41.66666667%;} .col_xs_4 {width: 33.33333333%;} .col_xs_3 {width: 25%;} .col_xs_2 {width: 16.66666667%;} .col_xs_1 {width: 8.33333333%;}
    /* ------------------------------------  */
    .hidden_xs {display:none!important; }
    .visible_xs { display:block!important; }
}
@media (min-width:768px) {
    .hidden_sm {display:none!important; }
    .col_sm_12 {width: 100%;} .col_sm_11 {width: 91.66666667%;} .col_sm_10 {width: 83.33333333%;} .col_sm_9 {width: 75%;} .col_sm_8 {width: 66.66666667%;} .col_sm_7 {width: 58.33333333%;} .col_sm_6 {width: 50%;} .col_sm_5 {width: 41.66666667%;} .col_sm_4 {width: 33.33333333%;} .col_sm_3 {width: 25%;} .col_sm_2 {width: 16.66666667%;} .col_sm_1 {width: 8.33333333%;}
}
@media (min-width:992px) {
    .col_md_auto {width:auto;} .col_md_12 {width: 100%;} .col_md_11 {width: 91.66666667%;} .col_md_10 {width: 83.33333333%;} .col_md_9 {width: 75%;} .col_md_8 {width: 66.66666667%;} .col_md_7 {width: 58.33333333%;} .col_md_6 {width: 50%;} .col_md_5 {width: 41.66666667%;} .col_md_4 {width: 33.33333333%;} .col_md_3 {width: 25%;} .col_md_2 {width: 16.66666667%;} .col_md_1 {width: 8.33333333%;}
}
@media (min-width:1280px) {
    .col_lg_12 {width: 100%;}.col_lg_11 {width: 91.66666667%;}.col_lg_10 {width: 83.33333333%;}.col_lg_9 {width: 75%;}.col_lg_8 {width: 66.66666667%;}.col_lg_7 {width: 58.33333333%;}.col_lg_6 {width: 50%;}.col_lg_5 {width: 41.66666667%;}.col_lg_4 {width: 33.33333333%;}.col_lg_3 {width: 25%;}.col_lg_2 {width: 16.66666667%;}.col_lg_1 {width: 8.33333333%;}
}


/* ========================================================
    main common
======================================================== */
body { overflow-x: hidden;}
.video_wrap {position:relative; padding-top:56.25%; }
.video_wrap video {position:absolute; top:0; left:0; height:100%; }
.section { position: relative; z-index: 10; }
/* ========================================================
    header, footer
======================================================== */
header { background-color:#fff; transition: all .4s; top:-80px;}
header .col_left a { display: inline-block; height: 80px;padding: 28px 0; }
header .col_right { text-align: right; }
header .col_right a { display: inline-block; vertical-align: middle; padding: 5px 0 4px; margin-left: 40px; font-size: 1.6rem; color:#000;}
header .col_right a.btn_move_contact { padding: 6px 24px 3px; border:1px solid #000; border-radius: 20px;}
/* header fixed_top */
header.fixed_top { position: fixed; top:0; left:0; width:100%; box-shadow: 0 4px 10px 1px rgba(0,0,0,.25); z-index: 100; }
/* ----------------------------------------------- */
footer { padding:70px 0; background-color:#F9FAFB;}
footer .footer_top { display: flex; flex-wrap: wrap; justify-content: space-between; }
footer .footer_top a { flex:0 0 auto; }
footer .footer_top .f_menu { flex:0 0 auto; }
footer .footer_top .f_menu ul { }
footer .footer_top .f_menu ul li + li { margin-top: 12px; }
footer .footer_top .f_menu ul li a { color:#000; font-size: 3rem; }
/* ----------------------------------------------- */
footer .footer_bottom { padding:30px 0; border-top:1px solid #000; margin-top: 50px; }
footer .footer_bottom .mv_menu {  }
footer .footer_bottom .mv_menu ul { display: flex; align-items: center; margin:0 -10px; }
footer .footer_bottom .mv_menu ul li { flex: 0 0 auto; padding:0 10px;}
footer .footer_bottom .mv_menu ul li a { font-size: 1.4rem; color:#000; text-decoration: underline; }
footer .footer_bottom .mv_company_info { margin-top:12px; }
footer .footer_bottom .mv_company_info ul { display: flex; flex-wrap: wrap; align-items: center; margin:0 -10px; }
footer .footer_bottom .mv_company_info ul li { position: relative; flex: 0 0 auto; padding: 5px 10px 3px; line-height: 1; font-size: 1.4rem;}
footer .footer_bottom .mv_company_info ul li:after { content:""; display: block; width:1px; height:8px; background-color: #888; position: absolute; top:50%; right:0; transform: translateY(-50%);}
footer .footer_bottom .mv_company_info ul li:last-child:after {display:none; }
footer .footer_bottom .mv_copyright { margin-top:12px; color:#999; font-size: 1.4rem; }

@media (max-width:767px) {
    footer { padding: 40px 0; text-align: center; }
    footer .footer_top { justify-content: space-around; }
    footer .footer_top .f_logo img { width:60px; }
    footer .footer_top .f_menu { width:100%; margin-top:36px; }
    footer .footer_top .f_menu ul { display:flex; flex-wrap: wrap; justify-content: center; }
    footer .footer_top .f_menu ul li { flex:0 0 auto; text-align: center; margin:0!important; }
    footer .footer_top .f_menu ul li a { position:relative; display:block; color:#000; font-size: 2rem; padding:0 10px; }
    footer .footer_top .f_menu ul li + li a:before { content:""; width:1px; height:10px; position: absolute; top:50%; left:0; transform: translateY(-50%); background-color: #888; }

    footer .footer_bottom { margin-top:0; padding-top: 0; border:none; }
    footer .footer_bottom .mv_company_info ul { justify-content: center; }
    footer .footer_bottom .mv_company_info ul li { font-size: 1.3rem; }
}

/* ========================================================
    contact_us
======================================================== */
.mv_contact_us { color: #fff; text-align: center; background-image:url('/resources/images/intro/home/sec8/sec8_bg.jpg'); background-repeat: no-repeat; background-position: center; background-size: cover; padding: 140px 0; margin-bottom:265px;  }
.mv_contact_us .ft_row_tit {font-weight: bold;}
.mv_contact_us .ft_cont_summ { margin-top:10px; }
.mv_contact_us .btn_link { display:inline-block; font-size:2rem; width:200px; margin-top:36px; border:1px solid; border-radius: 20px; padding:7px 0 5px; transition: all .4s;}
.mv_contact_us .btn_link:hover { background-color:#fff; border-color:#fff; color:#000;}

@media (max-width:767px) {
    .mv_contact_us { margin-bottom:0; }
}
/* ========================================================
    sheet
======================================================== */
.sheet_overlay { position: fixed; inset:0; background-color:rgba(0,0,0,.25); z-index: 999; }
.sheetLayer { position: fixed; z-index: 1000; transition: all .5s; }
.sheetLayer .btn_closeSheet { position:absolute; top:16px; right:16px; width:34px; height:34px; padding: 8px; z-index: 10;}
.sheetLayer .sheet_header { font-size: 2.4rem; font-weight: bold; color:#333; border-bottom:1px solid #ddd; padding:16px; border-radius: 16px 0 0 0; position:fixed; top:0; left:0; width: 100%; background-color: #fff; z-index: 10; }
.sheetLayer .sheet_content { height:100%; padding-top: 66px; overflow: auto; }
.sheetLayer .sheet_inner_title { position:sticky; top:0; left:0; font-size: 2rem; font-weight: bold; color:#333; border-bottom:1px solid #ddd; padding:16px; border-top:1px solid #ddd; border-bottom:1px solid #ddd; margin-top:-1px; background-color:#fff; }
/* ----------------------------------------------- */
.sheetLayer_top {}
.sheetLayer_bottom {}
.sheetLayer_left {}
.sheetLayer_right { top:0; right:0; width: 80%; height:100%; background-color: #fff; box-shadow: 0 4px 10px 1px rgba(0,0,0,.25); transform:translateX(100%); border-radius: 8px 0 0 8px;}
/* ----------------------------------------------- */
.sheetLayer.active { transform:translate(0, 0); }
/* ----------------------------------------------- */

.sheetLayer_move_menu .m_move_menu {padding: 16px;}
.sheetLayer_move_menu .m_move_menu li {margin-bottom:16px;}
.sheetLayer_move_menu .m_move_menu li a { display:block; font-size:1.8rem; font-weight: 500; color:#333;}
.sheetLayer_move_menu .m_move_menu li:last-child {margin-bottom: 0; }

.sheetLayer_move_menu .m_compnay_info {padding: 16px; }
.sheetLayer_move_menu .m_compnay_info { font-size:1.3rem; color:#666; }
/* ========================================================
    animated
======================================================== */
@media (min-width:991px) {
    .animated { display: none; animation-duration: 2s; animation-fill-mode: both; }
    .slideInLeft {display: block;animation-name: slideInLeft; }
    @keyframes slideInLeft {
        0% { transform: translate3d(-100%, 0, 0); visibility: visible; opacity: 0; }
        100% { transform: translate(0); opacity: 1; }
    }
    .slideInRight { display: block; animation-name: slideInRight; }
    @keyframes slideInRight {
        0% { transform: translate3d(100%, 0, 0); visibility: visible; opacity: 0;}
        100% {transform: translate(0); opacity: 1; }
    }
    .slideInUp { display: block; animation-name: slideInUp;    }
    @keyframes slideInUp {
        0% { transform: translate3d(0, 100%, 0); visibility: visible; opacity: 0; }
        100% { transform: translate(0); opacity: 1; }
    }
    .slideInDown { display: block; animation-name: slideInDown; }
    @keyframes slideInDown {
        0% { transform: translate3d(0, -100%, 0); visibility: visible; opacity: 0; }
        100% { transform: translate(0); opacity: 1; }
    }

    .duration__1 { animation-duration: 1s; }
    .duration__2 { animation-duration: 2s; }
    .duration__3 { animation-duration: 3s; }
    .duration__4 { animation-duration: 4s; }
    .duration__5 { animation-duration: 5s; }
    .duration__6 { animation-duration: 6s; }
    .duration__7 { animation-duration: 7s; }
    .duration__8 { animation-duration: 8s; }
    .duration__9 { animation-duration: 9s; }

    .delay__1 { animation-delay: .1s; }
    .delay__2 { animation-delay: .2s; }
    .delay__3 { animation-delay: .3s; }
    .delay__4 { animation-delay: .4s; }
    .delay__5 { animation-delay: .5s; }
    .delay__6 { animation-delay: .6s; }
    .delay__7 { animation-delay: .7s; }
    .delay__8 { animation-delay: .8s; }
    .delay__9 { animation-delay: .9s; }
    .delay__10 { animation-delay: 1s; }
}
/* ========================================================
    temp_popup (임시)
======================================================== */
.popup { position:fixed; inset:0; z-index: 10000; padding:16px; }
.popup .dimm { position: absolute; inset:0; background-color:rgba(0,0,0,.25); }
.popup .popup_cont { position:absolute; top:50%; left:50%; transform: translate(-50%,-50%); border-radius: 16px; overflow: hidden; background-color:#fff; z-index:10; }
.popup .popup_cont .btn_close_popup { display: block; width: 100%; padding:14px 0; text-align: center; color:#fff; font-size: 1.6rem; background: #000; }

.popup.popup_intro .popup_cont { width:calc(100% - 32px); max-width: 424px; }