@charset "utf-8";
.body-wrap {padding-top: 60px;max-width: 1100px;margin: 0 auto}
.top-wrap > .page-tit{display: block;width: 100px;margin: 0 auto 20px;text-align: center;font-size: 14px;font-weight: 600;color: #4b7bba;}
.top-wrap > h3.date{display: inline-block;line-height: 1em;text-align: center;font-size: 30px;font-family: helvetica, sans-serif;font-weight: 300;color: #333;margin-bottom: 50px}
.top-wrap > .gal-tit-wrap{text-align: center;min-height: 60px}
.top-wrap > .gal-tit-wrap > *{vertical-align: middle}
.top-wrap > .gal-tit-wrap > h3{display: inline-block;line-height: 1em;font-size: 30px;font-weight: 400;color: #333}
.top-wrap > .gal-tit-wrap > .hashtag-tit{display: inline-block;line-height: 1em;font-size: 30px;font-weight: 400;color: #333;margin: 0 10px}
.top-wrap > .gal-tit-wrap > a.hashtag-tit:hover{color: #4b7bba}
.top-wrap > .gal-tit-wrap > .reporter-block{display: inline-block}
.top-wrap > .gal-tit-wrap > .reporter-block > *{display: inline-block;vertical-align: middle}
.top-wrap > .gal-tit-wrap > .reporter-block > .face{width: 60px;height: 60px;border-radius: 50%;background-size: cover;overflow: hidden;margin-right: 15px}
.top-wrap > .gal-tit-wrap > .reporter-block > .name{font-weight: 600;font-size: 25px;color: #333;margin-right: 3px}
.top-wrap > .gal-tit-wrap > .reporter-block > .id{font-weight: 300;font-size: 14px;color: #666}
.top-wrap > .gal-tit-wrap > .share-btn{width: 35px;height: 35px;border: 1px solid #d9d9d9;border-radius: 50%;margin-left: 14px;background-image: url(https://ojsimg.ohmynews.com/images/ohmyphoto2018/share.svg);background-size: 18px;background-position:7px center;}
.top-wrap > .gal-tit-wrap > .share-btn:hover{background-color: #f2f2f2}
.top-wrap > .gal-tit-wrap > .gal-date{text-align: center;font-size: 13px;color: #666;margin-top: 5px}
.top-wrap ~ .clearfx, .support-omn ~ .clearfx{text-align: right}
a.calendar-btn{position: absolute;width: 30px;height: 30px;background-size: 88%;background-image: url(https://ojsimg.ohmynews.com/images/ohmyphoto2018/calendar.svg);margin-left: 22px;/* top: 0; *//* right: 0; */}

.photo-detail{position: relative}

.gal-bar-wrap{position: relative;border: 1px solid #d9d9d9;padding: 4px 108px 4px 62px;margin: 25px 0}
.gal-bar-wrap > .gotolist-btn{position: absolute;right: 0;top: -45px;}
.gal-bar-wrap > .gal-paging{position: absolute;right: 125px;top: -40px;font-size: 14px;color: #333}
.gal-bar-wrap > .gal-paging > strong{font-weight: 400;color: #4b7bba}
.gal-bar-wrap > .gal-bar-list{position: relative;overflow: hidden;height: 101px}
.gal-bar-wrap.open > .gal-bar-list{height: 304px}


.gal-bar-list ul{height: inherit}
.gal-bar-list ul > li{position: relative;float: left;display: inline-block;width: 100px}
.open .gal-bar-list ul > li,  .gal-bar-list .swiper-slide li{margin: 0 2px 2px 1px}
.gal-bar-list ul > li.now a:after{content: "";position: absolute;left: 0;right: 0;bottom: 0;top: 0;background-color: rgba(0,0,0,0.5);border: 3px solid #5da4ff}
.gal-bar-list li > a{display: block;width: inherit;height: 100px;background-size: cover;background-repeat: no-repeat;background-position: 50% 0%}
.gal-bar-wrap > a[class*="gal-"]{position: absolute;right: 19px;top: 50%;margin-top: -25px;display: inline-block;width: 42px}
.gal-bar-wrap > a[class*="gal-"] > .icon{width: 25px;height: 25px;margin-bottom: 3px;opacity: 0.5}
.gal-bar-wrap > a.gal-open > .icon{background-image: url(https://ojsimg.ohmynews.com/images/ohmyphoto2018/gal_open.svg)}
.gal-bar-wrap > a.gal-close > .icon{background-image: url(https://ojsimg.ohmynews.com/images/ohmyphoto2018/gal_close.svg);background-size: 90%}
.gal-bar-wrap > a[class*="gal-"] > strong{font-size: 11px;color: #777;display: block;font-weight: 400;letter-spacing: -0.05em}
.gal-bar-wrap > a[class*="arrow-"]{position: absolute;top: 50%;margin-top: -20px;width: 40px;height: 40px;background-size: 22px;opacity: 0.5;border-radius: 50%}
.gal-bar-wrap > a[class*="arrow-"]:hover{background-color: #e6e6e6}
.gal-bar-wrap > .arrow-prev{left: 20px;background-image: url(https://ojsimg.ohmynews.com/images/ohmyphoto2018/prev.svg)}
.gal-bar-wrap > .arrow-next{right: 69px;background-image: url(https://ojsimg.ohmynews.com/images/ohmyphoto2018/next.svg)}

.gotolist-btn{display: inline-block;color: #888;font-size: 14px;padding: 0 10px;height: 32px;line-height: 30px;border: 1px solid #e6e6e6}
.gotolist-btn:hover{background-color: #f2f2f2}
.gotolist-btn > .view_list{background-image: url(https://ojsimg.ohmynews.com/images/ohmyphoto2018/view_list.svg);width: 16px;height: 16px;vertical-align: text-top;margin-right: 8px}
.pc .gotolist-btn > .view_list{vertical-align: text-bottom}
.photo-detail > .gotolist-btn{top: -57px;margin-right: 65px}
.photo-detail > .photo-box{position: relative;width: 970px;height: auto;margin: 0 auto;text-align: center}
.photo-detail > .photo-box > .full-btn{position: absolute;right: 20px;top: 20px;opacity: 0.5;width: 60px;height: 60px;background-image: url(https://ojsimg.ohmynews.com/images/ohmyphoto2018/photo_zoom.svg);background-size: 50px}
.photo-detail > .photo-box > .full-btn:hover{opacity: 1}
.photo-detail > .photo-box > img{max-width: 100%;height: auto}
.photo-detail > a[class*="arrow-"]{position: absolute;top: 200px;width: 80px;height: 180px;opacity: 0.5;background-size: 58px;}
.photo-detail > a[class*="arrow-"]:hover{opacity: 0.2}
.photo-detail > .arrow-prev{left:-25px;background-image: url(https://ojsimg.ohmynews.com/images/ohmyphoto2018/prev.svg)}
.photo-detail > .arrow-next{right:-25px;background-image: url(https://ojsimg.ohmynews.com/images/ohmyphoto2018/next.svg)}

.article-wrap{width: 750px;margin: 0 auto;text-align: left;padding: 60px 0 20px}
.article-wrap > .article-tit{font-size: 27px;color: #333;margin-bottom: 30px;font-weight: 600}
.article-wrap > .article-detail{color: #333;font-size: 17px;line-height: 1.5em;margin-bottom: 15px}
.article-wrap > span{font-size: 14px;color: #333;font-weight: 300}
.article-wrap > .name:after{content: "";width: 1px;height: 10px;background-color: #333;display: inline-block;margin: 0 10px}
.article-wrap > .tag-wrap{margin-top: 90px}
.article-wrap > .tag-wrap > a{float: left;display: inline-block;font-size: 15px;color: #4b7bba;margin-right: 8px}

.article-wrap > .arc-bottom-wrap{margin-top: 40px}
.article-wrap > .arc-bottom-wrap .support-omn{margin-bottom: 40px}
.article-wrap > .arc-bottom-wrap > .reporter-wrap .profile-box > .profile-sl{margin-top: 30px}
.article-wrap > .arc-bottom-wrap > .reporter-wrap .profile-box .pro-bottom > .atc-box{border-top: none}


.article-wrap > .arc-bottom-wrap .profile-pt-list{margin: 10px 35px 30px}
.article-wrap > .arc-bottom-wrap .profile-pt-list > ul > li{float: left;width: 143px;height: 110px;margin: 3px}
.article-wrap > .arc-bottom-wrap .profile-pt-list > ul > li:first-child{width: 225px;height: 225px}
.article-wrap > .arc-bottom-wrap .profile-pt-list > ul > li:last-child{position: relative;overflow: hidden;text-align: center}
.article-wrap > .arc-bottom-wrap .profile-pt-list > ul > li:last-child a{line-height: 150px;background-blend-mode: overlay;background-color: rgba(0, 0, 0, 0.7)}
.article-wrap > .arc-bottom-wrap .profile-pt-list > ul > li:last-child .more_view{background-image: url(https://ojsimg.ohmynews.com/images/ohmyphoto2018/more_view.svg);background-size: 40px;background-position: 50% 20px;color: #fff;text-align: center;font-size: 15px}
.ie .article-wrap > .arc-bottom-wrap .profile-pt-list > ul > li:last-child .more_view{opacity: 0.7;background-color: #000;display: block}
.article-wrap > .arc-bottom-wrap .profile-pt-list > ul > li > a{display: block;height: inherit;background-repeat: no-repeat;background-size: cover;background-position: 50% 0;background-image: url(https://ojsimg.ohmynews.com/images/ohmyphoto2018/basic-thumb-bg.svg)}

.article-wrap > .arc-bottom-wrap .article-list{clear: both;border-top: 8px solid #ececec;padding: 15px 0;margin-top: 15px}
.article-wrap > .arc-bottom-wrap .article-list > .list-tit{font-size: 14px;color: #333;font-weight: 600;margin-bottom: 20px}
.article-wrap > .arc-bottom-wrap .article-list > ul > li{position: relative;margin-bottom: 12px;padding-left: 10px}
.article-wrap > .arc-bottom-wrap .article-list > ul > li:before{position: absolute;left: 0;content: "";width: 2px;height: 2px;background-color: #333;border-radius: 50%;top: 10px;display: inline-block}
.article-wrap > .arc-bottom-wrap .article-list > ul > li > a{font-size: 17px;color: #333;display: inline-block;line-height: 1.3em}
.article-wrap > .arc-bottom-wrap .article-list > ul > li > a:hover{border-bottom: 1px solid #333;margin-bottom: -1px}
.arc-bottom-wrap > .cssGoList{margin-bottom:75px}
.arc-bottom-wrap > .cssGoList a.gotolist-btn{color: #888}

.article-wrap > .livere_comment{background-color: #eee}

.content-wrap > .body-wrap.rec-gall{background-color: #f4f4f4;max-width: 100%;padding: 120px 0 180px;margin-top: 100px}
.rec-gall .gal-list > li > a > .thumb-wrap{left: 20px;right: 20px;text-align:center;}
.rec-gall .gal-list > li > a > .thumb-wrap > .gal-tit > strong{font-size: 22px}

.calendar {display: none;position: absolute;top: 85px;left: 0;right: 0;margin: 0 auto;z-index: 2;padding: 0 35px 30px;background-color: #fff;border: 1px solid #d9d9d9;min-height: 385px}
.calendar.on{display: block}
.calendar-modal {display: none;position: absolute;background: #fdfdfd;border: 1px solid #e8e8e8;box-shadow: 1px 2px 3px #ddd}
.calendar-inner {position: relative;z-index: 1;-webkit-perspective: 1000;-moz-perspective: 1000;-ms-perspective: 1000;perspective: 1000;-ms-transform: perspective(1000px);-moz-transform: perspective(1000px);-moz-transform-style: preserve-3d;-ms-transform-style: preserve-3d;}
.calendar-views {transform-style: preserve-3d;}
.calendar .view {backface-visibility: hidden;position: absolute;top: 0;left: 0;*overflow: hidden;-webkit-transition: .6s;transition: .6s;}
.calendar-d .view-month,
.calendar-m .view-date {transform: rotateY(180deg);visibility: hidden;z-index: 1;}
.calendar-d .view-date,
.calendar-m .view-month {transform: rotateY(0deg);visibility: visible;z-index: 2;}
.calendar-ct{margin-top: 10px}
.calendar-ct,
.calendar-hd,
.calendar-views .week,
.calendar-views .days {overflow: hidden;}
.calendar-views {width: 100%;}
.calendar .view,
.calendar-display,
.calendar-arrow .prev,
.calendar .date-items li {float: left;}
.calendar-arrow,
.calendar-arrow .next {float: right;}
.calendar-hd {padding: 20px 35px 10px;margin: 0 -35px;line-height: 30px;    border-bottom: 1px solid #ededed;background-color: #f0f0f0}
.calendar-display {font-size: 28px;text-indent: 10px;}
.calendar-arrow,
.calendar-display {color: #999;}
.calendar li[disabled] {color: #bbb;}
.calendar li.old[disabled],
.calendar li.new[disabled] {color: #eee;}
.calendar-display .m,
.calendar-views .week,
.calendar-display:hover,
.calendar-arrow span:hover {color: #555}
.calendar-views .week li:last-child,
.calendar .days li:nth-of-type(7n){color: #507ac8}
.calendar-views .week li:first-child,
.calendar .days li:nth-of-type(7n+1){color: #ff0000}
.calendar-views .days li.old,
.calendar-views .days li.new{color: #ccc}
.calendar-views .days li.old.now,
.calendar-views .days li.new.now{opacity: 0.3}
.calendar-arrow span,
.calendar-views .days li[data-calendar-day],
.calendar-views .view-month li[data-calendar-month] {cursor: pointer;} 
.calendar li[disabled] {cursor: default;}
.calendar-arrow {width: 50px;margin-right: 10px;}
.calendar-arrow span {font: 500 26px sans-serif;}
.calendar ol li {position: relative;float: left;text-align: center;border-radius: 50%;}
.calendar .week li,
.calendar .days li {width: 40px;height: 40px;line-height: 40px;font-size: 14px}
.calendar .month-items{margin: 25px 0 0}
.calendar .month-items li {width: 70px;height: 70px;line-height: 70px;font-size: 18px;margin: 4px 0}
.calendar .days li[data-calendar-day]:hover,
.calendar .view-month li[data-calendar-month]:hover {background: #eee; }
.calendar .calendar-views .now {color: #fff !important;background: #4b7bba!important;  }
.calendar .calendar-views .selected {color: #4b7bba;background: #bbd3f1!important; }
.calendar .calendar-views .dot {position: absolute;left: 50%;bottom: 4px;margin-left: -2px; width: 4px;height: 4px;background: #4b7bba;border-radius: 50%;}
.calendar-views .now .dot {background: #fff;}
.calendar .date-items {width: 300%;margin-left: -100%;}
.calendar-label {display: none;position: absolute;top: 50%;left: 50%;z-index: 2;padding: 5px 10px;line-height: 22px;color: #fff;background: #000;border-radius: 3px;opacity: .7;filter: alpha(opacity=70);}
.calendar-label i {display: none;position: absolute;left: 50%;bottom: -12px;width: 0;height: 0;margin-left: -3px;border: 6px solid transparent;border-top-color: #000;}


/*오픈 후 수정 180822*/
/*상세페이지. 이미지 좌우버튼 클릭영역 확대, 위치고정, .photo-detail > a 부분*/

/* 지리정보박스 230823*/
.geoinfo-wrap {padding:50px 0 0 0;}
.geoinfo-wrap h2 {font-size: 15px;margin-bottom: 15px;color: #333;letter-spacing: -0.038em;text-align: left}

.geoinfo-box {border: 1px solid #cccccc;padding: 15px}
.geoinfo-wrap .map-image-api {display: inline-block;width: 100%;height: 250px;background: linear-gradient( to right, #d6dacf 20%, #9db9d1, #9db9d1);text-align: center;font-size: 18px;border: 1px #d0cec5 solid;margin-bottom: 10px}
.geoinfo-wrap .map-title {font-size: 14px;color: #333;line-height: 26px;font-family: HelveticaNeue,AppleSDGothicNeo-Regular,Arial,sans-serif,Nanum Gothic, dotum,"돋움"}
.geoinfo-wrap .map-title .list-no {font-size: 14px;color: #333;margin-right: 11px;display: none}
.geoinfo-wrap .map-list {padding: 5px 0 0 10px}
.geoinfo-wrap .map-list li {padding: 5px 0 5px 0; line-height: 20px;}
.geoinfo-wrap .map-list li:before {font-size: 14px;color: #333;text-align: center;display: inline-block;margin: 0 3px 0 2px;}
.geoinfo-wrap .map-list li a:link, a:visited, a:active, a:hover{text-decoration: none}

.geoinfo-wrap .map-list li:first-child:before {content: "①";}
.geoinfo-wrap .map-list li:nth-child(2):before {content: "②";}
.geoinfo-wrap .map-list li:nth-child(3):before {content: "③";}
.geoinfo-wrap .map-list li:nth-child(4):before {content: "④";}
.geoinfo-wrap .map-list li:nth-child(5):before {content: "⑤";}
.geoinfo-wrap .map-list li:nth-child(6):before {content: "⑥";}
.geoinfo-wrap .map-list li:nth-child(7):before {content: "⑦";}
.geoinfo-wrap .map-list li:nth-child(8):before {content: "⑧";}
.geoinfo-wrap .map-list li:nth-child(9):before {content: "⑨";}
.geoinfo-wrap .map-list li:nth-child(10):before {content: "⑩";}
.geoinfo-wrap .map-address {display: block;font-size: 12px;color: #888888;}
.geoinfo-wrap .map-address:before {
content: "";background: url(https://ojsimg.ohmynews.com/special/bicycle/images/icon-location-b.svg);width: 17px;height: 17px;background-size: 100%;display: inline-block;margin-right: 4px;vertical-align: middle;}

.geoinfo-wrap .map-item {display: block;color: #4178bc;margin: 3px 0 0 22px;font-size: 12px;}
.geoinfo-wrap .map-item i {font-style: normal;margin-right: 5px}
.geoinfo-wrap .map-address.none {display: none}
.geoinfo-box.type-thumb-none {padding: 0;}
.geoinfo-box.type-thumb-none .map-image-api {display: none}
.geoinfo-box.type-thumb-none .map-list {padding: 10px 0 10px 0}
.geoinfo-box.type-thumb-none .map-list li:before {content: "";background: url(https://ojsimg.ohmynews.com/special/bicycle/images/icon-location-b.svg);width: 32px;height: 32px;background-size: 100%;display: inline-block;margin-right: 10px;margin-left: 25px;}
.geoinfo-box.type-thumb-none .map-title {font-size: 16px;}
.geoinfo-box.type-thumb-none .map-address:before {display: none}
.geoinfo-box.type-thumb-none .map-list li a {display: inline-block;}
.geoinfo-box.type-thumb-none .map-item {display: inline-block;color: #4178bc;margin: 3px 0 0 12px}
.geoinfo-box.type-thumb-s .map-image-api {display: inline-block;width: 125px;height: 80px;background: linear-gradient( to right, #d6dacf 20%, #9db9d1, #9db9d1);text-align: center;font-size: 18px;border: 1px #d0cec5 solid;vertical-align: top;margin-bottom: 0}

.geoinfo-box.type-thumb-s .map-list {display: inline-block;padding: 0;position: relative;}
.geoinfo-box.type-thumb-s .map-list li {padding: 0 0 5px 0;}
.geoinfo-box.type-thumb-s .map-list li:before {content: "";background: url(https://ojsimg.ohmynews.com/special/bicycle/images/icon-location-b.svg);width: 22px;height: 32px;background-size: 100%;display: inline-block;margin: 5px 5px 0 10px;background-repeat: no-repeat;}
.geoinfo-box.type-thumb-s .map-list li a {display: inline-block;position: relative}
.geoinfo-box.type-thumb-s .map-title {font-size: 16px;}
.geoinfo-box.type-thumb-s .map-address:before {display: none}
.geoinfo-box.type-thumb-s .map-item {margin: 20px 0 0 35px;max-width: 380px;line-height: 22px}
.geoinfo-box.type-thumb-s .map-item i {font-style: normal;margin-right: 5px;background: #2c3b4e;border-radius: 50px;color: #fff;padding: 3px 10px;}
.geoinfo-box.type-thumb-m {max-width: 450px;margin: 0 auto;}
.geoinfo-box.type-thumb-m .map-image-api {display: inline-block;width: 100%;height: 140px;background: linear-gradient( to right, #d6dacf 20%, #9db9d1, #9db9d1);text-align: center;font-size: 18px;border: 1px #d0cec5 solid;margin-bottom: 10px}

.geoinfo-box.type-thumb-m .map-list {display: block;padding: 0;}
.geoinfo-box.type-thumb-m .map-list li {padding: 0 0 15px 0;position: relative;}
.geoinfo-box.type-thumb-m .map-list li:before {content: "";background: url(https://ojsimg.ohmynews.com/special/bicycle/images/icon-location-b.svg);width: 22px;height: 22px;background-size: 100%;display: inline-block;margin: 5px 5px 0 10px;position: absolute;}

.geoinfo-box.type-thumb-m .map-list li a {display: inline-block;padding-left: 40px;}
.geoinfo-box.type-thumb-m .map-title {font-size: 16px;}
.geoinfo-box.type-thumb-m .map-address:before {display: none}
.geoinfo-box.type-thumb-m .map-item {position: absolute;right: 0;top: 0;max-width: 240px;line-height: 22px;}
.geoinfo-box.type-thumb-m .map-item i {font-style: normal;margin-right: 5px;background: #2c3b4e;border-radius: 50px;color: #fff;padding: 3px 10px;}

/* 최종면 하단 뉴스지도 링크 231218 */
.geoinfo-link {padding: 15px 9px 15px 9px;}
.geoinfo-link p{position: relative; font-size: 15px;color: #333;font-weight: 600;letter-spacing: -0.038em;padding-left: 25px;line-height: 20px;}
.geoinfo-link p:before {content:"";background: url(https://ojsimg.ohmynews.com/css/newsMap/images/icon-marker-normal.svg) no-repeat 0 0;width: 20px;height: 25px;position: absolute;left: 0;top:0}
.geoinfo-link a {font-size: 15px;}
.geoinfo-link .text-link{font-size: 15px;color: #0073DE;font-weight: 600;text-decoration: none;margin: 0 2px 0 5px}
.geoinfo-link .text-link:hover { text-decoration:underline;}
.geoinfo-link a:after {content: "";display: inline-block;background: url(https://ojsimg.ohmynews.com/images/member2021/ico_arrow_right.svg) no-repeat;width: 15px;height: 15px;background-size: 100%;line-height: 18px;vertical-align: middle;margin-left: 2px;}

