@media screen and (min-width:1280.1px) {
}/* xlg */

@media screen and (min-width:1024.1px) and (max-width:1280px) {
}/* lg */

@media screen and (min-width:767.1px) and (max-width:1024px) {
}/* md */

@media screen and (max-width:767px) {
}/* sm */


/* --------------------------------reset-------------------------------- */
* {padding:0; margin:0; box-sizing:border-box}
html, body {font-size:18px}
body {font-family:'suit', sans-serif; color:#555555; overflow-x:hidden}
a {text-decoration:none; color:inherit}
ol,ul {list-style:none}
button {background:none; border:none; cursor:pointer}
table {border-spacing:0; border-collapse:collapse}
button, input, select {font-family:'suit', sans-serif}
input, select, textarea {vertical-align:middle; outline:none; box-sizing:border-box; border-radius:0; -moz-appearance:none; -webkit-appearance:none; appearance:none; border:none; font-family:'suit', sans-serif}
::placeholder {font-family:'suit', sans-serif}
@media screen and (min-width:767.1px) {
    .brm {display:none}
    .brd {display:block}
}/* xlg ~ md */
@media screen and (min-width:767.1px) and (max-width:1280px) {
    html, body {font-size:16px}
}
@media screen and (max-width:767px) {
    html, body {font-size:14px}
    .brm {display:block}
    .brd {display:none}
}/* sm */
/* --------------------------------reset end-------------------------------- */


/* --------------------------------key_color-------------------------------- */
.key_color_bg {background-color:#DC3030 !important}
.key_color_bg_hover:hover {background-color:#DC3030 !important}
.key_color {color:#DC3030 !important}
.key_color_active {color:#DC3030 !important}
.key_color_hover:hover {color:#DC3030 !important}
.key_color_border {border-color:#DC3030 !important}
.key_color_stroke {stroke:#DC3030 !important}
.key_color_fill {fill:#DC3030 !important}
:root {
    --key-color:#DC3030; /* CSS 전역 변수 선언 */
}
/* --------------------------------key_color end-------------------------------- */


/* --------------------------------common-------------------------------- */
body.ofy_hidden {overflow-y:hidden}
.blind {border:0; clip:rect(0 0 0 0); clip-path:inset(50%); width:1px; height:1px; margin:-1px; overflow:hidden; padding:0; position:absolute; white-space:nowrap}
.skip a {position:absolute; background:rgba(0,0,0,0.7); width:100%; height:40px; text-align:center; color:#fff; z-index:201; line-height:40px; top:-40px; opacity:0}
#wrap {width:100%; min-width:320px; margin:0 auto}
section .inner,
header .inner,
footer .inner {position:relative; width:92%; max-width:1280px; margin:0 auto}
.btn_go_back {display:none}
.onlyPC {display:block !important}
.onlyMO {display:none !important}
@media screen and (max-width:767px) {
  .btn_go_back {display:block; position:absolute; top:5rem; left:0; font-weight:400; font-size:1rem; line-height:120%; color:#777}
  .btn_go_back::before {content:''; display:inline-block; background:url(/front/images/common/ico_arrow_left.svg) center center/auto 100% no-repeat; transform:rotate(180deg); width:1rem; height:1rem; margin-right:.5rem; vertical-align:-.14rem}
  .onlyPC {display:none !important}
  .onlyMO {display:block !important}
}/* sm */
/* --------------------------------common end-------------------------------- */


/* --------------------------------header-------------------------------- */
#header .m_open,
.menu_mo {display:none}

#header {position:fixed; left:0; top:0; width:100%; z-index:100; transition:background-color 0.5s; background-color:transparent}
/*#header.hover {background-color:#fff}*/
#header .inner {height:3.889rem}
#header .inner .logo {position:absolute; left:0; top:50%; width:5.667rem; height:3rem; transform:translateY(-50%)}
#header .inner .logo a {display:block; width:100%; height:100%}

#header .gnb_de {position:absolute; left:50%; top:50%; transform:translate(-50%,-50%)}
#header .gnb_de .gnb {position:absolute; left:50%; top:0rem; transform:translateX(-50%)}
#header .gnb_de .depth_01 {display:flex}
#header .gnb_de .depth_01 >li {position:relative; height:3.889rem; white-space:nowrap}
#header .gnb_de .depth_01 >li:not(:last-child) {margin-right:2rem}
#header .gnb_de .depth_01 >li >a {display:block; width:100%; height:100%; padding:0 0.5rem; line-height:3.889rem; color:#ffffff; font-weight:400}
#header .gnb_de .depth_01 >li:hover >a,
#header .gnb_de .depth_01 >li.on >a {font-weight:600}

#header .gnb_de .depth_01 >li >a {display:block; width:100%; height:100%; padding:0 0.5rem; line-height:3.889rem; color:#ffffff; font-weight:400}
#header .gnb_de .depth_01 >li:hover >a,
#header .gnb_de .depth_01 >li.on >a {font-weight:600}


#header .gnb_de .depth_02 {position:absolute; left:50%; top:3.889rem; padding:0.77rem 1.61rem; transform:translateX(-50%); border-top:0.278rem solid #2D2D2D; background-color:#ffffff; display:none; border-radius:0 0 1.25rem 1.25rem}
#header .gnb_de .depth_02 li {white-space:nowrap}
#header .gnb_de .depth_02 li:not(:last-child) {margin-bottom:0.111rem}
#header .gnb_de .depth_02 li a {display:block; /*padding:0.2rem 0.4rem; */ font-size:0.833rem; color:#2B2B2B; font-weight:300; line-height:186%; text-align:center}
#header .gnb_de .depth_02 li:hover a {font-weight:500}
#header .gnb_de .depth_02 li:hover a {font-weight:500}
#header .snb_de {position:absolute; right:0; top:50%; transform:translateY(-50%)}
#header .snb_de ul {display:flex}
#header .snb_de li:not(:last-child) {margin-right:1.067rem}
#header .snb_de li a {padding:0.4rem; font-weight:800; font-size:0.833rem; color:#ffffff}

/* scroll header on */
#header.on {/*border-bottom:1px solid #D5D5D5; */ background-color:#ffffff}
#header.on .gnb_de .depth_01 >li >a {color:#2B2B2B}
#header.on .gnb_de .depth_01 >li.on >a {color:#2D2D2D}
#header.on .snb_de li a {color:#555555}

/* pc mouseenter header on */
#header.on_02 {border-bottom:1px solid #D5D5D5; background-color:#ffffff}
#header.on_02 {border-bottom:1px solid #D5D5D5; background-color:#ffffff}
#header.on_02 .gnb_de .depth_01 >li >a {color:#2B2B2B}
#header.on_02 .gnb_de .depth_01 >li.on >a {color:#2D2D2D}
#header.on_02 .snb_de li a {color:#555555}
@media screen and (max-width:1100px) {

    #header .gnb_de,
    #header .snb_de {display:none}
    #header {border-bottom:1px solid rgba(235, 235, 235, 0.2)}
    #header {border-bottom:1px solid rgba(235, 235, 235, 0.2)}
    #header .m_open {display:block; position:absolute; right:0; top:50%; width:1.411rem; height:1.411rem; background:url(/front/images/common/ico_ham_w.svg) no-repeat center/100% auto; transform:translateY(-50%)}
    #header.on .m_open {background:url(/front/images/common/ico_ham_b.svg) no-repeat center/100% auto}
    .menu_mo {position:fixed; width:100%; height:calc(var(--var, 1vh) * 100); right:0; top:0; z-index:101; display:none}
    .menu_mo .bg {position:absolute; left:0; top:0; width:100%; height:100%; background-color:rgba(0,0,0,0.3)}
    .menu_mo .inner {position:absolute; right:0; top:0; width:90%; height:100%; background-color:#ffffff; overflow-y:scroll}
    .menu_mo .inner::after {content:""; position:absolute; left:0; top:3.889rem; width:100%; height:1px; background-color:#EBEBEB}
    .menu_mo .inner >div {width:90%; margin:0 auto}

    .menu_mo .top {display:flex; align-items:center; justify-content:space-between; height:3.889rem}
    .menu_mo .logo {width:5.667rem; height:3rem}
    .menu_mo .logo a {display:block; width:100%; height:100%}
    .menu_mo .m_close {display:block; width:1.411rem; height:1.411rem; background:url(/front/images/common/ico_times_b.svg) no-repeat center/100% auto}

    .menu_mo .inner >div.mid {width:auto; margin:1.429rem}
    .menu_mo .snb_mo ul {display:flex; align-items:center; justify-content:space-between}
    .menu_mo .snb_mo li {width:48%; height:3.571rem}
    .menu_mo .snb_mo a {display:block; width:100%; height:100%; font-size:1.143rem; font-weight:600; text-align:center; line-height:calc(3.571rem - 2px); box-sizing:border-box}
    .menu_mo .snb_mo li:nth-child(1) a {border:1px solid #2D2D2D; background-color:#2D2D2D; color:#ffffff}
    .menu_mo .snb_mo li:nth-child(2) a {border:1px solid #2D2D2D; background-color:#ffffff; color:#2D2D2D}

    .menu_mo .gnb_mo .depth_01 >li {position:relative}
    .menu_mo .gnb_mo .depth_01 >li.on {margin-top:-1px; border-top:1px solid #2D2D2D}
    .menu_mo .gnb_mo .btn_toggle {position:absolute; right:0; top:1.5rem; width:1.411rem; height:1.411rem; transition:transform 0.5s}
    .menu_mo .gnb_mo .depth_01 >li.on .btn_toggle {transform:rotate(180deg)}
    .menu_mo .gnb_mo .btn_toggle svg {width:80%}
    .menu_mo .gnb_mo .btn_toggle .st0 {fill:none; stroke:#CFCFCF; stroke-width:1.5; stroke-linecap:square; stroke-linejoin:round}
    .menu_mo .gnb_mo .depth_01 >li> a {display:block; width:100%; height:4.143rem; border-bottom:1px solid #E8E8E8; box-sizing:border-box; color:#2B2B2B; font-weight:500; font-size:1.286rem; line-height:4.143rem}
    .menu_mo .gnb_mo .depth_01 >li.on > a {font-weight:600}
    .menu_mo .gnb_mo .depth_01 >li> a {display:block; width:100%; height:4.143rem; border-bottom:1px solid #E8E8E8; box-sizing:border-box; color:#2B2B2B; font-weight:500; font-size:1.286rem; line-height:4.143rem}
    .menu_mo .gnb_mo .depth_01 >li.on > a {font-weight:600}
    .menu_mo .gnb_mo .depth_02 {margin-top:1rem; padding-bottom:1rem; border-bottom:1px solid #2D2D2D; display:none}
    .menu_mo .gnb_mo .depth_02 li a {display:block; width:100%; padding:0.4rem 0; color:#666666; font-weight:600; font-size:1.143rem}
}/* sm */
/* --------------------------------header end-------------------------------- */


/* --------------------------------footer-------------------------------- */
#footer{width:100%;padding:3.611rem 0;border-top:1px solid #D5D5D5;font-size:.78rem;color:#5D5D5D}
#footer .inner{display:flex;justify-content:flex-start;flex-direction:column;gap:2.22rem}
#footer .info_wrap{display:flex;justify-content:flex-start;flex-wrap:wrap;gap:12px;flex-direction:column}
#footer .f_info{display:flex;justify-content:flex-start;flex-wrap:wrap;gap:12px}
#footer .f_info li{position:relative;display:flex;justify-content:flex-start;align-items:center;gap:8px;flex-direction:row}
#footer .f_info li::after{content:"";display:block;width:5px;height:5px;background-color:#E4E4E4;border-radius:100%;margin-left:4px}
#footer .f_info li:last-child::after{display:none}
#footer .f_info h5{font-size:.78rem;font-weight:600;color:#5D5D5D;font-family:'outfit','suit',sans-serif;line-height:1}
#footer .f_info p{font-size:.778rem;color:#3A3A3A;word-break:keep-all;line-height:1}
#footer .f_info h6{font-size:.778rem;color:#AFAFAF;font-weight:300;letter-spacing:-.03em;line-height:1}
#footer .fnb ul{display:flex;justify-content:left}
#footer .fnb li:not(:last-child){position:relative;margin-right:1.78rem}
#footer .fnb li:not(:last-child)::after{content:"";position:absolute;right:-.89rem;top:50%;width:1px;height:12px;background-color:#E4E4E4;transform:translateY(-50%)}
#footer .fnb a{display:block;padding:.5rem 0;font-size:.778rem;color:#5D5D5D;font-weight:500;line-height:1}
#footer .fnb a.f_bold{font-weight:700}
#footer h6{display:block;font-weight:400;font-size:.778rem;color:#A3A3A3}

@media screen and (max-width:767px) {
    #footer{padding:0 0 3.611rem 0}
    #footer .inner{width:100%}
    #footer .inner .info_wrap,
    #footer .inner h6{width:92%;margin:0 auto}
    #footer .fnb ul{flex-wrap:wrap;text-align: center;}
    #footer .fnb li {border-bottom:1px solid #F0F0F0}
    #footer .fnb li a{padding:15px 0}
    #footer .fnb ul li:nth-child(1),
    #footer .fnb ul li:nth-child(2),
    #footer .fnb ul li:nth-child(3){width:calc(100%/3)}
    #footer .fnb ul li:nth-child(4),
    #footer .fnb ul li:nth-child(5){width:calc(100%/2)}
    #footer .fnb li:not(:last-child){margin-right:0}
    #footer .fnb li:nth-child(3)::after{display:none}
    #footer .fnb li:nth-child(4)::after{height:100%}
    #footer .fnb li:not(:last-child)::after{background-color:#F0F0F0}
    #footer .info_wrap li:first-child .f_info{flex-direction: column;}
    #footer .info_wrap li:first-child .f_info li::after{display:none}
    #footer .info_wrap li:last-child .f_info:last-child{max-width:360px}
    #footer .info_wrap li:last-child .f_info li:nth-child(2)::after{display:none}
    #footer .fnb a{font-size:1rem}
    #footer .f_info h5,
    #footer .f_info p,
    #footer h6{font-size:.86rem}
}/* sm */
/* --------------------------------footer end-------------------------------- */


/* --------------------------------popup-------------------------------- */
#popup_all .popup {display:table; width:100%; position:fixed; left:0px; top:0px; z-index:101}
#popup_all .bg {width:100%; position:absolute; left:0px; top:0px; background-color:#000; opacity:0.25}
#popup_all .popup,
#popup_all .bg {height:calc(var(--var, 1vh) * 100)}
#popup_all .out_layer_box {display:table-cell; text-align:center; vertical-align:middle}
#popup_all .in_layer_box {display:inline-block; position:relative; box-shadow:0px 15px 35px rgba(0, 0, 0, 0.45); background-color:#ffffff; border-radius:1.11rem}
#popup_all .in_layer_box .title {font-size:1.11rem; font-weight:800; color:#2B2B2B; text-align:center}
#popup_all .btn_close {position:absolute; right:0.833rem; top:0.833rem; width:0.778rem; height:0.778rem; background:url(/front/images/common/ico_times_b.svg) no-repeat center/cover}

@media screen and (max-width:767px) {
    #popup_all .in_layer_box .title {font-size:1.28rem}
    #popup_all .btn_close {width:0.86rem; height:0.86rem; top:1.14rem; right:1.14rem}
}
/* --------------------------------popup end-------------------------------- */


/* --------------------------------checkbox-------------------------------- */
form .ck_wrap {position:relative}
form .ck_wrap input[type="checkbox"] {position:absolute; left:0rem; top:0rem; width:1.11rem; height:1.11rem; z-index:0; appearance:none}
form .ck_wrap input[type="checkbox"] + label {padding-left:1.5rem; vertical-align:top}
form .ck_wrap input[type="checkbox"] + label span {position:absolute; left:0px; top:0px; width:1.111rem; height:1.111rem; cursor:pointer; box-sizing:border-box; border:1px solid #DDDDDD}
form .ck_wrap input[type="checkbox"]:checked + label span {background:url(/front/images/common/ico_ckbox.svg) no-repeat center/auto #2D2D2D; border:1px solid #2D2D2D}
/* --------------------------------checkbox end-------------------------------- */



/* --------------------------------loading -------------------------------- */
#loading{width:100%;height:calc(var(--var,1vh) * 100);position:fixed;top:0;left:0;z-index:1000;display:flex;justify-content:center;align-items:center;background-color:rgba(0,0,0,0.25)}
#loading .three-bounce{text-align:center;font-size:26px;position:relative;top:-26px;width:80px}
.three-bounce>div{display:inline-block;width:18px;height:18px;border-radius:100%;background-color:#fff;-webkit-animation:bouncedelay 1.4s infinite ease-in-out both;animation:bouncedelay 1.4s infinite ease-in-out both}
.three-bounce .one{-webkit-animation-delay:-.32s;animation-delay:-.32s}
.three-bounce .two{-webkit-animation-delay:-.16s;animation-delay:-.16s}
@-webkit-keyframes bouncedelay {
    0%,80%,100%{-webkit-transform:scale(0)}
    40%{-webkit-transform:scale(1)}
}
@keyframes bouncedelay {
    0%,80%,100%{-webkit-transform:scale(0);transform:scale(0)}
    40%{transform:scale(1);-webkit-transform:scale(1)}
}

/* --------------------------------loading end-------------------------------- */