@charset "utf-8";
@import url("font.css");
/* style reset */

/*라디오박스*/
.radio_box {overflow: hidden; position: relative; float: left;}
input[type=radio] + label ,
input[type=checkbox] + label {display:inline-block;line-height:0;vertical-align:middle}
/* input[type=radio]:focus + label ,
input[type=checkbox]:focus + label {border:1px solid #000; } */
input[type=radio],
input[type=checkbox] {border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:0; }

.radio_box input[type=radio] + label {position:relative; display:inline-block; margin-right: 25px; padding:0 0 0 30px; color: #444; font-size: 15px; line-height:22px; cursor:pointer;}
.radio_box input[type=radio] + label:last-child {margin-right: 0;}
.radio_box input[type=radio] + label::after, .radio_box input[type=radio] + label::before {content: ''; position: absolute; border-radius: 22px;}
.radio_box input[type=radio] + label::after {left: 0; top: 0; width: 18px; height: 18px; border: 2px solid #d3d3d3;}
.radio_box input[type=radio] + label.on::before, .radio_box input[type=radio]:checked  + label::before {left: 6px; top: 6px; width: 10px; height: 10px; background-color: #1b1b1b;}


/*체크박스*/
.check_box {overflow: hidden; position: relative;}
.check_box input[type=checkbox] + label {position:relative; display:inline-block; padding-left: 30px; color: #333; font-size: 18px; font-weight: 500; line-height:24px; background-repeat: no-repeat; background-position: 0 0; background-image: url('/production/images/web/icon_check.png'); cursor:pointer;}
.check_box input[type=checkbox] + label.on, 
.check_box input[type=checkbox]:checked  + label {background-image: url('/production/images/web/icon_check_on.png');}
.check_box input[type=checkbox]:focus + label {border:1px solid #000; }


/*체크박스 sms수신동의*/
.tel .check_box.type2 { padding-left:25px; }
.check_box.type2 input[type=checkbox] + label {padding-left: 25px; color: #444; font-size: 15px; font-weight: 400; line-height: 18px; background-image: url('/production/images/web/icon_check2.jpg');}
.check_box.type2 input[type=checkbox] + label.on, .check_box.type2 input[type=checkbox]:checked  + label {background-image: url('/production/images/web/icon_check2_on.jpg');}

.optionbox, .inpbox {position: relative; float:left; height:35px; border:1px solid #e1e1e1; background-color: #fff;}
.optionbox::after {content: ''; position: absolute; right: 10px; top: 13px; width: 0; height: 0; border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 6px solid #7b736b;}
textarea {border:1px solid #e1e1e1;}
.calendarbox {overflow: hidden;}
.calendarbox .inpbox {overflow: hidden; position: relative;}
.calendarbox .inpbox input {width: calc(100% - 40px);}
.calendarbox .inpbox .ui-datepicker-trigger {position: absolute; right: 12px; top: 9px; width: 18px; height: 17px; background-image: url('/production/images/web/icon_calendar.png'); background-repeat: no-repeat; background-position: center center;}
.calendarbox .text {float: left; margin: 0 10px; font-weight: 500; line-height: 35px;}

/*목록 상단검색*/
.boardlist_top {position: relative; display: flex; justify-content: center; padding: 40px; margin-bottom: 35px; background-color: #fafafa;}
.boardlist_top .box {overflow: hidden; display: flex;}
.boardlist_top .box li {margin: 0 5px;}
.boardlist_top .box li .optionbox, .boardlist_top .box li .inpbox {height: 45px; border: 1px solid #e1e1e1;}
.boardlist_top .box li .optionbox {width: 150px;}
.boardlist_top .box li .optionbox::after {top: 19px; right: 20px; border-top: 5px solid #606060;}
.boardlist_top .box li .inpbox {width: 500px;}
.boardlist_top .box li .btn2 {margin-left: 10px; width: 110px;}

/*게시판(공지사항) 리스트*/
.boardlist {overflow:hidden; border-top: 2px solid #222;}
.boardlist table {width:100%; table-layout:fixed;}
.boardlist table tr {border-bottom: 1px solid #eee;}
.boardlist table thead tr {border-color: #9ba5af;}
.boardlist table thead tr th {padding: 15px 0;}
.boardlist table tbody tr td {padding: 15px 20px; text-align: center;}
.boardlist table tbody tr td a.title {display: flex; text-align: left; align-items: center;}
.boardlist table tbody tr td a.title span {overflow: hidden; max-width: calc(100% - 25px); text-overflow: ellipsis; white-space: nowrap; border-bottom: 1px solid transparent; -webkit-transition: 0.3s; -moz-transition: 0.3s; -ms-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s;}
.boardlist table tbody tr td a.title .new {margin-left: 5px; width: 20px; height: 20px;}
.boardlist table tbody tr td a span:hover {border-bottom: 1px solid #666;}
.boardlist .new .icon {position: relative; float: left; width: 20px; height: 20px; color: #fff; font-size: 12px; border-radius: 20px; background-color: #f26a5f;}
.boardlist .no_list {padding: 50px 0; text-align: center;}

/* 게시판(공지사항) 리스트 모바일 */
.boardlist_m { display:none; }
.boardlist_m li { border-bottom:1px solid #eee; padding:5px; }
.boardlist_m li a .btm span{margin-right:10px; font-size:14px; }
.boardlist_m li a .btm span:first-child{position:relative;padding-right:10px;}
.boardlist_m li a .btm span:first-child:before{content:'';position:absolute;right:0;top:4px;width:1px;height:14px;background-color:#999;}

/*하단 버튼*/
.button_box {overflow: hidden; position: relative; margin-top: 30px; display: flex; justify-content: center;}
.button_box button {margin: 0 5px;}
.button_box button:last-child {margin-right: 0;}
.button_box a {margin: 0 5px; text-align:center; line-height:55px; }
.button_box a:last-child {margin-right: 0;}
.button_box.right {margin-top: 10px; justify-content: flex-end;}
.button_box.right button {margin: 0 0 0 10px;}
.button_box .button_right {position: absolute; right: 0; top: 0;}
.button_box .button_left {position: absolute; left: 0; top: 0;}


/*페이징*/
.paging {overflow:hidden; display: flex; justify-content: center; margin-top: 25px; text-align: center;}
.paging * {-webkit-transition: 0.3s; -moz-transition: 0.3s; -ms-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s;}
.paging .box {display: flex;}
.paging .box .list {display: flex; margin: 0 4px;}
.paging .box .list a {margin: 0 1px; width: 33px; color:#707070; text-align:center; line-height: 33px; font-weight: 500; border: 1px solid transparent;}
.paging .box .list a:hover, .paging .box .list a.active {color: #378ef7; border-color: #368ef6;}
.paging .box .list .all {display: none;}
.paging .box button {margin: 0 3px; width: 33px; height: 33px; background-repeat: no-repeat; background-position: 50%; opacity: 0.5;}
.paging .box button:hover {opacity: 1;}
.paging .box button.btn-paging1 {background-image:url('/production/images/web/paging_arrow1.png');}
.paging .box button.btn-paging2 {background-image: url('/production/images/web/paging_arrow2.png');}
.paging .box button.pre {transform: rotate(180deg);}

/*일반게시판 상세*/
.board_detail {position: relative; width: 100%; border-top: 2px solid #222;}
.board_detail > div, .board_detail > ul {border-bottom: 1px solid #e4e4e4;}
.board_detail .title_box {padding: 25px 20px 20px;}
.board_detail .title_box .title {width: 100%; color: #333; font-size: 24px; text-align: center; font-weight: 600; line-height: 32px;}
.board_detail .title_box .list {overflow: hidden; display: flex; justify-content: center; margin-top: 25px;}
.board_detail .title_box .list li {position: relative; margin-right: 60px; font-size: 15px; line-height: 18px;}
.board_detail .title_box .list li:last-child {margin-right: 0;}
.board_detail .title_box .list li:last-child::after {display: none;}
.board_detail .title_box .list li::after {content: ''; position: absolute; right: -30px; top: 2px; width: 1px; height: 14px; background-color: #d6d6d6;}
.board_detail .content {padding: 20px;}
.board_detail .file {padding: 20px;}
.board_detail .file li {margin-bottom: 2px; line-height: 22px;}
.board_detail .file li:last-child {margin-bottom: 0;}
.board_detail .file li a {padding-right: 25px; font-size: 15px; background-image: url('/production/images/web/icon_file.png'); background-repeat: no-repeat; background-position: right top 3px;}

/*게시판 글쓰기 타입1-일반글쓰기*/
.boardwrite {margin: 0 auto; width: 100%; border-top: 2px solid #222;}
.boardwrite.answer {margin-top: -1px;}
.boardwrite table { width: 100%; word-break: keep-all;}
.boardwrite tbody tr {border-bottom: 1px solid #e4e4e4;}
.boardwrite tbody tr th {padding: 15px 20px; color: #444; text-align: left; background-color: #f9f9f9;}
.boardwrite tbody tr th .point {position: relative;}
.boardwrite tbody tr th .point lable b { font-weight:600; font-size: 0.9em; display: inline-block; }
.boardwrite tbody tr th .point::after {content: '*'; position: relative; left: 5px; top: 3px; color: #f60505; font-weight: 400;}
.boardwrite tbody tr td {padding: 12px 15px;}
.boardwrite tbody tr td .inpbox {width: 430px;}
.boardwrite tbody tr td .inpbox input::-webkit-input-placeholder { color:#666 !important; }

.boardwrite tbody tr td .inpbox.full {width: 100%;}
.boardwrite tbody tr td .optionbox {width: 200px;}
.boardwrite tbody tr td .optionbox select {text-align-last: center; -ms-text-align-last: center; -moz-text-align-last: center; -o-text-align-last: center; -webkit-text-align-last: center;}
.boardwrite tbody tr td textarea {height: 200px;}
.boardwrite tbody tr td .text {padding-top: 3px; float: left;}
.boardwrite tbody tr td .point_txt {padding-top: 3px; float: left;}
.boardwrite tbody tr td .ex_text {padding-top: 3px; float: left; color: #757575; font-size: 14px;}
.boardwrite tbody tr td.table {padding: 0;}
.boardwrite tbody tr td.table thead tr {border-bottom: 1px solid #e4e4e4 !important;}
.boardwrite tbody tr td.table tr:last-child {border-bottom: 0;}
.boardwrite tbody tr td.table th {text-align: center; border-left: 1px solid #e4e4e4;}
.boardwrite tbody tr td.table td {text-align: center; border-left: 1px solid #e4e4e4;}
.boardwrite tbody tr td .address1 {margin-bottom: 10px;}
.boardwrite tbody tr td .address1 .inpbox {width: 200px;}
.boardwrite tbody tr td .address1 .btn3 {margin-left: 10px;}
.boardwrite tbody tr td .address2 {display: flex; justify-content: space-between;}
.boardwrite tbody tr td .address2 .inpbox {width: calc(100% - 410px);}
.boardwrite tbody tr td .calendarbox {position: relative; float: left;}
.boardwrite tbody tr td .calendarbox .inpbox {width: 180px;}
.boardwrite tbody tr td .calendarbox .inpbox input {width: 140px;}
.boardwrite tbody tr td .calendarbox .ui-datepicker-trigger {position: absolute; right: 0; width: 40px; height: 33px; top: 0; right: 0; background-color: #f5f5f5; background-repeat: no-repeat; background-position: 50%; background-image: url('/production/images/web/icon_calendar.png');}
.boardwrite tbody tr td .tel {}
.boardwrite tbody tr td .tel .optionbox {width: 110px;}
.boardwrite tbody tr td .tel .inpbox {width: 110px; margin-left: 10px;}
.boardwrite tbody tr td .tel .inpbox input.txt {text-align: center;}
.boardwrite tbody tr td .birthday {}
.boardwrite tbody tr td .birthday .optionbox {margin-right: 10px; width: 110px;}
.boardwrite tbody tr td .btn3 { display:inline-block; text-align:center; line-height:35px; }

.boardwrite td>table .btn4 { height:35px; margin-left:10px; }
.boardwrite td>table .btn4::after { top:16px; }

.boardwrite .attachment-file-edit {overflow:hidden; margin-top:10px;}
.boardwrite .attachment-file-edit:first-child {margin-top:0}
.boardwrite .attachment-file {position:relative; overflow: hidden;}
.boardwrite .attachment-file span.inpbox {float: left; position:relative; width: 500px;}
.boardwrite .attachment-file span.ipfile {overflow: hidden; position: relative; float: left; margin-left: 10px; width: 80px; height: 35px;}
.boardwrite .attachment-file span.ipfile input[type="file"] {overflow: hidden; position:absolute; width: 1px; height: 1px; margin: -1px; cursor: pointer;}
.boardwrite .attachment-file span.ipfile input.file {position:absolute; z-index:5; /*width:100%; height:100%;*/width:0; height:0; opacity:0; filter:alpha(opacity=0); cursor:pointer;}
.boardwrite .attachment-file span.ipfile em,
.boardwrite .attachment-file span.ipfile label  {position: absolute; z-index: 2; display: block; left: 0; top: 0; color: #fff; width:100%; height:100%; text-align:center; background:#6b6e7b; line-height:35px; font-size: 12px; cursor:pointer; font-family: 'Dotum'; font-style: normal; border-radius: 3px;}
.boardwrite .attachment-file span.ipfile input.file:focus + label {border:2px solid #000;line-height:31px;}
.boardwrite .attachment-file a.ipfile {overflow: hidden; position: relative; float: left; margin-left: 10px; width: 80px; height: 35px;}
.boardwrite .attachment-file a.ipfile input[type="file"] {overflow: hidden; position:absolute; width: 1px; height: 1px; margin: -1px; cursor: pointer;}
.boardwrite .attachment-file a.ipfile input.file {position:absolute; z-index:5; width:100%; height:100%; opacity:0; filter:alpha(opacity=0); cursor:pointer;}
.boardwrite .attachment-file a.ipfile em {position: absolute; z-index: 2; display: block; left: 0; top: 0; color: #fff; width:100%; height:100%; text-align:center; background:#6b6e7b; line-height:35px; font-size: 12px; cursor:pointer; font-family: 'Dotum'; font-style: normal; border-radius: 3px;}
.boardwrite .attachment-file-edit > button {margin-left: 10px; float: left;}

/*상세보기 일반 테이블(세로)*/
.tablebasic {border-top: 2px solid #222; word-break: keep-all;}
.tablebasic table {width:100%; table-layout:fixed;}
.tablebasic table tr {border-bottom: 1px solid #e4e4e4;}
.tablebasic table thead tr {border-bottom: 1px solid #929bac;}
.tablebasic table tr th {padding: 10px 0; color: #444; text-align: center; background-color: #fafafa; border-right: 1px solid #e4e4e4;}
.tablebasic table tr th:last-child {border-right: 0;}
.tablebasic table tr td {padding: 10px 20px; text-align: center; border-right: 1px solid #e4e4e4;}
.tablebasic table tr td:last-child {border-right: 0;}
.tablebasic table tr td.th {font-weight: 500;}

/*게시판 E*/

/* 반응형 - media qurey 시작 */
/* 넓이가 1240px 이하일 때*/
@media all and (max-width:1240px){
	.boardlist table { table-layout:auto; }
	.boardlist_top { display:inline-block; width:100%; }
	.boardlist_top .box { display:inline-block; width:100%; }
	.boardlist_top .box .select { float:left; width:14%; }
	.boardlist_top .box li { margin:0; }
	.boardlist_top .box li .optionbox { width:96%; }
	.boardlist_top .box .input { float:left; width:54%; }
	.boardlist_top .box li .inpbox { width:78%; } 		 
	.boardlist_top .box li .btn2 { width:20%; float:left; margin-left:0; }	
}
/* 넓이가1040px 이하일 때*/
@media all and (max-width:1040px){
	.board_detail .content p img { width:100%; }
}
/* 넓이가 950px 이하일 때*/
@media all and (max-width:950px){
	.boardlist_top .box .input { float:none; width:100%; clear:both; }
	.boardlist_top .box li .inpbox { margin-top:5px; }
	.boardlist_top .box li .btn2 { margin-top:5px; }
	.boardlist_top .box .select { width:18%; }
	.boardlist table tbody tr th {word-break:keep-all;  }
	.boardlist table tbody tr td { padding:10px; word-break:break-all;  }
	.outline_list > li.text { width:100px; height:100px; padding-top:40px; }
	.outline_list > li.icon1 { background-position: center top 22px; }
	.outline_list > li.icon2 { background-position: center top 16px; }
	.outline_list > li.icon3 { background-position: center top 23px; }
	.outline_list > li.icon4 { background-position: center top 23px; }
	.outline_list > li.icon5 { background-position: center top 23px; }
}

/* 넓이가 850px 이하일 때 */ 
@media all and (max-width:850px){	
	.outline_list { flex-direction:column; }
	.outline_list > li.icon1,
	.outline_list > li.icon2,
	.outline_list > li.icon3,
	.outline_list > li.icon4,
	.outline_list > li.icon5 { background-position:left 15px center; }
	.outline_list > li.text { padding:0 10px 0 45px; display:flex; justify-content:flex-start; align-items:center; width:250px; height:40px; margin: 10px 0; }
	.outline_list > li.text p { display:block; height:auto; }
	.outline_list > li.arrow { align-items:center; }
	.outline_list > li.arrow .icon { width:20px; transform: rotate(90deg); }
	.outline_list > li.arrow .icon::before { right:6px; }
	.outline_list > li.arrow .icon::after { width:13px; }
	.outline_list > li.arrow .icon.reverse { transform:rotate(270deg); }
	.outline_list > li.arrow .txt { padding-left:5px; }
	.outline_list > li.arrow.pt38 { padding-top:0 !important; }	
	.outline_list > li.icon1 { background-size:15px; }
	.outline_list > li.icon2 { background-size:21px; }
	.outline_list > li.icon3 { background-size:22px; }
	.outline_list > li.icon4 { background-size:20px; }
	.outline_list > li.icon5 { background-size:21px; }
	.tablebasic table tr th,
	.tablebasic table tr td { padding:5px; word-break:break-all; }
}
/* 넓이가 800px 이하일 때*/
@media all and (max-width:800px){
	.boardlist_top { padding:20px; }
	.boardlist table thead tr th { padding:10px 0; font-size:15px; }
	.boardlist table tbody tr td { font-size:14px; padding:5px; }	
	.optionbox select { font-size:14px; }
	.boardlist_top .box li .btn2 { font-size:14px; }	
	.boardwrite tbody tr th,
	.boardwrite tbody tr td { padding:10px; font-size:14px; }
	input.parsley-error, 
	select.parsley-error, 
	textarea.parsley-error { font-size:14px; }
	.boardwrite .attachment-file span.inpbox { width:80%; }
}
/* 넓이가 767px 이하일 때*/
@media all and (max-width:767px){
	.boardlist_pc { display:none; }
	.boardlist_m { display:block; }
	.board_detail .title_box .title { font-size:21px; word-break:keep-all; }
	.boardwrite tbody tr #repre_nm_txt span { display:block; padding-left:0 !important; margin-top:5px; }
}
/* 넓이가 670px 이하일 때*/
@media all and (max-width:670px){
	.boardwrite tbody tr td .ex_text { float:none; clear:both; width:100%; margin-left:0 !important; display:block; }
	/* .boardwrite tbody tr td .inpbox { float:none; } */
	.boardwrite tbody tr td .text { display:none; }
}
/* 넓이가 640px 이하일 때*/
@media all and (max-width:640px){
	.boardlist_top .box .select { width:25%; }
	.optionbox select { padding:0 10px; }
	.boardlist_top .box li .optionbox::after { right:10px; }
	.paging .box button { width:25px; height:25px; }
	.paging .box button.btn-paging1 { background-size:25px; }
	.paging .box button.btn-paging2 { background-size:25px; }
	.paging .box .list { height:25px; }
	.paging .box .list a { width:25px; line-height:22px; }
	.check_box input[type=checkbox] + label { font-size:16px; background-position:left center; background-size:20px; padding-left:25px; }	
	.boardwrite tbody tr td .inpbox { width:100%; }
	.boardwrite tbody tr td .address2 .inpbox { width:calc(100% - 310px); }
	.boardwrite tbody tr td .address2 .inpbox.w400 { width: 300px !important; }
	.tel .check_box.type2 { padding-left:0; clear:both; padding-top:5px; }
}
/* 넓이가 600px 이하일 때*/
@media all and (max-width:600px){
	/* .board_detail .title_box .list { display:inline-block; width:100%; border-top: 1px dashed rgba(0,0,0,0.2); padding-top: 10px; }
	.board_detail .title_box .list li { line-height: 21px; font-size:14px; line-height:20px; margin-right:0; } */
	.board_detail .title_box .list li { font-size:13px; margin-right:20px; }
	.board_detail .title_box .list li::after { right:-10px; }
	.board_detail .title_box { padding:15px 10px 15px; }	
	.board_detail .title_box .list { margin-top:5px; }
	.boardwrite tbody tr th, 
	.boardwrite tbody tr td { padding:5px; }	 
	.boardwrite .attachment-file span.inpbox { width:70%; }
}
/* 넓이가 520px 이하일 때*/
@media all and (max-width:520px){
	.boardlist_top { padding:10px; margin-bottom:25px; }
	.boardlist_top .box li .optionbox, 
	.boardlist_top .box li .inpbox { height:35px; }	
	.optionbox select { font-size:13px; }
	.btn2 { height:35px; }
	.boardlist_top .box li .btn2 { font-size:13px; min-width:20%; }
	.boardlist table thead tr th { font-size:13px; }
	.boardlist table tbody tr td { font-size:13px; }
	.paging .box .list a { font-size:13px; }
	.paging .box .list:nth-last-of-type(1),
	.paging .box .list:nth-last-of-type(2),
	.paging .box .list:nth-last-of-type(3) { display:none; }	
	.boardwrite tbody tr th, 
	.boardwrite tbody tr td { font-size:13px; } 
	input.parsley-error, select.parsley-error, 
	textarea.parsley-error { font-size:13px; }
	.point_txt { font-size:13px; }
}
/* 넓이가 450px 이하일 때*/
@media all and (max-width:450px){
	.board_detail .title_box .list { display:inline-block; width:100%; }
	.board_detail .title_box .list li { float:left; width:50%; margin-right:0; }
	.board_detail .title_box .list li::after { display:none; }
	.board_detail .content,
	.board_detail .file { padding:10px; }	
	.board_detail .file li,
	.board_detail .content li { word-break:keep-all; }
	.boardwrite tbody tr th { word-break:auto-phrase; } 
	.boardwrite tbody tr td .tel .optionbox { width:30%; }
	.boardwrite tbody tr td .tel .inpbox { width:30%; }
}
/* 넓이가 400px 이하일 때*/
@media all and (max-width:400px){
	.boardlist_top .box .select { width:33%; }
	.boardlist_top .box li .btn2 { padding:0 10px; }
	.paging .box .list:nth-last-of-type(4),
	.paging .box .list:nth-last-of-type(5) { display:none; }	 
}
/* 넓이가 350px 이하일 때*/
@media all and (max-width:350px){
	.button_box2 { display:inline-block;  width:100%; text-align:center; margin-top:0; }
	.button_box2 button { margin:2px 0; }	
	.button_box2 .btn_download { min-height:auto; }
}