.entry select { border:1px solid #ddd; font-size:15px; height:40px; color:#555; width:100%; padding:0 5px; }
.entry textarea { width:100%; }

/* 체크박스 */
input.checkbox_input {display: none}
input.checkbox_input + label.checkbox_label {position: relative;padding-left: 25px;display: inline-block;line-height: 16px;height: 15px;padding-left: 20px}
input.checkbox_input + label.checkbox_label:after {content:"";position: absolute;display: inline-block;width: 15px;height: 15px;border: 1px solid #ccc;cursor: pointer;top: 1px;left: 0;border-radius: 4px}
input.checkbox_input:checked + label.checkbox_label:after {background: #000;background: url(/resource/www/bbsctt/def/img/checkbox_icon.png)center center no-repeat #356edc;border-color: #356edc}

/* radio */
input[type="radio"].input_radio,
input[type="checkbox"].input_radio {display: none}
input[type="radio"].input_radio + label.radio_label,
input[type="checkbox"].input_radio + label.radio_label {position: relative;padding-left: 30px;display: inline-block;margin-right: 30px;padding: 3px 0 3px 30px;}
input[type="radio"].input_radio + label.radio_label:last-child,
input[type="checkbox"].input_radio + label.radio_label:last-child {margin-right: 0}
input[type="radio"].input_radio + label.radio_label:after,
input[type="checkbox"].input_radio + label.radio_label:after {content: ""; display: inline-block;width: 22px;height: 22px;background: url(/resource/www/bbsctt/def/img/s_no_check.png)center center no-repeat;cursor: pointer;position: absolute;top: 5px;left: 0;border-radius: 100%;}
input[type="radio"].input_radio:checked + label.radio_label:after,
input[type="checkbox"].input_radio:checked + label.radio_label:after {background: url(/resource/www/bbsctt/def/img/s_checked.png)center center no-repeat;}

@media only screen and (max-width:1023px) {
	input[type="radio"].input_radio + label.radio_label, input[type="checkbox"].input_radio + label.radio_label {font-size: 16px;}
}
@media only screen and (max-width:767px) {
	input[type="radio"].input_radio + label.radio_label, input[type="checkbox"].input_radio + label.radio_label {font-size:15px;}
}

/*** 게시판 리스트 ***/
.board_box .sorting {margin-bottom: 10px}
.board_box .sorting:after {content:"";display: block;clear: both}
.board_box .sorting strong {display: block;float: left;font-size: 16px;font-weight: 400;height: 40px;line-height: 38px}
.board_box .sorting strong > span {font-weight: 600;color: #0050bf}
.board_box .sorting .search_box {float: right}
.board_box .sorting .search_box select {vertical-align: top;border: 1px solid #ddd;height: 40px;width: 120px;padding: 0 5px}
.board_box .sorting .search_box input[type="text"] {vertical-align: top;border: 1px solid #ddd;height: 40px;padding: 0 5px;width: 280px}
.board_box .sorting .search_box button {height: 40px;width: 40px;font-size: 0;background: url(/resource/www/bbsctt/def/img/search_icon.png)center center no-repeat #0050bf}
.board_box .board table {border-top: 2px solid #0050bf;width: 100%}
.board_box .board table thead tr {}
.board_box .board table thead tr th {text-align: center;padding: 14px 5px;border-bottom: 1px solid #ddd;font-size: 18px;color: #222;font-weight: 500}
.board_box .board table tbody tr td {text-align: center;padding: 12px  0;border-bottom: 1px solid #ddd;color: #666;font-size: 16px;font-weight: 300}
.board_box .board table tbody tr td:nth-child(2) {text-align: left;color: #333;font-size: 17px;font-weight: 400}
.board_box .board table tbody tr td a {display: block;}

.paging {display:table;margin:40px auto 0;}
.paging a {display:inline-block;border:1px solid #ccc;color:#666;height:40px;width:40px;text-align:center;line-height:38px;font-size:16px;position:relative;margin-right:7px}
.paging a:last-child {margin-right:0}
.paging a.on {color:#0050bf;border-color:#0050bf}
.paging a.prev_page, .paging a.next_page {font-size:0;}
.paging a.prev_page:before {content:"";position:absolute;width:10px;height:1px;background:#777;top:15px;left:14px;transform:rotate(-45deg)}
.paging a.prev_page:after {content:"";position:absolute;width:10px;height:1px;background:#777;top:22px;left:14px;transform:rotate(45deg)}
.paging a.next_page:before {content:"";position:absolute;width:10px;height:1px;background:#777;top:15px;right:14px;transform:rotate(45deg)}
.paging a.next_page:after {content:"";position:absolute;width:10px;height:1px;background:#777;top:22px;right:14px;transform:rotate(-45deg)}

@media only screen and (max-width:767px) {
	.board_box .board table colgroup col + col + col + col {display:none}
	.board_box .board table thead tr + tr + tr {display:none}
	.board_box .board table thead tr th + th + th + th {display:none}
	.board_box .board table tbody tr td + td + td + td {display:none}
}



/*** 게시판 상세글 ***/
.board_box .board_view {width: 100%;}
.board_box .board_view .title {border-top: 2px solid black;background: #fafafa;padding: 40px 30px}
.board_box .board_view .title > strong {font-size: 24px;font-weight: 600}
.board_box .board_view .title > ul {margin-top: 20px;}
.board_box .board_view .title > ul li {display: inline-block;margin-right: 15px;font-size: 16px;color: #6b6b6b}
.board_box .board_view .title > ul li:last-child {margin-right: 0}
.board_box .board_view .title > ul li > strong {display: inline-block;margin-right: 15px;position: relative;font-weight: 500}
.board_box .board_view .title > ul li > strong:after {content:"";position: absolute;width: 1px;height: 10px;background: #777;top: 8px;right: -9px;}
.board_box .board_view .title > ul li > em {display: inline-block;vertical-align: top;font-weight: 300;color:#717171;}

.board_box .board_view .file {border: 1px dashed #ccc;padding: 15px 25px;margin-top: 10px}
.board_box .board_view .file strong {color: #717171;font-weight: 500;display: inline-block;width: 80px;position: relative;}
.board_box .board_view .file strong:after {content:"";position: absolute;width: 1px;height: 12px;top: 6px;right: 0;background: #999}
.board_box .board_view .file .file_list {display: inline-block;vertical-align: top;padding-left: 20px;}
.board_box .board_view .file .file_list li a {display: block;font-size: 15px;color: #6b6b6b}
.board_box .board_view .content {width: 100%;padding: 15px;}
.board_box .board_view .content img {max-width:100%; height: auto !important;}
.board_box .board_view .btn_box {float: right}

.board_box .board_view .comment {background: #fafafa;padding: 30px}
.board_box .board_view .comment > strong {color: #333;font-weight: 600;font-size: 18px;}
.board_box .board_view .comment > strong span {color: #284c90}
.board_box .board_view .comment > ul {margin-top: 30px;}
.board_box .board_view .comment > ul > li {padding: 25px 0;border-top: 1px solid #ddd;position: relative}
.board_box .board_view .comment > ul > li strong {font-size: 16px;color:#555}
.board_box .board_view .comment > ul > li p {font-size: 16px;color:#555}
.board_box .board_view .comment > ul > li span {font-size: 15px;color: #989898;margin-top: 10px;display: block;}
.board_box .board_view .comment > ul > li .comment_btn {position: absolute;top: 25px;right: 0; }
.board_box .board_view .comment > ul > li .comment_btn > ul > li {display: inline-block;;font-size: 15px;margin-right: 20px;position: relative}
.board_box .board_view .comment > ul > li .comment_btn > ul > li:after {content:"";position: absolute;right: -11px;top:8px;width: 1px;height: 9px;background:#999}
.board_box .board_view .comment > ul > li .comment_btn > ul > li:last-child:after {display: none}
.board_box .board_view .comment > ul > li .comment_btn > ul > li a {padding-left: 25px;color: #777}
.board_box .board_view .comment > ul > li .comment_btn > ul > li a.reply {background: url(/resource/www/bbsctt/def/img/reply_icon.png)left center no-repeat}
.board_box .board_view .comment > ul > li .comment_btn > ul > li a.revise {background: url(/resource/www/bbsctt/def/img/revise_icon.png)left center no-repeat}
.board_box .board_view .comment > ul > li .comment_btn > ul > li a.delete {background: url(/resource/www/bbsctt/def/img/delete_icon.png)left center no-repeat}
.re_comment {padding-left: 35px;padding-top: 25px;border-top: 1px dashed #ddd;position: relative}
.re_comment:before {content:"";position: absolute;width: 25px;height: 25px;top: 25px;left: 0;background: url(/resource/www/bbsctt/def/img/re_comment.png)center center no-repeat}
.re_comment li input[type="text"] {width: 100%;border: 1px solid #ddd;height: 80px;margin-top: 10px;}
.re_comment li .btn {margin-top: 10px;}
.re_comment li .btn a {display: inline-block;font-size: 14px;width: 88px;text-align: center;padding: 6px 0;}
.board_box .board_view .comment .write {}
.board_box .board_view .comment .write > input[type="text"] {border: 1px solid #ddd;width: 100%;height: 143px;}
.board_box .board_view .comment .write > div {background: #fff;border: 1px solid #ddd;border-top: 0;}
.board_box .board_view .comment .write > div::after {content: "";display: block;clear: both}
.board_box .board_view .comment .write > div .secret {float: left;padding: 10px}
.board_box .board_view .comment .write > div .secret > input[type="password"] {border: 1px solid #ddd;height: 28px;margin-left: 15px;}
.board_box .board_view .comment .write > div > a {float: right;display: block;height: 48px;text-align: center;width: 110px;line-height: 45px}

/* 태블릿 */
@media only screen and (max-width:1023px) {
	.board_box .board table thead tr th {font-size: 17px;}
	.board_box .board table tbody tr td {font-size: 15px;}
	.board_box .board table tbody tr td:nth-child(2) {font-size: 16px;}
	
	.board_box .board_view .title {padding: 30px}
	.board_box .board_view .title > strong {font-size: 22px}
	.board_box .board_view .title > ul {margin-top: 15px;}
	.board_box .board_view .title > ul li {font-size: 15px;}
	.board_box .board_view .file strong {font-size: 16px;}
	
	.board_box .board_view .comment > ul > li {padding: 20px 0}
	.board_box .board_view .comment > ul > li .comment_btn {top: 20px}
	.re_comment {padding-top: 20px;margin-top: 20px;}
	.re_comment:before {top: 20px}
	.board_box .board_view .comment .write > input[type="text"] {height: 120px}
	.board_box .board_view .comment .write > div > a {font-size: 16px;line-height: 46px}
}

/* 모바일 */
@media only screen and (max-width:767px) {
	.paging a {width: 35px;height: 35px;line-height: 32px;font-size: 14px;margin-right: 5px;margin-bottom: 5px}
	
	.paging a.prev_page:before {top: 13px;left: 12px}
	.paging a.prev_page:after {top: 20px;left: 12px}
	.paging a.next_page:before {right: 12px;top: 13px}
	.paging a.next_page:after {right: 12px;top: 20px}
}


@media only screen and (max-width:560px) {
	.board_box .sorting strong {display: block;float: inherit;}
	.board_box .sorting .search_box {float: inherit;width: 100%;display: block;}
	.board_box .sorting .search_box select {width: 100%;margin-bottom: 3px}
	.board_box .sorting .search_box input[type="text"] {width: calc(100% - 19%)}
	.board_box .sorting .search_box button {width: calc(100% - 82%)}
	
	.board_box .board table thead tr th {font-size: 16px;padding: 10px 5px}
	.board_box .board table tbody tr td {font-size: 14px;padding: 8px 0}
	.board_box .board table tbody tr td:nth-child(2) {font-size: 15px;}
	
	.board_box .board_view .title {padding: 20px}
	.board_box .board_view .title > strong {font-size: 20px}
	.board_box .board_view .title > ul {margin-top: 10px;}
	.board_box .board_view .title > ul li {font-size: 14px;}
	.board_box .board_view .file strong {font-size: 15px;}
	.board_box .board_view .file .file_list li a {font-size: 14px;}
	
	.board_box .board_view .comment {padding: 20px;}
	.board_box .board_view .comment > strong {font-size: 16px;}
	.board_box .board_view .comment > ul {margin-top: 20px;}
	.board_box .board_view .comment > ul > li {padding: 15px 0}
	.board_box .board_view .comment > ul > li .comment_btn {position: relative;top: 0;margin-top: 10px;}
	.board_box .board_view .comment > ul > li .comment_btn ul li a {font-size: 14px;padding-left: 20px}
	.board_box .board_view .comment > ul > li .re_comment {padding-top: 15px;margin-top: 15px;}
	.board_box .board_view .comment > ul > li .re_comment:before {top: 15px}
	.board_box .board_view .comment > ul > li strong, .board_box .board_view .comment > ul > li p {font-size: 15px;}
	.board_box .board_view .comment > ul > li span {font-size: 14px;margin-top: 5px}
	.board_box .board_view .comment .write > input[type="text"] {height: 80px}
	.board_box .board_view .comment .write > div .secret {padding: 7px}
	.board_box .board_view .comment .write > div .secret label.checkbox_label {font-size: 16px;}
	.board_box .board_view .comment .write > div > a {height: 38px;font-size: 15px;line-height: 36px;width: 80px}
}

@media only screen and (max-width:460px) {
	.board_box .board table thead tr th + th + th + th {display: none;}
	.board_box .board table tbody tr td + td + td + td {display: none;}
} 

/* 입력 폼 - 공통 */
.input_form {position:relative;border-top:2px solid #222;margin-top:40px}
.input_form .input {border-bottom:1px solid #ddd;display:table;width:100%; position:relative;padding:15px 5px}
.input_form .input > label, .input_form .input > strong {display:table-cell;vertical-align:middle;width:22%;font-size:18px;font-weight:500;}
.input_form .input > label > span, .input_form .input > strong > span {color:#ff5454}
.input_form .input .entry em {color: #444;font-size: 17px;border: 1px solid #ddd;display: inline-block;width: 512px;vertical-align: top;padding: 0 15px;background: #f9f9f9;height:50px;line-height:48px;vertical-align: top}
.input_form .input .entry {width:100%;}
.input_form .input .entry input[type="text"],
.input_form .input .entry input[type="password"] {border:1px solid #ddd;height:50px;width:100%;vertical-align:top;font-size:17px;padding:0 15px;display:inline-block}
.input_form .input .entry button {height:50px;width:185px;background:#0a1f48;color:#fff;font-size:16px;margin-left:3px;vertical-align: top}
.input_form .input .entry textarea {width: 100%;border: 1px solid #ddd;resize: none;height: 500px}
.input_form .input .entry .file_list {display: block;width: 100%}
.input_form .input .entry .file_list li {display: block;border: 1px solid #ddd;padding: 15px;margin-top: 10px;position: relative}
.input_form .input .entry .file_list li:after {content:"";display: block;clear: both}
.input_form .input .entry .file_list li img {display: inline-block;vertical-align: top}
.input_form .input .entry .file_list li > div {display: inline-block;vertical-align: top;margin-left: 5px;}
.input_form .input .entry .file_list li div strong {display: block;font-size: 16px;font-weight: 500}
.input_form .input .entry .file_list li div span {font-size: 14px;display: block;margin-top: 2px}
.input_form .input .entry .file_list li .file_delete {display: block;float: right;width: 50px;height: 50px;background: url(/resource/www/bbsctt/def/img/file_delete.png)center center no-repeat #36383c;font-size: 0;position: absolute;right: 15px;top: 15px;}
.input_form .input .entry .file_list .percent {position: relative;width: 30%;text-align: center;float: right;margin-right: 70px;margin-top: 7px}
.input_form .input .entry .file_list .percent strong {font-size: 14px;font-weight: 400}
.input_form .input .entry .file_list .percent > div {display: block;width: 100%;height: 5px;border-radius: 250px;background: #ddd}
.input_form .input .entry .file_list .percent > div > span {height: 5px;background: #6d95e0;border-radius: 250px;}

@media only screen and (max-width:1023px) {
	.input_form .input > label, .input_form .input > strong {font-size:17px;padding-right:20px;word-break: keep-all;}
	.input_form .input .entry em {font-size:16px;width: 70%}

	.input_form .input .entry input[type="text"], .input_form .input .entry input[type="password"] {width:70%;font-size:16px;}
	.input_form .input .entry button {width:29.4%}
	
	.input_form .input .entry .file_list {width:100%}

}

@media only screen and (max-width:767px) {
	.input_form .input {padding:15px 5px;}
	.input_form .input > label, .input_form .input > strong {display:block; width:100%;margin-bottom:10px;font-weight:600}
	
	.input_form .input .entry em {height: 45px}
	.input_form .input .entry input[type="text"],
	.input_form .input .entry input[type="password"] {width:100%;height:45px}
	.input_form .input .entry button {width:29.3%;font-size:15px;height:45px}
}

@media only screen and (max-width:560px) {
	.input_form .input .entry em {width: 100%}
	.input_form .input .entry button {width:100%;margin-left:0;margin-top:4px;font-size:14px;}
	
	.input_form .input .entry .file_list .percent {width: 100%;margin: 6px 0 0;}
	.input_form .input .entry .file_list .percent:before {height: 20px;line-height: 21px;font-size: 13px;}
	.input_form .input .entry .file_list .percent:after {height: 20px}
}

/* faq */
.faq {border-top: 2px solid black}
.faq .faq_list {border-bottom: 1px solid #ddd;position: relative;}
.faq .faq_list:before {content:"";position: absolute;width: 15px;height: 2px;background: #000;top: 53px;right: 40px;transform: rotate(45deg)}
.faq .faq_list:after {content:"";position: absolute;width: 15px;height: 2px;background: #000;top: 53px;right: 30px;transform: rotate(-45deg)}
.faq .faq_list .title a {padding: 25px 30px;display: block;}
.faq .faq_list .title a > strong {font-size: 22px;font-weight: 500}
.faq .faq_list .title a > ul {margin-top: 10px;}
.faq .faq_list .title a > ul:after {content:"";display: block;clear: both}
.faq .faq_list .title a > ul > li {float: left;margin-right: 20px;font-size: 16px;color: #777}
.faq .faq_list .title a > ul > li:last-child {margin-right: 0}
.faq .faq_list .title a > ul > li strong {display: inline-block;vertical-align: top;margin-right: 15px;position: relative;font-weight: 500}
.faq .faq_list .title a > ul > li strong:after {content:"";position: absolute;width: 1px;height: 10px;background: #888;top: 8px;right: -9px;}
.faq .faq_list .title a > ul > li em {display: inline-block;vertical-align: top}
.faq .faq_list .content {background: #f9f9f9;padding: 20px 30px;display: none}
.faq .faq_list .content p {background: #fff;border: 1px solid #ddd;padding: 15px}
.faq .faq_list.on .content {display: block;}
.faq .faq_list.on:before {content:"";position: absolute;width: 15px;height: 2px;background: #000;top: 53px;right: 40px;transform: rotate(-45deg)}
.faq .faq_list.on:after {content:"";position: absolute;width: 15px;height: 2px;background: #000;top: 53px;right: 30px;transform: rotate(45deg)}

@media only screen and (max-width:1023px) {
	.faq .faq_list .title a {padding: 20px 20px}
	.faq .faq_list .title a > strong {font-size: 20px;}
	.faq .faq_list .title a > ul > li {font-size: 15px;}
	
	.faq .faq_list:before,
	.faq .faq_list:after,
	.faq .faq_list.on:before,
	.faq .faq_list.on:after {top: 50px;}
}
@media only screen and (max-width:767px) {
	.faq .faq_list .title a {padding: 20px 75px 20px 20px }
	.faq .faq_list .title a > strong {font-size: 20px;}
	.faq .faq_list .title a > ul > li {font-size: 15px;}
	
	.faq .faq_list:before,
	.faq .faq_list:after,
	.faq .faq_list.on:before,
	.faq .faq_list.on:after {top: 50px;}
}

@media only screen and (max-width:767px) {
	.faq .faq_list .title a {padding: 15px 55px 15px 15px }
	.faq .faq_list .title a > strong {font-size: 18px;}
	.faq .faq_list .title a > ul {margin-top: 5px}
	.faq .faq_list .title a > ul > li {font-size: 14px;}
	
	.faq .faq_list:before,
	.faq .faq_list:after,
	.faq .faq_list.on:before,
	.faq .faq_list.on:after {top: 41px;}
	
	.faq .faq_list:before,
	.faq .faq_list.on:before {right: 25px}
	
	.faq .faq_list:after,
	.faq .faq_list.on:after {right: 15px}
	
}
























