/* PC용 기본 스타일 입력 (해상도 1200px 이상 ~ 제한없는100% 형식)*/


button, input, textarea, label, select { font-family: Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', '나눔 고딕', 'Malgun Gothic', sans-serif; font-size:1.125rem; }

/* placeholder 스타일 지정 */
input::placeholder { color: #999; font-size: 14px; font-weight: 300; opacity: 1; }
input::-webkit-input-placeholder { color: #999; font-size: 14px; font-weight: 300; }
input:-ms-input-placeholder { color: #999; font-size: 14px; font-weight: 300;}
input:-mos-input-placeholder { color: #999; font-size: 14px; font-weight: 300; }
textarea::placeholder { color: #999; font-size: 14px; font-weight: 300; opacity: 1; /* 파이어폭스에서 뿌옇게 나오는 현상을 방지하기 위한 css */ }
textarea::-webkit-input-placeholder { color: #999; font-size: 14px; font-weight: 300; }
textarea:-ms-input-placeholder { color: #999; font-size: 14px; font-weight: 300; }
textarea:-mos-input-placeholder { color: #999; font-size: 14px; font-weight: 300; }



/* 리스트 상단 클래스 선택 셀렉트 박스 */
select.select_class {  color:#000; padding:10px 50px 10px 15px; font-size:1.25rem; font-weight:500;  background: url(/ileschool/_images/common/select_arrow.png) no-repeat 94% center #ffe009 !important; min-width:200px; margin-bottom:5px; }


/* 전체선택 */
.select_all_wrap{display:inline-block; padding:10px 30px;}
.select_all_wrap .checkmark{display:none;}

@media screen and (max-width: 767px){
	.select_all_wrap{ padding: 8px 15px;}
	.select_all_wrap label{font-size: 0.875rem; }
}

/* textarea */
textarea {border: solid 1px #d5d6db; border-radius: 8px; line-height: 1.4; margin-bottom: 10px; padding: 20px; height:300px;}
@media screen and (max-width: 767px){
	textarea{height:200px;}
}


.checks {position: relative;}
/*** 체크 박스 ***/
.checks input[type="checkbox"] {  /* 실제 체크박스는 화면에서 숨김 */
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip:rect(0,0,0,0);
  border: 0
}
.checks input[type="checkbox"] + label {
  display: inline-block;
  position: relative;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
}
.checks input[type="checkbox"] + label:before {  /* 가짜 체크박스 */
  content: ' ';
  display: inline-block;
  width: 21px;  /* 체크박스의 너비를 지정 */
  height: 21px;  /* 체크박스의 높이를 지정 */
  line-height: 21px; /* 세로정렬을 위해 높이값과 일치 */
  margin: -2px 8px 0 0;
  text-align: center; 
  vertical-align: middle;
  background: #fafafa;
  border: 1px solid #cacece;
  border-radius : 3px;
  box-shadow: 0px 1px 2px rgba(0,0,0,0.05), inset 0px -15px 10px -12px rgba(0,0,0,0.05);
}
.checks input[type="checkbox"] + label:active:before,
.checks input[type="checkbox"]:checked + label:active:before {
  box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px 1px 3px rgba(0,0,0,0.1);
}

.checks input[type="checkbox"]:checked + label:before {  /* 체크박스를 체크했을때 */ 
  content: '\2714';  /* 체크표시 유니코드 사용 */
  color: #99a1a7;
  text-shadow: 1px 1px #fff;
  background: #e9ecee;
  border-color: #adb8c0;
  box-shadow: 0px 1px 2px rgba(0,0,0,0.05), inset 0px -15px 10px -12px rgba(0,0,0,0.05), inset 15px 10px -12px rgba(255,255,255,0.1);
}


.checks.etrans input[type="checkbox"] + label {
  padding-left: 30px;
}
.checks.etrans input[type="checkbox"] + label:before {
  position: absolute;
  left: 0;
  top: 0;
  margin-top: 0;
  opacity: .6;
  box-shadow: none;
  border-color: #999;
  -webkit-transition: all .12s, border-color .08s;
  transition: all .12s, border-color .08s;
}

.checks.etrans input[type="checkbox"]:checked + label:before {
  position: absolute;
  content: "";
  width: 10px;
  top: -5px;
  left: 5px;
  border-radius: 0;
  opacity:1; 
  background: transparent;
  border-color:transparent #E70012 #E70012 transparent;
  border-top-color:transparent;
  border-left-color:transparent;
  -ms-transform:rotate(45deg);
  -webkit-transform:rotate(45deg);
  transform:rotate(45deg);
}

.no-csstransforms .checks.etrans input[type="checkbox"]:checked + label:before {
  /*content:"\2713";*/
  content: "\2714";
  top: 0;
  left: 0;
  width: 21px;
  line-height: 21px;
  color: #E70012;
  text-align: center;
  border: 1px solid #E70012;
}



/*** 라디오 버튼 ***/
.checks input[type="radio"] {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip:rect(0,0,0,0);
  border: 0;
}
.checks input[type="radio"] + label {
  display: inline-block;
  position: relative;
  padding-left: 30px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
}
.checks input[type="radio"] + label:before {
  content: '';
  position: absolute;
  left: 0;
  top: -4px;
  width: 21px;
  height: 21px;
  text-align: center;
  background: #fafafa;
  border: 1px solid #cacece;
  border-radius: 100%;
  box-shadow: 0px 1px 2px rgba(0,0,0,0.05), inset 0px -15px 10px -12px rgba(0,0,0,0.05);
}
.checks input[type="radio"] + label:active:before,
.checks input[type="radio"]:checked + label:active:before  {
  box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px 1px 3px rgba(0,0,0,0.1);
}
.checks input[type="radio"]:checked + label:before {
  background: #E9ECEE;
  border-color: #adb8c0;
}
.checks input[type="radio"]:checked + label:after {
  content: '';
  position: absolute;
  top: 1px;
  left: 5px;
  width: 13px;
  height: 13px;
  background: #99a1a7;
  border-radius: 100%;
  box-shadow: inset 0px 0px 10px rgba(0,0,0,0.3);
}




/************* 라벨값이 플레이스 홀더 역활을 하는 인풋박스 페이지 상단 검색 부분 ********************/


.textbox {position: relative; }
.textbox label {
  position: absolute;
  top: 1px;  /* input 요소의 border-top 설정값 만큼 */
  left: 1px;  /* input 요소의 border-left 설정값 만큼 */
  padding: 20px 0;   /* input 요소의 padding 값 만큼 */
  color: #111;
  cursor: text;
  text-align:center; 
  width: 100%;
  font-weight:300; 
}

.textbox_hov_eff{transition:.1s;  }
.textbox_hov_eff label{transition:.1s; }
.textbox_hov_eff #ex_input{transition:.1s; }
.textbox_hov_eff:hover label{color:#E70012; cursor:pointer;  }
.textbox_hov_eff:hover #ex_input{ border:1px solid #E70012;  }

.textbox input[type="text"],
.textbox input[type="password"] {
  width: 100%;  /* 원하는 너비 설정 */ 
  height: auto;  /* 높이값 초기화 */
  line-height : normal;  /* line-height 초기화 */
  padding: 15px 0; /* 원하는 여백 설정, 상하단 여백으로 높이를 조절 */
  border: 1px solid #eee;
  border-radius: 0;  /* iSO 둥근모서리 제거 */
  outline-style: none;  /* 포커스시 발생하는 효과 제거를 원한다면 */
  -webkit-appearance: none;  /* 브라우저별 기본 스타일링 제거 */
  -moz-appearance: none;
  appearance: none;
  background:#f7f7f7; 
  text-align:center; 
  font-weight:300; 
  color:#E70012; 
  font-size:1.5rem;
}

.textbox input[type="text"]:focus, .textbox input[type="password"]:focus {border: 1px solid #E70012;  background:#fff5f6; }

@media screen and (max-width: 767px) {
	.textbox label { padding: 10px 0; }
	.textbox input[type="text"], .textbox input[type="password"] {padding: 10px 0;  font-size:1.125rem; }
}




/******** 인풋 양식 ********/
input[readonly]{background-color:#F4F4F4;}
div.input_wrap{margin-bottom:20px;}
.input_plus_btn{ display:inline-block; width:calc(100% - 20% - 10px); }

form.public_form{}
	
	form.public_form label{display:block; margin-bottom:7px; font-weight:500;}
	form.public_form p.for_rela{position:relative; height:50px;}
	form.public_form .for_ab{position:absolute; top:50%; right:10px; transform:translateY(-50%); cursor:pointer; color:#E70012;}
	form.public_form span.dash{float:left; width:20px; line-height:50px; text-align:center;}
	form.public_form select{float:left; display:block; width:100%; height:50px; line-height:50px; padding:0 10px; border:1px solid #ddd; background: url(/ileschool/_images/common/select_arrow.png) no-repeat right center #fff;}
	form.public_form input{float:left; display:block; width:100%; height:50px; line-height:50px; padding:0 10px; border:1px solid #ddd;}
	form.public_form input[id=show_eye]+span.material-icons{position:absolute; top:50%; right:10px; transform:translateY(-50%); cursor:pointer;}
	form.public_form input[id=show_eye2]+span.material-icons{position:absolute; top:50%; right:10px; transform:translateY(-50%); cursor:pointer;}
	form.public_form input[type=search]+span.material-icons{position:absolute; top:50%; right:10px; transform:translateY(-50%); cursor:pointer; color:#E70012;}
	form.public_form button{float:left; display:block; height:50px; line-height:50px; }
	form.public_form button:hover{background:#111; color:#fff;}
	form.public_form sup{color:#e70012;}
	form.public_form small{clear:both; display:block; padding-top:7px; color:#e70012;}



h2.form_tit{padding:10px; background:#F9EEEF; font-weight:600; font-size:1.25rem; }
	h2.form_tit .material-icons{margin-right:10px; color:#e70012; font-size:1rem;}

@media screen and (max-width: 960px) {
	h2.form_tit{font-size:1rem;}
	form.public_form input{font-size:1rem;}
	form.public_form label{font-size:1rem;}
	form.public_form button{font-size:1rem;}
}

@media screen and (max-width: 479px) {
	.wd80p_10{width:100% !important; margin-bottom:10px;}
	.wd50p_10{width:100% !important;}
	.ml10{margin-left:0 !important;}
	form.public_form p.for_rela{height:30px;}
	form.public_form input{height:40px; line-height:40px; }
	form.public_form input:not(.wd33p_10) :not(.wd33p){width:100% !important; margin-bottom:10px;}
	form.public_form select{height:40px; line-height:40px; font-size:0.983rem; background-size:10px;}
	form.public_form span.dash{line-height:40px;}
	form.public_form button{width:100% !important; height:40px; line-height:40px;}
	

}

/* 기본 폼에서 글쓰기양식으로 변경 (label 100% 아닌경우)*/
form.write_form{}
	

@media screen and (max-width: 767px) {
	form.write_form .wd10p {width: 100% !important;}
	form.write_form .ml10 {margin-left: 0px !important;}
	form.write_form .wd90p_10 {width: 100% !important;}
	form.write_form .lineht40 {line-height:initial !important;}
}

/* 파일 다운로드 */
.downbox_wrap{display:flex; width:100%; justify-content:space-between; flex-wrap:nowrap; }
	.downbox_cont{width: calc(33.33333% - 10px); margin-right: 10px;}
	.downbox_cont:last-child{margin-right:0;}
		.downbox{margin-bottom:0 !important; padding:20px; border:1px solid #ddd; text-align:center;} 
			.downbox .tit{margin-bottom:20px;}
			.downbox a{padding:10px 30px; font-size:1rem; color:#111; background-color: #EEEEEE;}

@media screen and (max-width: 767px) {
	.downbox a{padding:10px 13px;}
		.downbox{min-height:18vh;} 
}

@media screen and (max-width: 700px) {	
	.downbox_wrap{display:block;}
	.downbox_cont{width: calc(50% - 5px);  margin:0; float:left}
	.downbox_cont:first-child{margin-right:10px;}
	.downbox_cont:last-child{width:100%; margin-top:10px;}
	.downbox .tit{font-size:0.9375rem;}

}

/* 첨부파일 */
.filebox .tit {display:block; margin-bottom:7px !important; font-weight:500; font-size:1.125rem;}
.filebox label {display: inline-block !important; vertical-align: middle; height: 50px; line-height:50px; background-color: #EEEEEE; cursor: pointer; text-align:center; }
/* 첨부파일 디폴트 없애기 */
div.filebox input[type="file"] {position: absolute; width: 0; height: 0; padding: 0; overflow: hidden; border: 0;}

@media screen and (max-width: 960px){
	.filebox .tit {font-size:1rem;}
}

@media screen and (max-width: 479px){
	.filebox .wd80p_10{width:100% !important;}
	.filebox label {width: 100% !important; height: 40px; line-height: 40px;}
}


/* 익스 디폴트 눈표시 제거 */
input[type="password"]::-ms-reveal,input[type="password"]::-ms-clear {display: none;}


/* 탈퇴 */
form.leave_wrap{width:63%; margin:0 auto;}

@media screen and (max-width: 1279px){
	form.leave_wrap{width:90%;}
}

/******* 체크박스 *******/
input[type='checkbox']{display:none;}
div.check_wrap{clear:both; padding-top:10px;}

input[type=checkbox]:checked + label span.checkmark {background-color: #E70012;  border:transparent;}
input[type=checkbox]:checked + label span.checkmark:after {
	position: absolute; top: 5px; left: 9px; border:solid 1px #fff;
	border-width: 0 3px 3px 0;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
}

.checkmark {display: inline-block; position: relative;  width: 24px; height: 24px;  margin:-5px 7px 0 0;vertical-align: middle; background-color: #fff;  border:1px solid #D5D6DB;  cursor: pointer;}
.checkmark:after {
	content: ""; display: block; position: absolute; top: 4px; left: 8px; width: 4px; height: 9px; border:solid 1px #D5D6DB;
	border-width: 0 3px 3px 0;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
}




/******* 하단 버튼 ******/
div.btn_bottom{display: flex; justify-content: center; clear:both; }
	div.btn_bottom button{float:left; display:block; height:50px; line-height:50px; }
	div.btn_bottom button:hover{background:#111; color:#fff;}
	div.btn_bottom button a{display:inline-block; width:100%; height:100%; color:#111;}
	div.btn_bottom button.bg_red a{color:#fff;}
	div.btn_bottom button:hover a{color:#fff;}


@media screen and (max-width: 960px) {
	div.btn_bottom button{width: 100% !important;}
	div.btn_bottom button a{font-size:1rem;}
}

@media screen and (max-width: 479px){
	div.ea3{display:block;}
	div.ea3 button{margin-top:10px !important;}
}

/******* 약관 *******/
div.term_wrap{margin-bottom:30px;}
.agree_text { height: 230px; padding: 0px 30px; overflow-y: auto; border: 1px solid #ddd;  white-space: pre-line; font-family:none; font-size:0.875rem; line-height: 20px;}
	
	.agree_text table{width:100%; text-align:center;}
	.agree_text table tr{}
	.agree_text table tr th{border:1px solid #111; background:#ddd;}
	.agree_text table tr td{border:1px solid #111; }


@media screen and (max-width: 479px){
	.agree_text{font-size:0.8rem; padding:0px 20px;}
}


/******* 인풋 검색 x 표시 제거 *******/
/* clears the ‘X’ from Internet Explorer */
input[type=search]::-ms-clear { display: none; width : 0; height: 0; }
input[type=search]::-ms-reveal { display: none; width : 0; height: 0; }
/* clears the ‘X’ from Chrome */
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration { display: none; }



@media screen and (max-width: 1919px) {
	/*  해당 스타일 입력 */
}

@media screen and (max-width: 1679px) {
	/*  해당 스타일 입력 */
}

@media screen and (max-width: 1439px) {
	/*  해당 스타일 입력 */
}

@media screen and (max-width: 1335px) {
	/*  해당 스타일 입력 */
}

/* 1280 이하 낮은 해상도의 PC (해상도 1024px ~ 1280px) */
@media screen and (max-width: 1279px) {
	/*  해당 스타일 입력 */
}

/* 낮은 행상도 PC, 테블릿 가로/세로 (해상도 768px ~ 1023px) */
@media screen and (max-width: 1023px) {
	/*  해당 스타일 입력 */
}

/* 모바일 가로, 테블릿 세로 (해상도 480px ~ 767px) */
@media screen and (max-width: 767px) {
	/*  해당 스타일 입력 */
}

/* 일반적인 모바일 세로 (해상도 ~ 479px) */
@media screen and (max-width: 479px) {
	/*  해당 스타일 입력 */
}


/* 20220516 바로바로게시판 답변시 문자발송 여부 체크박스 추가생성 */
label[for=baro_answer_send_chk]{display:inline-block !important; margin-bottom:0 !important; font-size:14px !important;}
#baro_answer_send_chk{
	-webkit-appearance: button;
    width: 17px;
    display: inline-block;
    height: 17px;
    line-height: 17px;
    float: none;
    cursor:pointer;
	margin-bottom:0;
}

/* 20250205 */
.frmSearchClass250205 {background: #f7f7f7; border: 1px solid #eee; width: fit-content;}
.frmSearchClass250205 form {display:flex; flex-direction: row; align-items: center;}
.frmSearchClass250205 select {margin-bottom:0 !important;}
.frmSearchClass250205 form >input {background: transparent; padding-left:20px;}
.btnRenew250205 {width:40px; height:100%; position:relative; text-align:center; cursor: pointer;}
.btnRenew250205 input {width:100%; height:100%; background: transparent; border: none; outline: none; position:absolute; top:50%; left:50%; transform: translate(-50%, -50%);  cursor: pointer;}
.btnRenew250205 .material-icons {margin-bottom:0;}

@media screen and (max-width:620px){
	.frmSearchClass250205 select { width: fit-content !important; min-width:120px; padding:10px 40px 10px 15px; background: url(/ileschool/_images/common/select_arrow.png) no-repeat 100% center #ffe009 !important;}
	.frmSearchClass250205 form >input {width:220px;}
	.btnRenew250205 {width:35px;}
}
@media screen and (max-width:480px){
	.frmSearchClass250205 form >input {width:150px;}
	.btnRenew250205 {width:35px;}
}
@media screen and (max-width:380px){
	.frmSearchClass250205 form >input {width:100px; padding-left:5px;}
	.btnRenew250205 {width:30px;}
	.btnRenew250205 .material-icons {font-size:22px;}
}