@charset "utf-8";
@import url("font.css");
/* style reset */

body {overflow-x: auto; position: relative; margin: 0; width:100%; color: #666; font-size: 16px; font-family:'Noto Sans KR', sans-serif; font-weight: 400; line-height: 26px; padding: 0 !important;}

.transparents-layer {display: none;}

button {transition:all 0.3s; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; -o-transition:all 0.3s;}
.btn {width: 150px; height: 55px; font-weight: 500;}
.btn2 {width: 65px; height: 30px; font-size: 14px; font-weight: 500;}
.btn3 {width: 100px; height: 45px; font-size: 15px; font-weight: 500;}
.btn4 {width: 63px; height: 23px; font-size: 13px;}
.btn5 {width: 32px; height: 32px; border: 1px solid #d3d5da; background-color: #fff; background-repeat: no-repeat; background-position: center center;}
.btn_check {width: 110px; height: 35px;}
.btn_check span {padding-right: 25px; background-repeat: no-repeat; background-position: right center; background-image: url('../../images/web/icon_check2.png');}
.btn_view {width: 68px; height: 30px; font-size: 14px;}
.btn_view span {position: relative; padding-left: 21px;}
.btn_view span::after, .btn_view span::before {content: ''; position: absolute;}
.btn_view span::after {left: 0; top: 4px; width: 9px; height: 9px; border: 1px solid #2095d3; border-radius: 100%;}
.btn_view span::before {left: 8px; bottom: 5px; width: 6px; height: 1px; background-color: #2095d3; transform: rotate(45deg);}
.btn_agree {padding: 0 14px; height: 30px; color: #333; font-size: 14px; border: 1px solid #2194d3;}
.btn_agree span {position: relative; padding-right: 25px;}
.btn_agree span::after, .btn_agree span::before {content: ''; position: absolute;}
.btn_agree span::after {top: 50%; right: 0; width: 14px; height: 1px; background-color: #2194d3;}
.btn_agree span::before {top: 6px; right: 0; width: 8px; height: 8px; border-top: 1px solid #2194d3; border-right: 1px solid #2194d3; transform: rotate(45deg);}
.btn_more {padding: 0 15px; height: 45px; color: #2d93d1; font-size: 14px; font-weight: 500; border: 1px solid #2d93d1;}
.btn_more span {position: relative; padding-right: 23px; display: block;}
.btn_more span::after, .btn_more span::before {content: ''; position: absolute; right: 0; top: 50%; width: 11px; height: 1px; background-color: #2d93d1;}
.btn_more span::before {transform: rotate(90deg);}
.btn_list {background-image: url('../../images/web/icon_list.png');}
.btn_prev {background-image: url('../../images/web/icon_prev.png');}
.btn_bookmark {background-image: url('../../images/web/icon_bookmark.png');}
.btn_download {padding: 0 20px; height: 45px; font-size: 15px; font-weight: 500; word-break: keep-all;}
.btn_download span {padding-right: 28px; background-repeat: no-repeat; background-position: right center; background-image: url('../../images/web/icon_download2.png');}
.btn_share {position: relative; width: 19px; height: 20px; background-repeat: no-repeat; background-position: center center; background-image: url('../../images/web/icon_share.png');}
.btn_share::after, .btn_share::before {content: ''; position: absolute; left: -3px; top: calc(50% - 1px); width: 25px; height: 2px; background-color: transparent; transition:all 0.3s; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; -o-transition:all 0.3s;}
.btn_share.active {background-image: none;}
.btn_share.active::after, .btn_share.active::before {background-color: #777;}
.btn_share.active::after {transform: rotate(45deg);}
.btn_share.active::before {transform: rotate(-45deg);}

.bg_blue {color: #fff; background-color: #2194d3;}
.bg_gray {color: #fff; background-color: #717c82;}
.bg_gray2 {color: #fff; background-color: #444;}
.bg_white {color: #2194d3; border: 1px solid #2194d3;}
.bg_white2 {color: #666; border: 1px solid #ccc;}
.bg_white3 {color: #333; border: 1px solid #333;}
.bg_white4 {color: #444; border: 1px solid #444; background-color: #fff;}

.color_blue {color: #2194d3 !important;}
.color_red {color: #fa0000 !important;}
.color_gray {color: #999 !important;}
.color_gray3 {color: #333 !important;}
.color_orange {color: #fc701c !important;}

.f_b {font-weight: 600 !important;}
.f_m {font-weight: 500 !important;}
.f_n {font-weight: 400 !important;}
.p_r {position: relative !important;}

u {text-underline-position: under;}

.web_only {display: block !important;}
.web_flex_only {display: flex !important;}
.mobile_only {display: none !important;}
.mobile_flex_only {display: none !important;}
.d_block {display: block !important;}
.d_inblock {display: inline-block !important;}
.d_none {display: none !important;}
.d_table {display: table !important;}
.d_intable {display: inline-table!important;}
.d_cell {display: table-cell !important; text-align: center; vertical-align: middle}

.padding0 {padding: 0 !important;}
.margin0 {margin: 0 !important;}
.mt60 {margin-top:60px !important}
.mt50 {margin-top:50px !important}
.mt45 {margin-top:45px !important}
.mt40 {margin-top:40px !important}
.mt30 {margin-top:30px !important}
.mt20 {margin-top:20px !important}
.mt15 {margin-top:15px !important}
.mt10 {margin-top:10px !important}
.mt5 {margin-top:5px !important}
.mb2 {margin-bottom:2px !important}
.mb5 {margin-bottom:5px !important}
.mb10 {margin-bottom:10px !important}
.mb15 {margin-bottom:15px !important}
.mb20 {margin-bottom:20px !important}
.mb25 {margin-bottom:25px !important}
.mb30 {margin-bottom:30px !important}
.mb35 {margin-bottom:35px !important}
.mb40 {margin-bottom:40px !important}
.mb45 {margin-bottom:45px !important}
.mb50 {margin-bottom:50px !important}
.mb55 {margin-bottom:55px !important}
.mb60 {margin-bottom:60px !important}
.mr5 {margin-right:5px !important}
.mr10 {margin-right:10px !important}
.mr15 {margin-right:15px !important}
.mr20 {margin-right:20px !important}
.mr25 {margin-right:25px !important}
.mr30 {margin-right:30px !important}
.mr35 {margin-right:35px !important}
.mr60 {margin-right:60px !important}
.ml5 {margin-left:5px !important}
.ml10 {margin-left:10px !important}
.ml20 {margin-left:20px !important}
.ml30 {margin-left:30px !important}
.pl10 {padding-left:10px !important}
.pl15 {padding-left:15px !important}
.pl20 {padding-left:20px !important}
.pl30 {padding-left:30px !important}
.pl40 {padding-left:40px !important}
.pl60 {padding-left:60px !important}
.pt10 {padding-top:10px !important}
.pt15 {padding-top:15px !important}
.pt20 {padding-top:20px !important}
.pt30 {padding-top:30px !important}
.pt33 {padding-top:33px !important}
.pt40 {padding-top:40px !important}
.pt50 {padding-top:50px !important}
.pb10 {padding-bottom:10px !important}
.pb40 {padding-bottom:40px !important}
.w50 {width: 50px !important;}
.w60 {width: 60px !important}
.w100 {width: 100px !important}
.w120 {width: 120px !important}
.w200 {width: 200px !important}
.w300 {width: 300px !important}
.w400 {width: 400px !important}
.w_25 {width: 25% !important}
.w_30 {width: 30% !important}
.w_35 {width: 35% !important}
.w_45 {width: 45% !important}
.w_100 {width: 100% !important}

.f_12 {font-size: 12px !important;} 
.f_13 {font-size: 13px !important;} 
.f_14 {font-size: 14px !important;} 
.f_18 {font-size: 18px !important;} 

.al {text-align: left !important;}
.ac {text-align: center!important;}
.ar {text-align: right!important;}
.vt {vertical-align: top!important;}
.vm {vertical-align: middle!important;}
.vb {vertical-align: bottom!important;}

.cl_bo {clear: both !important;}
.f_left {float: left !important;}
.f_right {float: right !important;}
.over_h {overflow: hidden !important;}
.wb_keep {word-break: keep-all !important;}

dl.skipnavi {position:relative;z-index: 500;}
dl.skipnavi dt {display:none}
dl.skipnavi dd a {position:absolute; left:0; top:-50px; font-size:0}
dl.skipnavi dd a:active, dl.skipnavi dd a:focus {display:block; left:0; top:0; z-index:51; width:400px; height:30px; padding-top:9px; text-align:center; background:#333; line-height:14px; text-decoration:none; color:#fff; font-size:12px; font-weight:bold}

/*서브공통*/
.contents_title {}
.contents_title h3 {margin-bottom: 25px; color: #333; font-size: 26px; font-weight: 600;}
.contents_title h4 {margin-bottom: 20px; color: #333; font-size: 20px; line-height: 20px;}
.contents_title h5 {margin-bottom: 10px; color: #333; font-size: 16px; line-height: 20px;}
.board_title {margin-bottom: 10px;}
.board_title h3 {color: #333; font-size: 20px;}
.division_box {}
.list_type {}
.list_type > li {position: relative; padding-left: 10px;}
.list_type > li::before {content: ''; position: absolute; left: 0; top: 11px; width: 4px; height: 4px; background-color: #2d93d1;}
.list_type.gray > li::before {background-color: #bfbfbf;}
.list_type2 > li {padding-left: 10px; background-repeat: no-repeat; background-position: 0 11px; background-image: url('../../images/web/icon_dot.png');}
.list_type3 {padding-left: 10px;}
.list_type3 > li {text-indent: -10px;}
.list_type4 > li {position: relative; padding-left: 10px;}
.list_type4 > li::after {content: ''; position: absolute; left: 0; top: 13px; width: 2px; height: 2px; background-color: #555;}
.num_list {padding-left: 18px;}
.num_list > li {list-style: decimal;}
.num_list2 {counter-reset: num;}
.num_list2 > li {position: relative; padding-left: 20px;}
.num_list2 > li::before {content: counter(num) " )"; counter-increment: num 1; position: absolute; left: 0; width: 16px; letter-spacing: -1px;}
.num_list3 {counter-reset: num;}
.num_list3 > li {position: relative; padding-left: 22px;}
.num_list3 > li::before {content: counter(num); counter-increment: num 1; position: absolute; top: 6px; left: 0; width: 16px; height: 16px; font-size: 12px; text-align: center; line-height: 15px; border: 1px solid #b7b7b7; border-radius: 100%;}
.num_list4 {counter-reset: num;}
.num_list4 > li {position: relative; padding-left: 22px;}
.num_list4 > li::before {content: "("counter(num) ")"; counter-increment: num 1; position: absolute; left: 0; width: 16px; letter-spacing: -1px;}
.num_list5 {}
.num_list5 > li {position: relative; padding-left: 22px;}
.num_list5 > li::before {content: 'Ⅰ.'; position: absolute; left: 0; top: 0; letter-spacing: -3px;}
.hangul_list {padding-left: 23px;}
.hangul_list > li {list-style: hangul;}
.box_type {padding: 25px 30px; border: 1px solid #e1e1e1;}
.box_type2 {overflow: hidden; position: relative; margin-bottom: 50px; padding: 25px; color: #333; font-size: 22px; font-weight: 500; line-height: 34px; text-align: center; border: 1px solid #bedef1;}
.box_type2::after, .box_type2::before {content: ''; position: absolute; top: calc(50% - 25px); width: 68px; height: 50px; background-repeat: no-repeat; background-position: center center; background-image: url('../../images/web/icon_point.png'); background-size: 100%;}
.box_type2::after {left: 70px;}
.box_type2::before {right: 70px; transform: scaleX(-1);}
.box_type3 {padding: 15px 20px; background-color: #f9f9f9;}
.img_box {text-align: center;}
.img_box img {max-width: 100%;}
.point_box {}
.point_box span {position: relative; padding-left: 10px; display: inline-block;}
.point_box span::before {content: '*'; position: absolute; left: 0; top: 3px; color: #fd0000;}

.midarea {position: relative; min-height: calc(100vh - 296px);}
.lnb_area {border-bottom: 1px solid #ededed;}
.lnb_area .lnb {margin: 0 auto; width: 1200px; display: flex; display:-webkit-flex; border-left: 1px solid #ededed;}
.lnb_area .lnb > li {position: relative; border-right: 1px solid #ededed;}
.lnb_area .lnb li a {position: relative; padding: 0 40px 0 20px; display: block; min-width: 210px; color: #333; line-height: 60px;}
.lnb_area .lnb > li > a::after, .lnb_area .lnb > li > a::before {content: ''; position: absolute; right: 20px; top: calc(50% - 1px); width: 12px; height: 2px; background-color: #777; transition:all 0.3s; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; -o-transition:all 0.3s;}
.lnb_area .lnb > li > a::before {transform: rotate(90deg);}
.lnb_area .lnb > li.open > a::before {transform: rotate(0deg);}
.lnb_area .lnb li .dropdown-menu {z-index: 90; position: absolute; left: -1px; top: 60px; padding: 10px 0; display: none; border: 1px solid #ededed; background-color: #fff;}
.lnb_area .lnb li .dropdown-menu li a {padding: 8px 20px; line-height: 20px;}
.lnb_area .lnb li .dropdown-menu li:hover a {background-color: #f4f6f7;}
.lnb_area .lnb li.open .dropdown-menu {display: block;}
.lnb_area .lnb li.home a {padding: 0; min-width: 70px; height: 60px; background-repeat: no-repeat; background-position: center center; background-image: url('../../images/web/nav_home.png');}
.lnb_area .lnb li.home a::after, .lnb_area .lnb li.home a::before {display: none;}
.midarea .btn_share {position: absolute; right: 50px; top: 20px;}
.midarea .list_share {overflow: hidden; position: absolute; top: 70px; right: 50px; display: none;}
.midarea .list_share li {margin-left: 10px; float: left;}
.midarea .list_share li a {display: block;}
.midarea .list_share li a img {}

.contentsarea {margin: 0 auto; padding: 70px 0; width: 1200px;}
.contentsarea .sub_title {margin-bottom: 50px; text-align: center;}
.contentsarea .sub_title h2 {color: #222; font-size: 40px; line-height: 40px; font-weight: 600; font-family: 'Nanum Square', sans-serif;}

/*NCCW란*/
.con1_1 {text-align: center; word-break: keep-all;}
.con1_1::before {content: ''; z-index: 38; position: absolute; left: 0; top: 347px; width: 100%; height: 480px; background-color: #f7f7f7;}
.con1_1 .box {z-index: 40; position: relative; padding-top: 45px;}
.con1_1 .title_box {margin-bottom: 20px;}
.con1_1 .title_box h3 {margin-bottom: 10px; font-size: 30px; line-height: 30px;}
.con1_1 .title_box h3 span {color: #000;}
.con1_1 img {margin-top: 45px; max-width: 100%;}
/*보육과정 컨설팅 소개*/
.con3 .box {margin-bottom: 35px;}
.con3 .box .list_type > li, .con3 .box .list_type4 > li {margin-bottom: 10px;}
.con3 .box .list_type > li:last-child, .con3 .box .list_type4 > li:last-child {margin-bottom: 0;}
.con3 .box2 {margin-bottom: 50px; padding: 55px 40px 55px 520px; word-break: keep-all; background-repeat: no-repeat; background-position: left center; background-size: contain; background-image: url('../../images/web/img_con3_1.png'); background-color: #f5f5f5;}
.con3 .box2 h3 {margin-bottom: 30px; color: #000; font-size: 34px; line-height: 34px;}
.con3 .box4 {margin-bottom: 35px;}
.con3 .box4 .list {display: flex; display:-webkit-flex; justify-content: space-between; align-items: center;}
.con3 .box4 .list dl {width: calc(16.66% - 40px); height: 90px; border: 1px solid #2d93d1;}
.con3 .box4 .list dl dt, .con3 .box4 .list dl dd {display: flex; display:-webkit-flex; justify-content: center; align-items: center; width: 100%; height: 44px; text-align: center; line-height: 20px; word-break: keep-all;}
.con3 .box4 .list dl dt {color: #fff; font-weight: 500; background-color: #2d93d1;}
.con3 .box4 .list .arrow {position: relative; width: 26px; height: 28px;}
.con3 .box4 .list .arrow::after, .con3 .box4 .list .arrow::before {content: ''; position: absolute;}
.con3 .box4 .list .arrow::after {left: 0; top: calc(50% - 6px); width: 12px; height: 12px; background-color: #dcdcdc;}
.con3 .box4 .list .arrow::before {right: 0; top: calc(50% - 14px); width: 0; height: 0; border-top: 14px solid transparent; border-bottom: 14px solid transparent; border-left: 14px solid #dcdcdc;}
.con3 .box4 .list dl.finish dd {height: 100%; color: #2d93d1; font-weight: 500;}
.con3 .box5 .list_type {margin-bottom: 10px;}
.con3 .box6 .list > li {position: relative; padding-bottom: 30px; display: flex; display:-webkit-flex; justify-content: center;}
.con3 .box6 .list > li:first-child {padding-bottom: 20px;}
.con3 .box6 .list > li:last-child {padding-bottom: 0; padding-top: 30px; justify-content: space-between;}
.con3 .box6 .list > li dl {z-index: 42; position: relative; width: 390px; border: 1px solid #2d93d1; background-color: #fff;}
.con3 .box6 .list > li:last-child dl {width: 25%;}
.con3 .box6 .list > li:last-child dl:first-child {width: calc(50% - 40px);}
.con3 .box6 .list > li dl::after {content: ''; z-index: 41; position: absolute; left: 50%; bottom: -31px; width: 1px; height: 30px; background-color: #d9d9d9;}
.con3 .box6 .list > li:last-child dl::after {top: -31px; bottom: 0;}
.con3 .box6 .list > li:last-child dl::before {content: ''; z-index: 41; position: absolute; top: -31px; height: 1px; background-color: #d9d9d9;}
.con3 .box6 .list > li:last-child dl:nth-child(1)::before {left: 50%; width: 50%;}
.con3 .box6 .list > li:last-child dl:nth-child(2)::before {left: -25px; width: calc(100% + 50px);}
.con3 .box6 .list > li:last-child dl:nth-child(3)::before {right: 50%; width: 50%;}
.con3 .box6 .list > li dl dt {color: #017eca; font-size: 18px; font-weight: 500; line-height: 45px; text-align: center; background-color: #eff8fd;}
.con3 .box6 .list > li dl dd {padding: 15px 20px; display: flex; display:-webkit-flex; justify-content: space-between;}
.con3 .box6 .list > li dl dd .slist {display: flex; display:-webkit-flex; flex-wrap:wrap; -webkit-flex-wrap:wrap; width: calc(50% - 10px);}
.con3 .box6 .list > li dl dd .slist h4 {margin-bottom: 4px; color: #017eca;}
.con3 .box6 .list > li dl dd .slist .list_type {padding: 5px 10px; height: calc(100% - 30px); background-color: #f9f9f9;}
.con3 .box7 .list {display: flex; display:-webkit-flex; flex-wrap:wrap; -webkit-flex-wrap:wrap; justify-content: space-between; align-items: stretch; width: 100%; height: 100%;}
.con3 .box7 .list dl {width: 30%; border: 1px solid #2d93d1;}
.con3 .box7 .list dl dt {width: 100%; line-height: 44px; color: #fff; font-weight: 500; text-align: center; background-color: #2d93d1;}
.con3 .box7 .list dl dd {padding: 15px 20px; width: 100%; word-break: keep-all;}
.con3 .box7 .list dl dd .list_type {height: 100%;}
.con3 .box7 .list .arrow {position: relative; width: 26px;}
.con3 .box7 .list .arrow::after, .con3 .box7 .list .arrow::before {content: ''; position: absolute;}
.con3 .box7 .list .arrow::after {left: 0; top: calc(50% - 6px); width: 12px; height: 12px; background-color: #dcdcdc;}
.con3 .box7 .list .arrow::before {right: 0; top: calc(50% - 14px); width: 0; height: 0; border-top: 14px solid transparent; border-bottom: 14px solid transparent; border-left: 14px solid #dcdcdc;}
.con3 .box7 .list dl.finish dd {height: 100%; color: #2d93d1; font-weight: 500;}
/*보육과정 교육*/
.con4 .box {margin-bottom: 35px;}
.con4 .box1 {margin-bottom: 50px; padding: 55px 40px 55px 520px; word-break: keep-all; background-repeat: no-repeat; background-position: left center; background-size: contain; background-image: url('../../images/web/img_con4_1.jpg'); background-color: #efeff1;}
.con4 .box1 h3 {margin-bottom: 30px; color: #000; font-size: 34px; line-height: 34px;}
.con4 .box2 .list {margin-bottom: 10px; display: flex; display:-webkit-flex; justify-content: space-between; align-items: stretch;}
.con4 .box2 .list > dl {width: calc(50% - 10px);}
.con4 .box2 .list > dl > dt {color: #fff; font-size: 18px; font-weight: 500; line-height: 45px; text-align: center; background-color: #2d93d1;}
.con4 .box2 .list > dl > dd {padding: 25px 30px; height: calc(100% - 45px); border: 1px solid #e1e1e1; border-top: 0;}
.con4 .box2 .list > dl > dd h5 {margin-bottom: 10px; color: #333; font-size: 16px;}
.con4 .box2 .list > dl > dd .slist dl {display: flex; display:-webkit-flex;}
.con4 .box2 .list > dl > dd .slist dl dt {margin-bottom: 5px; width: 75px; height: 27px; color: #2d93d1; font-size: 15px; text-align: center; line-height: 25px; border: 1px solid #8dc5e7;}
.con4 .box2 .list > dl > dd .slist dl dd {margin-bottom: 5px; padding-left: 10px; width: calc(100% - 75px);}
.con4 .box3 .list {display: flex; display:-webkit-flex;}
.con4 .box3 .list li {margin-right: 45px; text-align: center;}
.con4 .box3 .list li:last-child {margin-right: 0;}
.con4 .box3 .list li img {margin-bottom: 20px;}

/*표준보육과정*/
.childcare_course_area {position: relative;}
.childcare_course_area .contents_title {position: relative;}
.childcare_course_area .contents_title .title {padding: 19px 120px 19px 20px; margin-bottom: 50px; display: flex; display:-webkit-flex; line-height: 20px; background-color: #fcfcfc; border: 1px solid #e0e0e0;}
.childcare_course_area .contents_title .title h4 {margin-bottom: 0; margin-right: 10px; padding-right: 10px; border-right: 1px solid #d3d3d3;}
.childcare_course_area .contents_title .title .nav_list {display: flex; display:-webkit-flex; flex-wrap:wrap; -webkit-flex-wrap:wrap; align-items: flex-end;}
.childcare_course_area .contents_title .title .nav_list li {position: relative; padding-right: 12px; font-size: 14px; line-height: 16px; background-repeat: no-repeat; background-position: right 4px center; background-image: url('../../images/web/icon_arrow.png');}
.childcare_course_area .contents_title .title .nav_list li:last-child {padding-right: 0; background: none;}
.childcare_course_area .contents_title .button_box {position: absolute; top: 14px; right: 10px; margin-top: 0;}
.childcare_course_area .contents_title .button_box button {margin-right: 5px; margin-left: 0;}
.childcare_course_area .contents_title .button_box .check_box.scrap {width: 32px; height: 32px; border: 1px solid #d3d5da; background-color: #fff;}
.childcare_course_area .contents_title .button_box .check_box.scrap input[type=checkbox] + label {width: 100%; height: 100%; background-image: url('../../images/web/icon_bookmark.png');  background-position: center center; background-size: 14px;}
.childcare_course_area .contents_title .button_box .check_box.scrap input[type=checkbox] + label.on, .childcare_course_area .contents_title .button_box .check_box.scrap input[type=checkbox]:checked  + label {background-image: url('../../images/web/icon_scrap_on.png');}

.childcare_course_area .childcare_course_all_list {display: none;}
.childcare_course_area .childcare_course_all_list ul li {position: relative; padding-left: 40px; padding-bottom: 10px; display: flex; display:-webkit-flex; width: 100%;}
.childcare_course_area .childcare_course_all_list ul li::after, .childcare_course_area .childcare_course_all_list ul li::before {content: ''; position: absolute; top: 24px; left: 20px; background-color: #e4e4e4;}
.childcare_course_area .childcare_course_all_list ul li::after {width: 20px; height: 1px;}
.childcare_course_area .childcare_course_all_list ul li:first-child::after {left: 0; width: 40px;}
.childcare_course_area .childcare_course_all_list ul li::before {width: 1px; height: 100%;}
.childcare_course_area .childcare_course_all_list ul li:last-child::before {display: none;}
.childcare_course_area .childcare_course_all_list ul li a {z-index: 21; position: relative; padding: 0 10px; height: 48px; display: flex; display:-webkit-flex; align-items: center; color: #333; font-size: 15px; line-height: 20px; background-color: #fff;}
.childcare_course_area .childcare_course_all_list ul.depth1 > li {padding-left: 0;}
.childcare_course_area .childcare_course_all_list ul.depth1 > li::after, .childcare_course_area .childcare_course_all_list ul.depth1 > li::before {display: none;}
.childcare_course_area .childcare_course_all_list ul.depth1 > li > a {width: 25%; color: #fff; font-size: 16px; font-weight: 500; background-color: #2194d3;}
.childcare_course_area .childcare_course_all_list ul.depth2 {width: 75%;}
.childcare_course_area .childcare_course_all_list ul.depth2 > li > a {width: 32.559%; border: 1px solid #2194d3;}
.childcare_course_area .childcare_course_all_list ul.depth3 {width: 67.441%;}
.childcare_course_area .childcare_course_all_list ul.depth3 > li > a {width: 51.856%; border: 1px solid #b1b6bb;}
.childcare_course_area .childcare_course_all_list ul.depth4 {padding-top: 11px; width: 48.144%;}
.childcare_course_area .childcare_course_all_list ul.depth4 li::after, .childcare_course_area .childcare_course_all_list ul.depth4 li::before {top: 13px;}
.childcare_course_area .childcare_course_all_list ul.depth4 > li > a {height: 26px;}

.childcare_course_area .contents_detail {position: relative; margin-bottom: 55px; display: none;}
.childcare_course_area .contents_detail.active {display: block;}
.childcare_course_area .contents_detail .contents_title {}
.childcare_course_area .contents_detail .contents_title h3 {text-align: center;}
.childcare_course_area .contents_detail ul li {margin-bottom: 10px;}
.childcare_course_area .contents_detail ul li:last-child {margin-bottom: 0;}
.childcare_course_area .contents_detail ul li ul li {margin-bottom: 0;}
.childcare_course_area .contents_detail ul.list_type > li, .childcare_course_area .contents_detail ul.list_type2 > li {margin-bottom: 0; padding: 17px 10px 17px 20px; display: flex; display:-webkit-flex; justify-content: space-between; align-items: flex-start; text-align: left; background-position: 10px 28px; border-bottom: 1px solid #e4e4e4;}
.childcare_course_area .contents_detail ul.list_type > li::before {top: 28px; left: 10px;}
.childcare_course_area .contents_detail ul.list_type > li p, .childcare_course_area .contents_detail ul.list_type2 > li p {display: block; width: 100%;}
.childcare_course_area .contents_detail ul.list_type > li a, .childcare_course_area .contents_detail ul.list_type2 > li a {position: relative; top: 4px; display: block; flex: none;}
.childcare_course_area .contents_detail ul.list_type > li a img, .childcare_course_area .contents_detail ul.list_type2 > li a img {display: block;}
.tab_area {position: relative;}
.tab_area select {display: none;}
.tab_area .tab_list {display: flex; display:-webkit-flex; width: 100%;}
.tab_area .tab_list > li {margin-bottom: 0; width: 100%;}
.tab_area .tab_list > li:last-child::before {width: 100%;}
.tab_area .tab_list > li > a {position: relative; padding: 0 5px; display: flex; display:-webkit-flex; width: 100%; height: 50px; align-items: center; justify-content: center; text-align: center; line-height: 18px; word-break: keep-all;}
.tab_area .tab_list > li > a span {z-index: 33; position: relative;}
.tab_area .tab_list > li > a::before {z-index: 32; content: ''; position: absolute; left: 0; top: 0; width: calc(100% + 1px); height: 100%; border: 1px solid #dcdcdc; background-color: #fff; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}
.tab_area .tab_list > li:last-child > a::before {width: 100%;}
.tab_area .tab_list > li.active > a span {z-index: 35; color: #fff; font-weight: 500;}
.tab_area .tab_list > li.active > a::before {z-index: 34; background-color: #2d93d1; border-color: #2d93d1;}
.tab_area .tab_list > li > ul {z-index: 34; position: absolute; left: 0; display: none; width: 100%;}
.tab_area .tab_list > li > ul.list_type2 {top: 49px; padding: 30px; border: 1px solid #2d93d1;}
.tab_area .tab_list > li > ul.faq_area {top: 80px;}
.tab_area .tab_list > li.active > ul {display: block;}
.childcare_course_area .contents_detail .tablebasic tr td.al > ul {padding-left: 10px;}
.childcare_course_area .contents_detail .tablebasic tr td.al > ul > li {margin-bottom: 0; text-indent: -10px;}
.childcare_course_area .contents_detail .tablebasic tr td.al > ul.list_type4 {padding-left: 0;}
.childcare_course_area .contents_detail .tablebasic tr td.al > ul.list_type4 > li {text-indent: 0;}
.childcare_course_area > .button_box {margin-top: 0; flex-wrap:wrap; -webkit-flex-wrap:wrap; display: none;}
.childcare_course_area > .button_box.active {display: flex;}
.childcare_course_area > .button_box button {margin: 5px;}

/*사이트맵*/
.sitemap_area {display: flex; display:-webkit-flex; flex-wrap:wrap; -webkit-flex-wrap:wrap;}
.sitemap_area .depth1 {margin-right: 60px; margin-bottom: 75px; width: calc(33.33% - 40px);}
.sitemap_area .depth1:nth-child(3n) {margin-right: 0;}
.sitemap_area .depth1 .contents_title {margin-bottom: 20px; border-bottom: 1px solid #222;}
.sitemap_area .depth1 .depth2 > li {margin-bottom: 20px;}
.sitemap_area .depth1 .depth2 > li:last-child {margin-bottom: 0;}
.sitemap_area .depth1 .depth2 > li > a {color: #333; font-size: 18px;}
.sitemap_area .depth1 .depth2 > li .depth3 {margin-top: 5px;}
.sitemap_area .depth1 .depth2 > li .depth3 li {position: relative; padding-left: 10px;}
.sitemap_area .depth1 .depth2 > li .depth3 li::after {content: '-'; position: absolute; left: 0; top: 0;}
.sitemap_area .depth1 .depth2 > li .depth3 li a {line-height: 30px;}

/*멤버쉽*/
.membership_area .info_txt {margin-bottom: 35px; text-align: center; font-size: 18px;}
.membership_area .membership_box {margin: 0 auto; width: 470px;}
.membership_area .membership_box .inp_area .inpbox {margin-bottom: 15px; width: 100%; height: 50px; border: 1px solid #dadada;}
.membership_area .membership_box .inp_area .inpbox:last-child {margin-bottom: 0;}
.membership_area .membership_box .inp_area .inpbox input.txt {padding: 0 20px; color: #333; font-weight: 500;}
.membership_area .membership_box .inp_area .optionbox {position: relative; height: 50px; border: 1px solid #dadada;}
.membership_area .membership_box .inp_area .optionbox::after {right: 25px;}
.membership_area .membership_box .inp_area dl {margin-bottom: 15px; display: flex; display:-webkit-flex; align-items: center;}
.membership_area .membership_box .inp_area dl:last-child {margin-bottom: 0;}
.membership_area .membership_box .inp_area dl dt {width: 100px; font-weight: 500;}
.membership_area .membership_box .inp_area dl dd {width: calc(100% - 100px);}
.membership_area .membership_box .inp_area dl dd .inpbox {margin-bottom: 0;}
.membership_area .membership_box .inp_area dl dd.tel {display: flex; display:-webkit-flex; justify-content: space-between; align-items: center;}
.membership_area .membership_box .inp_area dl dd.tel .inpbox {width: calc(33.33% - 13px);}
.membership_area .membership_box .inp_area dl dd.tel .optionbox {width: calc(33.33% - 13px);}
.membership_area .membership_box .inp_area dl dd.tel .character {width: 20px; text-align: center;}
.membership_area .membership_box .submit {margin-top: 30px; width: 100%; height: 60px; font-size: 20px; font-weight: 500;}
.membership_area .membership_box .button_box {margin-top: 20px; justify-content: space-between;}
.membership_area .membership_box .button_box .member {margin-left: 0; width: calc(33.33% - 7px); height: 50px; font-size: 15px;}
.membership_area.result .info_txt {margin-bottom: 25px;}
.membership_area.result .membership_box .result_box {display: flex; display:-webkit-flex; align-items: center; justify-content:  center; width: 100%; height: 100px; background-color: #f9f9f9;}
.membership_area.result .membership_box .button_box {justify-content: center;}
/*회원가입*/
.join_area .step_box {margin-bottom: 50px; display: flex; display:-webkit-flex; justify-content: center; align-items: center;}
.join_area .step_box .step {position: relative; padding-left: 100px; display: flex; display:-webkit-flex; flex-wrap:wrap; -webkit-flex-wrap:wrap; flex-flow: column; justify-content: center; width: 205px; height: 80px; color: #888;}
.join_area .step_box .step::after, .join_area .step_box .step::before {content: ''; position: absolute; left: 0; top: 0; width: 80px; height: 80px;}
.join_area .step_box .step::after {background-repeat: no-repeat; background-position: center center;}
.join_area .step_box .step::before {background-color: #ccced0; border-radius: 100%;}
.join_area .step_box .step h3 {font-size: 18px;}
.join_area .step_box .step p {font-size: 18px;}
.join_area .step_box .dot {margin: 0 25px; width: 42px; display: flex; display:-webkit-flex; justify-content: space-between;}
.join_area .step_box .dot i {display: block; width: 7px; height: 7px; background-color: #ccced0; border-radius: 100%;}
.join_area .step_box .step.step1::after {background-image: url('../../images/web/icon_step1.png');}
.join_area .step_box .step.step2::after {background-image: url('../../images/web/icon_step2.png');}
.join_area .step_box .step.step3::after {background-image: url('../../images/web/icon_step3.png');}
.join_area .step_box .step.step4::after {background-image: url('../../images/web/icon_step4.png');}
.join_area .step_box .step.active {color: #2194d3;}
.join_area .step_box .step.active::before {background-color: #2194d3;}
.join_area .join_txt {padding: 40px 0 0; font-size: 18px; font-weight: 500; text-align: center;}
.join_area .join_finish {padding: 40px 0 50px; text-align: center;}
.join_area .join_finish .p1 {margin-bottom: 35px; color: #333; font-size: 20px; font-weight: 500;}
.join_area .join_finish .p2 {color: #555;}
.join_area .join_finish .p2 span {color: #2194d3; font-weight: 600;}

/*이용약관 및 개인정보처리방침*/
.agree_area .agree_box {overflow-y: auto; margin-bottom: 20px; padding: 20px; width: 100%; height: 200px; border: 1px solid #d2d2d2;}
.agree_area .check_box {justify-content: flex-end;}
.agree_area .check_box input[type=checkbox] + label {color: #333; padding-left: 27px; line-height:24px; font-size: 18px;}
.agree_area .check_box input[type=checkbox] + label::after, .agree_area .check_box input[type=checkbox] + label::before {content: ''; position: absolute; left: 0; top: 3px; width: 14px; height: 14px;}
.agree_area .check_box input[type=checkbox] + label::after {border: 2px solid #d2d2d2;}
.agree_area .check_box input[type=checkbox] + label::before {background-color: #fff; border: 2px solid transparent;}
.agree_area .check_box input[type=checkbox] + label.on::after, .agree_area .check_box input[type=checkbox]:checked  + label::after {border-color: #2194d3;}
.agree_area .check_box input[type=checkbox] + label.on::before, .agree_area .check_box input[type=checkbox]:checked  + label::before {background-color: #2194d3; background-repeat: no-repeat; background-position: center center; background-image: url('../../images/web/icon_check1.png');}
.agree_area .check_box.allcheck {margin-top: 30px; padding-top: 30px; justify-content: center; border-top: 1px solid #929bac;}

/*통합검색*/
.totalsearch_area .search_box {position: relative; margin: 0 auto 55px; width: 800px; height: 60px; border-bottom: 2px solid #2d93d1;}
.totalsearch_area .search_box input {padding: 0 60px 0 10px; width: 100%; height: 100%; font-size: 25px;}
.totalsearch_area .search_box button {position: absolute; top: 14px; right: 25px; width: 29px; height: 29px;}
.totalsearch_area .search_box button::after, .totalsearch_area .search_box button::before {content: ''; position: absolute;}
.totalsearch_area .search_box button::after {left: 0; top: 0; width: 19px; height: 18px; border: 3px solid #2d93d1; border-radius: 100%;}
.totalsearch_area .search_box button::before {right: 1px; bottom: 0; width: 11px; height: 3px; background-color: #2d93d1; transform: rotate(45deg); transform-origin: right bottom;}
.totalsearch_area .result_txt {margin-bottom: 20px; color: #333; font-size: 25px; word-break: keep-all;}
.totalsearch_area .result_txt span {margin: 0 10px; font-weight: 600;}
.totalsearch_area .search_menu {position: relative; margin-bottom: 20px; width: 100%; height: 40px;}
.totalsearch_area .search_menu::after {content: ''; position: absolute; right: 10px; top: calc(50% - 2px); width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 5px solid #fff;}
.totalsearch_area .search_menu select {padding: 0 20px 0 10px; width: 100%; height: 100%; color: #fff; font-weight: 500; background-color: #2194d3;}
.totalsearch_area .result_area {position: relative;}
.totalsearch_area .result_area > li > a {position: absolute; top: 0; width: 25%; text-align: center; line-height: 50px; border: 1px solid #dcdcdc;}
.totalsearch_area .result_area > li:nth-child(1) > a {left: 0;}
.totalsearch_area .result_area > li:nth-child(2) > a {left: 25%; border-left: 0;}
.totalsearch_area .result_area > li:nth-child(3) > a {left: 50%; border-left: 0;}
.totalsearch_area .result_area > li:nth-child(4) > a {left: 75%; border-left: 0;}
.totalsearch_area .result_area > li > .tab_pane {display: none;}
.totalsearch_area .result_area > li > .tab_pane dl {margin-top: 50px; border-top: 1px solid #3195ce;}
.totalsearch_area .result_area > li > .tab_pane dl:first-child {margin-top: 0;}
.totalsearch_area .result_area > li > .tab_pane dl dt {padding: 13px 20px; color: #000; font-size: 20px; font-weight: 500; border-bottom: 1px solid #cbcbcb;}
.totalsearch_area .result_area > li > .tab_pane dl dd {padding: 17px 20px; border-bottom: 1px solid #cbcbcb;}
.totalsearch_area .result_area > li > .tab_pane dl dd a {margin-bottom: 15px; display: block;}
.totalsearch_area .result_area > li > .tab_pane dl dd a .title_box {margin-bottom: 10px; display: flex; display:-webkit-flex;}
.totalsearch_area .result_area > li > .tab_pane dl dd a .title_box h3 {overflow: hidden; color: #010101; font-size: 18px; text-overflow: ellipsis; white-space: nowrap;}
.totalsearch_area .result_area > li > .tab_pane dl dd a .title_box .date {flex: none; padding-left: 20px; color: #999; font-size: 14px; font-weight: 500;}
.totalsearch_area .result_area > li > .tab_pane dl dd a p {overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; max-height: 78px; -webkit-line-clamp: 3;}
.totalsearch_area .result_area > li > .tab_pane dl dd .nav_list {display: flex; display:-webkit-flex; flex-wrap:wrap; -webkit-flex-wrap:wrap;}
.totalsearch_area .result_area > li > .tab_pane dl dd .nav_list li {color: #999; font-size: 14px; font-weight: 500;}
.totalsearch_area .result_area > li > .tab_pane dl dd .nav_list li::after {content: '>'; padding: 0 3px;}
.totalsearch_area .result_area > li > .tab_pane dl dd .nav_list li:last-child::after {content: ''; padding: 0;}
.totalsearch_area .result_area > li > .tab_pane .button_box {margin-top: 10px;}
.totalsearch_area .result_area > li.active {padding-top: 80px;}
.totalsearch_area .result_area > li.active > a {color: #fff; font-weight: 500; border-color: #2d93d1; background-color: #2d93d1;}
.totalsearch_area .result_area > li.active > .tab_pane {display: block;}

.floating_top {}

@media screen and (max-width:1240px) {
    .lnb_area .lnb {width: 100%;}

    .contentsarea {padding: 70px 20px; width: 100%;}
}
@media screen and (max-width:1024px) {
    body {font-size: 14px; line-height: 22px;}
    
    .btn {height: 45px; font-size: 15px;}
    .btn_more {height: 40px;}
    .btn5 {width: 25px !important; height: 25px; background-size: 50%;}
    .btn_download {padding: 0 10px; height: 40px; font-size: 12px;}
    .btn_download span {padding-right: 25px;}
    
    .mb10 {margin-bottom:5px !important}
    .mb20 {margin-bottom:10px !important}
    .mb35 {margin-bottom:20px !important}
    .mb40 {margin-bottom:20px !important}
    .mb50 {margin-bottom:30px !important}
    .mb55 {margin-bottom:25px !important}
    
    .f_18 {font-size: 15px !important;} 
    
    .list_type > li::before {top: 10px; width: 3px; height: 3px;}
    .list_type4 > li {padding-left: 8px;}
    .list_type4 > li::after {top: 11px;}
    .num_list3 > li {padding-left: 20px;}
    .num_list3 > li::before {top: 4px; width: 14px; height: 14px; font-size: 11px; line-height: 13px;}
    .box_type {padding: 8px 10px;}
    .box_type2 {margin-bottom: 25px; padding: 15px; font-size: 14px; line-height: 22px; word-break: keep-all;}
    .box_type2::after, .box_type2::before {top: 4px; width: 34px; height: 25px;}
    .box_type2::after {left: -4px;}
    .box_type2::before {right: -4px; top: inherit; bottom: 4px;}
    .box_type2 p {display: inline;}
    .box_type3 {padding: 5px 10px;}
    
    /*서브공통*/
    .contents_title h3 {margin-bottom: 15px; font-size: 16px;}
    .contents_title h4 {margin-bottom: 10px; font-size: 15px; line-height: 15px;}
    .contents_title h5 {margin-bottom: 5px; font-size: 14px; line-height: 16px;}
    .board_title {margin-bottom: 10px;}
    .board_title h3 {font-size: 14px;}
    
    .lnb_area .lnb {position: relative; padding-left: 30px;}
    .lnb_area .lnb > li {position: initial; width: 100%;}
    .lnb_area .lnb li a {overflow: hidden; padding: 0 25px 0 10px; display: flex; display:-webkit-flex; min-width: 100%; height: 30px; font-size: 10px; line-height: 13px; align-items: center;}
    .lnb_area .lnb li a span {display: -webkit-box; -webkit-box-orient: vertical; max-height: 26px; -webkit-line-clamp: 2;}
    .lnb_area .lnb > li > a::after, .lnb_area .lnb > li > a::before {right: 10px; top: calc(50% - 1px); width: 11px; height: 1px;}
    .lnb_area .lnb li .dropdown-menu {top: 30px; padding: 10px 0; width: 100%; border-left: 0; border-right: 0;}
    .lnb_area .lnb li .dropdown-menu li a {padding: 4px 10px; line-height: 15px;}
    .lnb_area .lnb li.home {position: absolute; left: 0; top: 0; width: 30px;}
    .lnb_area .lnb li.home a {min-width: 30px; height: 30px; background-size: 10px;}
    .midarea .btn_share {display: none;}
    .midarea .list_share {position: relative; top: 0; right: inherit; margin-top: 10px; width: 100%; display: flex; display:-webkit-flex; justify-content: center;}
    .midarea .list_share li {margin: 0 5px;}
    .midarea .list_share li a img {width: 25px;}
    
    .midarea {min-height: calc(100vh - 240px);}
    .contentsarea {padding: 30px 20px;}
    .contentsarea .sub_title {margin-bottom: 25px;}
    .contentsarea .sub_title h2 {font-size: 20px; line-height: 20px;}
    
    /*NCCW란*/
    .con1_1::before {display: none;}
    .con1_1 .box {padding-top: 0;}
    .con1_1 .title_box {margin-bottom: 10px;}
    .con1_1 .title_box h3 {margin-bottom: 10px; font-size: 15px; line-height: 20px;}
    .con1_1 img {margin-top: 20px;}
    /*보육과정 컨설팅 소개*/
    .con3 .box {margin-bottom: 25px;}
    .con3 .box .list_type > li, .con3 .box .list_type4 > li {margin-bottom: 5px;}
    .con3 .box2 {margin-bottom: 25px; padding: 20px 10px 20px 95px; background-position: left -65px center;}
    .con3 .box2 h3 {margin-bottom: 10px; font-size: 14px; line-height: 20px;}
    .con3 .box2 p {font-size: 11px; line-height: 17px;}
    .con3 .box4 {margin-bottom: 25px;}
    .con3 .box4 .list {flex-wrap:wrap; -webkit-flex-wrap:wrap; justify-content: center;}
    .con3 .box4 .list dl {width: 100%; height: 60px;}
    .con3 .box4 .list dl dt, .con3 .box4 .list dl dd {height: 29px;}
    .con3 .box4 .list .arrow {margin: 5px 0; transform: rotate(90deg);}
    .con3 .box5 .list_type li {margin-bottom: 5px;}
    .con3 .box6 .list > li {padding-bottom: 20px; display: block; display:-webkit-block;}
    .con3 .box6 .list > li:last-child {padding-top: 0; padding-left: 20px;}
    .con3 .box6 .list > li dl {width: 100% !important;}
    .con3 .box6 .list > li:last-child dl {margin-bottom: 15px;}
    .con3 .box6 .list > li:last-child dl:last-child {margin-bottom: 0;}
    .con3 .box6 .list > li dl::after {left: 10px; bottom: -35px; width: 1px; height: 34px;}
    .con3 .box6 .list > li:last-child dl::after {top: 0; left: -10px; height: calc(100% + 20px);}
    .con3 .box6 .list > li:last-child dl:last-child::after {height: 14px;}
    .con3 .box6 .list > li:last-child dl::before {top: 14px; left: -10px !important; width: 9px !important; height: 1px;}
    .con3 .box6 .list > li dl dt {font-size: 13px; line-height: 30px;}
    .con3 .box6 .list > li dl dd {padding: 10px; display: block; display:-webkit-block;}
    .con3 .box6 .list > li dl dd .slist {margin-bottom: 10px; display: block; display:-webkit-block; width: 100%;}
    .con3 .box6 .list > li dl dd .slist:last-child {margin-bottom: 0;}
    .con3 .box6 .list > li dl dd .slist h4 {font-size: 13px;}
    .con3 .box6 .list > li dl dd .slist .list_type {padding: 5px 9px; height: auto;}
    .con3 .box7 .list {justify-content: center;}
    .con3 .box7 .list dl {width: 100%;}
    .con3 .box7 .list dl dt {line-height: 30px;}
    .con3 .box7 .list dl dd {padding: 10px;}
    .con3 .box7 .list .arrow {margin: 10px 0; width: 26px; height: 28px; transform: rotate(90deg);}
    .con3 .box7 .list .arrow::after, .con3 .box7 .list .arrow::before {content: ''; position: absolute;}
    .con3 .box7 .list .arrow::after {left: 0; top: calc(50% - 6px); width: 12px; height: 12px; background-color: #dcdcdc;}
    .con3 .box7 .list .arrow::before {right: 0; top: calc(50% - 14px); width: 0; height: 0; border-top: 14px solid transparent; border-bottom: 14px solid transparent; border-left: 14px solid #dcdcdc;}
    .con3 .box7 .list dl.finish dd {height: 100%; color: #2d93d1; font-weight: 500;}
    /*보육과정 교육*/
    .con4 .box {margin-bottom: 25px;}
    .con4 .box1 {margin-bottom: 25px; padding: 20px 10px 20px 95px; background-position: left -95px center;}
    .con4 .box1 h3 {margin-bottom: 10px; font-size: 14px; line-height: 20px;}
    .con4 .box2 .list {display: block; display:-webkit-block;}
    .con4 .box2 .list > dl {width: 100%;}
    .con4 .box2 .list > dl > dt {font-size: 13px; line-height: 30px;}
    .con4 .box2 .list > dl > dd {padding: 10px; height: auto;}
    .con4 .box2 .list > dl > dd h5 {margin-bottom: 5px; font-size: 14px;}
    .con4 .box2 .list > dl > dd .slist dl dt {width: 50px; height: 21px; font-size: 11px; line-height: 19px;}
    .con4 .box2 .list > dl > dd .slist dl dd {width: calc(100% - 50px); line-height: 21px; font-size: 12px; word-break: keep-all;}
    
    /*표준보육과정*/
    .childcare_course_area .contents_title .title {padding: 14px 10px; margin-bottom: 25px; flex-wrap:wrap; -webkit-flex-wrap:wrap;}
    .childcare_course_area .contents_title .title h4 {margin-bottom: 5px; margin-right: 0; padding-right: 65px; width: 100%; border-right: 0;}
    .childcare_course_area .contents_title .title .nav_list li {font-size: 9px; line-height: 12px; background-size: 3px;}
    .childcare_course_area .contents_title .button_box {top: 5px; right: 5px;}
    
    .childcare_course_area .childcare_course_all_list {/*display: none;*/}
    .childcare_course_area .childcare_course_all_list ul li {padding-left: 20px; padding-bottom: 5px;}
    .childcare_course_area .childcare_course_all_list ul li::after, .childcare_course_area .childcare_course_all_list ul li::before {top: 18px; left: 10px;}
    .childcare_course_area .childcare_course_all_list ul li::after {width: 10px;}
    .childcare_course_area .childcare_course_all_list ul li:first-child::after {width: 20px;}
    .childcare_course_area .childcare_course_all_list ul li a {height: 36px; font-size: 13px; line-height: 16px;}
    .childcare_course_area .childcare_course_all_list ul.depth1 > li > a {font-size: 14px;}
    .childcare_course_area .childcare_course_all_list ul.depth4 {padding-top: 5px;}

    .childcare_course_area .contents_detail {margin-bottom: 30px;}
    .childcare_course_area .contents_detail ul li {margin-bottom: 5px;}
    .childcare_course_area .contents_detail .tablebasic tr td.al > ul {padding-left: 8px;}
    .childcare_course_area .contents_detail .tablebasic tr td.al > ul > li {text-indent: -8px;}
    .childcare_course_area .button_box {margin-top: 0;}
    .childcare_course_area .button_box {flex-wrap:wrap; -webkit-flex-wrap:wrap;}
    .childcare_course_area .button_box .btn_more {margin-left: 0; margin-bottom: 5px; padding: 0; width: 100%;}
    
    /*사이트맵*/
    .sitemap_area .depth1 {margin-right: 30px; margin-bottom: 40px; width: calc(33.33% - 20px);}
    .sitemap_area .depth1 .contents_title {margin-bottom: 10px;}
    .sitemap_area .depth1 .contents_title h3 {margin-bottom: 10px; font-size: 17px;}
    .sitemap_area .depth1 .depth2 > li {margin-bottom: 10px;}
    .sitemap_area .depth1 .depth2 > li > a {font-size: 14px;}
    .sitemap_area .depth1 .depth2 > li .depth3 li {padding-left: 8px;}
    .sitemap_area .depth1 .depth2 > li .depth3 li a {font-size: 13px; line-height: 25px;}
    
    /*멤버쉽*/
    .membership_area .info_txt {margin-bottom: 20px; font-size: 12px; line-height: 20px; word-break: keep-all;}
    .membership_area .membership_box {margin: 0 auto; width: 400px;}
    .membership_area .membership_box .inp_area .inpbox {margin-bottom: 10px; height: 35px;}
    .membership_area .membership_box .inp_area .inpbox input.txt {padding: 0 10px; font-size: 13px;}
    .membership_area .membership_box .inp_area .optionbox {height: 35px;}
    .membership_area .membership_box .inp_area .optionbox select {font-size: 13px;}
    .membership_area .membership_box .inp_area .optionbox::after {right: 8px;}
    .membership_area .membership_box .inp_area dl {margin-bottom: 10px;}
    .membership_area .membership_box .inp_area dl dt {font-size: 13px;}
    .membership_area .membership_box .submit {margin-top: 20px; height: 40px; font-size: 15px;}
    .membership_area .membership_box .button_box {margin-top: 10px;}
    .membership_area .membership_box .button_box .member {width: calc(33.33% - 2px); height: 35px; font-size: 11px;}
    .membership_area.result .info_txt {margin-bottom: 15px;}
    .membership_area.result .membership_box .result_box {height: 60px; font-size: 13px;}
    
    /*회원가입*/
    .join_area .step_box {margin-bottom: 30px;}
    .join_area .step_box .step {padding-left: 0; padding-bottom: 10px; display: none; width: 100%; height: auto; color: #333 !important;}
    .join_area .step_box .step::after, .join_area .step_box .step::before {content: ''; position: absolute; left: 0; top: inherit; bottom: 0; width: 100%; height: 2px;}
    .join_area .step_box .step.active::after {background-color: #2194d3; background-image: none;}
    .join_area .step_box .step.step1.active::after {width: 25%;}
    .join_area .step_box .step.step2.active::after {width: 50%;}
    .join_area .step_box .step.step3.active::after {width: 75%;}
    .join_area .step_box .step.step4.active::after {width: 100%;}
    .join_area .step_box .step::before {background-color: #e8e9ea; border-radius: 0;}
    .join_area .step_box .step h3 {display: none;}
    .join_area .step_box .step p {font-size: 12px;}
    .join_area .step_box .dot {display: none;}
    .join_area .step_box .step.active {display: block;}
    .join_area .step_box .step.active::before {background-color: #e8e9ea;}
    .join_area .join_txt {padding: 25px 0 0; font-size: 15px;}
    .join_area .join_finish {padding: 25px 0 0;}
    .join_area .join_finish .p1 {margin-bottom: 25px; font-size: 15px;}
    .join_area .join_finish .p2 {font-size: 13px;}

    /*이용약관 및 개인정보처리방침*/
    .agree_area .agree_box {margin-bottom: 10px; height: 150px;}
    .agree_area .check_box {justify-content: flex-start !important;}
    .agree_area .check_box.mb50 {margin-bottom: 20px !important;}
    .agree_area .check_box input[type=checkbox] + label {padding-left: 18px; line-height:12px; font-size: 11px;}
    .agree_area .check_box input[type=checkbox] + label::after, .agree_area .check_box input[type=checkbox] + label::before {left: 0; top: 0; width: 10px; height: 10px;}
    .agree_area .check_box input[type=checkbox] + label::after {border: 1px solid #d2d2d2;}
    .agree_area .check_box input[type=checkbox] + label::before {border: 1px solid transparent;}
    .agree_area .check_box input[type=checkbox] + label.on::before, .agree_area .check_box input[type=checkbox]:checked  + label::before {background-size: 8px;}
    .agree_area .check_box.allcheck {margin-top: 20px; padding-top: 10px;}
    
    /*통합검색*/
    .totalsearch_area .search_box {margin: 0 auto 25px; width: 100%; height: 35px; border-bottom: 1px solid #000;}
    .totalsearch_area .search_box input {padding: 0 20px 0 0; font-size: 14px;}
    .totalsearch_area .search_box button {top: 9px; right: 0; width: 17px; height: 17px;}
    .totalsearch_area .search_box button::after {width: 10px; height: 10px; border: 2px solid #000;}
    .totalsearch_area .search_box button::before {width: 8px; height: 2px; background-color: #000;}
    .totalsearch_area .result_txt {margin-bottom: 10px; font-size: 13px;}
    .totalsearch_area .result_txt span {margin: 0 5px;}
    .totalsearch_area .result_area > li > a {line-height: 40px;}
    .totalsearch_area .result_area > li > .tab_pane dl {line-height: 20px;}
    .totalsearch_area .result_area > li > .tab_pane dl dt {padding: 10px 0; font-size: 15px;}
    .totalsearch_area .result_area > li > .tab_pane dl dd {padding: 10px 0;}
    .totalsearch_area .result_area > li > .tab_pane dl dd a {margin-bottom: 5px;}
    .totalsearch_area .result_area > li > .tab_pane dl dd a .title_box {margin-bottom: 5px; flex-wrap:wrap; -webkit-flex-wrap:wrap;}
    .totalsearch_area .result_area > li > .tab_pane dl dd a .title_box h3 {width: 100%; font-size: 14px;}
    .totalsearch_area .result_area > li > .tab_pane dl dd a .title_box .date {padding-left: 0; font-size: 10px;}
    .totalsearch_area .result_area > li > .tab_pane dl dd a p {max-height: 60px;}
    .totalsearch_area .result_area > li > .tab_pane dl dd .nav_list li {font-size: 10px;}
    .totalsearch_area .result_area > li.active {padding-top: 60px;}
}
@media screen and (max-width:784px) {
    /*보육과정 교육*/
    .con4 .box1 {background-position: left -125px center;}
    /*사이트맵*/
    .sitemap_area {justify-content: space-between;}
    .sitemap_area .depth1 {margin-right: 0; width: calc(50% - 10px);}
    
}
@media screen and (max-width:640px){
    .web_only {display: none !important;}
    .mobile_only {display: block !important;}
    .web_flex_only {display: none !important;}
    .mobile_flex_only {display: flex !important;}
    
    /*보육과정 교육*/
    .con4 .box1 {background-position: left -155px center;}
    
    .childcare_course_area .childcare_course_all_list ul li {flex-wrap:wrap; -webkit-flex-wrap:wrap;}
    .childcare_course_area .childcare_course_all_list ul li:first-child::after {left: 10px;}
    .childcare_course_area .childcare_course_all_list ul li::before {top: inherit; bottom: 0;}
    .childcare_course_area .childcare_course_all_list ul li:first-child::before {top: -10px; height: calc(100% + 10px);}
    .childcare_course_area .childcare_course_all_list ul li:last-child::before {height: 18px; top: 0; display: block;}
    .childcare_course_area .childcare_course_all_list ul li a {margin-bottom: 10px; width: 100% !important;}
    .childcare_course_area .childcare_course_all_list ul li ul {width: 100% !important;}
    .childcare_course_area .childcare_course_all_list ul.depth1 > li {margin-bottom: 15px;}
    .childcare_course_area .childcare_course_all_list ul.depth4 {padding-top: 0;}
    .childcare_course_area .childcare_course_all_list ul.depth4 li::before {top: 0;}
    .childcare_course_area .childcare_course_all_list ul.depth4 li:first-child::before {top: -10px;}
    .childcare_course_area .childcare_course_all_list ul.depth4 li:last-child::before {top: 0px; height: 14px;}
    .childcare_course_area .childcare_course_all_list ul.depth4 > li > a {margin-bottom: 0;}
    
    .childcare_course_area .contents_detail ul.list_type > li, .childcare_course_area .contents_detail ul.list_type2 > li {padding: 10px 0 10px 10px; background-position: 0 19px;}
    .childcare_course_area .contents_detail ul.list_type > li::before {top: 19px; left: 0;}
    .childcare_course_area .contents_detail ul.list_type > li a, .childcare_course_area .contents_detail ul.list_type2 > li a {top: 6px;}
    .childcare_course_area .contents_detail ul.list_type > li a img, .childcare_course_area .contents_detail ul.list_type2 > li a img {width: 12px;}
    .tab_area {height: auto !important;}
    .tab_area select {padding: 0 10px; margin-bottom: 5px; display: block; width: 100%; height: 40px; color: #fff; background-color: #2194d3; background-image: url('../../images/web/icon_select.png'); background-repeat: no-repeat; background-position: right 10px center; background-size: auto 5px;}
    .tab_area .tab_list {display: block; display:-webkit-block; width: 100%;}
    .tab_area .tab_list > li > a {display: none;}
    .tab_area .tab_list > li > ul {position: relative; top: 0 !important;}
    .tab_area .tab_list > li > ul.list_type2 {padding: 0; border: 0;}
    
    /*통합검색*/
    .totalsearch_area .result_area > li > a {display: none;}
    .totalsearch_area .result_area > li.active {padding-top: 0;}
    
}
@media screen and (max-width:480px){
    .btn_agree {width: 100%; height: 40px;}

    /*사이트맵*/
    .sitemap_area .depth1 {width: 100%;}
    
    /*보육과정 컨설팅 소개*/
    .con3 .box2 {padding: 20px 10px 20px 70px; background-position: left -105px center; background-size: auto 100%;}
    /*보육과정 교육*/
    .con4 .box1 {padding: 20px 10px 20px 70px; background-position: left -195px center; background-size: auto 100%;}
    .con4 .box3 .list li {margin-right: 0; padding: 0 5px; width: 50%; word-break: keep-all;}
    .con4 .box3 .list li img {margin-bottom: 10px;}
    
    /*멤버쉽*/
    .membership_area .membership_box {width: 100%;}
    .membership_area .membership_box .inp_area dl {display: block;}
    .membership_area .membership_box .inp_area dl dt {margin-bottom: 5px; width: 100%;}
    .membership_area .membership_box .inp_area dl dd {width: 100%;}
    .membership_area .membership_box .inp_area dl dd.tel .inpbox {width: calc(33.33% - 6px);}
    .membership_area .membership_box .inp_area dl dd.tel .optionbox {width: calc(33.33% - 6px);}
    .membership_area .membership_box .inp_area dl dd.tel .character {display: none;}
}
@media screen and (max-width:400px){
    .midarea {min-height: calc(100vh - 270px);}
}
@media screen and (max-width:360px){
    /*보육과정 컨설팅 소개*/
    .con3 .box2 {background-position: left -150px center;}
    /*보육과정 교육*/
    .con4 .box1 {background-position: left -255px center;}
}