@charset "utf-8";
/*===공통========================================================*/
.gnb-wrap{width: 100%;min-width: 1200px;z-index: 1002;position: relative;left: 0;right: 0;top: 0;-webkit-box-shadow: 0px 5px 23px -8px rgba(0,0,0,0.3);-moz-box-shadow: 0px 5px 23px -8px rgba(0,0,0,0.3);box-shadow: 0px 5px 23px -8px rgba(0,0,0,0.3);background-color: #fff}
.gnb-wrap *,
.gnb-wrap a:link,
.gnb-wrap a:visited,
.gnb-wrap a:active {box-sizing: border-box;font-family: 'AppleSDGothicNeo-Light','Malgun Gothic','맑은 고딕',Dotum,'돋움',sans-serif;font-weight: 400;letter-spacing: -0.03em}
.gnb-wrap a:hover {text-decoration: none}
.gnb-wrap strong, 
.gnb-wrap b, 
.gnb-wrap h1, 
.gnb-wrap h2, 
.gnb-wrap h3, 
.gnb-wrap h4{font-weight: 600}
.gnb-wrap .icon{display: inline-block;color: transparent;background-repeat: no-repeat;background-size: contain;background-position: 50%}


/*===snb만 나오는 경우=========================================================*/
.gnb-wrap.only-snb{box-shadow: none}
.gnb-wrap.only-snb .snb-wrap > ul{padding: 0 10px;width: auto}
.gnb-wrap.only-snb .snb-wrap > ul > li a {font-size: 12px;}



/*===로고영역=========================================================*/
.logo-wrap {width: 1200px;margin: 0 auto;background-size: 90px}
.logo-wrap > .logo-box{position: absolute;z-index: 1;display: block;width: 150px;height: 85px;transition: all ease-out 0.3s}
.logo-wrap > .logo-box > a{float: left;display: inline-block;height: inherit}
.logo-wrap > .logo-box > .logo{position: relative;width: 110px;background-size: 90px;background-position: 50%}
.logo-wrap > .logo-box > .link-sitemap{width: 40px;background-image: url(images/hamberger.svg);background-size: 22px}
.logo-wrap > .logo-box > .close-sitemap{width: 40px;background-image: url(images/close.svg);background-size: 22px}

.s-news .logo-wrap > .logo-box > .logo{background-image: url(images/omn-full-logo.png);background-position: 6px 0;background-size: 90px 130px}
.mac .s-news .logo-wrap > .logo-box > .logo{background-image: url(images/omn-full-logo-mac.png)}
.s-star .logo-wrap > .logo-box > .logo{background-image: url(http://ojsimg.ohmynews.com/images/star/2016/logo-w.svg);background-position: 5px 50%}
.s-tv .logo-wrap > .logo-box > .logo{background-image: url(images/ohmytv_w.svg)}
.s-photo .logo-wrap > .logo-box > .logo{background-image: url(http://ojsimg.ohmynews.com/images/ohmyphoto2018/ohmyphoto-w.svg);background-position: 5px 50%;}
.s-club .logo-wrap > .logo-box > .logo{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/logo-ten-w.svg);background-size: 82px;background-position: 8px 50%}

/*===전체 사이트 영역=====================================================*/
.snb-wrap{position: relative;background-color: #131313;height: 32px;transition: all ease-out 0.3s;overflow: hidden}
.snb-wrap > ul{width: 1200px;margin: 0 auto;padding-left: 168px}
.snb-wrap > ul > li{display: inline-block;float: left;padding: 0 9px}
.snb-wrap > ul > li > a{display: inline-block;color: #cecece;font-size: 12px;line-height: 32px}

/*전체 사이트 영역 - 오른쪽 버튼영역*/
.snb-wrap .right-btns{float: right;padding-right: 0}
.snb-wrap .right-btns > ul > li{display: inline-block;float: left;padding: 0 8px}
.snb-wrap .right-btns > ul > li > a{display: inline-block;color: #fff;font-size: 12px;line-height: 32px}
.snb-wrap .right-btns > ul > li > .search-wrap{float: left;line-height: 32px}
.snb-wrap .right-btns > ul > li > .search-wrap > .icon{background-image: url(images/search.svg);background-size: 18px 18px;background-position: 90% 50%;color: #fff;padding-right: 29px;font-size: 12px}
.snb-wrap .right-btns > ul > li > .search-wrap.on{border-bottom: 1px solid #4d4d4d;margin-top: 4px}
.snb-wrap .right-btns > ul > li > .search-wrap.on > .icon{color: transparent;padding-right: 0;height: 23px}
.snb-wrap .right-btns > ul > li > .search-wrap.on > input[type="text"]{float: left;font-size: 12px;background-color: transparent;border: none;padding: 4px 0 4px 4px;color: #fff}



/*===현재 서비스 영역=====================================================*/
.lnb-wrap{position: relative;background-color: #fff}
.lnb-wrap > .lnb-menu{width: 1200px;margin: 0 auto;padding-left: 165px;height: 53px;line-height: 53px;transition: all ease-out 0.3s}
.lnb-wrap ul > li{display: inline-block;float: left;height: inherit}
.lnb-wrap ul > li > a{display: inline-block}
.lnb-wrap > ul > li > a{font-size: 16px;color: #000;padding: 0 12px;text-align: center}
.lnb-wrap > ul > li > a:hover,
.lnb-wrap > ul > li > a.on{position: relative;color: #db0000;font-weight: 600}
.lnb-wrap > ul > li > a:hover::after,
.lnb-wrap > ul > li > a.on::after{content: "";position: absolute;bottom: 0;height: 2px;left: 0;right: 0;background-color: #db0000}
/*mac 예외*/
.mac .s-news .lnb-wrap > ul > li:nth-child(1) > a{width: 78px}
.mac .s-news .lnb-wrap > ul > li:nth-child(2) > a{width: 100px}
.mac .s-news .lnb-wrap > ul > li:nth-child(3) > a{width: 51px}
.mac .s-news .lnb-wrap > ul > li:nth-child(4) > a{width: 110px}
.mac .s-news .lnb-wrap > ul > li:nth-child(5) > a{width: 69px}

/*현재 서비스 영역 - 하위메뉴*/
.lnb-wrap > .lnb-category-wrap{position: absolute;left: 0;right: 0;opacity: 0;background-color: #f0f0f0;height: 0;transition: all ease-out 0.3s}
.lnb-wrap > .lnb-category-wrap.on{opacity: 1;height: 40px;top: 53px}
.scroll-nav .lnb-wrap > .lnb-category-wrap.on{top: 52px}
.lnb-wrap > .lnb-category-wrap > .lnb-category{height: inherit;max-width: 1200px;margin: 0 auto;padding-left: 165px}
.lnb-wrap > .lnb-category-wrap > .lnb-category > li{margin: 0 5px}
.lnb-wrap > .lnb-category-wrap > .lnb-category > li > a{position: relative;font-size: 13px;height: 40px;line-height: 40px;padding: 0 6px;color: #000}
.lnb-wrap > .lnb-category-wrap > .lnb-category > li > a:hover{text-decoration: underline}

#dvStoryMini.lnb-category-wrap > .lnb-category{padding-left: 250px}
#dvLocalMini.lnb-category-wrap > .lnb-category{padding-left: 350px}
#dvIssueMini.lnb-category-wrap > .lnb-category{padding-left: 406px}
/*
.lnb-wrap > .lnb-category-wrap > .lnb-category > li > a:hover::after,
.lnb-wrap > .lnb-category-wrap > .lnb-category > li > a:active::after{position: absolute;content: "";bottom: 0;left: 6px;right: 6px;height: 1px;background-color: #000}
*/

/*현재 서비스 영역 - 오른쪽 버튼영역*/
.lnb-wrap > ul > li.right-btns{float: right;position: relative;border-left: 1px solid #eee}
.lnb-wrap .right-btns .clearfx {height: inherit}
.lnb-wrap .right-btns .clearfx > li > a{padding: 0 15px;border-right: 1px solid #eee}
.lnb-wrap .right-btns .clearfx > li > a:hover{background-color: #f7f7f7}
.lnb-wrap .right-btns .clearfx > li > a > *{display: inline-block;vertical-align: middle;color: #000}
.lnb-wrap .right-btns .clearfx > li > a > span{font-size: 11px;margin-right: 4px}
.lnb-wrap .right-btns .clearfx > li > a > strong{font-size: 15px;font-weight: 500}
.lnb-wrap .right-btns .support-btn .icon{width: 12px;height: 12px;background-image: url(images/heart.svg);margin: 0 0 0 5px}
.lnb-wrap .right-btns .myroom-btn .icon{width: 53px;height: inherit;background-size: 22px;background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/myroom.svg)}
.lnb-wrap .right-btns .myroom-btn.login{position: relative}
.lnb-wrap .right-btns .myroom-btn.login::after{content: "";position: absolute;right: 12px;top: 12px;width: 5px;height: 5px;border-radius: 50%;display: inline-block;background-color: #db0000}

/*현재 서비스 영역 - 오른쪽 버튼영역 - 내방*/
.lnb-wrap .myroom-wrap{position: absolute;display: none;z-index: 2;overflow: hidden;padding: 10px 15px 6px;top: 53px;right: 0;background-color: #fff;border: 1px solid #cfd4d9;border-top: none;width: 105px;transition: all ease-out 0.3s}
.scroll-nav .lnb-wrap .myroom-wrap{top: 52px}
.lnb-wrap .myroom-wrap::before{position: absolute;content: "";top: 0;left: 0;display: block;width: 51px;height: 1px;background-color: #cfd4d9}
.lnb-wrap .myroom-wrap.on{display: block}
.lnb-wrap .myroom-wrap > li{display: block;float: none;line-height: 28px}
.lnb-wrap .myroom-wrap > li.infor-box{margin: 5px 0 8px;padding: 0 5px;border-bottom: 1px solid #db0000}
.lnb-wrap .myroom-wrap > li.infor-box > span{display: block;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;line-height:1.3em}
.lnb-wrap .myroom-wrap > li.infor-box > .name{font-weight: 600;font-size: 15px;color: #000;margin-bottom: 2px}
.lnb-wrap .myroom-wrap > li.infor-box > .id{font-size: 11px;color: #999;margin-bottom: 8px}
.lnb-wrap .myroom-wrap > li > a{font-size: 13px;color: #222}
.lnb-wrap .myroom-wrap > li > a:hover{text-decoration: underline}
.lnb-wrap .myroom-wrap > li > a > .count{color: #db0000;margin-left: 3px}

/*현재 서비스 영역 - 오른쪽 버튼영역 - 로그오프*/
.lnb-wrap .logout-btns{display: none;position: absolute;z-index: 2;overflow: hidden;padding: 5px 8px;right: 0;background-color: #fff;padding: 0 8px;border: 1px solid #cfd4d9;border-top: none;width: 105px;transition: all ease-out 0.3s}
.lnb-wrap .logout-btns::before{position: absolute;content: "";top: 0;left: 0;display: block;width: 51px;height: 1px;background-color: #cfd4d9}
.lnb-wrap .logout-btns.on{display: block}
.lnb-wrap .logout-btns > li{float: none;display: block;margin: 5px 0}
.lnb-wrap .logout-btns > li > a{display: block;text-align: center;font-size: 12px;height: 30px;line-height: 28px;border-radius: 3px}
.lnb-wrap .logout-btns > li > a.login{color: #fff;background-color: #db0000;border: 1px solid #db0000}
.lnb-wrap .logout-btns > li > a.join{color: #333;border: 1px solid #e9e9e9}


/*스크롤시 현재 서비스 영역*/
.gnb-wrap.scroll-nav {position: fixed}
.gnb-wrap.scroll-nav .logo-box{height: 52px}
.gnb-wrap.scroll-nav .logo-box > .logo{background-position: 5px 50%}
.s-news.gnb-wrap.scroll-nav .logo-box > .logo{background-position: 6px -82px}
.gnb-wrap.scroll-nav .lnb-menu{height: 52px;line-height: 52px}
.gnb-wrap.scroll-nav .snb-wrap{height: 0;opacity: 0}



/*===사이트맵=========================================================*/
.sitemap-wrap{display: none;position: absolute;left: 0;right: 0;bottom: -450px;width: 1200px;height: 450px;margin: 0 auto;background-color: #f7f7f7;border: 1px solid black;padding: 15px 40px;line-height: normal}
.sitemap-wrap.on{display: block;z-index: 1001}
.sitemap-wrap a:hover::after{position: absolute;bottom: 0px;left: 0;right: 0;content: "";height: 1px;background-color: #242729}

/*사이트맵 상단*/
.sitemap-wrap > .top-row{padding: 20px 0;border-bottom: 1px solid #dadbdf;overflow: hidden}
.top-row > li{float: left;margin: 0 10px}
.top-row > li > a{position: relative;font-size: 16px;color: #000;padding: 10px}
.top-row > li > a > span{font-size: 10px;color: #6a6e7a;margin-right: 3px;vertical-align: top}
.top-row > li.right-btns {float: right}
.top-row > li.right-btns > a{font-size: 12px;color: #6a6e7a!important;margin: 0 10px;padding: 0}
.top-row > li.right-btns > a::after{content: none!important}
.top-row > li.right-btns > a > .icon{margin-left: 3px;width: 12px;height: 12px;vertical-align: baseline;border-radius: 50%;border: 1px solid #bbb;;background-image:  url(http://ojsimg.ohmynews.com/images/mobile_2017/arrow_rt_b.svg);background-size: 6px}

/*사이트맵 중간*/
.sitemap-wrap > .middle-row {padding: 22px 0;height: 310px}
.middle-row > li{display: inline-block;float: left;border-right: 1px solid #dadbdf;padding: 10px 30px 10px 20px;height: 100%;min-width: 125px}
.middle-row > li:last-child{border-right: none}
.middle-row .news{}
.middle-row .news > ul{float: left;display: inline-block}
.middle-row .news > ul > li{margin-right: 8px}
.middle-row > li > ul > li {margin: 7px 0}
.middle-row > li > ul > li a{position: relative;display: inline-block;color: #242729;font-size: 13px;font-weight: 300;padding: 2px}
.mac .middle-row > li > ul > li a{font-size: 14px}
.middle-row > li > .title{;margin-bottom: 20px}
.middle-row > li > .title a{position: relative;display: inline-block;color: #242729;font-size: 14px;font-weight: 600}

.middle-row .social-btn{margin-top: 15px}
.middle-row .social-btn > .icon{width: 15px;height: 20px;margin-right: 3px;vertical-align: middle;background-size: 14px;opacity: 0.35}
.middle-row .social-btn a:hover::after{content: none}

.social-btn .facebook{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/fb_b.svg)}
.social-btn .facebook:hover{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/fb_c.svg);opacity:1}
.social-btn .twitter{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/tw_b.svg)}
.social-btn .twitter:hover{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/tw_c.svg);opacity:1}
.social-btn .kakaostory{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/ks_b.svg)}
.social-btn .kakaostory:hover{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/ks_c.svg);opacity:1}
.social-btn .youtube{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/youtb_b.svg)}
.social-btn .youtube:hover{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/youtb_c.svg);opacity:1}

/*사이트맵 하단*/
.bottom-row{padding: 15px 10px 0;border-top: 1px solid #dadbdf;font-size: 12px}
.bottom-row > li{float: left;margin-right: 50px}
.bottom-row > li > a{display: inline-block;font-size: 13px;line-height: 25px}
.bottom-row > li > a > .icon{width: 25px;height: 25px;margin-right: 3px;vertical-align: middle}
.sitemap-wrap .icon:hover{color: transparent!important}

.bottom-row .ohmybook{color: #222;;font-weight: 300}
.bottom-row .ohmybook > .icon{background-image: url(images/omb.svg);opacity: 0.5}
.bottom-row .ohmybook:hover > .icon{opacity: 1}
.bottom-row .ctz-school{color: #222;font-weight: 500}
.bottom-row .ctz-school > .icon{background-image: url(images/citizen.svg)}
.bottom-row .ctz-school:hover > .icon{background-image: url(images/citizen_c.svg)}
.bottom-row .moi{color: #222;font-weight: 500}
.bottom-row .moi > .icon{background-image: url(images/moi.svg);margin-right: 5px}
.bottom-row .moi:hover > .icon{background-image: url(images/moi_c.svg)}
.bottom-row .trip{color: #222;font-weight: 500}
.bottom-row .trip > .icon{background-image: url(images/trip.svg);margin-right: 5px}
.bottom-row .trip:hover > .icon{background-image: url(images/trip_c.svg)}

.bottom-row > .right-btns{float: right;margin-right: 0}
.bottom-row .right-btns > *{display: inline-block;vertical-align: top;line-height: 25px}
.bottom-row > .right-btns > h2{color: #898989;font-weight: 500;font-size: 13px}
.bottom-row .right-btns li{float: left;display: inline-block;margin: 0 3px}
.bottom-row .right-btns .icon{width: 20px;height: 25px;background-size: 16px;overflow: hidden}
.bottom-row .right-btns .facebook{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/fb_c.svg)}
.bottom-row .right-btns .twitter{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/tw_c.svg)}
.bottom-row .right-btns .kakaostory{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/ks_c.svg)}
.bottom-row .right-btns .naverpost{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/nhn_c.svg)}
.bottom-row .right-btns .instagram{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/inst_c.svg)}
.bottom-row .right-btns .youtube{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/youtb_c.svg)}

.bottom-row.clearfx > li > a:hover{color: #000}
.bottom-row > li > a:hover::after,
.bottom-row .right-btns a:hover::after{content: none}



/*===서비스별 컬러=======================================================*/
.s-news .logo-box{background-color: #db0000}
.s-news .sitemap-wrap{border-color: #db0000}
.s-news .sitemap-wrap a:hover{color: #db0000}
.s-news .sitemap-wrap a:hover::after{background-color: #db0000}
.s-news .lnb-wrap > ul > li > a:hover
.s-news .lnb-wrap > ul > li > a.on{color: #db0000}
.s-news .lnb-wrap > ul > li > a:hover::after,
.s-news .lnb-wrap > ul > li > a.on::after{background-color: #db0000}
.s-news .gnb-article-wrap .list-title{color: #db0000}
.s-news .progress-container .progress-bar{background-color: #db0000}
.article-remote-wrap > a:hover{border-color: #db0000; background-color: #db0000}
.article-remote-wrap > a:hover > svg{fill: #fff}
.article-remote-wrap > a:hover::before{background-color: #db0000}
.article-remote-wrap > a:hover::after{border-top: 8px solid #db0000}

.s-star .logo-box{background-color: #76a120}
.s-star .sitemap-wrap{border-color: #76a120}
.s-star .sitemap-wrap a:hover{color: #76a120}
.s-star .sitemap-wrap a:hover::after{background-color: #76a120}
.s-star .lnb-wrap > ul > li > a:hover,
.s-star .lnb-wrap > ul > li > a.on{color: #76a120}
.s-star .lnb-wrap > ul > li > a:hover::after,
.s-star .lnb-wrap > ul > li > a.on::after{background-color: #76a120}
.s-star .gnb-article-wrap .list-title{color: #76a120}
.s-star .progress-container .progress-bar{background-color: #76a120}
.arc-wrap .article-remote-wrap > a:hover{border-color: #76a120; background-color: #76a120}
.arc-wrap .article-remote-wrap > a:hover > svg{fill: #fff}
.arc-wrap .article-remote-wrap > a:hover::before{background-color: #76a120}
.arc-wrap .article-remote-wrap > a:hover::after{border-top: 9px solid #76a120}

.s-photo .logo-box, 
.s-tv .logo-box{background-color: #4a7aba}
.s-photo .sitemap-wrap,
.s-tv .sitemap-wrap{border-color: #4a7aba}
.s-photo .sitemap-wrap a:hover,
.s-tv .sitemap-wrap a:hover{color: #4a7aba}
.s-photo .sitemap-wrap a:hover::after,
.s-tv .sitemap-wrap a:hover::after{background-color: #4a7aba}
.s-photo .lnb-wrap > ul > li > a:hover,
.s-photo .lnb-wrap > ul > li > a.on,
.s-tv .lnb-wrap > ul > li > a:hover,
.s-tv .lnb-wrap > ul > li > a.on{color: #4a7aba}
.s-photo .lnb-wrap > ul > li > a:hover::after,
.s-photo .lnb-wrap > ul > li > a.on::after,
.s-tv .lnb-wrap > ul > li > a:hover::after,
.s-tv .lnb-wrap > ul > li > a.on::after{background-color: #4a7aba}
.s-photo .gnb-article-wrap .list-title{color: #4a7aba}
.s-tv .gnb-article-wrap .list-title{color: #4a7aba}
.s-photo .progress-container .progress-bar{background-color: #4a7aba}
.s-tv .progress-container .progress-bar{background-color: #4a7aba}

.s-club .logo-box{background-color: #fb7b25}
.s-club .sitemap-wrap{border-color: #fb7b25}
.s-club .sitemap-wrap a:hover{color: #fb7b25}
.s-club .sitemap-wrap a:hover::after{background-color: #fb7b25}
.s-club .lnb-wrap > ul > li > a:hover,
.s-club .lnb-wrap > ul > li > a.on{color: #fb7b25}
.s-club .lnb-wrap > ul > li > a:hover::after,
.s-club .lnb-wrap > ul > li > a.on::after{background-color: #fb7b25}
.s-club .gnb-article-wrap .list-title{color: #fb7b25}
.s-club .progress-container .progress-bar{background-color: #fb7b25}




/*===기사 최종면 스크롤시=======================================================*/

/*현재 서비스 영역*/
.s-atc.gnb-wrap.scroll-nav {position: fixed;padding-top: 2px}
.progress-container {z-index: 2;position: absolute;top: 0;left: 0;right: 0;height: 2px}
.progress-container .progress-bar {height: inherit;width: 0%;transition: none}
.s-atc .lnb-wrap .gnb-article-wrap{width: 1200px;margin: 0 auto;overflow: hidden;padding-left: 180px;height: 0;line-height: 0;transition: all ease-out 0.3s}
.s-atc.scroll-nav .gnb-article-wrap{height: 52px;line-height: 52px}
.s-atc .lnb-wrap .gnb-article-wrap *{height: 0;line-height: 0;overflow: hidden}
.s-atc.scroll-nav .gnb-article-wrap *{height: inherit;line-height: 52px;display: inline-block;float: left}

/*현재 서비스영역 왼쪽*/
.s-atc.scroll-nav .gnb-article-wrap > .left-box{display: inline-block;white-space: nowrap;width: 585px;text-overflow: ellipsis;overflow: hidden;float: none}
.s-atc.scroll-nav .gnb-article-wrap > .left-box > .list-title{position: relative;display: inline;font-size: 14px;font-weight: 600;padding-right: 7px;margin-right: 7px;float: none;}
.s-atc.scroll-nav .gnb-article-wrap > .left-box > .list-title::after{position: absolute;content: "";display: inline-block;right: 0;top: 3px;width: 1px;height: 10px;background-color: #ccc}
.s-atc.scroll-nav .gnb-article-wrap > .left-box > a{display: inline;font-size: 14px;font-weight: 400;float: none;color: #333}
.s-atc.scroll-nav .gnb-article-wrap > .left-box > h1 > br{display: none}

/*현재 서비스영역 - 오른쪽*/
.s-atc.scroll-nav .gnb-article-wrap > .right-box{display: inline-block;float: right}
.s-atc.scroll-nav .lnb-menu,
.s-atc.scroll-nav .lnb-menu *{height: 0;line-height: 0;overflow: hidden}

/*현재 서비스영역 - 오른쪽 - 공유버튼*/
.scroll-nav .right-box > .share-list {margin-right: 10px}
.scroll-nav .right-box > .share-list > li{margin: 0 10px}
.s-atc.scroll-nav .right-box .share-list .icon{width: 25px;height: 25px;background-size: 20px;margin-top: 11px}
.scroll-nav .right-box > .share-list .facebook{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/fb_c.svg);background-size: 18px}
.scroll-nav .right-box > .share-list .twitter{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/tw_c.svg)}
.scroll-nav .right-box > .share-list .share{background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/more_on.svg);opacity: 0.6}

/*현재 서비스영역 - 오른쪽 - 추천, 댓글, 원고료*/
.scroll-nav .right-box > .state-list > li{margin-left: 10px}
.scroll-nav .right-box > .state-list .icon{width: 20px;height: 30px;background-size: contain;margin-top: 8px}
.scroll-nav .right-box > .state-list .data{position: relative;display: inline-block;border-radius: 3px;background-color: #eee;padding: 0 8px;margin: 8px 0 0 8px;height: 30px;line-height: 30px;overflow: visible;font-family: 'Helvetica Neue', sans-serif;font-size: 13px;color: #666}
.scroll-nav .right-box > .state-list .data::before{content: "";position: absolute;width: 0;height: 0;border-width: 6px;border-style: solid;border-color: transparent #eee transparent transparent;top: 8px;left: -10px}
.scroll-nav .right-box > .state-list .rec > .icon{background-image: url(images/rec.svg)}
.scroll-nav .right-box > .state-list .reply > .icon{background-image: url(images/reply.svg)}
.scroll-nav .right-box > .state-list .pay > .icon{background-image: url(images/pay.svg)}
.scroll-nav .right-box > .state-list .rec.on > .icon{background-image: url(images/rec-on.svg)}
.scroll-nav .right-box > .state-list .pay.on > .icon{background-image: url(images/pay-on.svg)}
.scroll-nav .right-box > .state-list .rec .data:empty::after{content:"추천";font-size: 13px}
.scroll-nav .right-box > .state-list .reply .data:empty::after{content:"댓글";font-size: 13px}
.scroll-nav .right-box > .state-list .pay .data:empty::after{content:"원고료주기";font-size: 13px}



.flick_btn_prev:disabled, .flick_btn_next:disabled
/*===각 사이트별 재선언=======================================================*/
/*뉴스, 스타 기사최종면 공통 - 기사 이전, 다음으로 버튼*/
#news_wrap{min-width: 1200px}
#news_wrap .article-remote-wrap{position: absolute;width: 1036px;top: 325px;left: 30px}
.article-remote-wrap > a{position: absolute;width: 38px;height: 38px;border-radius: 50%;border: 1px solid #8d8d8d;background-color: #fff;cursor: pointer;text-decoration: none}
.article-remote-wrap > a > svg{fill:#8d8d8d}
.article-remote-wrap > a.disabled{position: absolute;width: 38px;height: 38px;border-radius: 50%;border: 1px solid #eee; background-color: #eee; cursor: default;pointer-events: none;}
.article-remote-wrap > a.disabled > svg{fill:#fff}
.article-remote-wrap > a.prev-btn{left: 10px}
.article-remote-wrap > a.prev-btn > svg{transform: rotate(180deg)}
.article-remote-wrap > a.next-btn{right: 10px}
.article-remote-wrap > a:hover > svg{fill:#fff}
.article-remote-wrap > a:hover{text-decoration: none;}
.article-remote-wrap > a:hover::before{position: absolute;top: -40px;left: -10px;width: 60px;height: 30px;border-radius: 30px;text-align: center;line-height: 30px;color: #fff;font-size: 11px;text-decoration: none}
/*.article-remote-wrap > a:hover::after{content: "";position: absolute;top: -11px;left: 14px;width: 0;height: 0;border-left: 6px solid transparent;border-right: 6px solid transparent;border-top: 8px solid #db0000}*/
/*
.article-remote-wrap > a.prev-btn:hover::before{content: "이전"}
.article-remote-wrap > a.next-btn:hover::before{content: "다음"}
*/

/*오마이뉴스 - 최종면 */
#article #wrap{width: 1200px}
#article .con_wrap, 
#article #content_wrap{position: relative;background: none;width: 1076px;margin-left: 124px;padding-left: 60px;box-sizing: border-box;overflow: hidden}
#article .con_wrap::after, 
#article #content_wrap::after{content: "";z-index: -1;position: absolute;right: 0;top: 0;bottom: 0;width: 319px;background-color: #fbfbfb;border: 1px solid #ebebeb;border-top: none;border-bottom: none}
#article .con_wrap_w .aside, 
#article .con_wrap .aside, 
#article #content_wrap .aside{width: 320px}
#article .con_wrap_w .content, 
#article .con_wrap .content, 
#article #content_wrap .content {position: relative}
#article .ad_footer, #news_wrap > #footer_area{width: 1200px}
#news_wrap .content .article-remote-wrap{width: 740px;left: -60px;top: 300px}

/*오마이뉴스 - 최종면 - 왼쪽 영역*/
.ad_scroll{position: unset;top: unset;left: unset}
.atc-left-area {position: absolute;top: 60px;left: 0px;}
.atc-left-area.scroll {position: fixed;top: 70px;left: 50%;margin-left: -600px}
.atc-left-top{width: 100px;margin-bottom: 30px}
.atc-left-top > li{border-bottom: 1px solid #dedede}
.atc-left-top > li > a{position: relative;display: block;padding: 10px 35px 10px 2px}
.atc-left-top > li > a::after{position: absolute;right: 10px;top: 18px;opacity: 0.3;content: "";background-image: url(http://ojsimg.ohmynews.com/images/mobile_2017/arrow_r.svg);display: block;width: 24px;height: 18px;background-repeat: no-repeat;background-size: contain;background-position: 50%;transition: all ease-out 0.2s}
.atc-left-top > li > a:hover{text-decoration: none}
.atc-left-top > li > a:hover::after{right: 0}
.atc-left-top > li > a > *{display: block;}
.atc-left-top > li > a > span{font-size: 11px;color: #666;margin-bottom: 2px}
.atc-left-top > li > a > strong{font-size: 14px;color: #000}

/*오마이뉴스 - 와이드 최종면*/
#article #atcview_wrap{position: relative;background: none;width: 1076px;margin-left: 124px;padding: 20px 40px 0 60px;box-sizing: border-box;overflow: hidden;}


/*오마이스타 - 공통*/
.header-wrap .hide-nav{
	height: calc(100vh - 44px);
}
.arc-wrap{position: relative;width: 768px;display: block;margin-left: 282px}
.atc-wrap .B-atc{width: 1200px}

/*오마이스타 - 메인면*/
.star-main .middle-row > li{min-width: 11.5%;padding: 10px 1%}
.star-main .middle-row > .news{min-width: 19%}
/*ipad pro 까지*/
@media only screen and (min-width: 1180px){
	.star-main .middle-row > li{padding: 10px 20px}
}
@media only screen and (min-width: 972px){
	.header-wrap{display: none}
	.star-main{}
	.star-main .logo-wrap{width: 100%;max-width: 1200px;}
	.star-main .sitemap-wrap{width: 100%;max-width: 1200px;}
	.star-main .snb-wrap > ul{width: 100%;max-width: 1200px;}
	.star-main .lnb-wrap > .lnb-menu{width: 100%;max-width: 1200px;}
	.main-wrap {padding-top: 20px;}
}
@media only screen and (max-width: 1120px) and (min-width: 972px){
	.star-main .sitemap-wrap{padding: 15px 30px;}
/*	.star-main .middle-row > li{padding: 10px 12px}*/
}
@media only screen and (max-width: 971px){
	.star-main {display: none}
	.header-wrap .hide-nav{box-sizing: border-box}
}
@media only screen and (max-width: 860px){
	.header-wrap{min-width: 320px}
}
@media only screen and (max-width: 480px){
	.header-wrap .hide-nav{}
	.header-wrap .hide-nav .nav a {font-size: 18px;line-height: 1.5em}
}
/*오마이스타 - 최종면*/
.W-atc .arc-wrap{margin: 0}
.arc-wrap .article-remote-wrap{position: absolute;left: 0;top: 45vh;width: 768px}
.W-atc .arc-wrap .article-remote-wrap{width: 1100px}
.W-atc .article-remote-wrap .prev-btn{left: 30px}
.W-atc .article-remote-wrap .next-btn{right: 30px}
.B-atc > *{float: none}

/*오마이스타 - 최종면 - 왼쪽 광고*/
.B-atc .left-wrap {position: absolute;left: 0;top: 0}
.B-atc .left-wrap.scroll{position: fixed;left: 50%;margin-left: -600px;top: 50px}
.B-atc .left-wrap .atc-left-top{margin-top: 20px}

/*오마이스타 - 최종면 - 왼쪽 에디터스 초이스*/
.left-wrap .edt-choice{margin-top: 25px}
.left-wrap .edt-choice .arc-box{border: none}
.left-wrap .edt-choice li{margin-bottom: 12px}
.left-wrap .edt-choice li::after{content: "";display: block;clear: both}
.left-wrap .arc-box .thum{float: left}
.left-wrap .arc-box .thum img{width: 106px;height: 64px}
.left-wrap .arc-box .tit{padding: 5px 5px 0 13px;display: inline-block;float: left;width: 142px;box-sizing: border-box}
.left-wrap .arc-box .tit a{font-size: 13px;font-weight: 500;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;word-wrap:break-word;line-height: 17px;height: auto;letter-spacing: -0.06em }

/*오마이스타 - 최종면 - 오른쪽 광고*/
.B-atc .ad-side{position: absolute;right: 0;top: 0;display: inline-block}
.B-atc .ad-120x600.right{right: 0;margin: 0}
.xarea-wrap{clear: both}

/*십만인클럽*/
/*#wrap .s-club{-webkit-font-smoothing: unset;-moz-font-smoothing: unset;-moz-osx-font-smoothing: unset;font-smoothing: unset}*/
.s-club + .content-wrap{margin-top: 15px}

/*웹접근성 skip버튼*/
.skip{display:block;overflow:hidden;height:1px;width:1px;margin:0 -1px -1px 0;font-size:0;line-height:0}
