@import url('/sites/guide/style/css/w_guide.css');
@import url('/Web-home/fnct/bbs/bbs_common/css/board_common.css');

.state-button ul {display: flex;}
.state-button li {margin-right: 1rem;}
.state-button a {display: flex; justify-content: center; align-items: center; height: 6rem; padding: 0 3rem; border: .1rem solid #6e92c7; font-family: pm; font-size: 1.8rem; color: #6e92c7 !important;}
.state-button .on a {background: #032e6e; border: .1rem solid #032e6e; color: #fff !important;}

.short-url {margin-bottom: 2rem;}
.short-url a {display: inline-flex; align-items: center; height: 2.5rem; padding: 0 1.6rem; background: #0064ef; font-family: pm; font-size: 1.4rem; color: #fff !important;}
.short-url a span {position: relative; top: -.1rem;}

.box-poll {display: flex; justify-content: space-between; align-items: flex-end;}
.box-poll .poll {font-family: pm; font-size: 1.6rem; color: #0064ef;}

@media screen and (max-width: 800px) {
	.box-poll {flex-direction: column; align-items: flex-start;}
}

.poll-agree .agree-box {margin-top: 5rem; padding: 3rem; background: #f5f5f5;}
.poll-agree .agree-box .text {overflow: auto; max-height: 19rem; margin-bottom: 4rem; padding-right: 2rem; font-family: pm; font-size: 1.6rem; color: #666666;}
.poll-agree .agree-box .text::-webkit-scrollbar {width: 1rem; height: 1rem;}
.poll-agree .agree-box .text::-webkit-scrollbar-thumb {background: #666465;}
.poll-agree .agree-box .text::-webkit-scrollbar-track {background-color: #ffffff;}
.poll-agree .agree-box .subject {padding-top: 3rem; border-top: 1px solid #e2e2e2;}
.poll-agree .agree-box .subject strong {font-family: pb; font-size: 1.8rem; color: #333333;}
.poll-agree .agree-box .subject p {margin-top: .8rem; font-family: pm; font-size: 1.8rem; color: #666666;}
.poll-agree .agree-ok {margin-top: 3rem;}

@media screen and (max-width: 800px) {
	.poll-agree .agree-box .subject strong {font-size: 1.7rem;}
	.poll-agree .agree-box .subject p {font-size: 1.7rem;}
}

.poll-question {border-top: .1rem solid #000;}
.poll-question.view {border-top: .1rem solid #e2e2e2;}
.poll-question .row {border-bottom: .1rem solid #000;}
.poll-question .info {padding: 5rem 5rem  4rem 5rem;}
.poll-question .info.solo {padding-bottom: .5rem;}
.poll-question .info .subject1 {display: flex; align-items: center; margin-bottom: 1rem; font-family: pb; font-size: 2.4rem; color: #000000;}
.poll-question .info .subject2 {display: flex; align-items: center; margin-bottom: .5rem; font-family: pm; font-size: 1.8rem; color: #666666;}
.poll-question .info .text {font-family: pm; font-size: 1.8rem; color: #666666;}
.poll-question .info .must {display: flex; position: relative; left: 1rem; top: .1rem; width: 1rem; height: 1rem; background: url('../images/ic-must.png') no-repeat center / cover; text-indent: -9999rem;}

.poll-question .attachment {padding: 2rem 5rem; margin-bottom: 5rem; background: #f1f6fa; border-bottom: 0}
.poll-question .attachment li {display: flex; align-items: center; justify-content: space-between;}
.poll-question .attachment a,
.poll-question .attachment .no-file {display: inline-block; padding: 1rem 0 1rem 3.5rem; background: url('../images/ic-file.png') no-repeat left center; font-family: pr; font-size: 1.5rem; color: #333333;}
.poll-question .attachment a.docView {display: inline-flex; justify-content: center; align-items: center; height: 3.3rem; padding: 0 1.5rem; background: #fff; border: 1px solid #cdcdcd; border-radius: .5rem; font-size: 1.4rem; color: #888888;}
.poll-question .attachment a.docView:hover {background-color: #eef7fd; border: .1rem solid #049edb; color: #049edb !important;}
.poll-question .attachment a.docView::before {content: ''; width: 1.8rem; height: 1.8rem; margin-right: 1rem; background: url('../images/ic-doc-view.png') no-repeat center;}
.poll-question .attachment a.docView:hover::before {filter: invert(53%) sepia(60%) saturate(834%) hue-rotate(156deg) brightness(89%) contrast(93%);}
.poll-question .attachment span {position: relative;}
.poll-question .attachment span::after {content: ''; position: absolute; left: 0; bottom: -.2rem; width: 0; height: 1px; background: #000; transition: width .35s;}
.poll-question .attachment a:hover span::after {width: 100%;}

.poll-question .row {border-bottom: .1rem solid #000;}
.poll-question .poll {padding: 0 5rem 5rem 5rem;}
.poll-question .poll-type1 {display: flex; align-items: center; width: 100%; height: 6.5rem; padding: 0 2rem; border: 1px solid #cccccc; font-family: pm; font-size: 1.6rem; color: #222;}
.poll-question .poll-type1::placeholder {color: #999999;}
.poll-question .poll-type1:disabled {color: #999999;}
.poll-question .poll-type2 {display: flex; align-items: center; width: 100%; height: 32.5rem; padding: 2rem; border: 1px solid #cccccc; font-family: pm; font-size: 1.6rem; color: #222;}
.poll-question .poll-type2::placeholder {color: #999999;}
.poll-question .poll-type2:disabled {color: #999999;}
.poll-question .box-radio li {margin: 1rem 0;}

.poll-question .file-add .line {display: flex; align-items: center;}
.poll-question .file-add .file-name {display: flex; width: 100%; max-width: 40rem; height: 4rem; margin-right: 1rem; padding: 0 2rem; background: #f9f9f9; border: 1px solid #bcbcbc; font-family: pm; font-size: 1.4rem; color: #333333;}
.poll-question .file-add .atchmnBtns {display: flex; align-items: center;}
.poll-question .file-add .atchbtn {margin-right: 1rem;}
.poll-question .file-add .atchbtn input {display: flex; height: 4rem; padding: 0 1.5rem; border-radius: .5rem; font-family: pm; font-size: 1.4rem;}
.poll-question .file-add .atchbtn.add input {background: #666465; color: #fff;}
.poll-question .file-add .atchbtn.del input {background: #3f4f71; color: #fff;}
.poll-question .file-add .possible {margin-top: 1rem; font-family: pm; font-size: 1.4rem; color: #888888;}

@media screen and (max-width: 800px) {
	.poll-question .info {padding: 3rem 3rem 2rem 3rem;}
	.poll-question .info .subject1 {font-size: 2.2rem;}
	.poll-question .info .text {font-size: 1.7rem;}
	.poll-question .attachment {margin-bottom: 3rem; padding: 2rem 3rem;}
	.poll-question .poll {padding: 0 3rem 3rem 3rem;}
}

.board-table {position: relative; border-top: 2px solid #003377;}
.board-table::after {content: ''; position: absolute; right: 0; top: 0; width: .1rem; height: 100%; background: #fff;}
.board-table .col-num {width: 10%;}
.board-table .col-title {width: auto;}
.board-table .col-end {width: 25%;}
.board-table .col-date {width: 12%;}
.board-table thead th {padding: 1.8rem 0; background: #fafafa; border-bottom: .1rem solid #dcdcdc; border-right: .1rem solid #dcdcdc; font-family: psb; font-size: 1.8rem; font-weight: normal; color: #121212;}
.board-table tbody tr:hover {background: #f1f6fa;}
.board-table tbody td {height: 6rem; padding: 0 2rem; border-bottom: .1rem solid #dcdcdc; border-right: .1rem solid #dcdcdc; font-family: pm; font-size: 1.8rem; text-align: center; color: #444444;}
.board-table tbody td.td-num {color: #666;}
.board-table tbody td.td-title {text-align: left; color: #000;}
.board-table tbody td.td-title a {display: flex; align-items: center; color: #000;}
.board-table tbody td.td-title strong {overflow: hidden; position: relative; display: -webkit-inline-box; line-clamp: 1; -webkit-line-clamp: 1; -webkit-box-orient:vertical;}
.board-table tbody td.td-state .p1 {display: block;text-align: center;width: 8rem;height: 3rem;margin: 0 auto;background: #0a4da1;font-size: 1.6rem;font-family: pm;color: #fff;line-height: 3rem;}
.board-table tbody td.td-state .p2 {display: block;text-align: center;width: 8rem;height: 3rem;margin: 0 auto;background: #a6a6a6;font-size: 1.6rem;font-family: pm;color: #fff;line-height: 3rem;}
.boardWrap .title strong {line-height: 30px; background: linear-gradient(to bottom, transparent 98%, rgba(0,0,0,1) 0) left center no-repeat; background-size:0; transition: background-size .5s;}
.board-table tbody td.td-title strong::after {content: ''; position: absolute; left: 0; bottom: 0; width: 0; height: .1rem; background: #121212; transition: width .35s;}
.board-table tbody td.td-title a:hover strong::after {width: 100%;}
.board-table .notice-title {position: relative; top: .5rem; display: inline-flex; width: 2.5rem; height: 2rem; background: url('../../bbs_common/images/ic-notice.png') no-repeat center; text-indent: -9999rem;}
.board-table .new {flex-shrink: 0; position: relative; top: -.1rem; display: inline-flex; width: 2.1rem; height: 2.1rem; margin-left: 1rem; background: url('../../bbs_common/images/ic-new.png') no-repeat center; text-indent: -9999rem;}
.board-table .lock {flex-shrink: 0; position: relative; top: -.1rem; display: inline-flex; width: 1.4rem; height: 2.1rem; margin-left: 1rem; background: url('../../bbs_common/images/ic-secret.png') no-repeat center; text-indent: -9999rem;}
.board-table .is-file {position: relative; top: .3rem; display: inline-flex; width: 2.1rem; height: 2.7rem; background: url('../../bbs_common/images/ic-file.png') no-repeat center;}

@media screen and (max-width: 1100px) {
	.board-table thead {display: none;}
	.board-table,
	.board-table tbody {display: block; width: 100%;}
	.board-table tbody tr {position: relative; display: flex; flex-wrap: wrap; width: 100%; padding: 2rem 0; border-bottom: .1rem solid #d1d1d1;}
	.board-table tbody td {display: flex; flex-wrap: wrap; align-items: center; height: auto; border: 0;}
	.board-table tbody td.td-title {flex-grow: 1; width: 100%; margin: .5rem 0; font-size: 1.8rem;}
	.board-table tbody td.td-end,
	.board-table tbody td.td-date {padding-right: 1rem; color: #666;}

	.board-table tbody td.td-end::before {content: '설문기간 :'; padding-right: 1rem;}
	.board-table tbody td.td-date::before {content: '작성일 :'; padding-right: 1rem;}

	.board-table tbody td.td-title a {flex-wrap: wrap;}
	.board-table tbody td.td-title strong {width: 100%;}
	.board-table tbody td.td-title strong::after {display: none;}
}


.cm-check {position: relative;}
.cm-check input {position: absolute !important; opacity: 0;}
.cm-check span {display: inline-block; position: relative; font-size: 1.8rem; color: #666666; font-family: pm; letter-spacing: 0;}
.cm-check span::before {content: ""; position: absolute;}

.cm-check.style1 span {padding-left: 3rem; line-height: 3rem;}
.cm-check.style1 span::before {width: 2rem; height: 2rem; border: .1rem solid #dddddd; left: 0; top: .6rem; border-radius: .3rem; background: #fff;}
.cm-check.style1 input:checked + span::before {border-color: #049edb;}
.cm-check.style1 input:checked + span::after {content: ''; position: absolute; left: 0; top: 0.6rem; width: 2rem; height: 2rem; background: url('../images/ic-check.png') no-repeat center / 1.2rem;}
.cm-check.style1 input:checked + span {color: #049edb;}
.cm-check.style1 input:disabled + span::after {background: url('../images/ic-check-off.png') no-repeat center / 1.2rem;}
.cm-check.style1 input:disabled + span::before {background: #f3f3f3; border-color: #b5b5b5;}
.poll .cm-check.style1 input:checked + span {color: #666666;}

.cm-radio {position: relative;}
.cm-radio input {position: absolute !important; opacity: 0;}
.cm-radio span {display: inline-block; position: relative; font-size: 1.8rem; color: #666666; font-family: pm; letter-spacing: 0;}
.cm-radio span::before {content: ""; position: absolute;}

.cm-radio.style1 span {padding-left: 2.7rem; line-height: 3rem;}
.cm-radio.style1 span::before {width: 2rem; height: 2rem; border: .1rem solid #dddddd; left: 0; top: .6rem; border-radius: 100%; background: #fff;}
.cm-radio.style1 input:focus + span::before {border-color: #049edb;}
.cm-radio.style1 input:checked + span::after {content: ''; position: absolute; left: .6rem; top: 1.2rem; width: .8rem; height: .8rem; background: #049edb; border-radius: 100%;}
.cm-radio.style1 input:checked + span {color: #f3f3f3;}
.cm-radio.style1 input:disabled + span::after {background: #b5b5b5;}
.cm-radio.style1 input:disabled + span::before {background: #f3f3f3; border-color: #b5b5b5;}
.poll .cm-radio.style1 input:checked + span {color: #666666;}

@media screen and (max-width: 800px) {
	.view .txt {font-size: 1.7rem;}
}
