@charset "utf-8";

/* common */
@media screen and ( max-width : 480px) {
	html {font-size:7px}
}
@media screen and ( max-width : 767px) {
	.btn_wrap{text-align: center;}
	.btn_wrap .btn, .rara_pagin_wrap + .btn_wrap .btn{width:calc(50% - 5px); margin-left:10px;}
	.btn_wrap .btn + .btn + .btn, .rara_pagin_wrap + .btn_wrap .btn + .btn + .btn{margin-left:0;margin-top:10px;}
	.btn_wrap .btn + .btn + .btn + .btn, .rara_pagin_wrap + .btn_wrap .btn + .btn + .btn + .btn{margin-left:10px;}
	.rara_pagin_wrap + .btn_wrap{float:none;margin-top:10px;display: block;}
	.rara_pagin_wrap + .btn_wrap .btn:first-of-type{margin-left:0;}
	.btn_wrap .btn:first-child:nth-last-child(3) ~ .btn:last-of-type {width: 100%;}
}
@media screen and ( max-width : 1023px) {
	.main_title, .sub_title span.nav{display: none;}
	.text_input.button .btn{margin-left:-4px;}
}

/* 필수 */
.necessary:after {content:'(* 필수)';margin-left: 5px; display: inline-block; color: #F1416C; font-size: 10px;}

/* 컨텐츠 */
.content_wrap{padding:40px;box-sizing: border-box;width: 100%;height: 100%;overflow-y: auto;display: block;}
.sec_wrap{display: grid;box-sizing: border-box;grid-template-columns: 1fr;grid-row-gap: 50px;grid-column-gap: 10px;width: 100%;}
.sec_wrap .sec {width:100%;height: auto;font-size: 0;box-sizing:border-box;padding: 10px;padding-top:0;display: block;overflow: hidden;}
.sec_wrap .sec .title{font-size:24px;font-weight: 900;}
.sec_wrap.sec_main .sec .title{margin-bottom:20px;}
.sec_wrap.sec_main .sec .title .tit_more{display: inline-block;margin-top: 5px;position: relative;border-radius: 5px;background-color: #ff7900;color: #fff;padding: 4px 10px 2px 10px;font-size: 12px;font-weight: 700;float: right;}
.sec_wrap .sec .title:before{content:'';width:25px;height:25px;margin-right:15px;vertical-align: middle;display:inline-block;background-position:center center;background-size:100% auto;background-repeat:no-repeat;}
.sec_wrap .sec01 .title:before{background-image: url(../../../../../images/com/raraclass/www/common/main_sec_icon01.png);}
.sec_wrap .sec02 .title:before{background-image: url(../../../../../images/com/raraclass/www/common/main_sec_icon02.png);}
.sec_wrap .sec03 .title:before{background-image: url(../../../../../images/com/raraclass/www/common/main_sec_icon03.png);}
.sec_wrap .sec04 .title:before, .sec_wrap .sec05 .title:before{color: #ff7900;font-family: "Font Awesome 5 Free";content: "\f328";font-weight: 300;width: auto;}
.sec_wrap .sec06 .title:before{background-image: url(../../../../../images/com/raraclass/www/common/main_sec_icon04.png);}
.sec_wrap .sec07 .title:before{background-image: url(../../../../../images/com/raraclass/www/common/main_sec_icon05.png);}
.sec_wrap .sec .title .title_point{background-color: #ff7900; color: #fff; border-radius: 50px; padding: 5px 10px; font-size: 14px; font-weight: 700; display: inline-block; margin-left: 10px; vertical-align: text-bottom;}
.sec_wrap .sec .box_wrap{border-radius: 4px;box-shadow: 3px 3px 3px 3px #e9e9e9;background-color:#fff;border-radius: 10px;}
.sec_wrap.sec_main .sec .box_wrap{height: calc(100% - 50px);}
.sec_main .sec_wrap .sec .box_wrap{margin-top:20px;}
.sec_wrap .sec .box_wrap.grid{display: grid;box-sizing: border-box;grid-template-columns: 1fr;}
.sec_wrap .sec .box_wrap.grid.two{grid-template-columns: 1fr 1fr;}
.sec_wrap .sec .box_wrap .box{position:relative;padding: 15px;overflow: hidden;}
.sec_wrap .sec .box_wrap.detail .box{padding:30px;}
.sec_wrap .sec .box_wrap .box:before{position:absolute;content:'';width:1px;height:70%;background-color:#EEEEEE;top: 50%; left: 0; transform: translateY(-50%);}
.sec_wrap .sec .box_wrap .box:first-of-type:before{display:none;}
.sec_wrap .sec .box_wrap .box .box_tit{font-size: 12px;margin-bottom:10px;color:#999999;}
.sec_wrap .sec .box_wrap .box .box_txt{font-size: 13px;margin-bottom:10px;color:#000000;font-weight: 600;line-height: 1.5;}
.sec_wrap .sec .box_wrap .box .box_txt.grid_box{font-size:0;line-height: 1;}
.sec_wrap .sec .box_wrap .box .box_txt b{font-size: 18px;font-weight:900;margin:0 5px -5px 0;vertical-align: text-bottom;display: inline-block;}
.sec_wrap .sec .box_wrap .box .box_txt span{font-size:11px;display: inline-block; vertical-align: middle; width:50%;border-right:solid 1px #f9f9f9;padding:0 10px 0 0;box-sizing:border-box;}
.sec_wrap .sec .box_wrap .box .box_txt span:last-of-type{border-right:none;padding:0 0 0 10px;}
.sec_wrap .sec .box_wrap .box .box_txt span b{margin:0;display:block;text-align:right;font-size: 16px;margin-top: 5px;}
.sec_wrap .sec .box_wrap .box .box_point{position: relative;border-radius: 5px;background-color: #ff7900;color: #fff;padding: 4px 10px 2px 10px;font-size: 12px;font-weight: 700;float: right;}
.sec_wrap .sec .box_wrap .box .box_point.up{padding: 4px 7px 2px 40px; background-color:#ff7900;}
.sec_wrap .sec .box_wrap .box .box_point.down{padding: 4px 10px 2px 40px;background-color:#999999;}
.sec_wrap .sec .box_wrap .box .box_point:after{content: '';background-position:center center;background-size:100% auto;background-repeat:no-repeat;width:10px;height:10px;position:absolute;top:50%;left:7px;transform: translateY(-50%);}
.sec_wrap .sec .box_wrap .box .box_point.up:before{content: '+';margin-right:3px;}
/* .sec_wrap .sec .box_wrap .box .box_point.down:before{content: '-';margin-right:3px;} */
.sec_wrap .sec .box_wrap .box .box_point.up:after{background-image: url(../../../../../images/com/raraclass/www/common/up_icon.png);}
.sec_wrap .sec .box_wrap .box .box_point.down:after{background-image: url(../../../../../images/com/raraclass/www/common/down_icon.png);}

@media screen and ( max-width : 1023px) {
	.sec_wrap .sec{overflow: unset; padding:0;}
	.sec_wrap .sec .box_wrap.detail .box{padding:20px;}
	.sec_wrap .sec .box_wrap.table { box-shadow: none; background-color: transparent; border-radius: 0; }
	.sec_wrap .sec .box_wrap.table .box { padding:0; overflow: unset; }
	.content_wrap{padding:20px;}
	.sec_wrap .sec .box_wrap .box .box_txt b{font-size:18px; margin: 0 3px -3px 0;}
	.sec_wrap .sec .title{font-size:19px;}
	.sec_wrap .sec .title:before{margin-right:10px;}
	.sec_wrap.sec_main .sec .box_wrap{height:auto;}
}

/* 메인 */
.grid_row{display: grid;grid-auto-rows: 1fr;}
/* .grid_row.row01{grid-template-columns: auto auto auto;} */
.grid_row.row01{grid-template-columns: auto auto;}
.grid_row.row02{grid-template-columns: auto auto;}
.grid_row.row03{grid-template-columns: auto;}
.grid_row.row04{grid-template-columns: auto;}
.sec_wrap.sec_main{grid-template-columns: auto;}
.sec_wrap.sec_main .sec01 { grid-column: auto / span 1; }
.sec_wrap.sec_main .sec02, .sec_wrap.sec_main .sec03 { grid-column: auto / span 1; }
.sec_wrap.sec_main .sec04, .sec_wrap.sec_main .sec05 { grid-column: auto / span 1; }
.sec_wrap.sec_main .sec06, .sec_wrap.sec_main .sec07 { grid-column: auto / span 1; }
.sec_wrap .sec .box_wrap.main_grid{display: grid;box-sizing: border-box;grid-template-columns: 100%;}
.sec_wrap.sec_main .sec07, .sec_wrap.sec_main .sec.sec07 .box_wrap .box{overflow: inherit;}
.sec_wrap.sec_main .sec04 .rara_table td a .td_txt:hover, .sec_wrap.sec_main .sec05 .rara_table td a .td_txt:hover, .sec_wrap.sec_main .sec06 .rara_table td a .td_txt:hover{text-decoration: underline;}

@media screen and ( max-width : 1400px) {
	/* .grid_row.row01{grid-template-columns: auto auto;} */
	.grid_row.row01{grid-template-columns: auto;}
	.grid_row.row02{grid-template-columns: auto;}
	.sec_wrap.sec_main, .grid_row{grid-row-gap: 50px; grid-column-gap:0;}
	.sec_wrap.sec_main .sec01 {grid-row: 1 / 2; grid-column: 1 / 3;}
	/* .sec_wrap.sec_main .sec02 {grid-row: 2 / 2; grid-column: 1 / 2;} */
	.sec_wrap.sec_main .sec02 {grid-column: 1 / 2;}
	.sec_wrap.sec_main .sec03 {grid-column: 2 / 2; padding-left: 20px;}
	.sec_wrap.sec_main .sec04 {grid-column: 1 / 2;}
	/* .sec_wrap.sec_main .sec03 {grid-row: 2 / 2; grid-column: 2 / 2; padding-left: 20px;} */
	.sec_wrap.sec_main .sec05 {grid-column: 2 / 2;padding-left: 20px;}
}

@media screen and ( max-width : 1023px) {
	.grid_row.row01{grid-template-columns: auto;}
	.grid_row.row02{grid-auto-rows: unset;}
	.sec_wrap.sec_main, .grid_row{grid-template-columns: 100%;grid-row-gap:40px;}
	.sec_wrap.sec_main .sec01, .sec_wrap.sec_main .sec02, .sec_wrap.sec_main .sec03, .sec_wrap.sec_main .sec04, .sec_wrap.sec_main .sec05{grid-row:auto; grid-column: auto;padding:0;}
	.sec_wrap.sec_main .sec06, .sec_wrap.sec_main .sec07 { grid-column: auto; }
}


/* 알람팝업 */
.layer_notice { display: block; opacity: 0; background-color: rgba(255, 255, 255, 1); position: absolute; top: 100%; left: 50%; right: 40px; padding: 15px; border-radius: 4px;	z-index: -1; font-size: inherit; transition: all 0.5s; box-shadow: 3px 3px 5px 1px #ededed; }
.layer_notice:before { content: ''; position: absolute; bottom: 100%; right: 15px; width: 0px; height: 0px;	border-top: none; border-bottom: 15px solid #ffffff; border-right: 15px solid transparent; border-left: 15px solid transparent;	transform: translateX(-50%); }
.layer_notice p { text-align: left; font-size: 15px; word-break: break-all; word-wrap: break-word; }
.active.layer_notice { opacity: 1; background-color: rgba(255, 255, 255, 1); z-index: 9999; }

@media screen and ( max-width : 1023px) {
	.gnb_wrap .gnb_top { display: block; }
	.gnb_wrap .gnb_sch_wrap .gnb_sch { width: 100%; }
	.gnb_wrap .gnb_btn_wrap { top: 37px; }
	.layer_notice { top: 50%; left: 40px; }
}

/* 테이블 */
.rara_table { margin: 0; width: 100%; table-layout: fixed;}
.rara_table tr { border-bottom: 1px solid #dfe0eb; }
.rara_table thead { display: none; }
.rara_table th { font-size: 14px; font-weight: 700; }
.rara_table td { display: block; font-size: 0; padding: 10px 0; }
.rara_table td:before { content: attr(data-th); display: block; font-size: 15px; word-break: keep-all; line-height: 24px; box-sizing: border-box; color: #252733; font-weight: 600; vertical-align: middle; text-align: center; padding: 10px 0 5px 0; border-bottom: solid 1px #d9d9d9; background: #F3F3F3; }
.rara_table .no_list td:before { display: none; }
.rara_table .no_list td .td_cont { padding: 0; width: 100%; text-align: center; grid-row: 1/1; grid-column: 1/3; }
.rara_table td .btn_wrap .btn{width: 100%; max-width: 120px; margin:0; display: block;}
.rara_table td .btn_wrap .btn + .btn{margin-top: 5px;}
.rara_table th, .rara_table td { word-break: break-all; }
.rara_table th.left, .rara_table td.left { text-align: left; }
.rara_table th.right, .rara_table td.right { text-align: right; }
.rara_table th.center, .rara_table td.center { text-align: center; }
.rara_table { overflow: hidden; }
.rara_table th { color: #9FA2B4; }
.rara_table td .img_wrap { display: inline-block;}
.rara_table td .img_box { display: inline-block; width: 100%; position: relative; border-radius: 4px; overflow: hidden; }
.rara_table td .img_box:after { content: ""; display: block; padding-bottom: 100%; }
.rara_table td .img_box img {position: absolute;top: 0;left: 0;width: 100%;height: 100%;object-fit: cover;margin: auto;}
.rara_table td .td_txt { display: -webkit-box; display: block; width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; box-sizing: border-box; vertical-align: middle; color: #555; font-weight: 500; line-height: 24px; word-break: keep-all; }
.rara_table.order td .td_txt {white-space: unset;text-overflow: unset;}
.rara_table td .td_txt em { display: block; font-size: 12px; line-height: 18px; color: #666666; }
.rara_table td .td_txt +.btn { margin-top: 5px; }
.rara_table td .td_pit { display: -webkit-box; display: inline-block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; box-sizing: border-box; min-width: 70px; max-width:100%; vertical-align: middle; text-align: center; padding: 3px 10px; font-size: 12px; color: #fff; border-radius: 20px; margin-top: 0; box-sizing: border-box; min-height: 16px; }
.rara_table td .td_pit.mideum { width: 80px; }
.rara_table td .td_pit.large { width: 120px; }
.rara_table td .td_cont {position: relative;display: block;font-size: 14px;box-sizing: border-box;overflow: hidden;}
.rara_table td .td_link { display: block; }
.rara_table td .td_cont.grid { display: block;; box-sizing: border-box; font-size:0; }
.rara_table td .td_cont.grid .td_grid_tit, .rara_table td .td_cont.grid .td_grid_txt { display: inline-block; width: 50%;font-size: 14px; line-height: 24px; vertical-align: top; }
.rara_table td .td_cont.grid .td_grid_txt{text-align: right;}
.rara_table td .td_cont.grid .td_grid_tit.total, .rara_table td .td_cont.grid .td_grid_txt.total { font-weight: 900; color: #252733; word-break: keep-all; margin-bottom: 10px; }
.rara_table td .td_cont.grid .td_grid_tit.pay, .rara_table td .td_cont.grid .td_grid_txt.pay { margin-top: 10px; }
.rara_table .btn{margin-top:0;}
.rara_table .btn_wrap{margin-top:10px;}
.rara_table .btn_wrap .btn{padding:5px 10px;}
.pdtShippingSpan{margin-top: 10px;display: flex;flex-direction: column;gap: 5px;}
.pdtShippingSpan:first-of-type{margin-top: 0;}
.rara_table td .sort_btn{width: 25px; height: 25px;background: url(../../../../../images/com/raraclass/www/common/arrows.svg);background-size: auto 15px;background-repeat: no-repeat;background-position: center center; border: solid 1px #dddd; border-radius: 4px; background-color: #fff;}

@media screen and ( min-width : 1022px) {
	.rara_table td:before { display: none; }
	.rara_table thead { display: table-header-group;; }
	.rara_table thead th, .rara_table tbody td { display: table-cell; padding: 15px; }
	.rara_table td .td_pit { min-height: 18px; }
	.rara_table td .img_wrap + .td_txt {max-width: 100%;/*  overflow: hidden; text-overflow: ellipsis; display: -webkit-box;	-webkit-line-clamp: 2; -webkit-box-orient: vertical;  max-height: 50px; */padding: 0 0 0 45px;}
	.rara_table td .img_wrap + .td_txt a:hover, .rara_table td a.td_txt:hover { text-decoration: underline; }
	.sec_main .rara_table td .img_wrap +.td_txt { padding: 0 90px 0 50px; }
	.rara_table td .td_txt+.td_pit { width: 70px; transform: translateY(-50%); top: 50%; right: 10px; position: absolute; }
	.rara_table td .img_wrap {display: inline-block;vertical-align: middle;position: absolute;top: 0;left: 10px;width: 25px;height: 25px;}
	.sec_main .rara_table td .img_wrap { width: 30px; height: 30px; }
}

@media screen and ( max-width : 1023px) {
	.rara_table { overflow: unset; }
	.rara_table colgroup{display:none;}
	.rara_table colgroup col { width: auto !important; }
	.rara_table_wrap.list .rara_table{display: block;}
	.rara_table tbody{display:block;}
	.rara_table tbody tr { display:block; margin: 25px 0 0 0; border-color: #d9d9d9; box-shadow: 3px 3px 3px 3px #dedede; background-color: #fff; border-radius: 10px; padding: 20px 15px 0 15px; }
	.rara_table tbody tr.no_list { padding-bottom: 20px; }
	.rara_table tbody tr:first-of-type{ margin-top: 0; }
	.rara_table td { display: contents; box-sizing: border-box; padding: 0; }
	.rara_table td:first-child, .rara_table td:last-child{padding:0;}
	.rara_table td .td_cont { padding: 15px 5px;}
	.rara_table td .td_txt { line-height: 28px; display: inline; white-space: unset; overflow: unset; text-overflow: unset; word-break: break-all;}
	.rara_table td .td_txt em { line-height: 22px; }
	.rara_table td .td_pit { margin: 0; }
	.rara_table td .td_txt +.btn, .rara_table td .td_pit.btn { margin: 0; padding: 5px 10px; display: inline-block; min-width: 100px; }
	.rara_table td .img_wrap { display: block; text-align: center; margin-bottom:10px; }
	.rara_table td .img_box { width:200px; }
	.rara_table td .td_txt +.td_pit { margin-top: -3px; margin-left: 5px; }
	.rara_table td .td_pit.btn { margin: 0; width:50%; }
	.rara_table_wrap.list .rara_table td .img_box +.td_txt { padding: 0; display: block; margin-top: 10px; }
	.rara_table td .td_cont.grid .td_grid_tit { width: 100px; }
	.rara_table td .td_cont.grid .td_grid_txt { width: calc(100% - 100px); }
	.rara_table td .btn_wrap .btn + .btn{margin-top: 0; margin-left: 10px;}
	.rara_table .btn_wrap{margin: 0 0 15px 0;}
}

@media screen and ( max-width : 767px) {
	.rara_table td .img_box { width: 100%; }	
	.rara_table td .td_cont.grid .td_grid_tit, .rara_table td .td_cont.grid .td_grid_txt { width: 50%; }
	.rara_table td .sort_btn{width: 100%; height: 5rem;}
	.rara_table td.sortBox{padding: 1rem 0 !important; display: block;}
	.rara_table td.sortBox:before{display: none;}
}

/* 테이블 - 목록 */
.rara_table_wrap.list .rara_table { border-radius: 4px; }
.rara_table_wrap.list .rara_table thead th { color: #555; background-color: #F3F3F3; word-break: keep-all;}
.rara_table_wrap.list .rara_table thead tr { border-top: solid 1px #f7f6f5; }
.rara_table_wrap.list .rara_table tbody tr:nth-of-type(2n) td { background: #FCFCFC; }
.rara_table_wrap.list .rara_table td .img_box+.td_txt { padding: 0 0 0 70px; }
.rara_table_wrap.grid {overflow-x: hidden;position: relative;}
.rara_table_wrap.list .rara_table_head{position: absolute; top:0; left:0; width: 100%; z-index:1;}
.rara_table_wrap.list .rara_table_body{display:block;max-height: 317px;overflow: auto;width: 100%;padding-top: 64px;}

.rara_table_wrap.list::-webkit-scrollbar, 
.rara_table_wrap.list .rara_table_head::-webkit-scrollbar,
.rara_table_wrap.list .rara_table_body::-webkit-scrollbar,
.chat_wrap .inner::-webkit-scrollbar, 
.doubleDiv .tree::-webkit-scrollbar {width: 7px; height: 7px;}
.rara_table_wrap.list::-webkit-scrollbar-thumb, 
.rara_table_wrap.list .rara_table_head::-webkit-scrollbar-thumb, 
.rara_table_wrap.list .rara_table_body::-webkit-scrollbar-thumb, 
.doubleDiv .tree::-webkit-scrollbar-thumb {background-color: rgba(221,221,221,0.6); border-radius: 10px;background-clip: padding-box; border: 0px solid transparent;}
.rara_table_wrap.list::-webkit-scrollbar-track,
.rara_table_wrap.list .rara_table_head::-webkit-scrollbar-track,
.rara_table_wrap.list .rara_table_body::-webkit-scrollbar-track,
.doubleDiv .tree::-webkit-scrollbar-track {background-color: rgba(249,249,249,1); border-radius: 10px;box-shadow: inset 0 0 0 white;}
.rara_table_wrap.list .rara_table {min-width: 1140px;}

@media screen and ( max-width : 1600px) {
	.rara_table_wrap.list { overflow-x: scroll; }
	.rara_table_wrap.grid {overflow-x: hidden;position: relative;}
}

@media screen and ( max-width : 1023px) {
	.rara_table_wrap.list { overflow-x: unset; }
	.rara_table_wrap.list .rara_table { table-layout: unset; min-width: auto; }
	.rara_table_wrap.list .rara_table td .img_box+.td_txt { padding: 0; display: block; margin-top: 10px; }
	.rara_table_wrap.list .rara_table tbody tr:nth-of-type(2n) td{ background:none; }
	.rara_table_wrap.list .rara_table_body{max-height: 825px;padding-top: 0;}
}

/* 테이블 총합 */
.rara_table_wrap .rara_table.total{margin-bottom:10px;}
.rara_table_wrap .rara_table.total th {color: #555; background-color: #F3F3F3;}
.rara_table_wrap .rara_table.total tr:first-of-type {border-top: 1px solid #dfe0eb;}

@media screen and ( max-width : 1023px) {
	.rara_table_wrap .rara_table.total th{ display: block; width: 100%; padding: 10px 0; box-sizing: border-box; background: #fff; font-size: 16px; font-weight: 700;}
}

/* 테이블 탑 */
.search_top { padding: 0 0 10px 0; overflow: hidden; font-size: 0; }
.search_top>* { margin-right: 5px; }
.search_top>*:first-of-type { margin-left: 0; }
.search_top .select_wrap.sch { text-align: right; width: 100%; margin-right: 0; }
.search_top.grid .select_wrap.sch { min-width: 500px; width: auto; float: right; }
.search_top .select_wrap select { max-width: 150px; }
.search_top .select_wrap select + select {margin:0 0 0 5px;}
.search_top .select_wrap select + input { display: inline-block; max-width: 250px; margin: 0 0 0 5px; padding:0 10px; box-sizing:border-box;}
.search_top .select_wrap select + input + select + .btn,
.search_top .select_wrap select + input + select,
.search_top .select_wrap select + input + .btn {margin-left:5px;}
.search_top .select_wrap input +.btn { margin-left: 5px; }
.search_top .btn { border-radius: 4px; height: 28px; box-sizing: border-box; line-height: 20px; vertical-align: middle; margin-bottom: 0; background-color: #999999; margin-top:0;}

@media screen and ( max-width : 1670px) {
	.search_top.grid .select_wrap.sch {float: none;margin-top: 10px;min-width: 100%;text-align: right;}
}

@media screen and ( max-width : 1200px) {
	.search_top.grid { display: grid; grid-template-columns: 1fr 1fr 1fr; grid-gap: 10px; }
	.search_top>* { width: 100%; }
	.search_top .btn { margin: 0; }
	.search_top .select_wrap select { max-width: 100%; }
	.search_top.grid .select_wrap.sch {grid-row: 3/3;grid-column: 2/4;padding: 0;margin: 0;font-size: 0;text-align: right;}
	.search_top .select_wrap.sch select {max-width: 150px;}
	.search_top .select_wrap select+input {max-width: 200px;margin: 0 0 0 5px;}
	.search_top .select_wrap input+.btn {width: 50px;padding: 0;}
	.search_top .select_wrap select + select {margin:0;}
}

@media screen and ( max-width : 1023px) {
	.search_top.grid { box-shadow: 3px 3px 3px 3px #dedede; background-color: #fff; border-radius: 10px; padding: 20px 15px; margin-bottom: 20px; }
}

@media screen and ( max-width : 700px) {
	.search_top.grid { grid-template-columns: 1fr 1fr; }
	.search_top.grid .select_wrap.sch { grid-row: 5/5; grid-column: 1/3; }
	.search_top .select_wrap.sch select { max-width: 100%; margin-top:10px; }
	.search_top .select_wrap.sch select:first-of-type{margin-top:0;}
	.search_top .select_wrap select + input {max-width: calc(100% - 57px);margin: 10px 0 0 0;}
	.search_top .select_wrap input+.btn { width: 50px; padding: 0; margin-top:10px; }
	.search_top .select_wrap select + input + select + .btn{margin-top: 10px;}
}

/* 상황판 */
.sec_wrap .sec .board_wrap { margin: 0 0 15px 0; }
.sec_wrap .sec .board_wrap .btn { font-size: 15px; margin-top: 0; margin-right: 10px; min-height: 32px; line-height: 33px; border-radius: 4px; min-width: 100px; background-color: #fff; border-color: #999; color: #333; padding: 0; font-weight: 500; }
.sec_wrap .sec .board_wrap .btn:hover, .sec_wrap .sec .board_wrap .btn.on { color: #fff; }
.sec_wrap .sec .board_wrap .btn span { margin-left: 5px; font-weight: 700; }
.sec_wrap .sec .board_wrap+.box_wrap { margin-top: 0; }
.sec_wrap .sec .board_wrap .btn.pit_yellow{color: #ffffff;}

@media screen and ( max-width : 1200px) {
	.sec_wrap .sec .board_wrap { display: grid; grid-template-columns: 1fr 1fr 1fr; grid-gap: 10px; }
	.sec_wrap .sec .board_wrap .btn { margin: 0; min-width:auto;}
}

/* 페이징 */
.rara_pagin_wrap { padding: 30px 0 10px 0; }
.rara_pagin { display: block; font-size: 0; }
.sec_main .rara_pagin_wrap { margin-top: 20px; padding: 0; }
.sec_main .rara_pagin_wrap .rara_pagin { text-align: right; }
.rara_pagin_wrap.right .rara_pagin { text-align: right; }
.rara_pagin_wrap.center .rara_pagin { text-align: center; }
.rara_pagin_wrap.left .rara_pagin { text-align: left; }
.rara_pagin a { color: black; text-decoration: none; border-radius: 50%; font-size: 15px; display: inline-block; width: 25px; height: 25px; text-align: center; line-height: 28px; color: #CCCCCC; vertical-align: middle; margin: 0 5px; }
.rara_pagin a.active, .rara_pagin a:hover { color: #333333; }
.rara_pagin a.page_prev, .rara_pagin a.page_next { background-repeat: no-repeat; background-size: 100% auto; background-position: center center; }
.rara_pagin a.page_prev { background-image:	url(../../../../../images/com/raraclass/www/common/prev_icon.png); }
.rara_pagin a.page_next { background-image: url(../../../../../images/com/raraclass/www/common/next_icon.png); }

@media screen and ( max-width : 1023px) {
	.rara_pagin { text-align: center; width: 100%; }
	.sec_main .rara_pagin_wrap .rara_pagin { text-align: center; }
	.rara_pagin a { font-size: 20px; width: 30px; height: 30px; line-height: 32px; margin: 0 5px; }
}

.pit_blue { background-color: #1294f2 !important; }
.pit_yellow { background-color: #fba63c !important; }
.pit_orange { background-color: #ff7900 !important; }
.pit_gray { background-color: #999999 !important; }
.pit_red { background-color: #eb5757 !important; }
.pit_green { background-color: #29cc97 !important; }

/* 풀캘린더 */
.rara_calendar_wrap { text-align: center; overflow: hidden; padding: 20px 0; box-sizing: border-box; }
.rara_calendar_wrap .rara_calendar_tit { display: inline-block; border-radius: 200px; background-color: #EEEEEE; padding: 12px 30px 10px 30px; font-size: 28px; font-weight: 900; line-height: 28px; color: #FF7900; }
.rara_calendar_wrap .rara_calendar {width: 100%;padding: 0 50px;box-sizing: border-box;margin-top: 40px;}
.rara_calendar_wrap .rara_calendar ul { width: 100%; }
.rara_calendar_wrap .rara_calendar li { display: block; float: left; width: 14.3%; padding: 5px; box-sizing: border-box; border-bottom: 1px solid #DFE0EB; margin-right: -1px; margin-bottom: -1px; }
.rara_calendar_wrap .rara_calendar ul.cal_week { overflow: hidden; border-bottom: solid 1px #DFE0EB; }
.rara_calendar_wrap .rara_calendar ul.cal_week li { text-align: center; line-height: 52px; color: #666666; font-size: 20px; font-weight: 900; box-sizing: border-box; border: none; padding: 0; }
.rara_calendar_wrap .rara_calendar .cal_days li { height: 120px; }
.rara_calendar_wrap .rara_calendar .cal_days li.today { border: solid 2px #F1416C;}
.rara_calendar_wrap .rara_calendar .date {display: block;text-align: center;padding: 10px 0;color: #666666;font-size: 18px;font-weight: 700;position: relative;}
.rara_calendar_wrap .rara_calendar ul.cal_week li.sat, .rara_calendar_wrap .rara_calendar .sat .date { color: #1294F2; }
.rara_calendar_wrap .rara_calendar ul.cal_week li.sun, .rara_calendar_wrap .rara_calendar .sun .date, .rara_calendar_wrap .rara_calendar .holi .date { color: #EB5757; }
.rara_calendar_wrap .rara_calendar .pit { display: inline-block; width: 90%; color: #ffffff; border-radius: 20px; padding: 4px 10px 3px 10px; margin-bottom: 5px; text-overflow: ellipsis; white-space: nowrap; word-wrap: normal; overflow: hidden; font-size: 14px; box-sizing: border-box; }
.rara_calendar_wrap .rara_calendar .day .pit:last-of-type { margin-bottom: 0; }
.rara_calendar_wrap .rara_calendar .other_month .date { color: #DDDDDD; }
.rara_calendar_wrap .rara_calendar .event_dim{position: fixed; display:block; top:0; left:0; width:100%; height:100%; z-index:1000; background: rgba(0, 0, 0, 0.3);}
/* 
.rara_calendar_wrap .rara_calendar .event_layer { position: absolute; display: none; font-size: 14px; border-radius: 4px; line-height: 18px; background: #ffffff; text-decoration: none; box-shadow: 2px 1px 3px 1px rgba(0,0,0,0.1); border-radius: 10px; z-index:100;max-width: 325px; box-sizing:border-box;}
.rara_calendar_wrap .rara_calendar .event_layer:before { content: ''; position: absolute; top: calc(50% - 8px); left: -17px; width: 0px; height: 0px; border-top: 15px solid transparent; border-bottom: 15px solid #e8e8e8; border-right: none; border-left: 15px solid transparent; transform: translateY(-50%); }
.rara_calendar_wrap .rara_calendar .event_layer:after { content: ''; position: absolute; top: calc(50% - 10px); left: -15px; width: 0px; height: 0px; border-top: 15px solid transparent; border-bottom: 15px solid #ffffff; border-right: none; border-left: 15px solid transparent; transform: translateY(-50%); }
 */
/* 2023-08-17 수정 */
.rara_calendar_wrap .rara_calendar .event_layer { position: fixed; top: 50%; left: 50%;  transform: translate(-50%, -50%); display: none; font-size: 14px; border-radius: 4px; line-height: 18px; background: #ffffff; text-decoration: none; box-shadow: 2px 1px 3px 1px rgba(0,0,0,0.1); border-radius: 10px; z-index:1001; max-width: 90%; box-sizing:border-box;}
.rara_calendar_wrap .rara_calendar .event_pit.toggle {min-height: 24px; display: flex; align-items: center; padding: 4px; width: 62px;}
.rara_calendar_wrap .rara_calendar .event_pit.toggle:has(.on){justify-content: flex-end;}
.rara_calendar_wrap .rara_calendar .event_pit.toggle span{width: 18px; height: 18px; border-radius: 100%; background-color: #ffffff; position: relative; display: flex; top: auto; left: auto; right: auto; margin: 0; transform: none;}
/* //2023-08-17 수정 */
.rara_calendar_wrap .rara_calendar .event_layer.sat_layer {box-shadow: -2px 1px 2px 1px rgba(0,0,0,0.1);}
.rara_calendar_wrap .rara_calendar .event_layer.sat_layer:before {left: auto; right:-17px; border-top: 15px solid transparent; border-bottom: 15px solid #e8e8e8; border-left: none; border-right: 15px solid transparent; }
.rara_calendar_wrap .rara_calendar .event_layer.sat_layer:after {left: auto; right:-15px; height: 0px; border-top: 15px solid transparent; border-bottom: 15px solid #ffffff; border-left: none; border-right: 15px solid transparent; }
.rara_calendar_wrap .rara_calendar .event_date { color: #ffffff; padding: 10px 15px 8px 15px; background-color: #FF7900; font-size: 15px; font-weight: 900; display: block; box-sizing: border-box; border-radius: 10px 10px 0 0; }
.rara_calendar_wrap .rara_calendar .event_cont { padding:10px 15px; font-size: 14px; display: flex; flex-direction: column; box-sizing: border-box; border-radius: 0 0 10px 10px; max-width: 100%; gap: 5px;}
.rara_calendar_wrap .rara_calendar .event_link { color: #666; position: relative; box-sizing: border-box; line-height: 28px; text-align: left; font-size:15px; display: flex; gap: 10px; width: 100%; align-items: flex-start;}
.rara_calendar_wrap .rara_calendar .event_link:hover .event_txt{ text-decoration: underline; }
.rara_calendar_wrap .rara_calendar .event_txt{ display: inline-block; width: 100%; box-sizing: border-box; text-overflow: ellipsis; white-space: nowrap; word-wrap: normal; overflow: hidden; vertical-align: middle; white-space: unset;}
/* .rara_calendar_wrap .rara_calendar .event_pit{display: -webkit-box;display: inline-block;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;box-sizing: border-box;color:#ffffff;padding: 5px;padding-right: 20px;width: 70px;border-radius:20px;font-size: 11px;line-height: 14px;display: block;text-align: center;} */
.rara_calendar_wrap .rara_calendar .event_pit{box-sizing: border-box;color:#ffffff;padding: 5px;border-radius:20px;font-size: 11px;line-height: 14px;display: flex;min-width: fit-content;}
.rara_calendar_wrap .rara_calendar .event_pit span{display: inline-block;border-radius: 10px;font-size: 10px;font-weight: 900;margin-left: 5px;position: absolute;top: 50%;right: 5px;transform: translateY(-50%);}
.rara_calendar_wrap .cal_prev, .rara_calendar_wrap .cal_next{background-repeat: no-repeat;background-size: 60% auto;background-position: center center;display: block;position: absolute;top:0;width: 80px;height:100%;}
.rara_calendar_wrap .cal_prev{background-image: url(../../../../../images/com/raraclass/www/common/prev_icon.png);left: 0;}
.rara_calendar_wrap .cal_next{background-image: url(../../../../../images/com/raraclass/www/common/next_icon.png);right: 0;}
.rara_calendar_wrap .add_num{position: absolute;top: calc(50% - 2px);left: calc(50% + 25px);transform: translate(-50%, -50%);width: 24px;height: 24px;font-size: 11px;background-color: #e9e9e9;border-radius: 50%;line-height: 27px;font-weight: 500;display: inline-block;color: #666666;text-align: center;cursor: pointer;}

@media screen and (max-width: 1023px) {
	.rara_calendar_wrap{ padding:0;	}
	.rara_calendar_wrap .rara_calendar_tit{ font-size: 18px; line-height: 24px;	padding: 10px 20px 8px 20px; margin-top: 7px;}
	.rara_calendar_wrap .rara_calendar{ padding:0; margin-top: 20px; }
	.rara_calendar_wrap .rara_calendar .cal_week, .rara_calendar_wrap .rara_calendar .other_month {	display: none; }
	.rara_calendar_wrap .rara_calendar li { height: auto !important; width: 100%; padding: 10px 10px 20px 10px;	margin-bottom: -1px; }
	.rara_calendar_wrap .rara_calendar .date { float: none; text-align: left; margin-bottom: 10px; font-size:15px; }
	.rara_calendar_wrap .rara_calendar .pit{ width:100%; text-align: left; padding:10px 20px; margin-bottom:10px; max-width: 76vw;}
	.rara_calendar_wrap .rara_calendar .event_link:hover .event_txt{ text-decoration: none;	}
	.rara_calendar_wrap .cal_prev, .rara_calendar_wrap .cal_next{ top: 17px; width: 50px; height: 50px; background-size: 100% auto;	}
	.rara_calendar_wrap .cal_prev{ left: 35px; }
	.rara_calendar_wrap .cal_next{ right: 35px;	}
	.rara_calendar_wrap .rara_calendar .event_layer{ width: 80%; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); }
	.rara_calendar_wrap .rara_calendar .event_cont{	max-width: 100%; }
	.rara_calendar_wrap .rara_calendar .event_layer:before,	.rara_calendar_wrap .rara_calendar .event_layer:after{ display: none; }
	.rara_calendar_wrap .add_num {left:25px;top: 50%;}
}

/* 리뷰 */
.list_wrap li{margin-top: 20px;}
.list_wrap li:first-of-type{margin-top:0;}
.list_wrap .list_box{display: block;font-size:0;border-radius:4px;border:solid 1px #ddd;padding: 0;}
.list_wrap .list_box .tit{display: inline-block;font-size:16px;font-weight:700;padding: 20px 15px 15px 15px;color:#333;transition: color .2s ease;}
.list_wrap .list_box .tit:hover{text-decoration: none; color: #FF7900;}
.list_wrap .list_box .info{font-size:12px;padding: 0 15px 15px 15px;}
.list_wrap .list_box .info > * {display:inline-block;vertical-align:middle;line-height: 1.8;}
.list_wrap .list_box .info .stars{display: inline-block;vertical-align: middle;direction: rtl;margin-top: -2px;}
.list_wrap .list_box .info .stars input[type=radio]{display: none;}
.list_wrap .list_box .info .stars label, 
.list_wrap .list_box .info .stars span{font-size: 12px; color: transparent; text-shadow: 0 0 0 #f0f0f0;}
.list_wrap .list_box .info .stars input[type=radio]:checked ~ label, 
.list_wrap .list_box .info .stars span.active ~ span,
.list_wrap .list_box .info .stars span.active{text-shadow: 0 0 0 #F9D10B;}
.list_wrap .list_box .info .stars + .name:before, 
.list_wrap .list_box .info .name:after {content: '';display: inline-block;vertical-align: middle;width: 1px;height: 14px;background-color:#ddd;margin: -1px 10px 0 5px;}
.list_wrap .list_box .info .name:after{margin: -1px 5px 0 10px;}
.list_wrap .list_box .no_list{text-align: center;font-size: 15px;padding: 15px 20px;line-height: 1.6;margin: 0;}
.list_wrap .list_box .pre{white-space: pre-line;font-size: 15px;padding: 15px 20px;line-height: 1.6;max-height: 100px;overflow-y: auto;margin: 0;border-top: solid 1px #ddd;margin-bottom: 0;cursor: pointer;}
.list_wrap .list_box .pre:hover{text-decoration: underline;cursor: pointer;}
.list_wrap .list_box .cmt{padding: 10px 20px;font-size: 12px;border-top:solid 1px #ddd;}
.list_wrap .list_box .cmt span {font-weight: 700; margin-left: 5px; color: #FF7900;}
.list_wrap .list_box .list_cmt{border:solid 1px #ddd; margin:10px 15px; margin-top:0; border-radius: 4px;}
.list_wrap .list_box .list_cmt .info{padding:15px;}
.list_wrap .list_box .list_cmt .textarea_wrap textarea{border:none;border-radius:0;font-size:14px;padding:15px 10px;margin-bottom: 0;}
.list_wrap .list_box .input_cmt{padding:10px 20px;}
.list_wrap .list_box .input_cmt .tit{padding:0; margin-bottom:10px;}
.list_wrap .list_box .btn_wrap{padding: 10px; margin-top: 0; border-top: solid 1px #ddd;}
.pop_wrap .list_wrap .list_box .pre:hover{text-decoration: none;cursor: default;}

.nont_list_wrap{display: none; padding:20px 0; border-top:solid 1px #ddd; border-bottom:solid 1px #ddd;}
.nont_list_wrap p{text-align: center; font-size: 15px;}

.pop_cont .list_wrap .list_box{border:none;}
.pop_cont .list_wrap .list_box .list_cmt{margin:0 0 0 20px;position: relative;}
.pop_cont .list_wrap .list_box .list_cmt:before{content: '';position: absolute;top: -5px;left: -15px;font-size: 18px;font-weight: 900;width: 10px;height: 30px;border: none;border-left: solid 1px #ddd;border-bottom: solid 1px #ddd;}
.pop_cont .list_wrap .list_cont{border: solid 1px #ddd; border-radius: 4px; margin-bottom:10px;}
.pop_cont .list_wrap .list_box .tit{padding:20px 15px 15px 15px;line-height: 1.4;}
.pop_cont .list_wrap .list_box .list_cmt .textarea_wrap textarea{border-top:solid 1px #ddd;}
.pop_cont .list_wrap .list_box .input_cmt{padding:10px 0; margin-top:10px;}
.pop_cont .list_wrap .list_box .input_cmt .tit{padding:0;} 

/* 레이어팝업 */
.pop_dim {display: none;position:fixed;top: 0;left: 0;width: 100%;height: 100%;background:#000;opacity:.5;filter:alpha(opacity=50);z-index: 8000;}
.pop_wrap {display: none;border-radius:4px;width: 500px;height: auto;max-height:90%;position: fixed;top: 50%;left: 50%;z-index: 9000;transform: translate(-50%, -50%);overflow: hidden;box-sizing: border-box;}
.pop_wrap div.pop_head {position: relative;padding: 15px 20px;background-color: #ff7900;}
.pop_wrap div.pop_head p {color: #fff; font-size: 16px; font-weight: 700;}
.pop_wrap div.pop_head .pop_close:before, 
.pop_wrap div.pop_head .pop_close:after {position: absolute;top:-3px;left: 9px;content:'';height: 25px;width: 2px;background-color: #fff;} 
.pop_wrap div.pop_head .pop_close:before {transform: rotate(45deg);} 
.pop_wrap div.pop_head .pop_close:after {transform: rotate(-45deg);}
.pop_wrap div.pop_head .pop_close{width:20px;height: 20px;display: inline-block;position: absolute;top: 15px;right: 20px;}
.pop_wrap div.pop_cont {padding: 25px;box-sizing: border-box;background-color: #fff;height: 100%;width: 100%; max-height:580px;overflow-y:auto;}
.pop_wrap div.pop_cont .review_wrap .textarea_wrap.etc{font-size: 14px;border: 1px solid #e9e9e9;border-radius: 5px;padding: 15px 10px;min-height: 100px;max-height: 100px;box-sizing: border-box;overflow-y: auto;}

@media screen and (max-width: 1023px) {
	.pop_wrap {width:90%;height: auto;}	
	.pop_wrap div.pop_cont{padding:15px; max-height:420px;}
}

/* 트리구조 */
.tree_wrap { display: inline-block; box-shadow: 3px 3px 3px 3px #dedede; background-color: #fff; border-radius: 10px; width: 250px; vertical-align: top; }
.sec_wrap .sec .tree_wrap + .box_wrap { display: inline-block; width: calc(100% - 270px); margin-left: 20px; vertical-align: top; }
.tree_wrap .tree {position: relative;padding: 20px;box-sizing: border-box;}
.tree_wrap .tree ul { padding: 0 0 10px 10px; }
.tree_wrap .tree *:before {width:15px;height:15px;display: block;position: absolute;top: 16px;left: 0;transform: translateY(-50%);line-height: 1.2;}
.tree_wrap .tree a {cursor: pointer;font-size: 16px;padding: 5px 0;display: block;font-weight: 700;line-height: 1.8;position: relative;padding-left: 15px; word-break:keep-all;min-height: 35px;}
.tree_wrap .tree ul a { font-size: 14px; font-weight: 500; }
.tree_wrap .tree a:hover, .tree_wrap .tree a.class.active { color: #FF7900; }
.tree_wrap .tree a.class { font-size: 14px; font-weight: 500; }
.tree_wrap .tree a.class:before { content:'·'; }
.tree_wrap .tree a:before { content: '+' }
.tree_wrap .tree a.on:before { content: '-' }
.tree_wrap .tree a ~ ul { display: none; }
.tree_wrap .tree a.on ~ ul { display: block; }

@media screen and (max-width: 1820px){
	.sec_wrap .sec .tree_wrap + .box_wrap .rara_table_wrap {overflow-y: auto;}
}
@media screen and (max-width: 1023px) {
	.sec_wrap .sec .tree_wrap + .box_wrap{box-shadow:none;background: none;display: block;margin:0; margin-top:20px; width:100%;}
	.sec_wrap .sec .tree_wrap + .box_wrap .box{padding:0;overflow: unset;}	
	.tree_wrap{display: block; width:100%; height: auto; min-height: auto;}
	.tree_wrap .tree{ height: auto;}
	.tree_wrap .tree > li {display: inline-block; width:50%; vertical-align: top;}
	.tree_wrap .tree a, .tree_wrap .tree ul a{ font-size: 14px;}
}

/* 채팅 */
.chat_wrap {width: 100%;height: 100%;font-size: 14px;color:#333;box-sizing: border-box;position: relative;}
.chat_wrap .inner{background-color:#acc2d2;border-radius:5px 5px 0 0;padding: 20px 3px 20px 10px;overflow-y:auto;height: 400px;box-sizing: border-box;max-height: calc(100% - 120px);width: 100%;}
.chat_wrap .ntc_wrap + .inner{padding: 105px 3px 20px 10px;}
.chat_wrap .date{color:#555; text-align: center; padding: 15px 0; font-size: 12px;}
.chat_wrap .date:first-of-type{padding-top:0;}
.chat_wrap .item{margin-top:15px}
.chat_wrap .item:first-child{margin-top:0px}
.chat_wrap .item .user{margin-left:20px;margin-bottom:5px;font-weight:700;color:#555;}
.chat_wrap .item .box{display:inline-block; max-width:70%; position:relative}
.chat_wrap .item .box::before{content:""; position:absolute; left:-8px; top:9px; border-top:0px solid transparent; border-bottom:8px solid transparent;border-right:8px solid #fff;}
.chat_wrap .item .box .msg {background:#fff; border-radius:10px; padding:8px; text-align:left; white-space: pre-line;}
.chat_wrap .item .box .time {font-size:11px;color: #555;position:absolute;right: -75px;bottom:5px;width:70px;}
.chat_wrap .item.mymsg{text-align:right}
.chat_wrap .item.mymsg .box::before{left:auto; right:-8px; border-left:8px solid #fee600; border-right:0;}
.chat_wrap .item.mymsg .box .msg{background:#fee600}
.chat_wrap .item.mymsg .box .msg a{color: cornflowerblue; text-decoration: underline;}
.chat_wrap .item.mymsg .box .msg a:hover{color:blueviolet;}
.chat_wrap .item.mymsg .box .time{right:auto; left:-75px}
.chat_wrap .item.mymsg .box .modify{position: absolute;bottom: 30px;left: -60px;padding: 5px 15px;}
.chat_wrap .item .box{transition:all .3s ease-out;margin: 0 0 0 20px;opacity: 1;}
.chat_wrap .item.mymsg .box{transition:all .3s ease-out;margin: 0 20px 0 0;}
.chat_wrap .item.on .box{margin:0; opacity: 1;}

.chat_wrap .inner::-webkit-scrollbar-thumb {background-color: rgba(51,51,51,0.4); border-radius: 10px;background-clip: padding-box; border: 0px solid transparent;}
.chat_wrap .inner::-webkit-scrollbar-track {background-color: rgba(249,249,249,0); border-radius: 10px;box-shadow: inset 0 0 0 white;}
.chat_wrap .inner + .textarea_box {border-top:none; border-radius:0 0 5px 5px;}
.chat_wrap .textarea_box {font-size:0;border:solid 1px #ddd;background:#fff;box-sizing:border-box;border-radius:5px;overflow: hidden;}
.chat_wrap .textarea_box textarea{width: calc(100% - 100px);height: 100px;border: none;resize: none;padding: 10px 10px 36px 10px;}
.chat_wrap .textarea_box textarea::placeholder{color:#555;}
.chat_wrap .textarea_box .btn_wrap{margin-top:0;display: inline-block;width: 100px;vertical-align: middle;padding: 10px;box-sizing: border-box;border-left: solid 1px #e9e9e9;}
.chat_wrap .textarea_box .btn_wrap .btn{border-radius: 4px;width:100%;}
.chat_wrap .file_input input[type=text] {width: calc(100% - 101px);}
.chat_wrap .file_input label {margin-top: 10px;}

.chat_wrap .ntc_wrap{position: absolute;top: 0;left: 0;width: 100%;background: rgba(255,255,255,0.6);padding: 15px;box-sizing: border-box;z-index: 100;}
.chat_wrap .ntc_wrap .ntc_head p{font-size:14px;font-weight:700;color:#555;}
.chat_wrap .ntc_wrap .ntc_head a{position: absolute; top: 15px; right: 14px; width: 10px; height: 10px; border: 2px solid #555; border-top: 0; border-right: 0; transform: rotate(-45deg);}
.chat_wrap .ntc_wrap.on .ntc_head a{transform: rotate(135deg);top: 20px;}
.chat_wrap .ntc_wrap .ntc_cont{margin-top:20px; max-height: 28px; overflow: hidden;}
.chat_wrap .ntc_wrap .ntc_cont ul li{font-size:14px;text-overflow:ellipsis;white-space:nowrap;word-wrap:normal;width:100%;overflow:hidden;padding:10px 0;line-height: 1.8;border-top:dashed 1px #999;}
.chat_wrap .ntc_wrap .ntc_cont ul li a{display: block;}
.chat_wrap .ntc_wrap .ntc_cont ul li:first-of-type{padding-top:0; border-top:none;}
.chat_wrap .ntc_wrap .ntc_cont ul li:last-of-type{padding-bottom:0;}
.chat_wrap .ntc_wrap.on .ntc_cont{max-height: 335px; overflow-y: auto;}
.chat_wrap .ntc_wrap.on .ntc_cont ul li{text-overflow: unset;white-space: pre-line;overflow: unset;word-break: break-all;font-size: 12px;}
.chat_wrap .ntc_wrap.on .ntc_cont ul{margin-top: 10px;}
.chat_wrap .ntc_wrap.on .ntc_cont ul:first-of-type{margin-top:0;}
.chat_wrap .ntc_wrap .ntc_cont::-webkit-scrollbar-thumb {background-color: rgba(51,51,51,0.4); border-radius: 10px;background-clip: padding-box; border: 0px solid transparent;}
.chat_wrap .ntc_wrap .ntc_cont::-webkit-scrollbar-track {background-color: rgba(249,249,249,0); border-radius: 10px;box-shadow: inset 0 0 0 white;}

@media screen and (max-width: 1023px) {
	.chat_wrap .inner{height: calc(100% - 155px);}
	.chat_wrap .item .box .msg{font-size: 12px;}
	.chat_wrap .item.mymsg .box{margin: 0 10px 0 0;}
	.chat_wrap .item .box{margin: 0 0 0 10px;}
	.chat_wrap .item .user{margin-left:10px;font-size:12px;}
	.chat_wrap .ntc_wrap.on .ntc_cont {max-height: 45vh;}
}

/* 코멘트 */

/* 수업과정 */
.eye_btn{font-size: 32px; line-height: 24px; opacity: 0.3;}
.eye_btn.on{opacity: 1;}

/* 상세페이지 */
.detail_tit{position:relative;font-size: 16px;font-weight: 700;color:#555;margin-bottom:10px;padding:10px 0 10px 20px;}
.detail_tit.mt10{ margin-top:10px;}.detail_tit.mt20{ margin-top:20px;}.detail_tit.mt30{ margin-top:30px;}
.detail_tit:before{content: '';position: absolute;top: calc(50% - 1px);left:0;width:15px;height: 15px;border-radius:50%;background-color:#FF7900;display: block;transform: translateY(-50%);}
.detail_tit:after{content: '';position: absolute;top: calc(50% - 1px);left: 4px;width: 7px;height: 7px;border-radius:50%;background-color:#ffffff;display: block;transform: translateY(-50%);}
.detail_tit .btn{float: right;border-radius: 4px; transform: translate(-10px, 0px);margin:0;}
.detail_cont{padding:0 10px; font-size:15px;}
.detail_cont .note-editor table, .detail_cont .note-frame table{max-width:100% !important; width:auto !important;}
.detail_cont .select_wrap{width:200px;}
.detail_cont td .select_wrap{width:100%;}
.detail_cont > .comment_area{display: block; align-items: unset;}
.detail_img_wrap{display: block; border-radius: 4px; border:solid 1px #ddd;}
.detail_img_wrap .detail_img_box{padding:10px;font-size:0; text-align: center;}
.detail_img_wrap .detail_img_box .detail_img{position:relative;display:inline-block;max-width:200px;width: calc(20% - 8px);margin-right:10px;}
.detail_img_wrap .detail_img_box .detail_img:after{content: "";display: block;padding-bottom: 100%;}
.detail_img_wrap .detail_img_box .detail_img:nth-of-type(n+6){margin-top: 10px;}
.detail_img_wrap .detail_img_box .detail_img:nth-child(5n){margin-right: 0;}
.detail_img_wrap .detail_img_box .detail_img img{position: absolute; top: 50%; left: 50%; max-width: 100%; max-height: 100%; transform: translate(-50%, -50%);}
.detail_img_wrap .detail_img_box .detail_img .img_del{position:absolute;top: 5px;right: 5px;width: 20px;height: 20px;display: block;}
.detail_img_wrap .detail_img_box .detail_img .img_del:before, .detail_img_wrap .detail_img_box .detail_img .img_del:after {position: absolute;left: 9px;content: ' ';height: 20px;width: 2px;background-color: #000;}
.detail_img_wrap .detail_img_box .detail_img .img_del:before {transform: rotate(45deg);}
.detail_img_wrap .detail_img_box .detail_img .img_del:after {transform: rotate(-45deg);}
.detail_img_wrap .file_input{text-align: center; padding: 0 10px 10px 10px;}
.detail_cont .btn_wrap.class_hide{text-align: right; margin-top: 1.5rem;}
.detail_cont .btn_wrap.class_hide .btn:after{content: '숨기기'; margin-left: 5px;}
.detail_cont .btn_wrap.class_hide .btn.hide:after{content: '보기';}
.detail_cont .btn_wrap.class_hide .btn.not_hide:after{display: none;}

.title_box_wrap{font-size:0; display: block; padding:0;}
.title_box{display: inline-block; min-width:200px; vertical-align: top; padding:10px; box-sizing:border-box;}
.title_box:first-of-type{margin-left: 0;}
.title_box .tit{display:block;font-size:13px; font-weight: 700; margin-bottom:10px;}
.title_box .radio_label_wrap{margin-right:10px;padding: 8px 0;}
.title_box .radio_label_wrap:last-of-type{margin-right:0;}

@media screen and (max-width: 1023px) {
	.detail_cont{padding:0;}
	.chk_label_wrap{margin:0 10px 10px 0; min-width: auto; max-width:none;}
	.detail_cont .rara_table tbody tr{padding:0;border-radius:0;box-shadow:none;border:none;margin-top: 0;padding-top: 20px;border-bottom: solid 1px#ddd;}
	.detail_tit .btn{transform: translate(-10px, -5px);}
	.title_box{min-width: 100%;}
	.detail_img_wrap .detail_img_box .detail_img{width:calc(50% - 5px);}
	.detail_img_wrap .detail_img_box .detail_img:nth-child(5n){margin-right: 10px;}
	.detail_img_wrap .detail_img_box .detail_img:nth-of-type(n+3){margin-top: 10px;}
	.detail_img_wrap .detail_img_box .detail_img:nth-child(even){margin-right: 0;}
}
@media screen and (max-width: 767px) {
	.detail_cont{padding:0;}
	.chk_label_wrap{margin:0 10px 10px 0; min-width: auto; max-width:none;}
	.detail_cont .rara_table tbody tr{padding:0;border-radius:0;box-shadow:none;border:none;margin-top: 0;padding-top: 20px;border-bottom: solid 1px#ddd;}
	.detail_cont .rara_table tbody tr:first-of-type{padding-top: 0;}
	.detail_tit .btn{transform: translate(-10px, -5px);}
	.title_box{min-width: 100%;}
	.detail_cont .btn_wrap.class_hide{text-align: center;}
}

/* 로그인 */
.login_wrap {width: 100%;display: block;position: relative;margin-top: -100%;transition: ease-out 0.5s;box-sizing:border-box;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);max-width: 500px;max-height: 90%;z-index: 9999;}
.login {width: 100%;height: 100%;background: white;border-radius: 20px;display: block;text-align: center;padding: 50px 20px;box-sizing: border-box;box-shadow: 3px 3px 3px 3px #dedede;}
.login_logo{ text-align: center; color: #333;}
.login_logo a{ max-width: 320px; display: inline-block; transform: translateX(-10px);}
.login_logo img{ width:100%;}
.login_id {position:relative; margin-top:50px; padding: 0 20px; box-sizing: border-box; text-align: left; display: block;}
.login_id input { width: 100%; height: 50px; border-radius: 30px; margin-top: 10px; padding: 0px 20px; border: 1px solid #ddd;}
.login_pw {position:relative;margin-top: 20px;padding: 0 20px;box-sizing: border-box;text-align: left;display: block;}
.login_pw input { width: 100%; height: 50px; border-radius: 30px; margin-top: 10px; padding: 0px 20px; border: 1px solid #ddd;}
.red_txt{display: block;width: 100%;color: red;padding: 10px 20px;box-sizing: border-box;}
.login_etc {padding: 15px 30px;font-size: 14px;display: block;align-items: center;font-weight: 700;overflow: hidden;}
.login_etc .remember{float: left;}
.login_etc .remember label{font-size:14px;}
.login_etc .find_pw{float: right;}
.login_tit{padding:0 10px;}
.login_info{margin-top:30px;}
.login_btn_wrap { margin-top: 20px; padding: 0 20px;}
.login_btn_wrap .login_btn { display: block; line-height:48px; box-sizing: border-box; width: 100%; height: 50px; border: 0; border-radius: 40px; background: linear-gradient(to left, rgb(255, 77, 46), rgb(255, 121, 0)); color: #fff; font-size: 16px; letter-spacing: 2px; font-weight:900;}

.login_wrap.password{margin-top:0;}
.login_wrap.password .login_id{margin-top:30px;}
.login_wrap.password .login_btn_wrap{margin-top:50px;}
.login_id input:read-only{background:#fff;border-color:#ddd;}

@media screen and (max-width: 1023px) {
	.login_wrap{ max-width: 90%; max-height: 90%;}
	.login{ padding: 20px;}
	.login_logo a{max-width:80%; transform: unset;}
	.login_id{margin-top:30px; padding:0;}
	.login_pw{padding:0;}
	.login_etc{padding:15px 5px;}
	.login_info{margin-top:10px;}
	.login_btn_wrap{padding:0;}
	.red_txt{padding:10px;}
	.login_id input, .login_pw input{height:42px;}
	.login_btn_wrap .login_btn{height:42px; line-height: 42px;}
	.login_wrap.password .login_pw{margin-top:20px;}
}

.doubleDiv .box, .doubleDiv .tree{max-height: 70vh;}
.doubleDiv .tree{overflow-y: auto;}

@media screen and ( max-width : 1023px) {
	.doubleDiv .box, .doubleDiv .tree{max-height:200px;}
}


.review_slide {display: flex;flex-direction: column;gap: 2rem;width: 100%;box-sizing: border-box;margin-bottom: 20px;padding: 0 20px;box-sizing: border-box;}
.review_slide .class_review_slide, .review_slide .class_review_pagin {box-sizing: border-box;border-radius: 5px;width: 100%;position: relative;overflow: hidden;display: flex;justify-content: center;align-items: center;box-sizing: b;}
.review_slide .class_review_slide .swiper-button-prev { left: 0px; }
.review_slide .class_review_slide .swiper-button-next { right: 0px; }
.review_slide .class_review_pagin { padding: 0px 3rem; width: 100%; }
.review_slide .class_review_pagin img { width:100%; height: 100%; object-fit: cover;}
.review_slide .swiper-slide { width: 100%; position: relative; overflow: hidden; display: flex; justify-content: center; align-items: center; }
.review_slide .class_review_pagin .swiper-button-next::after, .review_slide .class_review_pagin .swiper-button-prev::after { font-size: 2.4rem; }
.review_slide .class_review_pagin .swiper-button-prev { left: 0px; width: 2rem; }
.review_slide .class_review_pagin .swiper-button-next { right: 0px; width: 2rem; }
.review_slide .class_review_pagin .swiper-wrapper{gap: 10px; align-items: center;}
.review_slide .vid_wrap {display: block;width: 100%;box-sizing: b;}
.review_slide .vid_wrap video{width: 100%; cursor: pointer;}
.vid_wrap video[poster] {object-fit: cover;}

/* 게시판 상세 */
.board_cmt{max-height: 300px;overflow-y: auto;border: solid 1px #00000032;padding: 20px;border-radius: 5px;}
.board_cmt::-webkit-scrollbar{width: 5px;}
.board_cmt::-webkit-scrollbar-thumb {background-color: #f3f7f9; border-radius: 4px;}
.board_cmt::-webkit-scrollbar-track {background: transparent; box-shadow: none;}
.board_cmt > ul + ul{margin-top: 20px;}
.board_cmt ul li{margin-top: 20px;}
.board_cmt ul li:first-of-type{margin-top: 0;}
.board_cmt ul li .cmt_box{display: flex;align-items: center;background-color: #f5f5f5;padding: 15px;border-radius: 5px;justify-content: space-between;}
.board_cmt ul li .cmt_box .cmt{margin-right: 10px;}
.board_cmt ul li .cmt_box .cmt p{margin-bottom: 5px; font-weight: 500; font-size: 13px; line-height: 20px;}
.board_cmt ul li .cmt_box .cmt span{font-size: 11px; font-weight: 500; color: #a1a5b7;word-break: keep-all;}
.board_cmt ul li .cmt_box .cmt span.date{margin-left: 5px;}
.board_cmt ul li .cmt_box .cmt_ment { white-space: pre-line; font-size: 1.3rem; line-height: 1.4; font-weight: 500;}
.board_cmt ul li .bttn{height: 28px;}
.board_cmt ul li ul{padding-left: 30px;padding-top: 20px;position: relative;}
.board_cmt ul li ul:before{content: '';position: absolute;top: 20px;left: 9px;width: 10px;height: 10px;border-bottom: solid 1px #a1a5b7;border-left: solid 1px #a1a5b7;}
.board_cmt.write ul li .cmt_box{width: 100%; box-sizing: border-box;}
.board_cmt.write ul li .cmt_box .cmt{width: 100%;margin: 0;display: flex;flex-direction: column;gap: 10px;}
.board_cmt.write ul li .cmt_box .cmt p, .board_cmt.write ul li .cmt_box .cmt span{margin:0;}
.board_cmt.write ul li .cmt_box .cmt .group{display: flex;justify-content: space-between;align-items: baseline;}
.board_cmt.write ul li .cmt_box .cmt .group .info{display: flex; gap:5px;}
.comment_area {display: flex;align-items: flex-end;gap: 5px;border: 1px solid rgb(227, 227, 227);padding: 15px;border-radius: 5px;background-color: #fff;margin-top: 15px;}
.comment_area textarea { border: 0px; padding: 0px; height: 8rem; width: 100%; resize: none; }
.comment_area button, .cmt_btn button {min-width: 42px;min-height: 24px;text-align: center;border-radius: 4px;background-color: #29cc97;color: #fff;font-size: 12px;font-weight: 700;}
.comment_area button.btn_edit { background-color: rgb(241, 250, 255); color: rgb(0, 158, 247); }
.comment_area button.btn_cancel { background-color: rgb(240, 240, 240); color: rgb(114, 114, 114); }
.cmt_btn .cmt_subCmt.on, .cmt_btn .cmt_edit.on{display: none;}

@media screen and (max-width: 767px) {
	.board_cmt.write ul li .cmt_box .cmt .group{flex-direction: column;gap: 10px;}
	.board_cmt.write ul li .cmt_box .cmt .group .cmt_btn{justify-content: flex-end;width: 100%;display: flex;gap: 5px;}
}


.load_view {position: relative; display: flex; width: 100%; height: 31rem; background-image: url('/resources/images/com/raraclass/www/seller/list_preview.png'); background-repeat: no-repeat; background-size: cover;}
.load_view .btn_view{position: absolute; top: 50%; left: 50%; font-size: 18px; font-weight: 600; background-color: #999999; color: #ffffff; transform: translate(-50%, -50%); border-radius: 10px; padding: 20px 40px;box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.3);}