@charset "utf-8"; /*=====아이콘================================================== */ .ico_info{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/info.png)} .fb_w{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/fb_w.svg)} .fb_b{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/fb_b.svg)} .tw_w{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/tw_w.svg)} .tw_b{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/tw_b.svg)} .kt_w{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/kt_w.svg)} .ks_w{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/ks_w.svg)} .gp_c{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/gp_c.svg)} .ob_b{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/ob_b.svg)} .re_w{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/reply_w.svg)} .band{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/band.svg)} .arrow_r{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/arrow_r.svg)} .arrow_rt_w{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/arrow_rt_w.svg)} .arrow_lt_w{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/arrow_lt_w.svg)} .arrow_rt_b{background-image: url(images/arrow_rt_b.svg)} .arrow_lt_b{background-image: url(images/arrow_lt_b.svg)} .arrow_fold{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/arrow_up.svg)} .arrow_unfold{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/arrow_dw.svg)} .mail_b{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/mail_b.svg)} .mail_c{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/mail_c.svg)} .btn_give .icon{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/pay_w.svg)} .btn_rec_b{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/rec_b_on.svg)} .on > .btn_rec_b{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/rec_on.svg)} .btn_reply_b{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/reply_on.svg)} .on > .btn_reply_b{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/reply_on_r.svg)} .btn_more{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/more.svg)} .btn_more_w{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/more_w.svg)} .icon.btn_print {background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/print.svg)} .icon.btn_zoomin{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/zoom_in.svg)} .icon.btn_zoomout{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/zoom_out.svg)} .scrap_b {background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/scrap_b.svg)} .on > .scrap_b {background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/scrap_on.svg)} .jjim .icon{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/zzim_off.svg)} .jjim.on .icon{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/zzim_on.svg)} button.jjim{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/zzim_off.svg)} button.jjim.on{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/zzim_on.svg)} .play{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/play.svg)} .site{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/site.svg)} .icon.schedule{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/schedule.svg)} .gallery .icon{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/imgs.svg)} .close_b{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/close_b.svg)} .close_w{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/close_w.svg)} .question{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/question.svg)} .return{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/return.svg)} .photo_logo, .ohmyphoto .head .gnb_logo .logo{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/ohmyphoto.svg)} .tv_logo, .ohmytv .head .gnb_logo .logo{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/ohmytv.svg)} .club_logo{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/club_c.svg)} .star_logo{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/ohmystar.svg)} .moi_logo{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/moi_c.svg)} .search{background-image: url(images/ico_search.svg)} .news_logo {background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/ohmynews_c.svg)} .icon_more{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/btn_more.svg)} .icon_close{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/btn_close.svg)} /* Navigation 최종면 컨트롤 */ #submenu {padding: 0;transition: all 0.8s} #submenu .family{margin: 12px 0} #submenu.navbar-default {background-color: rgba(248, 248, 248, 0);border-color: rgba(231, 231, 231, 0)} #submenu a.navbar-brand {margin: 10px 7px 10px 0;color: transparent} #submenu.navbar-default .navbar-nav > li > a {text-transform: uppercase;color: #ddd;font-weight: 500;font-size: 15px;border: 0px solid transparent;letter-spacing: 0.5px;margin: 10px 15px 0 15px} #submenu.on {background-color: #fff !important;padding: 0 !important} #submenu.on .container{display: none;transition: all 0.8s} #submenu.on .sticky_bar{display: block;transition: all 0.8s} /* 최종면 커버 이미지 컨트롤 */ .atc_intro {display: table;width: 100%;height: 350px;position: relative;padding: 0;overflow: hidden} .atc_intro > .overlay {width: 100%;height: inherit;position: absolute;z-index: 1;top: 0; background: rgba(0, 0, 0, 0.5);} .atc_intro > .overlay > .container{height: inherit} .atc_intro > .coverbg{width: 100%;height: inherit;position: absolute;top: 0;z-index: 0;background-image: linear-gradient(-90deg, #7C8E8D, #56646F)} .atc_intro > .coverbg p.img{height: inherit;background-size: cover;-webkit-background-size:cover;-moz-background-size:cover;-ms-background-size:cover;-o-background-size:cover;background-position: center center} /* 최종면 커버 타이틀 컨트롤 */ .row{display: flex;height: inherit;margin: 0} .atc_intro_header {align-self: center;text-align: center;margin: 40px auto 0;padding: 0 15px} .atc_intro_header >.section_tit{margin: 0 auto 20px;display: block} .atc_intro_header >.section_tit li{display: inline-block;margin-right: 6px;line-height: 27px} .atc_intro_header >.section_tit li a{font-size: 12px;color: #fff;border: 1px solid #d9d9d9;padding: 5px 8px} .atc_intro_header >.section_tit li:last-child{margin: 0} .atc_intro_header >.article_tit{display: block;font-size: 4.5em;color: #fff;line-height: 1.1em;font-weight: 600;letter-spacing: -0.07em;margin-bottom: 10px;} .atc_intro_header >.article_subtit{display: block;font-size: 2em;color: #fff;line-height: 130%;font-weight: 600;letter-spacing: -0.06em} .atc_intro_header >.reporter{margin: 30px 0 0;line-height: 1.2em} .atc_intro_header >.reporter a{display:inline;color: #fff;margin: 0 5px;} .atc_intro_header >.reporter .job{font-size: 12px;color: #ddd;margin-right: 3px;font-weight: 400} .atc_intro_header >.reporter b{font-size: 12px;line-height: 1.5em;color: #ddd} .atc_intro_header >.reporter .id{color:#ddd;font-size: 12px;margin-left: 1px;font-weight: 400} /* 최종면 본문 컨트롤 */ .article{margin: 0 auto;max-width: 750px;position: relative} .article_header{padding: 16px 15px 50px} .article_header .section_tit{margin: 0 auto;display: block} .article_header .section_tit li{float: left;margin-right: 6px} .article_header .section_tit li a{display: inline-block;font-size: 11px;color: #333;border: 1px solid #d9d9d9;padding: 5px 8px} .article_header .article_tit{font-size: 2.5rem;line-height: 1.2em;font-weight: normal;letter-spacing: -0.08em;margin-top: 10px} .article_header .article_subtit{font-size: 14px;line-height: 1.3em;color: #666;letter-spacing: -0.06em;margin-top: 8px} .article_header .reporter{margin: 10px 0} .article_header .reporter a{display: inline;margin-right: 5px} .article_header .reporter .job{font-size: 11px;color: #888;margin-right: 3px} .article_header .reporter b{font-size: 12px;line-height: 1.5em;color: #333} .article_header .reporter .id{color: #888;margin-left: 1px} /* tts 본문듣기 190911 */ .article_header .tts{font-size: 11px; overflow: hidden; display: inline-flex;height: 28px;padding: 0 13px 0 35px; line-height: 28px;border-radius: 20px; border: solid 1px #ccb8f4;background-position: 8px 2px;background-image: url(http://ojsimg.ohmynews.com/images/ohmynews/common/tts.svg);background-color: #f7f4fe;background-size: 22px 22px;background-repeat: no-repeat;margin-top: 12px;margin-right: 4px; vertical-align: baseline;} .article_header .tts.on{border: solid 1px #4e5ae6;background-image: url(http://ojsimg.ohmynews.com/images/ohmynews/common/tts_on.gif);background-color: #4e5ae6;color: #fff;} .article_header .tts:hover{opacity: .7;} .article_header .date{color: #888;font-size: 11px;display: inline-block;margin-left: 4px;margin-right: 4px;margin-top: 15px} .article .article_header .buttons{position: relative;padding: 0} .article_header .buttons button, .article_header .buttons a{border-radius: 20px;font-size: 1.4rem;margin-right: 5px;line-height: 15px;padding: 9px 9px;display: inline-block;vertical-align: middle;box-sizing: border-box;height: 36px;} .article_header .btn_box .btn_reply .icon{width: 15px} .btn_box > *{border-radius: 25px;border: 1px solid #d9d9d9;display: inline-block} .btn_box > *.on{color: #db0000;border: 1px solid #db0000} .btn_box .btn_reply .icon{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/reply.svg)} .btn_box .btn_rec .icon{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/rec.svg)} .btn_box > * > *{vertical-align: middle;} /*.btn_box > * .number{margin: 0 3px 0 5px;display: inline-block; font-size: 13px;font-weight: 400}*/ .article_header .btn_box .icon{width: 14px;height: 16px; margin-right: 5px;/*vertical-align: inherit;*/} .article_header .btn_box .btn_print{width: 36px;height: 36px;background-size: 20px} .article_header .btn_box .btn_more{width: 14px;height: 16px; margin-right: 0; vertical-align: top;} .article_header .icon.btn_font_b{position: absolute;right: 0;top: 0;margin-right: 0;width: 36px;height: 36px;background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/font_big.svg);text-indent:0;font-size:15px;color:transparent} .article_header .icon.btn_font_s{position: absolute;right: 0;top: 0;margin-right: 0;width: 35px;height: 35px;background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/font_small.svg);text-indent:0;font-size:15px;color:transparent} /* 이전이후 연재 보기 */ .article > .serial-nav {opacity: 0;-webkit-transition: all 0.5s ease-out;transition: all 0.5s ease-out} .article > .serial-nav > div{background-color: #b6b6b6} .article > .serial-nav .srl-before{position: fixed;top: 45%;z-index: 3;left: 0} .article > .serial-nav > div .arrow{width: 40px;height: 104px;display: inline-block;background-repeat: no-repeat;background-size: 22px;-webkit-background-size:22px;-moz-background-size:22px;-ms-background-size:22px;-o-background-size:22px} .article > .serial-nav .srl-before .arrow{float: left;background-image: url(http://ojsimg.ohmynews.com/images/star/2016/icon_arrow_l.svg);background-position: 40% 50%} .article > .serial-nav .srl-after .arrow{float: right;background-image: url(http://ojsimg.ohmynews.com/images/star/2016/icon_arrow_r.svg);background-position: 60% 50%} .article > .serial-nav > div > *{transition: all 0.5s} .article > .serial-nav .text{border: 1px solid #ccc;display: none;background-color: #fff;width: 278px;height: 104px} .article > .serial-nav .tit{font-size: 16px;line-height: 1.3em;color: #333;display: block;height: 44px;overflow: hidden;margin: 16px 20px 10px 20px} .article > .serial-nav .subtit{font-size: 12px;color: #777;width: 222px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;margin-top: 8px;display: block;line-height: 1.3em;margin: 0 20px 17px 20px} .article > .serial-nav .srl-after{position: fixed;top: 45%;z-index: 11;right: 0} .article_body{padding: 0 18px;font-size: 17px;line-height: 1.625;color: #000;letter-spacing: -0.04em;background-color: #fff} .article_body blockquote{font-size: 16px;color: #333;max-width: 640px;margin: 0 auto} .article_body .photo_box{position: relative;margin: 0 -18px;text-align: center;margin-bottom: 20px;margin-top: 5px} .article_body .photo_box img{display: inline-block;max-width: 100%;vertical-align: middle} .article_body .photo_box .btn_zoomin{position: absolute;right: 10px;top: 10px;width: 32px;height: 32px;border: 1px solid #d9d9d9;background-color: #fff;text-indent:0;font-size:15px;color:transparent;background-size: 56%} .article_body .photo_box .desc {text-align: left;padding: 8px 12px;font-size: 12px;color: #a0a0a0;line-height: 1.4em;margin-bottom: 10px} .article_body .photo_box .link_thumb {position: relative;display: block} .article_body .photo_box .link_thumb .play {position: absolute;top: 50%;left: 50%;margin-left: -35px;margin-top: -35px;display: inline-block;width: 70px;height: 70px;text-indent:0;font-size:15px;color:transparent;background-color: rgba(0,0,0,0.50);border-radius: 50%} .arc-btns-wrap ~ div{margin: 0 auto 20px} .arc-btns-wrap ~ div > a{display: block;height: 27px;text-align: center} .arc-btns-wrap ~ div > a > img{display: inline-block;width: 280px;height: inherit} .arc-btns-wrap .tag-box{display: block} .arc-btns-wrap .hashtag{margin-top: 20px} .arc-btns-wrap .hashtag a{display: inline-block;font-size: 14px;color: #227dc5;margin-right: 8px;line-height: 100%;font-weight: normal} /*기사 하단 공통 버튼*/ /* .arc-btns-wrap .btn_box{margin: 0 auto;display: block;text-align: center;padding: 25px 0 15px} .arc-btns-wrap .btn_box > * {min-width: 45px;height: 45px;margin: 0 4px;line-height: 44px;padding: 0 11px;overflow: hidden} .pc .arc-btns-wrap .btn_box > * {line-height: 42px} .arc-btns-wrap .btn_box > * .icon{width: 21px;height: 41px} .arc-btns-wrap .btn_box > * .icon.rec{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/rec.svg);background-size: 18px;background-position: 50% 0%} .arc-btns-wrap .btn_box > *.on .icon.rec{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/rec_on.svg);background-size: 18px} .arc-btns-wrap .btn_box > * .icon.more{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/more.svg)} .arc-btns-wrap .btn_box > * .text{margin-left: 5px;display: inline-block;font-size: 12px;line-height: 20px;color: #999;vertical-align: text-top} .arc-btns-wrap .btn_box > *.on .text{color: #db0000} .arc-btns-wrap .btn_box > *.on .number{color: #db0000} */ .arc-btns-wrap .btn_box > *{border-radius: 25px;border: 1px solid #d9d9d9;display: inline-block;vertical-align: middle} .arc-btns-wrap .btn_box > *.on{color: #db0000;border: 1px solid #db0000} .arc-btns-wrap .btn_box .btn_reply .icon{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/reply.svg)} .arc-btns-wrap .btn_box .btn_rec .icon{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/rec.svg)} .arc-btns-wrap .btn_box > * > *{vertical-align: middle;display: table-cell;padding: 0} .arc-btns-wrap .btn_box > * .number{font-size: 15px;font-weight: 400;line-height: 45px;padding: 0 0 0 5px} .arc-btns-wrap .btn_box{margin: 0 auto;display: block;text-align: center;padding: 15px 0;float: none;width: 100%;border: none} .arc-btns-wrap .btn_box > * {position: relative;min-width: 47px;height: 47px;margin: 0 4px;padding: 0 11px;overflow: hidden;background-color: #fff;cursor: pointer;outline: 0} .pc .arc-btns-wrap .btn_box > * {line-height: 42px} .arc-btns-wrap .btn_box > * .icon{width: 21px;background-color: transparent;background-size: 21px;border: none;font-size: 0;line-height: 45px} .ie .arc-btns-wrap .btn_box > * .icon{font-size: 1px;background-size: 20px} .arc-btns-wrap .btn_box > * .icon.rec{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/rec.svg);background-size: 18px;background-position: 50% 0%} .arc-btns-wrap .btn_box > *.on .icon.rec{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/rec_on.svg);background-size: 18px} .arc-btns-wrap .btn_box > * .icon.more{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/more.svg)} .arc-btns-wrap .btn_box > * .text{margin-left: 5px;display: inline-block;font-size: 12px;line-height: 20px;color: #999;vertical-align: text-top} .arc-btns-wrap .btn_box > *.on .text{color: #db0000} .arc-btns-wrap .btn_box > *.on .number{color: #db0000} /*이기사 한눈에*/ .high_list{width:100%;position:relative;margin-bottom:20px} .high_list .t_p{color:#db0000} .high_list ul{margin-bottom:10px;border-top:2px solid #e1e1e1;border-bottom:2px solid #e1e1e1;padding:14px 0px 5px 0px} .high_list h2{font-size: 14px;padding-bottom:5px;position:absolute;top:-14px;background-color:#fff;padding-right:5px} .high_list li{font-size: 13px;color: #666} .high_list .v_line{border-top:1px solid #f3f3f3;border-bottom:1px solid #f3f3f3} .high_list li:before{content: "·";color: #db0000;font-size: 1em;font-weight: bold;display: inline-block;margin-right: 3px} .high_list li span{display: inline-block;background-color: #db0000;border-radius: 3px;font-size: 10px;color: #fff;text-align: center;text-transform: uppercase;margin-right: 3px;font-weight: bold;letter-spacing: -0.03em;padding: 2px 6px 3px;line-height: initial} /*편집자의 말*/ .editor_text {font-size: 14px;color: #666} /*박스기사*/ .article #BoxTable {width: 100%;height: 100px;border: 1px solid #d6d6d6;margin: 0px 0px 10px} .article #BoxTr{font-size: 14px;color: #999;padding: 10px;background-color: #efefef;text-align: center;font-weight: bold} .article .article_box {font-size: 14px;color: #666;line-height: 1.3em;padding: 10px 14px 12px;text-align: justify} /*덧붙이는 글, 첨부파일*/ .article_body .add-comment, .article_body .add-clip {padding: 20px 0 10px 0;font-size: .9em;line-height: 1.5em;margin: 0 auto} .article_body .add-comment .tit, .article_body .add-clip .tit {color: #444;font-weight: bold;vertical-align: bottom;padding-right: 7px} .article_body .add-comment .txt{color: #888} .article_body .add-clip .clips a{color: #666;font-size: 12px;margin-right: 8px;border-bottom: 1px solid;padding-bottom: 1px} .article_body .add-clip .clips a:after{content: ","} .article_body .add-clip .clips a:last-child:after{content: none} .photoslide_out .jssorazoom{right: 8px} .article_btns{max-width: 600px;margin: 0 auto;background-color: #fff;margin-bottom: 30px;text-align: center;/* padding-bottom:10px;*/} .article_btns .clubbt_box{text-align: center;padding-bottom: 20px;display: block} .article_btns .clubbt_box h1{font-size: 15px;font-weight: normal;margin-bottom: 8px} .article_btns .clubbt_box .bt{display: block} /* s:애니메이션 무한반복 class */ .infinite{-webkit-animation-iteration-count:infinite} /* e:애니메이션 */ .article_btns .clubbt_box .bt img{width: 200px} /* 끝: 원고료 후원 같은라인 레이아웃 171103*/ .article_btns .payment_box{height: 30px;position: relative;vertical-align: bottom;border-top: solid 1px #e5e5e5;border-bottom: solid 1px #e5e5e5;margin-bottom: 40px;padding: 14px 100px 14px 170px} .article_btns .payment_box.no{background-color: #f4f4f4} .article_btns .payment_box .title{position: absolute;left: 16px;top: 15px;text-align: left;letter-spacing: -.0710px;overflow: hidden} .article_btns .payment_box .title h1{font-size: 15px;margin-bottom: 3px;font-weight: normal} .article_btns .payment_box .title h2{font-size: 12px;font-weight: normal;color: #2bb4bb} .article_btns .payment_box .amount{position: relative;padding-top: 12px;font-size: 1.9rem;color: #000;vertical-align: bottom;text-align: right} .article_btns .payment_box.no .amount{display: none} .article_btns .payment_box .amount span.won{padding-left: 4px;font-size: 12px;color: #000} .article_btns .payment_box .amount .menu_arrow_box {position: absolute;background: #dcdcdc;border-radius: 4px;top: -25px;right: 0} .article_btns .payment_box .amount .menu_arrow_box:after {top: 100%;left: 50%;border: solid transparent;content: " ";height: 0;width: 0;position: absolute;pointer-events: none;border-color: rgba(79, 213, 150, 0);border-top-color: #dcdcdc;border-width: 5px;margin-left: -5px} .article_btns .payment_box .amount .menu_arrow_box a{display: block} .article_btns .payment_box .amount .menu_arrow_box .tit_text{color: #000;text-align: center;font-size: 9px;padding: 4px 10px;text-transform: uppercase} .article_btns .payment_box .bt_give{position: absolute;right: 10px;top: 10px;border-radius: 20px;color: #fff;font-weight: bold;font-size: 11px;padding: 10px 15px;vertical-align: middle;background-color: #2bb4bb} .article_btns .payment_box .bt_give .nott{display: none} .article_btns .payment_box .bt_give .yestt{display: block} .article_btns .payment_box.no .bt_give .nott{display: block} .article_btns .payment_box.no .bt_give .yestt{display: none} /* e: UI 정리 170427 */ .article_btns .btn_rec{margin: 0 auto;display: block;background-color: #fdfdfd;border: 1px solid #d9d9d9;padding: 10px 20px;margin-bottom: 20px;min-width: 70px} .article_btns .btn_rec .icon{width: 20px;height: 20px;display: block;margin: 0 auto} .article_btns .btn_rec .number{margin-top: 8px;display: block;font-size: 15px} .article_btns .btn_rec.on .number{color: #db0000} .article_btns .payment{padding: 15px 0;margin: 0 auto;margin-bottom: 8px;width: 281px;background-color: #f0f0f0;border: 1px solid #d9d9d9} .article_btns .payment .amount{font-size: 13px;color: #888;margin-bottom: 8px} .article_btns .payment .amount span{font-size: 1.9rem;color: #ffa11b;vertical-align: bottom} .article_btns .payment button{padding: 8px 14px 10px;border-radius: 5px;margin: 0 3px;font-size: 14px;line-height: 1.2em} .article_btns .payment .give{color: #fff;background-color: #ffa11b} .article_btns .payment .cheer{color: #707070;border: 1px solid #b3b3b3} .article_btns .btn_reply, .article_btns .btn_scrap, .article_btns .btn_more{display: inline-block;border: 1px solid #d9d9d9;padding: 10px 14px 11px;font-size: 11px;color: #777;margin: 0 3px} .article_btns .btn_reply .icon, .article_btns .btn_scrap .icon, .article_btns .btn_more .icon{width: 16px;height: 16px;margin-right: 5px;vertical-align: middle} .article_btns .btn_reply .number , .article_btns .btn_scrap .number, .article_btns .btn_more .number{font-size: 14px;color: #000} .article_btns .btn_reply{-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none} .arc_list{padding: 20px 15px;background-color: #fff;overflow: hidden} .arc_list.inblock{padding: 40px 13px 30px 13px} .list_tit{font-size: 16px;margin-bottom: 12px;font-weight: 600} .list_tit a{font-size: 15px;font-weight: bold} .arc_list li a{display: block;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;padding: 5px 0;font-size: 15px;line-height: 1.15em;color: #333;font-weight: normal;letter-spacing: -0.08em} .arc_list li a:before{content: "·";color: #7d7d7d;font-size: 14px;font-weight: bold;margin-right: 5px} iframe .widget .title{font-weight: normal;font-size: 15px;font-family: initial;border-bottom: 0;margin-bottom: 12px;padding-bottom: 0} iframe .widget .title b{font-weight: normal;color: #000} .cssEtc.mostview{padding: 20px 13px 10px 13px;background-color: #fff} .thumb_list li{float: left;width: 50%;margin-bottom: 6px} .thumb_list li a{display: inline-block;margin: 0 3px;background-color: #fff} .thumb_list li a strong{font-weight: normal;color: #333;display: block;font-size: 1.4em;line-height: 1.3em;overflow: hidden;height: 37px} .thumb_list a{position: relative} .thumb_list .thumb{display: inline-block;overflow: hidden;height: 150px} .thumb_list .thumb:before{content: "";background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 23%,rgba(0,0,0,1) 91%);width: 100%;height: 150px;z-index: 1;position: absolute} .thumb_list .thumb img {width: 100%;height: 150px;object-fit: cover;object-position: center top} .thumb_list .tit {z-index: 2;position: absolute;bottom: 0;left: 0;padding: 14px 12px;display: inline-block;margin-top: 6px;font-weight: normal} .thumb_list .tit strong{height: inherit;font-size: 15px;letter-spacing: -0.06em;color: #fff;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;word-wrap:break-word} .ad{max-width: 650px;margin: 0 auto;background-color: #fff;padding: 10px 13px;margin-bottom: 40px;clear: both} .ad iframe{margin-bottom:0!important} .ad #liverePlugIn {padding: 5px} .ad_box_outline{position:relative} .ad_box_outline h2.titl {width: 23px;height: 16px;background: #ccc;text-align: center;font-size: 10px;line-height: 16px;color: #FFF;position: absolute;right: -13px;top: -10px} .article .txt_article{background-color: #fff;padding: 20px 13px 10px 13px} .article .txt_article ol li{display: table;margin: 0 0 6px 0;width: 100%;padding: 0;border: 0} .article .txt_article ol li a{position: relative;display: table-row} .article .txt_article ol li a .number{font-size: 2.8rem;font-weight: bold;text-align: center;color: #a5a5a5;display: table-cell;vertical-align: text-bottom;padding: 18px 0;margin-right: 5px;width: 23px} .article .txt_article ol li a .tit{display: table-cell;padding: 0 18px 0 8px;vertical-align: middle;height: 57px} .article .txt_article ol li a strong{white-space: normal;font-size: 15px;line-height: 1.3em;color: #333;font-weight: normal;letter-spacing: -0.08em;height: 37px;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;word-wrap: break-word} .article .txt_article ol li a .thumb{display: table-cell;vertical-align: middle;width: 90px;height: 57px} .article .txt_article ol li a .thumb img{vertical-align: middle;width: 100%;height: 100%} .article .card_list{padding: 20px 13px 10px 13px} .article .card_list a{margin: 0 2px} .card_list ul li strong {overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;word-wrap: break-word} .series_list{position: relative;margin: 0 auto;background-color: #fff;padding: 20px 15px 15px} .series_list .top_tit{position: relative;display: block;margin-bottom: 16px;white-space: nowrap;padding: 0 38px 0 70px} .series_list .top_tit .blit{position: absolute;left: 0;font-size: 11px;padding: 2px 12px;display: inline-block;color: #fff;background-color: #aaaebe} .series_list .top_tit .list_tit{margin-bottom: 0;line-height: 1.3em;letter-spacing: -0.06em;color: #333;white-space: nowrap;text-overflow: ellipsis;overflow: hidden} .series_list .more{position: absolute;right: 16px;top: 21px;font-size: 12px;display: inline-block;color: #888;text-decoration: underline} .series_list > ol > li{letter-spacing: -0.07em;font-size: 15px;line-height: 1.5em} /*.series_list > ol > li:last-child{margin-bottom: 0} */ .series_list > ol > li > a .number{color: #333;margin-right: 6px;border: 1px solid #aaaebe;font-size: 13px;padding: 2px 10px;background-color: #fff} .series_list > ol > li > a{display: block} .reporter-wrap{padding: 0 15px;margin: 15px 0} .reporter-wrap:after{content: "";display: block;clear: both;overflow: hidden} .reporter-wrap .profile-box{position: relative;overflow: hidden;border: 1px solid #dedede} .reporter-wrap .profile-box .profile-arrow{position: absolute;top: 0;width: 100%;height: 100%} .profile-arrow > .swiper-button-prev, .profile-arrow > .swiper-button-next{width: 30px;height: 30px;box-sizing: border-box;border: 1px solid #a4a4a4;background-color: #c5c5c5;margin-top: -17px;background-size: 14px 14px;opacity: 0.4} .pro-top {position: relative} .profile-arrow > .swiper-button-prev{background-image: url(images/arrow_lt_b.svg);left: -1px} .profile-arrow > .swiper-button-next{background-image: url(images/arrow_rt_b.svg);right: -1px} .profile-arrow .swiper-button-next.swiper-button-disabled, .profile-arrow .swiper-button-prev.swiper-button-disabled{opacity: 0} .pro-top {position: relative} .pro-top > *{vertical-align: middle} .pro-top > .face{display: inline-block;border-radius: 50%;width: 50px;height: 50px;background-size: cover;overflow: hidden;float: left;margin-right: 8px;background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/reporter-bg.svg);} .pro-top > .info-box{display: block;position: relative;margin-top: 5px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis} .pro-top > .info-box span{vertical-align: middle} .pro-top > .info-box .role{font-size: 12px;display: block;color: #999} .pro-top > .info-box .name{font-size: 17px;font-weight: bold;line-height: 21px} .pro-top > .info-box .id{font-size: 12px;color: #999;margin: 0} .pro-top > .info-box .icon{width: 14px;height: 18px;background-size: 12px} .pro-top .profile-btns{display: inline-block;position: absolute;right: 32px;top: 19px} .pro-top .profile-btns > li{float: right;display: none;margin: 0 2px} .pro-top .profile-btns > .jjim-btn{display: inline-block} .pro-top .profile-btns > .jjim-btn > a{padding: 5px 8px;border: 1px solid #b8b8b8;border-radius: 4px;min-width: 74px;width: auto;font-size: 12px;opacity: 1} .pro-top .profile-btns > .jjim-btn > a > *{display: inline-block;vertical-align: top} .pro-top .profile-btns li .jjim > strong{font-weight: 400;margin-left: 4px;color: #333} .pro-top .profile-btns:after{content: "";display: block;clear: both} .pro-top .profile-btns li a{width: 30px;height: 30px;color: transparent;display: inline-block;vertical-align: middle;background-size: 55%;opacity: .7} .pro-top .profile-btns li .jjim > .icon{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/zzim_off.svg);width: 17px;height: 17px} .pro-top .profile-btns li .jjim.on > .icon{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/zzim_on.svg); opacity: 1} .pro-top > .profile_club{position: absolute;z-index: 1;width: 40px;height: 40px;background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/icon_myroom_club.svg)} .swiper-pagination{top: 10px;left: 0} .swiper-pagination .swiper-pagination-bullet{width: 6px;height: 6px;border-radius: 50%;margin: 8px 0;display: block} .swiper-pagination .swiper-pagination-bullet:first-child{margin-top: 0} .swiper-pagination .swiper-pagination-bullet:last-child{margin-bottom: 0} /*원고료*/ .support-box{position: relative;margin: 20px 20px 35px;text-align: center} .support-box > .sup-left{text-align: center;vertical-align: middle;margin-bottom: 7px;} .support-box > .sup-left > .sup-left-l{font-family: Helvetica-light,'AppleSDGothicNeo-Light','Malgun Gothic','맑은 고딕',Dotum,'돋움',sans-serif; letter-spacing: -0.04em;display: inline-block;} .support-box > .sup-left > .sup-left-l > span:first-child{/*display: block;color: #999;*/font-size: 12px} .support-box > .sup-left > .sup-left-l > span:last-child{/*display: inline-block;*/font-weight: 400;font-size: 15px;color: #000} .support-box.have_m .sup-left-r{font-family: Helvetica-light,'AppleSDGothicNeo-Light','Malgun Gothic','맑은 고딕',Dotum,'돋움',sans-serif; position: relative;display: inline-block;margin-left: 3px;line-height: 1;} .support-box.have_m .sup-left-r > strong{font-family: Helvetica-light,'AppleSDGothicNeo-Light','Malgun Gothic','맑은 고딕'; font-size: 26px;color: #fbac4d;font-weight: 600;} .support-box.have_m .sup-left-r > strong:after{content: "원";font-size: 11px;color: #555;margin-left: 2px;font-weight: 100;vertical-align: middle} .support-box.have_m .sup-left-r > .sup-message{position: absolute; top: -30px;right: 0; height:28px; line-height: 20px; display: inline-block;padding: 3px 10px;background-color: #dcdcdc;border-radius: 3px;white-space: nowrap;font-size: 10px;font-weight: normal;color: #333!important} .support-box.have_m .sup-left-r > .sup-message:after{bottom: -10px;left: 50%;border: solid transparent;content: " ";height: 0;width: 0;position: absolute;pointer-events: none;border-color: rgba(79, 213, 150, 0);border-top-color: #dcdcdc;border-width: 5px;margin-left: -5px} .support-box .sup-message{background-color: #f1f1f1; padding: 0 15px; height: 37px; line-height: 35px; margin-right: 10px;display: inline-block; border: 1px solid #d9d9d9; border-radius: 7px; font-size: 12px;-webkit-transition: all 0.2s cubic-bezier(0.02, 0.01, 0.47, 1);transition: all 0.2s cubic-bezier(0.02, 0.01, 0.47, 1);} .support-box .btn_money{height: 37px;line-height: 35px;border: 1px solid #d9d9d9;background-color: #ffffff;padding: 0 15px;display:inline-block;border: 1px solid #d9d9d9;border-radius: 7px;-webkit-transition: all 0.2s cubic-bezier(0.02, 0.01, 0.47, 1);transition: all 0.2s cubic-bezier(0.02, 0.01, 0.47, 1);} .support-box .btn_money > *{vertical-align: middle} .pc .support-box .btn_money{height: 37px;line-height: 35px;border-color: #d9dbdb;background-color: #ffffff;padding: 0 15px;} .support-box .btn_money .number{font-weight: 600} .support-box.have_m > .sup-left > .sup-left-l > span:last-child{font-weight: 600} /*최종면 스티키 연재타이틀*/ .sticky_bar{display: none;height: 52px;background-color: rgba(0,0,0,0.8);padding: 10px 0 8px;width: 100%; z-index: 101;-webkit-animation-name: opacity-box;-webkit-animation-duration: .8s;animation-name: opacity-box} .navbar-header .serially_titl{font-size: 1em;font-weight: 600;margin: 15px 0;line-height: 30px;display: none} .navbar-header .serially_titl > span{display: inline-block;letter-spacing: -0.05em} .navbar-header .serially_titl .tt01{color: #5eb8ff;padding-right: 5px;font-size: 1.3em} .navbar-header .serially_titl .tt02{color: #fff;font-size: 1.3em} .sticky_bar .atc_container {position: relative;text-align: center} .sticky_bar .atc_container .serially_titl{position: absolute;left: 10px;font-size: 1em;font-weight: 600;margin-left: 5px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;line-height: 34px;letter-spacing: -.8px} .sticky_bar .atc_container .serially_titl .tt01{color: #5eb8ff;padding-right: 5px;font-size: 1.3em} .sticky_bar .atc_container .serially_titl .tt02{color: #fff;font-size: 13px;display: inline-block} .sticky_bar ul li{float: left} .sticky_bar .share{margin-left: 10px} .sticky_bar .share li{margin-right: 5px} .sticky_bar .share li button{display: inline-block;width: 32px;height: 32px;text-indent:0;font-size:15px;color:transparent;border: 1px solid #bfbfbf;border-radius: 16px;background-color: transparent;background-size: 56%} /* 카카오친구 버튼 추가 */ .sticky_bar .share li .btn_kko{display: inline-block;width: 70px;height: 30px;border-radius: 30px;font-size: 11px;line-height: 30px;color: #252525;border: 1px solid #fcc900;background-color: #feeb00;text-align: center;letter-spacing: -1px} .sticky_bar .share li .btn_kko .frd_c{width: 20px;height: 20px;margin: 5px 0 0 0;display: inline-block;overflow: hidden;font-size: 1px;line-height: 0;color: transparent;background: url(http://ojsimg.ohmynews.com/images/mobile_2017/kafriend_c.svg) no-repeat 0 0;vertical-align: top} .sticky_bar ul li .fb_c{border: 1px solid #415ea7} .sticky_bar ul li .tw_c{border: 1px solid #1da1f2} .sticky_bar ul li .kt_cc {border: 1px solid #3b1e1e;background-size:65%} .sticky_bar ul li .more_s{opacity: .5;border: 1px solid #000} .sticky_bar .state{position: absolute;right: 0;top: 0;float: right} .sticky_bar .state li{text-align: center;margin: 0 4px} .sticky_bar .state li .icon{width: 30px;height: 30px;display: block;background-size: 74%;margin: 0 auto;opacity: 0.8} .sticky_bar .state li:last-child .icon{background-size: 80%} .sticky_bar .state li strong{display: none} .club_box{width: 100%;max-width: 768px;position: fixed;top: 51px;z-index: 101;background-color: rgba(0,0,0,.7);text-align: center;padding: 13px 0 15px} @-webkit-keyframes opacity-box { from {opacity: 0} to {opacity: 1.0} } @keyframes opacity-box { from {opacity: 0} to {opacity: 1.0} } .club_box p{color: #fff;font-size: 13px;margin-bottom: 10px;letter-spacing: -0.03em} .club_box a{display: inline-block;padding: 6px 11px 8px;line-height: 1em;font-weight: bold;font-size: 13px;color: #fff;border: 1px solid #fff;border-radius: 3px} .layer_reporter{position: absolute;width: 100%;bottom: 0;z-index: 4;background-color: #f9f9f9} .layer_reporter .contents{padding: 15px 15px 12px} .layer_reporter .contents .profile{position: relative;margin-bottom: 5px} .layer_reporter .contents .profile .profile_club{position:absolute;top: -10px;left: -15px;z-index: 100;width: 40px;height: 40px;text-indent:0;font-size:15px;color:transparent;background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/icon_myroom_club.svg);background-repeat:no-repeat;background-position:center;display: inline-block} .layer_reporter .contents .profile .face{width: 65px;height: 65px;border: 1px solid #ccc;display: inline-block;border-radius: 33px;overflow: hidden;vertical-align: top;margin-right: 5px} .layer_reporter .contents .profile .face img{width: 100%;object-fit: cover;min-height: 67px} .layer_reporter .contents .profile .txt{display: inline-block;line-height: 1.3em;margin-top: 4px} .layer_reporter .contents .profile .txt em{display: block;color: #808080;margin-bottom: 3px} .layer_reporter .contents .profile .txt .name{display: block;font-size: 17px;color: #000;margin-bottom: 3px;line-height: 1.3em;white-space: nowrap;overflow: hidden;text-overflow: ellipsis} .layer_reporter .contents .profile .txt .id{display: block;font-size: 14px;color: #888} .layer_reporter .contents .profile .zzim{position: absolute;top: 0;right: 0;width: 60px;height: 60px;border: 1px solid #888;text-align: center;border-radius: 5px;display: inline-block;background: none} .layer_reporter .contents .profile .zzim .icon{width: 27px;height: 25px;display: block;margin: 0 auto;margin-bottom: 2px;background-position: right;opacity: .5} .layer_reporter .contents .profile .zzim strong{font-size: 11px;color: #888} .layer_reporter .contents .profile .zzim.on{border: 1px solid #db0000} .layer_reporter .contents .profile .zzim.on .icon{opacity: 1} .layer_reporter .contents .profile .zzim.on strong{font-size: 11px;color: #db0000} .layer_reporter .contents ul{margin: 0 0 5px 64px} .layer_reporter .contents li{float: left;margin: 0 4px} .layer_reporter .contents li a{display: inline-block;width: 30px;height: 30px;opacity: .4;background-size: 60%} .layer_reporter .contents li .fb_b{background-size: 55%} .layer_reporter .contents li .ob_b{background-size: 80%} .layer_reporter .contents p{font-size: 13px;line-height: 1.5em;color: #666;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;word-wrap: break-word;overflow: hidden} .layer_reporter .contents .btn_atc{white-space: nowrap;overflow: hidden;text-overflow: ellipsis;display: block;font-size: 14px;color: #000;background-color: #fff;border: 1px solid #ccc;border-radius: 5px;padding: 10px 10px 12px;margin-top: 10px} .layer_reporter .contents .btn_atc span{font-size: 11px;color: #888;display: inline-block;margin-right: 4px} .layer_reporter .contents .btn_atc strong{font-weight: normal} .layer_reporter .close{text-align: center;border-top: 1px solid #e4e4e4;font-size: 17px;color: #555;padding: 8px 0 12px;line-height: 1.3em;width: 100%} @-webkit-keyframes slideIn { from{transform:translateX(154px);opacity:0} to{transform:translateX(0px);opacity:1} } @keyframes slideIn { from{transform:translateX(154px);opacity:0} to{transform:translateX(0px);opacity:1} } .ly_relative{position: relative;height: 100%} .layer_moreatc{position: absolute;width: 120px;height: 100%;right: 0;z-index: 4;background-color: #fff;padding: 15px 17px;-webkit-animation-name: slideIn;-webkit-animation: slideIn .3s ease;animation-name: slideIn;animation: slideIn .3s ease} .layer_moreatc h2{font-size: 13px;letter-spacing: -0.06em} .ly_relative button, .moreatc.popular, .moreatc.series{position: absolute;top: 50%;left: -30px;margin-top: -30px;width: 30px;height: 60px;border-radius: 10px;border-top-right-radius: 0;border-bottom-right-radius: 0;text-indent:0;font-size:15px;color:transparent;background-size: 74%;background-position: center} .ly_relative button{right: 154px;left: inherit; -webkit-animation-name: slideIn;animation-name: slideIn;-webkit-animation: slideIn .3s ease;animation: slideIn .3s ease} .moreatc.popular,.moreatc.series{right: 0;left: inherit;z-index: 41;position: fixed} .ly_relative.popular button, .moreatc.popular{background-color: #db0000} .ly_relative.series button, .moreatc.series{background-color: #2090d7} .layer_moreatc ul{margin-top: 10px;overflow-x: hidden} .layer_moreatc ul li{margin-bottom: 10px} .layer_moreatc ul li a{display: block;position: relative} .layer_moreatc ul li a .tit{text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;word-wrap: break-word;overflow: hidden;font-size: 13px;line-height: 1.4em;margin-top: 3px;letter-spacing: -0.06em;max-height: 36px;font-weight: normal} .layer_moreatc ul li .on{text-decoration: underline} .layer_moreatc ul li .on .thumb:before{content: "";position: absolute;z-index: 1;width: 100%;height: 100%;opacity: .5} .layer_moreatc ul li a .thumb{position: relative;border: 1px solid #cecece;background-color: #cbcbcb;background-size: 50%;background-position: center;background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/ohmynews_w.svg);background-repeat: no-repeat;width: 100%;height: 72px;overflow: hidden} .layer_moreatc.popular ul li .on .thumb:before{background-color: #db0000} .popular .layer_moreatc{border-left: 1px solid #db0000} .popular h2, .popular ul li .on{color: #db0000} .layer_moreatc.series ul li .on .thumb:before{background-color: #2090d7} .series .layer_moreatc{border-left: 1px solid #2090d7} .series h2, .series ul li .on{color: #2090d7} .article_body .atc_state{font-size: 14px;color: #333} .atc_notice{margin: 20px 0;border: 1px solid #e1e1e1;border-radius: 4px;background-color: #fff;padding: 13px 16px;width: 82%;text-align: left;display: inline-block} .atc_notice .ico_info{display: inline-block;width: 10px;height: 10px;margin-right: 4px;background-size: 10px;vertical-align: middle} .atc_notice p{font-size: 12px;color: #555;line-height: 1.5em;letter-spacing: -0.07em;margin-bottom: 3px} .atc_notice span{font-size: 11px;color: #999;letter-spacing: -0.07em} .article_body .atc_notice{display: block;margin: 20px 0;width: inherit;border-radius: 8px;background-color: #f4f4f4} .article_btns .rec_txt{font-size: 12px;color: #333;text-align: center;margin-bottom: 10px;padding-top:10px} /*--------좋은 기사 원고료-------------------------------*/ /*댓글쓰기레이어창*/ .article_reply {position: fixed;top: 0px;left: 0px;width: 100%;height: 100%;z-index: 600;text-align: center} .article_reply > .box {position: relative;max-width:100%;;width: 100%;height: 100%;background-color: rgba(1,1,1,0.6);margin: 0px auto 0px auto} .article_reply > .box > .reply {position: absolute;top: 0px;width: 100%} .article_reply > .box > .reply > .close {position: absolute;top: 0px;right: 0px;width: 44px;height: 44px;cursor: pointer;background: url(http://ojsimg.ohmynews.com/images/mobile_2013/news/m-icon-all.png) -116px -295px;background-size: 150px;background-repeat: no-repeat;z-index: 605;background-color: #000;opacity: .6} .article_reply > .box > .reply00 {overflow-x: hidden;overflow-y: scroll;height: 100%} .article_reply > .box > .reply00 > .padding {height: 50px} /*원고료 레이어 팝업 160510 추가*/ /*점수&원고료주기 */ .atc_action_fee{width:100%;height:85%;padding-bottom:30px;border-top:solid 1px #FFF;position:relative;background: #efefef;overflow: auto} .atc_action_fee .titl{padding:30px 10px 0px 10px;font-size:20px;line-height:25px;color:#252c38;font-weight:bold;text-align:left;letter-spacing:-2px;margin: 0} .atc_action_fee .btn_atc_pay {border: 1px solid #c8c8c8;width: 80px;line-height: 22px;background: #f4f4f4;position: absolute;top: 27px;right: 10px;font-size: 12px;color: #1B1B1B;font-weight: bold} .atc_action_fee .outbox{padding:10px;line-height: 1em} /*원고료 보기*/ .atc_action_fee .outbox .cmt_box {padding: 15px 15px 15px 15px;background: #fff;margin-bottom:2px;text-align:left} .atc_action_fee .outbox .cmt_box dl{margin: 0} .atc_action_fee .outbox .cmt_box dd{margin-left:0} .atc_action_fee .outbox .cmt_box .name{color: #000;margin: 0;margin-bottom: 5px;font-size: 15px} .atc_action_fee .outbox .cmt_box .comment{color: #666;letter-spacing: -1px;font-size: 12px;margin-bottom: 5px;line-height: 18px} .atc_action_fee .outbox .cmt_box .comment span {font-size:11px;color:#CCC;letter-spacing:0px;margin-left:5px} .atc_action_fee .outbox .cmt_box .paysum{color: #bbb;font-size: 12px;text-align: right;font-weight: bold;margin: 0} .atc_action_fee .outbox .cmt_box .paysum span{color: #db0000;margin-left: 5px;font-weight: bold;font-size: 14px} /*원고료*/ .atc_action_fee .outbox .moneytotal{width:100%;clear:both;font-size:16px;margin-bottom:25px;overflow:hidden;color:#666;line-height:20px;text-align:left;padding:15px 0 0 10px;letter-spacing:-0.5px} .atc_action_fee .outbox .moneytotal .rd_text{color:#db0000;font-family:Arial;font-weight:bold;letter-spacing:-0.5px} /*공통*/ .atc_action_fee .outbox .select{width:100%;height:42px;border:solid 1px #ddd;text-align:center;font-size:16px;color:#333;text-indent:0.5em;margin-bottom:10px} .atc_action_fee .outbox .rd_bt {width:100%;height:50px;background:#d1262c;margin-top:10px;text-align:center;font-size:17px;font-weight:bold;color:#FFF;line-height:50px;border:0} .atc_action_fee .outbox .rd_bt a{display:block} .atc_action_fee .outbox .input_out {border: 1px solid #ddd;padding:5px 10px;margin-bottom:10px;line-height:40px;background:#FFF;font-size:14px;color:#999;overflow:hidden} .atc_action_fee .outbox .input_out .name{width:100%;height:40px;outline:none;border-style:none;background:none;font-size:16px;color:#000} .atc_action_fee .outbox .input_out .hphone{width:100%;height:40px;outline:none;border-style:none;background:none;font-size:16px;color:#000} .atc_action_fee .outbox .input_out .textarea{width:100%;height:120px;outline:none;border-style:none;background:none;font-size:14px;color:#000;letter-spacing:-0.5px} .atc_action_fee .outbox .explain{margin-top:25px;width:100%;list-style-type: none;padding: 0} .atc_action_fee .outbox .explain li{padding-left:10px;font-size:11px;color:#666;line-height:120%;letter-spacing:-1px;padding-bottom:10px;position:relative;text-align:left} .atc_action_fee .outbox .explain li .bl{position:absolute;left:0;top:6px;width:10px;height:5px;font-size:0;background:url(http://ojsimg.ohmynews.com/images/mobile_2013/news/list_bl_s.png) 0 0 no-repeat;background-size:10px} .atc_action_fee .mb_40 {margin-bottom:40px;width:100%;clear:both} /* 팩트체크 170208 */ .contain {display: block;width:100%;min-width: 320px;border:none;padding: 20px 0px;text-align: left;vertical-align: top;border-top: 2px solid #dbdbdb;border-bottom: 2px solid #dbdbdb} .factchecktitle{padding: 12px 12px 10px} .factchecktitleh1{font-size: 16px;font-family: Nanum Gothic, '나눔고딕', dotum, '돋움', Helvetica, sans-serif, Apple-Gothic;color: #000;font-weight: normal;background-color: #fff} .factchecktitlesub{font-size:12px} .pinocchio-box{width:100%;overflow: hidden;text-align:center;padding:5px 0;display:inline-block;margin:0 auto 0} .pinocchio-box .pinocchio{border-radius: 20px;height: 90px;display:inline-block;width: 90px;margin:10px 3px;background-color:#fff;text-decoration:none} .pinocchio-box .pinocchio .count-p{color: #000;font-weight: 700;font-size: 16px;margin:10px 0 30px;text-decoration:none} .pinocchio-box .pinocchio1_off{border-radius: 20px;height:90px;text-decoration:none;background-image:url(http://ojsimg.ohmynews.com/images/ohmynews/special_site/factcheck/1level_off.png);background-size:100%} .pinocchio-box .pinocchio1_on{border-radius: 20px;width:90px;height:90px;text-decoration:none;background-color: #ffdd00;background-image:url(http://ojsimg.ohmynews.com/images/ohmynews/special_site/factcheck/1level_on.gif);background-size:100%} .pinocchio-box .pinocchio2_off{border-radius: 20px;height:90px;text-decoration:none;background-image:url(http://ojsimg.ohmynews.com/images/ohmynews/special_site/factcheck/2level_off.png);background-size:100%} .pinocchio-box .pinocchio2_on{border-radius: 20px;width:90px;height:90px;text-decoration:none;background-color: #ffdd00;background-image:url(http://ojsimg.ohmynews.com/images/ohmynews/special_site/factcheck/2level_on.gif);background-size:100%} .pinocchio-box .pinocchio3_off{border-radius: 20px;height:90px;text-decoration:none;background-image:url(http://ojsimg.ohmynews.com/images/ohmynews/special_site/factcheck/3level_off.png);background-size:100%} .pinocchio-box .pinocchio3_on{border-radius: 20px;width:90px;height:90px;text-decoration:none;background-color: #ffdd00;background-image:url(http://ojsimg.ohmynews.com/images/ohmynews/special_site/factcheck/3level_on.gif);background-size:100%} .pinocchio-box .pinocchio4_off{border-radius: 20px;height:90px;text-decoration:none;background-image:url(http://ojsimg.ohmynews.com/images/ohmynews/special_site/factcheck/4level_off.png);background-size:100%} .pinocchio-box .pinocchio4_on{border-radius: 20px;width:90px;height:90px;text-decoration:none;background-color: #ffdd00;background-image:url(http://ojsimg.ohmynews.com/images/ohmynews/special_site/factcheck/4level_on.gif);background-size:100%} .pinocchio-box .pinocchio5_off{border-radius: 20px;height:90px;text-decoration:none;background-image:url(http://ojsimg.ohmynews.com/images/ohmynews/special_site/factcheck/5level_off.png);background-size:100%} .pinocchio-box .pinocchio5_on{border-radius: 20px;width:90px;height:90px;text-decoration:none;background-color: #ffdd00;background-image:url(http://ojsimg.ohmynews.com/images/ohmynews/special_site/factcheck/5level_on.gif);background-size:100%} .pinocchio-box .pinocchio6_off{border-radius: 20px;height:90px;text-decoration:none;background-image:url(http://ojsimg.ohmynews.com/images/ohmynews/special_site/factcheck/6level_off.png);background-size:100%} .pinocchio-box .pinocchio6_on{border-radius: 20px;width:90px;height:90px;text-decoration:none;background-color: #ffdd00;background-image:url(http://ojsimg.ohmynews.com/images/ohmynews/special_site/factcheck/6level_on.gif);background-size:100%} /* 170421 10만인클럽 후원하기 버튼 추가*/ .support_bn{padding: 30px 0 20px 0} .support_bn a{display: inline-block} .support_bn a img{width: 193px} /*170721 실시간글 최종면 추천버튼 */ .article_btns .btn_rec_round{margin: 0 auto;display: block;background-color: #fdfdfd;border: 1px solid #d9d9d9;padding: 10px 20px;/* margin-bottom: 20px;*/min-width: 70px;min-height:70px;border-radius:50px} .article_btns .btn_rec_round .icon{width: 30px;height: 30px;display: block;margin: 0 auto} .article_btns .btn_rec_round .number{margin-top: 8px;display: block;font-size: 13px;color: #db0000} .article_btns .btn_rec_round.on .number{color: #db0000} .btn_rec_round .icon{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/rec_on.svg)} .btn_rec_round.on .icon{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/rec_on.svg)} .article_btns .btn_rec_round.on {border: 1px solid #db0000} /*170717 관련기사*/ .scon_thumb_list li{float: left;width: 33.3%;margin-bottom: 6px} .scon_thumb_list li a{display: inline-block;margin: 0 3px;background-color: #fff;overflow: hidden;color: #333} .scon_thumb_list a{position: relative} .scon_thumb_list .thumb{display: inline-block;overflow: hidden} .scon_thumb_list .thumb:before{content: "";width: 100%;height: 100%;z-index: 1;position: absolute} .scon_thumb_list .thumb img {width: 100%;height: 75px;object-fit: cover;object-position: center top} .scon_thumb_list .tit {z-index: 2;position: relative;bottom: 0;left: 0;padding: 5px 4px 0 5px;display: inline-block;margin-top: 6px;font-weight: normal} .scon_thumb_list .tit strong{height: inherit;font-size: 15px;letter-spacing: -0.06em;color: #222;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;word-wrap:break-word;line-height: 1.2em;font-weight: normal} /*170717 많이본뉴스*/ .small_thumb {width:100%} .small_thumb_list {background: #fff} .small_thumb_list li{position:relative;border-bottom: 1px solid #f5f5f5} .small_thumb_list li a{display: block;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;padding: 10px 5px 10px} .small_thumb_list li strong{font-size: 15px;line-height: 1.3em;color: #333;font-weight: normal;letter-spacing: -0.08em} .small_thumb_list .thumb{display: table-cell;vertical-align: middle;width: 100px;/* height: 60px;*/} .small_thumb_list .tit{display: table-cell;padding: 0 10px;vertical-align: middle} .small_thumb_list .tit strong{display: -webkit-box;overflow: hidden;text-overflow: ellipsis;-webkit-line-clamp: 2;-webkit-box-orient: vertical;padding-right: 1px;color: #222;font-weight: 400;letter-spacing: -1px;line-height: 2rem;white-space: normal;word-wrap: break-word} .swiper-pagination-bullet{cursor:pointer;margin: 0 5px} .swiper-pagination-bullets.initial {position: initial;width: 100%;padding: 5px 0px} .mostview .list_tit {font-weight:bold} .mostview .list_tit .blue {font-weight:bold} /*170718 원고료주기 버튼 추가*/ .btn_money{display:inline-block;vertical-align: inherit;border: 1px solid #d9d9d9;border-radius: 45px} .btn_money .icon {width: 18px;height: 18px;background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/pay_c.png);background-size: contain} .btn_money .number {font-size: 13px;line-height: 18px;color: #333;font-weight:bold;margin-left: 3px} .pc .btn_money .number {line-height: 15px} .article_header .btn_money{right: -5px;top: 0;margin-right: 0;position: absolute} .article_header .btn_money > span{vertical-align: top} /* 프린트 서비스 버튼 */ .article_header .btn_print {position:relative;display:inline-block;margin-right: 5px} /*170718 글씨크게보기 버튼 위치변경*/ .article_header .text_size {position:relative;display:inline-block;margin-right: 5px;vertical-align: top} .article_header .icon.btn_font_large{margin-right: 0;width: 34px;height: 34px;background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/font_big.svg);text-indent:0;font-size:15px;color:transparent} .article_header .icon.btn_font_small{margin-right: 0;width: 36px;height: 36px;background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/font_small.svg);text-indent:0;font-size:15px;color:transparent} /*글자 크기 조절 레이어*/ .article_header .font_level{z-index: 45;position: absolute;top:52px;right:0;left:-70px;background-color: #fff;border: 1px solid #ccc;border-radius: 3px;padding: 10px;width:170px} .article_header .font_level:after{position: absolute;top: -10px;right: 73px;content: "";background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/font_arrow.svg);width: 20px;height: 10px;background-position: center;background-repeat: no-repeat} .article_header .font_level h2{text-align: center;font-weight: normal;font-size: 12px;margin-bottom: 8px} .article_header .font_level ol li{float: left;display: inline-block;margin: 0 3px} .article_header .buttons .font_level ol li button{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/font_icon.svg);background-repeat: no-repeat;background-position: center;width: 30px;height: 30px;background-color: #ccc;border-radius: 15px;border: none;padding: 0;margin: 0;text-indent:0;font-size:15px;color:transparent} .article_header .font_level ol li button.on{background-color: #666666} .article_header .font_level ol li:nth-child(1) button{background-size: 32%} .article_header .font_level ol li:nth-child(2) button{background-size: 38%} .article_header .font_level ol li:nth-child(3) button{background-size: 44%} .article_header .font_level ol li:nth-child(4) button{background-size: 50%} /*후원하기*/ .support-omn{background-color: #f9f9f9;border-top: 1px solid #e6e6e6;border-bottom: 1px solid #e6e6e6;text-align: center;padding: 20px;letter-spacing: -0.05em;margin: 10px 0 30px} .support-omn > h2{color: #222;font-size: 17px} .support-omn > p{color: #666;font-size: 13px;font-weight: 400;margin-bottom: 10px} .support-omn > p > span{display: none} .support-omn > a{display: inline-block;background-color: #ff3800;border-radius: 20px;height: 40px;line-height: 40px;padding: 0 20px} .pc .support-omn > a{line-height: 37px} .support-omn > a > strong{font-size: 15px;color: #fff;font-weight: normal;margin-left: 5px} .support-omn > a > .heart{width: 13px;height: 13px;background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/supp_heart.svg);background-size: contain} .pc .support-omn > .heart{vertical-align: sub} /*추천연재*/ .rec-series{padding: 45px 20px;background-color: #323949} .rec-series > h1, .rec-series > ul{max-width: 970px;margin: 0 auto} .rec-series > h1{color: #fff;padding: 0 0 15px 10px;font-size: 18px} .rec-series > ul > li{display: inline-block;float: left;width: 50%;margin-bottom: 15px} .rec-series > ul > li > a{display: block;overflow: hidden;height: auto;margin: 0 5px} .rec-series > ul > li .thumb{display: block;height: 150px;background-size: cover;background-repeat: no-repeat;background-position: 50% 0%;background-color: #6e6e90;margin-bottom: 10px} .rec-series > ul > li h1 > *{font-weight: normal;letter-spacing: -0.03em;display: block;;line-height: 1.3em} .rec-series > ul > li .sr-tit{font-size: 12px;color: #31aec0;margin-bottom: 3px} .rec-series > ul > li .atc-tit{font-size: 15px;color: #fff;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden} /* 저작권, 오탈자신고*/ .copyright {position: relative;margin: 15px} .copyright > p{font-size: 12px;color: #333;letter-spacing: -0.03em} .copyright > *{display: inline-block;vertical-align: middle;line-height: 25px} .copyright > .naver-channel {background-image: url(images/naver-channel.jpg);background-repeat: no-repeat;background-size: contain;color: transparent} /* 팝업레이어*/ .poplayer{z-index: 10000;position: fixed;width: 100%;height: 100%;overflow: hidden;top: 0;left: 0;right: 0;bottom: 0;background: rgba(0,0,0,0.3);} .poplayer .contents{width: 78%;max-width: 300px;min-width: 250px;margin: 0 auto;margin-top: 20%;background-color: rgba(255,255,255,1);box-shadow: 0 1px 3px 0 rgba(0,0,0,.3);-webkit-box-shadow: 0 1px 3px 0 rgba(0,0,0,.3);-ms-box-shadow: 0 1px 3px 0 rgba(0,0,0,.3);-o-box-shadow: 0 1px 3px 0 rgba(0,0,0,.3);background-color: #fff;padding: 16px 20px; border-radius: 20px;} .poplayer strong{font-size: 1.7rem; line-height: 1.4em;letter-spacing: -0.05em;color: #333;font-weight: normal;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;word-wrap: break-word;overflow: hidden;margin-top:20px;margin-bottom: 20px;text-align:center;} .poplayer .article_btns {text-align: center;background-color: #fff;} .poplayer .article_btns button{padding: 13px 43px 14px;border-radius: 5px;font-size: 1.4rem;line-height: 1.2em;margin-bottom:10px;} .poplayer .article_btns .line{color: #939393;border: 1px solid #939393;} .poplayer .article_btns .full{color: #fff;background-color:#939393;} .poplayer .article_btns .line:active{ background-color: #eee;} .poplayer .article_btns .full:active{ background-color: #7d7d7d;} .poplayer .head{position: relative;padding: 14px 0 4px 0;} .poplayer .head .close_b{width: 30px;height: 30px;position: absolute;right: 5px;top: 5px;text-indent:0; font-size:15px; color:transparent;background-size: 20px;} .poplayer .article_btns .mgr5 {margin-right:5px;} .poplayer .article_btns .mgl5 {margin-left:5px;} /* 190315-펀딩*/ .atc_intro.funding{height: 460px} .funding .atc_intro_header{overflow: hidden} .funding #funding-wrap{max-width: 740px} .funding #funding-wrap .project_box{padding: 10px 0} .funding #funding-wrap .projectfx a{margin-bottom: 0} .atc-support-wrap{position: relative;text-align: center;margin: 25px 0} .atc-support-wrap::before, .atc-support-wrap::after{position: absolute;top: 50%;margin-top: -1px;content: "";height: 1px;background-color: #ddd;display: inline-block;width: 7vw} .atc-support-wrap::before{left: 0} .atc-support-wrap::after{right: 0} .atc-support-wrap > p{font-size: 17px;color: #333;margin-bottom: 10px;letter-spacing: -0.02em} .atc-support-wrap > a{display: inline-block;font-size: 14px;color: #00bcd4;height: 42px;line-height: 42px;padding: 0 20px;border-radius: 5px;border: 1px solid #00bcd4;margin: 0 3px} .atc-support-wrap > a.support{font-size: 16px;color: #fff;background-color: #00bcd4;padding: 0 30px} .atc-funding-infor{padding: 0 10%;margin: 20px 0 30px} .atc-funding-infor > h2{font-size: 18px;margin-top: 20px;color: #00bcd4} .atc-funding-infor > p{font-size: 15px} .atc-funding-infor > ol{margin-top: 10px} .atc-funding-infor > ol > li{position: relative;font-size: 15px;line-height: 1.6em;color: #333;letter-spacing: -.05em;padding-left: 12px;margin-bottom: 5px} .atc-funding-infor > ol > li::before{position: absolute;top: 9px;left: 0;content: "";width: 4px;height: 4px;border-radius: 50%;background-color: #000} .atc-support-wrap .btn-end{display: inline-block;vertical-align: middle;font-size: 14px;color: #999;height: 42px;line-height: 42px;padding: 0 20px;border-radius: 5px;border: 1px solid #bbb;margin: 0 3px;background-color: #ddd} .comment-tap{border: 1px solid #ccc;max-width: 750px;margin: 0 auto 20px} .comment-tap > a{display: inline-block;float: left;width: 50%;text-align: center;font-size: 16px;padding: 20px 0} .comment-tap > a:first-child{position: relative} .comment-tap > a:first-child::after{position: absolute;content: "";right: 0;top: 0;bottom: 0;width: 1px;background-color: #ccc} .comment-tap + .article_reply + .support-wrap{padding-top: 20px} .comment-tap a.on{font-weight: bold;background-color: #f2f2f2} /* 미디어쿼리 */ @media screen and (-webkit-min-device-pixel-ratio:1.5){ .article_reply > .box > .reply > .close {position: absolute;top: 0px;right: 0px;width: 44px;height: 44px;cursor: pointer;background: url(http://ojsimg.ohmynews.com/images/mobile_2013/news/m-icon-all.png) -116px -295px;background-size: 150px;background-repeat: no-repeat;z-index: 605} } @media screen and (-webkit-min-device-pixel-ratio:1.5){ .atc_action_fee .outbox .input_out .hphone{width:100%;height:40px;outline:none;border-style:none;background:none;font-size:16px;color:#000} } @media screen and (-webkit-min-device-pixel-ratio:1.5){ .atc_action_fee .outbox .input_out .textarea{width:100%;height:120px;outline:none;border-style:none;background:none;font-size:14px;color:#000;letter-spacing:-0.5px} } @media screen and (-webkit-min-device-pixel-ratio:1.5){ .atc_action_fee .outbox .explain li .bl{position:absolute;left:0;top:6px;width:10px;height:5px;font-size:0;background:url(http://ojsimg.ohmynews.com/images/mobile_2013/news/list_bl.png) 0 0 no-repeat;background-size:10px} } @media (max-width: 767px){ .sticky_bar .state{right: 8px} .article_titl{display: none} .article .article_header .buttons .btn_print {display: none} .article > .serial-nav .srl-before{border-top-right-radius: 10px;border-bottom-right-radius: 10px} .article > .serial-nav .srl-after{border-top-left-radius: 10px;border-bottom-left-radius: 10px} .profile-box .pro-top{padding: 10px 118px 10px 33px;height: 73px;white-space: nowrap} .profile-box .pro-bottom{display: none} .series_list > ol {display: flex;flex-direction: column-reverse;} .series_list > ol > li{margin-bottom: 8px} .series_list > ol > li > a{overflow: hidden;white-space: nowrap;text-overflow: ellipsis;line-height: 24px} .series_list > ol > li.now .s-title{color: #3338b7;text-decoration: underline;font-weight: 600} .copyright{text-align: center;margin: 0 15px} .copyright .typo-error {display: none} .copyright .naver-channel {display: block;background-color: #f0f2ed;background-size: 262px 25px;background-position: 50% 48%;padding: 20px 0;margin: 0 -30px} .copyright > p{margin: 0 0 50px} .arc-btns-wrap .btn_box button:nth-child(4), .arc-btns-wrap .btn_box button:nth-child(5){display: none} .support-omn > h2{font-weight: 400} .pro-top > .profile_club{left: 0;top: 0;width: 25px;height: 25px} .sticky_bar .atc_container .serially_titl{max-width: 63%} .sticky_bar .atc_container .serially_titl .tt02{overflow: hidden;text-overflow: ellipsis;white-space: nowrap;display: block} } @media (max-width: 480px){ .atc_intro_header >.article_tit{font-size: 3.2em;font-weight: normal} .atc_intro_header >.article_subtit{font-size: 1.8em;color: #fff;line-height: 130%;font-weight: normal;letter-spacing: -0.06em} .article > .serial-nav > div .arrow{width: 25px;height: 60px} .article > .serial-nav .srl-before .arrow{right: inherit;left: 0;background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/arrow_lt_w.svg)} .article > .serial-nav .srl-after .arrow{right: 0;left: inherit;background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/arrow_rt_w.svg)} .rec-series > ul > li .thumb{height: 110px} .series_list .top_tit{padding: 0 38px 0 70px} .sticky_bar .state li:nth-child(3){display: none} .atc-support-wrap > a.support{display: block;margin: 10px auto 10px;max-width: 160px;font-size: 15px} .atc-support-wrap > a, .atc-support-wrap .btn-end{height: 38px;line-height: 38px;font-size: 13px} } @media (max-width: 420px){ .container .navbar-header .serially_titl{width: 47%} } @media (max-width: 380px){ .pro-top > .info-box .role, .pro-top > .info-box .id{font-size: 11px} .pro-top > .info-box .name{font-size: 15px} .profile-box .profile-sl .pro-top{padding: 10px 110px 10px 23px} .profile-sl .pro-top .profile-btns{right: 25px} .profile-arrow > .swiper-button-prev, .profile-arrow > .swiper-button-next{width: 20px} .support-box .btn_money{padding: 0 8px;height: 38px;line-height: 38px} .support-box .btn_money > .number{font-size: 12px} .support-box.have_m .sup-left-r > strong{font-size: 26px} .support-box > .sup-left > .sup-left-l > span:last-child{font-size: 13px} .arc-btns-wrap .btn_box > *{margin: 0 2px} .support-omn > h2{font-size: 14px;letter-spacing: -0.05em} .pc .support-box .btn_money{line-height: 30px} .sticky_bar .atc_container .serially_titl{max-width: 57%} } @media (max-width: 379px){ .layer_reporter .contents .profile .txt {max-width: 53%;overflow: hidden} } @media (max-width: 350px){ .support-box > .sup-left{letter-spacing: -0.05em} .support-box.have_m > .sup-left > .sup-left-l > span:last-child{font-size: 13px} .support-box.have_m .sup-left-r > strong{font-size: 17px} .article_header .buttons button, .article_header .buttons a{margin-right: 2px} } @media (max-width: 320px){ .article_header .article_tit {font-size: 2.0rem} .article_btns .payment_box{height: 30px;position: relative;vertical-align: bottom;border-top: solid 1px #e5e5e5;border-bottom: solid 1px #e5e5e5;margin-bottom: 40px;padding: 14px 90px 14px 130px} .article_btns .payment_box .title{position: absolute;left: 10px;top: 15px;text-align: left;letter-spacing: -.0710px;overflow: hidden} .article_btns .payment_box .title h1{font-size: 12px;line-height: 14px;margin-bottom: 0;font-weight: normal} .article_btns .payment_box .title h2{font-size: 10px;font-weight: normal;color: #2bb4bb} /*.article_header .buttons button, .article_header .buttons a{font-size: 12px}*/ .article_header .btn_money .number {font-size: 10px} .scon_thumb_list li a .thumb img{height: 70px} .article_header .buttons button, .article_header .buttons a{font-size: 1.2rem; margin-right: 0;} .article_header .btn_money .number {font-size: 1rem;} } @media (min-width: 768px){ .sticky_bar .atc_container .article_titl{display: block;margin: 0 auto;line-height: 34px;color: #fff;text-align: center;max-width: 50%;white-space: nowrap;text-overflow: ellipsis;overflow: hidden} .sticky_bar .atc_container .article_titl > span{display: inline-block;color: #fff;line-height: 22px;height: 22px} .pc .sticky_bar .atc_container .article_titl > span{line-height: 19px} .sticky_bar .atc_container .article_titl > .number{margin-right: 5px;border: 1px solid #eee;font-size: 11px;padding: 0 8px} .sticky_bar .atc_container .article_titl > .s-title{font-size: 13px;display: inline} .sticky_bar .atc_container .serially_titl{display: inline-block;max-width: 23%} .article{margin: 0 auto 100px} .arc-btns-wrap ~ div{margin: 0 auto 30px} .profile-box .pro-top {padding-left: 104px} .profile-box .pro-top:after{content: "";display: block;clear: both} .pro-top > .face {position: absolute;left: 0;width: 90px;height: 90px;margin: 0} .pro-top > .info-box{display: inline-block} .pro-top > .info-box > .profile-btns li{padding: 0 6px 0 4px;background-color: #fff;margin: 0} .pro-top > .info-box > .profile-btns li a{width: 33px;height: 33px} .pro-top > .info-box > .profile-btns{margin-top: 5px} .rec-series{padding: 45px 0} .rec-series > ul > li{width: 25%;margin: 0} .rec-series > ul > li > a{margin: 0 10px} .reporter-wrap .profile-box > .profile-sl{margin: 20px 45px 24px} .pro-top .profile-btns{top: 6px;right: 0} .pro-top .profile-btns > li{display: inline-block} .pro-top .profile-btns > .jjim-btn{margin-left: 12px} .pro-top > .info-box > .role, .pro-top > .info-box > .id{font-size: 13px} .profile-box .pro-bottom{display: block;margin-top: 10px;padding: 0 4px 0 104px} .pro-bottom > p{font-size: 13px;color: #666;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;overflow: hidden;letter-spacing: -0.05em;height: 54px} .pro-bottom > .atc-box{margin-top: 14px;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;letter-spacing: -0.07em;border-top: 1px solid #f0f0f0;padding-top: 12px} .pro-bottom > .atc-box > span{font-size: 12px;padding-right: 8px;border-right: 2px solid #ccc} .pro-bottom > .atc-box > a{margin-left: 8px;font-size: 14px} .pc .pro-bottom > .atc-box > a{font-weight: bold;vertical-align: baseline} .series_list > ol > li{float: left;width: 25%} .series_list > ol > li:first-child:nth-last-child(2), .series_list > ol > li:first-child:nth-last-child(2) ~ li { width: 50% } .series_list > ol > li:first-child:nth-last-child(3), .series_list > ol > li:first-child:nth-last-child(3) ~ li { width: 33.333% } .series_list > ol > li:only-child {position: relative;width: 100%} .series_list > ol > li:only-child a:after {position: absolute;right: 10px;top: 28px;content: "바로가기";color: transparent;display: inline-block;width: 40px;height: 40px;background-size: contain;background-repeat: no-repeat;background-image: url(images/serial_arrow_lt.svg);} .series_list > ol > li > a{padding: 12px 14px 18px;border: 1px solid #ededed;border-right: none;height: 97px} .series_list > ol > li:first-child > a{border-left: none} .series_list > ol > li> a:hover, .series_list > ol > li> a:focus{background-color: #f0f0f0} .series_list > ol > li.now > a{background-color: #f0f0f0;border: 1px solid #959595} .series_list > ol > li > a .number{font-size: 12px} .series_list > ol > li > a > .s-title{display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;margin: 4px 0 0 2px;line-height: 1.3em} .ie .series_list > ol > li > a > .s-title{height: 40px;display: block} .series_list .more{color: #222} .support-box > .sup-left{/*height: 45px*/} .support-box .btn_money{/*margin-left: 15px*/} .support-box .btn_money .number{font-size: 14px} .support-box > .sup-left > .sup-left-l, .support-box > .sup-left > .sup-left-r{/*line-height: 45px*/} .support-box > .sup-left > .sup-left-l > span:first-child{display: inline-block;color: #000;margin-right: 4px} .support-box.have_m .sup-left-r > .sup-message{line-height: 24px;height: 24px;padding: 0 10px;top: -28px} .pc .support-box.have_m .sup-left-r > .sup-message{line-height: 22px} .copyright {height: 25px} .copyright .typo-error {display: inline-block;color: #777;text-decoration: underline;font-size: 12px;font-weight: 600} .copyright .typo-error .ico-excl {background-image: url(http://ojsimg.ohmynews.com/images/star/2016/icon_excl.svg);background-repeat: no-repeat;background-position: center left;-webkit-background-size: 16px;-moz-background-size: 16px;-ms-background-size: 16px;-o-background-size: 16px;background-size: 16px;vertical-align: text-bottom;width: 16px;height: 16px;margin-right: 5px;display: inline-block} .copyright > p{margin: 0 5px 0 0} .copyright > .naver-channel{position: absolute;right: 0;width: 262px;height: 25px} .support-omn > h2, .support-omn > p{font-weight: 400} .support-omn > p > span{font-weight: 600;display: inline-block} .pro-top > .profile_club{left: -10px;top: -10px} .article_body .photoslide_out{width: 600px;margin: 0 auto} .article_body .photoslide_name {text-align:right; padding:10px 5px 5px 5px; } .article_body .photoslide_name span{font-size:11px; color:#999} .article_body .title_slide .atitl a{width:70%;padding-left:10px;} .article_body .title_slide .page{position: absolute; bottom:5px; right:10px; height:30px; font-family: Arial; font-size:12px; color:#fff; line-height:30px;} .article_body .title_slide .page span.pon{font-size:14px; font-weight:bold; color:#db0000; padding-left:0;} .article_body .title_slide .home{position: absolute; bottom:5px; right:10px; width:30px; height:30px; background:url(http://ojsimg.ohmynews.com/images/cardnews/btn_homemenu.png) no-repeat; text-indent:-9999em;} } @media (min-width: 1024px){ #submenu.navbar-default .navbar-nav > li > a:hover {color: #8eb640} .article{max-width: 780px} .article > .serial-nav > div:hover .text{display: inline-block} .article > .serial-nav > div:hover .arrow{background-color: #888} .article > .serial-nav .tit:hover,.article > .serial-nav .subtit:hover{text-decoration: underline} .article_header .buttons button:active, .article_header .buttons a:active{background-color: #f3f3f3} .layer_reporter .close:active{background-color: #e2e2e2} .article_body .photo_box{margin: 0 auto;}/* margin: 0 62px; */ .sticky_bar .state li{margin: 0 10px} .sticky_bar .state li strong{display: block;font-size: 10px;color: #fff;font-weight: 200} .sticky_bar .state li .icon:hover, .sticky_bar .state li .icon:focus{opacity: 1} .pro-bottom > .atc-box > a:hover, .pro-bottom > .atc-box > a:focus{text-decoration: underline} .arc-btns-wrap .btn_box > *:before {position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-color: black;content: '';z-index: -1;opacity: 0;-webkit-transition: all 0.2s cubic-bezier(0.02, 0.01, 0.47, 1);transition: all 0.2s cubic-bezier(0.02, 0.01, 0.47, 1);-webkit-transform: scale(0.2);transform: scale(0.2);border-radius: 25px} .arc-btns-wrap .btn_box > *:hover, .arc-btns-wrap .btn_box > *:focus {-webkit-transition: all 0.3s cubic-bezier(0.02, 0.01, 0.47, 1);transition: all 0.3s cubic-bezier(0.02, 0.01, 0.47, 1);-webkit-transform: scale(1.12);transform: scale(1.12);} .arc-btns-wrap .btn_box > *:hover:before, .arc-btns-wrap .btn_box > *:focus:before {opacity: 0.1;-webkit-transition: all 0.3s cubic-bezier(0.02, 0.01, 0.47, 1);transition: all 0.3s cubic-bezier(0.02, 0.01, 0.47, 1);-webkit-transform: scale(1);transform: scale(1);} .arc-btns-wrap .hashtag a{font-size: 15px} } /* 책동네 추가 190619*/ .book-info-wrap{position: relative;display: block;height: 122px;border: 1px solid #d9d9d9;padding: 11px 11px 11px 100px;margin: 0 auto;letter-spacing: -0.025em;width: 450px;box-sizing: border-box;} .book-info-wrap:hover{border-color: #000;text-decoration: none} .book-info-wrap *{box-sizing: border-box} .book-info-wrap > .book-cover{position: absolute;left: 11px;display: inline-block;width: 69px;height: 100px;background-repeat: no-repeat;background-position: center top;background-size: cover} .book-info-wrap > .book-cover::after{content: "";position: absolute;left: 0;right: 0;top: 0;bottom: 0;border: 1px solid rgba(0,0,0,0.1)} .book-info-wrap > .book-txt{position: relative;height: 100%;display: block} .book-info-wrap > .book-txt > *{overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;word-wrap: break-word;} .book-info-wrap > .book-txt > h1{font-size: 18px;font-weight: 600;height: 44px;line-height: 1.2em;margin-top: 10px;color: #000} .book-info-wrap > .book-txt > p{position: absolute;bottom: 16px;font-size: 13px;font-weight: 400;color: #8f8f8f;line-height: 1.2em} .book-rec-list{width: 450px;margin: 23px auto 50px;} .book-rec-list > .title-wrap{position: relative;margin-bottom: 15px} .book-rec-list > .title-wrap > h2{font-size: 18px;font-weight: 600; font-family: Helvetica-light,'AppleSDGothicNeo-Light','Malgun Gothic','맑은 고딕',Dotum,'돋움',sans-serif;color: #333;} .book-rec-list > .title-wrap > .more{position: absolute;top: 0;right: 0;display: inline-block;font-size: 12px;border: 1px solid #ccc;border-radius: 20px;padding: 0 13px;height: 24px;line-height: 24px;text-align: center;background: none} .book-rec-link{position: relative;display: block;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;font-size: 16px;background-color: #f1f1f1;padding: 5px 15px 5px 20px;} .book-rec-link:hover{text-decoration:none;background-color: #e5e5e5;} .book-rec-link::before{content: "";position: absolute;top: 14px;left: 12px;display: inline-block;width: 2px;height: 2px;border-radius: 50%;background-color: #333;} @media (max-width: 500px){ .book-info-wrap, .book-rec-list{width: 100%;margin-bottom: 20px} .book-info-wrap > .book-txt > h1{font-size: 16px;height: 38px} .book-rec-list > .title-wrap > h2{font-size: 16px} .book-rec-link{font-size: 15px} .book-rec-list > .title-wrap > .more{top: 2px} } /*2019 동영상변경*/ .cssThumb5{position: relative;background-color: #000;margin-bottom: 20px;} .cssThumb5 > .play{position: absolute;top: 40%;left: 45%; z-index: 100; width: 70px; height:70px;} .bg-cover{display: block; background:#000; width: 100%;height: 100%;position: absolute;opacity: .7;} .cssThumb5 > .play > .mov-btn{background: url(http://ojsimg.ohmynews.com/images/mobile_2017/play.svg) 0 0px no-repeat;display: inline-block; width: 70px; height: 70px;} .cssThumb5 > .play > .mov-btn:hover{opacity:.8;} .cssEnd5{position: relative;background-color: #000;margin-bottom: 20px;} .cssEnd5 .act-box{position: absolute;width: 100%;text-align: center;top:37%; z-index: 100;} .cssEnd5 .act-box > a{display: inline-block;padding: 0px 20px;text-decoration: none;color: #fff;} .cssEnd5 .act-box > a .return-btn{background: url(http://ojsimg.ohmynews.com/images/mobile_2017/return-w.svg) 0 3px no-repeat;display: inline-block; width: 70px;height: 70px;background-size: 100%;} .cssEnd5 .act-box > a .recommend-btn{background: url(http://ojsimg.ohmynews.com/images/mobile_2017/rec-w.svg) 5px 0px no-repeat;background-size: 90%;display: inline-block;width: 70px;height: 70px;} .cssEnd5 .act-box > a > strong{display: block;color: #FFFFFF;font-size: 16px;font-family: 'AppleSDGothicNeo-Light','Malgun Gothic','맑은 고딕',Dotum,'돋움',sans-serif;padding: 5px;font-weight: 100;} .cssEnd5 .act-box > a:hover{text-decoration: none;opacity:.8;} .cssEnd5 .list-link{width: 100%;} .cssEnd5 .w{position: absolute;top:33%;} .cssEnd5 .h{position: absolute;top: 18%;} .cssEnd5 .list-link > .list {text-align: center;position: relative;} .cssEnd5 .list-link > .list > li.w-view {display: inline-block;width: 124px;} .cssEnd5 .list-link > .list > li.h-view {display: inline-block;width: 132px;margin: 0px 10px;} .cssEnd5 .list-link > .list > li > a {display: block;color: #fff;} .cssEnd5 .list-link > .list > li > a > h5 {color: #fff;line-height: 16px;text-align: left;font-weight: 400;padding: 5px;} .cssEnd5 .list-link .list-img{} .cssEnd5 .list-link .list-img:hover {transform: scale(1.03);} .cssEnd5 .list-link > .list > button{position: absolute;top:0%; background: transparent;border: none;color: transparent;} /*20주년 100대뉴스*/ .atc_intro-hundred{display: table;width: 100%; height: 52px;position: relative;padding: 0;overflow: hidden;} .atc_intro-hundred > .overlay {width: 100%;height: inherit;position: absolute;z-index: 1;top: 0; background: rgba(0, 0, 0, 0.5);} .atc_intro-hundred > .overlay > .container{height: inherit} .atc_intro-hundred > .coverbg{width: 100%;height: inherit;position: absolute;top: 0;z-index: 0;background-image: linear-gradient(-90deg, #7C8E8D, #56646F)} .atc_intro-hundred > .coverbg p.img{height: inherit;background-size: cover;-webkit-background-size:cover;-moz-background-size:cover;-ms-background-size:cover;-o-background-size:cover;background-position: center center} .article_header-hundred{padding: 40px 0px 5px 0px;} .article_header-hundred .article_tit{font-size: 2.5rem;line-height: 1.2em;font-weight: normal;letter-spacing: -0.08em;margin-top: 10px} @media (min-width: 1024px){.article_header-hundred{padding: 20px 0px 20px 0px;} .article_header-hundred .article_tit {font-size: 3rem;text-align: center;}} .article_header-hundred .article_tit em{margin: 0px 3px 5px 0px;display: inline-block;font-size: 14px;font-weight: 100;vertical-align: middle;letter-spacing: -0.5px;color: #fff;background-color: #c39825;padding: 0px 12px;font-family: 'Nanum Myeongjo','나눔명조', Georgia, serif;}