.rew2022 * {box-sizing: border-box; }
html, body{	line-height: inherit !important;color:#000!important;  }
#main_area{width:100%;		text-align:center!important;}
#middle_area  {width:1170px; margin:0 auto; margin-top:30px;}
#left_area{width:171px; float:left;}
#right_area{width:815px; float:right; width:956px;}
#bottom_area{width:100%;/*overflow:hidden;*/	margin-top:40px;	text-align:center;	}


h1, h2{font-family: 'NotoSans';}
.rew2022 h2{margin-bottom:0; font-weight:500;}
/*2022 멀티누리 리뉴얼 jy*/
.rew2022{font-family: 'Malgun Gothic', sans-serif; letter-spacing:-1px; line-height:1.6;}
.rew2022  a{ font-family: 'Malgun Gothic', sans-serif;	 color:#000; text-decoration:none;	}
.rew2022 .top_category{display:flex; justify-content: space-between; margin-top:20px;}
.rew2022 .top_category li{text-align:center; font-weight:bold;font-size:17px;}
.rew2022 .top_category li p{font-weight:normal; color:#999}
.rew2022 .top_category li a.active p{font-weight:bold; color:#000;}
.rew2022 .top_category li div{ background:url(//www.kidkids.net/eduinfo_new/multi/img/rew_2022_top_categ.png) 0 0 no-repeat;
    width:64px; height:64px; border-radius:50%; overflow:hidden;margin-bottom:4px;}
.rew2022 .top_category li:nth-child(2) div {background-position:-90px 0px;}
.rew2022 .top_category li:nth-child(3) div{background-position:-184px 0px;}
.rew2022 .top_category li:nth-child(4) div{background-position:-274px 0px;}
.rew2022 .top_category li:nth-child(5) div{background-position:-364px 0px;}
.rew2022 .top_category li:nth-child(6) div{background-position:-456px 0px;}
.rew2022 .top_category li:nth-child(7) div{background-position:-547px 0px;}
.rew2022 .top_category li:nth-child(8) div{background-position:-639px 0px;}
.rew2022 .top_category li:nth-child(9) div{background-position:-730px 0px;}
.rew2022 .top_category li:nth-child(10) div{background-position:-822px 0px;}
.rew2022 .top_category li:nth-child(11) div{background-position:-913px 0px;}
.rew2022 .top_category li:nth-child(12) div{background-position:-1003px 0px;}
.rew2022 .top_category li a:hover div, .rew2022 .top_category li a.active div{background-position-y:-98px;}

.rew2022 .top_category_tit{font-size:2.145rem; margin-bottom:5px; font-weight:bold;letter-spacing:-2px; margin-top:5vh; text-align:center;}
.rew2022 .category_menu{display:flex;align-items: center;  justify-content: center; flex-wrap: wrap;}
.rew2022 .category_menu li a{margin:5px; padding:7px 18px 8px; /*border:1px solid #e5e5e5; */border-radius:500px; background:#e5e5e5; display:inline-block;}
.rew2022 .category_menu li a:hover{background:#d9d9d9;}
.rew2022 .category_menu li a.active{background:#ffba00; color:#fff;}

.rew2022 .ellipsis{font-size:14px; margin-bottom:1.5vh;}
.rew2022 .se_con_area{display:flex;align-items: center;  justify-content:  flex-start; align-items:flex-start; flex-wrap: wrap; margin-left:-7px}
.rew2022 .se_con_area li{flex: 0 0 31.8%; margin:0 7px; margin-bottom:3vh; position:relative; }
.rew2022 .con_area_round{width:100%; margin:0 auto; padding-bottom:60%;  position:relative; overflow:hidden; border-radius:12px; margin-bottom:1.1vh}
.rew2022 .con_area_round img.vod_img	{position:absolute; top:0; left:0;width:100%; height:100%; text-align:center; object-fit: cover;
    -webkit-transform:scale(1); -moz-transform:scale(1); -ms-transform:scale(1); -o-transform:scale(1); transform:scale(1); -webkit-transition:.3s; -moz-transition:.3s; -ms-transition:.3s; -o-transition:.3s; transition:.3s;}
.rew2022 .con_area_round a:hover img.vod_img{-webkit-transform:scale(1.2); -moz-transform:scale(1.2); -ms-transform:scale(1.2); -o-transform:scale(1.2); transform:scale(1.2);}
.rew2022 .con_area_round a:hover img.vod_img{-webkit-transform:scale(1.2); -moz-transform:scale(1.2); -ms-transform:scale(1.2); -o-transform:scale(1.2); transform:scale(1.2);}
.rew2022 h5{font-size:0.938rem; margin-bottom:0.2vh;}
.rew2022 .play{position:absolute; bottom:5px ; right:10px; width:51px;}

.rew2022 .section_n{margin-top:5vh}
.rew2022 .ellipsis {  overflow: hidden;  text-overflow: ellipsis;  display: -webkit-box;  -webkit-line-clamp: 2;  -webkit-box-orient: vertical;}
.rew2022 .btn{border-radius:500px; background:#fff; padding:3px 13px ; font-size:13px; color:#ff6c00; margin:0.3vh 0; display:inline-block;  border:1px solid #ff6c00;}
.rew2022 a:hover.btn{background:#ff6c00; color:#fff}

#planpopup{width:100%; height:100%; background:#ff7800;  position:absolute; border-radius:12px; top:0; left:0; padding:15px 20px;color:#fff; }
#planpopup .planpopup_area{position:relative;  height:100%}
#planpopup .planpopup_area .planpopup_area_aaaa{overflow-y: auto; height:73%; line-height:1.3   }
#planpopup .planpopup_area .planpopup_area_aaaa::-webkit-scrollbar {    width: 6px;  }
#planpopup .planpopup_area .planpopup_area_aaaa::-webkit-scrollbar-thumb {    background-color: #fff;    border-radius: 10px;    background-clip: padding-box;    border: 2px solid transparent;  }
#planpopup .planpopup_area .planpopup_area_aaaa::-webkit-scrollbar-track {    background-color: fff;    border-radius: 10px;    box-shadow: inset 0px 0px 5px white;  }




#planpopup h3{border-bottom:1px  dotted #fff;  margin-bottom:1.3vh; padding-bottom:0.5vh; font-size:16px;}
#planpopup p{ display: inline-block; width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#planpopup p::before{content:'•'; margin-right:5px;}
#planpopup .planpopup_area .close{position:absolute; top:0px; right:0px; cursor:pointer;}
#planpopup a{color:#fff;font-size:14px;}
#planpopup a:hover{text-decoration:underline;}

/*4개*/
.rew2022 .se_con_area.se_con_area_4 li{flex: 0 0 23.5%; }


/*페이지넘버링*/
.page_control_area{text-align:center; margin-top:2vh}
.page_control{margin:0 auto; text-align:center; display:inline-block;}
.page_control a.arrbtn{    float: left;    background-color: #fff;    border: 1px solid #dae1e6; }
.page_control .btn_next:before{  display: inline-block;    width: 5px;    height: 9px;    background-position: -57px -54px;    background-repeat: no-repeat;    vertical-align: top;
    content: '';    margin: 9px 10px 9px 12px; }
.page_control .btn_prev:before{display: inline-block;    width: 5px;    height: 9px;    background-position: -71px -54px;    background-repeat: no-repeat;    vertical-align: top;
    content: '';    margin: 9px 12px 9px 10px; }
.page_control .btn_next:before, 	.page_control .btn_prev:before{background-image: url(https://s.pstatic.net/static/www/img/uit/2021/sp_shop_bffdc9.png);
    -webkit-background-size: 107px 78px;    background-size: 107px 78px;    background-repeat: no-repeat;}
.page_control .numberarea{display:inline-block; float:left; margin:0 10px;}
.page_control .numberarea li{float:left;  font-size:14px;}
.page_control .numberarea li:before{content:'l'; color:#e5e5e5; margin:0 7px;}
.page_control .numberarea li:first-child:before{display:none;}
.page_control .numberarea li a:hover{color:#ff7800;}
.page_control .numberarea li a.active{color:#ff7800;font-weight:bold;}

/*오른쪽 날개 영역*/
#floating_pro{ right:22px;position:relative;}
#floating_pro .floating_pro_area{position:relative;     height: 114px;}
#floating_pro .floating_name{ float:left; margin-right:5px;}
.floating_pani{position:; float:left;}
.floating_pani .panibody{position:absolute; width:63px; height:144px;}
.floating_pani .paniarm{position:absolute; top:80px; right:-9px;}

#floating_pro_popup{width:150px;position:fixed; /* top:284px; - 작업시 높이 사용*/  top:250px; right:0px;font-family: 'Malgun Gothic', sans-serif;  text-align:center; letter-spacing:-1px}
#floating_pro_popup .flpro_popuptit{background:#1a1a15; color:#fff; padding: 25px 15px 10px; position:relative;}
.floating_pro_popup_close{position:absolute; top:-25px; left:50%; transform: translate(-50%, 0%);}
#floating_pro_popup .flpro_popuptit h3{font-size:15px; font-weight:bold; letter-spacing:-1px; margin-bottom:5px;}
#floating_pro_popup .flpro_popuptit p{font-size:13px; font-weight:300; }

#floating_pro_popup .flpro_popuplist	{ border:1px solid #e5e5e5;  background:#fff; position:absolute;}
#floating_pro_popup .flpro_popuplist ul	{padding:5px 15px 15px; border-top:1px solid #e5e5e5; border-bottom:1px solid #e5e5e5;}
#floating_pro_popup .flpro_popuplist ul  h5{    width: 100%;    white-space: nowrap;    overflow: hidden;    text-overflow: ellipsis; font-size:13px; font-weight:normal;}
#floating_pro_popup .flpro_popuplist li{width:118px!important;   margin-top:10px;}
#floating_pro_popup .flpro_popuplist li  .con_area_round{ border-radius:6px; margin-bottom:5px;}
#floating_pro_popup .flpro_popuplist li  .con_area_round .play{position:absolute; bottom:26px ; right:5px; width:34px;}
#floating_pro_popup .floating_pro_popup_ar{width:100%; display:inline-block; background:#f7f7f7;height:25px; line-height:25px;}
#floating_pro_popup .floating_pro_popup_ar a{ display:inline-block; width:20px; height:8px; background-position:0 0 ; font-size:0;}
#floating_pro_popup .floating_pro_popup_ar a.bx-prev{background:url(//www.kidkids.net/eduinfo_new/multi/img/floating_pro_popup_ar_prev.png) no-repeat;}
#floating_pro_popup .floating_pro_popup_ar a.bx-next{background:url(//www.kidkids.net/eduinfo_new/multi/img/floating_pro_popup_ar_next.png) no-repeat; }
#floating_pro_popup .floating_pro_popup_ar a:hover{background-position-y:-20px;}

.modal_content{display:none;}


#player_focus_vod{width:900px; background:#121212; color:#fff;  padding:15px; padding-bottom:10px;     font-family: 'Malgun Gothic' !important; position:relative;}
#player_focus_vod h4{font-size:16px;font-weight:bold; text-align:left;letter-spacing:-1px; display:inline-block;}
#player_focus_vod h4 img{position:relative; top:6px; margin-right:3px;}
#player_focus_vod .bx-wrapper .bx-loading{display:none;}
#player_focus_vod .bx-wrapper .bx-viewport{background:none; height:auto!important; box-shadow: 0 0 0px #ccc;    border: 0px solid #fff;    left: 0px;}
#player_focus_vod li {width:120px!important;position:relative; margin:10px 7px; }
#player_focus_vod li a{display:inline-block; position:relative; margin-bottom:3px; }
#player_focus_vod li .vod_img{height:78px;      border-radius: 5px;}
#player_focus_vod li p{font-size:13px; color:#fff; text-align:center;     font-family: 'Malgun Gothic' !important;}
#player_focus_vod .play{position:absolute; width:40px; height:40px; right:auto; left:50%; bottom:auto; top:50%; transform: translate(-50%, -50%);}
#player_focus_vod .bx-wrapper .bx-controls-direction a{width:20px; height:19px; top: 0; }
#player_focus_vod .bx-wrapper .bx-prev{background:url(//www.kidkids.net/img/main2014/140626_magazine_left_on.png); left:auto; right:20px;}
#player_focus_vod .bx-wrapper .bx-next{background:url(//www.kidkids.net/img/main2014/140626_magazine_right_on.png);right:0;}
.player_focus_vod_arrow_off{display:inline-block; background:url(//www.kidkids.net/eduinfo_new/multi/img/player_focus_vod_arrow_off.png);width:19px; height:12px;  position:absolute;left:50%;margin-top:5px}
.player_focus_vod_arrow_on{background:url(//www.kidkids.net/eduinfo_new/multi/img/player_focus_vod_arrow_on.png);}
.player_focus_vod_arrow:hover{background-position-y:-20px;}

#floating_pro_popup .flpro_popuplist	.bx-wrapper .bx-viewport	{height:360px !important;}

@media screen and (max-width: 768px){

    #left_area, #floating_pro_popup, #floating_pro, .topnav_area {display:none;}
    #right_area{width:90%; float:none; margin:0 auto;}

    .rew2022 .top_category_tit{font-size:1.5rem; margin-bottom:0;}
    .rew2022 .top_category li div{display:none;}
    .rew2022 .top_category li{border:1px solid #e5e5e5; flex:0 0 16%; font-size:15px; padding:5px;}
    .rew2022 .top_category {flex-wrap: wrap; margin-top:4px;}
    .rew2022 .top_category li:nth-child(n+7){margin-top:3px;}
    .rew2022 h2{ margin:0; margin-bottom:3px;}
    .rew2022 .play{width:40px}

    .rew2022 .category_menu li a{    padding: 5px 18px; margin: 3px;}
    .rew2022 .se_con_area{justify-content: space-between; margin-left:0;}
    .rew2022 .se_con_area li, .rew2022 .se_con_area.se_con_area_4 li {    flex: 0 0 47%;margin-left:0; margin-right:0;}
    .popup-wrap{  background-color:rgba(0,0,0,.3);   justify-content:center;   align-items:center;      position:fixed;          top:0;  left:0;  right:0; bottom:0;  display:none; z-index:99}
    #planpopup{padding:20px; width:90%;    top: 50%;    left: 50%;     transform: translate(-50%, -50%); height:auto;  box-shadow: 5px 10px 10px 1px rgba(0,0,0,.2); }

    #planpopup .planpopup_area .planpopup_area_aaaa{overflow-y: auto; height:100%; line-height:1.6   }
    .play{width:30px;}


}


.dungdung{animation:ani 0.7s infinite alternate;   display:inline-block; margin-bottom:20px;   position: fixed;    top: 205px;    right: 0}
#floating_pro_popup{top: 390px;}
#floating_pro_popup .flpro_popuplist{    top: 95px;}


@keyframes ani{
    0%{transform:translate(0,0);}
    100%{transform:translate(0,18px);}
}