@charset "utf-8";
/* CSS Document */


/***** index *****/
.tophead{width:100%; overflow:hidden; background:#fff;}
.tophead .wid{width:100%; margin:0 auto;overflow:hidden; }
.tophead .logo{text-align:center;}
.tophead .logo img{max-width: 800px;}

.topmenu{
    width:100%;
    overflow:hidden;
    background:#fff;
    box-shadow: 0 3px 5px rgba(0,0,0,.03);
    position: sticky;
    top: 0;
    z-index: 9999;
}
.topmenu .wid{width:100%;max-width:800px;overflow-x: auto;white-space:nowrap;margin:0 auto; background-color: #527bff;}
.topmenu .menulist{}
.topmenu .menulist li:hover {font-weight: bold;}
.topmenu .menulist li{display: inline-block;font-size:14px;color: #fff;cursor: pointer;}
.topmenu .menulist li span{display:inline-block;padding: 4px 15px;}
.topmenu .menulist li.on{font-weight: bold;}
.topmenu .menulist li.on span{border-bottom:3px solid #f45c5c;}

.footer_menu{
    width:100%;
    overflow:hidden;
    background:#fff;
    box-shadow: 0 3px 5px rgba(0,0,0,.03);
    position: fixed;
    bottom: 0;
    z-index: 9999;
}
.footer_menu .wid{width:100%;max-width:800px;overflow-x: auto;white-space:nowrap;margin:0 auto; background-color: #849daa;}
.footer_menu .menulist{}
.footer_menu .menulist li{display: inline-block;font-size:14px;color: #fff;cursor: pointer;}
.footer_menu .menulist li:hover {
    font-weight: bold;
}
/*.footer_menu .menulist li:hover span {*/
/*    border-bottom: 3px solid #f45c5c;*/
/*}*/
.footer_menu .menulist li span{display:inline-block;padding: 4px 15px;}
.footer_menu .menulist li.on{font-weight: bold;}
.footer_menu .menulist li.on span{border-bottom:3px solid #f45c5c;}

.postlist_bg{width:100%;overflow:hidden;background:#edeff5;padding-bottom: 20px;}
.postlist{width:100%;max-width: 800px;margin: 0 auto;}
.postlist .box{width:100%;padding: 20px;margin-top: 15px;background-color:#fff;box-shadow: 0 0 10px rgba(0,0,0,.07);}
.postlist .box a{display:block;}
.postlist .box .linetop{}
.postlist .box .linetop .top{position: relative;padding-left: 56px;}
/*.postlist .box .linetop .top::before{content:'';display:inline-block;background:url(/user/img/logo_g500.png);width: 47px;height: 47px;position: absolute;left: 0;top: -3px;}*/
.postlist .box .linetop .top .t1{font-weight: 600;font-size: 14px;}
.postlist .box .linetop .top .t2{color:#8c8c8c;margin-top: 3px;font-size: 14px;}
.postlist .box .linetop .top .t2 span{float:right;}
.postlist .box .linetx{width:100%; margin-top:20px;}
.postlist .box .linetx .tit{font-weight:bold; margin-bottom:7px;}
.postlist .box .linetx .tx{line-height: 24px;margin-bottom: 10px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 5; /* 표시할 최대 라인 수 */ overflow: hidden; text-overflow: clip; white-space: normal;}

.postlist .box .linetx .tx .more{color:#8c8c8c;vertical-align: top;}
.postlist .box .linetx .img{width:100%;overflow: hidden;margin-bottom:10px;}
.postlist .box .linetx .img img{width:100%;}
.postlist .box .linebtn{width:100%;}
.postlist .box .linebtn button{width:100%;border:none;background-color:#E8EBEE;padding:10px;border-radius: 5px;font-weight: 500;}

.thumbnail-wrappper {width: 25%; }
.thumbnail {position: relative;padding-top: 45%;  /* 1:1 ratio */overflow: hidden;}
.thumbnail .centered  {position: absolute;top: 0;left: 0; right: 0; bottom: 0;}
.thumbnail .centered img {position: absolute; top: 0; left: 0; max-width: 100%; height: auto;}
.postlist .box .linetx .img .type1{width:100%;}
.postlist .box .linetx .img .type2{width:50%;float:left;}
.postlist .box .linetx .img .type3_1{width:50%;float:left;}
.postlist .box .linetx .img .type3_2{width:50%;float:left;}
.postlist .box .linetx .img .type2 .thumbnail{padding-top:90%;}
.postlist .box .linetx .img .type3_1 .thumbnail{padding-top:90%;}
.postlist .box .linetx .img .type3_2 .box1{position: relative;}
.postlist .box .linetx .img .type3_2 .box1 .plus{position: absolute;z-index: 1;width: 100%;height: 100%;text-align: center;background: rgba(0,0,0,.6);}
.postlist .box .linetx .img .type3_2 .box1 .plus span{color:#fff;font-size: 16px;font-weight: bold;margin-top: 16%;display: block;}

.inicon{position: fixed;z-index: 100;bottom: 100px;right: 20px;}
.qnaicon{position: fixed;z-index: 100;bottom: 20px;right: 20px;}



/***** 서브 *****/
.subtop{width:100%;overflow:hidden;padding: 15px 20px;border-bottom:1px solid #ddd;}
.subtop .subtop_w{width:100%;max-width:800px;margin:0 auto;position: relative;}
.subtop .subtop_w button{display:inline-block;border: none;background: none;}
.subtop .subtop_w button img{width:12px;}
.subtop .subtop_w p{display:inline-block;font-size: 16px;font-weight: 600;margin-left: 15px;vertical-align: text-top;}
.subtop .subtop_w p .wrbtn{background-color:#527bff;border:1px solid #527bff;font-size: 14px;color: #fff;padding: 4px 10px;width: 70px;border-radius: 80px;position: absolute;right: 0;top: -2px;text-align: center;}

.subcon{width:100%;overflow:hidden;padding:15px 0;}
.subcon .subcon_w{width:100%;max-width:800px;margin:0 auto;padding: 0 20px;}
.subcon .linetop{width:100%;overflow:hidden;padding: 5px 0;margin-top: 10px;}
.subcon .linetop .top{position: relative;padding-left: 56px;}
/*.subcon .linetop .top::before{content:'';display:inline-block;background:url(/user/img/logo_g500.png);width: 47px;height: 47px;position: absolute;left: 0;top: -3px;}*/
.subcon .linetop .top .t1{font-weight: 600;font-size: 14px;}
.subcon .linetop .top .t2{color:#8c8c8c;margin-top: 3px;font-size: 14px;}
.subcon .linetop .top .t2 span{float:right;}
.subcon .linetx{width:100%; margin-top:20px;}
.subcon .linetx .tx{line-height: 24px;margin-bottom: 10px;}
.subcon .linetx .tx .more{color:#8c8c8c;vertical-align: top;}
.subcon .linetx .img{width:100%;overflow: hidden;margin-bottom:10px;}
.subcon .linetx .img img{width:100%; margin-bottom:10px;}

.subcomment{width:100%;overflow:hidden;background-color:#EDEFF5;padding: 25px 0 25px;}
.subcomment .subcomment_w{width:100%;max-width:800px;margin:0 auto;padding: 0 20px;}
.subcomment .con_box h1{font-size: 18px;margin-bottom: 10px;}
.subcomment .con_box h1 img{margin-right: 8px;vertical-align: bottom;}
.subcomment .con_box h1 span{color: #1463EB;vertical-align: baseline;margin-left: 4px;}
.subcomment .reply_w{width:100%;overflow:hidden;border-top: 2px solid #414b63;border-bottom: 1px solid #c7c7c7;}
.subcomment .reply_w .rebox{width:100%;overflow:hidden;padding: 5px 0;border-top: 1px solid #b8bbc1;}
.subcomment .reply_w .rebox:first-child{border-top:none;}
.subcomment .reply_w .rebox .re1_1{width:80%; float:left;}
.subcomment .reply_w .rebox .re1_1 .t1{font-weight: bold;margin-bottom: 3px;}
.subcomment .reply_w .rebox .re1_1 .t2{}
.subcomment .reply_w .rebox .re1_1 .t3{font-size:12px;color: #9d9d9d;letter-spacing: 0;margin-top: 8px;}
.subcomment .reply_w .rebox .re1_2{float:right;}
.subcomment .reply_w .rebox.box2{width:100%;overflow:hidden;background:#f5f5f5;border-top: 1px dotted #ddd;display: none;}
.subcomment .reply_w .rebox.box2 textarea{width:90%;float:left;height: 53px;padding: 5px;}
.subcomment .reply_w .rebox.box2 button{width:9%;float:right;height: 53px;background: #75808a;border: 1px solid #75808a;color: #fff;}
.subcomment .reply_w .rebox.box3{padding-left: 30px;border-top: 1px dotted #c5c5c5;}

.subcomm{width:100%;background-color: #fff;overflow:hidden;padding: 10px 20px; bottom: 0;z-index: 1;}
.subcomm .subcomm_w{width:100%; max-width:800px; margin:0 auto;}
.subcomm .comm_tx{width:100%;overflow:hidden;position: relative;}
.subcomm .comm_tx input{width:100%;height: auto;padding: 10px;padding-right: 50px;height: 44px;border-radius: 30px;}
.subcomm .comm_tx button{background:none;position: absolute;right: 4px;top: 4px;}

.qnalist{width:100%;overflow:hidden;margin-top:20px;padding: 0 20px;margin-bottom: 50px;}
.qnalist .qnalist_w{width:100%; max-width:800px; margin:0 auto;}
.qnalist .qnalist_w p{margin-bottom:10px;}
.qnalist .qnalist_w img{width:100%; margin-bottom:10px;}

.qnalist .search_w{width:100%;padding:8px;background-color: #e2e4e9;margin-bottom: 15px;border-radius: 3px;position: relative;overflow: hidden;}
.qnalist .search_w .size_1{width:30%;float:left;margin-right:1%; font-size:14px;}
.qnalist .search_w .size_2{width: 52%;float:left;margin: 0;margin-right:1%; font-size:14px;}
.qnalist .search_w .size_3{width: 15%;float:left;margin-left: 0;height: 35px;padding: 3px 0; font-size:14px;}
.qnaicon2{position: fixed;z-index: 100;bottom: 20px;right: 20px;}
.qnaicon2 span{display:inline-block;width: 60px;height: 60px;line-height: 60px;background: #527BFF;color:#fff;border-radius: 50%;text-align: center;font-size: 14px;font-weight: bold;}

.qnalist .tblist{width:100%;overflow:hidden;border-top: 2px solid #242840;}
.qnalist .tblist .box{width:100%;overflow:hidden;border-bottom:1px solid #ddd;padding: 10px 0;}
.qnalist .tblist .box a > p.t1{font-weight:bold;margin-bottom:10px;font-size: 14px;}
.qnalist .tblist .box .tline{width:100%; overflow:hidden;}
.qnalist .tblist .box .tline .t1{float:left;}
.qnalist .tblist .box .tline .t2{float:right;color: #888;font-size: 13px;}

.viewbox{width:100%; overflow:hidden;}
.viewbox .txline{width:100%; overflow:hidden; padding:10px 0;}
.viewbox .txline .tit{}
.viewbox .txline .tx{}

.tb_box{width:100%; overflow:hidden;}
.tb_box .tb{width:100%; overflow:hidden;border-top: 2px solid #70645d;}
.tb_box .tb th, .tb_box .tb td{padding:10px 5px; }
.tb_box .tb th{background: #e6e9ef;border-bottom: 1px solid #c7c9ce;font-size: 14px;}
.tb_box .tb td{border-bottom: 1px solid #dfe1e6;}
.tb_box .tb td .txcon{min-height:300px;}

.wr_box{width:100%;overflow:hidden;padding: 10px 15px;background-color: #f5f5f5;border-radius: 10px;}
.wr_box .wrline{width:100%;padding:10px 0;border-bottom: 1px solid #acacac;}
.wr_box .wrline:last-child{border-bottom:none;}
.wr_box .wrline .tx{font-weight:bold; font-size:14px; margin-bottom:3px;}
.wr_box .wrline .ind{width:100%;}
.wr_box .wrline .ind.userfile input{border:none;padding: 0;font-size: 14px;width: 100%;}
.userfile input[type=file]::file-selector-button {
    width: auto;
    height: 30px;
    background:#7c828b;
    color:#fff;
    border: 1px solid rgb(77,77,77);
    border-radius: 10px;
    cursor: pointer;
    padding:0 20px;
    &:hover {
        background: rgb(77,77,77);
        color: #fff;
    }
}




@media only screen and (max-width: 840px){
    .tophead .logo img{height:auto;width: 100%;}
    .inicon {bottom:90px;}
    .qnaicon img, .inicon img{width:60px;}

    /***** 서브 *****/


}









.paging{width:100%;overflow:hidden;margin-top: 15px;}
.paging ul{width:100%; overflow:hidden; text-align:center;}
.paging ul li{display: inline-block;margin: 0 1px;}
.paging ul li button{display:block;width: 23px;height: 23px;line-height: 22px;color: #888;/* background: #fff; */font-size: 13px;border-radius: 50%;}
.paging ul li.on button{font-weight: bold;color: #ffffff;background-color: #535662;}
.paging ul li.arr button{background:#fff;}


/*datepicer 버튼 롤오버 시 손가락 모양 표시*/
.ui-datepicker-trigger{cursor: pointer;}
/*datepicer input 롤오버 시 손가락 모양 표시*/
.hasDatepicker{cursor: pointer;}

/* input="file" */
.filebox .upload-name {display: inline-block;width: 68%;color: #999999;}
.filebox label {display: inline-block;color: #fff;cursor: pointer;padding: 5px 0;height: 35px;border-radius: 4px;text-align: center;margin-right: 0;margin-top: -1px;width:30%;margin-left: 0;}
.filebox input[type="file"] {position: absolute; width: 0; height: 0;padding: 0; overflow: hidden; border: 0; display:none;}
.filebox input{display:none;}

.view_box{width:100%; height:100%; min-height:400px; }

/* 첨부파일 */
.tb02_w .dropzone{min-height: 50px;width:100%;padding: 10px;border: 1px dashed #ddd;}
.tb02_w .dropzone .dz-message{margin:1em 0;}
.tb02_w .list-unstyled li{border: 1px solid #a3a7ba;margin-top: 10px;padding: 10px;}
.tb02_w .d-flex{width:100%;overflow: hidden;}
.tb02_w .flex-shrink-0{display:inline-block; float:left;}
.tb02_w .flex-grow-1{display:inline-block;float:left;margin-left: 50px;margin-top: 18px;}
.tb02_w .shrink-0 {display:inline-block;float: right;margin-top: 25px;}
.tb02_w .shrink-0 button{background-color: #dc3545;color: #fff;}

.filebox input[type="file"] { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip:rect(0,0,0,0); border: 0;}
.filebox label {display: inline-block;  padding: .5em .75em; color: #999; font-size: inherit; line-height: normal; vertical-align: middle; background-color: #fdfdfd; cursor: pointer; border: 1px solid #ebebeb; border-bottom-color: #e2e2e2; border-radius: .25em; margin-top: 0;}
/* named upload */
.filebox .upload-name {display: inline-block; font-size: inherit; font-family: inherit; line-height: normal; vertical-align: middle; background-color: #f5f5f5; border-radius: .25em; -webkit-appearance: none; /* 네이티브 외형 감추기 */ -moz-appearance: none; appearance: none;}
/* imaged preview */
.filebox .upload-display { float: right;}
.filebox .upload-thumb-wrap { display: inline-block; width: 54px; padding: 2px; vertical-align: middle; border: 1px solid #ddd; border-radius: 5px; background-color: #fff; text-align: center;}
.filebox .upload-display img { max-width: 100%; width: 100% \9; height: 30px; text-align: center;}
.filebox.bs3-primary label { color: #fff; background-color: #75808a; border-color: #75808a;}

.downline{font-weight: 500;text-decoration: underline;}
.downline::before{content:'';display:inline-block;background:url(/g500_admin/common/img/file_icon.png) no-repeat;width: 17px;height:21px;vertical-align: text-bottom;margin-right: 5px;}

.imgsp{display:inline-block; margin: 0 2px;}

.btn.b_col3.w150{width:150px;}


/* 달력 */
.icon_cal {display:inline-block;position:relative;box-sizing:border-box;width: 100%;}
.icon_cal input {width:100%;padding-left: 10px;padding-right:30px;background-color:#F8F9FC;}
.icon_cal img {max-width: 31px;cursor:pointer;position:absolute;top:50%;right:5px;margin-top: -9px;}
.tb_cal {width:100%;}
.tb_cal input {width:100px;}
/* 달력레이어 */
.ui-widget-content {z-index:10 !important;}
.ui-datepicker .ui-datepicker-title select{padding:5px;border: 1px solid #a1a1a1;}
.ui-datepicker .ui-datepicker-title select:last-child{margin-left:5px !important;}
.ui-datepicker select.ui-datepicker-month, .ui-datepicker select.ui-datepicker-year{width: 44% !important;}


/* 댓글 */
.reply_w{width:100%;overflow:hidden;border-top: 1px solid #c7c7c7;border-bottom: 1px solid #c7c7c7;}
.reply_w .rebox{width:100%;overflow:hidden;padding: 5px 10px;border-top: 1px solid #ddd;}
.reply_w .rebox .re1_1{width:80%; float:left;}
.reply_w .rebox .re1_1 .t1{font-weight: bold;}
.reply_w .rebox .re1_1 .t2{}
.reply_w .rebox .re1_1 .t3{font-size:12px;color: #9d9d9d;letter-spacing: 0;margin-top: 5px;}
.reply_w .rebox .re1_2{float:right;}
.reply_w .rebox .re1_2 button{padding: 6px 10px;font-size: 13px;border-radius: 4px;background: #ddd;color: #111;}
.rebox.box2{width:100%;overflow:hidden;background:#f5f5f5;border-top: 1px dotted #ddd;display: none;}
.rebox.box2 textarea{width:90%;float:left;height: 53px;padding: 5px;}
.rebox.box2 button{width:9%;float:right;height: 53px;background: #75808a;border: 1px solid #75808a;color: #fff;}
.rebox.box3{padding-left: 30px;border-top: 1px dotted #ddd;}
.reboxtxbox{width:100%; overflow:hidden; padding:10px; background:#f5f5f5; margin-top:20px;}
.reboxtxbox textarea{width:90%;float:left;height: 53px;padding: 5px;}
.reboxtxbox button{width:9%;float:right;height: 53px;background: #75808a;border: 1px solid #75808a;color: #fff;}

/* 팝업 영역 */
.popCmmn { display:none; position:fixed; top:0; left:0;  width:100%; height:100%;    z-index: 10;}
.popBg {position:absolute;top:0;left:0;width:100%;height:100%;background: rgba(0,0,0,0.5);}
.popInnerBox {display:flex;justify-content:space-between;flex-direction:column;position:absolute;top:50%;left:50%;width: 100%;max-width: 600px;height: auto;/* margin:-125px 0 0 -200px; */background: #edeff5;border-radius: 10px;box-shadow: 4px 4px 10px rgba(0,0,0,0.3);transform: translate(-50%, -50%);-webkit-transform: translate(-50%,-50%);-ms-transform: translate(-50%,-50%);}
.popHead {padding: 10px 20px;color: #fff;font-size:18px;font-weight: bold;background: #1b1d37;border-top-left-radius: 10px;border-top-right-radius: 10px;margin-top: -2px;}
.popBody {padding: 15px;box-sizing:border-box;font-size:14px;min-height: 200px;}
.popCloseBtnCmmn {width: 28px;height: 28px;border-radius: 50%;font-size:16px;line-height: 15px;text-align: center;background: none;color: #ffffff;border: 1px solid #ddd;transition:all 0.3s;font-weight: bold;float: right;}
.popCloseBtnCmmn:hover {background:#666;}
.popbody_w{padding: 20px;background: #fff;width:100%;overflow:hidden;border-radius: 10px;box-shadow: 0px 0px 5px rgba(0,0,0,0.1);}
.popBody .btn.popCloseBtnCmmn{float:none;}
.popBody .timew1{width:80%; float:left;}
.popBody .timew2{width:20%;float:left;text-align:right;line-height: 26px;}

/* 학원쌤소개 */
.teacher td {
    vertical-align: top;
}

.teacher .subject {
    display: inline-block;
    background-color: #527bff;
    border-radius: 6px;
    padding: 2px 5px;
    margin-left: 9px;
    color: #fff;
    margin-top: 5px;
    font-size: 14px;
}

.teacher .name {
    margin-left: 10px;
    font-weight: bold;
    font-size: 15px;
}

.teacher .content {
    margin-left: 10px;
    margin-top: 10px;
}