

@charset "utf-8";
@import url('../../css/font.css');

*{ word-break: keep-all;}
html { width:100%; height:100%; }
body { margin:0px; height:100%; }
.f_td01 select{
    font-size: 12px;
    width: 130px;
    height: 40px;
    padding-left: 15px;
    padding-right: 15px;
    float: left;
    border: 1px solid #d6d6d6;
    border-radius: 5px 0 0 5px;
    box-shadow: none;
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    background: url(../img/comm/icon_select.png) no-repeat 95% center;
}
.t_td01 select{
    font-size: 12px;
    width: 130px;
    height: 40px;
    padding-left: 15px;
    padding-right: 15px;
    float: left;
    border: 1px solid #d6d6d6;
    border-radius: 5px 0 0 5px;
    box-shadow: none;
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    background: url(../img/comm/icon_select.png) no-repeat 95% center;
}
@media screen and (max-width:800px) {
    .f_td01 select{
        width: 100%;
        padding: 0 0 0 2px;
    }
    .t_td01 select{
        width: 100%;
        padding: 0 0 0 2px;
    }
}
input[type="text"], input[type="password"], input[type="date"], input[type="email"] {
    margin-right: 5px;
    padding: 0 0 0 15px;
    transition:width 1s;
    width: 20%;
    height: 40px;
    border: 1px solid #dbdbdb;
}

input[type="file"]  {
    width: 20%;
    transition:width 1s;
    border: 1px solid #dbdbdb;
}

input[type="button"] {
    width: auto;
    height: 40px;
    padding: 5px;
    cursor: pointer;
    border-radius: 5px;
    display: block;
    float: left;
    text-align: center;
    font-size: 12px;
    margin-right: 1px;
}

input[type="button"]:hover { border:1px solid #ee3f3f; color:#ee3f3f; background:#ffffff;}
input[type="submit"] {
    background-color: cornflowerblue;
    color:#ffffff;
    width: 100%;
    height: 42px;
    border-radius: 5px;
    display: block;
    float: left;
    text-align: center;
    font-size: 12px;
}
.pic{
    width: auto;
    height: 40px;
    padding: 5px;
    cursor: pointer;
    text-align: center;
    font-size: 12px;
    margin: 1px;
}
@media screen and (max-width:1200px) {
    input[type="text"], input[type="password"], input[type="date"], input[type="email"],input[type="file"] {
        width: 40%; transition:width 1s;
        padding: 0 0 0 10px;
    }
}
@media screen and (max-width:768px) {
    input[type="text"], input[type="password"], input[type="date"], input[type="email"],input[type="file"] {
        width: 60%; transition:width 1s;
        padding: 0 0 0 7px;
    }
}
@media screen and (max-width:650px) {
    input[type="text"], input[type="password"], input[type="date"], input[type="email"],input[type="file"] {
        width: 100%; transition:width 1s;
        padding: 0 0 0 1px;
    }
}
.submit_btn{
    width: auto !important;
    height: 42px !important;
    border-radius: 5px !important;
    display: block !important;
    float: left !important;
    margin: 1px !important;
    text-align: center !important;
    font-size: 12px !important;
}
input[type="checkbox"] {
    margin-left: 5px;
    margin-right: 5px;
}
input[type="radio"] {
    margin-left: 5px;
    margin-right: 5px;
}

td, iframe, textarea {
	color: black;
	font-size:12px;

    margin:0px;
    
}
input {
    border: 1px solid #dcdddd;
	color: black;
	font-size:12px;

}
table{ border-spacing: 0px 0px; }



select , textarea {
    border: 1px solid #dcdddd;
}
img {
	border:0px;
}
p, ul, form {
	margin:0px;
}
a {
	color:#008ED2;
	text-decoration: none !important;
}
a:hover {
	color:#000000;
	text-decoration: none;
}
a:active {
	color:#000000;
	text-decoration: none;
}
fieldset {
	padding:10px;
}
legend {
	font-size:12px;
	margin-bottom:5px;
}
caption {
}
.post{
    background-color: rgb(244, 244, 244);
}
.content-box{ padding-left: 260px;}
.content-box.close { padding-left: 78px;}
.title{font-weight: bold;font-size:16px;}
.paginate{ width:100%; text-align:center; margin-top:2em;}
.paginate a { margin-left:0px; display:inline-block; width:23px; color:#686868; font-size:0.9em; line-height:23px; background:#ffffff; border:1px #c5c5c5 solid; }
.paginate a:hover { border:1px solid #ee3f3f; color:#ee3f3f; }
.paginate a.on{ margin-left:0px; display:inline-block;  width:25px; color:#fff; font-size:0.9em; line-height:25px;  background:#484848; border:0;  }
.paginate a.on:hover { background:#4c61b5; color:#fff; }


.btn_smp {
	border:1px solid #9EB4CA;

	background: #F8F8F8;
	cursor:pointer;
	color:#666666;
	font-size:11px;
	letter-spacing:-2px;
	margin:0px;
	height:17px;
	padding-top:2px;
}
.btn_simp {
	background:url("../images/css_btn_sm_right2.gif") right no-repeat;
	font-size:11px;
	color:gray;
	padding:3px 7px 0px 7px;
	letter-spacing:-1px;
	border:0px;
	height:19px !important;
	margin:0px;
	cursor:pointer;
	display:inline-block;
}
.bttns_simp {
	background:url("../images/css_btn_sm_left2.gif") no-repeat !important;
	height:19px !important;
	display:inline-block !important;
	padding:0px !important;
	margin:1px 0 1px 0 !important;
}
.bttn, .btn_save, .btn_cls, .btn_search, .btn, 
.btn_list, .btn_ins, .btn_mod, .btn_del, .btn_ccl, .btn_cls, .btn_sch {

	font-size:12px;
	color:#333333;
	padding:2px 18px 0px 15px !important;
	letter-spacing:-1px;
	height: 37px !important;
    margin: 2px;
    border: 1px solid;
	cursor:pointer;
  display:inline-block;
}

.list_bt{
    font-size: 12px;
    color: #fff !important;
    padding: 3px 15px 0px 15px !important;
    letter-spacing: -1px;
    height: 26px;
    margin: 2px;
    border: 1px solid;
    cursor: pointer;
    display: inline-block;
    border-radius: 5px;
    background: #6495ed !important;
}

.list_bt:hover{
    color : #ee3f3f !important;
    background: #fff !important;
}
.btn_saup{
    font-size:12px;
	color:#333333;
	padding:2px 18px 0px 15px;
	letter-spacing:-1px;
	height: 37px !important;
    margin:0px;
    border: 1px solid;
	cursor:pointer;
    display:inline-block;
    float: right;
}
.btn_simp:hover { color:#8080FF; }
.bttn:hover, .btn_save:hover, .btn_cls:hover, .btn_search:hover, .btn:hover
, .btn_list:hover, .btn_ins:hover, .btn_mod:hover, .btn_del:hover, .btn_ccl:hover, .btn_cls:hover, .btn_sch:hover {
    border:1px solid #ee3f3f; color:#ee3f3f; background-color: #ffffff;
}


.bttn.yellow, .btn_simp.yellow { color:#BBB839; }
.bttn.red, .btn_simp.red { color:#BC3838; }
.bttn.blue, .btn_simp.blue { color:#3950BB; }
.bttn.sky, .btn_simp.sky { }
.bttn.green, .btn_simp.green { color:#4CA953; }
.bttn.brown, .btn_simp.brown { color:#C08534; }
.bttn.purple, .btn_simp.purple { color:#953FB6; }

.bttn.yellow:hover, .bttn.red:hover, .bttn.blue:hover, .bttn.sky:hover
, .bttn.green:hover, .bttn.brown:hover, .bttn.purple:hover
, .btn_simp.yellow:hover, .btn_simp.red:hover, .btn_simp.blue:hover, .btn_simp.sky:hover
, .btn_simp.green:hover, .btn_simp.brown:hover, .btn_simp.purple:hover { 
	color:gray; 
}
input[type="submit"]:hover { border:1px solid #ee3f3f; color:#ee3f3f; background-color: #ffffff;}

/* 검색박스 스타일 */
.s_tb01 {
	border:2px solid #dfdfdf;
	width:100%;
	height: 50px;
}

.s_th01 {
	padding:8px;
	background-color:#f7f7f7;
	font-weight:bold;
	color:gray;
	width:60px;
	text-align:center;
	border-top:1px solid silver;
	border-left:1px solid silver;
	border-bottom:1px solid silver;
	text-transform:uppercase;
}

.s_td01 {
	border-top:1px solid silver;
	border-right:1px solid silver;
	border-bottom:1px solid silver;
	padding:4px;
}

/* 액션박스 스타일 */
.a_tb01 {
	width:100%;
	height: 27px;
	margin:5px 0 0 0;
}
.a_th01 {
	padding: 3px;
	padding-left:0px;
	color:#333333;
	font-weight:bold;
	border-top:1px solid #ffffff;
	border-bottom:1px solid #ffffff;
	border-left:1px solid #ffffff;
}
.a_td01 {
    float: right;
	padding: 3px 0px 3px 3px;
	font-weight:bold;
	border-top:1px solid #ffffff;
	border-right:1px solid #ffffff;
	border-bottom:1px solid #ffffff;
}

/* 목록 테이블 스타일 */
.l_tb01 {
	border-collapse:collapse;
	width:100%;
	margin-bottom:1px;
	margin-top:2px;
}
.l_tb01 thead {
}
.l_th01 {
    border: 0.5px solid #dcdddd;
	text-align:center;
    color: #777a7a;
    
	padding:4px;
	letter-spacing:-1px;
    height:25px;
    background-color: #f5f4f0;
}
.l_th02 {
	text-align:center;
	color:#333333;

	padding:4px;
	letter-spacing:-1px;
	height:18px;
	background: url("../images/ftb09.gif") repeat-x left 1px ;
	border:1px solid #dcdddd;
}
.l_th03 {
    text-align: center;
    width: 100%;
    box-shadow: rgb(0 0 0 / 13%) 0px 0px 1px, rgb(0 0 0 / 20%) 0px 1px 3px;
    
    height: 35px;
    margin-bottom: 3px;
    background-color: #f5f4f0;
    color: #777a7a;
    border-radius: 3px 3px 0px 0px;
}
.l_th04 {
	text-align:center;
	color:#333333;

	padding:4px;
	letter-spacing:-1px;
	height:18px;
	border:1px solid #9AC6FF;
	background-color:#C7DFFF;
}
.l_td01 {
	border:0.9px solid #dcdddd;
	padding:4px;
	height:18px;
}
.l_tr_even {
	background-color:white;
}
.l_tr_odd {
	background-color:#fbfbfb;
}
.l_tr_notice {
	background-color:#f7f7f7;
}
.l_sort01 {
	cursor:pointer;
	margin:0px;
	padding:0px;
}

/* 자료 없음 테이블 */
.n_tb01 {
	width:100%;
	border-collapse:collapse;
}
.n_tb01 td, .n_td01 {

	padding:10px;
	color:#666666;
	text-align:center;
	border:1px solid #dcdddd;
}

/* 페이지 네비게이션 박스 스타일 */
.p_tb01 {
	margin-top:5px;
	border-collapse:collapse;
	width:100%;
}
.p_td01 {
	text-align:center;
	padding-bottom:5px;
}

/* 타이틀, 입력,수정 테이블 스타일 */
.c_tb01 {
    width: 100%;
    box-shadow: 0 0 1px rgb(0 0 0 / 13%), 0 1px 3px rgb(0 0 0 / 20%);
    height: 35px;
    margin-bottom: 3px;
    background-color: #f5f4f0;
    color: #777a7a;
    border-radius: 3px 3px 0 0;
}
.c_th01 {
    padding: 3px;
    padding-left: 10px;
    color: #777a7a;
    font-weight: bold;
}
.c_td01 {
	text-align:right;
	padding: 3px;
	font-weight:bold;
}

.f_tb01 {
	width:100%;
	border-collapse:collapse;
	
}
.f_th01 {
	font-weight: normal;
    color: #333333;
    text-align: justify;
    padding: 4px 10px 4px 10px;
    letter-spacing: -1px;
    border: 0.9px solid #dcdddd;
    width: 110px;
    height: 22px;
    background: #f4f4f4;
    border-top: 0.9px solid rgb(0,0,0, 0.1);
    border-bottom: 0.9px solid rgb(0,0,0, 0.1);
}
@media screen and (max-width:768px) {
    .f_th01 {
        width: 50px;
    }
}
.f_td01 {
    height: 44px;
    padding: 4px;
    border-top: 0.9px solid rgb(0,0,0, 0.1);
    border-bottom: 0.9px solid rgb(0,0,0, 0.1);
}
#form1 .auto_dis > td {	
  
	padding:4px;
	border:1px solid #dcdddd;}

.f_td02 {
	border-right:1px solid #dcdddd;
	border-collapse:collapse;
}

.f_th02 {
	font-weight:normal;

	color:#333333;
	text-align:left;
	padding-left:4px;
	letter-spacing:-1px;
	border-left:1px solid #dcdddd;
	border-right:1px solid #dcdddd;
	width:120px;
	height:22px;
	background: #f8f8f8;
	
}

.f_td03 {

	padding:4px;
	border-top:1px solid #dcdddd;
	border-bottom:1px solid #dcdddd;
}

.f_th03 {
	font-weight:normal;

	color:#333333;
	text-align:left;
	padding:4px;
	height:22px;
	letter-spacing:-1px;
	border-top:1px solid #dcdddd;
	border-bottom:1px solid #dcdddd;
	width:120px;
	background: #f8f8f8;
	
}

.t_tb01 {
	width:100%;
	border-collapse:collapse;
	margin-bottom:5px;
}
.t_th01 {
	font-weight:normal;
	color:#333333;
	text-align:center;
	padding:4px 10px 4px 10px;
	letter-spacing:-1px;
	border:1px solid #dcdddd;
	width:110px;
	height:50px;
	background: #f4f4f4;
}

.t_td01 {

	padding:4px;
	border:1px solid #dcdddd;
}

.b_tb01 {
	width:100%;
	margin-top:10px;
	margin-bottom:10px;
}
.b_th01 {
}
.b_td01 {
	text-align:right;
}

/* 가이드테이블 */
.g_tb01 {
	border-collapse:collapse;
	width:100%;
	margin-bottom:1px;
	margin-top:2px;
}
.g_td01 {
	border:1px solid #dcdddd;
	padding:10px;
}

/* etc */
.mt3 { margin-top:3px; }
.mt5 { margin-top:5px; }
.ipt01 { vertical-align:-2px; }
.mvarrow {
	cursor:pointer;
	color:blue;
}
.desc01 { background:url(../images/dot_blue.gif) no-repeat left -1px; background-position: left; font-size:11px; color:#999999; padding-left:7px; margin-left:5px; letter-spacing:-1px; }
.desc01 span.good { color:#4C5BA9; }
.desc01 span.bad { color:#A94C4C; }
.desc02 { color:#ABABAB; }
.ipt_right { text-align:right; padding-right:3px; }
.ipt_left { text-align:left; padding-left:3px; }



/* 페이징 */
#paging img {margin-bottom:2px}
#paging .select {font-weight:bold;color:red;}
#paging .mg_select {font-weight:bold;color:red;}
#paging .first_off img {}
#paging .last_off img {}
#paging .prev_on img {margin-right:5px;}
#paging .prev_off img {margin-right:5px;}
#paging .next_on img {margin-left:5px;}
#paging .next_off img {margin-left:5px;}


/* 탭 스타일 */
.tabs {
	width: 100%;
	line-height: normal;
/*	background-image: url("../images/tab_bg.gif");*/
	margin:0px;
}
.tabs ul {
	margin: 0px;
	padding: 0 2px 1px 0px;
	text-align:right;
	list-style:none;
	float: left;
}
.tabs li {
	float: left;
	background: url("../images/tab_bg.gif") no-repeat left top;
	margin: 0;
	margin-left: 0;
	margin-right: 2px;
	padding: 0 0 0 20px;
	line-height: 23px;
}
.tabs li.current {
	background: url("../images/tab_sel_bg.gif") no-repeat left top;
	margin-right: 2px;
}
.tabs span {
	float: left;
	display: block;
	background: url("../images/tab_end.gif") no-repeat right top;
	padding: 0 20px 0 0;
}
.tabs .current span {
	background: url("../images/tab_sel_end.gif") no-repeat right top;
}
.tabs a {
	text-decoration: none;
	font-size: 12px;
}
.tabs a:link, .tabs a:visited, .tabs a:hover {
	color: black;
}
.tabs a:hover {}
.tabs .current {}
.tabs .current a, .tabs .current a:link, .tabs .current a:visited {}
/* 임의 탭 스타일 */
.tab01 {
	width:100%;
	margin-bottom:10px;
	background:url(../images/admin/line_bg.gif) repeat-x bottom;
	vertical-align:bottom;
}


/* body 타이틀 블릿 영역 */
.blt { 
	float:left;
	background:#000000;
	width:5px;
	height:14px;
	border:1px solid gray;
	font-weight:normal;
	margin:1px 8px 0px 0px;
}
.blt_new { 
    font-size: 14px;
    float:left;
	width:20px;
	height:20px;
	border:0px solid gray;
	font-weight:normal;
	margin:0px 8px 0px 0px;
}


/* 페이징 */
.page_box			{ margin:0 auto; table-layout:auto !important}
.page_box li		{vertical-align:top;display:inline-block}
.page_box td		{ padding:0px; border-width:0px;  color:#999999; font-size:11px }
.page_first_btn		{ margin-right:0px; background:url(../images/btn_first.gif) no-repeat center center; width:19px; height:14px; }
.page_last_btn		{ margin-left:0px; background:url(../images/btn_last.gif) no-repeat center center; width:19px; height:14px; }
.page_prev_btn		{ margin-right:10px; background:url(../images/btn_prev.gif) no-repeat center center; width:15px; height:14px; }
.page_next_btn		{ margin-left:10px; background:url(../images/btn_next.gif) no-repeat center center; width:15px; height:14px; }
.page_seperator		{ width:8px; height:15px; background: url(../images/page_bar.gif) center center no-repeat; }
.page_number_btn	{ color:#6e6e6e; padding:0 3px 0 3px; }
.page_number_btn_on	{ color:#1a5eab; font-weight:bold; padding:0 3px 0 3px; }

.p_tb01 .on { padding:0; margin:0 }



/* UTIL */
.autoround5 {
	border:1px solid #d0d0d0;
	padding:10px;
	position:relative;
}
.autoround3 {
	border:1px solid #d0d0d0;
	padding:10px;
	position:relative;
}

.picker_name { float:left; width:530px; padding:5px; margin-left:5px; border:1px solid #9AAAB9; background-color:#F8F8F8; }
.cate01 { font-size:11px; letter-spacing:-1px; color:gray; padding-bottom:3px; }

.font11 { font-size:11px; }
.crm { background:url(../images/btn_crm.png) left no-repeat; padding-left:20px; }
.stat-date { color:#4C5BA9; font-size:13px; }

.status.red { color:#A94C4C; }
.status.blue { color:#4C5BA9; }
.status.gray { color:#7F7F7F; }
.status.green { color:#4CA953; }
.status.sky { color:#4C8EA9; }

/* 라벨 */
.label{font-size:11px;padding:3px 4px 3px;font-weight:normal;vertical-align:top}
.label.red{background-color:#d9534f;color:#fff}
.label.blue{background-color:#428bca;color:#fff}
.label.gray{background-color:#999;color:#fff}
.label.green{background-color:#5cb85c;color:#fff}
.label.sky{background-color:#5bc0de;color:#fff}
.label.black{background-color:#000000;color:#fff}
.label.small{font-size:10px}
.label.large{font-size:12px}

/*로그인*/
.login_form {position:relative; padding:0; margin:auto; width:550px; height:250px; background-color:#fafafa; overflow:hidden; border:1px solid #d5d5d5;}
.login_table {width:400px;border-collapse:collapse;border:0px #afafaf solid;margin-bottom:10px}
.login_table td {font-size:12px;text-align:left;}
.login_table span {font-size:14px;text-align:left;}
/*버튼*/
.comm_btn {position:relative; margin:auto;text-align:center; border: solid 1px #3e649d;}
.comm_btn span {font:normal 15px 'Noto Sans KR'; color:#ffffff;border: solid 0px #fff;}
.comm_btn span a{font:normal 15px 'Noto Sans KR'; color:#ffffff;border: solid 0px #fff;}

/*jquery validation*/
label.error {
    padding-left: 0 !important;
    margin: 0;
    color: red;
    display: block;
    float: none;
    background: none !important;
}
label {
    display: inline-block;
    max-width: 100%;
    margin-left: 5px;
    margin-right: 5px;
    font-weight: bold;
}

/* 차시보기 수정버튼 */
.pop_btn{
    width: 100px;
    line-height: 34px;
    border: 1px solid #333333;
    display: block;
    color: #333333 !important;
    border-radius: 5px;
    text-align: center;
    background-color: #f0f0f0;
    cursor: pointer;
    float: left;
    margin: 2px;
}
.pop_btn:hover{
    border:1px solid #ee3f3f; 
    color:#ee3f3f important;
    background-color: #ffffff;
}

.l_td01 span.v1 {border:1px solid rgb(184, 208, 250);color:#587ef6;background:#fff;padding:4px;text-decoration:none;display:inline-block}
.l_td01 span.v1:hover {background:rgb(184, 208, 250);color:#fff}
.l_td01 a.v2 {border:1px solid #a9a9a9;color:#000;background:#fff;padding:4px;text-decoration:none;display:inline-block}
.l_td01 a.v2:hover {background:#eee;color:#000}
.l_td01 .star {vertical-align: sub;}

.list_tb {padding:15px 20px; border-top:none; margin:3px 5px; cursor:pointer;}
span.list_tb {display:inline-block; position: relative; margin-bottom: 5px; padding:3px 10px; background:rgb(184, 208, 250); color:#000; font-size:1.1rem; letter-spacing:-1px; z-index: 400;}
span.list_tb:hover {color:#fff;background:#3baeff;text-decoration:none}
