@charset "utf-8";
/* ────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────
    Common
──────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────── */
body{height:auto;}
/* ────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────
    Contents
──────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────── */
/* 가이드 */
.index_guidebanner_wrap{display:flex;justify-content:space-between;padding:0 60px;}
.index_guidebanner_wrap a{display:block;width:49.17%;}
.index_guidebanner_wrap a img{max-width:100%;height:auto;}
/* Guide popup */
#userguide_wrap{overflow:auto;position:fixed;left:0;top:0;width:100%;height:100%;-ms-overflow-style:none;scrollbar-width:none;overflow-x:hidden;overflow-y:scroll;overflow-y:overlay;z-index:9999;}
#userguide_wrap > .inner{position:relative;left:0;top:0;margin:0 auto;padding:20px 0 80px;width:93.75%;max-width:1400px;z-index:5;}
#userguide_wrap .guide_user_cont{position:relative;left:0;top:0;}
#userguide_wrap .guide_user_cont .tab{display:flex;position:absolute;left:50%;top:160px;margin-left:-200px;width:400px;z-index:5;}
#userguide_wrap .guide_user_cont .tab a{overflow:hidden;display:block;height:80px;text-indent:-1000em;}
#userguide_wrap .guide_user_cont .tab a.btn_1{width:54%;}
#userguide_wrap .guide_user_cont .tab a.btn_2{width:46%;}
#userguide_wrap .guide_user_cont .cont{}
#userguide_wrap .guide_user_cont .cont > div{display:none;}
#userguide_wrap .guide_user_cont .cont .active{display:block;}
#userguide_wrap .guide_user_cont .cont .guide_user_1{}
#userguide_wrap .guide_user_cont .cont .guide_user_2{}
#userguide_wrap .guide_user_cont .cont .img{}
#userguide_wrap .guide_user_cont .cont .img img{max-width:100%;height:auto;}
#userguide_wrap .guide_user_cont .cont a.btn_3{overflow:hidden;position:absolute;left:50%;bottom:90px;margin-left:-200px;width:400px;height:110px;text-indent:-1000em;z-index:5;}
#userguide_wrap > .bg{cursor:pointer;position:fixed;left:0;top:0;width:100%;height:100%;background:#000;opacity:.95;}
#userguide_wrap > .btn_close{cursor:pointer;overflow:hidden;display:block;position:fixed;left:50%;top:30px;margin-left:650px;width:40px;height:40px;background:url("../images/common/icon1.png") no-repeat center center #fff;background-size:100% auto;border-radius:50%;box-shadow:3px 3px 5px rgba(0, 0, 0, .2);z-index:10;}
/* ----------------------------------------------------------------------------------------------------------------
-- 1500 --------------------------------------------------------------------------------------------------------- */
@media all and (max-width:1500px){
    .index_guidebanner_wrap{padding:0 4vw;}
    #userguide_wrap > .inner{padding:1.3333333333333vw 0 5.3333333333333vw;max-width:93.333333333333vw;}
    #userguide_wrap .guide_user_cont .tab{top:10.666666666667vw;margin-left:-13.333333333333vw;width:26.666666666667vw;}
    #userguide_wrap .guide_user_cont .tab a{height:5.3333333333333vw;}
    #userguide_wrap .guide_user_cont .cont a.btn_3{bottom:6vw;margin-left:-13.333333333333vw;width:26.666666666667vw;height:7.3333333333333vw;}
    #userguide_wrap > .btn_close{top:2vw;margin-left:43.333333333333vw;width:2.6666666666667vw;height:2.6666666666667vw;box-shadow:0.2vw 0.2vw 0.33333333333333vw rgba(0, 0, 0, .2);}
}
/* ----------------------------------------------------------------------------------------------------------------
-- 800 --------------------------------------------------------------------------------------------------------- */
@media all and (max-width:800px){
    .index_guidebanner_wrap{display:block;padding:0 0 10vw;}
    .index_guidebanner_wrap a{width:auto;}
    .index_guidebanner_wrap a + a{margin-top:1.5vw;}
    #userguide_wrap .guide_user_cont .tab{top:160px;margin-left:-135px;width:270px;}
    #userguide_wrap .guide_user_cont .tab a{height:70px;}
    #userguide_wrap > .btn_close{margin-left:312px;width:50px;height:50px;}
    #userguide_wrap .guide_user_cont .cont a.btn_3{bottom:70px;margin-left:-140px;width:280px;height:80px;}
    /*  */
    #userguide_wrap .guide_user_cont .tab{top:20vw;margin-left:-16.875vw;width:33.75vw;}
    #userguide_wrap .guide_user_cont .tab a{height:8.75vw;}
    #userguide_wrap > .btn_close{margin-left:39vw;width:6.25vw;height:6.25vw;}
    #userguide_wrap .guide_user_cont .cont a.btn_3{bottom:8.75vw;margin-left:-17.5vw;width:35vw;height:10vw;}
}