@charset "utf-8";

/*******************************************************

	설문조사 CSS Document
	IEETU Web Standardization Team
	2020-08-10

*******************************************************/

/* 설문조사 */
.section_talk{position:relative; margin:20px 0 0;}
.section_talk .top{margin:0 0 30px; padding:10px; border:1px solid #e3e3e3; background:#f7f7f7;}
.section_talk .top:after{content:''; display:block; clear:both;}
.section_talk .top .count_area .num{color:#ee2e2e;}
.section_talk .top .count_area{float:left; font-size:14px; line-height:40px;}
.section_talk .top .view_type_area{float:right; margin:0;}
.section_talk .top .view_type_area:after{content:''; display:block; clear:both;}
.section_talk .top .view_type_area select{float:left; height:36px; border-radius:0; margin-top:3px;}
.section_talk .top .view_type_area .tab_view{float:left; margin-top:3px;}
.section_talk .top .view_type_area .tab_view li{float:left; margin-left:3px;}
.section_talk .top .view_type_area .tab_view li a{display:inline-block; box-sizing:border-box; padding:0 5px; border:1px solid #ccc; background:#fff; line-height:34px; letter-spacing:-1px;}
.section_talk .top .view_type_area .tab_view li a.on{border-color:#ee2e2e; color:#ee2e2e;}
.section_talk .top .view_type_area .area_date{float:left; clear:both;}
.section_talk .lst_talk{margin:10px 0 0;}
.section_talk .lst_talk > li{position:relative; margin:0 0 10px; padding:10px; padding-top:20px; line-height:1.5; border:1px solid #ddd; background:#fff; transition: 0.4s cubic-bezier(0.65, 0.05, 0.36, 1);}
.section_talk .lst_talk > li.end{background:#f3f3f3; height:auto; border-radius:0; line-height:1.5; display:block; width:100%;}
.section_talk .lst_talk > li a{display:block;}
.section_talk .lst_talk .profile_area .profile{float:left; overflow:hidden; width:25px; height:25px; margin:0 5px 0 0; border-radius:50%;}
.section_talk .lst_talk .profile_area .profile img{width:100%;}
.section_talk .lst_talk .profile_area .name{display:block; float:left; margin:4px 0 0; font-weight:600; letter-spacing:-1px;}
.section_talk .lst_talk .profile_area .date{display:block; float:left; margin:4px 0 0 8px; color:#767676;}
.section_talk .lst_talk .prog_area{margin:0 0 15px;}
.section_talk .lst_talk .prog_area span{display:inline-block; height:32px; padding:0 20px; border-radius:32px; background:#ee2e2e; font-weight:600; line-height:32px; color:#fff; text-align:center;}
.section_talk .lst_talk > li.end .prog_area span{background:#7c7c7c;}
.section_talk .lst_talk .share_area{display:none; position:absolute; top:20px; right:10px;}
.section_talk .lst_talk .share_area .btn_share{display:inline-block; width:32px; height:32px; background-position:0 -130px;}
.section_talk .lst_talk .box_share{display:none; position:absolute; z-index:10; top:60px; left:-1px; right:-1px; padding:20px 0; border:1px solid #333; background:#fff;}
.section_talk .lst_talk .box_share ul:after{content:''; display:block; clear:both;}
.section_talk .lst_talk .box_share ul li{float:left; width:20%; text-align:center;}
.section_talk .lst_talk .box_share ul li a{display:block;}
.section_talk .lst_talk .box_share ul li a .sp_sns{display:block; width:34px; height:34px; margin:0 auto;}
.section_talk .lst_talk .box_share ul li a .twitter{background-position:0 0;}
.section_talk .lst_talk .box_share ul li a .facebook{background-position:-40px 0;}
.section_talk .lst_talk .box_share ul li a .katalk{background-position:-80px 0;}
.section_talk .lst_talk .box_share ul li a .kastory{background-position:-120px 0;}
.section_talk .lst_talk .box_share ul li a .band{background-position:-160px 0;}
.section_talk .lst_talk .box_share ul li a .tit{display:block;margin:10px 0 0;font-size: 11px;letter-spacing: -0.5px;}
.section_talk .lst_talk .title{margin:0 0 10px; font-weight:400; font-size:20px; letter-spacing:-2px; word-break:normal;}
.section_talk .lst_talk .desc{display:-webkit-box; display:none; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:2; -webkit-box-orient:vertical; height:40px; line-height:20px;}
.section_talk .lst_talk .like_area{position:relative; margin:20px 0 10px;}
.section_talk .lst_talk .like_area:after{content:''; display:block; clear:both;}
.section_talk .lst_talk .like_area .like_txt{display:block; float:left; padding:0 0 0 5px; font-weight:600; font-size:12px; color:#ee2e2e; letter-spacing:-1px;}
.section_talk .lst_talk .like_area .like_txt:before{display:none; content:''; width:13px; height:12px; margin:2px 3px 0 0; background-position:-30px -100px; vertical-align:top;}
.section_talk .lst_talk .like_area .cmt{float:right; font-size:12px;}
.section_talk .lst_talk .like_area .cmt:before{display:none; content:''; width:13px; height:13px; margin:1px 3px 0 0; background-position:-50px -100px; vertical-align:top;}

/* 설문조사 상세보기 */
.talk_view_article{margin-top:20px; padding:15px; border:1px solid #d6d6d6; /*border-top:3px solid #61646c;*/}
.talk_view_article .talk_view_head{position:relative;}
.talk_view_article .talk_view_head .head_title{border-bottom:1px solid #141414;}
.talk_view_article .talk_view_head .head_title .prog{display:inline-block; height:32px; padding:0 20px; border-radius:32px; background:#ee2e2e; line-height:32px; text-align:center; color:#fff;}
.talk_view_article .talk_view_head .head_title .headline{margin:10px 0; padding-right:40px; font-size:16px;}
.talk_view_article .talk_view_head .head_info{position:relative; padding:10px 0; border-bottom:1px solid #ccc; font-size:12px; line-height:16px;}
.talk_view_article .talk_view_head .head_info:after{content:''; display:block; clear:both;}
.talk_view_article .talk_view_head .head_info .profile{float:left; width:40px; height:40px; margin:0 5px 0 0;}
.talk_view_article .talk_view_head .head_info .profile img{width:100%;}
.talk_view_article .talk_view_head .head_info .name{display:block; margin:4px 0 0; font-weight:600;}
.talk_view_article .talk_view_head .head_info .vote_dpt{float:left;}
.talk_view_article .talk_view_head .head_info .vote_date{float:left;}
.talk_view_article .talk_view_head .head_info .vote_count{float:right; color:#ee2e2e;}
.talk_view_article .talk_view_head .head_info .vote_count em{font-weight:600;}
.talk_view_article .talk_view_head .head_info .vote_count:before{content:''; display:inline-block; overflow:hidden; width:33px; height:33px; margin:0 5px 0 0; background:url(../images/vote/sp_com2.png) no-repeat 0 -170px; vertical-align:middle; color:transparent !important; white-space:nowrap;}
.talk_view_article .talk_view_head .head_info .date {margin-right:12px;}
.talk_view_article .talk_view_head .head_info .term {position:absolute; right:0; top:30px;}
.talk_view_article .talk_view_head .head_info .term em {font-size:14px; padding-right:9px; margin-right:3px; position:relative; letter-spacing:-0.6px;}
.talk_view_article .talk_view_head .head_info .term em:before {content:''; display:block; width:1px; height:12px; background:#d2d2d2; position:absolute; right:0; top:4px;}
.talk_view_article .talk_view_head .head_info .term strong {font-size:14px;}
.talk_view_article .talk_view_head .head_info .hash_tag {position:relative; top:-11px;}
.talk_view_article .talk_view_head .head_info .hash_tag a {display:inline-block; padding:5px 10px; font-weight:bold; color:#ee2e2e; border:1px solid #ee2e2e; border-radius:50px;}
.talk_view_article .talk_view_head .share_area {display:none; position:absolute; top:0; right:0;}
.talk_view_article .talk_view_head .share_area .btn_share{display:inline-block; width:32px; height:32px; background-position:0 -130px;}
.talk_view_article .talk_view_head .box_share{display:none; position:absolute; z-index:10; top:40px; right:0px; width:300px; padding:20px 0; border:1px solid #333; background:#fff;}
.talk_view_article .talk_view_head .box_share ul:after{content:''; display:block; clear:both;}
.talk_view_article .talk_view_head .box_share ul li{float:left; width:20%; text-align:center;}
.talk_view_article .talk_view_head .box_share ul li a{display:block;}
.talk_view_article .talk_view_head .box_share ul li a .sp_sns{display:block; width:34px; height:34px; margin:0 auto;}
.talk_view_article .talk_view_head .box_share ul li a .twitter{background-position:0 0;}
.talk_view_article .talk_view_head .box_share ul li a .facebook{background-position:-40px 0;}
.talk_view_article .talk_view_head .box_share ul li a .katalk{background-position:-80px 0;}
.talk_view_article .talk_view_head .box_share ul li a .kastory{background-position:-120px 0;}
.talk_view_article .talk_view_head .box_share ul li a .band{background-position:-160px 0;}
.talk_view_article .talk_view_head .box_share ul li a .tit{display:block;margin:10px 0 0;font-size: 12px;letter-spacing: -0.5px;}
.talk_view_article .talk_view_body{padding:20px 0;}
.talk_view_article .talk_view_like{margin:20px 0; text-align:right;}
.talk_view_article .talk_view_like .btn_like{display:inline-block; position:relative; padding:10px; border:1px solid #888; border-radius:5px; color:#ee2e2e; box-shadow:0 1px 1px rgba(0,0,0,.2);}
.talk_view_article .talk_view_like .btn_like span{display:inline-block; padding:0 10px; border-left:1px solid #ccc; font-weight:600; font-size:14px; line-height:21px;}
.talk_view_article .talk_view_like .btn_like:before{content:''; width:23px; height:21px; margin:0 10px 0 0; background-position:0 -100px; vertical-align:top;}
.talk_view_article .talk_view_attfile{margin:20px 0; padding-top:20px; border-top:1px solid #ccc;}
.talk_view_btn{position:relative; margin:20px 0; text-align:center;}
.talk_view_btn:after{content:''; display:block; clear:both;}
.talk_view_btn .btn_talk{display:inline-block; box-sizing:border-box; height:32px; padding:0 20px; border:1px solid #888888; border-radius:30px; font-weight:600; font-size:14px; line-height:32px;}
.talk_view_btn .btn_talk.darkgray{border:0; background:#4c4847; color:#fff;}
.talk_view_btn .btn_talk.pink{border:0; background:#ee2e2e; color:#fff;}

/*설문조사 상세페이지  */
.talk_view_article .fund_box .conLst2{margin:12px 0 20px;}
.talk_view_article .fund_box .conLst2 li::before{position:relative; top:0; vertical-align:middle;margin:-3px 8px 0 -13px; display:inline-block;}

/* 설문조사 참여하기 */
.talk_view_article .vp_step01_head{margin:0 0 10px; text-align:center;}
.talk_view_article .vp_step01{margin:10px 0 0; padding:20px; background:#f8f8f8;}
.talk_view_article .vp_step01 dl dt{position:relative; min-height:22px; margin:10px 0 0; padding:0 0 0 35px;}
.talk_view_article .vp_step01 dl dt:before{content:''; display:inline-block; position:absolute; top:0; left:0; width:27px; height:22px; background-position:-110px -120px;}
.talk_view_article .vp_step01 dl dd{margin:10px 0 20px;}
.talk_view_article .vp_step01 dl.vp_sex dd label + input{margin-left:30px;}
.talk_view_article .vp_step01 .vp_zip{position:relative;}
.talk_view_article .vp_step01 .vp_zip input{width:100px;}
.talk_view_article .vp_step01 input[type="text"]{max-width:100%;}
.talk_view_article .vp_step01 .adrs{margin:5px 0;}
.talk_view_article .vp_step01 .adrs input{width:550px;}
.talk_view_article .vp_step01 .adrs2 input{width:350px;}
.talk_view_article .vp_step02_head{margin:0 0 10px; padding:10px 0; border-bottom:1px solid #000; text-align:center; font-weight:600;}
.talk_view_article .vp_q{position:relative; margin:0 0 10px; padding:10px; padding-left:60px; background:#f8f8f8;}
.talk_view_article .vp_q:before{content:''; display:inline-block; position:absolute; top:10px; left:10px; width:44px; height:44px; background:url(../images/vote/sp_com2.png) no-repeat -100px -150px;}
.talk_view_article .vp_img{text-align:center;}
.talk_view_article .area_attfile{margin:10px 0 0; text-align:center;}
.talk_view_article .area_textarea{margin:10px 0 0; border:1px solid #ddd;}
.talk_view_article .area_textarea textarea{width:100%; border:0;}
.vote_party .vp_ans{margin:10px 0;}
.vote_party .vp_ans .lst{border-bottom:1px solid #ccc;}
.vote_party .vp_ans .lst > li{position:relative; padding:10px 0 10px 20px; border-top:1px solid #e5e5e5;}
.vote_party .vp_ans .lst > li:after{content:''; display:block; clear:both;}
.vote_party .vp_ans .lst > li .img img{max-width:180px;}
.vote_party .vp_ans .lst > li .title{margin:5px 0 0; font-weight:600; font-size:16px;}
.vote_party .vp_ans .lst > li .attfile{font-size:12px; letter-spacing:-1px;}
.vote_party .vp_ans .lst > li .chk{position:absolute; top:50%; left:0; transform:translateY(-50%);}
.vote_party .vp_ans .lst > li .chk input{width:20px;height:20px;}

/* 설문조사 결과보기 */
.section_survey_result{padding:40px 30px; border:1px solid #d6d6d6;}
.section_survey_result .title{margin:0 0 10px; padding:0 0 25px; border-bottom:1px solid #ddd; font-size:2.4em; letter-spacing:-2px; text-align:center;}
.section_survey_result .item{margin:50px 0 0;}
.section_survey_result .item .box_q{position:relative; padding:20px 70px 20px 20px; background:#2289d8; font-size:1.27em; color:#fff;}
.section_survey_result .item .box_q a{position:absolute; top:0; right:0; bottom:0; overflow:hidden; width:70px; color:transparent;}
.section_survey_result .item .box_q a:after{content:''; display:inline-block; position:absolute; top:0; right:0; bottom:25%; left:0; width:20px; height:20px; margin:auto; border:3px solid #fff; border-width:0 3px 3px 0; transform:rotate(45deg);}
.section_survey_result .item .box_q a.open{transform:scaleY(-1);}
.section_survey_result .item .box_a{border:1px solid #d6d6d6; border-top:0;}
.section_survey_result .item .area_desc{padding:20px; background:#f4f4f4;}
.section_survey_result .item .area_result{padding:20px; background:#fff;}
.section_survey_result .item .area_result .tit_result{font-size:1.13em;}
.section_survey_result .item .area_result .lst_result li{padding:8px 0; border-bottom:1px solid #ddd;}
.section_survey_result .item .area_result .lst_result li:after{content:''; display:block; clear:both;}
.section_survey_result .item .area_result .lst_result li .num{float:left;}
.section_survey_result .item .area_result .lst_result li .txt{display:block; margin-left:50px;}

/* 설문조사 pc우선 */
@media screen and (max-width:1259px) {
	/* 설문조사 결과보기 */
	.section_survey_result{padding:30px 20px;}

}
@media screen and (max-width:767px) {
	/* 설문조사 결과보기 */
	.section_survey_result{padding:20px 10px;}
	.section_survey_result .title{padding-bottom:10px; font-size:1.67em;}
	.section_survey_result .item{margin-top:30px;}
	.section_survey_result .item .box_q{padding:10px 50px 10px 10px; font-size:1.07em;}
	.section_survey_result .item .box_q a{width:50px;}
	.section_survey_result .item .box_q a:after{width:10px; height:10px;}
	.section_survey_result .item .area_desc{padding:10px;}
	.section_survey_result .item .area_result{padding:10px;}
	.section_survey_result .vote_chart{display:none;}
}
/* // 설문조사 pc우선 */

/* 기존 mobile 우선 */
@media all and (min-width:768px) {
	.section_talk .top:after{content:''; display:block; clear:both;}
	.section_talk .top .view_type_area .area_date{clear:none; margin:0 0 0 10px;}

	.section_talk .top .view_type_area select{margin-top:3px;}
	.section_talk .top .view_type_area .tab_view li{margin-left:5px;}
	.section_talk .top .view_type_area .tab_view li a{padding:0 10px;}
	.section_talk .lst_talk{margin:10px -5px 0;}
	.section_talk .lst_talk:after{content:''; display:block; clear:both;}
	.section_talk .lst_talk > li, .section_talk .lst_talk > li.end{float:left; width:calc(50% - 10px); margin:0 5px 10px;}
	.section_talk .lst_talk .title{display:-webkit-box; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:3; -webkit-box-orient:vertical; height:105px; line-height:35px;}
	/* 설문조사 상세보기 */
	.talk_view_article{margin-top:30px; padding:30px;}
	.talk_view_article .talk_view_head .head_title{padding:0 0 20px;}
	.talk_view_article .talk_view_head .head_title:after{content:''; display:block; clear:both;}
	.talk_view_article .talk_view_head .head_title .prog{float:left; height:40px; margin-right:15px; font-size:17px; line-height:40px;}
	.talk_view_article .talk_view_head .head_title .headline{margin:0 50px 0 0px; padding:3px 0 0; font-size:21px;}
	.talk_view_article .talk_view_head .head_info{padding:15px 0;}
	.talk_view_article .talk_view_head .head_info .name{font-size:13px;}
	.talk_view_article .talk_view_head .head_info .vote_dpt{margin:8px 0 0; font-size:15px;}
	.talk_view_article .talk_view_head .head_info .vote_date{margin:8px 0 0 10px; padding:0 0 0 10px; border-left:1px solid #ddd; font-size:15px;}
	.talk_view_article .talk_view_head .head_info .vote_count{font-size:15px;}
	.talk_view_btn{margin:30px 0;}
	.talk_view_btn .btn_talk{min-width:150px; height:54px; font-size:16px; line-height:54px;}
	.talk_view_btn .btn_talk.result{position:absolute; top:0; left:0;}
	/* 설문조사 참여하기 */
	.talk_view_article .vp_step01_head{margin-bottom:30px; font-size:17px;}
	.talk_view_article .vp_step01{display:table; table-layout:fixed; width:100%; margin-top:30px; padding:40px 140px;}
	.talk_view_article .vp_step01 dl{display:table-row-group; font-size:16px;}
	.talk_view_article .vp_step01 dl dt{display:table-cell; width:300px; padding:15px 0 15px 35px; font-weight:600; vertical-align:top;}
	.talk_view_article .vp_step01 dl dt:before{top:15px;}
	.talk_view_article .vp_step01 dl dd{display:table-cell; padding:15px; vertical-align:top;}
	.talk_view_article .vp_step01 .vp_sex{font-weight:600;}
	.talk_view_article .vp_step02_head{margin:0 0 35px; padding:0 0 30px 0; font-size:25px;}
	.talk_view_article .vp_q{position:relative; margin:0 0 20px; padding:30px 40px; padding-left:100px; font-size:16px; line-height:1.6;}
	.talk_view_article .vp_q:before{top:30px; left:40px;}
	.talk_view_article .vp_img{margin-top:20px;}
	.talk_view_article .area_attfile{margin:20px 0 0;}
	.talk_view_article .area_textarea{margin:30px 0 0;}
}

@media all and (min-width:980px) {
	.section_talk{position:relative; overflow:hidden;}
	.section_talk .top{padding:18px;}
	.section_talk .top .nav_area{width:485px; margin:0 auto;}
	.section_talk .top .nav_area a{height:40px; line-height:40px;}
	.section_talk .lst_talk{margin:20px -10px 0;}
	.section_talk .lst_talk > li, .section_talk .lst_talk > li.end{width:calc(25% - 20px); margin:0 10px 45px; padding:25px 20px 20px;}
	.section_talk .lst_talk .profile_area{font-size:13px;}
	.section_talk .lst_talk .share_area{top:25px; right:20px;}
	.section_talk .lst_talk .box_share{top:80px;}
	.section_talk .lst_talk .title{font-size:26px;}
	.section_talk .lst_talk .like_area{}
	.section_talk .lst_talk .like_area .like_txt{font-size:14px;}
	.section_talk .lst_talk .like_area .like_txt:before{margin-top:3px;}
	.section_talk .lst_talk .like_area .cmt{font-size:14px;}
	.section_talk .lst_talk .like_area .cmt:before{margin-top:2px;}
	/* 설문조사 참여하기 */
	.vote_party .vp_ans .lst{padding:0 48px;}
	.vote_party .vp_ans .lst > li{position:relative; min-height:130px; padding:10px 40px 10px 210px;}
	.vote_party .vp_ans .lst > li .img{position:absolute; top:10px; left:0; bottom:10px;}
	.vote_party .vp_ans .lst > li .img img{max-height:100%;}
	.vote_party .vp_ans .lst > li .title{margin-top:30px;}
	.vote_party .vp_ans .lst > li .attfile{margin-left:10px; font-size:15px; letter-spacing:-1px;}
	.vote_party .vp_ans .lst > li .chk{left:auto; right:0;}
	/* type2 */
	.vote_party .vp_ans.va_t02 .lst > li{padding:10px 210px 10px 40px;}
	.vote_party .vp_ans.va_t02 .lst > li .img{left:auto; right:0;}
	.vote_party .vp_ans.va_t02 .lst > li .chk{display:inline-block; position:relative; left:auto; right:auto; transform:none; margin:-3px 20px 0 0; vertical-align:top;}
	/* type3 */
	.vote_party .vp_ans.va_t03 .lst{padding:0 48px;}
	.vote_party .vp_ans.va_t03 .lst:after{content:''; display:block; clear:both;}
	.vote_party .vp_ans.va_t03 .lst > li{float:left; position:relative; width:50%; min-height:240px; padding:20px 0;}
	.vote_party .vp_ans.va_t03 .lst > li .title{margin-top:20px;}
	.vote_party .vp_ans.va_t03 .lst > li .img{position:relative; top:auto; left:auto; bottom:auto;}
	.vote_party .vp_ans.va_t03 .lst > li .chk{display:inline-block; position:relative; left:auto; right:auto; transform:none; margin:-3px 20px 0 0; vertical-align:top;}
	.vote_party .vp_ans.va_t03 .lst > li .attfile{margin-left:30px;}
	/* type4 */
	.vote_party .vp_ans.va_t04 .lst{padding:0 48px;}
	.vote_party .vp_ans.va_t04 .lst:after{content:''; display:block; clear:both;}
	.vote_party .vp_ans.va_t04 .lst > li{float:left; position:relative; width:50%; min-height:240px; padding:20px 0 130px;}
	.vote_party .vp_ans.va_t04 .lst > li .img{position:absolute; top:auto; bottom:20px; left:0; height:110px;}
	.vote_party .vp_ans.va_t04 .lst > li .img img{}
	.vote_party .vp_ans.va_t04 .lst > li .title{margin-top:0px;}
	.vote_party .vp_ans.va_t04 .lst > li .chk{display:inline-block; position:relative; left:auto; right:auto; transform:none; margin:-3px 20px 0 0; vertical-align:top;}
	.vote_party .vp_ans.va_t04 .lst > li .attfile{margin-left:30px;}
	/* type5 */
	.vote_party .vp_ans.va_t05 .img{margin:0 0 20px; text-align:center;}
	.vote_party .vp_ans.va_t05 .lst > li{position:relative; min-height:auto; padding:10px 0;}
	.vote_party .vp_ans.va_t05 .lst > li .title{margin-top:10px;}
	.vote_party .vp_ans.va_t05 .lst > li .attfile{margin-left:10px; font-size:15px; letter-spacing:-1px;}
}
/* // 기존 mobile 우선 */