@charset "euc-kr";


/* font */
@import url('https://webfontworld.github.io/pretendard/Pretendard.css');

@font-face {
    font-family: "GmarketSans";
    src: url("https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansLight.woff")
        format("woff");
    font-weight: 200;
    font-style: normal;
}

@font-face {
    font-family: "GmarketSans";
    src: url("https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff")
        format("woff");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "GmarketSans";
    src: url("https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansBold.woff")
        format("woff");
    font-weight: bold;
    font-style: normal;
}


/*reset*/
img { border:0; }
button,html [type=button],[type=reset],[type=submit] { -webkit-appearance:none; }
button,select { text-transform:none; }
button,input { overflow:hidden; }
button:focus { outline:none; }
a,div { -webkit-tap-highlight-color:transparent; }
.web { min-width: 1300px; }

/* common */
#only1_wrapper{overflow:visible;}
#only1_wrapper .inner {width:1200px; margin:0 auto;} 
#only1_wrapper > div  > img{position:relative; left:50%; transform:translateX(-50%);}

/* visual */
.visual{position:relative; overflow:hidden;}
.visual .inner{position:absolute; top:0; left:50%; transform:translateX(-50%); height:100%;}
.visual .inner .test_paper{position:absolute; top:700px; left:0; width:1200px; height:920px;}
.visual .inner .test_paper div{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);}
.visual .inner .test_paper .paper1{z-index:30;}
.visual .inner .test_paper .paper2{z-index:20;}
.visual .inner .test_paper .paper3{z-index:10;}
.visual .inner .post_it{position:absolute; bottom:246px; left:50%; transform:translateX(-50%);}

/* tab contents */
.tab_contents{position:relative; text-align: center;}
.tab_contents .inner{padding:180px 0 100px;}
.tab_contents .tab{display:flex; position:sticky; top:0; left:0; width:1200px; margin:0 auto; height:100px; z-index:100;}
.tab_contents .tab button{flex:1; background:#CACACA; border:1px solid #999; font-weight:800; font-size:32px; color:#999;}
.tab_contents .tab button.active{background:#008858; border: 1px solid #008858; font-weight:700; color:#fff;}
.tab_contents .tit{font-family:"GmarketSans"; font-size:60px; color:#222; line-height:70px;}
.tab_contents .tit strong{font-weight:bold;}
.tab_contents .bg{height:100px; background:#E0FFE2;}

/* tab contents - plan */
.plan{margin-top:-100px; background:#E0FFE2;}
.plan .inner .tit strong{color:#008858;}
.plan .inner .txt{margin-top:24px;}
.plan .inner .step{position:relative; margin-top:19px;}
.plan .inner .step ul{position:absolute; top:0; left:0;}
.plan .inner .step ul li:not(:first-child){margin-top:12px;}

/* tab contents - dwn */
.dwn{background:#FFF5D4;}
.dwn .inner .tit strong{color:#ED1941;}
.dwn .inner .dwn_wrap{display:flex; flex-wrap:wrap; gap:15px 30px; margin-top:55px;}
.dwn .inner .dwn_wrap .folder{margin:-6px -10px 0 -10px;}
.dwn .inner .dwn_wrap .box{width:380px; height:448px; padding:49px 30px; background:#fff; border-radius:12px; box-shadow:0 4px 10px 0 rgba(0,0,0,.25);}
.dwn .inner .dwn_wrap .box *{color:#222;}
.dwn .inner .dwn_wrap .box .grade{width:140px; height:60px; margin:0 auto; background:#222; border-radius:5px; font-weight:900; font-size:40px; color:#fff; line-height:60px;}
.dwn .inner .dwn_wrap .box .subject{margin-top:3px; font-weight:700; font-size:36px;}
.dwn .inner .dwn_wrap .box .txt{margin-top:9px; font-size:26px;}
.dwn .inner .dwn_wrap .box .btn{display:flex; justify-content:center; gap:10px; margin-top:25px;}
.dwn .inner .dwn_wrap .box .btn button{background:none; border-radius:20px; box-shadow:0 3px 6px 0 rgba(0,0,0,.25);}

/* tab contents - system */
.system{background: #FFE6F8;}
#only1_wrapper .system .inner{width:1218px;}
.system .inner > .tit strong{color:#ed1941;}
.system .inner > .txt{margin-top:12px; font-weight:400; font-size:24px; color:#000; line-height:34px;}
.system .inner > .txt strong{font-weight:500;}
.system .inner .slide_wrap{display:flex; gap:20px 0; justify-content:center; flex-wrap:wrap; margin-top:53px;}
.system .inner .slide_wrap .box{position:relative; margin:0 -6px;}
.system .inner .slide_wrap .box:nth-child(1):before,
.system .inner .slide_wrap .box:nth-child(2):before{content:""; display:block; position:absolute; top:195px; left:14px; width:120px; height:120px; background:url(images/system_badge.png) 0 0 no-repeat; z-index:10;}
.system .inner .slide_wrap .box:nth-child(6){width:420px;}
.system .inner .slide_wrap .box > img{mix-blend-mode:luminosity;}
.system .inner .slide_wrap .box .con{display:flex; align-items:center; flex-direction:column; position:absolute; top:0; left:0; width:100%; height:100%; padding-top:43px; margin-left:-9px;}
.system .inner .slide_wrap .box .con .tit{display:flex; margin-bottom:25px;}
.system .inner .slide_wrap .box:nth-child(5) .con .tit,
.system .inner .slide_wrap .box:nth-child(7) .con .tit{align-items:center; height:88px; margin-bottom:25px;}
.system .inner .slide_wrap .box .con .tit p{padding:10px 15px 4px; background:#222; border-radius:5px; font-family:"GmarketSans"; font-weight:bold; font-size:30px; color:#fff; line-height:36px;}
.system .inner .slide_wrap .box .con .txt2{font-weight:400; font-size:22px; color:#000; line-height:28px;}
.system .inner .slide_wrap .box .con .txt2 strong{font-weight:700;}
.system .inner .slide_wrap .box .con .swiper-container{width:342px; margin:36px 0 27px;}

/* notcie */
.notice {
    position: relative;
    padding-bottom:125px;
    text-align: center;
}

.notice .btn {
    display: block;
    position: absolute;
    top: 347px;
    left: 50%;
    transform: translateX(-50%);
    width: 570px;
    height: 110px;
    text-indent: -9999px;
}

.notice .btn::after {
    position: absolute;
    content: '';
    background: url(images/btn_cursor.png) no-repeat 0 0/contain;
    width: 15%;
    height: 69%;
    bottom: -17%;
    right: -5.5%;
    animation: blink-effect 0.5s ease-in-out infinite alternate;
}

/* layer popup */
.layer_popup{display:none; position:fixed !important; top:0; left:0; width:100%; height:100%; z-index:999;}
.layer_popup .layer_dim{position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(0, 0, 0, 0.3);}
.layer_popup .layer_box{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); background:#fff; width: 550px; padding:95px 0 80px; text-align:center; box-shadow: 0 11px 20px 0 rgba(0, 0, 0, 0.15); border-radius:23px;}
.layer_popup .layer_box p{font-weight:500; font-size:23px; color:#000;}
.layer_popup .layer_box p span{color:#f71919;}
.layer_popup .layer_box .insert{display:flex; gap:5px; justify-content:center; align-items:center; margin:35px 0 40px;}
.layer_popup .layer_box .insert input{width:121px; height: 56px; padding-left:15px; background:#f5f5f5; border-radius:6px; border:1px solid #a0a0a0; font-weight:500; font-size:20px; color:#000;}
.layer_popup .layer_box .insert input::placeholder{color:#b0b0b0;}
.layer_popup .layer_close{position:absolute; top:24px; right:27px; background:none;}

/* keyframes */
@keyframes mouse {
    0% {
        transform: translate(0);
    }

    100% {
        transform: translate(20%, 20%);
    }
}

@keyframes blink-effect {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}