/**reset **/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
    letter-spacing: -1px;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
    display: block;
}
body {
    line-height: 1;
}
ol, ul {
    list-style: none;
}
blockquote, q {
    quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}

/* a링크 초기화 */
a:link,
a:visited,
a:active {color:#fff; text-decoration:none;}
a:hover {color:#F9D507;text-decoration:none;}

.clearfix:after{content:''; display:block;}
/**reset **/

/* font */
/*강원교육새음체*/
@font-face {
    font-family: 'GangwonEduSaeeum_OTFMediumA';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2201-2@1.0/GangwonEduSaeeum_OTFMediumA.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Cafe24Ssurround'; /*카페24써라운드*/
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2105_2@1.0/Cafe24Ssurround.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

/* 더 잠실체 100,300,400,500,700,800
        TheJamsil1Thin
        TheJamsil2Light
        TheJamsil3Regular
        TheJamsil4Medium
        TheJamsil5Bold
        TheJamsil6ExtraBold
        */
@font-face {
    font-family: 'TheJamsil1Thin';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2302_01@1.0/TheJamsil1Thin.woff2') format('woff2');
    font-weight: 100;
    font-style: normal;
}
@font-face {
    font-family: 'TheJamsil2Light';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2302_01@1.0/TheJamsil2Light.woff2') format('woff2');
    font-weight: 300;
    font-style: normal;
}
@font-face {
    font-family: 'TheJamsil3Regular';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2302_01@1.0/TheJamsil3Regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: 'TheJamsil4Medium';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2302_01@1.0/TheJamsil4Medium.woff2') format('woff2');
    font-weight: 500;
    font-style: normal;
}
@font-face {
    font-family: 'TheJamsil5Bold';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2302_01@1.0/TheJamsil5Bold.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
}
@font-face {
    font-family: 'TheJamsil6ExtraBold';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2302_01@1.0/TheJamsil6ExtraBold.woff2') format('woff2');
    font-weight: 800;
    font-style: normal;
}

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

.nanumbarungothic * {
    font-family: 'NanumBarunGothic', sans-serif;
}

html, body {margin:0;padding:0; width:100%; height:100%;}

/**** intro ****/
.wrap{position:relative; background:url(../images/bottom_bg.jpg) 0 100% repeat-x;  width:100%; height:100vh;}
.inner{width:1000px; height:500px; margin:0 auto; background:url(../images/cloud.png) 0 100% no-repeat;}
.title{text-align:center; padding-top:70px; box-sizing: border-box; width:100%;}
.btn_enter{position:relative; text-align:center; margin-top:50px; z-index:9999;}
.bottom_img{background:url(../images/main_img.png) no-repeat; position:absolute; z-index:1; bottom:60px; left:50%; transform: translateX(-50%); width:1183px; height:373px;}

/***** contents list *****/
.wrap_sub{position:relative; background:url(../images/bottom_bg.jpg) 0 100% repeat-x; width:100%; min-height:100vh;}
.wrap_sub_data{position:relative; width:100%; min-height:100%;}
.wrap_con{position:relative; width:1180px; height:100vh; margin:0 auto; background:url(../images/bottom_bg.jpg) 0 100% repeat-x;}
.wrap_con_data{position:relative; width:1180px; height:100%; margin:0 auto;}
.header{width:1150px; margin:0 auto; background:url(../images/cloud.png) 0 100% no-repeat;}
.data{position: absolute; top:0; right:30px;}
.data span:first-child{}
.con_box{margin:50px auto 0; width:1150px;}
.list_con{display:flex; justify-content: space-between; position:relative; z-index:999;}
.spring, .summer, .fall, .winter{position:relative;}
.spring h2{position:absolute; top:30px; left:48%; transform: translateX(-48%);}
.summer h2{position:absolute; top:0; left:48%; transform: translateX(-48%);}
.fall h2{position:absolute; top:30px; left:48%; transform: translateX(-48%);}
.winter h2{position:absolute; top:0; left:48%; transform: translateX(-48%);}
.list{width:280px; min-height:350px; border-radius: 25px;margin-top:34px; padding-top:58px;} /*리스트배경 공통*/
.m_tit{width:194px; height:44px; border-radius: 0 25px 25px 0; background:#fef9e4; margin-bottom:5px; padding:12px 0 0 18px; box-sizing: border-box; font-size:24px; font-family: 'Cafe24Ssurround';}
.list_bottom{position:absolute; right:5px; bottom:200px;}
.list_bottom img{width:300px;}
.btimg{position:absolute; left:50%; transform: translateX(-50%); bottom:20px; z-index:90;}
.btimg_list{position:absolute; left:50%; transform: translateX(-50%); bottom:120px; z-index:90;}

/*리스트별 개별 색상*/
.spring .list{background:#59ad34; margin-top:65px;}
.summer .list{background:#0385b5;}
.fall .list{background:#ec802b; margin-top:65px;}
.winter .list{background:#d15497;}
.spring .m_tit{color:#427e1e;}
.summer .m_tit{color:#026D94;}
.fall .m_tit{color:#CF6919;}
.winter .m_tit{color:#B73179;}
.m_tit02{margin:10px 0 14px 0;}
.m_tit02 span{display:inline-block; width:240px; height:26px; border-bottom:1px solid rgba(255,255,255,.3); font-size:22px; font-family: 'Cafe24Ssurround'; color:#fff;}
.spring .m_tit02{background:url(../images/ico_01.png) 90% 0 no-repeat;}
.summer .m_tit02{background:url(../images/ico_02.png) 90% 0 no-repeat;}
.fall .m_tit02{background:url(../images/ico_03.png) 90% 0 no-repeat;}
.winter .m_tit02{background:url(../images/ico_04.png) 90% 0 no-repeat;}
.sm_list ul{margin-bottom:14px;}
.sm_list ul li{position:relative; font-size:28px; font-family:'GangwonEduSaeeum_OTFMediumA'; font-weight:bold; color:#fff; margin:0 0 5px 0; padding-left:10px;}
.sm_list ul li:before{content:''; position:absolute; width:6px; height:6px; border-radius: 50%; background:rgba(255,255,255,.8); margin:8px 0 0 -10px;}
.list > div{margin:0 0 0 20px;} /*두번째 타이틀*/
.lang{display:inline-block; margin-left:2px;}

.layoutTable{width:100%; height:100%;}
.inner_wrap{position:relative; height:100%; z-index:99;}
/*.wrap_con{position:relative; width:1297px; margin:0 auto; border:2px solid #000;}*/
/* 자료실, 탭메뉴 */
.con_data{margin:50px auto 0;}
.tab_menu{width:95%; margin:30px auto 0; display: flex; justify-content: space-between;}
.tab_menu li{display:inline-block; border-radius: 10px; color:#3b3736; width:24.5%;  margin-top:4px; text-align:center; background:#fff; border:1px solid #F47F1F; font-size:20px; line-height:54px; transition: all .3s;}
.tab_menu li a{display:inline-block; width:100%; color:#3b3736; text-decoration:none; font-family:'TheJamsil4Medium'; padding-top:-3px;}
.tab_menu li:hover{background:#F47F1F;}
.tab_menu li:hover a{color:#fff;}
.tab_menu .on{border-radius: 10px; background:#F47F1F; font-weight:400;}
.tab_menu .on a{color:#fff;}
.tab_menu > div{margin-top:50px;}
.tab_menu > div h4{position:relative;}
.con_list{/*border-top:2px solid #F47F1F;*/ width:95%; margin:0 auto;}
.con_list ul{margin-top:20px; display:flex; justify-content:flex-start; flex-wrap:wrap;}
.con_list ul li{width:180px; height:180px; border-radius: 10px; text-align:center; padding:10px 0; border:1px solid rgba(244,127,31,.3); /*border-radius: 15px;*/ background:#fff; box-sizing: border-box; margin:0 8px 10px 0;}
.con_list ul li:nth-child(6n){margin-right:0;}
.con_list .ch li img{height:100%;}
.con_list .ch li .img_wd{width:80%; height:45%; padding-top:35px;}
.con_list .ch li .img_sz{width:70%; height:85%; padding-top:10px;}
.con_list .bg li img{width:90%; padding-top:20px;}
.con_list .pl li img{width:90%;}
.con_list .pl li:nth-child(11) img,.con_list .pl li:nth-child(12) img{width:48%;}
.con_list .pl li .img_hg{width:60%;}
.con_list .pl li{display:flex; justify-content:center; align-items:center;}
.bottom_data{position:relative; background:url(../images/bottom_bg.jpg) center top repeat-x; height:150px;}
.con_list .bg li:nth-child(1){padding-top:20px;}
.con_list .bg li:nth-child(2){padding-top:20px;}
.con_list .bg li:nth-child(3){position:relative;}
.con_list .bg li:nth-child(3) img{padding-top:0;}
.con_list .bg li:nth-child(4) img{padding-top:0;}

/*
.sticker{display:block; font-size:11px; margin-top:-4px; color:#222;font-family: 'TheJamsil4Medium';}
.sticker .stic01{background:rgba(1,92,207,.7);}
.sticker .stic02{background:rgba(254,44,109,.7);}
.sticker .stic03{background:rgba(254,169,0,.7);}
.sticker .stic04{background:rgba(3,208,71,.7);}
.sticker span{display:inline-block; background:rgba(0,0,0,.7); border-radius: 10px; color:#fff; padding:3px 5px; letter-spacing:0;font-family: 'TheJamsil1Thin';}
*/

/*tootip*/
.tooltip {
    position: relative;
    display: block;
    margin:10px 0;
}

.tooltip .tooltiptext {
    visibility: hidden;
    background-color: rgba(0,0,0,.7);
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 6px;
    font-family: 'paybooc-Light';
    font-size:10px;
    letter-spacing:0;
    /* Position the tooltip */
    position: absolute;
    z-index: 1;
    bottom: 49%;
    left: 5%;
    /*margin-left: -60px;*/
}

.tooltip:hover .tooltiptext {
    visibility: visible;
}

/* show/hide */
.list_kinder label{color:#444;}
.list_kinder label:hover{color:#1379A4;}
input[id*="answer"] {
    display:none;
}
input[id*="answer"] + label {
    display:block;
    border-bottom:0;
    cursor:pointer;
}
input[id*="answer"] + label + div{
    max-height:0;
    transition: all .35s;
    overflow:hidden;
    margin:0;
    padding:0;
    vertical-align: top;
}
input[id*="answer"]:checked + label + div {max-height:300px; margin:0;}
input[id*="answer"]:checked + label + .thum {max-height:340px; margin:0;}
input[id*="answer"]:checked + label + div img{ vertical-align: top;}



/* bx-slider */
.slideWrap{
    max-width: 960px;border:0px solid #f00;
    width:100%;
    margin:2em auto;
    /*position: relative;*/
}
/*
.controls .bx-prev, .controls .bx-next{
    position: absolute;
    top:50%;
    transform:translateY(-50%);
    font-size: 3em;
}
.controls .bx-prev {
    right:calc(100% + 40px);
}
.controls .bx-next {
    left:calc(100% + 40px);
}
*/
/* bxslide pager */
.bx-wrapper{position:relative;border:0px solid #f00; height:650px; text-align:center;}
.bx-wrapper .bx-pager {
    font-size: .85em;
    font-family: Arial;
    font-weight: bold;
    color: #666;
    position:absolute;
    bottom:-30px;
    left:50%;
}
.bx-wrapper .bx-pager .bx-pager-item,
.bx-wrapper .bx-controls-auto .bx-controls-auto-item {
    display: inline-block;
    *zoom: 1;
    *display: inline;
}
.bx-wrapper .bx-pager.bx-default-pager a {
    background:#cfd9d7;
    border:0;
    text-indent: 0;
    text-align:center;
    display: block;
    width: 20px;
    height: 20px;
    box-sizing: border-box;
    margin: 0 1px;
    outline: 0;
    padding-top:4px;
    border-radius: 50%;
    color:#999;
}
.bx-wrapper .bx-pager.bx-default-pager a:hover,
.bx-wrapper .bx-pager.bx-default-pager a.active {
    border:0; background:#5dbfab;
    color:#fff;
}

/*bxslider controls*/
.bx-wrapper .bx-prev {
    position:absolute;
    left: 173px;
    background: url(/images/slide_l.png) no-repeat 0 0; background-size:60%;
    display:none;
}

.bx-wrapper .bx-next {
    position:absolute;
    left: 270px;
    background: url(/images/slide_r.png) no-repeat 0 0; background-size:60%;
    display:none;
}
/*
.bx-wrapper .bx-prev:hover {
    background-position: 0 50%;
}
.bx-wrapper .bx-next:hover {
    background-position: 0 50%;
}
*/
.bx-wrapper .bx-controls-direction a {
    position: absolute;
    top: 48px;
    margin-top: -50px;
    outline: 0;
    width: 38px;
    height: 38px;
    text-indent: 9999px;
}
.bx-wrapper .bx-controls-direction a.disabled {
    display: none;
}

/********************* modal *********************/

.page-wrapper {
    width: 100%;
    height: 100%;
    background: url(https://goo.gl/OeVhun) center no-repeat;
    background-size: cover;
}

.blur-it {
    filter: blur(4px);
}


.modal-wrapper1,
.modal-wrapper2,
.modal-wrapper3,
.modal-wrapper4,
.modal-wrapper5{
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.5);
    visibility: hidden;
    opacity: 0;
    transition: all 0.25s ease-in-out;
    text-align:left;
}

.modal-wrapper1.open,
.modal-wrapper2.open,
.modal-wrapper3.open,
.modal-wrapper4.open,
.modal-wrapper5.open{
    opacity: 1;
    visibility: visible;
}

.modal {
    width: 852px;
    height: 500px;
    display: block;
    border-radius: 30px;
    box-sizing: border-box;
    padding-top:30px;
    position: relative;
    top: 50%;
    left: 50%;
    transform: translateX(-50%);
    background: #fff;
    opacity: 0;
    transition: all 0.5s ease-in-out;
    font-family:InfinitySans-RegularA1;
}

.modal-wrapper1.open .modal,
.modal-wrapper2.open .modal,
.modal-wrapper3.open .modal,
.modal-wrapper4.open .modal,
.modal-wrapper5.open .modal{
    margin-top: -200px;
    opacity: 1;
}

.modal_head {
    width: 90%;
    padding: 12px 30px;
    overflow: hidden;
    font-family:InfinitySans-BoldA1;
    font-size:32px;
    letter-spacing: -1px;
    color:#5DBEAB;
}

.btn-close{
    font-size: 62px;
    display: block;
    color: #5DBEAB;

}
.modal_head{}
.modal_head a{position:absolute; top:25px; right:35px; color:#5DBEAB;}
.modal_head a:hover{color:#43A995;}

.modal_con {
    padding: 30px;
    font-size:18px;
    color:#666;
    line-height: 32px;
}

.modal_con .mb30{margin-bottom:30px;}
.modal_con div p{word-break:break-all;}
.guide_img{margin-top:30px;}
.guide_hg{height:600px;}
.paging{text-align:center; font-family: MaplestoryOTFBold; position:relative;}
.paging a:nth-child(1),
.paging a:nth-child(5){font-size:35px; color:#2C8FC8;}
.paging a:nth-child(2),
.paging a:nth-child(3),
.paging a:nth-child(4){display:inline-block; width:35px; height:35px; font-size:24px; border-radius: 50%; background:#a4adab; color:#fff; text-align:center; line-height:35px; vertical-align: top;}
.paging span{display:inline-block; width:100%; height:100%; border-radius: 50%;}
.paging .on{background:#5DBFAB;}

/* media query
@media screen and (max-width:1200px){
    .contents{position:relative; background:url(../images/visual.png) center 96% no-repeat; background-size: 80%; width:100%;border:0px solid #f00;}
    #wrap_con{width:94%; padding:0 3%;}
}
@media screen and (max-width:1024px){
    .contents{position:relative; background:url(../images/visual.png) center 96% no-repeat; background-size: 120%;}
    .contents_con{position:relative; background:url(../images/visual_sub.png) center 96% no-repeat; background-size:100%; width:100%;}
    .title img{width:70%;}
    .enter{margin-top:100px;}
    .enter img{width:40%;}
    .title_con img{width:100%;}
    .con_box .list:nth-child(1){width:50%;}
    .con_box .list:nth-child(2){width:50%;}
    .con_box .list:nth-child(3){width:50%; margin-top:50px;}
    .con_box .list:nth-child(4){width:50%; margin-top:50px;}
}
@media screen and (max-width:768px){
    #wrap{background:url(../images/cloud.png) 0 top no-repeat; width:100%; height:100%;}
}*/