#wrapper.wide {
    width: auto;
    min-width: 1300px;
    overflow: hidden;
    margin: 0 auto -80px auto;
}

html.mobile {
    width: 1200px;
}


div.visual,
div.cont1,
div.cont2,
div.cont3,
div.cont4,
div.cont5,
div.cont6,
div.cont7,
div.cont8,
div.cont9,
div.cont10 {
    position: relative;
    text-align: center;
}

.mid {
    margin-top: 0 !important;
}

.mid .mask {
    width: 1200px;
    position: relative;
    margin: 0 auto;
    overflow: hidden;
    min-height: 50px;
}

.mask .img {
    position: relative;
    left: -360px;
}

.maskWrap {
    max-width: 1920px;
    margin: 0 auto;
}

/* visual */
.visual {
    background: #4053e3 url(img/visual.png) no-repeat center top;
}

.visual .mask {
    position: relative;
    overflow: visible;
}

.visual .mask:before {
    content: "";
    display: block;
    position: absolute;
    bottom: 50px;
    left: 480px;
    width: 99px;
    height: 120px;
    background: url(img/click_ico01.png) 0 0 no-repeat;
    z-index: 10;
    animation: click 1s ease-in infinite alternate;
}

.visual .mask:after {
    content: "";
    display: block;
    position: absolute;
    bottom: 50px;
    right: -20px;
    width: 99px;
    height: 120px;
    background: url(img/click_ico01.png) 0 0 no-repeat;
    z-index: 10;
    animation: click 1s ease-in infinite alternate;
}

.visual .mask .closed {
    position: absolute;
    bottom: 187px;
}

.visual .mask .closed1 {
    left: 465px;
}

.visual .mask .closed2 {
    right: 5px;
}

/* con */
.cont1 .mask {
    width: 100%;
    padding-bottom: 120px;
    background: url(img/cont1_bg.png) no-repeat center top #e5f0f8;
}

.cont1 .mask .cont1_tit {
    padding: 80px 0 40px;
}

.cont1 .sliderBox {
    width: 1236px;
    margin: 0 auto;
    position: relative;
}

.cont1 .sliderBox .slider {
    width: 1098px;
    height: 350px;
}

.cont1 .sliderBox .anythingControls {
    bottom: -45px;
    width: 100%;
    text-align: center;
}

.cont1 .sliderBox .anythingControls .thumbNav {
    float: none;
    width: 100%;
}

.cont1 .sliderBox .anythingControls .thumbNav li {
    display: inline-block;
    float: none;
}

.cont1 .sliderBox .anythingControls .thumbNav li a {
    width: 25px;
    height: 25px;
    margin: 0;
    border-radius: 50%;
    background-color: #85848c;
}

.cont1 .sliderBox .anythingControls .thumbNav li a:first-child {
    margin-right: 10px;
}

.cont1 .sliderBox .anythingControls .thumbNav li a.cur {
    background-color: #0101bf;
}

.cont1 .left,
.cont1 .right {
    width: 94px;
    height: 100%;
    z-index: 2;
}

.cont1 .arrow {
    height: 100%;
}

.cont1 .arrow a {
    display: block;
    background: url(img/btn_arrow.png) no-repeat;
    width: 100%;
    height: 100%;
    vertical-align: middle;
    text-indent: -9999em;
}

.cont1 .arrow.disabled a {
    cursor: default;
}

.cont1 .left span a {
    background-position: 0 center;
}

.cont1 .right span a {
    background-position: -94px center;
}

.cont1 .left {
    position: absolute;
    left: -22px;
    top: 0px;
}

.cont1 .right {
    position: absolute;
    right: -22px;
    top: 0px;
}

/* scroll tab */
.scroll_tab{position:relative; width:100%; margin-top: -24px; transition:all .5s; z-index:9; border-bottom: 6px solid #fdb913;}
.scroll_tab::before {content: ''; width: 100%; height: 94px; background-color:#000; position: absolute; bottom: 0; display: block;}
.scroll_tab.fixed{position:fixed; top:0; z-index:100; margin-top: auto; background: #fff6cc}
.scroll_tab.fixed + .cont2{padding-top:123px;}
.scroll_tab.up{top:-170px;}
.scroll_tab.fixed_cont2 {border-bottom-color: #fdb913}
.scroll_tab.fixed_cont3 {border-bottom-color: #8dc63f; background: #eaf3dc;}
.scroll_tab.fixed_cont4 {border-bottom-color: #33c4e8; background: #d9f1fd;}
.scroll_tab .tabArea{display:flex; width:1200px; margin:0 auto;}
.scroll_tab .tabArea li{width:400px; height:117px;}
.scroll_tab .tabArea li a{display:block; position:relative; background: url(img/scroll_tab.png) no-repeat; width:100%; height:100%; text-indent:-9999em;}
.scroll_tab .tabArea li:nth-child(1) a{background-position:0 23px;}
.scroll_tab .tabArea li:nth-child(2) a{background-position:-400px 23px;}
.scroll_tab .tabArea li:nth-child(3) a{background-position:-800px 23px;}
.scroll_tab .tabArea li:nth-child(1).on a{background-position:0 -123px;}
.scroll_tab .tabArea li:nth-child(2).on a{background-position:-400px -123px;}
.scroll_tab .tabArea li:nth-child(3).on a{background-position:-800px -123px;}

/* event */
.cont2 {
    background: #fff6cc;
}

.cont2 .mask {
    padding: 120px 0;
    position: relative;
}

.cont2 .mask::before {
    content: "";
    display: block;
    position: absolute;
    bottom: 70px;
    right: 10px;
    width: 99px;
    height: 90px;
    background: url(img/click_ico02.png) 0 0 no-repeat;
    z-index: 10;
    animation: click 1s ease-in infinite alternate;
}

.cont3 {
    background: #eaf3dc;
    padding: 120px 0;
}

.cont3 .cont3_1 {
    position: relative;
    padding-bottom: 80px;
}

.cont3 .cont3_1::before {
    content: "";
    display: block;
    position: absolute;
    bottom: 50px;
    right: 10px;
    width: 99px;
    height: 90px;
    background: url(img/click_ico02.png) 0 0 no-repeat;
    z-index: 10;
    animation: click 1s ease-in infinite alternate;
}

.cont3 .cont3_2 {
    padding-bottom: 80px;
    position: relative;
}

.cont3 .cont3_2::before {
    content: "";
    display: block;
    position: absolute;
    bottom: 50px;
    right: 350px;
    width: 99px;
    height: 90px;
    background: url(img/click_ico02.png) 0 0 no-repeat;
    z-index: 10;
    animation: click 1s ease-in infinite alternate;
}


.cont3 .input_focus {
    position: absolute;
    left: 487px;
    top: 453px;
    width: 430px;
    height: 94px;
    background: #fff url(img/inputBg.png) no-repeat center;
    text-align: center;
    color: #000;
    font-size: 34px;
    font-weight: 600;
    border-radius: 15px;
    border: 0;
}

.cont3 .input_focus.on {
    background: transparent;
}

.cont4 {
    padding: 120px 0 0 0;
    background: #d9f1fd;
}

.cont4 .cont4_1 {
    position: relative;
}

.cont4 .cont4_1::after {
    content: '';
    width: 90px;
    height: 90px;
    background: url(img/ico_plus.png) no-repeat;
    position: absolute;
    bottom: -45px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 5;
}

.cont4 .cont4_1 .cont4_1_slider {
    width: 400px;
    position: absolute;
    bottom: 124px;
    left: 119px;
}

.cont4 .cont4_1 .cont4_1_pagination {
    bottom: 65px;
    left: 240px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.cont4 .cont4_1 .cont4_1_pagination .swiper-pagination-bullet {
    width: 24px;
    height: 24px;
    background: #c2c2c2;
    opacity: 1;
}

.cont4 .cont4_1 .cont4_1_pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
    background: #ef3054;
}

@font-face {
    font-family: 'GangwonEduPowerExtraBoldA';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2201-2@1.0/GangwonEduPowerExtraBoldA.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

/* scroll tab */
.cont4_2  {
    background: #e5f7fc;
}

.cont4_2 .mask {
    position: relative;
}

.cont4 .cont4_2 .slider {
    width: 100%;
    position: absolute;
    top: 270px;
}

.cont4 .cont4_2 .slider .swiper-wrapper {
    margin-top: 40px;
}

.cont4_2 .swiper-pagination {
    display: flex;
    justify-content: center;
    gap: 7px;
    position: static;
}

.cont4_2 .swiper-pagination div {
    font-family: 'GangwonEduPowerExtraBoldA';
    display: flex;
    justify-content: center;
    align-items: center;
    width: 250px;
    height: 95px;
    margin: 0 !important;
    background-color: #6d6c76;
    border-radius: 20px;
    font-weight: 700;
    font-size: 32px;
    color: #babbbd;
    line-height: 36px;
    opacity: 1;
}

.cont4_2 .swiper-pagination div span {
    margin-top: 10px;
}

.cont4_2 .swiper-pagination div.swiper-pagination-bullet-active {
    background-color: #ed1941;
    color: #fff;
}

.cont4_2 .btn {
    padding: 25px 0 65px;
    background: #d9f1fd;
}

.cont4_2 .btn a {
    position: relative;
}

.cont4_2 .btn a:before {
    content: "";
    display: block;
    position: absolute;
    top: 20px;
    right: 0;
    width: 99px;
    height: 120px;
    background: url(img/click_ico01.png) 0 0 no-repeat;
    animation: blinker 1s step-end infinite;
}

@keyframes blinker {
    50% {
        opacity:0;
    }
}


/* upselling */
.upselling1 {
    background: #fde6d8 url(img/upselling_con01.png) no-repeat center top;
}

.upselling1 .mask {
    position: relative;
}

.upselling1 .mask:before {
    content: "";
    display: block;
    position: absolute;
    bottom: 229px;
    right: 345px;
    width: 91px;
    height: 104px;
    background: url(img/click_ico02.png) 0 0 no-repeat;
    z-index: 10;
    animation: click 1s ease-in infinite alternate;
}

.upselling3 {
    background-color: #f9f1e9;
}

.upselling3 .mask {
    position: relative;
}

.upselling3 .mask:before {
    content: "";
    display: block;
    position: absolute;
    bottom: 112px;
    right: 345px;
    width: 91px;
    height: 104px;
    background: url(img/click_ico02.png) 0 0 no-repeat;
    z-index: 10;
    animation: click 1s ease-in infinite alternate;
}

.img_notice {
    background: #666;
}

/* popup */
.popup1 {
    margin-top: 50px;
    border: 3px solid #1b1b1b;
}

.popup1 .b-close {
    position: absolute;
    top: 0;
    right: 0;
    cursor: pointer;
}


@keyframes click {
    0% {
        transform: translate(0, 0);
    }
    100% {
        transform: translate(10%, 10%);
    }
}

/* event */
#event {
    letter-spacing: -1px;
    font-family: 'Noto Sans KR';
}

#event .event_banner {
    display: flex;
    justify-content: center;
    overflow: hidden;
}

#event .join .insert > li p {
    font-family: 'Noto Sans KR';
}

#event .btn_bor1 {
    display: inline-block;
    color: #ed3535;
    font-size: 16px;
    border: 1px solid #ed3535;
    padding: 4px 15px 5px;
    border-radius: 16px;
    margin: -5px 0 0 10px;
}

#event .join .insert > li .btn_confir {
    font-weight: 700;
}

#event .join h3 {
    color: #000;
    border-bottom: none;
}

#event .btn_detail_view_layer {
    font-size: 16px;
    color: #1b1b1b;
    display: inline-block;
    vertical-align: middle;
    margin: -3px 0 0 10px;
    background: #fff;
    letter-spacing: -1px;
}

#event .note.case3 {
    position: absolute;
    left: 60px;
    top: 100px;
    border: 1px solid #000;
    padding: 0;
    z-index: 2;
}

#event .note.case3 li {
    font-weight: 400;
}

#event .note.case3 .relative {
    padding: 20px 30px 20px
}

#event .note.case3 .btn_note_case3 {
    position: absolute;
    right: 0;
    top: 0;
    text-indent: -9999em;
    background: url(img/event/btn_layer_close.png) no-repeat center;
    width: 62px;
    height: 62px;
}

#event .ga_go_link {
    position: relative;
    width: 740px;
    margin: 20px auto 85px;
}

#event .ga_go_link > a {
    position: absolute;
    text-indent: -9999em;
    height: 77px;
}

#event .ga_go_link > a.ga_go_link1 {
    left: 0;
    top: 0;
    width: 100%;
}

#event .ga_go_link > a.ga_go_link2 {
    left: 0;
    top: 55%;
    width: 50%;
}

#event .ga_go_link > a.ga_go_link3 {
    left: 50%;
    top: 55%;
    width: 50%;
}

.noticeBox {
    position: relative;
    margin: 100px 0 0;
    background: #f5f5f5;
    padding: 50px 0 80px 100px;
    font-family: 'Noto Sans KR';
    text-align: left;
    color: #333;
}

.noticeBox .tit {
    position: relative;
    margin-bottom: 20px;
    font-size: 30px;
    font-weight: 600;
}

.noticeBox p {
    color: #ed3535;
    font-size: 20px;
    font-weight: 700;
}

.noticeBox ul {
    margin: 5px 0 0;
}

.noticeBox ul li {
    position: relative;
    font-size: 20px;
    font-weight: 200;
    text-indent: -10px;
    padding: 0 0 0 10px;
    font-weight: 400;
    margin: 5px 0 0;
    line-height: 1.3;
}

.noticeBox .btn_member {
    position: absolute;
    right: 100px;
    top: 0;
    background: #454141;
    color: #fff;
    font-size: 14px;
    padding: 8px 20px;
}