@charset "utf-8";
/* CSS Document */

/* [서브화면 업로드 일자 25.02.12 - PM 19:00] */
/* com2zoa design KYJ-기존 스타일 전반정리 및 수정 - c2zafter 3.0 관련 class변경 및 html구조 변경으로 인한 스타일은 하단에 위치 [ctrl+F]→[★] 로 찾기*/
/*section*/
section#subContainer{clear:both; padding:0; margin:0}
section#subContainer div.subContain{padding:0; margin:0; width:auto}
section#subContainer div.subContain div.pcBox{width:auto; padding:0 15px}

/* 추가 : 17.04.13 학생이름은 그대로 출력 */
div#subTop{position:relative; padding:87px 0 0 0; margin:0 0 15px 0}
div#subTop h3{font-size:25px; font-weight:500; padding-bottom:20px; color:#000; border-bottom:1px solid #ccc; font-family: 'Gmarket Sans'}
div#subTop h3 span{display:inline-block; padding:5px 0 2px 33px; background:url(../../images/sub/toph3_ico.gif) no-repeat left center}
div.rightBox{position:absolute; top:0; left:0; width:100%; z-index:1}

/*페이지 NAVI*/
#sub_guide{padding:0 0 15px 0; margin:0}
#sub_guide .guide_box{position:relative; height:38px; width:auto; padding:0; margin:0; border-radius:0 0 10px 10px; background:#f1f1f1; font-size:15px}
#sub_guide .guide_box:after {content:""; clear:both; display:block; height:0; visibility:none}
#sub_guide div.naviArea{width:auto; padding:0 0 0 15px; position:relative; z-index:4}
#sub_guide div.naviArea ul{padding:0; margin:1px 0; width:auto; display:flex}
#sub_guide div.naviArea ul:after {content:""; clear:both; display:block; height:0; visibility:none}
#sub_guide div.naviArea ul li{background:url(../../images/sub/guide_dot_m.png) no-repeat right 15px center; height:38px; line-height:38px; padding:0;  color:#6f7071; position:relative}  
#sub_guide div.naviArea ul li a{display:block; width:auto; padding:0 29px 0 10px; height:38px; border-left:1px solid #cecece; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#000}
#sub_guide div.naviArea ul li:first-child{background:none}
#sub_guide div.naviArea ul li:first-child a{ border-left:none; background:url(../../images/sub/home_navi_m.png) no-repeat left center; padding-left:30px}
#sub_guide div.naviArea ul li.nav01{width:30%; flex:2}
#sub_guide div.naviArea ul li.nav02{width:30%; flex:2}
#sub_guide div.naviArea ul li.nav03{width:40%; flex:3}
#sub_guide div.naviArea ul li div.subMn{width:100%; position:absolute; top:38px; left:0; background:#fff; z-index:15; display:none}
#sub_guide div.naviArea ul li div.subMn ul{display:block}
#sub_guide div.naviArea ul li div.subMn ul li{display:block; background:none; height:auto; line-height:150%; float:none; width:100%; clear:both; background:#fff}
#sub_guide div.naviArea ul li div.subMn ul li a{border:1px solid #e4e4e4; border-top:none; height:auto; line-height:150%; padding:8px;background:none}
#sub_guide div.naviArea ul li div.subMn ul li a:hover{background:#f0f0f0}
#sub_guide div.naviArea ul li div.subMn ul li:hover{background:none}
section#subContainer div.subContain div.subConWrap{padding:0 0 40px; margin:0; position:relative}
section#subContainer div.subContain div.subConWrap div#subPage{min-height:100px}
section#subContainer div.subContain div.subConWrap div.topBtn{ position:fixed; bottom:100px; right:15px}

/*콘텐츠*/
/*테이블*/
div.tableBox{clear:both; margin:0}
div.tableBox.dePartTable{overflow:visible !important}
div.tableBox table{width:100%; overflow:hidden; border-collapse:collapse; border-spacing: 0; padding:0; margin:0; border:0; border-radius:5px 5px 0 0}
div.tableBox table thead th{background:#4c5460; border:1px solid #d0d0d0; color:#fff; font-weight:normal; text-align:center; font-family: 'Gmarket Sans'; font-size:1.154em; font-weight:500; line-height:150%; padding:5px; vertical-align:middle}
div.tableBox table tbody th, div.tableBox table tbody td{background:#fff; border:1px solid #d0d0d0; vertical-align:middle; text-align:center; font-size:1.154em; line-height:150%; padding:5px; font-weight:400}
div.tableBox table tbody th{font-weight:600}
div.tableBox table tbody th img{display:block; vertical-align:middle; width:50px; margin:0 auto}
div.tableBox table tbody th input[type=checkbox]{vertical-align:middle; margin-top:-3px; margin-right:3px}

.mview, .tview, .pview{display:none}
div#appliTable table tbody span.mview{font-size:0.900em; color:#7c7c7c}
div#appliTable table tbody span.mview:nth-child(2) {color:#f00}
div#appliTable table tbody span.mview:nth-child(3) {color:#000; font-weight:bold}
div.tableBox table span.redCol{color:#e13c4c}
div.tableBox table td.alignLeft{text-align:left; padding-left:5px}
div.tableBox table span.state01,
div.tableBox table span.state02,
div.tableBox table span.state03{display:inline-block; color:#fff; font-weight:500; font-size:13px; height:15px; line-height:15px; text-align:center; padding:3px 13px 5px; margin:-3px 6px 0 0; vertical-align:middle; border-radius:50px}
div.tableBox table span.state01{background:#ff5548}
div.tableBox table span.state02{background:#2f8ee6}
div.tableBox table span.state03{background:#b5b5b5}
div#surveyTable table tbody span.mview{font-size:0.900em; color:#7c7c7c}
div.tableBox table tbody span.smallTxt{font-size:0.900em; color:#7c7c7c}
div.tableBox table span.cours_ing{color:#ff5548}
div.tableBox table span.cours_ready{color:#2f8ee6}
div.tableBox table span.cours_cal{color:#b5b5b5}

/*테이블 상단*/
div.listTop{clear:both; padding:0 0 10px 0; margin:0; font-size:1.154em}
div.listTop:after {content:""; clear:both; display:block; height:0; visibility:none; font-size:0; line-height:0}
div.listTop p.list_left{padding:0 0 5px 0; line-height:120%; color:#000}
div.listTop div.list_right{position:relative}
div.listTop div.list_right div.selectBox{position:absolute; top:0; left:0; width:120px; border:1px solid #bebebe; background:#fff; height:37px; border-radius:5px}
div.listTop div.list_right div.selectBox select {border:0; height:37px; width:110px; padding:0 0 0 10px; font-size:1em; color:#000; background:#fff url(../../images/sub/select_arrow.png) no-repeat right 12px center; box-sizing:content-box; appearance: none; border-radius:10px} 
/* IE 10, 11의 네이티브 화살표 숨기기 */ 
div.listTop div.list_right div.selectBox select::-ms-expand {display: none} 
div.listTop div.list_right div.inputBox{width:auto; margin: 0 75px 0 127px; padding:0 10px; border:1px solid #bebebe; background:#fff; height:37px; border-radius:5px}
div.listTop div.list_right div.inputBox input[type=text]{width:100%; border:0; height:35px; line-height:35px}
div.listTop div.list_right div.btnBox{position:absolute; top:0; right:0;}
div.listTop div.list_right div.btnBox button{width:70px; background:#2384ad; height:39px; border-radius:5px; color:#fff; font-size:15px}

/*******************************170526 추가 시작**********************************/
div.listTop div.list_right.childBox{padding-right:74px}
div.listTop div.list_right.childBox div.selectBox{width:49%; position:static; float:right}
div.listTop div.list_right.childBox div.selectBox:first-child{float:left}
div.listTop div.list_right.childBox div.selectBox select{width:98%; padding-left:2%}
/*******************************170526 추가 끝**********************************/


/*페이징 처리*/
#list_page.userPage {width:100%; margin-top:30px; text-align:center; color:#c7b4a2}
#list_page.userPage a{display:inline-block; width:35px; height:35px; color:#0f0909; font-size:1.154em; line-height:35px; text-align:center; border:1px solid #d4d4d4; background:#fff; margin:0 5px 2px 5px; border-radius:50px}
#list_page.userPage a:hover {color:#f5861a; text-decoration:underline}
#list_page.userPage a.img{background:none; border:0; width:auto; margin:0 4px}
#list_page.userPage a.img img{vertical-align:middle}
#list_page.userPage a.current_page{ color:#fff; background:#2384ad; border-color:#1e7aa1; font-weight:normal; font-style:normal}
#list_page.userPage a.current_page:hover{color:#fff; text-decoration:none}

/*수강신청*/
div.classDate{padding:0 0 30px 0; margin:0}
div.classDate ul{
border-bottom:2px solid  #ca3a12; width:auto; padding:15px 15px 15px 50px; background:#f46138 url(../../images/sub/time_icon2.gif) no-repeat 13px center; font-size:1.154em; line-height:150%; border-radius:10px}
div.classDate ul li{color:#fff; text-align:center; font-size:1.267em}

/*******************************170526 추가 시작****************************************/
div.writeWrap div.writeBox ul li.btnLine{border-bottom:2px solid #575555; background:#808080; padding:0; margin: 10px 0; border-radius:5px}
div.writeWrap div.writeBox button.delChild{width:100%; padding:3px 0 5px 0; border-radius:5px; background: #808080; color:#fff; vertical-align:middle}
div.writeWrap div.writeBox button.delChild span{display:inline-block; padding:0 9px 0 27px; background: #808080 url(../../images/sub/delChild_btn.gif) no-repeat 5px center; line-height:150%}

/*******************************170526 추가 삭제****************************************/
/*홈페이지 바로가기*/
#goHome{clear:both; padding:0; margin:0}
#goHome div.homeWrap{padding:0; margin:0}
#goHome div.homeWrap ul{padding:0; margin:0; *zoom:1; text-align:center}
#goHome div.homeWrap ul:after {content:""; clear:both; display:block; height:0; visibility:none; font-size:0; line-height:0}
#goHome div.homeWrap li{padding:0; margin:0 3px 10px 3px; display:inline-block; width:auto}
#goHome div.homeWrap li div.homeBg{padding:0 0 2px 0; margin:0 auto; width:247px; background:#d4d4d4;border-radius:10px}
#goHome div.homeWrap li div.homeBg div.homeBox{border:1px solid #d4d4d4; background:#fff; width:auto; position:relative; padding:0; margin:0;border-radius:10px}
#goHome div.homeWrap li:nth-child(4n+1) div.homeBg div.homeBox:hover{border-color:#ffae00}
#goHome div.homeWrap li:nth-child(4n+2) div.homeBg div.homeBox:hover{border-color:#1dbf9b}
#goHome div.homeWrap li:nth-child(4n+3) div.homeBg div.homeBox:hover{border-color:#4592c8}
#goHome div.homeWrap li:nth-child(4n) div.homeBg div.homeBox:hover{border-color:#716bc8}
#goHome div.homeWrap li div.homeBg div.homeBox h4{position:absolute; top:50px; left:0; width:100%; text-align:center; background:url(../../images/sub/gohome_titBg.gif) no-repeat center top; font-size:2.154em; line-height:120%; color:#000}
#goHome div.homeWrap li div.homeBg div.homeBox p.teaName{position:absolute; top:105px; left:0; width:100%; text-align:center; font-size:1.154em}
#goHome div.homeWrap li div.homeBg div.homeBox p.teaName strong{color:#000}
#goHome div.homeWrap li div.homeBg div.homeBox p.departImg{padding:144px 0 57px 0; margin:0 auto; width:81px; height:81px; text-align:center}
#goHome div.homeWrap li:nth-child(4n+1) div.homeBg div.homeBox p.departImg{background:url(../../images/sub/gohome_iconBg01.gif) no-repeat center 144px}
#goHome div.homeWrap li:nth-child(4n+2) div.homeBg div.homeBox p.departImg{background:url(../../images/sub/gohome_iconBg02.gif) no-repeat center 144px}
#goHome div.homeWrap li:nth-child(4n+3) div.homeBg div.homeBox p.departImg{background:url(../../images/sub/gohome_iconBg03.gif) no-repeat center 144px}
#goHome div.homeWrap li:nth-child(4n) div.homeBg div.homeBox p.departImg{background:url(../../images/sub/gohome_iconBg04.gif) no-repeat center 144px}
#goHome div.homeWrap li div.homeBg div.homeBox p.departGo{position:absolute; bottom:0; left:82px; margin:0; padding:0; width:81px; height:39px}
#goHome div.homeWrap li div.homeBg div.homeBox p.departGo button{font-size:1.462em; height:39px; display:block; width:100%; color:#fff; font-weight:bold; text-align:center; border:0; background:none}
#goHome div.homeWrap li:nth-child(4n+1) div.homeBg div.homeBox p.departGo{background:url(../../images/sub/gohome_btnBg01.gif) no-repeat}
#goHome div.homeWrap li:nth-child(4n+2) div.homeBg div.homeBox p.departGo{background:url(../../images/sub/gohome_btnBg02.gif) no-repeat}
#goHome div.homeWrap li:nth-child(4n+3) div.homeBg div.homeBox p.departGo{background:url(../../images/sub/gohome_btnBg03.gif) no-repeat}
#goHome div.homeWrap li:nth-child(4n) div.homeBg div.homeBox p.departGo{background:url(../../images/sub/gohome_btnBg04.gif) no-repeat}

/*설문조사*/
#surveyForm div.topSurveyTit{width:auto; border:1px solid #d4d4d4; margin-bottom:20px;border-radius:5px}
#surveyForm div.topSurveyTit>div{padding:20px; margin:0; position:relative}
#surveyForm div.topSurveyTit>div:after {content:""; clear:both; display:block; height:0; visibility:none; font-size:0; line-height:0}
#surveyForm div.topSurveyTit div.topArea {padding-bottom:15px}
#surveyForm div.topSurveyTit div.topArea h4{font-size:1.462em; color:#000; display:inline-block; padding-right:10px; line-height:120%; padding-bottom:5px}
/* #surveyForm div.topSurveyTit div.topArea p{display:inline-block; *display:inline; zoom:1; font-size:1.154em; line-height:120%} */
/* #surveyForm div.topSurveyTit div.topArea a.modiBtn{display:block; padding:0; margin:0; width:80px; height:28px; line-height:26px; text-align:center; color:#fff; background:#3d3d3d; border:1px solid #131313; border-bottom-width:2px; position:absolute; right:20px; top:50%; margin-top:-15px; border-radius:3px} */
#surveyForm div.topSurveyTit div.topArea p{position: absolute; right: 15px; top: 50%; text-align: right; margin-top:-8px; padding:0; border:none}
#surveyForm div.topSurveyTit div.bottomArea{background:#f6f6f6; padding:15px; border-top:1px solid #d4d4d4; border-radius:0 0 5px 5px}
#surveyForm div.topSurveyTit div.bottomArea p.questNum span, #surveyForm div.topSurveyTit div.bottomArea div.btnBox span{color:#F00}
#surveyForm div.topSurveyTit div.bottomArea p.questNum, #surveyForm div.topSurveyTit div.bottomArea .btnBox{padding:0 0 0 10px; background:url(../../images/sub/lst_blt.png) no-repeat left 4px; font-size: 14px; color:#000}
#surveyForm div.topSurveyTit div.bottomArea p.questNum{margin-bottom:10px}
#surveyForm div.topSurveyTit div.bottomArea .modiBtn{display:block; padding:0; margin:0; width:120px; height:28px; line-height:26px; text-align:center; color:#fff; background:#3d3d3d; position:absolute; right:15px; top:20px; border-radius:50px; transition: all .3s}

/* 설문 기능개선으로 추가 : com2zoa_devteam 2023.6.10 */
#surveyForm div.questGroupTit{background:#777f8b; border-bottom-width:3px; color:#000; font-size:1.154em; padding:15px; margin:0 0 20px 0; border-radius:50px; color:#fff}
#surveyForm div.questGroupTit h5{text-indent:-22px; padding-left:22px; line-height:120%}
#surveyForm div.questGroupTit div.groupAddBtn{padding:0; margin:0; font-weight:bold}
#surveyForm div.questGroupTit div.groupAddBtn a{color:#fff; background:url(../images/admin/survey_q_group_add.gif) no-repeat left center; padding:3px 5px 6px 32px; display:inline-block}
#surveyForm div.questGroupTit div.groupInput{padding:8px 0 0 0}
#surveyForm div.questGroupTit div.groupInput div.inputBox{background:#fff; border:1px solid #c4c4c4; width:auto; padding:0 5px; height:30px}
#surveyForm div.questGroupTit div.groupInput div.inputBox input[type=text]{width:100%; padding:0; margin:0; border:0; height:28px; line-height:28px}
#surveyForm div.questList{margin:0 0 20px 0; padding:0}
#surveyForm div.questList ul.quest_list{padding:0; margin:0}
#surveyForm div.questList ul.quest_list>li{margin-bottom:20px; padding:0}
#surveyForm div.questList ul.quest_list>li:lastchild{margin-bottom:0}
#surveyForm div.questList ul.quest_list>li dl{width:auto; padding:20px; padding-top:0; margin:0; border:1px solid #d4d4d4; background:#f6f6f6;border-radius:5px}
#surveyForm div.questList ul.quest_list>li dl dt{position:relative; width:auto; padding:18px 0 20px 0}
#surveyForm div.questList ul.quest_list>li dl dt p.q_Tit{font-size:1.154em; color:#000; font-weight:bold; line-height:120%; padding:3px 0 5px 0}
#surveyForm div.questList ul.quest_list>li dl dt p.q_Tit span{color:#F00}
#surveyForm div.questList ul.quest_list>li dl dd{background:#fff; border:1px solid #e4e4e4; padding:11px 15px 11px 15px; border-radius:5px}
#surveyForm div.questList ul.quest_list>li dl dd div.q_Answer{padding:0; margin:0}
#surveyForm div.questList ul.quest_list>li dl dd div.q_Answer ul{padding:0; margin:0}
#surveyForm div.questList ul.quest_list>li dl dd div.q_Answer ul li{padding:2px 0 4px 20px; text-indent:-20px; line-height:120%}
#surveyForm div.questList ul.quest_list>li dl dd div.q_Answer ul li input[type=checkbox], #surveyForm div.questList ul.quest_list>li dl dd div.q_Answer ul li input[type=radio]{vertical-align:middle; margin:0 5px 0 0}
#surveyForm div.questList ul.quest_list>li dl dd div.q_Answer div.textarea_box{margin:3px 0 0 0; width:auto; padding:0; text-indent:0}
#surveyForm div.questList ul.quest_list>li dl dd div.q_Answer div.textarea_box div.textareaForm{border:1px solid #c4c4c4; background:#fff; padding:0 0 0 5px; margin:0; width:auto; height:50px}
#surveyForm div.questList ul.quest_list>li dl dd div.q_Answer div.textarea_box div.textareaForm textarea{width:100%; border:0; padding:0; height:50px; margin:0}
#surveyForm div.questList ul.quest_list>li dl dd div.exxTxt{background:#ffae00; color:#000; padding:8px 10px 10px 25px; font-weight:bold; margin:10px 0 0 0; text-indent:-15px; line-height:120%;border-radius:10px}
#surveyForm #surveyBtn{padding:0 0 20px 0; margin:0; *zoom:1}
#surveyForm #surveyBtn:after {content:""; clear:both; display:block; height:0; visibility:none; font-size:0; line-height:0}
#surveyForm div.questList ul.quest_result_list>li dl dd div.q_Answer{padding:0; margin:0}
#surveyForm div.questList ul.quest_result_list>li dl dd div.q_Answer ul{padding:0; margin:0}
#surveyForm div.questList ul.quest_result_list>li dl dd div.q_Answer ul li{padding:2px 0 8px 0}
#surveyForm div.questList ul.quest_result_list>li div.q_a_result{padding:0; margin:0}
#surveyForm div.questList ul.quest_result_list>li div.q_a_result p.q_a_txt{padding:0 0 8px 0; margin:0; font-weight:bold;line-height:120%}
#surveyForm div.questList ul.quest_result_list>li div.q_a_result div.resultBar{padding:0; margin:0; position:relative}
#surveyForm div.questList ul.quest_result_list>li div.q_a_result div.resultBar div.resultBar_grap{margin:0 70px 0 0; border:1px solid #c4c4c4; background:#fff; height:25px; border-radius:5px}
#surveyForm div.questList ul.quest_result_list>li div.q_a_result div.resultBar div.resultBar_grap div{background:#ffae00; height:25px; border-radius:3px}
#surveyForm div.questList ul.quest_result_list>li div.q_a_result div.resultBar div.resultBar_txt{position:absolute; top:0; right:0; text-align:right; width:70px; height:25px; line-height:25px; color:#f24b3a; font-weight:600}
#surveyForm div.questList ul.quest_result_list>li button.reView{ background:#3d3d3d; color:#fff; padding:1px 0 4px 0; font-size:0.846em; width:60px; text-align:center}
#surveyForm div.questList ul.quest_result_list>li div.reListBox{ background:#e3e3e3; margin:10px 0 0 0; padding:15px; font-size:0.923em; color:#333; border-radius:5px}
#surveyForm div.questList ul.quest_result_list>li div.reListBox ul{padding:0; margin:0}
#surveyForm div.questList ul.quest_result_list>li div.reListBox ul li{margin:0; padding:0 !important; line-height:140%}
#surveyForm div.questList ul.quest_result_list>li div.q_a_result.short-answer {position:relative}
#surveyForm div.questList ul.quest_result_list>li div.q_a_result.short-answer:after {content:""; clear:both; display:block; height:0; visibility:none; font-size:0; line-height:0} 
#surveyForm div.questList ul.quest_result_list>li div.q_a_result.short-answer button.reView{ position:absolute; top:9px; left:0}
#surveyForm div.questList ul.quest_result_list>li div.q_a_result.short-answer div.resultBar{margin-left:65px}
#surveyForm div.questList ul.quest_result_list>li div.q_a_result.short-answer .resultBar_txt{top:-54px !important}

/*비밀번호 레이아웃*/
div#passWrap{position:fixed; width:100%; height:100%; top:0; left:0; z-index:1000; background:url(../../images/sub/layer_transBg.png)}
div#passWrap p.btnBox{position:absolute; top:15%; right:10%; margin:-60px 0 0 -53px; width:53px; height:53px}
div#passWrap p.btnBox a{display:block; width:53px; height:53px; font-size:0; line-height:0; background:url(../../images/sub/layer_closeBtn.png)}
div#passWrap p.btnBox a span{position:absolute; top:-1000px; left:-20000px}
div#passWrap div.passBox{width:80%; position:fixed; top:15%; left: 10%; background:#fff; margin:0 0 0 0; border-radius:10px; overflow:hidden}
div#passWrap div.passBox h4{background:#4076b2; margin:10px; width:auto; padding:0;color:#fff; text-align:center; font-size:1.462em; height:50px; font-weight:normal; line-height:48px; border-radius:10px}
div#passWrap div.passBox div.passConBox{margin:10px; width:auto; height:auto; padding:0}
div#passWrap div.passBox div.passConBox:after {content:""; clear:both; display:block; height:0; visibility:none; font-size:0; line-height:0}
div#passWrap div.passBox div.passConBox ul.topTxt{clear:both; padding:0; margin:0}
div#passWrap div.passBox div.passConBox ul.topTxt li{line-height:150%; background:url(../../images/sub/passModi_dot.gif) no-repeat left 10px; padding:0 0 0 10px}
div#passWrap div.passBox div.passConBox ul.topTxt li span{color:#ec2222}
div#passWrap div.passBox div.passConBox div.passLeftBox, div#passWrap div.passBox div.passConBox div.passRightBox{margin:10px 0 0 0}
div#passWrap div.passBox div.passConBox div div.passCon{padding:10px; margin:0; background:#f0f6fd; position:relative; border-radius:10px}
div#passWrap div.passBox div.passConBox div div.passCon h5{height:40px; line-height:38px; color:#fff; background:#6c737b; text-align:center; font-size:1.308em; font-weight:normal; border-radius:10px}
div#passWrap div.passBox div.passConBox div.passLeftBox div.passCon dl{padding:12px 10px 0 10px; margin:0; *zoom:1}
div#passWrap div.passBox div.passConBox div.passLeftBox div.passCon dl:first-child{padding-top:30px}
div#passWrap div.passBox div.passConBox div.passLeftBox div.passCon dl:after {content:""; clear:both; display:block; height:0; visibility:none; font-size:0; line-height:0}
div#passWrap div.passBox div.passConBox div.passLeftBox div.passCon dl dt{ display:none}
div#passWrap div.passBox div.passConBox div.passLeftBox div.passCon dl dd{margin:0; padding:0}
div#passWrap div.passBox div.passConBox div.passLeftBox div.passCon dl dd div.inputBox{padding:0 10px; margin:0; background:#fff; width:auto; border:1px solid #c8cdd2; border-bottom-width:3px; height:37px; border-radius:10px}
div#passWrap div.passBox div.passConBox div.passLeftBox div.passCon dl dd div.inputBox input[type=password]{height:35px; line-height:35px; border:0; width:100%; padding:0; margin:0; background:#fff}

/*초기비밀번호 변경 추가영역*/
div#passWrap div.passBox div.passConBox div.passLeftBox div.passCon dl dd div.inputBox input[type=text]{height:35px; line-height:35px; border:0; width:100%; padding:0; margin:0; background:#fff}
div#passWrap div.passBox div.passConBox div.passLeftBox div.passCon dl dd div.inputBox.inputphone{display:inline-block; width:64px}
div#passWrap div.passBox div.passConBox div.passLeftBox div.passCon dl dd div.inputBox input::placeholder {font-size:12px}
div#passWrap div.passBox div.passConBox div.passLeftBox div.passCon div.btnBox{width:100%; padding:20px 0 0 0; margin:0}
div#passWrap div.passBox div.passConBox div.passLeftBox div.passCon div.btnBox button{background:#4076b2; display:block; width:100%; text-align:center; color:#fff; font-size:1.154em; padding:8px 0 10px 0; border-bottom:3px solid #225896; border-radius:10px}
div#passWrap div.passBox div.passConBox div.passRightBox div.passCon ul{margin:0; padding:0 10px}
div#passWrap div.passBox div.passConBox div.passRightBox div.passCon ul li{line-height:150%; background:url(../../images/sub/passModi_dot.gif) no-repeat left 10px; padding:0 0 0 10px; color:#000000; margin:10px 0 12px 0}
div#passWrap div.passBox div.passConBox div.passRightBox div.passCon ul li:last-child{margin-bottom:0}

/*부서소개 펼침형*/
.departList{clear:both; padding:0; margin:0}
.departList ul{position:relative; padding:0; margin:0}
/* .departList ul:after {content:""; clear:both; display:block; height:0; visibility:none; font-size:0; line-height:0}
.departList ul li {width:50%; float:left} */
.departList ul li div.departWrap{margin:0 5px 10px 5px; padding:10px; border:1px solid #d4d4d4; background:#fbfbfb}
.departList ul li div.departWrap div.departBox{background:#ececec;  margin:0; width:auto; border-radius:10px}
.departList ul li div.departWrap div.departBox div.departTit{border-width:1px; border-style:solid; padding:8px 0 8px 10px; margin:0; border-radius:10px 10px 0 0}
.departList ul li div.departWrap div.departBox div.departTit:after {content:""; clear:both; display:block; height:0; visibility:none; font-size:0; line-height:0}
.departList ul li div.departWrap div.departBox div.departTit p.iconBox{background:url(../../images/sub/departIcon_bg.png) no-repeat left center; width:50px; height:50px; float:left; margin-right:10px}
.departList ul li div.departWrap div.departBox div.departTit p.iconBox img{width:50px}
.departList ul li div.departWrap div.departBox div.departTit h4{font-size:1.692em; line-height:150%; padding-top:5px; font-family: 'Gmarket Sans'; color:#fff}
.departList ul li:nth-child(3n+1) div.departWrap div.departBox div.departTit{border-color:#df9800; background:#ffae00}
.departList ul li:nth-child(3n+2) div.departWrap div.departBox div.departTit{border-color:#18997c; background:#1dbf9b}
.departList ul li:nth-child(3n) div.departWrap div.departBox div.departTit{border-color:#2678b2; background:#4592c8}
.departList ul li div.departWrap div.departBox div.departCon{background:#fff; border:1px solid #cac9c9; border-top:0; width:auto; padding:10px}
.departList ul li div.departWrap div.departBox div.departCon dl{padding:0 0 10px 0; line-height:150%}
.departList ul li div.departWrap div.departBox div.departCon dl dt{font-weight:bold; color:#000; padding:2px 5px; border-radius:50px; text-align:center; color:#000; background:#f1f1f1}
.departList ul li div.departWrap div.departBox div.departCon dl dd{padding:10px;text-align:left; border-bottom:1px solid #ccc}
.departList ul li div.departWrap div.departBox div.departCon dl.oneLine dt{float:left; min-width:80px; margin:0 5px 0 0; color:#fff}
.departList ul li div.departWrap div.departBox div.departCon dl.oneLine dd{padding:0; text-align:left; border-bottom:0}
.departList ul li:nth-child(3n+1) div.departWrap div.departBox div.departCon > dl.oneLine > dt{background:#df9800}
.departList ul li:nth-child(3n+2) div.departWrap div.departBox div.departCon > dl.oneLine > dt{background:#18997c}
.departList ul li:nth-child(3n) div.departWrap div.departBox div.departCon > dl.oneLine > dt{background:#2678b2}
.departList ul{gap:10px}
.departList ul li{flex:1; min-width:30%; margin:0 5px}
.departList ul li.nolist{padding:15px; border-radius:5px; background:#f8f8f8; text-align:center}

/*강사소개 레이아웃*/
div.teaWrap{position:fixed; width:100%; height:100%; top:0; left:0; z-index:1000; background:url(../../images/sub/layer_transBg.png)}
div.teaWrap p.btnBox{position:absolute; top:50%; left:50%; margin:-290px 0 0 372px; width:53px; height:53px}
div.teaWrap p.btnBox a{display:block; width:53px; height:53px; font-size:0; line-height:0; background:url(../../images/sub/layer_closeBtn.png)}
div.teaWrap p.btnBox a span{position:absolute; top:-1000px; left:-20000px}
div.teaWrap div.teaBox{width:820px; height:430px; padding:10px; margin:0; position:absolute; top:50%; left:50%; margin:-225px 0 0 -420px; background:#fff; text-align:left; border-radius:35px 35px 10px 10px}
div.teaWrap div.teaBox h4{background:linear-gradient(100deg, #3f9aef , #c097fd); color:#fff; text-align:center; font-size:18px; height:50px; font-weight:normal; line-height:48px; border-radius:30px 30px 5px 5px; font-family: 'Gmarket Sans';}
div.teaWrap div.teaBox div.teaInfoBox{height:380px; overflow-y:auto}
div.teaWrap div.teaBox dl{margin:10px 0 0 0; padding:0; clear:both; border-radius:10px}
/* div.teaWrap div.teaBox dl.departName{background:#e8fdf8 url(../../images/sub/tea_icon01.gif) no-repeat 10px 10px}
div.teaWrap div.teaBox dl.teaName{background:#e8fdf8 url(../../images/sub/tea_icon02.gif) no-repeat 10px 10px}
div.teaWrap div.teaBox dl.teaCareer{background:#e8fdf8 url(../../images/sub/tea_icon03.gif) no-repeat 10px 10px}
div.teaWrap div.teaBox dl.departEdu{background:#e8fdf8 url(../../images/sub/tea_icon04.gif) no-repeat 10px 10px; min-height:200px} */
div.teaWrap div.teaBox dl dt{float:none !important; font-weight:bold; color:#000; padding:10px 10px 5px 10px; margin:0 0 0 75px !important; color:#000 !important; text-align:left !important; background:none !important}
div.teaWrap div.teaBox dl dd{padding:0 10px 15px 10px; margin:0 0 0 80px; min-height:20px}

/*설문관리 참여목록 보기*/
.surveyList .surveyList_tit {width:auto; border:2px solid #737373; margin-bottom:20px;border-radius:5px}
.surveyList .surveyList_tit>div{padding:16px 20px 20px 20px; margin:0; position:relative}
.surveyList .surveyList_tit>div:after {content:""; clear:both; display:block; height:0; visibility:none; font-size:0; line-height:0}
.surveyList .surveyList_tit div.topArea {padding-bottom: 15px}
.surveyList .surveyList_tit div.topArea h4 {font-size:1.462em; color:#000; padding-right:10px; line-height:120%; padding-bottom:5px; font-weight: normal}
.surveyList .surveyList_tit div.topArea h4 span {display:inline-block}
/* .surveyList .surveyList_tit div.topArea p {padding-top:10px; margin-top:10px; border-top:1px solid #ccc; font-size: 1.154em; line-height: 130%; text-align:center} */
/* .surveyList .surveyList_tit div.topArea p{position: absolute; right: 15px; top: 50%; text-align: right; margin-top:-10px; padding:0; border:none} */
.surveyList .surveyList_tit span.left_box {width: 105px; font-weight: 600}
.surveyList .surveyList_tit div.botArea{background:#f6f6f6; padding:18px; border-top:1px solid #b1b3b7; position: relative; border-radius:0 0 5px 5px}

/* 설문 기능개선으로 추가 : com2zoa_devteam 2023.6.10 */
.surveyList .surveyList_tit div.botArea div.selectBox select {position: absolute; right: 15px; bottom: 18px; border:0; height:37px; width:150px; padding:0 0 0 10px; font-size:1em; color:#000; background:#fff url(../../images/sub/select_arrow.png) no-repeat right 12px center; box-sizing:content-box; appearance: none; border-radius:5px; border:1px solid #d0d0d0}
.surveyList .surveyList_tit div.botArea p.target, .surveyList .surveyList_tit div.botArea p.count {padding:0 0 0 10px; background:url(../../images/sub/lst_blt.png) no-repeat left 4px; font-size: 14px; color:#000}
.surveyList .surveyList_tit div.botArea p.target{margin-bottom:10px}
.surveyList .surveyList_tit div.botArea p.count span {color: #f00}
.surveyList .btnArea {padding-bottom: 20px;text-align: center}

/*방과후학교 소개*/
#afterInfo{clear:both; padding:0; margin:0}
#afterInfo div.topBox{ background:#7aabfe url(../../images/sub/t_after_infoBg.png) no-repeat center 5px; padding:40px 10px 10px 10px; position:relative; margin:0 0 10px 0; border-radius:5px}
#afterInfo div.topBox p{font-size:2em; font-weight:bold; color:#282726; background:#fff; border:3px solid #1f7bbb; text-align:center;  padding-top:0; height:45px; line-height:50px; margin-top:30px;border-radius:30px}
#afterInfo div.topBox p span{color:#ff7200}
#afterInfo h4{background:url(../../images/sub/sub_tit_blt.gif) no-repeat left top; font-size:1.308em; font-weight:bold; color:#000; padding:5px 0 5px 40px; line-height:150%; margin:10px 0 15px 0}
#afterInfo p{line-height:150%; padding:10px}
#afterInfo ul{background:#fff; margin:0; border:1px solid #cfcfcf; border-bottom-width:2px; padding:10px;border-radius:5px}
#afterInfo ul li{padding:5px; margin:0; line-height:150%; background:url(../../images/sub/m_notice_dot.gif) no-repeat left center; padding-left:10px}

/** 수강신청 버튼 색상 추가 design KJH 190122 **/
div.tableBox table tbody .apply_no01 span {color:#368be2}
div.tableBox table tbody .apply_no02 span {color:#ff4c34}

@media only screen and (max-width:600px) {
div.appliDate ul{background:#3e6477; padding-left:15px}
div.classDate ul{background:#f46138; padding-left:15px}
.departList ul li {width:100%}
}

/*======================== MOBILE LAYOUT ========================*/
@media only screen and (max-width:1199px) {
/*콘텐츠*/
.mnone{display:none}
.mview{display:block}
div.tableBox table tbody th span.tit{display:block}
div.rightBox {z-index:50}
/* div#list_top {z-index:99 !important} */
}

/*======================== tablet LAYOUT ========================*/
@media only screen and (min-width:1200px) and (max-width:1689px){
/*section*/
section#subContainer div.subContain div.pd0{padding:0 !important}

/*서브메뉴*/
/* #subMn{display:block} */
div#subTop{position:relative; padding:0 0 20px 0; border-bottom:1px solid #ccc; margin:0 0 25px}
div#subTop h3{margin-left:0; margin-right:0; border-bottom:0; padding-bottom:0}
div.rightBox{left:inherit; right:15px; width:auto; top:auto; bottom:20px}
    
/*콘텐츠*/
.tnone{display:none}
.tview{display:block}
div.tableBox table tbody th span.tit{display:block}
div.teaWrap div.teaBox dl.departName{ clear:none;float:left; width:49.5%; margin-bottom:10px}
div.teaWrap div.teaBox dl.teaName{ clear:none;float:right; width:49.5%; margin-bottom:10px}
#userBtnBox div.rightBtn.twoBtn {width:450px; margin:0 auto}

/*비밀번호 변경*/
div#passWrap div.passBox div.passConBox ul.topTxt{background:url(../../images/sub/passModi_icon.gif) no-repeat left top; padding-left:70px; padding-top:5px; padding-bottom:10px}
div#passWrap div.passBox div.passConBox ul.topTxt li{font-size:1.154em; background-position:left 12px}
div#passWrap div.passBox div.passConBox div.passLeftBox div.passCon dl dt{display:block; width:125px; float:left; font-size:1.154em; color:#000; line-height:35px}
div#passWrap div.passBox div.passConBox div.passLeftBox div.passCon dl dd{margin-left:125px}
}

/*======================== PC LAYOUT ========================*/
@media only screen and (min-width:1690px) {
/*section*/

/*서브메뉴*/
#subMn{display:block}

div#subTop{position:relative; padding:0 0 20px 0; border-bottom:1px solid #ccc; margin:0 auto 23px auto; width:1030px}
div#subTop h3{margin-left:0; margin-right:0; border-bottom:0;  padding-bottom:0}
div.rightBox{left:inherit; right:0; width:auto; top:auto; bottom:20px}
    
/*콘텐츠*/
.pnone{display:none}
.pview{display:block}
#userBtnBox div.rightBtn.twoBtn {width:450px}

/**170526 수정 시작**/
div.writeWrap div.writeBox ul li div.stu_wrap {margin-bottom:5px}
    
/**170526 추가 시작**/
div.writeWrap div.writeBox ul{position:relative}
div.writeWrap div.writeBox ul li.btnLine{border-bottom:0; background:none; text-align:right; position:absolute; bottom:10px; right:15px}
div.writeWrap div.writeBox button.delChild{width:auto; position: absolute; right: 17px; bottom: 16px; margin-top:0}

/*비밀번호 변경*/
div#passWrap p.btnBox{top:47%; right:auto; left:50%; margin:-285px 0 0 367px}
div#passWrap div.passBox{width:840px; height:509px; position:fixed; top:47%; left:50%; margin:-225px 0 0 -420px}
div#passWrap div.passBox div.passConBox ul.topTxt{background:url(../../images/sub/passModi_icon.gif) no-repeat 10px top; padding:5px 10px 10px 80px}
div#passWrap div.passBox div.passConBox ul.topTxt li{font-size:1.154em; background-position:left 12px}
div#passWrap div.passBox div.passConBox div.passLeftBox{width:57% !important}
div#passWrap div.passBox div.passConBox div.passRightBox{width:43% !important; float:right}
div#passWrap div.passBox div.passConBox div div.passCon{min-height:270px !important; max-height:270px !important}
div#passWrap div.passBox div.passConBox div.passLeftBox div.passCon{margin-right:5px}
div#passWrap div.passBox div.passConBox div.passRightBox div.passCon{margin-left:5px}
div#passWrap div.passBox div.passConBox div.passLeftBox div.passCon dl dt{display:block; width:125px; float:left; font-size:1.154em; color:#000; line-height:35px}
div#passWrap div.passBox div.passConBox div.passLeftBox div.passCon dl dd{margin-left:125px}
div#passWrap div.passBox div.passConBox div.passLeftBox div.passCon dl.pass1{padding-top:30px}
div#passWrap div.passBox div.passConBox div.passLeftBox div.passCon div.btnBox{padding-top:40px}
div#passWrap div.passBox div.passConBox div.passRightBox div.passCon ul{padding-top:15px}
.departList ul li{width:33.3% !important}

/*방과후학교안내*/
#afterInfo div.topBox{background:#7aabfe url(../../images/sub/after_infoBg.png) no-repeat left bottom; padding:10px 0 5px 0; height:90px; border-radius:none; width:1029px}
#afterInfo div.topBox p{width:480px; height:45px; text-align:center; margin:10px auto; margin-top:20px}
}

@media only screen and (min-width:950px) {
div.listTop p.list_left{float:left; padding-top:10px}
div.listTop div.list_right{float:right; width:400px}
/* .departList ul li{width:50%} */
/*설문관리 참여목록 보기*/
.surveyList .surveyList_tit div.topArea p {position: absolute; right: 15px; top: 50%; text-align: right; margin-top:-10px; padding:0; border:none}
}
@media only screen and (max-width:950px) {
#surveyForm div.topSurveyTit div.topArea{padding:10px; text-align:center}
#surveyForm div.topSurveyTit div.topArea p{display:block; position:inherit; right:0; top:0; padding-top:10px; margin-top:10px; border-top:1px solid #ccc; font-size:14px; line-height: 130%; text-align:center}
#surveyForm div.topSurveyTit div.bottomArea a.modiBtn{width:70px}
}
@media only screen and (max-width:1000px) {
div.teaWrap p.btnBox{margin-left:-26px; left:90%}
div.teaWrap div.teaBox{ width:80%; margin-left:0; left:10%}
div.teaWrap div.teaBox dl.departName{clear:both;float:none; width:auto; margin-bottom:0; }
div.teaWrap div.teaBox dl.teaName{ clear:both;float:none; width:auto; margin-left:0; margin-bottom:0; }
div.teaWrap div.teaBox dl.departEdu{min-height:115px}
}

@media only screen and (max-width:500px) {
div.tableBox table thead th{font-size:1em}
div.tableBox table tbody th, div.tableBox table tbody td{font-size:1em}
}

@media only screen and (max-width:1299px) {
div#passWrap div.passBox div.passConBox{overflow-y:scroll}
div#passWrap div.passBox div.passConBox{height:420px}
/*초기비밀번호 변경 추가영역*/
div#passWrap div.passBox div.passConBox div.passLeftBox div.passCon dl dd div.inputBox input[type=text]{height:35px; line-height:35px; border:0; width:100%; padding:0; margin:0; background:#fff}
}

@media only screen and (max-width:455px) {
div#passWrap div.passBox div.passConBox div.passLeftBox div.passCon dl dd div.inputBox.inputphone{display:block; width:auto}
div#passWrap div.passBox div.passConBox div.passLeftBox div.passCon dl dd{text-align:center}
}

/**170501 추가 및 수정**/
div.listTop div.list_right div.selectWrap{margin:0 67px 0 0; width:auto; padding:0; position:relative}
div.listTop div.list_right div.selectWrap div.float-left{float:left; width:49%; padding:0 1% 0 0}
div.listTop div.list_right div.selectWrap div.selectBox{position:static; width:auto; padding:0 0 0 10px}
div.listTop div.list_right div.selectWrap div.selectBox select {width:100%; padding:0} 

/**220321 kjh 모바일 스크롤 추가 및 수정**/
.tb_scroll {display:none}

@media only screen and (max-width:767px) {
.tableScroll {overflow-x:auto;position:relative}
.tb_scroll {display:block; margin:0 0 12px; text-align:right}
.tb_scroll span {display:block; padding:15px; background:#9f9f9f url(../../images/super/scroll_txt.png) no-repeat center; border-radius:50px 50px; font-size:0}
.tableScroll table {min-width:800px}
.tableScroll table th, .tableScroll table td {word-break:keep-all}
}

/*펼침형스타일 추가 */
div.teaWrap div.teaBox dl.departName{background:#ddf3ff url(../../images/sub/tea_icon01.png) no-repeat 10px 10px}
div.teaWrap div.teaBox dl.teaName{background:#ddf3ff url(../../images/sub/tea_icon02.png) no-repeat 10px 10px}
div.teaWrap div.teaBox dl.teaCareer{background:#f3e1fc url(../../images/sub/tea_icon03.png) no-repeat 10px 10px}
div.teaWrap div.teaBox dl.departEdu{background:#f3e1fc url(../../images/sub/tea_icon04.png) no-repeat 10px 10px; min-height:200px}
.departList ul {display:flex; flex-wrap:wrap}
/* .departList ul li {width:49%; margin:0 0.5% 10px} */
.departList ul li {border:1px solid #d4d4d4; border-radius:40px 40px 10px 10px; box-sizing:border-box; margin-bottom:14px}
.departList ul li div.departWrap {border:0; margin:0; background:none}
.departList ul li div.departWrap div.departBox div.departCon {position:relative}
.departList ul li div.departWrap div.departBox button{border-bottom-style:solid; border-bottom-width:2px; color:#fff; font-size:12px; padding:1px 7px 3px 7px; margin:0 5px;
border-radius:5px}
.departList ul li div.departWrap div.departBox div.departCon button.teaBtn{background:#556774}
.departList ul li div.departWrap div.departBox div.departCon dl dd {min-height:20px; word-break:keep-all}
.departList ul li div.departWrap div.departBox div.departCon .teaWrap dl {min-height:40px; padding-top:10px}
.departList ul li div.departWrap div.departBox div.departCon .teaWrap dl dd {margin-top:7px}
.departList ul li div.departWrap div.departBox div.departCon {border:0}
.departList ul li div.departWrap div.departBox {background:none}
.departList ul li div.departWrap div.departBox div.departTit {border-radius:50px}
.departList ul li div.departWrap div.departBox div.departTit h4 {padding-top:11px}
.departList ul li div.departWrap div.departBox div.departTit h4 a {color:#fff}
.departList ul li div.departWrap div.departBox div.departCon dl dt {background-position:0 7px !important}
.departList ul li div.departWrap div.departBox div.departCon>dl>dt {background-position:0 3px !important}
.departList ul li div.departWrap div.departBox div.departCon dl.oneLine>dt {float:left}


/* ==============  방과후 기능 업데이트 240819 kjh ============= */
@media only screen and (min-width: 1300px) {
div#subTop {width:100%}
section#subContainer div.subContain div.subConWrap div#subPage {width:100%; margin-bottom:150px; box-sizing:border-box}
section#subContainer div.subContain div.subConWrap div.topBtn {margin-left:730px}
}








/*★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★*/
/*★★★★★★★★ 방과후 3.0 디자인리뉴얼 새로운 스타일 추가되는 영역*_KYJ 2024.08.26 ~ 추가 ★★★★★★★★*/
/*★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★*/

/****** 공통스타일 추가 ******/
a{text-underline-offset:3px}
u{text-decoration: none}
input::placeholder{color: #c5c5c5; font-weight: 400; font-size: 13px}
h4.h4_tit{padding:2px 0 2px 30px; margin:25px 0 15px; font-size:19px; color:#000; background:url(../../images/sub/ico_h4tit.gif) no-repeat left top}

/*col class 선언영역*/
.widfix{width:40px}
.wid2{width: 2%}
.wid3{width: 3%}
.wid4{width: 4%}
.wid5{width: 5%}
.wid6{width: 6%}
.wid7{width: 7%}
.wid8{width: 8%}
.wid9{width: 9%}
.wid10{width: 10%}
.wid12{width: 12%}
.wid13{width: 13%}
.wid14{width: 14%}
.wid15{width: 15%}
.wid18{width: 18%}
.wid20{width: 20%}
.wid23{width: 23%}
.wid25{width: 25%}
.wid30{width: 30%}
.wid33{width: 33.3%}
.wid40{width: 40%}
.wid50{width: 50%}
.wid60{width: 60%}
.wid70{width: 70%}
.wid75{width: 75%}
.wid80{width: 80%}
.wid90{width: 90%}
.widauto{width: auto}
/*자유수강권*/
.widfix_tb{width:190px !important}

/*폰트에서 span사용시 색지정*/
span.col_r{font-weight: 600; color:#ff4832}
span.col_g{font-weight: 600; color:#2e9b2c}
span.col_b{font-weight: 600; color:#189be6}
span.col_o{font-weight: 600; color: #fe8b1a}
span.col_p{font-weight: 600; color: #ea3877}
span.col_pk{font-weight: 600; color: #f15cac}
span.col_y{font-weight: 600; color: #ff7f0e}
span.col_bk{font-weight: 600; color:#000}

/****** html교체하여 새로운 스타일 적용 ******/
/*퀵 교체*/
.btn_top.sub_btntop {position: absolute; right:0; top:275px; margin-right:0; z-index:5}

/*수강신청-수강신청 기간 교체*/
/*div.app_date{padding:7px; margin-bottom:11px; border-radius:5px; border:2px solid #ff4541; text-align:center}*/
div.app_date{padding:7px; margin-bottom:11px; border-radius:5px; border:2px solid #ff4541}
div.app_date .datetime{padding:6px 0 3px 35px; margin:0 0; background:url(../../images/sub/ico_datetime2.gif) no-repeat left 4px; line-height:130%; font-family: 'Gmarket Sans'; font-size:18px; color:#ff4541; font-weight:500}
div.app_date ul{padding:7px; margin-top:8px; border-radius:3px; background:url(../../images/sub/ico_datelst.png) no-repeat 17px center #f6f6f6; text-align:left; font-size:14px}
div.app_date ul li{padding-left:12px; margin:0 0 3px 50px; line-height:130%; background:url(../../images/sub/lst_blt.png) no-repeat left 6px}
div.app_date ul li:last-child{margin-bottom:0}

/*방과후 테이블(★안내페이지용)*/
.af_table {width:100%; margin-bottom:25px; border-collapse:collapse; table-layout:auto; background:#4c5460; border-radius: 5px 5px 0 0}
.af_table table{width: 100%; font-size: 15px}
.af_table .txtleft {text-align: left}
.af_table.table_scroll{overflow-x: auto; position: relative}
.af_table.table_scroll > table {min-width:500px}
.scroll_txt{display: none}
/*표*/
.af_table thead th { line-height:150%; padding:8px;  border:1px solid #fff; border-top:1px solid #d0d0d0;  vertical-align:middle;text-align:center; font-weight:500; color:#fff}
.af_table thead th:first-child {border-left:1px solid #d0d0d0}
.af_table thead th:last-child {border-right:1px solid #d0d0d0}
.af_table tbody th {line-height:150%; background:#f8f8f8; padding:8px; border:1px solid #ddd;  text-align:center; font-weight:500; vertical-align:middle; color:#000}
.af_table tbody td {line-height:150%; background:#fff; padding:8px; border:1px solid #ddd;text-align:center; vertical-align:middle; color:#000}

/*방과후 공통 안내페이지*/
/*타이틀*/
.guide_page .gdp_titbx{margin-bottom: 20px; font-family: 'Gmarket Sans'; text-align: center}
.guide_page .sch_titbx{display: inline-block; padding:2px; margin-bottom: 20px; background:linear-gradient(100deg, #5b99f2 , #b997fc); border-radius: 50px}
.guide_page .sch_name{display: inline-block; padding: 6px 75px; background: #fff; border-radius: 50px}
.guide_page .sch_name span{display: inline-block; padding: 4px 0 0; background-image:linear-gradient(90deg, #748af6 , #9f64ff); background-clip: text; -webkit-background-clip: text; color: transparent; font-weight: 600; font-size: 20px}
.guide_page .afs_name{font-size: 32px; font-weight: 600}
/*상단안내문구*/
.guide_page .gdp_topbx{position: relative; padding: 23px; margin-bottom: 20px; background:url(../../images/sub/gdp_bg.png) no-repeat right bottom; border-radius: 5px; border:2px solid #eaeaea; line-height: 150%; font-size: 15px}
.guide_page .gdp_topbx::after{content:""; clear:both; display:block; position: absolute; bottom:0; right:20px; width:174px; height: 136px;  background:url(../../images/sub/gdp_img.png) no-repeat right bottom}
.guide_page .gdp_topbx p{margin-right: 180px}
/*로그인방법안내*/
.guide_page .gdp_loginbx{position: relative; margin: 50px 0 30px; padding: 23px; border-top:1px solid #e2e2e2; border-bottom: 2px solid #e2e2e2; font-size: 15px; text-align: center}
.guide_page .gdp_loginbx .tit{width: 200px; padding: 8px 0 10px; margin: -40px auto 0; border-radius:50px; background: #5faaf1; color:#fff; font-size: 17px; font-weight: 600}
.guide_page .gdp_loginbx .login_tb{margin: 23px 0 0 0; font-size: 15px}
.guide_page .gdp_loginbx .txt2{padding: 12px; margin-top: 13px; border-radius: 5px; background: #f5f5f5; font-size: 14px; line-height: 140%}
/*기간등 안내*/
.guide_page .gdp_datebx dl{display: flex; margin-bottom: 10px; font-size: 16px; line-height: 130%}
.guide_page .gdp_datebx dl dt, .guide_page .gdp_datebx dl dd{padding: 12px; border-radius: 5px; align-content: space-around; box-sizing: border-box}
.guide_page .gdp_datebx dl dt{width: 20%; margin-right: 10px; background: #99a2af; text-align: center; color:#fff}
.guide_page .gdp_datebx dl dd{width: 80%; border:1px solid #e2e2e2}
.guide_page .gdp_datebx dl:first-child dt{background: #6a7687}
.guide_page .gdp_datebx dl:first-child dd{font-weight: 700}
/*안내사항리스트*/
.guide_page .gdp_lstbx{padding: 20px; border-radius: 5px; border:1px solid #eaeaea; line-height: 140%}
.guide_page .gdp_lstbx > ul > li{position: relative; padding-left: 15px; margin-bottom: 10px; font-size: 15px}
.guide_page .gdp_lstbx > ul > li::after{content:""; clear:both; display:block; position: absolute; top:6px; left:0; width: 7px; height: 2px; background: #727272}
.guide_page .gdp_lstbx > ul > li:last-child{margin-bottom: 0}
.guide_page .gdp_lstbx .lst_sub{padding: 13px; margin: 10px 0 15px; border-radius: 5px; background: #f5f5f5; font-size: 14px}
.guide_page .gdp_lstbx > ul > li:last-child .lst_sub{margin-bottom: 0}
.guide_page .gdp_lstbx .lst_sub li{position: relative; margin-bottom: 7px; padding-left: 10px}
.guide_page .gdp_lstbx .lst_sub li:last-child{margin-bottom: 0}
.guide_page .gdp_lstbx .lst_sub ul li::after{content:""; clear:both; display:block; position: absolute; top:6px; left:0; width: 3px; height: 3px; background: #727272}
/*경고안내문구*/
.guide_page .warning_tb{position: relative; padding:20px 15px; margin-top: 15px; border-radius: 5px; background: #4c5460; font-size: 15px; color:#fff}
.guide_page .warning_tb > p{position: relative; padding-left: 38px; line-height: 140%}
.guide_page .warning_tb::after{content:"!"; clear:both; display:block; position: absolute; top:50%; left:13px; width: 28px; height: 28px; margin-top: -14px; line-height: 28px; background: #fff; border-radius: 50px; color:#ff2c27; text-align: center; font-weight: 700; font-size:20px}

/*상단 선택 검색영역 수정 (html함께 변경)*/
.subsrch_wrap{display: flex; flex-wrap: wrap; padding: 5px 8px 5px 5px; background: #f0f0f0; border-radius:5px}
.subsrch_wrap.my_childsrch{margin-bottom:8px}
.subsrch_wrap .srch_tit{width: 10%; align-content: space-around; font-weight: 600; font-size: 15px; text-align: center}
.subsrch_wrap .topsrch_selbx{display:flex; width: 90%}
.subsrch_wrap .topsrch_selbx div.select_wrap{display: flex; flex-wrap: wrap; width: 100%}
.subsrch_wrap .topsrch_selbx div.select_wrap > div{flex: 1; margin:3px}
.subsrch_wrap .topsrch_selbx div.select_wrap select{appearance: none; display:block; width:100%; min-width:180px; height: 34px; line-height: 34px; padding: 0 30px 0 7px; color:#000; border-radius:5px; border:1px solid #d0d0d0; background:#fff url(../../images/super/select_arrow.png) no-repeat right 10px center; font-family:NSK; white-space:pre}
.subsrch_wrap .topsrch_selbx .srch_input input{width: 100%; min-width:150px; height: 34px; line-height: 34px; border:1px solid #d0d0d0; border-radius: 5px; box-sizing: border-box}
.subsrch_wrap .topsrch_selbx .srch_btn{display: block; width: 100px; margin:3px 0 3px 5px; background: #46494e; border-radius: 5px; transition: all .3s}
.subsrch_wrap .topsrch_selbx .srch_btn:hover{background-color:#606369 !important}
.subsrch_wrap .topsrch_selbx .srch_btn button{display: block; width:100%; height: 100%; background: none; color:#fff}
.subsrch_wrap .topsrch_selbx .refresh_btn{display: block; width: 100px; margin:3px 0 3px 5px; background: #ff564d; border-radius: 5px; transition: all .3s}
.subsrch_wrap .topsrch_selbx .refresh_btn:hover{background-color:#da4c44 !important}
.subsrch_wrap .topsrch_selbx .refresh_btn button{display: block; width:100%; height: 100%; background: none; color:#fff}

/****** 기존스타일에서 일부 변경등의 사항기재 ******/
/*관리자-매뉴얼버튼*/
#gnb .admmanualMn{margin:10px}
#gnb .admmanualMn a{position: relative; display:block; padding:15px 15px 15px 35px; border-radius:5px; border:2px solid #ffb71c; font-size:15px; color:#ffb71c; text-align:center; transition: all .3s}
#gnb .admmanualMn a::after{content:""; clear:both; display:block; position: absolute; top:10px; left:50%; width: 22px; height: 22px; margin-left:-65px; background:url(../../images/sub/ico_manual.png) no-repeat 0 0}
#gnb .admmanualMn a:hover{border-color:#fff; background:#fff; color:#000}
#gnb .admmanualMn a:hover::after{background:url(../../images/sub/ico_manual_a.png) no-repeat 0 0}
/*관리자-매뉴얼버튼*/
#gnb .lecmanualMn{margin:10px}
#gnb .lecmanualMn a{position: relative; display:block; padding:15px 15px 15px 35px; border-radius:5px; border:2px solid #ffb71c; font-size:15px; color:#ffb71c; text-align:center; transition: all .3s}
#gnb .lecmanualMn a::after{content:""; clear:both; display:block; position: absolute; top:10px; left:50%; width: 22px; height: 22px; margin-left:-65px; background:url(../../images/sub/ico_manual.png) no-repeat 0 0}
#gnb .lecmanualMn a:hover{border-color:#fff; background:#fff; color:#000}
#gnb .lecmanualMn a:hover::after{background:url(../../images/sub/ico_manual_a.png) no-repeat 0 0}

/*탭스타일*/
section#subContainer div.subContain div.pcBox{padding:0; margin-bottom:30px}
.subContain #subMn .pcBox ul{display: flex; flex-wrap: wrap; justify-content: space-between; font-family: 'Gmarket Sans'}
.subContain #subMn .pcBox li{flex:1; padding:0 0 0 10px}
.subContain #subMn .pcBox li:first-child{padding-left:0}
.subContain #subMn .pcBox li a{display:block; padding:17px 10px 15px; border-radius:5px 5px 25px 25px; background:#f1f1f1; font-size:16px; text-align:center; transition: all .3s; letter-spacing:-0.5px}
.subContain #subMn .pcBox li a:hover, .subContain #subMn .pcBox li.on a{background:#6ec136; color:#fff}

/*테이블 관련 추가*/
div.tableBox table tbody tr:hover th, div.tableBox table tbody tr:hover td{background: #f6f6f6; transition: all .3s}
/* div.tableBox table tbody tr:hover td.tleft{font-weight:500} */
div.tableBox table button{font-family:"맑은 고딕"}

/*테이블 내부 버튼*/
div.tableBox table tbody button{padding:1px 8px 3px; border-radius:50px; font-size:13px; box-sizing:border-box; transition: all .3s; letter-spacing:-0.5px}
/*강사소개*/
div.tableBox table tbody button.teaBtn{margin-top:5px; background:#4c5460; color:#fff}
div.tableBox table tbody button.teaBtn:hover{background:#478aef}
/*수강신청*/
div.tableBox table tbody button.applyBtn{background:#ff4c34; color:#fff}
div.tableBox table tbody button.applyBtn:hover{background:#ab2715}
/*대기신청*/
div.tableBox table tbody button.readyBtn{background:#b367e4; color:#fff}
div.tableBox table tbody button.readyBtn:hover{background:#723997}
/*신청완료, 마감*/
div.tableBox table tbody .apply_complete,
div.tableBox table tbody .apply_end {font-family:"맑은 고딕"; display:inline-block; min-width:66px; height:21px; border-radius:50px; background:#4ea51e; font-size:13px; box-sizing:border-box; color:#fff; letter-spacing:-0.5px}
/*마감*/
div.tableBox table tbody .apply_end {background:#9f9f9f}
/*수강취소*/
div.tableBox table tbody .canBtn {background:#48525a; color:#fff}
div.tableBox table tbody .canBtn:hover{background:#ab2715}
/*설문참여*/
div.tableBox table tbody .partiBtn{background:#369dde; color:#fff}
div.tableBox table tbody .partiBtn:hover{background:#256e9c}

/*버튼영역*/
#userBtnBox{clear:both; padding:15px 0; margin:0}
#userBtnBox:after {content:""; clear:both; display:block; height:0; visibility:none; font-size:0; line-height:0}
#userBtnBox div button{color:#fff; border:0; text-align:center; font-size:15px; padding:10px 0 12px 0; display:block; border-radius:50px; transition: all .3s}
#userBtnBox div.rightBtn button{width:100%}
#userBtnBox div.centerBtn button{width:49%; float:right}
#userBtnBox div.centerBtn button:first-child{float:left}
#userBtnBox div.centerBtn.oneBtn button{width:100%; float:none}
#userBtnBox div.rightBtn.twoBtn button{width:49%; float:right}
#userBtnBox div.rightBtn.twoBtn button:first-child{float:left}
#userBtnBox div button.excelSaveBtn{background:#329b44; border-bottom-color:#1d862f}
div.titBox p.rightTxt button.addChild{ background: #3a8fcb url(../../images/sub/addChild_btn.gif) no-repeat 5px center; color:#fff; padding:3px 9px 5px 27px; vertical-align:middle; border-radius:50px}
/*신청하기*/
#userBtnBox div button.selAppliBtn{background:#ff4c34}
#userBtnBox div button.selAppliBtn:hover{background:#ab2715}
/*취소하기*/
#userBtnBox div button.selCanBtn{background:#929292}
#userBtnBox div button.selCanBtn:hover{background:#626262}
/*전체목록*/
#userBtnBox div button.fulllst_btn{background:#929292}
#userBtnBox div button.fulllst_btn:hover{background:#626262}
/*전체목록*/
#userBtnBox div button.childmodi_btn{background:#3d95df}
#userBtnBox div button.childmodi_btn:hover{background:#1d6199}

/*타이틀 */
div.titBox{position:relative; padding:0; margin:0}
div.titBox h4{padding:2px 0 2px 30px; margin:25px 0 15px; font-size:19px; color:#000; background:url(../../images/sub/ico_h4tit.gif) no-repeat left top}
div.titBox p.rightTxt2{padding:0 0 10px;text-align:right; line-height:150%}

/*상단 공지사항*/
div.topNotice{padding:0 0 20px 0; margin:0}
div.topNotice ul{padding:23px 30px; border-radius:5px; border:2px solid #c4c4c4; background:url(../../images/sub/top_noti_ico.png) no-repeat 17px center; font-size:15px; align-content: space-around}
div.topNotice ul li{padding-left:12px; margin:0 0 7px 60px; line-height:130%; background:url(../../images/sub/lst_blt.png) no-repeat left 6px}
div.topNotice ul li:last-child{margin-bottom:0}

/*강사소개 레이어-스크롤스타일 추가*/
.teaInfoBox{overflow-y: scroll; border-radius: 5px}
.teaInfoBox::-webkit-scrollbar {width: 10px}
.teaInfoBox::-webkit-scrollbar-track {background-color: rgba(0, 0, 0, 0.15); border-radius:0 5px 5px 0; box-shadow: inset 0px 0px 0px white}
.teaInfoBox::-webkit-scrollbar-thumb {background-color: #a7a7a7; border-radius: 10px; background-clip: padding-box; border: 2px solid transparent}

/*수강신청/정보변경/비밀번호 찾기등-작성폼*/
div.writeWrap .writeBox{margin-bottom:10px; padding:5px; background:#f1f1f1; border-radius:5px}
div.writeWrap .writeBox > ul > li{position:relative; display: flex; margin-bottom:5px}
div.writeWrap .writeBox > ul > li:last-child{margin-bottom:0}
div.writeWrap .writeBox > ul > li h5{width:15%; padding:10px; border-radius:5px; background:#4c5460; align-content: space-around; text-align:center; font-size:14px; color:#fff; box-sizing:border-box}
div.writeWrap .writeBox > ul > li .input_wrap{width:85%; padding:10px; margin-left:5px; border:1px solid #d4d4d4; background:#fff; border-radius:5px; box-sizing:border-box}
div.writeWrap .input_wrap .writeForm{display: flex}
div.writeWrap .writeForm .inputBox{width:200px}
div.writeWrap .writeForm .inputBox input{width:100%; height:37px; border:1px solid #dedede; border-radius:5px; box-sizing:border-box}
div.writeWrap .writeForm .wdt5per{height:37px; line-height:37px; margin:0 10px; color:#aeaeae}
div.writeWrap .writeForm .wdt30per .inputBox{margin-right:7px}
div.writeWrap .writeForm .wdt30per .inputBox input{width:200px}
div.writeWrap div.writeBox ul li div div.selectBox{margin:0; padding:0 10px; width:200px; border:1px solid #d4d4d4; background:#fff; border-radius:5px; box-sizing:border-box}
div.writeWrap div.writeBox ul li div select {appearance: none} 
div.writeWrap div.writeBox ul li div select::-ms-expand { display: none} 
div.writeWrap div.writeBox ul li div select{width:100%; padding:0; border:0; background:#fff url(../../images/sub/select_arrow.png) no-repeat right center; height:37px;border-radius:3px; cursor: pointer}
div.writeWrap .notiTxt{margin-top:10px; padding:10px 0 0 0; border-top:1px solid #dedede}
div.writeWrap .notiTxt li{position:relative; padding-left:13px; margin-bottom:7px; line-height:120%}
div.writeWrap .notiTxt li::after{content:""; clear:both; display:block; position: absolute; left:0; top:6px; width:6px; height:2px; background:#ccc}
div.writeWrap .notiTxt li:last-child{margin-bottom:0}

/*내 자녀 정보-작성폼*/
div.writeWrap .writeBox > ul#childList > li{display: inherit; margin-bottom:10px}
div.writeWrap .writeBox > ul#childList > li:last-child {margin-bottom:0}
div.writeWrap .writeBox > ul#childList > li .stu_wrap{position:relative; display: flex; margin-bottom:5px}
div.writeWrap .writeBox > ul#childList > li .stu_wrap:last-child {margin-bottom:0}
div.writeWrap .writeBox > ul#childList > li h5{width:15%; padding:10px; border-radius:5px; background:#4c5460; align-content: space-around; text-align:center; font-size:14px; color:#fff; box-sizing:border-box}
div.writeWrap .writeBox > ul#childList > li .writeForm{width:85%; padding:10px; margin-left:5px; border:1px solid #d4d4d4; background:#fff; border-radius:5px; box-sizing:border-box}
div.writeWrap .writeForm{display: flex}

/*수강취소기간안내*/
.cancel_datebx{margin-bottom: 20px}
.cancel_datebx dl{display: flex; gap:5px; font-size: 15px}
.cancel_datebx dl dt{width: 20%; padding: 12px; background: #4c5460; border-radius: 5px; text-align: center; color:#fff; font-weight: 600; box-sizing: border-box; align-content: space-around}
.cancel_datebx dl dt span{padding-left: 28px; background:url(../../images/sub/ico_canceldate.png) no-repeat left center}
.cancel_datebx dl dd{width: 80%; padding: 12px; border:2px solid #e0e0e0; border-radius: 5px; color:#ff1e0d; font-weight: 600; box-sizing: border-box; align-content: space-around; line-height: 140%}

/*수강신청-페이지정보*/
div.listTop p.list_left{min-height:22px; padding-left:20px; background:url(../../images/sub/ico_pagelst.png) no-repeat left 13px}
div.listTop p.list_left span{color:#1d8bc4; font-weight:600}

/*수강신청-페이지정보2(추가수정)*/
.lst_topbx{display: flex; justify-content: space-between; margin:18px 0}
.lst_topbx p.list_left{padding-left:20px; background:url(../../images/sub/ico_pagelst.png) no-repeat left center; font-size: 15px; align-content: space-around}
.lst_topbx p.list_left span{color:#1d8bc4; font-weight:600}
/*금액정보*/
.lst_topbx .amount_infobx{padding: 3px; border-radius: 5px; border:2px solid #f0f0f0}
.lst_topbx .amount_infobx ul{display: flex; flex-wrap: wrap; gap:5px; font-size: 14px}
.lst_topbx .amount_infobx ul li{min-width:200px; padding: 10px; margin: 0 auto; align-content: space-around}
.lst_topbx .amount_infobx ul li span{display: inline-block; margin-right:3px; font-weight: 600}
.lst_topbx .amount_infobx ul li.freetype_money{border-radius: 3px; background: #f0f0f0; font-weight: 600}
.lst_topbx .amount_infobx ul li.freetype_money span{color:#ff1e0d}
.lst_topbx .amount_infobx ul li dl{display: flex; justify-content: space-between}
.lst_topbx .amount_infobx ul li dl dt{padding-left:10px; background:url(../../images/sub/lst_blt.png) no-repeat left 4px}

/*하단버튼*/
.subtm_btnbx{margin-top:30px; padding-top: 30px; border-top:1px solid #ccc}
.subtm_btnbx ul{text-align: center}
.subtm_btnbx ul li {display:inline-block; margin: 0 5px}
.subtm_btnbx ul li a{display:inline-block; min-width: 200px; padding:15px; border-radius: 50px; background: #ccc; font-size: 15px; font-weight: 600; transition: all .3s}
.subtm_btnbx ul li a span{display:inline-block}
/*버튼_시간표 엑셀저장*/
.subtm_btnbx ul li a.timetb_down{background: #40953a; color:#fff}
.subtm_btnbx ul li a.timetb_down span{padding:2px 30px 2px 0; background:url(../../images/sub/timetb_down.png) no-repeat right center}
.subtm_btnbx ul li a.timetb_down:hover{background:#2d5a29}

/*필수입력텍스트*/
div.titBox p.rightTxt{position: absolute; right:0; top:0}

/*방과후활동-방과후홈페이지*/
.home_wrap > ul{display: flex; flex-wrap:wrap; justify-content:flex-start}
.home_wrap > ul > li{width:calc(100%/4); padding: 15px; box-sizing: border-box}
.home_wrap .homeBg{padding: 20px 20px 0; background: #fff; border:1px solid #ccc; border-radius: 30px 30px 10px 10px; text-align: center; transition:all .3s}
.home_wrap .homeBox h4{position: relative; overflow: hidden; height: 45px; margin: 0 0 10px; text-align: center; font-size: 19px; font-family: 'Gmarket Sans'; line-height: 120%; align-content: space-around; transition: all .3s}
.home_wrap .homeBox .teaName{padding: 10px; border:2px solid #ccc; border-radius: 50px; font-size: 16px}
.home_wrap > ul > li:nth-child(4n+1) .teaName{border-color: #a7e268}
.home_wrap > ul > li:nth-child(4n+2) .teaName{border-color: #ff9ece}
.home_wrap > ul > li:nth-child(4n+3) .teaName{border-color: #ffd556}
.home_wrap > ul > li:nth-child(4n+4) .teaName{border-color: #7ac2ff}
.home_wrap .homeBox .departImg{overflow: hidden; width: 100px; height: 100px; margin: 25px auto; align-content:space-around; border-radius: 50%; box-shadow:0 3px 3px rgba(0, 0, 0, 0.2)}
.home_wrap > ul > li:nth-child(4n+1) .departImg{background: #a7e268}
.home_wrap > ul > li:nth-child(4n+2) .departImg{background: #ff9ece}
.home_wrap > ul > li:nth-child(4n+3) .departImg{background: #ffd556}
.home_wrap > ul > li:nth-child(4n+4) .departImg{background: #7ac2ff}
.home_wrap .homeBox .departGo button{display: block; width: 80%; padding: 15px; margin: 0 auto; border-radius: 100px 100px 0 0; background: #d9d9d9; box-sizing: border-box; font-size: 18px; text-transform: uppercase; font-family: 'Gmarket Sans'; font-weight: 600; color:#fff; transition: all .3s}
/* .home_wrap > ul > li:nth-child(4n+1) .departGo button{background: #c6f396}
.home_wrap > ul > li:nth-child(4n+2) .departGo button{background: #ffc9e4}
.home_wrap > ul > li:nth-child(4n+3) .departGo button{background: #ffe598}
.home_wrap > ul > li:nth-child(4n+4) .departGo button{background: #b8deff} */
/*방과후홈 오버스타일*/
/*타이틀*/
.home_wrap > ul > li:nth-child(4n+1):hover h4{color:#7ebd3b}
.home_wrap > ul > li:nth-child(4n+2):hover h4{color:#ff6fb6}
.home_wrap > ul > li:nth-child(4n+3):hover h4{color:#ff8c25}
.home_wrap > ul > li:nth-child(4n+4):hover h4{color:#419be7}
/*아이콘*/
.home_wrap > ul > li .departImg img{position: relative;transition:transform 0.8s;transform-style: preserve-3d}
.home_wrap > ul > li:hover .departImg img {transform: rotateY(180deg)}
/*라인*/
.home_wrap > ul > li:nth-child(4n+1):hover .homeBg{border-color:#7ebd3b; box-shadow:0 3px 0 rgba(126, 189, 59, 0.5)}
.home_wrap > ul > li:nth-child(4n+2):hover .homeBg{border-color:#ff6fb6; box-shadow:0 3px 0 rgba(255, 111, 182, 0.5)}
.home_wrap > ul > li:nth-child(4n+3):hover .homeBg{border-color:#ff8c25; box-shadow:0 3px 0 rgba(255, 140, 37, 0.5)}
.home_wrap > ul > li:nth-child(4n+4):hover .homeBg{border-color:#419be7; box-shadow:0 3px 0 rgba(65, 155, 231, 0.5)}
/*버튼*/
.home_wrap > ul > li:nth-child(4n+1):hover .departGo button{background:#7ebd3b}
.home_wrap > ul > li:nth-child(4n+2):hover .departGo button{background:#ff6fb6}
.home_wrap > ul > li:nth-child(4n+3):hover .departGo button{background:#ff8c25}
.home_wrap > ul > li:nth-child(4n+4):hover .departGo button{background:#419be7}
/*버튼*/
.home_wrap > ul > li:nth-child(4n+1) .departGo button:hover{background:#7ebd3b}
.home_wrap > ul > li:nth-child(4n+2) .departGo button:hover{background:#ff6fb6}
.home_wrap > ul > li:nth-child(4n+3) .departGo button:hover{background:#ff8c25}
.home_wrap > ul > li:nth-child(4n+4) .departGo button:hover{background:#419be7}



/*======================== MOBILE LAYOUT ========================*/
@media only screen and (max-width:1199px) {
/*기본 레이아웃*/
section#subContainer div.subContain{padding:92px 10px 120px}
div#subTop{padding:57px 0 0 0}
div#subTop h3{font-size:18px; padding-bottom:15px; text-align:center}
h4.h4_tit{padding:3px 0 4px 30px; margin:20px 0 10px; font-size:17px}

/*탭스타일*/
/* .subContain #subMn{display:none} */
    
/*방과후 테이블(★안내페이지용)*/
.af_table table{font-size: 14px}


/****** 기존스타일에서 일부 변경등의 사항기재 ******/
/*상단 공지사항*/
div.topNotice{padding:0 0 15px 0}

/*수강신청-수강신청 기간 교체*/
div.app_date .datetime{padding:2px 0 3px; margin:5px 0; background:none; font-size:18px}
div.app_date ul{background-image:none}
div.app_date ul li{ margin:0 0 5px 0}

/*수강신청/정보변경/비밀번호 찾기등-작성폼*/
div.writeWrap .writeBox > ul > li h5{width:30%}
div.writeWrap .writeBox > ul > li .input_wrap{width:70%}
div.writeWrap .writeForm{display: flex; flex-wrap: wrap; justify-content: space-between}
div.writeWrap .writeForm .inputBox{width:100%}
div.writeWrap .writeForm .wdt5per{display:none}
div.writeWrap .writeForm .wdt30per{width:calc(100%/3 - 7px)}
div.writeWrap .writeForm .wdt30per .inputBox{margin-right:0}
div.writeWrap .writeForm .wdt30per .inputBox input{width:100%}

/*내 자녀 정보-작성폼*/
div.writeWrap .writeBox > ul#childList > li h5{width:30%}
div.writeWrap .writeBox > ul#childList > li .writeForm{width:70%}
}

/*======================== tablet LAYOUT ========================*/
@media only screen and (min-width:1200px) and (max-width:1689px){
/*기본 레이아웃*/
section#subContainer div.subContain{margin:0 0 0 230px; padding:85px 20px 130px}

/*타이틀*/
div#subTop h3{font-size:22px}

/*탭스타일*/
.subContain #subMn .pcBox li a{padding:15px 5px 13px; border-radius:3px 3px 20px 20px; font-size:16px}
}



/*======================== PC LAYOUT ========================*/
@media only screen and (min-width:1690px) {
/*기본 레이아웃*/
section#subContainer div.subContain{margin:0 0 0 265px; padding:95px 130px 150px}  

/****** 기존스타일에서 일부 변경등의 사항기재 ******/
/*버튼영역*/
#userBtnBox {width:450px; margin:0 auto}
}



/*======================== LOWSET FIX ========================*/
@media only screen and (min-width:0) and (max-width:1600px){
/*방과후활동-방과후홈페이지*/
.home_wrap > ul > li{width:calc(100%/3); padding: 12px}
.home_wrap .homeBox h4{font-size: 17px}
}
@media only screen and (min-width:0) and (max-width:1500px){
/*방과후 공통 안내페이지*/
/*타이틀*/
.guide_page .gdp_titbx{margin-bottom: 10px}
.guide_page .sch_titbx{margin-bottom: 12px}
.guide_page .sch_name span{font-size: 16px}
.guide_page .afs_name{font-size: 24px}
/*상단안내문구*/
.guide_page .gdp_topbx{padding: 15px; background-size: 190px 53px; font-size: 14px}
.guide_page .gdp_topbx::after{right:10px; width:123px; height: 96px;  background-size: 123px 96px}
.guide_page .gdp_topbx p{margin-right: 120px}
/*로그인방법안내*/
.guide_page .gdp_loginbx{margin: 40px 0 30px; padding: 15px; font-size: 14px}
.guide_page .gdp_loginbx .tit{width: 170px; font-size: 15px}
.guide_page .gdp_loginbx .login_tb{margin: 17px 0 0 0; font-size: 14px}
.guide_page .gdp_loginbx .txt2{padding: 10px; margin-top: 10px}
/*기간등 안내*/
.guide_page .gdp_datebx dl{font-size: 15px}
.guide_page .gdp_datebx dl dt, .guide_page .gdp_datebx dl dd{padding: 10px}
/*안내사항리스트*/
.guide_page .gdp_lstbx{padding: 15px}
.guide_page .gdp_lstbx > ul > li{margin-bottom: 7px; font-size: 14px}
.guide_page .gdp_lstbx .lst_sub{padding: 8px; margin: 8px 0 12px; font-size: 13px}
.guide_page .gdp_lstbx > ul > li:last-child .lst_sub{margin-bottom: 0}
/*경고안내문구*/
.guide_page .warning_tb{padding:15px; margin-top: 10px; font-size: 14px}
.guide_page .warning_tb > p{ padding-left: 30px}
.guide_page .warning_tb::after{margin-top: -11px; width: 23px; height: 23px; line-height: 23px; font-size:16px}
}
@media only screen and (min-width:1200px){
/*페이지 NAVI*/
#sub_guide{padding:0; margin:0}
#sub_guide .guide_box{background:none; height:auto; font-size:1em}
#sub_guide div.naviArea{width:auto; padding:0 0 0 15px; position:relative; z-index:4}
#sub_guide div.naviArea ul{height:auto; display: block}
#sub_guide div.naviArea ul li{background:url(../../images/sub/guide_dot.png) no-repeat right 7px top 7px; height:auto; line-height:150%; float:left}  
#sub_guide div.naviArea ul li a{display:block; width:auto; padding:0 17px 0 0; height:auto; border-left:0; overflow:auto; text-overflow:ellipsis; white-space:nowrap; color:#000}
#sub_guide div.naviArea ul li:first-child{ background:url(../../images/sub/guide_dot.png) no-repeat right 7px top 7px} 
#sub_guide div.naviArea ul li:first-child a{ border-left:none; background:url(../../images/sub/home_navi.png) no-repeat left top 4px; padding-left:18px}
#sub_guide div.naviArea ul li:last-child{background:none}
#sub_guide div.naviArea ul li:last-child a{padding:0}
#sub_guide div.naviArea ul li.nav01{width:auto; flex:none}
#sub_guide div.naviArea ul li.nav02{width:auto; flex:none}
#sub_guide div.naviArea ul li.nav03{width:auto; flex:none;  background:none; padding-right:0}
#sub_guide div.naviArea ul li.nav03 a{padding-right:0; text-decoration:none}
#sub_guide div.naviArea ul li div.subMn{display:none} 
section#subContainer div.subContain div.subConWrap{padding-left:0; padding-right:0; font-weight:500; font-family:Malgun Gothic; font-size:13px !important}
section#subContainer div.subContain div.subConWrap div#subPage{margin:0 auto; min-height:500px}
section#subContainer div.subContain div.subConWrap div.topBtn{right:auto; left:50%; margin-left:655px}
}
@media only screen and (max-width:950px){
/*방과후활동-방과후홈페이지*/
.home_wrap > ul > li{width:calc(100%/2)}
}

@media only screen and (max-width:949px) {
/*수강신청-페이지정보*/
div.listTop p.list_left{margin-bottom:10px; background-position:left 4px}
div.listTop.my_childtop p.list_left{margin-bottom:0}
/*설문조사 상세보기*/
.surveyList .surveyList_tit div.topArea {padding-bottom: 10px; text-align:center}
.surveyList .surveyList_tit div.topArea h4 {font-size:17px; padding-right:0}
.surveyList .surveyList_tit div.topArea h4 span {display:block}
.surveyList .surveyList_tit span.left_box{width:auto; margin-bottom:10px}
}

@media only screen and (max-width:760px) {
/*상단 선택 검색영역 수정 (html함께 변경)*/
.subsrch_wrap{display:inherit}
.subsrch_wrap .srch_tit{display: none}
.subsrch_wrap .topsrch_selbx{display:flex; width: 100%}
/*상단 선택 검색영역 수정*/
.subsrch_wrap .topsrch_selbx{display:inherit}
.subsrch_wrap .topsrch_selbx .srch_btn,
.subsrch_wrap .topsrch_selbx .refresh_btn{display: block; width:auto; margin: 5px 3px 0; padding: 7px; box-sizing: border-box}
    
/*수강취소기간안내*/
.cancel_datebx{margin-bottom: 15px}
.cancel_datebx dl{display:block; font-size: 14px}
.cancel_datebx dl dt{width: 100%;  border-radius: 5px 5px 0 0}
.cancel_datebx dl dd{width: 100%; border-radius: 0 0 5px 5px; border-top:0; text-align: center}

/*수강신청-페이지정보2(추가수정)*/
.lst_topbx{display: block; margin:20px 0 15px}
/*금액정보*/
.lst_topbx .amount_infobx{margin-top: 15px}
.lst_topbx .amount_infobx ul{font-size: 13px}
.lst_topbx .amount_infobx ul li{flex: 1; min-width:auto}
}

@media only screen and (max-width:710px) {
/*모바일 아래에서 표 내용이 너무많을때 사이즈 고정후 스크롤 하기*/	
.scroll_txt{display: block; padding:3px 5px !important; margin: 5px 0 !important; border-radius: 5px; background:#eaeaea !important; text-align: center; color:#000; font-size: 13px}  
}
@media only screen and (max-width:650px){
/*상단 공지사항*/
div.topNotice ul{padding:15px; background-image:none; font-size:14px}
div.topNotice ul li{ margin:0 0 5px 0}
/*방과후활동-방과후홈페이지*/
.home_wrap > ul > li{width:100%}
}
@media only screen and (max-width:560px) {
/*방과후 공통 안내페이지*/
.guide_page .sch_titbx{display:block}
.guide_page .sch_name{display:block; padding: 6px 10px}
/*상단안내문구*/
.guide_page .gdp_topbx{background: none}
.guide_page .gdp_topbx::after{display: none}
.guide_page .gdp_topbx p{margin-right: 0}
/*기간등 안내*/
.guide_page .gdp_datebx dl{display: inherit}
.guide_page .gdp_datebx dl dt, .guide_page .gdp_datebx dl dd{width: 100%}
.guide_page .gdp_datebx dl dt{border-radius: 5px 5px 0 0}
.guide_page .gdp_datebx dl dd{border-radius: 0 0 5px 5px; border-top:0; text-align: center}
/*설문관리-상세보기*/
.surveyList .surveyList_tit div.botArea div.selectBox select {position: inherit; width:100%; margin-top:13px; box-sizing:border-box}

/*하단버튼*/
.subtm_btnbx ul li {display:block; margin: 0 0 15px}
.subtm_btnbx ul li a{display:block; min-width: auto; padding:10px; font-size: 14px}

}
@media only screen and (max-width:530px) {
/*수강신청/정보변경/비밀번호 찾기등-작성폼*/
div.writeWrap .writeBox > ul > li{display: block}
div.writeWrap .writeBox > ul > li h5{width:100%; border-radius:5px 5px 0 0}
div.writeWrap .writeBox > ul > li .input_wrap{width:100%; margin:0; border-radius:0 0 5px 5px}
div.writeWrap .writeBox > ul > li .input_wrap .selectBox{width:100%}

/*내 자녀 정보-작성폼*/
div.writeWrap .writeBox > ul#childList > li{display: inherit}
div.writeWrap .writeBox > ul#childList > li .stu_wrap{display: inherit}
div.writeWrap .writeBox > ul#childList > li h5{width:100%; border-radius:5px 5px 0 0}
div.writeWrap .writeBox > ul#childList > li .writeForm{width:100%; margin:0; border-radius:0 0 5px 5px}
}
@media only screen and (max-width:420px) {
/*수강신청-페이지정보2(추가수정)*/
/*금액정보*/
.lst_topbx .amount_infobx ul{display:inherit}
}

@media only screen and (max-width:790px) {
.departList ul li{min-width:100%}
}

@media only screen and (max-width:800px) {
section#subContainer div.subContain div.pcBox{margin-bottom:10px}
.subContain #subMn .pcBox ul{display: inherit}
.subContain #subMn .pcBox ul li{padding:0; margin-bottom:6px}
.subContain #subMn .pcBox ul li:last-child{margin-bottom:0}
.subContain #subMn .pcBox li a{padding:10px; border-radius:50px}
}

@media only screen and (max-width:1000px) {
.btn_top.sub_btntop{display:none}
.subContain #subMn .pcBox li a{font-size:13px}

div.app_date .datetime{font-size:15px}
}



/*사용자 수강취소 안내 25.04.08 추가*/
.appguide{display: flex; padding:5px; border-radius:5px; border:2px solid #ff4541; gap:5px; font-size:14px; font-weight:600}
.appguide > p{line-height:150%; align-content: space-around; box-sizing:border-box}
.appguide .guide_tit{width:15%; padding:10px; background:#ff4541; border-radius:5px; color:#fff; text-align:center}
.appguide .guide_txt{width:85%}
.appguide > p span.col_r{color:#ff4541}
@media only screen and (max-width:1198px) {
.appguide{display: block}
.appguide .guide_tit{width:100%; padding:5px}
.appguide .guide_txt{width:100%; margin:8px 0 5px; text-align:center}
}

/*사용자 수강취소 기간 안내 25.04.14 추가*/
.cancel_datebx{overflow: hidden; display: flex; gap:5px; margin-bottom: 10px; border-radius: 5px}
.cancel_datebx .cancel_tit{width: 20%; padding: 10px; border-radius: 5px; background: #ff4541; align-content: space-around; color:#fff; font-weight: 600; font-size: 15px; box-sizing: border-box; text-align: center}
.cancel_datebx .cancel_date{width: 80%; padding: 10px; border-radius: 5px; background: #f1f1f1; color:#ff4541; font-weight:600; font-size: 15px; box-sizing: border-box; align-content: space-around}
@media only screen and (max-width:650px) {
.cancel_datebx{display: block}
.cancel_datebx .cancel_tit{width:100%}
.cancel_datebx .cancel_date{width:100%; margin:5px 0 0; text-align:center}
}

/*자유수강 지원금액 안내 25.04.14 추가*/
.freemoney_bx{margin-top:30px}
.freemoney_bx .free_tit{padding:10px 0; margin-bottom:10px; border:2px solid #59a5df; border-radius:5px; font-family:'Gmarket Sans'; font-size:18px; color:#3a84bc; font-weight:600; text-align:center}
.freemoney_bx div.tableBox table thead th{padding:8px; background:#36719f}
.freemoney_bx div.tableBox table thead th.balance_money{background:#59a5df}
.freemoney_bx tbody td.balance_money{padding:8px; color:#ff4541; font-weight:600}
.freemoney_bx div.tableBox table tbody tr:hover td,
.freemoney_bx div.tableBox table tbody tr:hover th{background:#fff1f1}


