@charset "utf-8";
/* START */
.displayNone {display:none}
/* COMMON */
.engActivity{position:relative;width:100%;height:100%;min-width:1580px;}
.engActivity .inner{position:relative;width:1200px;margin:0 auto;}
.engActivity .tabContWrap .tabCont{display:none;}
.engActivity .tabContWrap .tabCont.on{display:block;}
.engActivity .blind,
.engActivity input[type="checkbox"]{overflow:hidden;position:absolute;top:auto;right:auto;bottom:auto;left:auto;display:block;width:1px;height:1px;padding:0;margin:-1px;border:0;text-indent:0;clip:rect(0,0,0,0);}
.engActivity input[type="checkbox"] + label{display:flex;padding-left:0;cursor:pointer;}
.engActivity input[type="checkbox"] + label:before{position:relative;display:inline-block;width:20px;margin-top:0;background:url(/resources/images/themeplace/engActivity/ico_info_chk.jpg) 0 0 no-repeat;border:0;border-radius:0;}
.engActivity .listInfoWrap input[type="checkbox"] + label .txt{margin-left:8px;line-height:20px;vertical-align:top;}
.listInfoWrap .btn_bookmark span{width:20px;background:url(/resources/images/themeplace/engActivity/ico_info_add.jpg);}
.listInfoWrap .btn_download span{width:20px;background:url(/resources/images/themeplace/engActivity/ico_info_down.jpg);}
.engActivity input[type="checkbox"]:checked + label:before,
.listInfoWrap input[type="checkbox"]:hover + label:before,
.listInfoWrap button:hover span{background-position:0 100%;}
/**/
.engActivity header{position:relative;height:230px;background-image:url(/resources/images/themeplace/engActivity/bg_sub.png);background-position:50% 0;background-repeat:no-repeat;}
.engActivity header:before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;display:block;inset:0;background:linear-gradient(to top, rgba(213, 251, 255, 0.71) 26%, rgba(93, 218, 232, 1) 100%);opacity:0.69;z-index:-1;}
.engActivity .topHeader{position:relative;display:flex;justify-content:space-between;align-items:center;width:1400px;height:60px;margin:0 auto;z-index:1;}
.engActivity .loginSet #loginBtn{display:block;padding:0 20px;background:#53565D;border-radius:75px;font-size:13px;font-weight:700;color:#fff;line-height:28px;text-align:center;}
.engActivity .loginSet .logout{display:flex;align-items:center;gap:0 12px;}
.engActivity .loginSet .logout .teacher{font-size:15px;font-weight:700;color:#53565D;}
.engActivity .topHeader .btnLink{position:absolute;top:60px;left:0;display:block;}
.engActivity .topHeader .btnIntro{top:67px;width:84px;height:105px;background:url(/resources/images/themeplace/engActivity/btn_guide.png) 0 0 no-repeat;}
.engActivity .topHeader .btnMain{width:124px;height:43px;background:url(/resources/images/themeplace/engActivity/btn_main.png) 0 0 no-repeat;}
.engActivity > .navWrap{background:#19ADBD;}
.engActivity > .navWrap ul{display:flex;}
.engActivity > .navWrap li{position:relative;flex:1;}
.engActivity > .navWrap li + li:before{content:'';position:absolute;top:20px;bottom:16px;left:-1px;display:block;width:1px;background:#BFDDF9;}
.engActivity > .navWrap a{position:relative;display:block;font-size:24px;color:#A3EEF6;text-align:center;line-height:71px;letter-spacing:-0.08em;}
.engActivity > .navWrap li.on a,
.engActivity > .navWrap a:hover{color:#fff;}
.engActivity > .navWrap li.on a:after,
.engActivity > .navWrap a:hover:after{content:'';position:absolute;left:50%;bottom:-10px;display:inline-block;border-top:12px solid #19ADBD;border-left:10px solid transparent;border-right:10px solid transparent;transform:translatex(-50%);}
.content .titWrap{margin-bottom:80px;border-bottom:1px solid #53565D;}
.content .titWrap h2{height:44px;margin:0 auto;background-position:0 0;background-repeat:no-repeat;}
.engActivity footer{height:122px;padding-top:40px;border-top:1px solid #e9e9ed;}
.engActivity footer .inner{display:flex;gap:52px;}
.engActivity footer .link{display:flex;gap:44px;}
.engActivity footer .link li{position:relative;}
.engActivity footer .link li + li:before{content:'';position:absolute;top:2px;left:-22px;display:block;width:1px;height:16px;background:#D1D1D1;}
.engActivity footer .infoTxt{display:flex;gap:15px;margin-top:8px;}
.engActivity footer a{font-family:'Nanum Gothic', '나눔고딕', sans-serif;font-weight:700;color:#666;}
.engActivity footer span{font-family:'Nanum Gothic', '나눔고딕', sans-serif;font-size:12px;font-weight:400;color:#777;}
/* MAIN */
.engActivity.main{overflow-x:hidden;min-width:1200px;}
.engActivity.main header{height:506px;background-image:url(/resources/images/themeplace/engActivity/bg_main.png);}
.engActivity.main header .titWrap{margin-top:305px;text-align:center;}
.engActivity.main header .titWrap p{font-size:20px;font-weight:500;color:#464D62;line-height:1.5;}
.engActivity .objWrap{position:absolute;top:0;bottom:0;left:50%;width:1200px;margin-left:-600px;}
.objWrap:before{content:'';position:absolute;top:0;left:105px;display:block;width:1px;height:54px;background:#77C0E2;}
.objWrap:after{content:'';position:absolute;top:0;right:134px;display:block;width:1px;height:42px;background:#77C0E2;}
.engActivity .objWrap > span{position:absolute;display:block;background-position:50% 50%;background-repeat:no-repeat;}
.objWrap .objPuz1{top:40px;left:34px;width:174px;height:174px;background-image:url(/resources/images/themeplace/engActivity/obj_puz1.png);animation:seesaw1 3s ease-in-out infinite alternate;transform-origin:71px 16px;}
.objWrap .objPuz2{top:40px;right:40px;width:199px;height:156px;background-image:url(/resources/images/themeplace/engActivity/obj_puz2.png);animation:seesaw2 3s ease-in-out infinite alternate;transform-origin:102px 0;}
.objWrap .objArr1{top:70px;left:300px;width:31px;height:149px;background-image:url(/resources/images/themeplace/engActivity/obj_arw1.png);animation:arrowUp 2s ease-in-out infinite;}
.objWrap .objArr2{top:236px;left:348px;width:31px;height:149px;background-image:url(/resources/images/themeplace/engActivity/obj_arw2.png);animation:arrowUp 2.2s ease-in-out infinite;}
.objWrap .objArr3{top:54px;right:299px;width:54px;height:262px;background-image:url(/resources/images/themeplace/engActivity/obj_arw3.png);animation:arrowUp 2.4s ease-in-out infinite;}
.objWrap .objPlus{top:168px;right:322px;left:auto;transform:none;display:block;width:96px;height:216px;}
.objWrap .objPlus:before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;background:linear-gradient(0deg, #FFF 0%, #FF1CCF 37%, #2820FF 82%);
    -webkit-mask-image:url(/resources/images/themeplace/engActivity/obj_arw_plus.png);
    -webkit-mask-repeat:no-repeat;
    -webkit-mask-position:center;
    -webkit-mask-size:contain;
    mask-image:url(/resources/images/themeplace/engActivity/obj_arw_plus.png);
    mask-repeat:no-repeat;
    mask-position:center;
    mask-size:contain;
    animation:filling 2s linear infinite;}
.objWrap .objPlus::after{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:url(/resources/images/themeplace/engActivity/obj_arw_plus_txt.png) no-repeat center;background-size:43px 113px;z-index:2;}

@keyframes seesaw1{
    0%{transform:rotate(0deg);}
    100%{transform:rotate(50deg);}
}
@keyframes seesaw2{
    0%{transform:rotate(0deg);}
    100%{transform:rotate(-30deg);}
}
@keyframes arrowUp{
    0%{transform:translateY(20px);opacity:0;}
    50%{opacity:1;}
    100%{transform:translateY(-20px);opacity:0;}
}
@keyframes filling {
    0%{clip-path: inset(100% 0 0 0);}
    100%{clip-path: inset(0 0 0 0);}
}
.engActivity.main .content{padding:20px 0 76px;}
.tabGrade{position:relative;}
.tabGrade .btnTabWrap{display:flex;gap:10px;margin-bottom:20px;}
.tabGrade .btnTabWrap .btnTab{display:flex;align-items:center;min-height:58px;padding:0 30px;background:#F3F3F3;border:1px solid #B8B8B8;border-radius:64px;font-size:22px;font-weight:600;color:#888;}
.tabGrade .btnTabWrap .btnTab.on,
.tabGrade .btnTabWrap .btnTab:hover{background:#FED456;border-color:#FED456;color:#252525;}
.engActivity .iframeWrap{overflow:hidden;width:100%;height:677px;border:2px solid #CACACA;border-radius:30px;}
.btnMyWrap{position:relative;margin-bottom:16px;display: flex;justify-content: flex-end;}
.btnMyWrap .btn_myList{border-radius:200px;width:170px;height:55px;color:#00B2E2;border:1px solid #00B2E2;font-size:16px;position:relative;}
.btnMyWrap .btn_myList:before,.btnMyWrap .btn_myList:after{content:"";display:inline-block;position:absolute;top:0;background: url(/resources/images/themeplace/engActivity/ico_book.png);}
.btnMyWrap .btn_myList:before{left:20px;margin-top:19px;background: url(/resources/images/themeplace/engActivity/ico_book.png);width:20px;height:20px;}
.btnMyWrap .btn_myList:after{right:20px;margin-top:21px;background: url(/resources/images/themeplace/engActivity/ico_arrow.png);width:16px;height:14px;}
.btnMyWrap .btnTooltip{position:absolute;top:-50px;right:0;background:url("/resources/images/themeplace/engActivity/ico_tooltip.png");width:170px;height:47px;font-family:'Pretendard', sans-serif;font-size:11px;font-weight:bold;color:#3C3C3C;display:flex;justify-content:center;margin-bottom:4px;line-height:42px;}

/* GUIDE */
.engActivity.guide .content{padding:65px 0 130px;border-top:16px solid #18B5C7;}
.tabWrap.tabGuide .btnTabWrap{display:flex;gap:29px;margin-bottom:30px;}
.tabWrap.tabGuide .btnTabWrap .btnTab{flex:1;display:flex;align-items:center;justify-content:center;position:relative;height:65px;background:#F3F3F3;border:1px solid #B8B8B8;border-radius:100px;font-size:22px;font-weight:600;color:#888;letter-spacing:-0.03em;}
.tabWrap.tabGuide .btnTabWrap .btnTab.on,
.tabWrap.tabGuide .btnTabWrap .btnTab:hover{background:#18B5C7;border-color:#18B5C7;color:#fff;}
.tabWrap.tabGuide .btnTabWrap .btnTab.on:after{content:'';position:absolute;left:50%;bottom:-12px;display:inline-block;border-top:12px solid #19ADBD;border-left:10px solid transparent;border-right:10px solid transparent;transform:translatex(-50%);}
.tabWrap.tabGuide .tabCont{text-align:center;}
.btnGuideLink{display:flex;align-items:center;justify-content:center;gap:14px;width:240px;height:65px;margin:37px auto 0;background:#2E2E2E;border-radius:5px;font-size:24px;font-weight:700;color:#fff;}
.btnGuideLink:after{content:'';border-top:11px solid transparent;border-bottom:11px solid transparent;border-left:17px solid #fff;}
.btnGuideLink:hover{color:#fff;}
.guide .content .titWrap{padding:135px 0 65px;}
.guide .content .titWrap h2{width:409px;background-image:url(/resources/images/themeplace/engActivity/bg_tit_recom.png);}
.tabWrap.tabRecom .btnTabWrap{display:flex;gap:10px;justify-content:center;margin-bottom:36px;}
.tabWrap.tabRecom .btnTabWrap .btnTab{display:flex;align-items:center;justify-content:center;width:227px;height:62px;background:#F3F3F3;border:1px solid #B8B8B8;border-radius:100px;font-size:22px;font-weight:600;color:#888;}
.tabWrap.tabRecom .btnTabWrap .btnTab.on,
.tabWrap.tabRecom .btnTabWrap .btnTab:hover{background:#18B5C7;border-color:#18B5C7;color:#fff;}
.tipWrap p,
.downWrap ul li{position:relative;padding-left:24px;font-size:16px;font-weight:400;}
.tipWrap p + p{margin-top:10px;}
.tipWrap .bulRound:before,
.downWrap ul li:before{content:'';position:absolute;top:11px;left:11px;display:inline-block;width:4px;height:4px;background:#53565D;border-radius:50%;}
.tipWrap .bulHypen:before{content:'-';position:absolute;top:0;left:10px;display:inline-block;}
.tipWrap + .tblWrap{margin-top:40px;}
.tblWrap + .tipWrap{margin-top:12px;}
.tblWrap{border:1px solid #E9E9ED;}
.tblWrap table{width:100%;}
.tblWrap th,
.tblWrap td{height:62px;border-top:1px solid #E9E9ED;border-right:1px solid #E9E9ED;font-size:18px;color:#494949;text-align:center;line-height:1.18;}
.tblWrap th{background:#F7F7F7;font-weight:700;text-align:center;}
.tblWrap thead th{height:60px;border-top:0;border-bottom:1px solid #424242;}
.tblWrap thead th:last-child,
.tblWrap tbody td:last-child{border-right:0;}
.tblWrap tbody td{padding:20px 0;}
.downWrap{display:flex;align-items:center;gap:20px;margin-top:80px;padding:60px 214px;background:#F7F7F7;}
.downWrap .downItem{text-align:center;}
.downWrap .downItem .qrImg{width:180px;height:180px;background:#ddd;}
.downWrap .downItem figcaption{margin-top:10px;font-size:18px;font-weight:600;color:#1E1E21;}
.downWrap ul li{color:#1E1E21;}
.downWrap ul li:before{background:#1E1E21;}
/* PHONICS, PRONUNCIATION (phonological) */
.phono .linkWrap{display:flex;justify-content:center;gap:26px;margin-top:36px;}
.phono .linkWrap .linkTab{width:416px;height:97px;background-position:50%;background-repeat:no-repeat;}
.phono .linkWrap .linkTab:nth-child(1){background-image:url(/resources/images/themeplace/engActivity/btn_tab01.png);}
.phono .linkWrap .linkTab:nth-child(1).on{background-image:url(/resources/images/themeplace/engActivity/btn_tab01_on.png);}
.phono .linkWrap .linkTab:nth-child(2){background-image:url(/resources/images/themeplace/engActivity/btn_tab02.png);}
.phono .linkWrap .linkTab:nth-child(2).on{background-image:url(/resources/images/themeplace/engActivity/btn_tab02_on.png);}
.categoryWrap{display:flex;width:1080px;margin:20px auto;padding:10px 0;border-top:1px solid #d9d9d9;border-bottom:1px solid #d9d9d9;}
.categoryWrap .searchCate{position:relative;padding:0 30px;font-size:20px;color:#888;letter-spacing:-0.06em;}
.categoryWrap .searchCate.on{font-weight:500;color:#222;}
.categoryWrap .searchCate + .searchCate:before{content:'';position:absolute;top:50%;left:0;display:block;width:1px;height:14px;background:#D9D9D9;transform:translateY(-50%);}
.phono .categoryWrap + .listInfoWrap{margin-top:20px;}
.phono .listInfoWrap{justify-content:right;}
.phono .listWrap{gap:32px 20px;}
.phono .listItem .itemThumb{height:160px;}
.phono .listItem .itemTxt{height:112px;}
.phono .listItem>a:hover .itemTxt p{text-decoration:underline;color:#00C7BE;}
.content .navWrap{position:relative;border-top:16px solid #18B5C7;border-bottom:1px solid #E9E9ED;}
.content .navWrap .tab1{position:relative;z-index:2;}
.content .navWrap .tab1:after{content:'';display:block;clear:both;}
.content .navWrap .tab1 > li{float:left;min-width:143px;height:60px;}
.content .navWrap .tab1 > li > .btnDepth01{position:relative;display:flex;align-items:center;padding:0 35px;border-right:1px solid #fff;border-left:1px solid #fff;font-size:18px;font-weight:500;color:#1E1E21;letter-spacing:-0.04em;line-height:3.33;}
.content .navWrap .tab2{overflow:auto;display:none;min-width:143px;height:220px;padding:16px 3px;background:#fff;border:1px solid #E9E9ED;z-index:1;}
.content .navWrap .tab1.on .tab2{display:block;}
.content .navWrap .tab2 li + li{margin-top:11px;}
.content .navWrap .tab2 li a{display:flex; align-items:center; width:100%;padding:0 35px;font-size:18px;font-weight:500;color:#9799a0;line-height:2.1112;letter-spacing:-0.04em; gap:5px;}
.content .navWrap .tab2 li a.on,
.content .navWrap .tab2 li a:hover{background:#f1f1f1;font-weight:500;color:#ff8125;}
.content .navWrap .tab1 > li:nth-child(n+1){margin-left:-1px;}
.content .navWrap .tab1 > li + li .btnDepth01{background:url(/resources/images/themeplace/engActivity/bg_nav.png) 0 50% no-repeat;}
.content .navWrap .tab1 > li:last-child > .btnDepth01:after{content:'';position:absolute;top:50%;right:10px;display:inline-block;width:14px;height:10px;margin-top:-5px;background:url(/resources/images/themeplace/engActivity/bg_nav_arr.png);vertical-align:middle;}
.content .navWrap .tab1.on > li:last-child > .btnDepth01:after{transform:rotate(180deg);}
.content .navWrap .tab1 > li:nth-child(1) .tab2{padding-left:16px;border-radius:0 0 0 8px;}
.content .navWrap .tab1 > li:nth-child(2) .tab2{border-left:0;}
.content .navWrap .tab1 > li:nth-child(3) .tab2{padding-right:16px;border-left:0;border-radius:0 0 8px 0;}
.subConWrap .btnTopWrap{display:flex;justify-content:space-between;margin:16px 0;}
.subConWrap .btnTopWrap > a,
.subConWrap .btnTopWrap > button{display:flex;align-items:center;justify-content:center;gap:4px;width:122px;height:43px;padding:0 18px;border:1px solid #18B6C7;border-radius:200px;font-size:16px;font-weight:400;line-height:43px;}
.btnTopWrap .btn_qr_share{margin:0;background:#18B6C7;color:#FFF;}
.btnTopWrap .btn_qr_share span{margin-right:0;background:url(/resources/images/themeplace/engActivity/ico_detail_share.png) 0 50% no-repeat;}
.btnTopWrap .btnFull{padding-left:18px;background:#FFF;color:#18B6C7;}
.btnTopWrap .btnFull:before{content:'';display:inline-block;width:15px;height:15px;background:url(/resources/images/themeplace/engActivity/ico_detail_full.png) 0 0 no-repeat}
.subConWrap .videoWrap{width:100%;height:675px;background:#686868;}
.phono .content .titWrap{padding:80px 0 30px;}
.phono .content .titWrap h2{width:260px;background-image:url(/resources/images/themeplace/engActivity/bg_tit_more.png);}
.subConWrap .btnBtmWrap{display:flex;justify-content:right;margin:24px 0 0;}
.btnBtmWrap .btnDown{width:169px;height:47px;padding:0 12px;background:url(/resources/images/themeplace/engActivity/ico_detail_down.png) right 12px center no-repeat #fff;border:1px solid #18B6C7;border-radius:8px;font-size:16px;font-weight:400;color:#18B6C7;text-align:left;}
.contMoreWrap{padding-bottom:85px;}
.contMoreWrap .listWrap{justify-content:center;}
/* WORD, EXPRESSION*/
.listInfoWrap{display:flex;align-items:center;justify-content:space-between;margin:40px 0 34px;}
.listInfoWrap .totalTxt{font-size:20px;font-weight:600;color:#53565D;}
.listInfoWrap .totalTxt strong{font:inherit;color:#09909E;}
.listInfoWrap .infoR{display:flex;align-items:center;gap:15px;}
.listWrap{display:flex;flex-wrap:wrap;gap:20px;}
.listWrap .listItem{overflow:hidden;width:285px;border:1px solid #E4E4E4;border-radius:16px;}
.listItem .itemThumb{overflow:hidden;position:relative;height:282px;background:#707070;}
.listItem>a .itemThumb img{transition-property:all;transition-duration:.3s;transition-timing-function:ease-out;width:100%;height:100%;}
.listItem>a:hover .itemThumb img{transform:scale(1.05,1.05);}
.listItem .itemThumb .chk{position:absolute;top:18px;left:18px;z-index:1;}
.listItem .itemThumb .btnLike{position:absolute;right:14px;bottom:22px;padding:11px;background:#fff;border-radius:100px;font-size:16px;font-weight:400;color:#43C6D5;z-index:1;}
.listItem .itemThumb .btnLike:before{content:'';display:inline-block;width:20px;height:19px;margin-right:3px;background:url(/resources/images/themeplace/engActivity/btn_like_off.png) 0 0 no-repeat;vertical-align:middle;}
.listItem .itemThumb .btnLike:hover:before,
.listItem .itemThumb .btnLike.on:before{background-image:url(/resources/images/themeplace/engActivity/btn_like_on.png);}
.listItem .hoverBox{display:none;position:absolute;inset:0;flex-direction:column;align-items:flex-end;justify-content:flex-start;gap:6px;padding:20px 14px;background:rgba(1,1,1,0.5);}
.listItem>a:hover .hoverBox{display:flex;}
.listItem .hoverBox > button{display:block;width:44px;height:44px;background-position:50% 50%;background-repeat:no-repeat;background-color:#FFFCD7;border-radius:50%;box-shadow:0px 4px 4px rgba(0, 0, 0, 0.25);}
.listItem .hoverBox .btnItemAdd{background-image:url(/resources/images/themeplace/engActivity/ico_add.png);}
.listItem .hoverBox .btnItemDown{background-image:url(/resources/images/themeplace/engActivity/ico_download.png);}
.listItem .hoverBox .btnItemShare{background-image:url(/resources/images/themeplace/engActivity/ico_share.png);}
.listItem .itemTxt{height:106px;padding:24px 22px;}
.listItem .itemTxt p{overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;text-overflow:ellipsis;word-break:break-word;font-size:20px;font-weight:600;color:#1E1E21;line-height:1.5;}
.btnMoreWrap{margin:70px auto 90px;}
.btnMoreWrap .btnMore{display:block;width:234px;height:50px;margin:0 auto;background:#fff;border:1px solid #18B5C7;border-radius:200px;font-family:'Pretendard', sans-serif;font-size:18px;font-weight:600;color:#18B5C7;}
.btnMoreWrap .btnMore:after{content:'';display:inline-block;width:22px;height:22px;margin-left:6px;background:url(/resources/images/themeplace/engActivity/btn_more.png) 50% 50% no-repeat;vertical-align:top;}