@charset "utf-8";

/* 별양동 동장인사말 */
#conts .greeting[data-name="byulyang"] {background:url('/csc/img/content/03/greeting_bg0101.png') no-repeat right top;}

/* 탭이 있는 콘텐츠 :  설문조사 */
#conts .contTab {margin:50px 0 10px;}
#conts .contTab ul:after {content:''; clear:both; display:table;}
#conts .contTab li {width:20%;float:left;padding: 1.5rem 0.5rem;border: 1px solid #226bc7;border-right-width:0;color: #226bc7;text-align:center;cursor : pointer;}
#conts .contTab li:last-child,
#conts .contTab li.bo-right {border-right-width:1px;}
#conts .contTab li.on {background: #226bc7;color:#fff;}
#conts .contTab li:nth-child(-n+3) {border-bottom-width:0;}
#conts .contWrap {height: auto;overflow: hidden;}
#conts .contWrap > div {}
#conts .contWrap dl{display:table; table-layout: fixed; width:100%; border-bottom:1px solid #ddd; padding:1.5rem; line-height:1.5; }
#conts .contWrap dl:last-child {border-bottom:none; padding-bottom:30px;}
#conts .contWrap dt{display:table-cell; width:15%; color:#32766f; }
#conts .contWrap dd{display:table-cell; width:100%; }
#conts .contWrap dd em { display:block; color:#777; font-weight:300;}

#conts .contTab .col-3 li {width:33.333%;}

@media all and (max-width:1024px) {
	#conts .contWrap dt{width:20%; }
	#conts .contTab .col-3 > li:nth-child(3) {margin-top : 0 !important;}
}

@media all and (max-width:640px) {
	#conts .contTab li,
	#conts .contTab .col-3 li {width:50%;}
	#conts .contWrap dl {display:block; padding:1.5rem 0;}
	#conts .contWrap dt,
	#conts .contWrap dd { display:block; width:100%; }
	#conts .contWrap dt br {display:none;}
	#conts .contTab li.bo-right {border-right-width:0px;}
	#conts .contTab li:nth-child(even) {border-right-width:1px;}
	#conts .contTab li:nth-child(-n+13) {border-bottom-width:0;}
	#conts .contTab li:last-child {border-right-width:1px;}

	#conts .contTab .col-3 > li:nth-child(1), #conts .contTab .col-3 > li:nth-child(2), #conts .contTab .col-3 > li:nth-child(3) {margin-top:0 !important;}
}

@media all and (max-width:480px) {
	#conts .contWrap {padding:1.5rem;}
	#conts .contTab li,
	#conts .contTab .col-3 li {width:100%; border-right-width:1px !important;}
	#conts .contTab li:nth-child(-n+14) {border-bottom-width:0;}
}




/* ======================= 설문조사 ======================= */

#conts .bod_poll {padding:40px 30px; border-bottom:1px solid #ddd;}
#conts .bod_poll > ul > li {position:relative; display:inline-block; width:30.6666%; margin:0 4% 4rem 0;}
#conts .bod_poll > ul > li:nth-child(3n) {margin-right:0;}
#conts .bod_poll  ul  li:hover {-webkit-box-shadow:none; box-shadow:none; border:1px solid #ddd;}

#conts .bod_poll > ul > li.no_data {width:100%; text-align:center; background:#fff;  border:none; border-radius:0;}

#conts .bod_poll .stateWrap li {display:inline-block; padding:8px 15px; border-radius:5px;}
#conts .bod_poll .stateWrap li.state {border:1px solid #f65237; background:#f65237; color:#fff;}
#conts .bod_poll .stateWrap li.result {border:1px solid #0a9799; color:#0a9799;}

#conts .bod_poll .thumb {width:100%; margin-right:0; }
#conts .bod_poll .thumb img {width:100%;}
#conts .bod_poll .cont {width:100%;}
#conts .bod_poll .cont .tit {font-size:2.4rem; font-weight:700; margin:2rem 0 0;}
#conts .bod_poll .cont .date {color:#777;}
#conts .bod_poll .cont .count {padding-top:25px; margin-top:25px; border-top:1px solid #ddd; text-align:right;}
#conts .bod_poll .cont .count em {position:relative;font-size:1.5em; color:#0a9799 ; font-family:'Montserrat'; font-weight:700; padding-left:30px;}
#conts .bod_poll .cont .count em:before {content:''; width:21px; height:22px; position:absolute; left:0; top:3px; background:url('../img/common/ico_poll.png') no-repeat; }
#conts .bod_poll .btnWrap {display:none; opacity:0; position:absolute; top:0; left:0; width:100%; height:100%; text-align:center; background:rgba(0,0,0,0.7); border-radius:10px;}
#conts .bod_poll .btnWrap .state_poll {position:relative; width:auto; height:auto; right:auto; padding: 1.5rem 3rem; background:none; border:1px solid #fff;}
#conts .bod_poll .btnWrap .state_poll:before {content:none;}

#conts .bod_poll li:hover .btnWrap {display:block; opacity:1;}
#conts .bod_poll li:hover .btnWrap .state_poll {border-radius:5px;}

#conts .poll_view .tit {border:none; border-top:2px solid #333; border-bottom:1px solid #333; text-align:center; border-radius:0; font-size:3.0rem; color:#333; font-weight:700;}
#conts .poll_view .s-txt {margin:30px 0; background:#f8f8f8; border-radius:10px; padding:5rem 3rem;}
#conts .poll_view .s-txt figure {margin-bottom:30px;}

#conts .poll_view .s-tit {font-size:2.4rem; font-weight:700; color:#216cda; margin-top:50px;}
#conts .poll_view .agreeWrap {border:1px solid #ddd; border-radius:10px; padding:3rem 5rem; margin:20px 0 40px; line-height:1.5;}
#conts .poll_view .agreeWrap dl {display:table; width:100%; table-layout:fixed;}
#conts .poll_view .agreeWrap dl dt,
#conts .poll_view .agreeWrap dl dd {display:table-cell; width:100%; float:none; padding:1.5rem 1rem 1.0rem; border-bottom:1px dotted #ddd;}
#conts .poll_view .agreeWrap dl dt {width:15%;  border-bottom:1px solid #216cda; padding:1.5rem 0 1.0rem; font-weight:700;}
#conts .poll_view .agreeWrap .exp {margin:20px 0; text-align:center;}
#conts .poll_view .agreeWrap .choose {padding:2rem 1rem; border-top:1px solid #ddd; background:#f8f8f8; text-align:center;}
#conts .poll_view .agreeWrap .choose input[type="radio"] {margin-top:-3px;}

@media all and (max-width:1024px) {
	#conts .poll_view .agreeWrap dl dt {width:30%; }

	#conts .bod_poll > ul > li {width:48%;}
	#conts .bod_poll > ul > li:nth-child(3n) {margin-right:4%;}
	#conts .bod_poll > ul > li:nth-child(even) {margin-right:0;}
}

@media all and (max-width:700px) {
	#conts .poll_view .agreeWrap {padding:2rem 3rem;}
	#conts .poll_view .agreeWrap dl dt {width:40%; }

	#conts .bod_poll > ul > li {width:100%;}
}

@media all and (max-width:550px) {
	#conts .poll_view .agreeWrap .choose span {display:block; margin-bottom:10px;}
}

@media all and (max-width:400px) {
	#conts .poll_view .agreeWrap {padding:1.5rem 1rem;}
	#conts .poll_view .agreeWrap dl {display:block;}
	#conts .poll_view .agreeWrap dl dt {display:block; width:100%; border-bottom:0; padding:1.5rem 0 0rem;}
	#conts .poll_view .agreeWrap dl dd {display:block; padding:0.5rem 0 1.0rem;}
	#conts .poll_view .agreeWrap .exp br {display:none;}
	#conts .poll_view .agreeWrap .choose span {display:block; margin-bottom:10px;}
}