*{margin:0;padding:0}
li{list-style:none}
a{text-decoration:none}
img{border:none;display:block}
body,html{height:100%;font-family:"nanumsquare";overflow:hidden}
@font-face{font-family:"nanumsquare";font-style:normal;font-weight:300;src:local(※),url(../font/NanumSquareL.woff)}
@font-face{font-family:"nanumsquare";font-style:normal;font-weight:400;src:local(※),url(../font/NanumSquareR.woff)}
@font-face{font-family:"nanumsquare";font-style:normal;font-weight:700;src:local(※),url(../font/NanumSquareB.woff)}
@font-face{font-family:"nanumsquare";font-style:normal;font-weight:900;src:local(※),url(../font/NanumSquareEB.woff)}
.sample{vertical-align:middle; margin-left:5px; padding:3px 10px; font-size:20px; font-weight:900; background-color:#ffc015; border-radius:7px;}
.mainBg{background:url(../images/bg.png);width:1920px;height:1080px;overflow:hidden}
.mainBg .mainImgs{position:absolute;left:50%}
.mainBg .imgCloudRt{top:50px;margin-left:750px;background:url(../images/main_cloud_01.png) no-repeat center;background-size:100%;width:82px;height:33px}
.mainBg .imgLadybug{top:200px;margin-left:490px;background:url(../images/main_animal_01.png) no-repeat center;background-size:100%;width:61px;height:54px}
.mainBg .imgLion{top:225px;margin-left:635px;background:url(../images/main_animal_02.png) no-repeat center;background-size:100%;width:242px;height:312px}
.mainBg .imgMelody1{top:260px;margin-left:855px;background:url(../images/main_mel_01.png) no-repeat center;background-size:100%;width:125px;height:156px}
.mainBg .imgHorse{top:545px;margin-left:575px;background:url(../images/main_animal_04.png) no-repeat center;background-size:100%;width:262px;height:344px}
.mainBg .imgRabbit{top:750px;margin-left:615px;background:url(../images/main_animal_05.png) no-repeat center;background-size:100%;width:98px;height:160px}
.mainBg .imgGull{top:180px;margin-left:-570px;background:url(../images/main_animal_03.png) no-repeat center;background-size:100%;width:160px;height:64px}
.mainBg .imgMelody2{top:180px;margin-left:-760px;background:url(../images/main_mel_01.png) no-repeat center;background-size:100%;width:125px;height:156px}
.mainBg .imgCloudLt{top:360px;margin-left:-900px;background:url(../images/main_cloud_02.png) no-repeat center;background-size:100%;width:82px;height:33px}
.mainBg .imgClef{top:350px;margin-left:-845px;background:url(../images/main_mel_02.png) no-repeat center;background-size:100%;width:214px;height:552px}
.mainBg .imgChic{top:440px;margin-left:-855px;background:url(../images/main_animal_06.png) no-repeat center;background-size:100%;width:214px;height:180px}
.mainBg .imgDog{top:760px;margin-left:-910px;background:url(../images/main_animal_07.png) no-repeat center;background-size:100%;width:173px;height:181px}
.mainBg .imgCat{top:700px;margin-left:-665px;background:url(../images/main_animal_08.png) no-repeat center;background-size:100%;width:150px;height:194px}
.mainBg .mainTitle{width:1240px;margin:0 auto;text-align:center;padding-top:77px}
.mainBg .mainTitle h1 img{margin:0 auto;margin-bottom:20px}
.mainBg .mainTitle h2{font-size:80px;font-weight:900;color:#4b4b65;}
.mainBg .mainCont{background:url(../images/main_cont_bg.png) no-repeat center;width:1242px;height:604px;margin:30px auto 0}
.mainBg .mainCont .rainBow{position:absolute;top:695px;left:50%;margin-left:-960px;background:url(../images/main_rainbow.png) no-repeat center;background-size:100%;width:1920px;height:323px}
.mainBg .navWrap{position:absolute;top:310px;left:375px;}
.mainBg .navWrap:after{content:"";clear:both;display:block;height:0;visibility:hidden}
.mainBg .navWrap > nav{float:left;height:480px;overflow:hidden}
.mainBg .navWrap .nav1{width:392px;padding:0px 30px;border-right:4px solid #efefef;box-sizing:border-box}
.mainBg .navWrap .nav1 > ul > li{height:70px;line-height:70px;margin-bottom:10px;text-indent:30px;font-size:36px;font-weight:900;
    cursor: pointer;}
.mainBg .navWrap .nav1 > ul > li.on {color:#283250;transition:all .3s;cursor:pointer;color:#e68200;display:block;border-radius:20px;background:#ffebcd}
/*.mainBg .navWrap .nav1 > ul > li:hover{}*/
.mainBg .navWrap .nav1 > ul > li.select1{color:#e68200;display:block;border-radius:20px;background:#ffebcd}
.mainBg .navWrap .nav1 > ul > li.none{color:#d0d0d0; cursor:default;}
.mainBg .navWrap .nav1 > ul > li.none:hover {background:none;}
.mainBg .navWrap .nav2{width:460px;box-sizing:border-box;padding:0 20px}
.mainBg .navWrap .nav2 .none {color: #d0d0d0; cursor: default;}
.mainBg .navWrap .nav2 .none:hover {background:none; color:#d0d0d0;}
.mainBg .navWrap .nav2 .pageMove.on, .mainBg .navWrap .nav2 .pageMove:hover {color: #e68200; display: block; border-radius: 20px; background: #ffebcd;}
.mainBg .navWrap .nav2 ul > li{width:380px;height:50px;line-height:50px;margin-bottom:10px;font-size:28px;font-weight:900;text-indent:20px;transition:all .3s;cursor:pointer;}
.mainBg .navWrap .nav2 ul > li:hover{}
.mainBg .navWrap .nav2 ul > li.selected{color:#f05a23;display:block;border-radius:30px;background:#efefef}
.mainBg .navWrap .nav2 ul > li .pageNum{font-size:24px;font-weight:700;margin-right:10px}
.mainBg .navWrap .nav2 ul > li .pageSecTitle1{width:380px;height:50px;line-height:50px;margin-bottom:10px;font-size:28px;font-weight:900;text-indent:20px;cursor:pointer;letter-spacing: -5px;}
.mainBg .navWrap .nav2 ul > li .pageSubtt{font-size:18px;font-weight:900}
.mainBg .navWrap .mainScroll{float:left;width:8px;height:480px;background:#efefef;position:relative}
.mainBg .navWrap .mainScroll .mainScbar{background:url(../images/main_scrbar.png) no-repeat center;background-size:100%;width:20px;height:51px;position:absolute;top:0;left:50%;margin-left:-10px;cursor:pointer}
.mainBg .navWrap .nav3{margin-left:8px;width:280px;}
.mainBg .navWrap .nav3 ul li{height:220px;background:#eee;border-radius:30px;text-align:center;font-size:40px;font-weight:900;color:#222;cursor:pointer;box-sizing:border-box;transition:all .3s}
.mainBg .navWrap .nav3 ul li:first-child{padding-top:46px;margin-bottom:40px;}
.mainBg .navWrap .nav3 ul li:last-child{padding-top:40px;line-height:28px}
.mainBg .navWrap .nav3 ul li:hover{background:#ffebcd;color:#e68200}
.mainBg .navWrap .nav3 ul li > div{margin:16px auto 0}
.mainBg .navWrap .nav3 ul li .iconBook{position:relative; background:url(../images/btn_icon_01.png) no-repeat center;background-size:100%;width:80px;height:72px;}
.mainBg .navWrap .nav3 ul li .iconBook .iconOver{opacity:0;}
.mainBg .navWrap .nav3 ul li .iconBook .iconOver.icB{ background:url(../images/btn_icon_01_over.png) no-repeat center;background-size:100%;width:80px;height:72px;}
.mainBg .navWrap .nav3 ul li .iconTeach{position:relative; background:url(../images/btn_icon_02.png) no-repeat center;background-size:100%;width:88px;height:66px}
.mainBg .navWrap .nav3 ul li .iconTeach .iconOver.icT{ background:url(../images/btn_icon_02_over.png) no-repeat center;background-size:100%;width:88px;height:66px;opacity:0;}
.mainBg .navWrap .nav3 ul li .topTt{display:block;font-size:24px;text-align:left;margin-left:74px}
.mainBg .mainBottom{position:relative}
.mainBg .mainBottom ul{position:absolute;top:28px;left:50%;margin-left:-560px}
.mainBg .mainBottom ul:after{content:"";clear:both;display:block;height:0;visibility:hidden}
.mainBg .mainBottom ul li{float:left;margin-right:25px;color:#222;font-weight:900;background:url(../images/btn_bg.png) no-repeat center;background-size:100%;width:202px;height:64px;line-height:65px;text-align:center;font-size:24px;cursor:pointer;transition:all .3s}
.mainBg .mainBottom ul li:last-child{margin-right:0}
.mainBg .mainBottom ul li:hover{background:url(../images/btn_bg_over.png) no-repeat center; color:#e68200}
.mainBg .mainBottom ul li > div{display:inline-block;position:relative;margin-right:5px}
.mainBg .mainBottom ul li:nth-child(1) > div{top:8px;background:url(../images/nav_icon_01.png) no-repeat center;background-size:100%;width:20px;height:30px}
.mainBg .mainBottom ul li:nth-child(1) > div > .icB1{background:url(../images/nav_icon_01_over.png) no-repeat center;background-size:100%;width:20px;height:30px;opacity:0;}
.mainBg .mainBottom ul li:nth-child(2) > div{top:8px;background:url(../images/nav_icon_02.png) no-repeat center;background-size:100%;width:26px;height:30px}
.mainBg .mainBottom ul li:nth-child(2) > div > .icB2{background:url(../images/nav_icon_02_over.png) no-repeat center;background-size:100%;width:26px;height:30px;opacity:0;}
.mainBg .mainBottom ul li:nth-child(3) > div{top:4px;background:url(../images/nav_icon_03.png) no-repeat center;background-size:100%;width:28px;height:24px}
.mainBg .mainBottom ul li:nth-child(3) > div > .icB3{background:url(../images/nav_icon_03_over.png) no-repeat center;background-size:100%;width:28px;height:24px;opacity:0;}
.mainBg .mainBottom ul li:nth-child(4) > div{top:4px;background:url(../images/nav_icon_04.png) no-repeat center;background-size:100%;width:28px;height:26px}
.mainBg .mainBottom ul li:nth-child(4) > div > .icB4{background:url(../images/nav_icon_04_over.png) no-repeat center;background-size:100%;width:28px;height:26px;opacity:0;}
.mainBg .mainBottom ul li:nth-child(5) > div{top:4px;background:url(../images/nav_icon_05.png) no-repeat center;background-size:100%;width:24px;height:26px}
.mainBg .mainBottom ul li:nth-child(5) > div > .icB5{background:url(../images/nav_icon_05_over.png) no-repeat center;background-size:100%;width:24px;height:26px;opacity:0;}
.mainBg .mainBottom > div{position:absolute;left:50%}

footer{width:1240px;font-size:20px;font-weight:700;margin:190px auto 0;text-align:center}
@media (min-width:1441px) and (max-width:1600px){.mainBg{width:1600px}
.mainBg .mainTitle{padding-top:30px}
.mainBg .imgCloudRt{display:none}
.mainBg .imgLadybug{top:150px}
.mainBg .imgLion{display:none}
.mainBg .imgMelody1{display:none}
.mainBg .imgHorse{margin-left:540px;top:520px}
.mainBg .imgRabbit{top:720px}
.mainBg .imgGull{top:135px}
.mainBg .imgClef{display:none}
.mainBg .imgChic{display:none}
.mainBg .imgDog{display:none}
.mainBg .imgCat{top:670px}
.mainBg .mainCont .rainBow{top:645px}
.mainBg .navWrap{top:260px; left:215px}
footer{margin:220px auto 0}
}
@media (min-width:1200px) and (max-width:1440px){.mainBg{width:1440px}
.mainBg .mainTitle{padding-top:30px}
.mainBg .imgCloudRt{display:none}
.mainBg .imgLadybug{top:150px}
.mainBg .imgLion{display:none}
.mainBg .imgMelody1{display:none}
.mainBg .imgHorse{display:none}
.mainBg .imgRabbit{top:720px}
.mainBg .imgGull{top:135px}
.mainBg .imgMelody2{display:none}
.mainBg .imgCloudLt{display:none}
.mainBg .imgClef{display:none}
.mainBg .imgChic{display:none}
.mainBg .imgDog{display:none}
.mainBg .imgCat{top:670px}
.mainBg .mainCont .rainBow{top:695px; width:1440px; left:0px; margin-left:0px;}
.mainBg .navWrap{top:260px; left:135px;}
footer{margin:220px auto 0}
}
@media (min-width:300px) and (max-width:1199px){.mainBg{width:1250px}
.mainBg .mainTitle{padding-top:30px}
.mainBg .imgCloudRt{display:none}
.mainBg .imgLadybug{top:150px}
.mainBg .imgLion{display:none}
.mainBg .imgMelody1{display:none}
.mainBg .imgHorse{display:none}
.mainBg .imgRabbit{display:none}
.mainBg .imgGull{top:135px}
.mainBg .imgMelody2{display:none}
.mainBg .imgCloudLt{display:none}
.mainBg .imgClef{display:none}
.mainBg .imgChic{display:none}
.mainBg .imgDog{display:none}
.mainBg .imgCat{display:none}
.mainBg .mainCont .rainBow{display:none;}
.mainBg .navWrap{top:260px; left:40px;}
footer{margin:220px auto 0}
}
.contentsScroll{width:100%;max-height:480px}
.contentsScroll .scrollDetail{position:relative;display:inline-block;height:100%}
.scroll-wrapper{overflow:hidden!important;padding:0!important}
.scroll-wrapper > .scroll-content{border:none!important;box-sizing:content-box!important;height:auto;left:0;margin:0;max-height:none;max-width:none!important;overflow:scroll!important;padding:0;position:relative!important;top:0;width:auto!important}
.scroll-wrapper > .scroll-content::-webkit-scrollbar{height:0;width:0}
.scroll-element{display:none}
.scroll-element,.scroll-element div{box-sizing:content-box}
.scroll-element.scroll-x.scroll-scrollx_visible,.scroll-element.scroll-y.scroll-scrolly_visible{display:block}
.scroll-element .scroll-bar,.scroll-element .scroll-arrow{cursor:default}
.scroll-textarea > .scroll-content{overflow:hidden!important}
.scroll-textarea > .scroll-content > textarea{border:none!important;box-sizing:border-box;height:100%!important;margin:0;max-height:none!important;max-width:none!important;overflow:scroll!important;outline:none;padding:2px;position:relative!important;top:0;width:100%!important}
.scroll-textarea > .scroll-content > textarea::-webkit-scrollbar{height:0;width:0}
.contentsScroll > .scroll-element,.contentsScroll > .scroll-element div{border:none;margin:0;padding:0;position:absolute;z-index:10}
.contentsScroll > .scroll-element div{display:block;height:100%;left:0;top:0;width:100%}
.contentsScroll > .scroll-element.scroll-x{bottom:2px;height:8px;left:0;width:100%}
.contentsScroll > .scroll-element.scroll-y{position:absolute;top:0;right:5px;width:24px;height:100%}
.contentsScroll > .scroll-element .scroll-element_outer{overflow:hidden}
.contentsScroll > .scroll-element .scroll-element_track{position:absolute;top:0;right:0;margin-left:11px;width:8px;height:100%;background:#ebebeb;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px}
.contentsScroll > .scroll-element .scroll-bar{
    position:absolute;display:inline-block;top:0;left:4px;width:21px;height:71px!important;background:url(../../contents/common/images/scrollbtn.png) no-repeat;cursor:pointer;
    background-size: 100% 100%;
}
#sectionList ul{display:none}
#sectionList ul:first-child{display:inline-block}


*{font-size:100%; -webkit-text-size-adjust:100%; font-variant-ligatures:none; -webkit-font-variant-ligatures:none; text-rendering:optimizeLegibility; -moz-osx-font-smoothing:grayscale; font-smoothing:antialiased; -webkit-font-smoothing:antialiased; text-shadow:rgba(0,0,0,.01) 0 0 1px;}