@charset "utf-8";

/* basic style */
* {box-sizing: border-box;}
html {width: 100%;height: 100%;}
body {overflow: inherit;width: 100%;height: 100%;}
body.on {overflow: hidden;}
#wrap {width: 100%;height: 100%;}
.layout{position:relative;margin: 0 auto;max-width: 1280px;}
.no-data {display: block !important;font-size: 16px !important;width: 100% !important;padding: 100px 0 !important;text-align: center;margin: 0 !important;}
.page-title{text-align:left;font-size:30px;}
.blind{position: absolute;top:-9999999px;left:-999999px;}
.required{color:#e32a2a;}


.overlay{display:none;position: fixed;top:0;left:0;width:100%;height:100%;background: rgba(0,0,0,0.3);z-index:1000;line-height: normal;}
.overlay2{display:none;position: fixed;top:0;left:0;width:100%;height:100%;background: rgba(0,0,0,0.3);z-index:100;line-height: normal;}



.not-post{padding:50px 0;text-align: center;line-height: normal !important;}
.not-post figure{}
.not-post figure figcaption{display:block;font-size: 19px;font-weight: 600;letter-spacing: 0.19px;color: #202020;}
.not-post figure figcaption span{display: block;margin-top:5px; font-size: 15px;font-weight: normal;letter-spacing: 0.15px;text-align: center;color: #999;}

.not-find{padding:50px 0;text-align: center;line-height: normal !important;}
.not-find figure{}
.not-find figure figcaption{display:block;font-size: 19px;font-weight: 600;letter-spacing: 0.19px;color: #202020;}
.not-find figure figcaption span{display: block;margin-top:5px; font-size: 15px;font-weight: normal;letter-spacing: 0.15px;text-align: center;color: #999;}


/* dl style */
.dl-type1{}
.dl-type1 dt{position:relative;clear:left;float:left;}
.dl-type1 dd{position:relative;width:100%;}
.dl-type1 dd:after {content: "";display: table;clear: both;}


/* text style */
.txt-left {text-align: left !important;}
.txt-center {text-align: center !important;}
.txt-right {text-align: right !important;}



.ios-chk {display:inline-block;position: relative;cursor: pointer;}
.ios-chk input[type="checkbox"]{position: absolute;display: inline-block;opacity: 0;}
.ios-chk label {position:relative !important;top:inherit !important; left:inherit !important;cursor: pointer;display: inline-block;padding-left:60px;color: #555;font-size: 15px;line-height: 27px;vertical-align: middle;font-weight: 400;}
.apple-switch::before {content:"";-moz-transition: all 0.5s;-webkit-transition: all 0.5s;-ms-transition: all 0.5s;-o-transition: all 0.5s;transition: all 0.5s;position: absolute;left:0;vertical-align: middle;-webkit-appearance: none;outline: none;width: 50px;height: 25px;background-color: #fff;border: 1px solid #D9DADC;border-radius: 50px;box-shadow: inset -20px 0 0 0 #fff;cursor: pointer;}
.apple-switch:after {content: "";-moz-transition: all 0.5s;-webkit-transition: all 0.5s;-ms-transition: all 0.5s;-o-transition: all 0.5s;transition: all 0.5s;position: absolute;top: 3px;left: 1px;background: transparent;width: 22px;height: 22px;border-radius: 50%;box-shadow: 2px 4px 6px rgba(0, 0, 0, 0.2);}
.ios-chk input[type="checkbox"]:checked + .apple-switch:before {box-shadow: inset 26px 0 0 0 #222;border-color: #222;}
.ios-chk input[type="checkbox"]:checked + .apple-switch:after {left: 20px;box-shadow: -2px 4px 3px rgba(0, 0, 0, 0.05);}

.filebox{position:relative;font-size:0;}
.filebox input[type="file"] {position: absolute;width: 0;height: 0;padding: 0;overflow: hidden;border: 0;}
.filebox label {position:relative ;display: inline-block;margin-right:5px;width:127px;color: #fff;font-size:14px;vertical-align: middle;cursor: pointer;border: 1px solid #383838;border-radius: 5px;line-height: 48px;text-align: center;background: #383838;margin-left: 10px;}
.filebox label:hover { background: #000; color: #fff; }
.filebox .upload-name {display: inline-block;width: calc(100% - 260px);height: 50px;font-size: 16px;color: #595757;padding: 0 40px;vertical-align: middle;background: #fafafa url(/_public/images2/icon/link_icon.svg) no-repeat;background-size: 30px 30px;border: 1px solid #bebebe;border-radius: 5px;background-position: 10px 50%;}


.checkbox-type1{position: relative;}
.checkbox-type1 input[type="checkbox"] {position: absolute;display: inline-block;opacity: 0;}
.checkbox-type1 label{position: relative;display: block;padding-left: 34px;  font-size: 16px;font-weight: 500;letter-spacing: -0.32px;color: #121212;cursor: pointer;}
.checkbox-type1 label:before{content: "";position: absolute;top:-1px;left:0;display: block;width:24px;height:24px;background: url(/_public/images2/icon/ico_chk.svg) no-repeat;background-size: cover;}
.checkbox-type1 input[type="checkbox"]:checked + label:before{background: url(/_public/images2/icon/ico_chk_on.svg) no-repeat;background-size: cover;}



.radio-type1{position: relative;}
.radio-type1 input[type="radio"] {position: absolute;display: inline-block;opacity: 0;}
.radio-type1 label{position: relative;display:flex;align-items:center;justify-content:center;cursor: pointer;font-size: 15px;font-weight: 600;color: #121212;transition: all 0.4s;gap:5px;height:55px;  border-radius: 10px;border: solid 1px #d5d5d5;background-color: #fff;}
.radio-type1 label:after{content: "";position: relative;display:none;width:16px;height:16px;background: url(/_public/images2/icon/ico_chk2.svg) no-repeat;background-size: cover;transition: all 0.4s;}
.radio-type1 input[type="radio"]:checked + label{border-color: #0029f4;background: #eef1ff;color:#0029f4;font-weight: bold;}
.radio-type1 input[type="radio"]:checked + label:after{display: block;}

/* ----------------------------------------------
 * Generated by Animista on 2025-3-14 23:55:31
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info.
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation slide-bottom
 * ----------------------------------------
 */

@keyframes slide-bottom {
    0% {
        opacity: 0;
        transform: translateY(-100px);
    }
    100% {
        opacity: 1;
        transform: translateY(0px);
    }
}




@keyframes dropHeader {
    0% {
        top: -5rem;
    }
    100% {
        top: 0;
    }
}


@keyframes dropHeader2 {
    0% {
        top: -5rem;
    }
    100% {
        top: 81px;
    }
}

#container{padding-top: 52px;}

header{position: absolute;top:0;left:0;width:100%;z-index: 100;transition: all 0.3s;background: #fff;}
header .h-cont{position:relative;margin:0 auto;max-width:1280px;display:flex;align-items:center;justify-content:space-between;height: 52px;}
header .cont1{display: flex;align-items: center;gap:60px;}
header .cont1 .open-gnb{display: inline-block;width:40px;height:40px;background: url(/img/common/toggle_navi.svg) no-repeat;background-size: cover;font-size:0;}
header .cont1 .open-gnb.on{background: url(/img/common/toggle_navi2.svg) no-repeat;background-size: cover;}

header .logo{display: inline-block;position: absolute;left:50%;transform: translateX(-50%);}
header .logo img{display:block;}
header .logo img.logo_b{display:block;}
header .logo img.logo_w{display:none;}
header .cont2{display: flex;align-items: center;gap:38px;}
header .cont2 a{display: inline-block;font-size: 14px;font-weight: normal;line-height: 1;color: #1b63d9;}
header .cont2 select{font-size: 14px;height:16px;font-weight: normal;line-height: 1;color: #5e5e5e;padding-left: 23px;background: url(/img/common/global.svg) 0% 50% no-repeat;background-size: 16px 16px;transition: all 0.4s;}
header .cont2 select option{background: #000;color:#fff;}
header .cont2 .lan-box{display: flex; padding: 3px;border-radius: 999px;border: solid 1px #d2d2d7;}
header .cont2 .lan-box a{display: flex;align-items: center;justify-content: center;width:30px;height: 20px;border-radius: 999px; font-size: 11px;font-weight: 500;letter-spacing: 0.22px;color: #6e6e73;}
header .cont2 .lan-box a.on{font-weight: 600;color: #fff;background: #0e0e0e;}

header .gnb{display:none;position: fixed;left:0;top:52px;width:100%;height:372px;background: #fff;z-index: 9999;}
header .gnb .menu-wrap{height:100%;margin:0 auto;max-width: 1280px;padding:56px 0 80px;}
header .gnb .menu-wrap .global-select{margin-top:16px;display: none;width:100%;font-size: 13px;height:44px;font-weight: normal;line-height: 1;color: #5e5e5e;padding-left: 23px;background: url(/img/common/global.svg) 0% 50% no-repeat;background-size: 16px 16px;transition: all 0.4s;}
header .gnb .menu-wrap .global-select option{background: #000;color:#fff;}
header .gnb .lan-box{margin-top:16px;display: none; padding: 3px;border-radius: 999px;border: solid 1px #d2d2d7;width:68px;}
header .gnb .lan-box a{display: flex;align-items: center;justify-content: center;width:30px;height: 20px;border-radius: 999px; font-size: 11px;font-weight: 500;letter-spacing: 0.22px;color: #6e6e73;}
header .gnb .lan-box a.on{font-weight: 600;color: #fff;background: #0e0e0e;}


header .gnb .menu-wrap ul{position:relative;height:100%;}
header .gnb .menu-wrap ul li{}
header .gnb .menu-wrap ul li + li{margin-top:18px;}
header .gnb .menu-wrap ul li > a{display: block;font-size: 28px;font-weight: 600;line-height: 1.25;color: #86868b;}
header .gnb .menu-wrap ul li > a span{}
header .gnb .menu-wrap ul li:hover > a,
header .gnb .menu-wrap ul li.on > a{color:#0e0e0e;}
header .gnb .menu-wrap ul li .submenu{position: absolute;top:0;right:0;width:calc(100% - 320px);height:100%;border-left:1px solid #d2d2d7;display: none;z-index: 1;padding-left: 96px;}
header .gnb .menu-wrap ul li .submenu .case1{display: flex;gap:96px;}
header .gnb .menu-wrap ul li .submenu .case1 > div{}
header .gnb .menu-wrap ul li .submenu .case1 > div a{display: flex;flex-direction: column;align-items: center;gap:8px;}
header .gnb .menu-wrap ul li .submenu .case1 > div a em{display: block;font-size: 32px;font-weight: 600;line-height: 1.25;letter-spacing: -0.1px;color: #0e0e0e;}
header .gnb .menu-wrap ul li .submenu .case1 > div a span{display: block;font-size: 17px;font-weight: normal;line-height: 1.55;color: #1b63d9;}
header .gnb .menu-wrap ul li .submenu .case1 > div a figure{display: flex;align-items: center;}
header .gnb .menu-wrap ul li .submenu .case1 > div a figure img{display: block;transition: all 0.3s;}
header .gnb .menu-wrap ul li .submenu .case2{height: 100%;}
header .gnb .menu-wrap ul li .submenu .case2 strong{display: block;font-size: 14px;font-weight: normal;line-height: 1.45;color: #86868b;}
header .gnb .menu-wrap ul li .submenu .case2 a{display:block;margin-top:16px;font-size: 24px;font-weight: normal;line-height: 1.5;letter-spacing: -0.05px;color: #0e0e0e;}
header .gnb .menu-wrap ul li .submenu .case2 a:hover{font-weight: bold;}
header .gnb .menu-wrap ul li .submenu .case3{display: flex;height: 100%;gap:20px;}
header .gnb .menu-wrap ul li .submenu .case3 a{flex:1;display: block;height:100%;overflow: hidden;border-radius: 12px;padding: 24px;font-size: 17px;font-weight: 500;line-height: 1;color: #fff;}
header .gnb .menu-wrap ul li .submenu .case3 a:nth-child(1){background: url(/img/common/menu_brand.svg) 50% 50% no-repeat;background-size: cover;}
header .gnb .menu-wrap ul li .submenu .case3 a:nth-child(2){background: url(/img/common/menu_company.svg) 50% 50% no-repeat;background-size: cover;}

header .gnb .menu-wrap ul li.on .submenu{display: block;}
header .gnb .menu-wrap ul li .submenu .case1 > div a:hover figure img{transform: scale(1.1);}

header.black{ background-color:#161617;}
header.black .logo img.logo_b{display:none;}
header.black .logo img.logo_w{display:block;}
header.black .cont1 .open-gnb{background: url(/img/common/toggle_navi_w.svg) no-repeat;background-size: cover;}
header.black .cont2 select{color: rgba(255, 255, 255, 0.72);background: url(/img/common/global_w.svg) 0% 50% no-repeat;}
header.black .cont2 .lan-box{}
header.black .cont2 .lan-box a.on{background:#d2d2d7;color:#161617;}
header.black .gnb .menu-wrap ul li:hover > a,
header.black .gnb .menu-wrap ul li.on > a{color: #fff;}
header.black .gnb .menu-wrap ul li .submenu .case1 > div a em{color:#fff;}
header.black .gnb .menu-wrap ul li .submenu .case2 a{color: #fff;}
header.black .gnb{background: #161617;}
header.black .gnb .menu-wrap .lan-box a.on{background:#d2d2d7;color:#161617;}


header.drop{position:fixed;background: #fff;animation: dropHeader 0.3s;}
header.black.drop{position:fixed;background: #161617;}

footer{background:#f5f5f7;padding:40px;}
footer .f-cont{display: flex;padding:32px 0;border-top:1px solid #d2d2d7;}
footer .f-cont > div{flex:1;}
footer .f-cont .g-menu{display:flex;flex-direction: column;gap:10px;margin-right:20px;}
footer .f-cont .g-menu a{display: block;font-size: 30px;font-weight: bold;color: #1d1d1e;line-height: 1;}
footer .f-cont .f-menu{}
footer .f-cont .f-menu strong{display: block;font-size: 14px;font-weight: 600;line-height: 1.45;color: #0e0e0e;}
footer .f-cont .f-menu a{margin-top:12px;display: block;font-size: 14px;font-weight: normal;line-height: 1.45;color: #5e5e5e;}
footer .f-cont .catalog{display: flex;justify-content: flex-end;align-items: flex-start;}
footer .f-cont .btn-down{position:relative;padding: 15px 25px 15px 49px;border-radius: 999px;border: solid 1px #d2d2d7;background-color: #fff;font-size: 17px;font-weight: 500;line-height: 1;color: #5e5e5e;}
footer .f-cont .btn-down:after{content: "";position: absolute;top:16px;left: 25px;display: block;width: 18px;height: 18px;background: url(/img/common/dwn_arrw.svg) no-repeat;background-size: cover;}
footer .info-txt{font-size: 14px;font-weight: normal;line-height: 1.45;color: #6e6e73;}
footer .info-txt a{display: inline-block;color: #1b63d9;}
footer .f-cont2{margin-top:16px;border-top:1px solid #d2d2d7;padding-top: 16px;}
footer .f-cont2 .flex-box{display: flex;justify-content: space-between;}
footer .f-cont2 .flex-box .col1{display: flex;gap:20px;}
footer .f-cont2 .flex-box .col1 copyright{font-size: 14px;font-weight: normal;line-height: 1.5;color: #6e6e73;}
footer .f-cont2 .flex-box .col1 .f-menu a{font-size: 14px;font-weight: normal;line-height: 1.5;color: #5e5e5e;}
footer .f-cont2 .flex-box .col2{}
footer .f-cont2 .flex-box .col2 span{display:inline-block;font-size: 14px;font-weight: normal;line-height: 1.5;color: #5e5e5e;}
footer .f-cont2 address{display: block;margin-top:6px;font-size: 14px;font-weight: normal;line-height: 1.5;color: #6e6e73;}
footer .global-txt{display: none;margin-top:8px;font-size: 12px;font-weight: normal;line-height: 1.5;color: #6e6e73;}

footer.black{background: #0e0e0e;}
footer.black .f-cont{border-color: rgba(255, 255, 255, 0.12);}
footer.black .f-cont .f-menu strong{color:#fff;}
footer.black .f-cont .f-menu a{color: rgba(255, 255, 255, 0.72);}
footer.black .f-cont .btn-down{background: #0e0e0e;  border-color:#86868b;color: rgba(255, 255, 255, 0.72);}
footer.black .f-cont .btn-down:after{background: url(/img/common/dwn_arrw2.svg) no-repeat;background-size: cover;}
footer.black .info-txt{color:#86868b;}
footer.black .info-txt a{color:#3d7adf;}
footer.black .f-cont2{border-color: rgba(255, 255, 255, 0.12);}
footer.black .f-cont2 .flex-box .col1 copyright{color:#86868b;}
footer.black .f-cont2 .flex-box .col1 .f-menu a{color: rgba(255, 255, 255, 0.72);}
footer.black .f-cont2 .flex-box .col2 span{ color: rgba(255, 255, 255, 0.72);}
footer.black .f-cont2 address{color: #86868b;}
footer.black .global-txt{color: rgba(255, 255, 255, 0.72);}


#contact{background: #f5f5f7;padding:96px 0;}
#contact .inner{max-width:778px;margin:0 auto;}
#contact h2{text-align: center;font-size: 48px;font-weight: 600;line-height: 1.15;letter-spacing: -0.24px;color: #0e0e0e;}
#contact p{margin-top:20px;font-size: 19px;font-weight: normal;line-height: 1.6;text-align: center;color: #5e5e5e;}
#contact ul{margin:48px auto 0;max-width:500px;display: flex;padding: 32px 64px;border-radius: 28px;background-color: #0e0e0e;}
#contact ul li{flex:1;text-align: center;}
#contact ul li em{display: block;font-size: 17px;font-weight: normal;line-height: 1.55;color: rgba(255, 255, 255, 0.72);}
#contact ul li span{display: block;margin-top:6px;font-size: 32px;font-weight: 600;line-height: 1.25;letter-spacing: -0.1px;color: #fff;}



#contact2{background: #f5f5f7;padding:56px 0;}
#contact2 .inner{max-width:500px;margin:0 auto;}
#contact2 h3{text-align: center;font-size: 28px;font-weight: 600;line-height: 1.4;letter-spacing: -0.08px;color: #0e0e0e;}
#contact2 ul{margin-top:24px;display: flex;padding: 20px;border-radius: 28px;background-color: #0e0e0e;}
#contact2 ul li{flex:1;text-align: center;}
#contact2 ul li em{display: block; font-size: 14px;font-weight: normal;line-height: 1.45;color: rgba(255, 255, 255, 0.72);}
#contact2 ul li span{display: block;margin-top:4px;font-size: 24px;font-weight: 600;line-height: 1.4;color: #fff;}



@media all and (max-width:1280px) {
    header .h-cont{padding:0 20px;}
    header .logo{width:169px;}
    header .gnb .menu-wrap{padding: 56px 20px 80px;}

    header .gnb .menu-wrap ul li > a{font-size:26px;}
    header .gnb .menu-wrap ul li .submenu{padding-left: 40px;width:calc(100% - 230px);}

    footer .f-cont .btn-down{font-size:16px;}
}

@media all and (max-width:1024px) {
    #container {padding-top: 48px;}

    @keyframes dropHeader2 {
        0% {
            top: -5rem;
        }
        100% {
            top: 71px;
        }
    }

    header .h-cont{height: 48px;}
    header .cont2 select{display: none;}
    header .cont2 .lan-box{display: none;}
    header .cont2 a{font-size:13px;}
    header .gnb{top:48px;height: calc(100% - 48px);overflow-y: auto;}
    header .gnb .menu-wrap{padding:8px 20px 32px;}
    header .gnb .menu-wrap .global-select{display: block;}
    header .gnb .menu-wrap .lan-box{display: flex;}
    header .gnb .menu-wrap ul{padding:0;height:auto;}
    header .gnb .menu-wrap ul:before{display: none;}
    header .gnb .menu-wrap ul li:hover > a,
    header .gnb .menu-wrap ul li.on > a{color:#1d1d1e;}
    header .gnb .menu-wrap ul li{border-bottom:1px solid #d2d2d7;}
    header .gnb .menu-wrap ul li > a{position:relative;padding:0;line-height: 64px;font-size: 28px;font-weight: 600;letter-spacing: -0.14px;color: #0e0e0e;}
    header .gnb .menu-wrap ul li > a:after{content: "";position: absolute;top:19px;right:0;background: url(/img/common/m_toggle_icon1.svg) no-repeat;background-size: cover;display: block;width:24px;height:24px;}
    header .gnb .menu-wrap ul li > a.on:after{background: url(/img/common/m_toggle_icon2.svg) no-repeat;background-size: cover;}
    header .gnb .menu-wrap ul li + li{margin-top:0;}
    header .gnb .menu-wrap ul li .submenu{position: relative;width:100%;padding:0 0 24px;border:0;}
    header .gnb .menu-wrap ul li .submenu .case1{gap:16px;}
    header .gnb .menu-wrap ul li .submenu .case1 > div{flex: 1;}
    header .gnb .menu-wrap ul li .submenu .case1 > div a em{font-size:20px;line-height: 1.35;}
    header .gnb .menu-wrap ul li .submenu .case1 > div a span{font-size:15px;line-height: 1.55;}
    header .gnb .menu-wrap ul li .submenu .case2{}
    header .gnb .menu-wrap ul li .submenu .case2 strong{font-size:13px;}
    header .gnb .menu-wrap ul li .submenu .case2 a{margin-top:18px;font-size: 17px;font-weight: normal;line-height: 1.55;}
    header .gnb .menu-wrap ul li .submenu .case3{flex-direction: column;gap:16px;}
    header .gnb .menu-wrap ul li .submenu .case3 a{height: 197px;padding:20px;font-size: 16px;flex: none;}

    header.black .gnb .menu-wrap ul li > a{color:#fff;}
    header.black .gnb .menu-wrap .global-select{color: rgba(255, 255, 255, 0.72);background: url(/img/common/global_w.svg) 0% 50% no-repeat;}


    footer{padding:32px 20px 40px;}
    footer .f-cont{flex-wrap: wrap;gap:24px 0;padding:0;border-top:0;}
    footer .f-cont > div{flex:initial;}
    footer .f-cont .f-menu{width:50%;}
    footer .f-cont .f-menu strong{font-size:13px;}
    footer .f-cont .f-menu a{margin-top:10px;font-size:13px;}
    footer .f-cont .catalog{width:100%;}
    footer .f-cont .btn-down{width:100%;padding:14px;display: flex;justify-content: center;gap:8px;flex-direction: row-reverse;}
    footer .f-cont .btn-down:after{position: relative;top:0;left:0;}
    footer .info-txt{margin-top:24px;font-size: 13px;}
    footer .f-cont2{margin-top:24px;padding-top:0;border-top:0;}
    footer .f-cont2 .flex-box .col1{flex-direction: column-reverse;gap:8px;}
    footer .f-cont2 .flex-box .col1 copyright{font-size:12px;}
    footer .f-cont2 .flex-box .col1 .f-menu a{font-size: 12px;}
    footer .f-cont2 .flex-box .col2{display: none;}
    footer .f-cont2 address{font-size:12px;margin-top:8px;}
    footer .global-txt{display: block;}

    #contact{padding:56px 20px;}
    #contact h2{font-size: 24px;line-height: 1.3;letter-spacing: -0.07px;}
    #contact p{margin-top:12px;font-size: 15px;font-weight: normal;line-height: 1.55;}
    #contact ul{margin-top:24px;padding:24px;flex-direction: column;gap:20px;}
    #contact ul li{flex: none;width:100%;}
    #contact ul li em{font-size: 13px;line-height: 1.45;}
    #contact ul li span{margin-top:4px;font-size: 20px;font-weight: 600;line-height: 1.35;}


    #contact2{padding:24px 20px;}
    #contact2 h3{font-size:20px;}
    #contact2 ul li em{font-size:13px;}
    #contact2 ul li span{font-size:15px;}
}


@media all and (max-width:768px) {
    header .gnb .menu-wrap ul li .submenu .case1 > div a figure img{max-height: 68px;}
}

@media all and (max-width:460px) {
}