@charset "UTF-8";

@import url('https://img.seoul.co.kr/css/webfont_pretendard.css');

/*
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.5/dist/web/static/pretendard-dynamic-subset.css');
*/


/*
@font-face {
    font-family: 'Pretendard';
    font-weight: 500;
    font-style: normal;
	font-display: fallback;
    src: local('Pretendard Medium'), local('Pretendard-Regular'),
        url('https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-Medium.woff2') format('woff2'),
        url('https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-Medium.woff') format('woff'),
		url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Medium.woff') format('woff');
}

@font-face {
    font-family: 'Pretendard';
    font-weight: 700;
    font-style: normal;
	font-display: fallback;
    src: local('Pretendard Bold'), local('Pretendard-Bold'),
        url('https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-Bold.woff2') format('woff2'),
        url('https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-Bold.woff') format('woff'),
		url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Bold.woff') format('woff');
}
*/

/* reset css */

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block;
}

caption {
    display: none;
}

html {
    scroll-behavior: smooth;

}

body {
    position: relative;
    font-family: 'Pretendard';
    font-style: normal;
    font-weight: 500;
    line-height: 170%;
}

ol,
li,
dl,
dt,
dd {
    list-style: none;
}

blockquote,
q {
    quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
    content: '';
    content: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

a,
a:hover,
a:active,
a:link,
a:visited {
    text-decoration: none;
    outline: none;
    cursor: pointer;
}

a {
    font-family: inherit;
    font-size: inherit;
    font-style: inherit;
    font-weight: inherit;
    line-height: inherit;
    letter-spacing: inherit;
    color: inherit;
}

img {
    width: 100%;
    vertical-align: middle;
}


:root {
    --bg-primary-100: #F26930;
    --bg-b-bg: #262323;
    --text-gray-100: #F8F8F8;
    --text-gray-200: #f4f4f4;
    --text-gray-300: #EEE;
    --text-gray-400: #DDD;
    --text-gray-500: #999;
    --text-gray-600: #666;
    --text-gray-700: #444;
    --text-black: #111;
    --text-white: #FFF;
    --etc-notice: #F00;
    --etc-notice-blue: #3A84FF;

}

/* headline text */
.h44 {
    color: var(--text-black, #111);
    /* PC/H_44 */
    font-family: Pretendard;
    font-size: 44px;
    font-style: normal;
    font-weight: 700;
    line-height: 60px;
    /* 136.364% */
    letter-spacing: -0.44px;
}

.h38 {
    color: var(--text-black, #111);
    /* PC/H_38 */
    font-family: Pretendard;
    font-size: 38px;
    font-style: normal;
    font-weight: 700;
    line-height: 48px;
    /* 126.316% */
    letter-spacing: -0.38px;
}

.h32 {
    color: var(--text-black, #111);
    /* PC/H_32 */
    font-family: Pretendard;
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    line-height: 44px;
    /* 137.5% */
    letter-spacing: -0.32px;
}

.h28 {
    color: var(--text-black, #111);
    /* PC/H_28 */
    font-family: Pretendard;
    font-size: 28px;
    font-style: normal;
    font-weight: 700;
    line-height: 40px;
    /* 142.857% */
    letter-spacing: -0.28px;
}

.h24 {
    color: var(--text-black, #111);
    /* PC/H_24 */
    font-family: Pretendard;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 34px;
    /* 141.667% */
    letter-spacing: -0.24px;
}

.h20 {
    color: var(--text-black, #111);
    /* PC/H_20 */
    font-family: Pretendard;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 150% */
    letter-spacing: -0.2px;
}

.h18 {
    color: var(--text-black, #111);
    /* PC/H_18 */
    font-family: Pretendard;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 166.667% */
    letter-spacing: -0.18px;
}

.h16 {
    color: var(--text-black, #111);
    /* PC/H_16 */
    font-family: Pretendard;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 26px;
    /* 162.5% */
    letter-spacing: -0.16px;
}

.h15 {
    color: var(--text-black, #111);
    /* PC/H_15 */
    font-family: Pretendard;
    font-size: 15px;
    font-style: normal;
    font-weight: 700;
    line-height: 22px;
    /* 146.667% */
    letter-spacing: -0.15px;
}

.h14 {
    color: var(--text-black, #111);
    /* PC/H_14 */
    font-family: Pretendard;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
    /* 171.429% */
    letter-spacing: -0.14px;
}

.e14 {
    color: var(--text-black, #111);
    /* PC/EN_14 */
    /*font-family: Montserrat;*/
	font-family: Pretendard;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
    /* 171.429% */
    letter-spacing: -0.28px;
}

/* body text */
.body20 {
    color: var(--text-black, #111);
    /* PC/body_20 */
    font-family: Pretendard;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 32px;
    /* 160% */
    letter-spacing: -0.2px;
}

.body18 {
    color: var(--text-black, #111);
    /* PC/body_18 */
    font-family: Pretendard;
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 32px;
    /* 177.778% */
    letter-spacing: -0.18px;
}

.body16 {
    color: var(--text-black, #111);
    /* PC/body_16 */
    font-family: Pretendard;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 28px;
    /* 175% */
    letter-spacing: -0.16px;
}

.body15 {
    font-family: Pretendard;
    font-size: 15px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    /* 160% */
    letter-spacing: -0.15px;
}

.body14 {
    color: var(--text-black, #111);
    /* PC/body_14 */
    font-family: Pretendard;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    /* 171.429% */
    letter-spacing: -0.14px;
}


.body13 {
    color: var(--text-black, #111);
    /* PC/body_13 */
    font-family: Pretendard;
    font-size: 13px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px;
    /* 153.846% */
    letter-spacing: -0.13px;
}

.colorPrimary {
    color: var(--bg-primary-100);
}

.colorRed {
    color: var(--etc-notice);
}

.color111 {
    color: var(--text-black);
}

.color000 {
    color: var(--bg-b-bg);
}

.colorFFF {
    color: var(--text-white);
}

.color700 {
    color: var(--text-gray-700);
}

.color600 {
    color: var(--text-gray-600);
}

.color500 {
    color: var(--text-gray-500);
}

.color400 {
    color: var(--text-gray-400);
}

.color300 {
    color: var(--text-gray-300);
}

.color200 {
    color: var(--text-gray-200);
}

.color100 {
    color: var(--text-gray-100);
}

.flexLayout {
    display: flex;
    justify-content: space-between;
    gap: 40px;
}

main {
    position: relative;
}


main h4:hover,
main h2:hover,
.newsFrame .seoulMH_newsList li h4:hover,
.listPage-wrapper h2:hover,
.newsBox .articleTitle:hover ,
.viewRightSide h2:hover,
.viewRightSide h4:hover,
.viewRightSide .articleTitle:hover,
.articleBottomList h3:hover{
    transition: all .25s;
    color:var(--text-gray-600);
    cursor: pointer;
}

.layoutSectionBlock {
    width: 1280px;
    margin: 0 auto;
    margin-bottom: 100px;
}

/* block title */
.noBorder .layoutTitle,
.noBorder .calendar_wrap {
    padding-top: 0;
}

.layoutTitleWrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.layoutBorder {
    width: 100%;
    position: relative;
}

.layoutBorder:before {
    position: absolute;
    display: block;
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background: var(--bg-b-bg);
    border-radius: 20px;
}

.sub-layoutBorder {
    width: 100%;
    position: relative;
}

.sub-layoutBorder:before {
    position: absolute;
    display: block;
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background: var(--bg-b-bg);
    border-radius: 20px;
}


.layoutTitle {
    display: flex;
    justify-content: space-between;
    padding-top: 20px;
}

.layoutTitle.noTitle {
    padding-top: 0;
}

.topicWrap {
    display: flex;
    gap: 4px;
}

.topicWrap h3 {
    flex-shrink: 0;
}


.infoIconWrap {
    position: relative;
    width: 100%;
}

.infoIcon {
    cursor: pointer;
    display: block;
    text-indent: -9999px;
    font-size: 0;
    color: transparent;
    width: 30px;
    height: 30px;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp);
    background-repeat: no-repeat;
    background-position: -114px -117px;
}

.flotingInfo {
    display: none;
    position: absolute;
    top: -34px;
    left: 0;
    padding: 2px 12px;
    border-radius: 6px;
    background: var(--bg-primary-100);
}

.flotingInfo:after {
    z-index: -1;
    content: "";
    position: absolute;
    top: 8px;
    left: 4px;
    width: 21px;
    height: 21px;
    transform: rotate(-60deg) skewX(-30deg) scale(1, 0.866);
    background: var(--bg-primary-100);
    border-bottom-left-radius: 2px;
}

.sectionContentWrap {
    margin-top: 40px;
}

.sectionContentWrap .articleImage {
    border-radius: 12px;
    /* margin-bottom: 8px; */
}

.introduction .sectionContentWrap h2 {
    margin-bottom: 4px;
}

.blockTitle a {
    display: flex;
    align-items: center;
    gap: 4px;
}

.blockTitle a {
    padding-right: 22px;
}

.blockTitle a.arrowBg {
    position: relative;
}

.blockTitle a.arrowBg:after {
    display: block;
    content: '';
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat;
    background-position: -74px -71px;
    width: 11px;
    height: 20px;
}

.blockTitle {
    display: flex;
    align-items: center;
    gap: 4px;
}

.blockTitle span.outLink {
    cursor: pointer;
    text-indent: -9999px;
    color: transparent;
    font-size: 0;
    width: 16px;
    height: 22px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp");
    background-repeat: no-repeat;
    background-position: -265px -226px;
}

.blockSubTitle {
    position: relative;
    padding-right: 20px;
}

.blockSubTitle.subArrow:after {
    position: absolute;
    top: 0;
    right: 0;
    content: '';
    display: block;
    width: 16px;
    height: 16px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp");
    background-repeat: no-repeat;
    background-position: -298px -72px;
}

/* badge */
.badge {
    display: block;
    padding: 1px 8px;
    border-radius: 4px;
    color: transparent;
    text-align: center;
    font-size: 0;
    text-indent: -99999px;
    font-weight: 700;
    line-height: 20px;
    letter-spacing: -0.12px;
}

/* 단독 */
.badge.only {
    width: 21px;
    height: 20px;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp);
    background-repeat: no-repeat;
    background-position: -238px -339px;
}

/* 속보 */
.badge.flash {
    position: relative;
    width: 28px;
    height: 20px;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp);
    background-repeat: no-repeat;
    background-position: -74px -339px;
}

/* 기획 */
.badge.special {
    width: 29px;
    height: 20px;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp);
    background-repeat: no-repeat;
    background-position: -182px -339px;
}

.pc-footer.layout-wrapper,

.header-wrap.layout-wrapper,
.special-template .layout-wrapper {
    min-width: 1280px;
    width: 1280px;
    margin: 0 auto;
}


.layout-wrapper {
    width: 1280px;
    margin: 0 auto;
}

.scroll-fixedHeader {
    display: flex;
    left: 0;
    top: 0;
    width: 100%;
}

.viewFixedHeader {
    display: none;

}

.fixedHeaderShow {
    position: fixed;
    width: 100%;
    left: 0;
    display: none;
    z-index: 9999;
}

.fixedHeaderShow.open {
    position: fixed;
    width: 100%;
    left: 0;
    display: block;
    z-index: 9999;
}

.sticky {
    position: fixed;
    width: 100%;
    top: 0;
    left: 0;
    display: block;
    z-index: 9999;
}

.progressWrap {
    position: absolute;
    bottom: -1px;
    width: 100%;
}

.progressBar {
    height: 4px;
    background-color: var(--bg-primary-100);
    position: absolute;
    bottom: 1px;
}

.fixedHeader {
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--text-white);
    border-bottom: 1px solid var(--text-gray-300);
}

.fixedHeader .header-logo {
    width: 23px;
    height: 33px;
}

.fixedHeader-wrap {
    width: 1280px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 0;
}

.fixedHeader .util-wrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 24px;
}

.fixedHeader .listPageNav {
    display: flex;
    gap: 25px;
}

.fixedHeader-wrap .articleTitle {
    display: flex;
    align-items: center;
    gap: 8px;
}

.fixedHeader .listPageNav .pageTitle {
    position: relative;
}

.fixedHeader .listPageNav .pageTitle:after {
    position: absolute;
    content: '';
    display: block;
    top: 50%;
    right: -13px;
    transform: translateY(-50%);
    width: 1px;
    height: 16px;
    background: var(--text-gray-400);
}

.fixedHeader .listPageNav li.on {
    font-size: 16px;
    font-weight: 700;
    line-height: 26px;
    letter-spacing: -0.16px;
    color: var(--bg-primary-100, #F26930);
}

/* viewPage-fixedHeader */
.viewPage-fixedHeader {
    z-index: 10;
    position: fixed;
    top: 0;
    left: 0;
    padding: 17.5px 0;
    width: 100%;
    background: var(--text-white);
    border-bottom: 2px solid var(--text-gray-300);
}

.viewPage-fixedHeader .layout-wrapper {
    display: flex;
    justify-content: space-between;
}

.viewPage-fixedHeader .logo {
    width: 23px;
    height: 33px;
    background: url("https://img.seoul.co.kr/img/n24/fixedHeader-logo.png") no-repeat;
    background-position: 0 0;
}

.viewPage-fixedHeader .articleTitle {
    display: flex;
    align-items: center;
    gap: 8px;
}

.viewPage-fixedHeader .rightList {
    display: flex;
    align-items: center;
    gap: 24px;
}

.fixedHeader .nav-wrap .viewTool {
    display: flex;
    gap: 8px;
}

.fixedHeader .nav-wrap .viewTool>li {
    cursor: pointer;
    padding: 4px;
}

.fixedHeader .nav-wrap .viewTool .btn {
    cursor: pointer;
}

.fixedHeader .nav-wrap>.viewTool>li .btn {
    display: block;
    width: 24px;
    height: 24px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
}

.fixedHeader .nav-wrap .viewTool li:nth-child(1) .btn {
    background-position: -173px -254px;
}

.fixedHeader .nav-wrap .viewTool li:nth-child(2) .btn {
    background-position: -85px -252px;
}

.fixedHeader .nav-wrap .snsSharePopupBox {
    display: none;
    right: 59px;
    top: 74px;
    left: auto;
}

.fixedHeader .viewTool .replyNum {
    position: absolute;
    top: -4px;
    right: -12px;
    display: block;
    background: var(--etc-notice);
    border-radius: 20px;
    padding: 0 5px;
    min-width: 16px;
    text-align: center;
}


.joinPopup {
    display: none;
    z-index: 100;
    position: fixed;
    bottom: 24px;
    left: 24px;
}

.joinPopup .wrapper {
    width: 312px;
    box-sizing: border-box;
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 20px;
    background: var(--text-white);
    border: 1px solid var(--text-gray-400);
    border-radius: 12px;
    padding: 24px;
    color: var(--text-gray-400);
}

.joinPopup .seoulLogo {
    vertical-align: text-top;
    display: inline-block;
    width: 66px;
    height: 18px;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat;
    background-position: 0px -198px;
}

.joinPopup .closeBtn {
    cursor: pointer;
    position: absolute;
    top: 16px;
    right: 16px;
    width: 24px;
    height: 24px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -199px -225px;
}

.joinPopup .loginBtn {
    text-align: center;
    padding: 12px 0;
    border-radius: 8px;
    background: var(--bg-primary-100);
}


/* hamburgerMenu open */
.hamburgerMenu-depth {
    display: none;
    position: fixed;
    z-index: 9998;
    width: 100%;
    /* padding: 105px 0 0px; */
    padding: 40px 0 0;
    background: var(--text-white);
    border-bottom: 1px solid var(--text-gray-400);
}

.hamburgerMenu-depth.open,
.m-hamburgerMenu-depth.open {
    display: block;
}

.hamburgerMenu-top .layout-wrapper {
    display: flex;
    justify-content: space-between;
}

.header-sitemap {
    width: 100%;
    display: flex;
    justify-content: space-between;
    padding-right: 25px;
    border-right: 1px solid var(--text-gray-400);
}

.header-sitemap .column-layout {
    display: flex;
    flex-direction: column;
    gap: 40px 0;
}

.header-sitemap dt {
    font-size: 16px;
    font-weight: 700;
    line-height: 26px;
    letter-spacing: -0.16px;
    color: var(--text-black);
    padding-bottom: 12px;
}

.header-sitemap dd {
    color: var(--text-gray-600);
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 32px;
    letter-spacing: -0.14px;
    padding-right: 32px;
}

.header-sitemap dd a.on {
    color: var(--bg-primary-100, #F26930);
    font-size: 14px;
    font-weight: 700;
    line-height: 24px;
    /* 171.429% */
    letter-spacing: -0.14px;
}

.hamburgerMenu-top .rightSide {
    box-sizing: border-box;
    padding: 0 0 0 40px;
}

.inputSearch {
    width: 290px;
    position: relative;
}

.inputSearch .input-searchBox {
    box-sizing: border-box;
    display: flex;
    width: 100%;
    padding: 12px 20px;
    justify-content: space-between;
    align-items: center;
    border-radius: 6px;
    background: var(--text-gray-200);
    border: 0;
}

.inputSearch .input-searchBox::placeholder {
    color: #AAA;
}

.inputSearch a {
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
}

.inputSearch .input-searchBtn {
    text-indent: -9999px;
    color: transparent;
    font-size: 0;
    width: 24px;
    height: 24px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -177px -120px;
}

.hamburgerMenu-top .rightSide .keywordSearch ul {
    padding-top: 16px;
    ;
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}

.hamburgerMenu-top .rightSide .keywordSearch ul li div {

    padding: 4px 16px;
    border: 1px solid var(--text-gray-300);
    border-radius: 20px;
}

.hamburgerMenu-top .rightSide .keywordSearch ul li div:hover {
    transition: all .3s;
    background: var(--text-gray-100);
}

.newsLanking ol {
    counter-reset: rankingTop 0;
}

.newsLanking ol li {
    position: relative;
    padding-left: 26px;
    margin-bottom: 10px;
}


.newsLanking {
    margin-top: 50px;
    width: 290px;
}

.newsLanking h3 {
    margin-bottom: 16px;
}

.newsLanking .newsLankingNum.top3 {
    background: #F3670D;
}

.newsLanking .newsLankingNum {
    background: #AAA;
}

.newsLanking ol li:before {
    position: absolute;
    left: 0;
    display: inline-block;
    counter-increment: rankingTop;
    content: counter(rankingTop);
    color: #FFF;
    text-align: center;
    font-size: 12px;
    font-weight: 700;
    line-height: 20px;
    width: 20px;
    height: 20px;
    flex-grow: 0;
    flex-shrink: 0;
    background: #F3670D;
}

.newsLanking ol li:nth-child(n+4):before {
    background: #AAA;
}


.hamMenu-bottom {
    margin-top: 52px;
    background: var(--text-gray-200, #F4F4F4);
}

.hamMenu-bottom .layout-wrapper {
    display: flex;
    justify-content: space-between;
    padding: 19px 0;
}

.hamMenu-bottom .leftSide ul.listWrap {
    display: flex;
    gap: 0 24px;
}

.hamMenu-bottom .leftSide ul.listWrap li {
    position: relative;
}

.hamMenu-bottom .leftSide ul.listWrap>li:not(:last-child):after {
    position: absolute;
    top: 50%;
    right: -14px;
    transform: translateY(-50%);
    content: '';
    display: block;
    width: 3px;
    height: 3px;
    background: var(--text-gray-500);
    border-radius: 10px;
}

.hamMenu-bottom .rightSide {
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    gap: 0 32px;
}

.hamMenu-bottom .rightSide .snsWrap ul {
    display: flex;
    gap: 0 16px;
}

.hamMenu-bottom .rightSide .snsWrap ul li {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 24px;
    height: 24px;
}

.hamMenu-bottom .rightSide .snsWrap ul li a .icon {
    width: 24px;
    height: 24px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp");
    background-repeat: no-repeat;
    overflow: hidden;
    color: transparent;
    font-size: 0;
    text-indent: -99999px;
}

.hamMenu-bottom .rightSide .snsWrap ul li a .facebookBtn {
    background-position: -150px -162px;
}

.hamMenu-bottom .rightSide .snsWrap ul li a .twitterBtn {
    background-position: -252px -162px
}

.hamMenu-bottom .rightSide .snsWrap ul li a .kakaoBtn {
    background-position: -184px -162px
}

.hamMenu-bottom .rightSide .snsWrap ul li a .youtubeBtn {
    background-position: -184px -162px
}

.hamMenu-bottom .rightSide .snsWrap ul li a .instaBtn {
    background-position: -218px -162px
}

.hamMenu-bottom .rightSide .snsWrap ul li a .naverBtn {
    background-position: -286px -162px
}

.hamMenu-bottom .rightSide .snsWrap ul li a .naverBlogBtn {
    background-position: -574px -162px;
}

/* 0802 */
.owl-theme .owl-dots .owl-dot.active span,
.owl-theme .owl-dots .owl-dot:hover span {
  background: var(--bg-b-bg);
}

.owl-theme .owl-dots .owl-dot span {
  width: 8px;
  height: 8px;
  margin: 6px 6px;
  background: #BEBDBD;
}

#slick-headlineBranch .owl-nav.disabled+.owl-dots {
  margin: 24px 0;
}

#slick-photoNews .owl-stage-outer{
	height:255px;
}

.sectionContentWrap #slick-photoNews h2{
    width: 300px;
}

.owl-theme .owl-nav .disabled,
button.disabled {
  opacity: 0.6;
}
/* ---- */


.header-wrap {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    padding: 20px 0 22px;
}

.header-bottom {
    position: relative;
}

.header-bottom:after {
    content: '';
    display: block;
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 4px;
    border-radius: 10px;
    background: var(--bg-primary-100);
}

.header-logo {
    width: 227px;
    height: 80px;
}

.header-right {
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.nav-wrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
}

.nav-menuList {
    display: flex;
    gap: 24px;
    justify-content: space-between;
    align-items: center;
}

.nav-menuList li {
    flex-shrink: 0;
}

.view-nav-searchBtn,
.nav-searchBtn {
    width: 32px;
    height: 24px;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp?ver=001) no-repeat;
    background-position: -727px -120px;
    overflow: hidden;
}

.view-nav-searchBtn>img,
.nav-searchBtn>img {
    vertical-align: baseline;
}

.utilMenu {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}

.utilBtn {
    padding: 4px 12px;
    border-radius: 8px;
    background: var(--text-gray-200, #F4F4F4);
}

.utilBtn .loginBlock {
    display: flex;
    gap: 21px;
}

.utilBtn .loginBlock>a {
    display: inline-block;
}

.utilBtn .loginBlock>a:first-child {
    position: relative;
}

.utilBtn .loginBlock>a:first-child:after {
    display: block;
    content: '';
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: -11px;
    width: 1px;
    height: 10px;
    background: var(--text-black);
}

.utilBtn.loginState {
    display: block;
}

.utilBtn.logoutState {
    display: none;
}

.utilMenu .newsLetterBtn {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 9px;
    color: #fff;
    background: var(--bg-b-bg, #262323);
}

.utilMenu .newsLetterBtn span {
    width: 16px;
    height: 12px;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat;
    background-position: -68px -126px;
    overflow: hidden;
}

/* focus on / On-line Special */
.focusArticle {
    width: 1280px;
    margin: 0 auto;
    padding: 16px 0;
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid var(--text-gray-400);
}

.focusArticle .category {
    padding-right: 16px;
}
.focusArticle .articleTitle{
 padding:0 12px;
 position: relative;
}

.focusArticle .articleTitle2:before {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    width: 1px;
    height: 11px;
    background: var(--text-gray-400);
}

.articleTitle3 {
    position: relative;
    padding-right: 12px;
}

.articleTitle3:not(:first-of-type){
    padding-left: 12px;
}

.articleTitle3:last-of-type{
    padding-right: 0;
}

.articleTitle3:not(:first-of-type):before  {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    width: 1px;
    height: 11px;
    background: var(--text-gray-400);
}

.onLineSpecial,
.focusOn {
    display: flex;
    align-items: center;
}

.onLineSpecial .focusArticle .articleTitle {
    padding: 0 12px;
}

.focusArticle .onLineSpecial .category {
    padding-right: 4px;
}

#slick-onLineSpecial {
    position: relative;
    width: 425px !important;
	height: 20px;
}

#slick-onLineSpecial:after {
    position: absolute;
    display: block;
    content: '';
    top: 0;
    right: 0px;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0) 40%, rgba(255, 255, 255, 1) 84%, rgba(255, 255, 255, 1) 100%);
    width: 100px;
    height: 100%;
}

#slick-onLineSpecial li {
    box-sizing: border-box;
    position: relative;
    float: left;
    height: auto
}

#slick-onLineSpecial li:not(:first-child):after {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: -1px;
    width: 1px;
    height: 11px;
    background: var(--text-gray-400);
}

.arrowSlider {
    display: flex;
    gap: 4px;
}


.onLineSpecial #arow_prev {
    top: 0;
    left: 0;
    transition: all .3s;
    width: 24px;
    height: 24px;
    cursor: pointer;
}

.onLineSpecial #arow_next {
    position: relative;
    top: 0;
    left: auto;
    right: 0;
    width: 24px;
    height: 24px;
    cursor: pointer;
}

.onLineSpecial #arow_prev:before {
    content: '';
    opacity: 1;
    position: absolute;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat center;
    background-position: -1px -69px;
    width: 24px;
    height: 24px;
}

.onLineSpecial #arow_next:before {
    content: '';
    opacity: 1;
    position: absolute;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat center;
    background-position: -37px -69px;
    width: 24px;
    height: 24px;
}

.onLineSpecial #arow_prev,
.onLineSpecial #arow_next {
    opacity: 1;
}

/*---- 0802 ----*/
.onLineSpecial .owl-prev {
  border: 0;
  background: 0;
  position: relative;
  top: 0;
  left: 0;
  transition: all .3s;
  width: 24px;
  height: 24px;
  cursor: pointer;
}

.onLineSpecial .owl-prev::before {
  content: '';
  opacity: 1;
  position: absolute;
  top: 0;
  left: 0;
  background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat center;
  background-position: -1px -69px;
  width: 24px;
  height: 24px;
}

.onLineSpecial .owl-next {
  border: 0;
  background: 0;
  position: relative;
  top: 0;
  left: 0;
  transition: all .3s;
  width: 24px;
  height: 24px;
  cursor: pointer;
}

.onLineSpecial .owl-next::before {
  content: '';
  opacity: 1;
  position: absolute;
  top: 0;
  left: 0;
  background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat center;
  background-position: -37px -69px;
  width: 24px;
  height: 24px;
}
/*------------*/



/* main-top */

.todayDate {
    width: 1280px;
    margin: 4px auto 18px;
    color: #747474;
    font-size: 11px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px;
    letter-spacing: -0.11px;
    text-align: right;
}

.main-top {
    padding: 0 0 100px;
}

.main-top-layout {
    margin: 0 auto;
    width: 1280px;
    display: flex;
    justify-content: space-between;
}

.layout-block-group {
    display: flex;
    justify-content: space-between;
    gap: 40px;
}

.headlineNews {
    width: 610px;
}

.imageWrap {
    display: flex;
    justify-content: center;
    align-items: center;
}

.headlineNews .mainNews-top {
    position: relative;
}

.headlineNews .mainNews {
/*
    border-bottom: 1px solid var(--text-gray-300);
    border-bottom-left-radius: 12px;
    border-bottom-right-radius: 12px;
*/
}

.mainNews {
    position: relative;
    overflow: hidden;
	/*
    width: 610px !important;
    height: 407px;
	*/
}

.headlineNews .articleImage {
    position: relative;
    width: 610px;
    height: 407px;
    border-radius: 12px;
    overflow: hidden;
}

.main-top-layout .headlineNews .articleImage>img {
    position: absolute;
    margin-left: 0;
    margin-right: 0;
    width: 610px;
}

.headlineNews .articleImage:after {
    display: block;
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 274px;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, #000 100%);
    opacity: .6;
    border-radius: 12px;
}


/* 20241111 탑포토 슬라이드 */
                                .headlineNews .articleImage.topSlide {
									/*
                                    position: relative;
                                    width: 610px;
                                    height: 407px;
                                    border-radius: 12px;
                                    overflow: hidden;
									*/
                                    display: flex !important;
                                    align-items: center;
                                    justify-content: center;
                                    background: var(--text-gray-200);
                                }

                                .main-top-layout .headlineNews .articleImage.topSlide > img {
								/*
                                    position: absolute;
                                    margin-left: 0;
                                    margin-right: 0;
									*/
									z-index: 10;
                                    max-width: 610px;
                                    width: auto;
                                    height: 100%;
                                    border-radius: 0;
                                }

                                .btn-32 .owl-prev:before {
                                    z-index: 10;
                                    content: '';
                                    opacity: 1;
                                    position: absolute;
                                    top: 0;
                                    left: 0;
                                    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat center;
                                    background-position: -1px -9px;
                                    width: 33px;
                                    height: 33px;
                                }

                                .btn-32 .owl-prev {
                                    z-index: 10;
                                    border: 0;
                                    background: 0;
                                    cursor: pointer;
                                    position: absolute;
                                    top: 50%;
                                    left: 15px;
                                    transform: translateY(-50%);
                                    transition: all .3s;
                                    width: 33px;
                                    height: 33px;
                                }

                                .btn-32 .owl-prev:hover:before {
                                    background-position: -212px -9px;
                                    width: 33px;
                                    height: 33px;
                                }

                                .btn-32 .owl-next {
                                    z-index: 10;
                                    border: 0;
                                    background: 0;
                                    cursor: pointer;
                                    position: absolute;
                                    top: 50%;
                                    transform: translateY(-50%);
                                    left: auto;
                                    right: 15px;
                                    width: 33px;
                                    height: 33px;
                                }

                                .btn-32 .owl-next:before {
                                    z-index: 10;
                                    content: '';
                                    opacity: 1;
                                    position: absolute;
                                    top: 0;
                                    left: 0;
                                    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat center;
                                    background-position: -44px -9px;
                                    width: 33px;
                                    height: 33px;
                                }

                                .btn-32 .owl-next:hover:before {
                                    background-position: -256px -9px;
                                    width: 33px;
                                    height: 33px;
                                }

                                #mainNewsPhoto-arrowSlider button {
                                    opacity: 0;
                                }

                                .mainNews:hover #mainNewsPhoto-arrowSlider button {
                                    transition: all .15s;
                                    opacity: 1;
                                }

                                #owl-mainNewsPhoto {
                                    overflow: hidden;
                                    border-radius: 12px;
                                }

								#owl-mainNewsPhoto .bg_blur { background-size: cover; background-position: center; filter: blur(15px); width: 100%; height: 100%; transition: opacity 0.8s; opacity: 0; }
								#owl-mainNewsPhoto .owl-item.active .bg_blur { opacity: 1; }
/*/////////*/

.headlineNews .articleImage .headlineNews .articleTitle img {
    border-radius: 12px;
}

.headlineNews .articleTitle {
    z-index: 10;
    position: absolute;
    bottom: 0;
    padding: 0 40px 32px;
}

.headlineNews .articleTitle .badge {
    margin-bottom: 10px;
}

.headlineNews .mainNews-linked {
    margin-top: 20px;
}

.headlineNews .articleContent {
    margin: 0 0 12px;
}

.articleTime {
    color: var(--text-gray-500, #999);
    font-size: 14px;
    font-weight: 500;
    line-height: 24px;
    letter-spacing: -0.14px;
}

.branchNews {
    margin-top: 32px;
}

#slick-headlineBranch {
    width: 610px;
}

#slick-headlineBranch .slick-list {
    padding-bottom: 42px;
    box-sizing: border-box;
    width: 610px;
}

#slick-headlineBranch .slick-slide div {
    position: relative;
    padding-left: 18px;
    /*width: 610px;*/
	width: 592px;
}

/*
#slick-headlineBranch .slick-slide div:before {
    content: '';
    display: block;
    position: absolute;
    top: 11px;
    left: 0;
    width: 6px;
    height: 6px;
    background: var(--text-black, #111);
    border-radius: 3px;
}
*/

/****** 240208 개발자 수정 *****/
#slick-headlineBranch > li { position: relative; /* padding-left: 18px; */ width: 610px; }
/*
#slick-headlineBranch .slick-slide div > li:before,
#slick-headlineBranch > li:before{
    content: '';
    display: block;
    position: absolute;
    top: 11px;
    left: 0;
    width: 6px;
    height: 6px;
    background: var(--text-black, #111);
    border-radius: 3px;
}
*/

/*--- 0802 ---*/
#slick-headlineBranch .slideBlock div {
  position: relative;
  position: relative;
  padding-left: 18px;
  width: calc(100% - 18px);
  height: 38px;
}

#slick-headlineBranch .slideBlock div:before {
  content: '';
  display: block;
  position: absolute;
  top: 11px;
  left: 0;
  width: 6px;
  height: 6px;
  background: var(--text-black, #111);
  border-radius: 3px;
}
/*---------*/

.secondary-block {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.secondary-block .badge {
    margin-bottom: 4px;
}

.main-top .secondary-block .newsBox {
    width: 290px;
}

.main-top .third-block {
    width: 300px;
}

.main-top .third-block .newsBox {
    display: flex;
    gap: 20px;
    align-items: center;
}

.main-top .third-block .articleImage {
    flex-shrink: 0;
    display: flex;
    width: 80px;
    height: 80px;
    overflow: hidden;
    border-radius: 12px;
    align-items: center;
    justify-content: center;
}

.main-top .third-block .articleImage img {
    height: 100%;
    width: auto;
    border-radius: 12px;
}

.main-top .secondary-block .newsBox .articleImage {
    width: 290px;
    height: 194px;
    border-radius: 12px;
    overflow: hidden;
    margin-bottom: 12px;
    flex-shrink: 0;
}

.main-top .newsBox .body14 {
    display: block;
}


.main-top .newsBox .articleImage img {
    border-radius: 12px;
}

.main-top .newsBox .articleTitle .badge {
    margin-bottom: 4px;
}

.main-top .newsBox .articleTitle h2 {
    margin-bottom: 4px;
}

.main-top .newsBox .articleContent {
    margin-bottom: 12px;
}

.main-top .third-block .newsBoxWrap {
    margin-bottom: 40px;
}

.main-top .third-block .newsBox {
    padding: 16px 0;
    border-bottom: 1px solid var(--text-gray-300);
}

.main-top .third-block .newsBox:first-child {
    padding-top: 0;
}

.main-top .third-block .newsBox:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.main-top .third-block .articleTitle .badge {
    margin-bottom: 6px;
}

.main-top .third-block .articleTitle h2 {
    margin-bottom: 8px;
}

.main-top .first-block .newsBoxWrap {
    padding-bottom: 40px;
}

.main-top .first-block .newsBox {
    display: flex;
    align-items: center;
    gap: 20px;
    border-bottom: 1px solid var(--text-gray-300);
    padding: 20px 0;
}

.main-top .first-block .newsBox:first-child {
    padding-top: 0;
}

.main-top .first-block .newsBox:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.main-top .first-block .newsBox .articleImage {
    width: 114px;
    height: 114px;
    border-radius: 8px;
    overflow: hidden;
    display: flex;
    flex-shrink: 0;
    justify-content: center;
    align-items: center;
    margin-bottom: 0;
}

.main-top .first-block .newsBox .articleImage img {
    height: 100%;
    width: auto;
}

.headlineNews .mainNews-linked .articleTitle {
    position: relative;
    padding: 0 0 20px;
}

.headlineNews .mainNews-linked .articleTitle .badge {
    margin-bottom: 8px;
}

/* stlye02 */
.main-top.style02 .third-block {
    order: 1;
}

.main-top.style02 .layout-block-group {
    order: 2;
}

.main-top.style02 .third-block .newsBox {
    align-items: center;
}

.main-top.style02 .third-block .articleTitle h2 {
    margin-bottom: 6px;
}

.main-top.style02 .third-block .articleImage {
    display: flex;
}

/* nobranch */

.main-top.nobranch .mainNews-top .articleTitle {
    position: relative;
    padding: 20px 0 0;
}

.main-top.nobranch .mainNews-top .articleTitle h1 {
    color: var(--text-black);
}

.main-top.nobranch .mainNews-top .articleTitle h1:hover{
    transition: all .25s;
    color:var(--text-gray-600);
    cursor: pointer;
}

.main-top.nobranch .branchNews {
    display: none;
}


/* style03 */
.main-top.style03 .main-top-layout {
    gap: 42px;
}

.main-top.style03 .layout-block-group {
    flex-direction: column;
    justify-content: flex-start;
    gap: 0;
}

.main-top.style03 .headlineNews {
    width: 100%;
    display: flex;
    flex-direction: row;
    gap: 28px;
    ;
    margin: 35px 0 48px;
}

.main-top.style03 .headlineNews .mainNews-top {
    order: 2;
    border-bottom: 0;
}

.main-top.style03 .headlineNews .articleTitle {
    display: none;
    position: relative;
}

.main-top.style03 .headlineNews .articleTitle h1 {
    color: #000 !important;

}

.main-top.style03 .headlineNews .mainNews-linked .body14 {
    display: block;
    padding-bottom: 17px;
    border-bottom: 1px solid var(--text-gray-300);
}

.main-top.style03 .headlineNews .mainNews-linked {
    order: 1;
    width: 300px;
    margin-top: 0;
}

.main-top.style03 .branchNews {
    margin-top: 20px;
}

.main-top.style03 #slick-headlineBranch {
    width: 300px;
}

.main-top.style03 #slick-headlineBranch > li {
    width:100%;
}

.main-top.style03 #slick-headlineBranch .slick-list {
    padding-bottom: 23px;
    box-sizing: border-box;
    width: 300px;
}

.main-top.style03 .slick-dotted.slick-slider {
    margin-bottom: 0;
}

.main-top.style03 #slick-headlineBranch .slick-slide div {
    box-sizing: border-box;
    position: relative;
    padding-left: 18px;
    width: 300px;
}

.onlyStyle03 {
    display: none;
}

.main-top.style03 .onlyStyle03 {
    display: block;
}

.main-top.style03 .articleTitle .badge {
    margin-bottom: 2px;
}

.main-top.style03 .headlineNews .articleContent {
    display: -webkit-box;
    -webkit-line-clamp: 6;
    /* 라인수 */
    -webkit-box-orient: vertical;
    white-space: normal;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-bottom: 6px;
}

.main-top.style03 .secondary-block {
	display: flex;
	flex-direction: row;
	border-top: 1px solid var(--text-gray-300);
	padding-top: 48px;
}

.main-top.style03 .secondary-block .newsBox {
    width: 455px;
    display: flex;
    flex-direction: row;
    gap: 24px;
}

.main-top.style03 .secondary-block .articleImage {
    order: 2;
    width: 180px;
    height: 120px;
}

.main-top.style03 .secondary-block .textWrap {
    order: 1;
	margin-left: -24px;
}

.main-top.style03 .secondary-block .articleTitle {
	position: relative;
}

.main-top.style03 .secondary-block .badge {
	position: absolute;
	top: -26px;
}

.main-top.style03 .newsBox .articleTitle .badge,
.main-top.style03 .newsBox .articleTitle h2,
.main-top.style03 .newsBox .articleContent {
    margin-bottom: 7px;
}

.main-top.style03 .third-block .articleTitle .badge {
    margin-bottom: 8px;
}



/* main-top-template02 */
.main-top-template02 .first-block {
    width: 300px;
}

/* main-top-template03 */
.main-top-template03 {
    gap: 40px;
}

.main-top-template03 .mainNews {
    padding-bottom: 48px;
}

.main-top-template03 .headlineNews {
    width: 938px;
}

.main-top-template03 h1 {
    font-family: Pretendard;
    font-size: 38px;
    font-style: normal;
    font-weight: 700;
    line-height: 48px;
    /* 126.316% */
    letter-spacing: -0.38px;
}

.main-top-template03 .headlineNews .articleTitle {
    position: relative;
    padding: 0 0 36px;
}

.main-top-template03 .left-block {
    display: flex;
    gap: 28px;
}

.main-top-template03 .headlineNews .articleContent {
    margin: 0 0 6px;
}

.main-top-template03 .left-block .articleContentSide {
    width: 300px;
}

.main-top-template03 .left-block .articleContentWrap {
    padding-bottom: 17px;
    border-bottom: 1px solid var(--text-gray-300);
}

.main-top-template03 .left-block .articleImage {
    width: 610px;
    height: 406px;
    flex-shrink: 0;
}

.main-top-template03 .headlineNews .articleImage:after {
    display: none;
}

.main-top-template03 .branchNews {
    margin-top: 20px;
}

.main-top-template03 #slick-headlineBranch ul {
    width: 300px;
}

.main-top-template03 .branchNewsList li:not(:first-child) {
    margin-top: 10px;
}

.main-top-template03 #slick-headlineBranch .slick-list {
    padding-bottom: 44px;
}

.main-top-template03 .slick-dotted.slick-slider {
    margin-bottom: 0;
}

.main-top-template03 .branchNewsList li:before {
    top: 12px;
    transform: translateY(0);
    width: 4px;
    height: 4px;
}

.main-top-template03 .branchNewsList li {
    padding-left: 12px;
}

.main-top-template03 .mainBottom {
    padding-top: 38px;
}

.main-top-template03 .mainBottom .newsBoxWrap {
    display: flex;
    justify-content: space-between;
}

.main-top-template03 .mainBottom .newsBox {
    display: flex;
    width: 455px;
    gap: 24px;
}

.main-top-template03 .mainBottom .newsBox .articleContentWrap {
    width: 250px;
}

.main-top-template03 .headlineNews .mainBottom .articleTitle {
    padding: 0px;
}

.main-top-template03 .mainBottom .newsBox .articleImage {
    width: 180px;
    height: 120px;
    flex-shrink: 0;
}

.main-top-template03 .headlineNews .newsBox .articleImage>img {
    width: 100%;
}

.main-top .third-block,
.main-top-template03 .main-top .third-block {
    flex-shrink: 0;
}

/* special-template  */
.special-template.themeWhite {
    position: relative;
}

.special-template.themeWhite:after {
    position: absolute;
    display: block;
    content: '';
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 1280px;
    height: 4px;
    background: var(--bg-b-bg);
    border-radius: 20px;
}

.special-template.typeA {
    padding: 60px 0 100px;
    margin-bottom: 100px;
}

.special-template.typeA .headlineNews,
.special-template.typeB .headlineNews {
    width: 100%;
}

.special-template.typeA .headlineNews .mainNews {
    border-bottom: 0;
    overflow: hidden;
}

.special-template.typeA .headlineNews .mainNews .articleTitle {
    max-width: 1280px;
    margin: 0 auto;
    position: relative;
    padding: 0 0 40px;
}

.special-template.typeA .headlineNews .articleTitle {
    position: relative;
    padding: 0 0 0;
}

.special-template.typeA .headlineNews .articleTitle .badge {
    margin-bottom: 6px;
}


.special-template.typeA .headlineNews .mainNews h1 {
    margin-bottom: 12px;
}

.typeA .mainNews .slickSlideWrap {
    width: 100%;
    overflow: hidden;
}

/* typeB */
.special-template.typeB {
    padding: 50px 0 100px;
    margin-bottom: 100px;
}

.special-template.typeB .headlineNews .articleTitle {
    position: relative;
    border-bottom: 0;
    border-radius: 0;
    padding: 0 0 0;
}

.special-template.typeB .headlineNews .mainNews {
    border-bottom: 0;
    border-radius: 0;
}

.special-template.typeB .headlineNews .mainNews h1 {
    max-width: 1280px;
    margin: 0 auto;
    text-align: center;
    margin-bottom: 0;
}

.special-template.typeB .headlineNews .mainNews .articleTitle {
    padding-bottom: 32px;
}

.special-template.typeB .headlineNews .articleContentWrap {
    position: relative;
    width: 840px;
    height: 520px;
    margin: 0 auto 65px;
}

.special-template.typeB .headlineNews .articleContentWrap::after {
    display: block;
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 244px;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, #000 72.87%);
    opacity: .7;
    border-bottom-left-radius: 11px;
    border-bottom-right-radius: 11px;
}

.special-template.typeB .headlineNews .articleImage {
    position: relative;
    width: 840px;
    height: 520px;
}

.special-template.typeB .headlineNews .articleContentWrap img {
    position: absolute;
    margin-left: 0;
    margin-right: 0;
    width: 840px;
}


.special-template.typeB .headlineNews .articleContent {
    z-index: 5;
    position: absolute;
    bottom: 32px;
    left: 40px;
    max-width: 760px;
    color: var(--text-white);
    text-align: center;
}

.special-template.typeB .timeLineSlider .resetBtn {
    padding-bottom: 14px;
}

.special-template.typeB .timeLineSlider {
    position: relative;
    margin: 65px 0 74px;
}


#slick-specialTemplate {
    height: 560px;
    margin-left: -40px;
    width: 1280px;
    margin: 0 auto;
}

#slick-specialTemplate .slick-list {
    padding-bottom: 80px;
    overflow: visible;
}

#slick-specialTemplate li.slick-slide {
    height: 560px;
    width: auto;
    max-width: 840px;
    padding-right: 40px;
    border-radius: 12px;
    display: flex;
    justify-content: center;
    align-items: center;
}


#slick-specialTemplate li img {
    height: 560px;
    border-radius: 12px;
}

#slick-specialTemplate.slick-dotted.slick-slider {
    margin-bottom: 119px !important;
}

#slick-specialTemplate .slick-dots {
    bottom: -60px;
}

.themeBlack #slick-specialTemplate .slick-dots li button:before {
    background-color: rgba(255, 255, 255, .4);
}

.themeBlack #slick-specialTemplate .slick-dots li.slick-active button:before {
    background-color: var(--text-white) !important;
}

#specialTemplate-prevArrow {
    z-index: 100;
    cursor: pointer;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    width: 60px;
    height: 60px;
}

#specialTemplate-nextArrow {
    z-index: 100;
    cursor: pointer;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: auto;
    right: 0;
    width: 60px;
    height: 60px;
}

#specialTemplate-prevArrow:before {
    content: '';
    opacity: 1;
    position: absolute;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat center;
    background-position: -1px -372px;
    width: 60px;
    height: 60px;
    /* transform: rotate(180deg); */
}

#specialTemplate-nextArrow:before {
    content: '';
    opacity: 1;
    position: absolute;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat center;
    background-position: -72px -372px;
    width: 60px;
    height: 60px;
}


#slick-specialBottomList {
    position: relative;
    overflow: hidden;
    margin-left: -20px;
}

#slick-specialBottomList li.slick-slide {
    width: 305px !important;
    padding-left: 20px;
}

#slick-specialBottomList li .articleTitle {
    margin-top: 12px;
}

#slick-specialBottomList .articleImage {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 305px;
    height: 204px;
    border-radius: 12px;
    overflow: hidden;
}

#slick-specialBottomList .articleImage:after {
    display: none;
}

#slick-specialBottomList li img {
    border-radius: 12px;
}

.timeLineSlider {
    margin: 0 0 89px;
}

.timeLineSlider .resetBtn {
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 2px;
    padding-bottom: 21px;
}

.timeLineSlider .resetBtn .text {
    display: inline-block;
    color: var(--text-gray-600, #666);
    font-family: Pretendard;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
    /* 171.429% */
    letter-spacing: -0.14px;
}

.timeLineSlider .resetBtn .icon {
    display: inline-block;
    width: 20px;
    height: 20px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -500px -340px;
}

.timeLineWrap {
    padding: 20px 0 24px 0;
    border-radius: 8px;
}

#slick-top-timeLine li {
    box-sizing: border-box;
    width: 234px;
}

.timeLineGraphic {
    width: 234px;
}

.timeLineBlock {
    display: flex;
    flex-direction: column;
}

.timeText {
    padding-bottom: 8px;
}

/* header black */
.bg-black {
    background-color: var(--bg-b-bg);
}

.bg-black .header-bottom:after {
    background: var(--text-white);
}

.bg-black .utilBtn {
    background: var(--text-gray-700);
    color: var(--text-white)
}

.bg-black .utilBtn.newsLetterBtn {
    background: var(--text-white);
    color: var(--text-black);
}

.bg-black .utilBtn .loginBlock>a:first-child:after {
    background: var(--text-white)
}

.bg-black .nav-searchBtn {
    background-position: 0 -120px;
}

.bg-black .utilMenu .newsLetterBtn span {
    background-position: -95px -126px;
}

.bg-black .nav-menuList {
    color: var(--text-white);
}

.bg-black .showMoreBtn {
    box-shadow: 0;
}



.timeLineContent {
    box-sizing: border-box;
    width: 180px;
    padding-top: 3px;
}

#timeLine-prevArrow {
    cursor: pointer;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: -63px;
    width: 33px;
    height: 33px;
}

#timeLine-nextArrow {
    cursor: pointer;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: auto;
    right: -63px;
    width: 33px;
    height: 33px;
}


#specialBottomList-prevArrow {
    cursor: pointer;
    position: absolute;
    top: 112px;
    left: -63px;
    width: 33px;
    height: 33px;
}

#specialBottomList-nextArrow {
    cursor: pointer;
    position: absolute;
    top: 112px;
    left: auto;
    right: -63px;
    width: 33px;
    height: 33px;
}

#timeLine-prevArrow:before,
#specialBottomList-prevArrow:before {
    content: '';
    opacity: 1;
    position: absolute;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat center;
    background-position: -755px -9px;
    width: 33px;
    height: 33px;
}

#timeLine-nextArrow:before,
#specialBottomList-nextArrow:before {
    content: '';
    opacity: 1;
    position: absolute;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat center;
    background-position: -800px -9px;
    width: 33px;
    height: 33px;
}

/* typeA-black */
/* typeB-black */
.themeBlack {
    background: var(--bg-b-bg);
}


.typeB {
    position: relative;
    /* background: url(../img/special/special_typeB_w_bg.png) no-repeat center top; */
    background-image: url(https://img.seoul.co.kr/img/upload/2024/01/23/SSC_20240123141540.jpg);
    background-color:rgba(0, 0, 0, .5);
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
    background-blend-mode: luminosity;
}


.typeB:before {
    z-index: 0;
    position: absolute;
    content: '';
    display: block;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, #FFF 2.6%, rgba(0, 0, 0, 0.05) 31.77%, rgba(255, 255, 255, 0.80) 74.21%, #FFF 100%);
}

.typeB.themeBlack:before {
    z-index: 0;
    position: absolute;
    content: '';
    display: block;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, #262323 0.3%, rgba(0, 0, 0, 0.40) 18.52%, rgba(0, 0, 0, 0.40) 61.02%, #000 100%);
}

.themeBlack .headlineNews .mainNews h1 {
    color: var(--text-white)
}

.themeBlack .timeLineWrap {
    padding: 20px 0 24px 30px;
    background: rgba(17, 17, 17, 0.50);
}

.themeBlack .timeLineContent {
    color: var(--text-white);
}

.themeBlack .timeLineSlider .resetBtn .text {
    color: var(--text-white);
}

.themeBlack .timeLineSlider .resetBtn .icon {
    background-position: -471px -340px;
}

.themeBlack #slick-specialBottomList .articleTitle h2 {
    color: var(--text-white);
}

.themeBlack #timeLine-prevArrow:before,
.themeBlack #specialBottomList-prevArrow:before {
    background-position: -636px -8px;
}

.themeBlack #timeLine-nextArrow:before,
.themeBlack #specialBottomList-nextArrow:before {
    background-position: -680px -8px;
}

.special-template.typeB.themeBlack .timeLineSlider {
    margin: 40px 0 78px;
}

.special-template.typeB.themeBlack .timeLineSlider .resetBtn {
    padding-bottom: 18px;
    padding-left: 8px;
}

.themeBlack .timeCircle {
    box-sizing: border-box;
    position: relative;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 12px;
    height: 12px;
    padding: 4px;
    border-radius: 10px;
    background: var(--bg-primary-100);
}

.themeWhite .timeLineWrap {
    padding: 20px 0 24px 30px;
    background: rgba(255, 255, 255, 0.50);
}

.themeBlack .timelineBorder {
    border-top: 2px solid var(--bg-primary-100);
    margin-left: 4px;
}

.themeBlack li:nth-child(1) .timeCircle {
    position: relative;
    background-color: transparent;
}

.themeBlack li:nth-child(1) .timeCircle:after {
    position: absolute;
    top: -2px;
    left: 0;
    display: block;
    content: '';
    width: 14px;
    height: 14px;
    background-image: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp");
    background-repeat: no-repeat;
    background-position: -446px -343px;
}


.themeWhite .timelineBorder {
    border-top: 2px dashed var(--bg-primary-100);
    margin-left: 13px;
}

.themeWhite .timeCircle {
    box-sizing: border-box;
    position: relative;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 10px;
    height: 10px;
    border-radius: 10px;
    background-color: 0;
    border: 2px solid var(--bg-primary-100);
}

.themeWhite li:nth-child(1) .timeCircle {
    border: 0;
    background-color: var(--bg-primary-100);
}


.main-top .adArea .ad {
    height: auto;
    background: 0;
}

/* slick - banner */
#slick-banner {
    width: 300px;
    padding-bottom: 34px;
}

#slick-banner>li {
    width: 300px;
    height: 100px;
    border-radius: 8px;
}

#slick-banner .slide-list,
#slick-banner .slick-slide{
    border-radius: 8px;
}

#slick-banner li img { border-radius: 8px; }

#slick-banner3 {
    padding-bottom: 30px;
}

/*0802*/
#slick-banner .item {
  width: 300px;
  height: 100px;
  border-radius: 8px;
}

#slick-banner .item img {
  border-radius: 8px;
}
/* ---- */

/* 투데이뉴스 */
.todayNews {
    width: 940px;
}

.todayNews .sectionContentWrap>li:last-child {
    border-bottom: 0;
}

.newsBox_column {
    display: flex;
    flex-direction: column;
    padding: 50px 0;
    border-bottom: 1px solid var(--text-gray-300);
}

.newsBox_column:first-child {
    padding-top: 0;
}

.newsBox_column:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}

.newsBox_row1 {
    display: flex;
    /*justify-content: space-between;*/
    justify-content: flex-start;
    gap: 40px;
    padding: 50px 0;
    border-bottom: 1px solid var(--text-gray-300);
}

.newsBox_row1:first-child {
    padding-top: 0;
}

.newsBox_row1 .articleImage {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    width: 400px;
    height: 266px;
    overflow: hidden;
    border-radius: 12px;
}

.newsBox_row1 .articleImage img {
    border-radius: 12px;
}

.newsBox_row1 .articleContentWrap {
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding-right: 20px;
}

.newsBox_row1 .articleContentWrap .groupTitle {
    display: flex;
    gap: 4px;
}

.newsBox_row1 .articleContentWrap .articleTitle .badge {
    margin-bottom: 8px;
}

.newsBox_row1 .articleContentWrap .articleTitle h2 {
    margin: 0 0 12px;
}

.newsBox_row1 .articleContentWrap .articleContent {
    width: 800px;
    padding-right: 40px;
}

.todayNews .sectionContentWrap>li:nth-child(4),
.todayNews .sectionContentWrap>li:nth-child(5),
.todayNews .sectionContentWrap>li:nth-child(9),
.todayNews .sectionContentWrap>li:nth-child(10) {
    display: inline-flex;
    gap: 24px;
    justify-content: flex-start;
    width: 430px;
    border-bottom: 0;
}

.todayNews .sectionContentWrap>li:nth-child(4),
.todayNews .sectionContentWrap>li:nth-child(5) {
    display: inline-block;
}

.todayNews .sectionContentWrap>li:nth-child(4),
.todayNews .sectionContentWrap>li:nth-child(9) {
    padding-right: 35px;
}

.todayNews .sectionContentWrap>li:nth-child(5),
.todayNews .sectionContentWrap>li:nth-child(10) {
    padding-left: 35px;
}

.todayNews .sectionContentWrap>li:nth-child(4) .articleContentWrap,
.todayNews .sectionContentWrap>li:nth-child(5) .articleContentWrap,
.todayNews .sectionContentWrap>li:nth-child(9) .articleContentWrap,
.todayNews .sectionContentWrap>li:nth-child(10) .articleContentWrap {
    display: flex;
    justify-content: flex-start;
    gap: 0;
    padding-right: 0;
}

.todayNews .sectionContentWrap>li:nth-child(9) .articleContentWrap,
.todayNews .sectionContentWrap>li:nth-child(10) .articleContentWrap {
    gap: 24px;
}

/* 20250102 */
.todayNews .sectionContentWrap>li:nth-child(4) .articleTitle,
 .todayNews .sectionContentWrap>li:nth-child(5) .articleTitle,
.todayNews .sectionContentWrap>li:nth-child(9) .articleTitle,
 .todayNews .sectionContentWrap>li:nth-child(10) .articleTitle {
    position: relative;
}

.todayNews .sectionContentWrap>li:nth-child(4) .badge,
.todayNews .sectionContentWrap>li:nth-child(5) .badge {
   position: absolute;
   top: -26px;
}
/*/////*/

.todayNews .sectionContentWrap>li:nth-child(4) .articleTitle h2,
.todayNews .sectionContentWrap>li:nth-child(5) .articleTitle h2,
.todayNews .sectionContentWrap>li:nth-child(9) .articleTitle h2,
.todayNews .sectionContentWrap>li:nth-child(10) .articleTitle h2 {
    font-size: 24px;
    font-weight: 700;
    line-height: 34px;
    letter-spacing: -0.24px;
    padding: 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
    margin-bottom: 8px;
    /* min-height: 68px; */
}

.todayNews .sectionContentWrap>li:nth-child(4) .text,
.todayNews .sectionContentWrap>li:nth-child(5) .text {
    display: none;
}

.todayNews .sectionContentWrap>li:nth-child(9) .articleTitle,
.todayNews .sectionContentWrap>li:nth-child(10) .articleTitle {
	position: relative;
}

.todayNews .sectionContentWrap>li:nth-child(9) .badge,
.todayNews .sectionContentWrap>li:nth-child(10) .badge {
	position: absolute;
	top: -24px;
}

/*
.todayNews .sectionContentWrap>li:nth-child(4) .articleImage,
.todayNews .sectionContentWrap>li:nth-child(5) .articleImage {
    float: left;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    width: 180px;
    height: 120px;
    overflow: hidden;
    border-radius: 12px;
    margin-right: 24px;
}
*/

/* 20241111 */
.todayNews .sectionContentWrap>li:nth-child(4) .articleContentWrap,
.todayNews .sectionContentWrap>li:nth-child(5) .articleContentWrap {
    display: flex;
    justify-content: space-between;
    gap: 0;
    padding-right: 0;
    height: 140px;
}

.todayNews .sectionContentWrap>li:nth-child(4) .articleTitle h2,
.todayNews .sectionContentWrap>li:nth-child(5) .articleTitle h2 {
    -webkit-line-clamp: 3;
    margin-bottom: 0;
}

.todayNews .sectionContentWrap>li:nth-child(4) .articleImage,
.todayNews .sectionContentWrap>li:nth-child(5) .articleImage {
    float: left;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    width: 210px;
    height: 140px;
    overflow: hidden;
    border-radius: 12px;
    margin-right: 24px;
}

.todayNews .sectionContentWrap>li:nth-child(4) .articleImage img {
    height: 100%;
    width: auto;
}
/*////////*/

.todayNews .sectionContentWrap>li:nth-child(9) .articleImage,
.todayNews .sectionContentWrap>li:nth-child(10) .articleImage {
    display: none;
}

.todayNews .sectionContentWrap>li:nth-child(9) .lineclamp3,
.todayNews .sectionContentWrap>li:nth-child(10) .lineclamp3 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
}

.todayNews .sectionContentWrap>li:nth-child(9) .articleContentWrap .articleContent,
.todayNews .sectionContentWrap>li:nth-child(10) .articleContentWrap .articleContent {
    display: none;
}

.todayNews .sectionContentWrap>li:nth-child(6),
.todayNews .sectionContentWrap>li:nth-child(11) {
    border-top: 1px solid var(--text-gray-300);
}

.main-rightBoxWrap {
    width: 300px;
}

/* 사설 */
#slick-editorial {
    box-sizing: border-box;
    width: 300px;
    min-height: 240px;
    background: var(--bg-b-bg);
    border-radius: 8px;
	margin-bottom: 30px;
}

/*--- 0802 ---*/
#slick-editorial .owl-nav.disabled+.owl-dots {
  margin-top: 0;
  padding-bottom: 10px;
}

#slick-editorial .owl-dots .owl-dot span {
  background: var(--text-white);
  opacity: .3;
}

#slick-editorial .owl-dots .owl-dot.active span,
.owl-theme .owl-dots .owl-dot:hover span {
  opacity: 1;
}
/*------------*/

.editorialBox {
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 50px 40px 50px;
}

.editorialTitle {
    position: relative;
    padding-top: 14px;
}

.editorialTitle:after {
    position: absolute;
    display: block;
    content: '';
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    height: 12px;
    width: 8px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -148px -201px;
}

#slick-editorial .slick-dots {
    bottom: 18px;
}

#slick-editorial .slick-dots li.slick-active button:before {
    opacity: 1;
    color: black;
    background-color: var(--text-white);
}

#slick-editorial .slick-dots li button:before {
    font-family: 'slick';
    font-size: 6px;
    line-height: 20px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 8px;
    height: 8px;
    content: '';
    text-align: center;
    opacity: .3;
    color: black;
    background-color: var(--text-white);
    border-radius: 30px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* 오피니언 */
.opinion {
    width: 300px;
}

.opinionBox {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    padding: 16px 0;
    border-top: 1px solid var(--text-gray-300);
}

.opinionBox span{
    display: inline-block;
}

.opinionBox .opinionTitleWrap h2 {
    margin: 4px 0 8px;
}

.opinionBox:nth-child(1) {
    padding-top: 0;
    border-top: 0;
}

.opinionBox:last-child {
    border-bottom: 0;
}

.opinionImage {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 64px;
    height: 64px;
    border-radius: 40px;
    overflow: hidden;
    background-color: #D9D9D9;
}

.opinionImage>img {
    border-radius: 40px;
}

#slick-opinionBox {
	width: 300px;
	/*padding-bottom: 30px;*/
	padding-bottom: 0; /*0802*/
}

#slick-opinionBox .slick-slide {
	width: 300px;
}

.opinionBox {
	display: flex !important;
}
#slick-opinionBox .slick-slide div li {
    box-sizing: border-box;
    min-height: 100%;
}
#slick-opinionBox .slick-slide div:first-child li {
	border-bottom: 1px solid var(--text-gray-300);
}

#slick-opinionBox .slick-slide div:last-child li {
    padding-top: 16px;
    padding-bottom: 20px;
}

/* 20240712 */
.photoNewsBox {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.photoNewsBox .articleImage {
    border-radius: 12px;
    overflow: hidden;
}

.adArea .ad {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 250px;
    background: var(--bg-b-bg);
    color: var(--text-white);
}

.longAd .ad {
    height: 600px;
}

.main-rightBoxWrap section:not(:first-child) {
    margin: 100px 0;
}

.interactive_newest .articleImage {
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    width: 300px;
    border-radius: 12px;
}

.interactive_newest .articleImage img {
    border-radius: 12px;
}

.interactive_newest h2.articleTitle {
    margin: 12px 0 4px;
}

.interactBox h2 {
    padding: 20px 0;
    border-bottom: 1px solid var(--text-gray-300);
}

#slick-interractive {
    margin-top: 32px;
    /*padding-bottom: 54px;*/
	padding-bottom: 16px;
}

#slick-interractive li {
    width: 300px;
}

#slick-interractive li.slick-slide .interactBox:first-child h2 {
    padding-top: 0;
}

#slick-interractive li.slick-slide .interactBox:last-child h2 {
    border: 0;
}

/*--- 0802 ---*/
#slick-interractive .interactBox h2 {
  padding: 0 0 20px;
  border-bottom: 0;
}

.cartoon .articleImage {
    margin: 0 auto 8px;
    max-width: 660px;
    border-radius: 12px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.cartoon .articleImage img {
    border-radius: 12px;
}

.listSide .introduction .articleImage {
    margin-bottom: 8px;
    border-radius: 12px;
}

.listSide .introduction .articleImage img {
    border-radius: 12px;
}

/* 투표 */

/* .voteWrap {
    margin: 40px 0 0;
} */

.voteSubject {
    position: relative;
    display: flex;
    gap: 12px;
    align-items: center;
    margin-bottom: 8px;
    padding-left: 23px;
}

.voteSubject:before {
    display: block;
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 11px;
    height: 18px;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat;
    background-position: -165px -198px;
}


.voteContent {
    margin-bottom: 14px;
}

.voteForm .voteList {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.voteBtn .input-check {
    display: none;
}

.voteBtn .form-check {
    display: block;
    font-size: 16px;
    font-weight: 700;
    line-height: 26px;
    letter-spacing: -0.16px;
    border-radius: 10px;
    cursor: pointer;
    padding: 14px 20px;
    border-radius: 10px;
    background: var(--text-gray-200, #F4F4F4);
    color: var(--text-gray-700, #999);
}

.input-check:checked+.form-check {
    transition: all .25s;
    color: var(--text-white);
    background: var(--bg-primary-100);
}

.voteBtn .input-check:hover:not(:checked)+.form-check {
    transition: all .3s;
    background: var(--text-gray-400);
    color: var(--text-black);
}

.voteSubmit {
    display: flex;
    width: 300px;
    padding: 14px 40px;
    justify-content: center;
    align-content: center;
    border-radius: 100px;
    color: var(--text-white);
    background: var(--text-black);
    border: 0;
    cursor: pointer;
    margin-top: 0;
    /* margin-top: 24px; */
    font-family: Pretendard;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 26px;
    letter-spacing: -0.16px;
}

.voteSubmit:hover {
    transition: all .3s;
    opacity: .7;
}

section.vote .buttonWrap {
    margin-top: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

section.vote .buttonWrap > * {
    width: 146px;
}

section.vote .buttonWrap .goLink{
    display: flex;
    gap: 4px;
    padding: 14px 0;
    background: var(--bg-primary-100);
    border-radius: 50px;
    text-align: center;
    justify-content: center;
    align-items: center;
}

 section.vote .buttonWrap .goLink .icon{
    width: 16px;
    height: 16px;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp);
    background-repeat: no-repeat;
    background-position: -298px -72px;
    filter: brightness(1000%);
}

.voteAnswerText {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}

.voteAnswerText .answerTitle {
 position: relative;
    text-indent: 24px;
}


.voteAnswerText .answerTitle:before{
    content: '';
    position: absolute;
    top:50%;
    left:0;
    transform: translateY(-50%);
    width: 16px;
    height: 16px;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat;
    background-position: -99px -229px;
}

.voteAnswerTextWrap { display: flex; align-items: center; justify-content: space-between; width: 100%; }
.voteAnswerTextWrap .voteAnswerDesc { display: flex; gap: 8px; width: calc(100% - 60px); }
.voteAnswerTextWrap .voteAnswerDesc .check { width: 20px; height: 16px; background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat; background-position: -99px -229px; margin-top: 3px; }
.voteAnswerTextWrap .voteAnswerDesc .h16 { width: calc(100% - 20px); }

/* .progress-bar {
    display: flex;
    flex-direction: column;
    gap: 8px;
} */
/* 
.progress {
    height: 12px;
    width: 100%;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

::-webkit-progress-bar {
    width: 100%;
    height: 12px;
    background: var(--text-gray-100);
    border-radius: 4px;
}

::-webkit-progress-value {
    background: var(--bg-primary-100);
    height: 12px;
    border-radius: 4px;
} */

.voteAnswer {
    display: flex;
    flex-direction: column;
    gap: 40px;
    display: none;
}

.voteAnswerBox {
    margin-bottom: 40px;
}

.horizontal .progress-bar {
    float: left;
    height: 12px;
    width: 100%;
    padding: 12px 0;
}

.horizontal .progress-track {
    position: relative;
    width: 100%;
    height: 12px;
    background: var(--text-gray-100);
    border-radius: 4px;
}

.horizontal .progress-fill {
    position: relative;
    /* background: var(--bg-primary-100); */
    height: 12px;
    width: 50%;
    color: #fff;
    text-align: center;
    font-family: "Lato", "Verdana", sans-serif;
    font-size: 12px;
    line-height: 20px;
    border-radius: 4px;
}

.first-progress-fill {
    background: var(--bg-primary-100);
}

.secound-progress-fill {
    background: var(--text-gray-600);
}

.third-progress-fill {
    background: var(--text-gray-400);
}



/* 기획·연재 */
.serial .sectionContentWrap {
    padding-bottom: 14px;
}

#slick-serial {
    position: relative;
}

#slick-serial .slick-dots {
    bottom: -50px;
}

.serialList li {
    /*padding-right: 40px;*/
    width: 400px;
	padding-right: 0; /*0802*/
}

.serialList .articleTitleWrap {
    margin-bottom: 16px;
}

.serialList .contentNum {
    display: inline-block;
    vertical-align: top;
    padding-left: 8px;
}

.serialList .articleImage {
    display: flex;
    width: 400px;
    height: 320px;
    border-radius: 12px;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.serialList .articleImage img {
    border-radius: 12px;
    height: 100%;
    width: auto;
}

.serialList .articleLayout {
    position: relative;
    margin-bottom: 64px;
}

.serialList .articleContentWrap {
    box-sizing: border-box;
    position: absolute;
    z-index: 100;
    bottom: -60px;
    background-color: var(--text-white);
    width: 320px;
    padding: 12px 24px 0 0;
    border-top-right-radius: 12px;
}

.serialList .articleContentWrap::before {
    content: "";
    position: absolute;
    z-index: -1;
    background-color: transparent;
    top: -50px;
    height: 50px;
    width: 25px;
    border-top-right-radius: 12px;
    box-shadow: 0 -25px 0 0 #fff;
    transform: rotate(180deg);
}

.serialList .articleContentWrap::after {
    content: "";
    position: absolute;
    background-color: transparent;
    bottom: 60px;
    right: -25px;
    height: 50px;
    width: 25px;
    border-top-right-radius: 12px;
    box-shadow: 0 -25px 0 0 #fff;
    transform: rotate(180deg);
}

.serialList .articleContentWrap span {
    display: block;
}

.serialList .articleContentWrap h2 {
    margin-top: 8px;
    margin-bottom: 0;
    min-height: 60px;
}

.serialList .img-wrapper {
    position: relative;
    width: 400px;
    height: 320px;
}

.serialList .img-wrapper img {
    border-radius: 12px;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    margin: auto;
}

/* ---0802 ---*/
#serial-arrowSlider .owl-prev:before {
  content: '';
  opacity: 1;
  position: absolute;
  top: 0;
  left: 0;
  background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat center;
  background-position: -89px 0;
  width: 50px;
  height: 50px;
}

#serial-arrowSlider .owl-prev {
  border: 0;
  background: 0;
  cursor: pointer;
  position: absolute;
  top: 50%;
  left: -80px;
  transform: translateY(-50%);
  transition: all .3s;
  width: 50px;
  height: 50px;
}

#serial-arrowSlider .owl-prev:hover:before {
  background-position: -300px 1px;
  width: 51px;
  height: 51px;
}

#serial-arrowSlider .owl-next {
  border: 0;
  background: 0;
  cursor: pointer;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: auto;
  right: -80px;
  width: 50px;
  height: 50px;
}

#serial-arrowSlider .owl-next:before {
  content: '';
  opacity: 1;
  position: absolute;
  top: 0;
  left: 0;
  background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat center;
  background-position: -151px 0;
  width: 50px;
  height: 50px;
}

#serial-arrowSlider .owl-next:hover:before {
  background-position: -362px 1px;
  width: 51px;
  height: 51px;
}
/* -------*/

/* 많이 본 뉴스 */
/* .topRankNewsWrap {
    margin-top: 40px;
} */

.topRankList .newsBox {
    position: relative;
    width: 400px;
}

.topRankList .rank_1 .orderNum {
    position: absolute;
    top: 10px;
    left: 10px;
}

.topRankList .rank_1 .articleTitle {
    margin-top: 20px;
}

.orderNum {
    display: flex;
    width: 33px;
    height: 32px;
    padding: 1px 0px;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    background: var(--bg-b-bg);
    border-radius: 6px;
    color: var(--text-white, #FFF);
    text-align: center;
    font-size: 17px;
    font-weight: 700;
    line-height: 30px;
    letter-spacing: -0.17px;
}

.topRankList {
    height: 354px;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    gap: 0 40px;
}


.topRankList li {
    flex: 0 0 calc(156px - 32px);
    box-sizing: border-box;
}

.topRankList li:nth-child(1) {
    flex: 0 0 100%;
}

.topRankList li:nth-child(2),
.topRankList li:nth-child(4) {
    padding-bottom: 32px;
    border-bottom: 1px solid var(--text-gray-300);
}


.topRankList li:nth-child(3),
.topRankList li:nth-child(5) {
    padding-top: 32px;
}

.topRankList .newsBox .articleImage {
    display: flex;
    width: 400px;
    height: auto;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
}

.topRankList .newsBox .articleImage img {
    border-radius: 12px;
}

.topRankList li .txt_newsBox {
    display: flex;
    gap: 16px;
}

.topRankList li .txt_newsBox .articleContent {
    margin-top: 8px;
}

.topRankList li .txt_newsBox .articleContentWrap h2 {
    min-height: 60px;
}

.topRankList li .txt_newsBox .articleContent {
    min-height: 56px;
}

/* 1분 컷 뉴스 */

#slick-shorts li {
    position: relative;
    margin-right: 20px;
}

/* 0802 */
#slick-shorts .owl-item img {
  height: 100%;
  width: auto;
}

.shortsImage {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 240px;
    height: 426px;
    border-radius: 12px;
    background: var(--bg-b-bg);
    overflow: hidden;
}

.shortsImage img {
    height: 100%;
    width: auto;
}

.shortsImage:after {
    z-index: 1;
    content: '';
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
}

.shortsImage:before {
    z-index: 2;
    content: '';
    position: absolute;
    display: block;
    top: 185px;
    left: 50%;
    transform: translateX(-50%);
    width: 28px;
    height: 28px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -285px -223px;
}

.shrotsContentWrap {
    z-index: 3;
    position: absolute;
    bottom: 0;
    padding: 24px;
}

.shrotsContentWrap h4 {
    margin-bottom: 8px;
}

.shrotsCount {
    display: flex;
    gap: 21px;
}

.shortsView {
    position: relative;
}

.shortsView::after {
    position: absolute;
    top: 50%;
    right: -13px;
    transform: translateY(-50%);
    content: '';
    display: block;
    width: 5px;
    height: 5px;
    background: rgba(255, 255, 255, .7);
    border-radius: 10px;
}



/********** 역사관 **********/
.viewOfHistory-section {
    position: relative;
}

#slick-viewOfHistory li {
    cursor: pointer;
    width: 1280px;
}

.viewOfHistory {
    position: relative;
    box-sizing: border-box;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    height: 570px;
    border-radius: 12px;
    padding: 72px 70px 70px 72px;
}

.viewOfHistory01 {
    /*background-image: url("../img/history/viewOfHistory_bg_1.png");*/
    background-repeat: no-repeat;
    background-color: var(--bg-primary-100);
    background-blend-mode: multiply;
    background-position: 502px 0;
    background-size: contain;
}

.viewOfHistory02 {
    /*background-image: url("../img/history/viewOfHistory_bg_2.png");*/
    background-repeat: no-repeat;
    background-color: var(--bg-b-bg);
    background-position: 476px 0;
    background-size: contain;
}

.viewOfHistory03 {
    /*background-image: url("../img/history/viewOfHistory_bg_3.png");*/
    background-repeat: no-repeat;
    background-color: #F0F1F1;
    background-position: 162px 0;
    background-size: contain;
}

.viewOfHistory:after {
    z-index: 0;
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 262px;
    border-bottom-left-radius: 11px;
    border-bottom-right-radius: 11px;
}

.viewOfHistory01:after {
    background: linear-gradient(180deg, rgba(242, 105, 48, 0.00) 0%, rgba(242, 105, 48, 0.70) 100%);
}

.viewOfHistory02:after {
    background: linear-gradient(180deg, rgba(38, 35, 35, 0.00) 0%, rgba(38, 35, 35, 0.90) 100%);
}


.viewOfHistory .historyLeftSide {
    z-index: 3;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
    width: 351px;
    flex-grow: 0;
    flex-shrink: 0;
}

.historyLeftSide .historyTitle {
    position: relative;
}

.historyLeftSide .historyTitle:before {
    content: '';
    display: block;
    position: absolute;
    top: -22px;
    left: -20px;
    width: 33px;
    height: 50px;
    /*background: url(../img/logo_bgIcon_1.png) no-repeat center;*/
}

.viewOfHistory02 .historyLeftSide .historyTitle:before,
.viewOfHistory03 .historyLeftSide .historyTitle:before {
    /*background: url(../img/logo_bgIcon_2.png) no-repeat center;*/

}


.historyLeftSide .boxTitle {
    margin-top: 12px;
}

.historyList {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.historyList dl {
    display: flex;
    gap: 12px;
}

.viewOfHistory .historyRightSide {
    z-index: 3;
    width: 770px;
}


.viewOfHistory .historyRightSide .boxContentWrap {
    height: 112px;
}

.btnFloat {
    float: right;
    display: flex;
    align-items: flex-end;
    height: 100%;
    shape-outside: inset(calc(100% - 24px) 0 0 0);
}

.viewOfHistory .historyRightSide .boxContent .moreHistoryBtn {
    font-size: 15px;
    font-weight: 700;
    letter-spacing: -0.15px;
    margin-bottom: 6px;
    margin-left: 8px;
    line-height: normal;
    border-bottom: 1px solid var(--text-white);
}

.viewOfHistory03 .historyRightSide .boxContent .moreHistoryBtn {
    border-bottom: 1px solid var(--text-black);
}

/* 0802 */
.btn-large .owl-prev:before {
  content: '';
  opacity: 1;
  position: absolute;
  top: 0;
  left: 0;
  background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat center;
  background-position: -89px 0;
  width: 50px;
  height: 50px;
}

.btn-large .owl-prev {
  border: 0;
  background: 0;
  cursor: pointer;
  position: absolute;
  top: 50%;
  left: -80px;
  transform: translateY(-50%);
  transition: all .3s;
  width: 50px;
  height: 50px;
}

.btn-large .owl-prev:hover:before {
  background-position: -300px 1px;
  width: 51px;
  height: 51px;
}

.btn-large .owl-next {
  border: 0;
  background: 0;
  cursor: pointer;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: auto;
  right: -80px;
  width: 50px;
  height: 50px;
}

.btn-large .owl-next:before {
  content: '';
  opacity: 1;
  position: absolute;
  top: 0;
  left: 0;
  background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat center;
  background-position: -151px 0;
  width: 50px;
  height: 50px;
}

.btn-large .owl-next:hover:before {
  background-position: -362px 1px;
  width: 51px;
  height: 51px;
}
/*---*/


/* 상단 역사관 */
.top_history {
    position: relative;
    top: 0;
    left: 0;
    /* height: 100%; */
    width: 100%;
	min-width:1280px; /*20240221*/
    padding: 19px 0 21px;
    background-color: var(--bg-b-bg);
}

.top_history_tit.hide {
    display: none;
}

.top_history_tit_wrap {
    display: flex;
    align-items: center;
    justify-content: center;
}

.top_history_tit_wrap>div {
    display: flex;
    align-items: center;
}

.top_history .logo {
    display: inline-block;
    width: 72px;
    height: 18px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -350px -198px;
}

.top_history .go_history {
    color:  var(--bg-primary-100);;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: -0.16px;
    padding-left: 12px;
}

/* history content */

.show {
    animation: fadeAni .5s;
    display: block;
    visibility: visible;
}

.hidden {
    /* animation: fadeAni .5s ;  */
    visibility: hidden;
    /* display: none; */
    opacity: 0;
    transition: all .3s;
}

.top_history_content {
    display: none;
}

.top_history_content.show {
    display: block;
}

.top_history_content_wrap {
    display: flex;
    justify-content: space-between;
    gap: 75px;
    padding: 40px 0 60px;
}

.top_history_content .leftSide {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 37px 0 0;
    gap: 37px;
}

.top_history_content .leftSide .leftSideTop {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.top_history_content .leftSide .leftSideTop span {
    font-size: 14px;
    font-weight: 700;
    letter-spacing: -0.14px;
    color: #F26930;
}

.top_history_content .leftSide .leftSideTop strong {
    font-size: 60px;
    font-weight: 700;
    letter-spacing: -0.6px;
    color: #F26930;
    padding: 4px 0 16px;
}

.top_history_content .leftSide .leftSideTop>div {
    padding-left: 4px;
    display: flex;
    align-items: center;
    gap: 3px;
}

.top_history_content .leftSide .leftSideTop .logo {
    width: 70px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -350px -199px;
}

.top_history_content .leftSide .arrowBtnWrap {
    position: relative;
    width: 100%;
    height: 24px;
}

.top_history_content_wrap .rightSide {
    width: 1373px;
}

.top_history_content .arrowBtnWrap .slickPrevArrow {
    cursor: pointer;
    position: absolute;
    top: 12px;
    transform: 0;
    left: 0;
    width: 24px;
    height: 24px;
}


.top_history_content .arrowBtnWrap .slickNextArrow {
    cursor: pointer;
    position: absolute;
    top: 12px;
    transform: 0;
    left: 28px;
    width: 24px;
    height: 24px;
}

#top_history-prevArrow:before {
    content: '';
    opacity: 1;
    position: absolute;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat center;
    background-position: -607px -294px;
    width: 26px;
    height: 26px;
}

#top_history-nextArrow:before {
    content: '';
    opacity: 1;
    position: absolute;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat center;
    background-position: -491px -294px;
    width: 26px;
    height: 26px;
}

/* history slide */

#slick-history .slick-slide {
    margin: 0 20px;
}

/*--- 0802 ---*/
#slick-history li div {
   width: 620px;
}

#history-arrowSlider {
  position: relative;
}

#history-arrowSlider .owl-prev {
  border: 0;
  background: 0;
  cursor: pointer;
  position: absolute;
  top: 0;
  left: 0;
  width: 24px;
  height: 24px;
}

#history-arrowSlider .owl-prev:before {
  content: '';
  opacity: 1;
  position: absolute;
  top: 0;
  left: 0;
  background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat center;
  background-position: -607px -294px;
  width: 26px;
  height: 26px;
}

#history-arrowSlider .owl-next {
  border: 0;
  background: 0;
  cursor: pointer;
  position: absolute;
  top: 0;
  left: 28px;
  width: 24px;
  height: 24px;
}

#history-arrowSlider .owl-next:before {
  content: '';
  opacity: 1;
  position: absolute;
  top: 0;
  left: 0;
  background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat center;
  background-position: -491px -294px;
  width: 26px;
  height: 26px;
}
/*----------*/

.historyBox {
    box-sizing: border;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 620px !important;
    height: 362px;
    border-radius: 12px;
}

/*
.historyBox01 {
    background: url("../img/history_con_01.png") no-repeat center right;
}


.historyBox02 {
    background: url("../img/history_con_02.png") no-repeat center right;
}

.historyBox03 {
    background: url("../img/history_con_03.png") no-repeat center right;
}
*/

.hisBoxStl_1 {
    position: relative;
    background-color: #F26930;
}

.hisBoxStl_2 {
    position: relative;
    background-color: #262323;
}

.hisBoxStl_3 {
    position: relative;
    background-color: #eee;
}

.hisBoxStl_1 .boxTitle::after {
    content: '';
    position: absolute;
    top: 44px;
    left: 28px;
    display: block;
    width: 30px;
    height: 45px;
    /*background: url("../img/logo_bgIcon_1.png") no-repeat center;*/
}

.hisBoxStl_2 .boxTitle::after {
    content: '';
    position: absolute;
    top: 44px;
    left: 28px;
    display: block;
    width: 30px;
    height: 45px;
    /*background: url("../img/logo_bgIcon_2.png") no-repeat center;*/
}

.hisBoxStl_3 .boxTitle::after {
    content: '';
    position: absolute;
    top: 44px;
    left: 28px;
    display: block;
    width: 30px;
    height: 45px;
    /*background: url("../img/logo_bgIcon_2.png") no-repeat center;*/
}


.hisBoxStl_1:after {
    z-index: 0;
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 262px;
    background: linear-gradient(180deg, rgba(242, 105, 48, 0.00) 0%, rgba(242, 105, 48, 0.70) 100%);
    border-bottom-left-radius: 11px;
    border-bottom-right-radius: 11px;
}


.hisBoxStl_2:after {
    z-index: 0;
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 262px;
    background: linear-gradient(180deg, rgba(38, 35, 35, 0.00) 0%, rgba(38, 35, 35, 0.90) 100%);
    border-bottom-left-radius: 11px;
    border-bottom-right-radius: 11px;
}


.hisBoxStl_3:after {
    z-index: 0;
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 262px;
    border-radius: var(--spacing-none, 0px);
    background: linear-gradient(180deg, rgba(238, 238, 238, 0.00) 0%, rgba(238, 238, 238, 0.30) 100%);
    border-bottom-left-radius: 11px;
    border-bottom-right-radius: 11px;
}

.historyBox .boxTitle {
    position: relative;
    padding: 56px 0 0 50px;
}

.top_history .boxContentWrap {
    height: 100%;
}

.top_history .boxContent {
    z-index: 1;
    font-size: 16px;
    font-weight: 500;
    line-height: 28px;
    letter-spacing: -0.16px;
    color: var(--text-white);
    padding: 50px;
}

.btnFloat {
    float: right;
    display: flex;
    align-items: flex-end;
    height: 100%;
    shape-outside: inset(calc(100% - 24px) 0 0 0);
}

.top_history .boxContent .moreHistoryBtn {
    position: relative;
    padding-left: 8px;
    margin-bottom: 6px;
}

.top_history .boxContent .moreHistoryBtn:after {
    display: block;
    position: absolute;
    bottom: 0;
    left: 8px;
    content: '';
    width: 100%;
    height: 1px;
    background: var(--text-white);
}

.top_history .historyBox03 .boxContent .moreHistoryBtn:after {
    background: var(--text-gray-700);

}

.showMoreBtn {
    z-index: 100;
    position: absolute;
    bottom: -18px;
    left: 50%;
    transform: translateX(-50%);
    cursor: pointer;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat var(--text-white);
    width: 32px;
    height: 32px;
    border-radius: 30px;
    background-position: -64px -65px;
    transform: rotate(90deg);
    box-shadow: 2px 0px 5px 0 #ddd;
}

.showMoreBtn.open {
    transform: rotate(-90deg);
    box-shadow: -2px 0 5px 0 #ddd;
}

.hideText {
    overflow: hidden;
    text-indent: -9999px;
    color: transparent;
    font-size: 0;
}


.showMoreBtn img {
    width: 30px;
    height: 30px;
}


/* 서울 미디어 홀딩스 */
.seoulEnWrap,
.seoulMHWrap {
    display: flex;
    justify-content: space-between;
    gap: 40px;
}

.newsBrand-2row {
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.newsBrand .sectionContentWrap {
    width: 287px;
}

.ourNews .sectionContentWrap {
    width: 300px;
}

#slick-seoulMH-ebn,
#slick-seoulMH-nowNews,
#slick-seoulMH-gong {
    width: 287px;
}

#slick-seoulMH-ebn div.slick-slide,
#slick-seoulMH-nowNews div.slick-slide,
#slick-seoulMH-gong div.slick-slide {
    width: 287px;
}

.seoulEn_newsList li,
.seoulMH_newsList li {
    padding: 16px 0;
    border-top: 1px solid var(--text-gray-300);	
}

.seoulEn_newsList .slick-slide div:first-child li,
.seoulMH_newsList .slick-slide div:first-child li {
    padding: 12px 0 16px;
    border-top: 0;
}

.seoulMH_newsList li:first-child{
    border-top:0
}

.seoulEn_newsList .articleImage,
.seoulMH_newsList .articleImage {
    position: relative;
    width: 287px;
    height: 192px;
}

.seoulEn_newsList .articleImage img,
.seoulMH_newsList .articleImage img {
    border-radius: 12px;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    margin: auto;
    border-radius: 12px;
}

.seoulEn_newsList .articleTitle,
.seoulMH_newsList .articleTitle {
    margin: 12px 20px 0 0;
}

.seoulEn_newsList li h4,
.seoulMH_newsList li h4 {
    margin-right: 20px;
}

.seoulEn_newsList li:first-child {
    border-top: 0;
    padding-top: 0;
}

/* 0802 */
/*.seoulEn_newsList li,*/
.seoulMH_newsList li {
  padding-top: 0;
  border-top: 0;
}

.seoulEn_newsList .articleLine,
.seoulMH_newsList .articleLine {
  width: 287px;
  padding: 16px 0;
  border-top: 1px solid var(--text-gray-300);
}

.seoulEn_newsList .articleLine:first-child,
.seoulMH_newsList .articleLine:first-child {
  border-top: 0;
}

.seoulEn_newsList .slick-slide div:first-child .articleLine,
  .seoulMH_newsList .slick-slide div:first-child .articleLine {
    padding: 12px 0 16px;
    border-top: 0;
  }

.seoulEn_newsList .articleLine,
.seoulMH_newsList .articleLine {
  padding: 16px 0
}

.ourNews_newsList li {
  padding: 16px 0;
  border-top: 1px solid var(--text-gray-300);
}
/*----*/




.bottom-banner {
    margin-top: 40px;
    border-radius: 8px;
    width: 300px;
}

.banner li {
    overflow: hidden;
    border-radius: 8px;
}

.hide {
    display: none;
}


.lineclamp1 {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    line-height: 1.4em;
}

.lineclamp2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    /* 라인수 */
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
    /* max-height: 2.8em; */
    /* text-align:left; */
}


.lineclamp3 {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    /* 라인수 */
    -webkit-box-orient: vertical;
    white-space: normal;
    overflow: hidden;
    /* max-height: 4.2em; */
    text-overflow: ellipsis;
}


.lineclamp4 {
    display: -webkit-box;
    -webkit-line-clamp: 4;
    /* 라인수 */
    -webkit-box-orient: vertical;
    white-space: normal;
    overflow: hidden;
    text-overflow: ellipsis;
}

.lineclamp5 {
    display: -webkit-box;
    -webkit-line-clamp: 5;
    /* 라인수 */
    -webkit-box-orient: vertical;
    white-space: normal;
    overflow: hidden;
    text-overflow: ellipsis;
}

.lineclamp6 {
    display: -webkit-box;
    -webkit-line-clamp: 6;
    /* 라인수 */
    -webkit-box-orient: vertical;
    white-space: normal;
    overflow: hidden;
    text-overflow: ellipsis;
}


@keyframes fadeAni {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.slick-dots {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    bottom: 0;
    left: 50%;
    margin: 0;
    padding: 0;
    transform: translateX(-50%);
}

#slick-interractive .slick-dots li {
    width: auto;
}

.slick-dots li {
    position: relative;
    display: inline-block;
    width: 20px;
    height: 20px;
    margin: 0;
    padding: 0;
    cursor: pointer;
}

.slick-dots li button {
    font-size: 0;
    line-height: 0;
    display: block;
    width: 20px;
    height: 20px;
    padding: 5px;
    cursor: pointer;
    color: transparent;
    border: 0;
    outline: none;
    background: transparent;
}

.slick-dots li button:hover,
.slick-dots li button:focus {
    outline: none;
}

.slick-dots li button:hover:before,
.slick-dots li button:focus:before {
    opacity: 1;
}


.slick-dots li.slick-active button:before {
    opacity: 1;
    color: black;
    background-color: var(--bg-b-bg);
}

.slick-dots li button:before {
    font-family: 'slick';
    font-size: 6px;
    line-height: 20px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 8px;
    height: 8px;
    content: '';
    text-align: center;
    opacity: 1;
    color: black;
    background-color: #BEBDBD;
    border-radius: 30px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}


/* slick-shorts */

.slickContentWrap {
    position: relative;
}

.seoulShorts #shorts-prevArrow {
    cursor: pointer;
    position: absolute;
    top: 50%;
    left: -80px;
    transform: translateY(-50%);
    transition: all .3s;
    width: 50px;
    height: 50px;
}

.seoulShorts #shorts-nextArrow {
    cursor: pointer;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: auto;
    right: -80px;
    width: 50px;
    height: 50px;
}

.seoulShorts #shorts-prevArrow:before {
    content: '';
    opacity: 1;
    position: absolute;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat center;
    background-position: -89px 0;
    width: 50px;
    height: 50px;
}

.seoulShorts #shorts-nextArrow:before {
    content: '';
    opacity: 1;
    position: absolute;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat center;
    background-position: -151px 0;
    width: 50px;
    height: 50px;
}

.seoulShorts #shorts-prevArrow:hover:before {
    background-position: -300px 1px;
    width: 51px;
    height: 51px;
}

.seoulShorts #shorts-nextArrow:hover:before {
    background-position: -362px 1px;
    width: 51px;
    height: 51px;
}

.slickPrevArrow {
    cursor: pointer;
    position: absolute;
    top: 50%;
    left: -80px;
    transform: translateY(-50%);
    transition: all .3s;
    width: 50px;
    height: 50px;
}

.slickNextArrow {
    cursor: pointer;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: auto;
    right: -80px;
    width: 50px;
    height: 50px;
}

.slickPrevArrow:before {
    content: '';
    opacity: 1;
    position: absolute;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat center;
    background-position: -89px 0;
    width: 50px;
    height: 50px;
}

.slickNextArrow:before {
    content: '';
    opacity: 1;
    position: absolute;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat center;
    background-position: -151px 0;
    width: 50px;
    height: 50px;
}

.slickPrevArrow:hover:before {
    background-position: -300px 1px;
    width: 51px;
    height: 51px;
}

.slickNextArrow:hover:before {
    background-position: -362px 1px;
    width: 51px;
    height: 51px;
}


/* footer */
footer {
    background: var(--bg-b-bg);	
}

/*20240221*/
.pc-footer{
    background: var(--bg-b-bg);	
	min-width:1280px;  
}

.pc-footer .footer-top {
    padding: 24px 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid rgba(102, 102, 102, .5);
}


.pc-footer .footer-top .leftSide {
    display: flex;
    gap: 32px;
}

.pc-footer .footer-top .rightSide>ul {
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    gap: 0 32px;
}

.pc-footer .footer-main {
    display: flex;
    justify-content: space-between;
    padding: 40px 0 50px;
    border-bottom: 1px solid rgba(102, 102, 102, .5);
}

.pc-footer .footer-main .rightSide {
    display: flex;
    flex-direction: column;
    gap: 8px 0;
}

.pc-footer .footer-sitemap {
    display: flex;
    gap: 0 76px
}

.pc-footer .footer-sitemap .column-layout {
    display: flex;
    flex-direction: column;
    gap: 40px 0;
}

.pc-footer .footer-sitemap dl {
    min-width: 60px;
}

.pc-footer .footer-sitemap dt {
    font-size: 14px;
    font-weight: 700;
    line-height: 24px;
    letter-spacing: -0.14px;
    color: var(--text-white);
    padding-bottom: 12px;
}

.pc-footer .footer-sitemap dd {
    color: var(--text-gray-500, #999);
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 32px;
    letter-spacing: -0.14px;
}

.pc-footer .footer-bottom {
    padding: 32px 0 50px;
}

.pc-footer .footer-bottom .topSide {
    display: flex;
    justify-content: space-between;
}

.pc-footer .footer-bottom .leftSide ul {
    display: flex;
    gap: 0 24px;
    margin-bottom: 16px;
}

.pc-footer .footer-bottom .rightSide .snsWrap ul {
    display: flex;
    gap: 0 10px;
}

.pc-footer .footer-bottom .rightSide .snsWrap ul li {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    width: 32px;
    height: 32px;
    border-radius: 16px;
    background: var(--text-gray-700);
}

.pc-footer .footer-bottom .rightSide .snsWrap ul li a .icon {
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp");
    background-repeat: no-repeat;
    overflow: hidden;
    color: transparent;
    font-size: 0;
    text-indent: -99999px;
}

.pc-footer .footer-bottom .rightSide .snsWrap ul li a .facebookBtn {
    width: 32px;
    height: 32px;
    background-position: -321px -158px;
}

.pc-footer .footer-bottom .rightSide .snsWrap ul li a .twitterBtn {
    width: 32px;
    height: 32px;
    background-position: -363px -158px;
}

.pc-footer .footer-bottom .rightSide .snsWrap ul li a .youtubeBtn {
    width: 32px;
    height: 32px;
    background-position: -447px -158px;
}

.pc-footer .footer-bottom .rightSide .snsWrap ul li a .instaBtn {
    width: 32px;
    height: 32px;
    background-position: -405px -158px;
}

.pc-footer .footer-bottom .rightSide .snsWrap ul li a .naverBtn {
    width: 32px;
    height: 32px;
    background-position: -489px -158px;
}

.pc-footer .footer-bottom .rightSide .snsWrap ul li a .naverBlogBtn {
    width: 32px;
    height: 32px;
    background-position: -531px -158px;
}

.pc-footer .footer-bottom .bottomSide span {
    position: relative;
    padding: 0 12px 0 0;
}


.pc-footer .footer-bottom .bottomSide span.after:after {
    content: '';
    position: absolute;
    display: block;
    top: 50%;
    transform: translateY(-50%);
    right: 4px;
    width: 1px;
    height: 11px;
    background: var(--text-gray-500);
}

.pc-footer .footer-bottom .copyright {
    margin-top: 4px;
}

.selectBox {
    position: relative;
}

.selectBox-li.active .selectBoxBtn-bg-white span {
    background-position: -126px -231px;
    transform: rotate(-180deg);
}

.selectBox-li.active .selectBoxBtn-bg-black span {
    background-position: -29px -226px;
    transform: rotate(-180deg);
}

.hamburgerMenu-depth .select-optionBox {
    z-index: 1;
    display: none;
    position: absolute;
    bottom: 43px;
}

.select-optionBox {
    display: none;
    position: absolute;
    padding-top: 8px;
}

.selectBox-li:not(.active) .select-optionBox {
    display: none;
}

.selectBox-li.active .select-optionBox {
    display: block;
}

.select-optionBox-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 8px 24px;
    padding: 24px 32px 24px 24px;
    width: 122px;
    border-radius: 8px;
    border: 1px solid var(--text-gray-400);
    background-color: var(--text-white);
}

.select-optionBox-list li {
    width: calc(50% - 12px);
}

.select-optionBox-list li:hover {
    transition: all .3s;
    color: var(--text-gray-700);
    text-decoration: underline;
}

.selectBoxBtn-bg-black {
    display: flex;
    cursor: pointer;
    gap: 8px;
}

.selectBoxBtn-bg-black>span {
    display: inline-block;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat;
    background-position: -29px -225px;
    width: 24px;
    height: 24px;
    vertical-align: text-bottom;
}

.selectBoxBtn-bg-white {
    display: flex;
    align-items: center;
    cursor: pointer;
    gap: 2px;
}

.selectBoxBtn-bg-white>span {
    display: inline-block;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat;
    background-position: -126px -231px;
    width: 12px;
    height: 12px;
}

.selectBox-01 .select-optionBox-list {
    width: 175px;
}

.selectBox-02 .select-optionBox-list {
    width: 168px;
}

.relative {
    position: relative;
}

.paddingTB20 {
    padding: 20px 0;
}


.popup {
    margin-top: 8px;
    position: absolute;
    width: 216px;
    background: var(--text-white);
    padding: 20px;
    border-radius: 12px;
}

.popup h5 {
    margin-bottom: 4px;
    text-indent: 22px;
    background: url("https://www.seoul.co.kr/img/n24/check-bg-primary.webp") no-repeat;
}

.popup .email {
    margin-top: 2px;
    text-decoration: underline;
}

.reportPopup {
    display: none;
}


/* listPage */

.listPage-wrapper {
    display: flex;
    justify-content: space-between;
}

.listPage-wrapper .listSide {
    width: 300px;
}

.listPage-wrapper .listSide {
    position: relative;
    width: 300px;
    flex-shrink: 0;
    padding-right: 69px;
    border-right: 1px solid var(--text-gray-400);
}


.listPage-wrapper .listSide section {
    margin: 100px 0;
}

.listPage-wrapper .listMain {
    margin: 80px 0 200px;
    padding-left: 69px;
    min-width: 840px;
}

.listPage-wrapper .listMain.noMargin {
    margin-top: 0;
}

.listPage-wrapper .listOnly {
    margin: 80px 0 200px;
}

.listPage-wrapper .listHeader {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.listPage-wrapper .pageListTitle {
    margin-bottom: 30px;
}

.listCategory {
    padding-top: 80px;
    margin-bottom: 160px;
}

.listCategory .pageTitle {
    margin-bottom: 32px;
}

.listCategory .submenuList {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.listCategory .submenuList li.on {
    font-size: 18px;
    font-weight: 700;
    line-height: 30px;
    letter-spacing: -0.18px;
    color: var(--bg-primary-100);
}

.listCategory.noPadding {
    padding-top: 0;
}

.topic #slick-topic {
    /*padding-bottom: 54px;*/
	padding-bottom: 0; /*0802*/
}

#slick-topic .articleImage {
    padding: 15px 0 11px;
}

#slick-topic>li,
#slick-topic div {
    width: 300px;
}

/* 0802 */
#slick-topic .owl-nav.disabled+.owl-dots {
  margin-top: 30px;
}

.pageTopNews li {
    padding: 20px 0;
    border-bottom: 1px solid var(--text-gray-300);
}

.pageTopNews li:first-child {
    padding-top: 0;
}

.pageTopNews li:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.pageTopNews .newsBox {
    display: flex;
    gap: 0 8px;
    align-items: center;
}

.pageTopNews .newsBox .orderNum {
    color: var(--bg-primary-100, #F26930);
    font-size: 40px;
    font-weight: 500;
    line-height: 44px;
    letter-spacing: -0.4px;
    background: none;
}

.pageTopNews .newsBox .articleWrap {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 24px;
}

.pageTopNews .newsBox .badge {
    margin-top: 8px;
}

.pageTopNews .newsBox .articleImage {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 64px;
    height: 64px;
    border-radius: 8px;
    overflow: hidden;
    flex-shrink: 0;
}

.pageTopNews .newsBox .articleImage img {
    border-radius: 8px;
}

.listpage-topNews {
    position: relative;
    margin: 0 0 20px;
    padding: 0 20px 100px 0;
}

.listpage-topNews .articleImage {
    position: relative;
    display: flex;
    max-width: 660px;
    max-height: 440px;
    height: 440px;
    border-radius: 12px;
    margin-top: 24px;
    overflow: hidden;
    align-items: center;
}

@charset "UTF-8";

@import url('https://img.seoul.co.kr/css/webfont_pretendard.css');

/*
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.5/dist/web/static/pretendard-dynamic-subset.css');
*/


/*
@font-face {
    font-family: 'Pretendard';
    font-weight: 500;
    font-style: normal;
	font-display: fallback;
    src: local('Pretendard Medium'), local('Pretendard-Regular'),
        url('https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-Medium.woff2') format('woff2'),
        url('https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-Medium.woff') format('woff'),
		url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Medium.woff') format('woff');
}

@font-face {
    font-family: 'Pretendard';
    font-weight: 700;
    font-style: normal;
	font-display: fallback;
    src: local('Pretendard Bold'), local('Pretendard-Bold'),
        url('https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-Bold.woff2') format('woff2'),
        url('https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-Bold.woff') format('woff'),
		url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Bold.woff') format('woff');
}
*/

/* reset css */

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block;
}

caption {
    display: none;
}

html {
    scroll-behavior: smooth;

}

body {
    position: relative;
    font-family: 'Pretendard';
    font-style: normal;
    font-weight: 500;
    line-height: 170%;
}

ol,
li,
dl,
dt,
dd {
    list-style: none;
}

blockquote,
q {
    quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
    content: '';
    content: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

a,
a:hover,
a:active,
a:link,
a:visited {
    text-decoration: none;
    outline: none;
    cursor: pointer;
}

a {
    font-family: inherit;
    font-size: inherit;
    font-style: inherit;
    font-weight: inherit;
    line-height: inherit;
    letter-spacing: inherit;
    color: inherit;
}

img {
    width: 100%;
    vertical-align: middle;
}


:root {
    --bg-primary-100: #F26930;
    --bg-b-bg: #262323;
    --text-gray-100: #F8F8F8;
    --text-gray-200: #f4f4f4;
    --text-gray-300: #EEE;
    --text-gray-400: #DDD;
    --text-gray-500: #999;
    --text-gray-600: #666;
    --text-gray-700: #444;
    --text-black: #111;
    --text-white: #FFF;
    --etc-notice: #F00;
    --etc-notice-blue: #3A84FF;

}

/* headline text */
.h44 {
    color: var(--text-black, #111);
    /* PC/H_44 */
    font-family: Pretendard;
    font-size: 44px;
    font-style: normal;
    font-weight: 700;
    line-height: 60px;
    /* 136.364% */
    letter-spacing: -0.44px;
}

.h38 {
    color: var(--text-black, #111);
    /* PC/H_38 */
    font-family: Pretendard;
    font-size: 38px;
    font-style: normal;
    font-weight: 700;
    line-height: 48px;
    /* 126.316% */
    letter-spacing: -0.38px;
}

.h32 {
    color: var(--text-black, #111);
    /* PC/H_32 */
    font-family: Pretendard;
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    line-height: 44px;
    /* 137.5% */
    letter-spacing: -0.32px;
}

.h28 {
    color: var(--text-black, #111);
    /* PC/H_28 */
    font-family: Pretendard;
    font-size: 28px;
    font-style: normal;
    font-weight: 700;
    line-height: 40px;
    /* 142.857% */
    letter-spacing: -0.28px;
}

.h24 {
    color: var(--text-black, #111);
    /* PC/H_24 */
    font-family: Pretendard;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 34px;
    /* 141.667% */
    letter-spacing: -0.24px;
}

.h20 {
    color: var(--text-black, #111);
    /* PC/H_20 */
    font-family: Pretendard;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 150% */
    letter-spacing: -0.2px;
}

.h18 {
    color: var(--text-black, #111);
    /* PC/H_18 */
    font-family: Pretendard;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    /* 166.667% */
    letter-spacing: -0.18px;
}

.h16 {
    color: var(--text-black, #111);
    /* PC/H_16 */
    font-family: Pretendard;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 26px;
    /* 162.5% */
    letter-spacing: -0.16px;
}

.h15 {
    color: var(--text-black, #111);
    /* PC/H_15 */
    font-family: Pretendard;
    font-size: 15px;
    font-style: normal;
    font-weight: 700;
    line-height: 22px;
    /* 146.667% */
    letter-spacing: -0.15px;
}

.h14 {
    color: var(--text-black, #111);
    /* PC/H_14 */
    font-family: Pretendard;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
    /* 171.429% */
    letter-spacing: -0.14px;
}

.e14 {
    color: var(--text-black, #111);
    /* PC/EN_14 */
    /*font-family: Montserrat;*/
	font-family: Pretendard;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
    /* 171.429% */
    letter-spacing: -0.28px;
}

/* body text */
.body20 {
    color: var(--text-black, #111);
    /* PC/body_20 */
    font-family: Pretendard;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 32px;
    /* 160% */
    letter-spacing: -0.2px;
}

.body18 {
    color: var(--text-black, #111);
    /* PC/body_18 */
    font-family: Pretendard;
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 32px;
    /* 177.778% */
    letter-spacing: -0.18px;
}

.body16 {
    color: var(--text-black, #111);
    /* PC/body_16 */
    font-family: Pretendard;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 28px;
    /* 175% */
    letter-spacing: -0.16px;
}

.body15 {
    font-family: Pretendard;
    font-size: 15px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    /* 160% */
    letter-spacing: -0.15px;
}

.body14 {
    color: var(--text-black, #111);
    /* PC/body_14 */
    font-family: Pretendard;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    /* 171.429% */
    letter-spacing: -0.14px;
}


.body13 {
    color: var(--text-black, #111);
    /* PC/body_13 */
    font-family: Pretendard;
    font-size: 13px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px;
    /* 153.846% */
    letter-spacing: -0.13px;
}

.colorPrimary {
    color: var(--bg-primary-100);
}

.colorRed {
    color: var(--etc-notice);
}

.color111 {
    color: var(--text-black);
}

.color000 {
    color: var(--bg-b-bg);
}

.colorFFF {
    color: var(--text-white);
}

.color700 {
    color: var(--text-gray-700);
}

.color600 {
    color: var(--text-gray-600);
}

.color500 {
    color: var(--text-gray-500);
}

.color400 {
    color: var(--text-gray-400);
}

.color300 {
    color: var(--text-gray-300);
}

.color200 {
    color: var(--text-gray-200);
}

.color100 {
    color: var(--text-gray-100);
}

.flexLayout {
    display: flex;
    justify-content: space-between;
    gap: 40px;
}

main h4:hover,
main h2:hover,
.newsFrame .seoulMH_newsList li h4:hover,
.listPage-wrapper h2:hover,
.newsBox .articleTitle:hover ,
.viewRightSide h2:hover,
.viewRightSide h4:hover,
.viewRightSide .articleTitle:hover,
.articleBottomList h3:hover{
    transition: all .25s;
    color:var(--text-gray-600);
    cursor: pointer;
}

.layoutSectionBlock {
    width: 1280px;
    margin: 0 auto;
    margin-bottom: 100px;
}

/* block title */
.noBorder .layoutTitle,
.noBorder .calendar_wrap {
    padding-top: 0;
}

.layoutTitleWrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.layoutBorder {
    width: 100%;
    position: relative;
}

.layoutBorder:before {
    position: absolute;
    display: block;
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background: var(--bg-b-bg);
    border-radius: 20px;
}

.sub-layoutBorder {
    width: 100%;
    position: relative;
}

.sub-layoutBorder:before {
    position: absolute;
    display: block;
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background: var(--bg-b-bg);
    border-radius: 20px;
}


.layoutTitle {
    display: flex;
    justify-content: space-between;
    padding-top: 20px;
}

.layoutTitle.noTitle {
    padding-top: 0;
}

.topicWrap {
    display: flex;
    gap: 4px;
}

.topicWrap h3 {
    flex-shrink: 0;
}


.infoIconWrap {
    position: relative;
    width: 100%;
}

.infoIcon {
    cursor: pointer;
    display: block;
    text-indent: -9999px;
    font-size: 0;
    color: transparent;
    width: 30px;
    height: 30px;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp);
    background-repeat: no-repeat;
    background-position: -114px -117px;
}

.flotingInfo {
    display: none;
    position: absolute;
    top: -34px;
    left: 0;
    padding: 2px 12px;
    border-radius: 6px;
    background: var(--bg-primary-100);
}

.flotingInfo:after {
    z-index: -1;
    content: "";
    position: absolute;
    top: 8px;
    left: 4px;
    width: 21px;
    height: 21px;
    transform: rotate(-60deg) skewX(-30deg) scale(1, 0.866);
    background: var(--bg-primary-100);
    border-bottom-left-radius: 2px;
}

.sectionContentWrap {
    margin-top: 40px;
}

.sectionContentWrap .articleImage {
    border-radius: 12px;
    /* margin-bottom: 8px; */
}

.introduction .sectionContentWrap h2 {
    margin-bottom: 4px;
}

.blockTitle a {
    display: flex;
    align-items: center;
    gap: 4px;
}

.blockTitle a {
    padding-right: 22px;
}

.blockTitle a.arrowBg {
    position: relative;
}

.blockTitle a.arrowBg:after {
    display: block;
    content: '';
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat;
    background-position: -74px -71px;
    width: 11px;
    height: 20px;
}

.blockTitle {
    display: flex;
    align-items: center;
    gap: 4px;
}

.blockTitle span.outLink {
    cursor: pointer;
    text-indent: -9999px;
    color: transparent;
    font-size: 0;
    width: 16px;
    height: 22px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp");
    background-repeat: no-repeat;
    background-position: -265px -226px;
}

.blockSubTitle {
    position: relative;
    padding-right: 20px;
}

.blockSubTitle.subArrow:after {
    position: absolute;
    top: 0;
    right: 0;
    content: '';
    display: block;
    width: 16px;
    height: 16px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp");
    background-repeat: no-repeat;
    background-position: -298px -72px;
}

/* badge */
.badge {
    display: block;
    padding: 1px 8px;
    border-radius: 4px;
    color: transparent;
    text-align: center;
    font-size: 0;
    text-indent: -99999px;
    font-weight: 700;
    line-height: 20px;
    letter-spacing: -0.12px;
}

/* 단독 */
.badge.only {
    width: 21px;
    height: 20px;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp);
    background-repeat: no-repeat;
    background-position: -238px -339px;
}

/* 속보 */
.badge.flash {
    position: relative;
    width: 28px;
    height: 20px;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp);
    background-repeat: no-repeat;
    background-position: -74px -339px;
}

/* 기획 */
.badge.special {
    width: 29px;
    height: 20px;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp);
    background-repeat: no-repeat;
    background-position: -182px -339px;
}

.pc-footer.layout-wrapper,

.header-wrap.layout-wrapper,
.special-template .layout-wrapper {
    min-width: 1280px;
    width: 1280px;
    margin: 0 auto;
}


.layout-wrapper {
    width: 1280px;
    margin: 0 auto;
}

.scroll-fixedHeader {
    display: flex;
    left: 0;
    top: 0;
    width: 100%;
}

.viewFixedHeader {
    display: none;

}

.fixedHeaderShow {
    position: fixed;
    width: 100%;
    left: 0;
    display: none;
    z-index: 9999;
}

.fixedHeaderShow.open {
    position: fixed;
    width: 100%;
    left: 0;
    display: block;
    z-index: 9999;
}

.sticky {
    position: fixed;
    width: 100%;
    top: 0;
    left: 0;
    display: block;
    z-index: 9999;
}

.progressWrap {
    position: absolute;
    bottom: -1px;
    width: 100%;
}

.progressBar {
    height: 4px;
    background-color: var(--bg-primary-100);
    position: absolute;
    bottom: 1px;
}

.fixedHeader {
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--text-white);
    border-bottom: 1px solid var(--text-gray-300);
}

.fixedHeader .header-logo {
    width: 23px;
    height: 33px;
}

.fixedHeader-wrap {
    width: 1280px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 0;
}

.fixedHeader .util-wrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 24px;
}

.fixedHeader .listPageNav {
    display: flex;
    gap: 25px;
}

.fixedHeader-wrap .articleTitle {
    display: flex;
    align-items: center;
    gap: 8px;
}

.fixedHeader .listPageNav .pageTitle {
    position: relative;
}

.fixedHeader .listPageNav .pageTitle:after {
    position: absolute;
    content: '';
    display: block;
    top: 50%;
    right: -13px;
    transform: translateY(-50%);
    width: 1px;
    height: 16px;
    background: var(--text-gray-400);
}

.fixedHeader .listPageNav li.on {
    font-size: 16px;
    font-weight: 700;
    line-height: 26px;
    letter-spacing: -0.16px;
    color: var(--bg-primary-100, #F26930);
}

/* viewPage-fixedHeader */
.viewPage-fixedHeader {
    z-index: 10;
    position: fixed;
    top: 0;
    left: 0;
    padding: 17.5px 0;
    width: 100%;
    background: var(--text-white);
    border-bottom: 2px solid var(--text-gray-300);
}

.viewPage-fixedHeader .layout-wrapper {
    display: flex;
    justify-content: space-between;
}

.viewPage-fixedHeader .logo {
    width: 23px;
    height: 33px;
    background: url("https://img.seoul.co.kr/img/n24/fixedHeader-logo.png") no-repeat;
    background-position: 0 0;
}

.viewPage-fixedHeader .articleTitle {
    display: flex;
    align-items: center;
    gap: 8px;
}

.viewPage-fixedHeader .rightList {
    display: flex;
    align-items: center;
    gap: 24px;
}

.fixedHeader .nav-wrap .viewTool {
    display: flex;
    gap: 8px;
}

.fixedHeader .nav-wrap .viewTool>li {
    cursor: pointer;
    padding: 4px;
}

.fixedHeader .nav-wrap .viewTool .btn {
    cursor: pointer;
}

.fixedHeader .nav-wrap>.viewTool>li .btn {
    display: block;
    width: 24px;
    height: 24px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
}

.fixedHeader .nav-wrap .viewTool li:nth-child(1) .btn {
    background-position: -173px -254px;
}

.fixedHeader .nav-wrap .viewTool li:nth-child(2) .btn {
    background-position: -85px -252px;
}

.fixedHeader .nav-wrap .snsSharePopupBox {
    display: none;
    right: 59px;
    top: 74px;
    left: auto;
}

.fixedHeader .viewTool .replyNum {
    position: absolute;
    top: -4px;
    right: -12px;
    display: block;
    background: var(--etc-notice);
    border-radius: 20px;
    padding: 0 5px;
    min-width: 16px;
    text-align: center;
}


.joinPopup {
    display: none;
    z-index: 100;
    position: fixed;
    bottom: 24px;
    left: 24px;
}

.joinPopup .wrapper {
    width: 312px;
    box-sizing: border-box;
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 20px;
    background: var(--text-white);
    border: 1px solid var(--text-gray-400);
    border-radius: 12px;
    padding: 24px;
    color: var(--text-gray-400);
}

.joinPopup .seoulLogo {
    vertical-align: text-top;
    display: inline-block;
    width: 66px;
    height: 18px;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat;
    background-position: 0px -198px;
}

.joinPopup .closeBtn {
    cursor: pointer;
    position: absolute;
    top: 16px;
    right: 16px;
    width: 24px;
    height: 24px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -199px -225px;
}

.joinPopup .loginBtn {
    text-align: center;
    padding: 12px 0;
    border-radius: 8px;
    background: var(--bg-primary-100);
}


/* hamburgerMenu open */
.hamburgerMenu-depth {
    display: none;
    position: fixed;
    z-index: 9998;
    width: 100%;
    /* padding: 105px 0 0px; */
    padding: 40px 0 0;
    background: var(--text-white);
    border-bottom: 1px solid var(--text-gray-400);
}

.hamburgerMenu-depth.open,
.m-hamburgerMenu-depth.open {
    display: block;
}

.hamburgerMenu-top .layout-wrapper {
    display: flex;
    justify-content: space-between;
}

.header-sitemap {
    width: 100%;
    display: flex;
    justify-content: space-between;
    padding-right: 25px;
    border-right: 1px solid var(--text-gray-400);
}

.header-sitemap .column-layout {
    display: flex;
    flex-direction: column;
    gap: 40px 0;
}

.header-sitemap dt {
    font-size: 16px;
    font-weight: 700;
    line-height: 26px;
    letter-spacing: -0.16px;
    color: var(--text-black);
    padding-bottom: 12px;
}

.header-sitemap dd {
    color: var(--text-gray-600);
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 32px;
    letter-spacing: -0.14px;
    padding-right: 32px;
}

.header-sitemap dd a.on {
    color: var(--bg-primary-100, #F26930);
    font-size: 14px;
    font-weight: 700;
    line-height: 24px;
    /* 171.429% */
    letter-spacing: -0.14px;
}

.hamburgerMenu-top .rightSide {
    box-sizing: border-box;
    padding: 0 0 0 40px;
}

.inputSearch {
    width: 290px;
    position: relative;
}

.inputSearch .input-searchBox {
    box-sizing: border-box;
    display: flex;
    width: 100%;
    padding: 12px 20px;
    justify-content: space-between;
    align-items: center;
    border-radius: 6px;
    background: var(--text-gray-200);
    border: 0;
}

.inputSearch .input-searchBox::placeholder {
    color: #AAA;
}

.inputSearch a {
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
}

.inputSearch .input-searchBtn {
    text-indent: -9999px;
    color: transparent;
    font-size: 0;
    width: 24px;
    height: 24px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -177px -120px;
}

.hamburgerMenu-top .rightSide .keywordSearch ul {
    padding-top: 16px;
    ;
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}

.hamburgerMenu-top .rightSide .keywordSearch ul li div {

    padding: 4px 16px;
    border: 1px solid var(--text-gray-300);
    border-radius: 20px;
}

.hamburgerMenu-top .rightSide .keywordSearch ul li div:hover {
    transition: all .3s;
    background: var(--text-gray-100);
}

.newsLanking ol {
    counter-reset: rankingTop 0;
}

.newsLanking ol li {
    position: relative;
    padding-left: 26px;
    margin-bottom: 10px;
}


.newsLanking {
    margin-top: 50px;
    width: 290px;
}

.newsLanking h3 {
    margin-bottom: 16px;
}

.newsLanking .newsLankingNum.top3 {
    background: #F3670D;
}

.newsLanking .newsLankingNum {
    background: #AAA;
}

.newsLanking ol li:before {
    position: absolute;
    left: 0;
    display: inline-block;
    counter-increment: rankingTop;
    content: counter(rankingTop);
    color: #FFF;
    text-align: center;
    font-size: 12px;
    font-weight: 700;
    line-height: 20px;
    width: 20px;
    height: 20px;
    flex-grow: 0;
    flex-shrink: 0;
    background: #F3670D;
}

.newsLanking ol li:nth-child(n+4):before {
    background: #AAA;
}


.hamMenu-bottom {
    margin-top: 52px;
    background: var(--text-gray-200, #F4F4F4);
}

.hamMenu-bottom .layout-wrapper {
    display: flex;
    justify-content: space-between;
    padding: 19px 0;
}

.hamMenu-bottom .leftSide ul.listWrap {
    display: flex;
    gap: 0 24px;
}

.hamMenu-bottom .leftSide ul.listWrap li {
    position: relative;
}

.hamMenu-bottom .leftSide ul.listWrap>li:not(:last-child):after {
    position: absolute;
    top: 50%;
    right: -14px;
    transform: translateY(-50%);
    content: '';
    display: block;
    width: 3px;
    height: 3px;
    background: var(--text-gray-500);
    border-radius: 10px;
}

.hamMenu-bottom .rightSide {
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    gap: 0 32px;
}

.hamMenu-bottom .rightSide .snsWrap ul {
    display: flex;
    gap: 0 16px;
}

.hamMenu-bottom .rightSide .snsWrap ul li {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 24px;
    height: 24px;
}

.hamMenu-bottom .rightSide .snsWrap ul li a .icon {
    width: 24px;
    height: 24px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp");
    background-repeat: no-repeat;
    overflow: hidden;
    color: transparent;
    font-size: 0;
    text-indent: -99999px;
}

.hamMenu-bottom .rightSide .snsWrap ul li a .facebookBtn {
    background-position: -150px -162px;
}

.hamMenu-bottom .rightSide .snsWrap ul li a .twitterBtn {
    background-position: -252px -162px
}

.hamMenu-bottom .rightSide .snsWrap ul li a .kakaoBtn {
    background-position: -184px -162px
}

.hamMenu-bottom .rightSide .snsWrap ul li a .youtubeBtn {
    background-position: -184px -162px
}

.hamMenu-bottom .rightSide .snsWrap ul li a .instaBtn {
    background-position: -218px -162px
}

.hamMenu-bottom .rightSide .snsWrap ul li a .naverBtn {
    background-position: -286px -162px
}

.hamMenu-bottom .rightSide .snsWrap ul li a .naverBlogBtn {
    background-position: -574px -162px;
}

/* 0802 */
.owl-theme .owl-dots .owl-dot.active span,
.owl-theme .owl-dots .owl-dot:hover span {
  background: var(--bg-b-bg);
}

.owl-theme .owl-dots .owl-dot span {
  width: 8px;
  height: 8px;
  margin: 6px 6px;
  background: #BEBDBD;
}

#slick-headlineBranch .owl-nav.disabled+.owl-dots {
  margin: 24px 0;
}

#slick-photoNews .owl-stage-outer{
	height:255px;
}

.sectionContentWrap #slick-photoNews h2{
    width: 300px;
}

.owl-theme .owl-nav .disabled,
button.disabled {
  opacity: 0.6;
}
/* ---- */


.header-wrap {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    padding: 20px 0 22px;
}

.header-bottom {
    position: relative;
}

.header-bottom:after {
    content: '';
    display: block;
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 4px;
    border-radius: 10px;
    background: var(--bg-primary-100);
}

.header-logo {
    width: 227px;
    height: 80px;
}

.header-right {
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.nav-wrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
}

.nav-menuList {
    display: flex;
    gap: 24px;
    justify-content: space-between;
    align-items: center;
}

.nav-menuList li {
    flex-shrink: 0;
}

.view-nav-searchBtn,
.nav-searchBtn {
    width: 32px;
    height: 24px;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp?ver=001) no-repeat;
    background-position: -727px -120px;
    overflow: hidden;
}

.view-nav-searchBtn>img,
.nav-searchBtn>img {
    vertical-align: baseline;
}

.utilMenu {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}

.utilBtn {
    padding: 4px 12px;
    border-radius: 8px;
    background: var(--text-gray-200, #F4F4F4);
}

.utilBtn .loginBlock {
    display: flex;
    gap: 21px;
}

.utilBtn .loginBlock>a {
    display: inline-block;
}

.utilBtn .loginBlock>a:first-child {
    position: relative;
}

.utilBtn .loginBlock>a:first-child:after {
    display: block;
    content: '';
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: -11px;
    width: 1px;
    height: 10px;
    background: var(--text-black);
}

.utilBtn.loginState {
    display: block;
}

.utilBtn.logoutState {
    display: none;
}

.utilMenu .newsLetterBtn {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 9px;
    color: #fff;
    background: var(--bg-b-bg, #262323);
}

.utilMenu .newsLetterBtn span {
    width: 16px;
    height: 12px;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat;
    background-position: -68px -126px;
    overflow: hidden;
}

/* focus on / On-line Special */
.focusArticle {
    width: 1280px;
    margin: 0 auto;
    padding: 16px 0;
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid var(--text-gray-400);
}

.focusArticle .category {
    padding-right: 16px;
}
.focusArticle .articleTitle{
 padding:0 12px;
 position: relative;
}

.focusArticle .articleTitle2:before {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    width: 1px;
    height: 11px;
    background: var(--text-gray-400);
}

.articleTitle3 {
    position: relative;
    padding-right: 12px;
}

.articleTitle3:not(:first-of-type){
    padding-left: 12px;
}

.articleTitle3:last-of-type{
    padding-right: 0;
}

.articleTitle3:not(:first-of-type):before  {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    width: 1px;
    height: 11px;
    background: var(--text-gray-400);
}

.onLineSpecial,
.focusOn {
    display: flex;
    align-items: center;
}

.onLineSpecial .focusArticle .articleTitle {
    padding: 0 12px;
}

.focusArticle .onLineSpecial .category {
    padding-right: 4px;
}

#slick-onLineSpecial {
    position: relative;
    width: 425px !important;
	height: 20px;
}

#slick-onLineSpecial:after {
    position: absolute;
    display: block;
    content: '';
    top: 0;
    right: 0px;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0) 40%, rgba(255, 255, 255, 1) 84%, rgba(255, 255, 255, 1) 100%);
    width: 100px;
    height: 100%;
}

#slick-onLineSpecial li {
    box-sizing: border-box;
    position: relative;
    float: left;
    height: auto
}

#slick-onLineSpecial li:not(:first-child):after {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: -1px;
    width: 1px;
    height: 11px;
    background: var(--text-gray-400);
}

.arrowSlider {
    display: flex;
    gap: 4px;
}


.onLineSpecial #arow_prev {
    top: 0;
    left: 0;
    transition: all .3s;
    width: 24px;
    height: 24px;
    cursor: pointer;
}

.onLineSpecial #arow_next {
    position: relative;
    top: 0;
    left: auto;
    right: 0;
    width: 24px;
    height: 24px;
    cursor: pointer;
}

.onLineSpecial #arow_prev:before {
    content: '';
    opacity: 1;
    position: absolute;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat center;
    background-position: -1px -69px;
    width: 24px;
    height: 24px;
}

.onLineSpecial #arow_next:before {
    content: '';
    opacity: 1;
    position: absolute;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat center;
    background-position: -37px -69px;
    width: 24px;
    height: 24px;
}

.onLineSpecial #arow_prev,
.onLineSpecial #arow_next {
    opacity: 1;
}

/*---- 0802 ----*/
.onLineSpecial .owl-prev {
  border: 0;
  background: 0;
  position: relative;
  top: 0;
  left: 0;
  transition: all .3s;
  width: 24px;
  height: 24px;
  cursor: pointer;
}

.onLineSpecial .owl-prev::before {
  content: '';
  opacity: 1;
  position: absolute;
  top: 0;
  left: 0;
  background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat center;
  background-position: -1px -69px;
  width: 24px;
  height: 24px;
}

.onLineSpecial .owl-next {
  border: 0;
  background: 0;
  position: relative;
  top: 0;
  left: 0;
  transition: all .3s;
  width: 24px;
  height: 24px;
  cursor: pointer;
}

.onLineSpecial .owl-next::before {
  content: '';
  opacity: 1;
  position: absolute;
  top: 0;
  left: 0;
  background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat center;
  background-position: -37px -69px;
  width: 24px;
  height: 24px;
}
/*------------*/



/* main-top */

.todayDate {
    width: 1280px;
    margin: 4px auto 18px;
    color: #747474;
    font-size: 11px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px;
    letter-spacing: -0.11px;
    text-align: right;
}

.main-top {
    padding: 0 0 100px;
}

.main-top-layout {
    margin: 0 auto;
    width: 1280px;
    display: flex;
    justify-content: space-between;
}

.layout-block-group {
    display: flex;
    justify-content: space-between;
    gap: 40px;
}

.headlineNews {
    width: 610px;
}

.imageWrap {
    display: flex;
    justify-content: center;
    align-items: center;
}

.headlineNews .mainNews-top {
    position: relative;
}

.headlineNews .mainNews {
/*
    border-bottom: 1px solid var(--text-gray-300);
    border-bottom-left-radius: 12px;
    border-bottom-right-radius: 12px;
*/
}

.mainNews {
    position: relative;
    overflow: hidden;
	/*
    width: 610px !important;
    height: 407px;
	*/
}

.headlineNews .articleImage {
    position: relative;
    width: 610px;
    height: 407px;
    border-radius: 12px;
    overflow: hidden;
}

.main-top-layout .headlineNews .articleImage>img {
    position: absolute;
    margin-left: 0;
    margin-right: 0;
    width: 610px;
}

.headlineNews .articleImage:after {
    display: block;
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 274px;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, #000 100%);
    opacity: .6;
    border-radius: 12px;
}


/* 20241111 탑포토 슬라이드 */
                                .headlineNews .articleImage.topSlide {
									/*
                                    position: relative;
                                    width: 610px;
                                    height: 407px;
                                    border-radius: 12px;
                                    overflow: hidden;
									*/
                                    display: flex !important;
                                    align-items: center;
                                    justify-content: center;
                                    background: var(--text-gray-200);
                                }

                                .main-top-layout .headlineNews .articleImage.topSlide > img {
								/*
                                    position: absolute;
                                    margin-left: 0;
                                    margin-right: 0;
									*/
									z-index: 10;
                                    max-width: 610px;
                                    width: auto;
                                    height: 100%;
                                    border-radius: 0;
                                }

                                .btn-32 .owl-prev:before {
                                    z-index: 10;
                                    content: '';
                                    opacity: 1;
                                    position: absolute;
                                    top: 0;
                                    left: 0;
                                    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat center;
                                    background-position: -1px -9px;
                                    width: 33px;
                                    height: 33px;
                                }

                                .btn-32 .owl-prev {
                                    z-index: 10;
                                    border: 0;
                                    background: 0;
                                    cursor: pointer;
                                    position: absolute;
                                    top: 50%;
                                    left: 15px;
                                    transform: translateY(-50%);
                                    transition: all .3s;
                                    width: 33px;
                                    height: 33px;
                                }

                                .btn-32 .owl-prev:hover:before {
                                    background-position: -212px -9px;
                                    width: 33px;
                                    height: 33px;
                                }

                                .btn-32 .owl-next {
                                    z-index: 10;
                                    border: 0;
                                    background: 0;
                                    cursor: pointer;
                                    position: absolute;
                                    top: 50%;
                                    transform: translateY(-50%);
                                    left: auto;
                                    right: 15px;
                                    width: 33px;
                                    height: 33px;
                                }

                                .btn-32 .owl-next:before {
                                    z-index: 10;
                                    content: '';
                                    opacity: 1;
                                    position: absolute;
                                    top: 0;
                                    left: 0;
                                    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat center;
                                    background-position: -44px -9px;
                                    width: 33px;
                                    height: 33px;
                                }

                                .btn-32 .owl-next:hover:before {
                                    background-position: -256px -9px;
                                    width: 33px;
                                    height: 33px;
                                }

                                #mainNewsPhoto-arrowSlider button {
                                    opacity: 0;
                                }

                                .mainNews:hover #mainNewsPhoto-arrowSlider button {
                                    transition: all .15s;
                                    opacity: 1;
                                }

                                #owl-mainNewsPhoto {
                                    overflow: hidden;
                                    border-radius: 12px;
                                }

								#owl-mainNewsPhoto .bg_blur { background-size: cover; background-position: center; filter: blur(15px); width: 100%; height: 100%; transition: opacity 0.8s; opacity: 0; }
								#owl-mainNewsPhoto .owl-item.active .bg_blur { opacity: 1; }
/*/////////*/

.headlineNews .articleImage .headlineNews .articleTitle img {
    border-radius: 12px;
}

.headlineNews .articleTitle {
    z-index: 10;
    position: absolute;
    bottom: 0;
    padding: 0 40px 32px;
}

.headlineNews .articleTitle .badge {
    margin-bottom: 10px;
}

.headlineNews .mainNews-linked {
    margin-top: 20px;
}

.headlineNews .articleContent {
    margin: 0 0 12px;
}

.articleTime {
    color: var(--text-gray-500, #999);
    font-size: 14px;
    font-weight: 500;
    line-height: 24px;
    letter-spacing: -0.14px;
}

.branchNews {
    margin-top: 32px;
}

#slick-headlineBranch {
    width: 610px;
}

#slick-headlineBranch .slick-list {
    padding-bottom: 42px;
    box-sizing: border-box;
    width: 610px;
}

#slick-headlineBranch .slick-slide div {
    position: relative;
    padding-left: 18px;
    /*width: 610px;*/
	width: 592px;
}

/*
#slick-headlineBranch .slick-slide div:before {
    content: '';
    display: block;
    position: absolute;
    top: 11px;
    left: 0;
    width: 6px;
    height: 6px;
    background: var(--text-black, #111);
    border-radius: 3px;
}
*/

/****** 240208 개발자 수정 *****/
#slick-headlineBranch > li { position: relative; /* padding-left: 18px; */ width: 610px; }
/*
#slick-headlineBranch .slick-slide div > li:before,
#slick-headlineBranch > li:before{
    content: '';
    display: block;
    position: absolute;
    top: 11px;
    left: 0;
    width: 6px;
    height: 6px;
    background: var(--text-black, #111);
    border-radius: 3px;
}
*/

/*--- 0802 ---*/
#slick-headlineBranch .slideBlock div {
  position: relative;
  position: relative;
  padding-left: 18px;
  width: calc(100% - 18px);
  height: 38px;
}

#slick-headlineBranch .slideBlock div:before {
  content: '';
  display: block;
  position: absolute;
  top: 11px;
  left: 0;
  width: 6px;
  height: 6px;
  background: var(--text-black, #111);
  border-radius: 3px;
}
/*---------*/

.secondary-block {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.secondary-block .badge {
    margin-bottom: 4px;
}

.main-top .secondary-block .newsBox {
    width: 290px;
}

.main-top .third-block {
    width: 300px;
}

.main-top .third-block .newsBox {
    display: flex;
    gap: 20px;
    align-items: center;
}

.main-top .third-block .articleImage {
    flex-shrink: 0;
    display: flex;
    width: 80px;
    height: 80px;
    overflow: hidden;
    border-radius: 12px;
    align-items: center;
    justify-content: center;
}

.main-top .third-block .articleImage img {
    height: 100%;
    width: auto;
    border-radius: 12px;
}

.main-top .secondary-block .newsBox .articleImage {
    width: 290px;
    height: 194px;
    border-radius: 12px;
    overflow: hidden;
    margin-bottom: 12px;
    flex-shrink: 0;
}

.main-top .newsBox .body14 {
    display: block;
}


.main-top .newsBox .articleImage img {
    border-radius: 12px;
}

.main-top .newsBox .articleTitle .badge {
    margin-bottom: 4px;
}

.main-top .newsBox .articleTitle h2 {
    margin-bottom: 4px;
}

.main-top .newsBox .articleContent {
    margin-bottom: 12px;
}

.main-top .third-block .newsBoxWrap {
    margin-bottom: 40px;
}

.main-top .third-block .newsBox {
    padding: 16px 0;
    border-bottom: 1px solid var(--text-gray-300);
}

.main-top .third-block .newsBox:first-child {
    padding-top: 0;
}

.main-top .third-block .newsBox:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.main-top .third-block .articleTitle .badge {
    margin-bottom: 6px;
}

.main-top .third-block .articleTitle h2 {
    margin-bottom: 8px;
}

.main-top .first-block .newsBoxWrap {
    padding-bottom: 40px;
}

.main-top .first-block .newsBox {
    display: flex;
    align-items: center;
    gap: 20px;
    border-bottom: 1px solid var(--text-gray-300);
    padding: 20px 0;
}

.main-top .first-block .newsBox:first-child {
    padding-top: 0;
}

.main-top .first-block .newsBox:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.main-top .first-block .newsBox .articleImage {
    width: 114px;
    height: 114px;
    border-radius: 8px;
    overflow: hidden;
    display: flex;
    flex-shrink: 0;
    justify-content: center;
    align-items: center;
    margin-bottom: 0;
}

.main-top .first-block .newsBox .articleImage img {
    height: 100%;
    width: auto;
}

.headlineNews .mainNews-linked .articleTitle {
    position: relative;
    padding: 0 0 20px;
}

.headlineNews .mainNews-linked .articleTitle .badge {
    margin-bottom: 8px;
}

/* stlye02 */
.main-top.style02 .third-block {
    order: 1;
}

.main-top.style02 .layout-block-group {
    order: 2;
}

.main-top.style02 .third-block .newsBox {
    align-items: center;
}

.main-top.style02 .third-block .articleTitle h2 {
    margin-bottom: 6px;
}

.main-top.style02 .third-block .articleImage {
    display: flex;
}

/* nobranch */

.main-top.nobranch .mainNews-top .articleTitle {
    position: relative;
    padding: 20px 0 0;
}

.main-top.nobranch .mainNews-top .articleTitle h1 {
    color: var(--text-black);
}

.main-top.nobranch .mainNews-top .articleTitle h1:hover{
    transition: all .25s;
    color:var(--text-gray-600);
    cursor: pointer;
}

.main-top.nobranch .branchNews {
    display: none;
}


/* style03 */
.main-top.style03 .main-top-layout {
    gap: 42px;
}

.main-top.style03 .layout-block-group {
    flex-direction: column;
    justify-content: flex-start;
    gap: 0;
}

.main-top.style03 .headlineNews {
    width: 100%;
    display: flex;
    flex-direction: row;
    gap: 28px;
    ;
    margin: 35px 0 48px;
}

.main-top.style03 .headlineNews .mainNews-top {
    order: 2;
    border-bottom: 0;
}

.main-top.style03 .headlineNews .articleTitle {
    display: none;
    position: relative;
}

.main-top.style03 .headlineNews .articleTitle h1 {
    color: #000 !important;

}

.main-top.style03 .headlineNews .mainNews-linked .body14 {
    display: block;
    padding-bottom: 17px;
    border-bottom: 1px solid var(--text-gray-300);
}

.main-top.style03 .headlineNews .mainNews-linked {
    order: 1;
    width: 300px;
    margin-top: 0;
}

.main-top.style03 .branchNews {
    margin-top: 20px;
}

.main-top.style03 #slick-headlineBranch {
    width: 300px;
}

.main-top.style03 #slick-headlineBranch > li {
    width:100%;
}

.main-top.style03 #slick-headlineBranch .slick-list {
    padding-bottom: 23px;
    box-sizing: border-box;
    width: 300px;
}

.main-top.style03 .slick-dotted.slick-slider {
    margin-bottom: 0;
}

.main-top.style03 #slick-headlineBranch .slick-slide div {
    box-sizing: border-box;
    position: relative;
    padding-left: 18px;
    width: 300px;
}

.onlyStyle03 {
    display: none;
}

.main-top.style03 .onlyStyle03 {
    display: block;
}

.main-top.style03 .articleTitle .badge {
    margin-bottom: 2px;
}

.main-top.style03 .headlineNews .articleContent {
    display: -webkit-box;
    -webkit-line-clamp: 6;
    /* 라인수 */
    -webkit-box-orient: vertical;
    white-space: normal;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-bottom: 6px;
}

.main-top.style03 .secondary-block {
	display: flex;
	flex-direction: row;
	border-top: 1px solid var(--text-gray-300);
	padding-top: 48px;
}

.main-top.style03 .secondary-block .newsBox {
    width: 455px;
    display: flex;
    flex-direction: row;
    gap: 24px;
}

.main-top.style03 .secondary-block .articleImage {
    order: 2;
    width: 180px;
    height: 120px;
}

.main-top.style03 .secondary-block .textWrap {
    order: 1;
	margin-left: -24px;
}

.main-top.style03 .secondary-block .articleTitle {
	position: relative;
}

.main-top.style03 .secondary-block .badge {
	position: absolute;
	top: -26px;
}

.main-top.style03 .newsBox .articleTitle .badge,
.main-top.style03 .newsBox .articleTitle h2,
.main-top.style03 .newsBox .articleContent {
    margin-bottom: 7px;
}

.main-top.style03 .third-block .articleTitle .badge {
    margin-bottom: 8px;
}



/* main-top-template02 */
.main-top-template02 .first-block {
    width: 300px;
}

/* main-top-template03 */
.main-top-template03 {
    gap: 40px;
}

.main-top-template03 .mainNews {
    padding-bottom: 48px;
}

.main-top-template03 .headlineNews {
    width: 938px;
}

.main-top-template03 h1 {
    font-family: Pretendard;
    font-size: 38px;
    font-style: normal;
    font-weight: 700;
    line-height: 48px;
    /* 126.316% */
    letter-spacing: -0.38px;
}

.main-top-template03 .headlineNews .articleTitle {
    position: relative;
    padding: 0 0 36px;
}

.main-top-template03 .left-block {
    display: flex;
    gap: 28px;
}

.main-top-template03 .headlineNews .articleContent {
    margin: 0 0 6px;
}

.main-top-template03 .left-block .articleContentSide {
    width: 300px;
}

.main-top-template03 .left-block .articleContentWrap {
    padding-bottom: 17px;
    border-bottom: 1px solid var(--text-gray-300);
}

.main-top-template03 .left-block .articleImage {
    width: 610px;
    height: 406px;
    flex-shrink: 0;
}

.main-top-template03 .headlineNews .articleImage:after {
    display: none;
}

.main-top-template03 .branchNews {
    margin-top: 20px;
}

.main-top-template03 #slick-headlineBranch ul {
    width: 300px;
}

.main-top-template03 .branchNewsList li:not(:first-child) {
    margin-top: 10px;
}

.main-top-template03 #slick-headlineBranch .slick-list {
    padding-bottom: 44px;
}

.main-top-template03 .slick-dotted.slick-slider {
    margin-bottom: 0;
}

.main-top-template03 .branchNewsList li:before {
    top: 12px;
    transform: translateY(0);
    width: 4px;
    height: 4px;
}

.main-top-template03 .branchNewsList li {
    padding-left: 12px;
}

.main-top-template03 .mainBottom {
    padding-top: 38px;
}

.main-top-template03 .mainBottom .newsBoxWrap {
    display: flex;
    justify-content: space-between;
}

.main-top-template03 .mainBottom .newsBox {
    display: flex;
    width: 455px;
    gap: 24px;
}

.main-top-template03 .mainBottom .newsBox .articleContentWrap {
    width: 250px;
}

.main-top-template03 .headlineNews .mainBottom .articleTitle {
    padding: 0px;
}

.main-top-template03 .mainBottom .newsBox .articleImage {
    width: 180px;
    height: 120px;
    flex-shrink: 0;
}

.main-top-template03 .headlineNews .newsBox .articleImage>img {
    width: 100%;
}

.main-top .third-block,
.main-top-template03 .main-top .third-block {
    flex-shrink: 0;
}

/* special-template  */
.special-template.themeWhite {
    position: relative;
}

.special-template.themeWhite:after {
    position: absolute;
    display: block;
    content: '';
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 1280px;
    height: 4px;
    background: var(--bg-b-bg);
    border-radius: 20px;
}

.special-template.typeA {
    padding: 60px 0 100px;
    margin-bottom: 100px;
}

.special-template.typeA .headlineNews,
.special-template.typeB .headlineNews {
    width: 100%;
}

.special-template.typeA .headlineNews .mainNews {
    border-bottom: 0;
    overflow: hidden;
}

.special-template.typeA .headlineNews .mainNews .articleTitle {
    max-width: 1280px;
    margin: 0 auto;
    position: relative;
    padding: 0 0 40px;
}

.special-template.typeA .headlineNews .articleTitle {
    position: relative;
    padding: 0 0 0;
}

.special-template.typeA .headlineNews .articleTitle .badge {
    margin-bottom: 6px;
}


.special-template.typeA .headlineNews .mainNews h1 {
    margin-bottom: 12px;
}

.typeA .mainNews .slickSlideWrap {
    width: 100%;
    overflow: hidden;
}

/* typeB */
.special-template.typeB {
    padding: 50px 0 100px;
    margin-bottom: 100px;
}

.special-template.typeB .headlineNews .articleTitle {
    position: relative;
    border-bottom: 0;
    border-radius: 0;
    padding: 0 0 0;
}

.special-template.typeB .headlineNews .mainNews {
    border-bottom: 0;
    border-radius: 0;
}

.special-template.typeB .headlineNews .mainNews h1 {
    max-width: 1280px;
    margin: 0 auto;
    text-align: center;
    margin-bottom: 0;
}

.special-template.typeB .headlineNews .mainNews .articleTitle {
    padding-bottom: 32px;
}

.special-template.typeB .headlineNews .articleContentWrap {
    position: relative;
    width: 840px;
    height: 520px;
    margin: 0 auto 65px;
}

.special-template.typeB .headlineNews .articleContentWrap::after {
    display: block;
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 244px;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, #000 72.87%);
    opacity: .7;
    border-bottom-left-radius: 11px;
    border-bottom-right-radius: 11px;
}

.special-template.typeB .headlineNews .articleImage {
    position: relative;
    width: 840px;
    height: 520px;
}

.special-template.typeB .headlineNews .articleContentWrap img {
    position: absolute;
    margin-left: 0;
    margin-right: 0;
    width: 840px;
}


.special-template.typeB .headlineNews .articleContent {
    z-index: 5;
    position: absolute;
    bottom: 32px;
    left: 40px;
    max-width: 760px;
    color: var(--text-white);
    text-align: center;
}

.special-template.typeB .timeLineSlider .resetBtn {
    padding-bottom: 14px;
}

.special-template.typeB .timeLineSlider {
    position: relative;
    margin: 65px 0 74px;
}


#slick-specialTemplate {
    height: 560px;
    margin-left: -40px;
    width: 1280px;
    margin: 0 auto;
}

#slick-specialTemplate .slick-list {
    padding-bottom: 80px;
    overflow: visible;
}

#slick-specialTemplate li.slick-slide {
    height: 560px;
    width: auto;
    max-width: 840px;
    padding-right: 40px;
    border-radius: 12px;
    display: flex;
    justify-content: center;
    align-items: center;
}


#slick-specialTemplate li img {
    height: 560px;
    border-radius: 12px;
}

#slick-specialTemplate.slick-dotted.slick-slider {
    margin-bottom: 119px !important;
}

#slick-specialTemplate .slick-dots {
    bottom: -60px;
}

.themeBlack #slick-specialTemplate .slick-dots li button:before {
    background-color: rgba(255, 255, 255, .4);
}

.themeBlack #slick-specialTemplate .slick-dots li.slick-active button:before {
    background-color: var(--text-white) !important;
}

#specialTemplate-prevArrow {
    z-index: 100;
    cursor: pointer;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    width: 60px;
    height: 60px;
}

#specialTemplate-nextArrow {
    z-index: 100;
    cursor: pointer;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: auto;
    right: 0;
    width: 60px;
    height: 60px;
}

#specialTemplate-prevArrow:before {
    content: '';
    opacity: 1;
    position: absolute;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat center;
    background-position: -1px -372px;
    width: 60px;
    height: 60px;
    /* transform: rotate(180deg); */
}

#specialTemplate-nextArrow:before {
    content: '';
    opacity: 1;
    position: absolute;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat center;
    background-position: -72px -372px;
    width: 60px;
    height: 60px;
}


#slick-specialBottomList {
    position: relative;
    overflow: hidden;
    margin-left: -20px;
}

#slick-specialBottomList li.slick-slide {
    width: 305px !important;
    padding-left: 20px;
}

#slick-specialBottomList li .articleTitle {
    margin-top: 12px;
}

#slick-specialBottomList .articleImage {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 305px;
    height: 204px;
    border-radius: 12px;
    overflow: hidden;
}

#slick-specialBottomList .articleImage:after {
    display: none;
}

#slick-specialBottomList li img {
    border-radius: 12px;
}

.timeLineSlider {
    margin: 0 0 89px;
}

.timeLineSlider .resetBtn {
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 2px;
    padding-bottom: 21px;
}

.timeLineSlider .resetBtn .text {
    display: inline-block;
    color: var(--text-gray-600, #666);
    font-family: Pretendard;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
    /* 171.429% */
    letter-spacing: -0.14px;
}

.timeLineSlider .resetBtn .icon {
    display: inline-block;
    width: 20px;
    height: 20px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -500px -340px;
}

.timeLineWrap {
    padding: 20px 0 24px 0;
    border-radius: 8px;
}

#slick-top-timeLine li {
    box-sizing: border-box;
    width: 234px;
}

.timeLineGraphic {
    width: 234px;
}

.timeLineBlock {
    display: flex;
    flex-direction: column;
}

.timeText {
    padding-bottom: 8px;
}

/* header black */
.bg-black {
    background-color: var(--bg-b-bg);
}

.bg-black .header-bottom:after {
    background: var(--text-white);
}

.bg-black .utilBtn {
    background: var(--text-gray-700);
    color: var(--text-white)
}

.bg-black .utilBtn.newsLetterBtn {
    background: var(--text-white);
    color: var(--text-black);
}

.bg-black .utilBtn .loginBlock>a:first-child:after {
    background: var(--text-white)
}

.bg-black .nav-searchBtn {
    background-position: 0 -120px;
}

.bg-black .utilMenu .newsLetterBtn span {
    background-position: -95px -126px;
}

.bg-black .nav-menuList {
    color: var(--text-white);
}

.bg-black .showMoreBtn {
    box-shadow: 0;
}



.timeLineContent {
    box-sizing: border-box;
    width: 180px;
    padding-top: 3px;
}

#timeLine-prevArrow {
    cursor: pointer;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: -63px;
    width: 33px;
    height: 33px;
}

#timeLine-nextArrow {
    cursor: pointer;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: auto;
    right: -63px;
    width: 33px;
    height: 33px;
}


#specialBottomList-prevArrow {
    cursor: pointer;
    position: absolute;
    top: 112px;
    left: -63px;
    width: 33px;
    height: 33px;
}

#specialBottomList-nextArrow {
    cursor: pointer;
    position: absolute;
    top: 112px;
    left: auto;
    right: -63px;
    width: 33px;
    height: 33px;
}

#timeLine-prevArrow:before,
#specialBottomList-prevArrow:before {
    content: '';
    opacity: 1;
    position: absolute;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat center;
    background-position: -755px -9px;
    width: 33px;
    height: 33px;
}

#timeLine-nextArrow:before,
#specialBottomList-nextArrow:before {
    content: '';
    opacity: 1;
    position: absolute;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat center;
    background-position: -800px -9px;
    width: 33px;
    height: 33px;
}

/* typeA-black */
/* typeB-black */
.themeBlack {
    background: var(--bg-b-bg);
}


.typeB {
    position: relative;
    /* background: url(../img/special/special_typeB_w_bg.png) no-repeat center top; */
    background-image: url(https://img.seoul.co.kr/img/upload/2024/01/23/SSC_20240123141540.jpg);
    background-color:rgba(0, 0, 0, .5);
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
    background-blend-mode: luminosity;
}


.typeB:before {
    z-index: 0;
    position: absolute;
    content: '';
    display: block;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, #FFF 2.6%, rgba(0, 0, 0, 0.05) 31.77%, rgba(255, 255, 255, 0.80) 74.21%, #FFF 100%);
}

.typeB.themeBlack:before {
    z-index: 0;
    position: absolute;
    content: '';
    display: block;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, #262323 0.3%, rgba(0, 0, 0, 0.40) 18.52%, rgba(0, 0, 0, 0.40) 61.02%, #000 100%);
}

.themeBlack .headlineNews .mainNews h1 {
    color: var(--text-white)
}

.themeBlack .timeLineWrap {
    padding: 20px 0 24px 30px;
    background: rgba(17, 17, 17, 0.50);
}

.themeBlack .timeLineContent {
    color: var(--text-white);
}

.themeBlack .timeLineSlider .resetBtn .text {
    color: var(--text-white);
}

.themeBlack .timeLineSlider .resetBtn .icon {
    background-position: -471px -340px;
}

.themeBlack #slick-specialBottomList .articleTitle h2 {
    color: var(--text-white);
}

.themeBlack #timeLine-prevArrow:before,
.themeBlack #specialBottomList-prevArrow:before {
    background-position: -636px -8px;
}

.themeBlack #timeLine-nextArrow:before,
.themeBlack #specialBottomList-nextArrow:before {
    background-position: -680px -8px;
}

.special-template.typeB.themeBlack .timeLineSlider {
    margin: 40px 0 78px;
}

.special-template.typeB.themeBlack .timeLineSlider .resetBtn {
    padding-bottom: 18px;
    padding-left: 8px;
}

.themeBlack .timeCircle {
    box-sizing: border-box;
    position: relative;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 12px;
    height: 12px;
    padding: 4px;
    border-radius: 10px;
    background: var(--bg-primary-100);
}

.themeWhite .timeLineWrap {
    padding: 20px 0 24px 30px;
    background: rgba(255, 255, 255, 0.50);
}

.themeBlack .timelineBorder {
    border-top: 2px solid var(--bg-primary-100);
    margin-left: 4px;
}

.themeBlack li:nth-child(1) .timeCircle {
    position: relative;
    background-color: transparent;
}

.themeBlack li:nth-child(1) .timeCircle:after {
    position: absolute;
    top: -2px;
    left: 0;
    display: block;
    content: '';
    width: 14px;
    height: 14px;
    background-image: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp");
    background-repeat: no-repeat;
    background-position: -446px -343px;
}


.themeWhite .timelineBorder {
    border-top: 2px dashed var(--bg-primary-100);
    margin-left: 13px;
}

.themeWhite .timeCircle {
    box-sizing: border-box;
    position: relative;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 10px;
    height: 10px;
    border-radius: 10px;
    background-color: 0;
    border: 2px solid var(--bg-primary-100);
}

.themeWhite li:nth-child(1) .timeCircle {
    border: 0;
    background-color: var(--bg-primary-100);
}


.main-top .adArea .ad {
    height: auto;
    background: 0;
}

/* slick - banner */
#slick-banner {
    width: 300px;
    padding-bottom: 34px;
}

#slick-banner>li {
    width: 300px;
    height: 100px;
    border-radius: 8px;
}

#slick-banner .slide-list,
#slick-banner .slick-slide{
    border-radius: 8px;
}

#slick-banner li img { border-radius: 8px; }

#slick-banner3 {
    padding-bottom: 30px;
}

/*0802*/
#slick-banner .item {
  width: 300px;
  height: 100px;
  border-radius: 8px;
}

#slick-banner .item img {
  border-radius: 8px;
}
/* ---- */

/* 투데이뉴스 */
.todayNews {
    width: 940px;
}

.todayNews .sectionContentWrap>li:last-child {
    border-bottom: 0;
}

.newsBox_column {
    display: flex;
    flex-direction: column;
    padding: 50px 0;
    border-bottom: 1px solid var(--text-gray-300);
}

.newsBox_column:first-child {
    padding-top: 0;
}

.newsBox_column:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}

.newsBox_row1 {
    display: flex;
    /*justify-content: space-between;*/
    justify-content: flex-start;
    gap: 40px;
    padding: 50px 0;
    border-bottom: 1px solid var(--text-gray-300);
}

.newsBox_row1:first-child {
    padding-top: 0;
}

.newsBox_row1 .articleImage {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    width: 400px;
    height: 266px;
    overflow: hidden;
    border-radius: 12px;
}

.newsBox_row1 .articleImage img {
    border-radius: 12px;
}

.newsBox_row1 .articleContentWrap {
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding-right: 20px;
}

.newsBox_row1 .articleContentWrap .groupTitle {
    display: flex;
    gap: 4px;
}

.newsBox_row1 .articleContentWrap .articleTitle .badge {
    margin-bottom: 8px;
}

.newsBox_row1 .articleContentWrap .articleTitle h2 {
    margin: 0 0 12px;
}

.newsBox_row1 .articleContentWrap .articleContent {
    width: 800px;
    padding-right: 40px;
}

.todayNews .sectionContentWrap>li:nth-child(4),
.todayNews .sectionContentWrap>li:nth-child(5),
.todayNews .sectionContentWrap>li:nth-child(9),
.todayNews .sectionContentWrap>li:nth-child(10) {
    display: inline-flex;
    gap: 24px;
    justify-content: flex-start;
    width: 430px;
    border-bottom: 0;
}

.todayNews .sectionContentWrap>li:nth-child(4),
.todayNews .sectionContentWrap>li:nth-child(5) {
    display: inline-block;
}

.todayNews .sectionContentWrap>li:nth-child(4),
.todayNews .sectionContentWrap>li:nth-child(9) {
    padding-right: 35px;
}

.todayNews .sectionContentWrap>li:nth-child(5),
.todayNews .sectionContentWrap>li:nth-child(10) {
    padding-left: 35px;
}

.todayNews .sectionContentWrap>li:nth-child(4) .articleContentWrap,
.todayNews .sectionContentWrap>li:nth-child(5) .articleContentWrap,
.todayNews .sectionContentWrap>li:nth-child(9) .articleContentWrap,
.todayNews .sectionContentWrap>li:nth-child(10) .articleContentWrap {
    display: flex;
    justify-content: flex-start;
    gap: 0;
    padding-right: 0;
}

.todayNews .sectionContentWrap>li:nth-child(9) .articleContentWrap,
.todayNews .sectionContentWrap>li:nth-child(10) .articleContentWrap {
    gap: 24px;
}

/* 20250102 */
.todayNews .sectionContentWrap>li:nth-child(4) .articleTitle,
 .todayNews .sectionContentWrap>li:nth-child(5) .articleTitle,
.todayNews .sectionContentWrap>li:nth-child(9) .articleTitle,
 .todayNews .sectionContentWrap>li:nth-child(10) .articleTitle {
    position: relative;
}

.todayNews .sectionContentWrap>li:nth-child(4) .badge,
.todayNews .sectionContentWrap>li:nth-child(5) .badge {
   position: absolute;
   top: -26px;
}
/*/////*/

.todayNews .sectionContentWrap>li:nth-child(4) .articleTitle h2,
.todayNews .sectionContentWrap>li:nth-child(5) .articleTitle h2,
.todayNews .sectionContentWrap>li:nth-child(9) .articleTitle h2,
.todayNews .sectionContentWrap>li:nth-child(10) .articleTitle h2 {
    font-size: 24px;
    font-weight: 700;
    line-height: 34px;
    letter-spacing: -0.24px;
    padding: 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
    margin-bottom: 8px;
    /* min-height: 68px; */
}

.todayNews .sectionContentWrap>li:nth-child(4) .text,
.todayNews .sectionContentWrap>li:nth-child(5) .text {
    display: none;
}

.todayNews .sectionContentWrap>li:nth-child(9) .articleTitle,
.todayNews .sectionContentWrap>li:nth-child(10) .articleTitle {
	position: relative;
}

.todayNews .sectionContentWrap>li:nth-child(9) .badge,
.todayNews .sectionContentWrap>li:nth-child(10) .badge {
	position: absolute;
	top: -24px;
}

/*
.todayNews .sectionContentWrap>li:nth-child(4) .articleImage,
.todayNews .sectionContentWrap>li:nth-child(5) .articleImage {
    float: left;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    width: 180px;
    height: 120px;
    overflow: hidden;
    border-radius: 12px;
    margin-right: 24px;
}
*/

/* 20241111 */
.todayNews .sectionContentWrap>li:nth-child(4) .articleContentWrap,
.todayNews .sectionContentWrap>li:nth-child(5) .articleContentWrap {
    display: flex;
    justify-content: space-between;
    gap: 0;
    padding-right: 0;
    height: 140px;
}

.todayNews .sectionContentWrap>li:nth-child(4) .articleTitle h2,
.todayNews .sectionContentWrap>li:nth-child(5) .articleTitle h2 {
    -webkit-line-clamp: 3;
    margin-bottom: 0;
}

.todayNews .sectionContentWrap>li:nth-child(4) .articleImage,
.todayNews .sectionContentWrap>li:nth-child(5) .articleImage {
    float: left;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    width: 210px;
    height: 140px;
    overflow: hidden;
    border-radius: 12px;
    margin-right: 24px;
}

.todayNews .sectionContentWrap>li:nth-child(4) .articleImage img {
    height: 100%;
    width: auto;
}
/*////////*/

.todayNews .sectionContentWrap>li:nth-child(9) .articleImage,
.todayNews .sectionContentWrap>li:nth-child(10) .articleImage {
    display: none;
}

.todayNews .sectionContentWrap>li:nth-child(9) .lineclamp3,
.todayNews .sectionContentWrap>li:nth-child(10) .lineclamp3 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
}

.todayNews .sectionContentWrap>li:nth-child(9) .articleContentWrap .articleContent,
.todayNews .sectionContentWrap>li:nth-child(10) .articleContentWrap .articleContent {
    display: none;
}

.todayNews .sectionContentWrap>li:nth-child(6),
.todayNews .sectionContentWrap>li:nth-child(11) {
    border-top: 1px solid var(--text-gray-300);
}

.main-rightBoxWrap {
    width: 300px;
}

/* 사설 */
#slick-editorial {
    box-sizing: border-box;
    width: 300px;
    min-height: 240px;
    background: var(--bg-b-bg);
    border-radius: 8px;
	margin-bottom: 30px;
}

/*--- 0802 ---*/
#slick-editorial .owl-nav.disabled+.owl-dots {
  margin-top: 0;
  padding-bottom: 10px;
}

#slick-editorial .owl-dots .owl-dot span {
  background: var(--text-white);
  opacity: .3;
}

#slick-editorial .owl-dots .owl-dot.active span,
.owl-theme .owl-dots .owl-dot:hover span {
  opacity: 1;
}
/*------------*/

.editorialBox {
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 50px 40px 50px;
}

.editorialTitle {
    position: relative;
    padding-top: 14px;
}

.editorialTitle:after {
    position: absolute;
    display: block;
    content: '';
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    height: 12px;
    width: 8px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -148px -201px;
}

#slick-editorial .slick-dots {
    bottom: 18px;
}

#slick-editorial .slick-dots li.slick-active button:before {
    opacity: 1;
    color: black;
    background-color: var(--text-white);
}

#slick-editorial .slick-dots li button:before {
    font-family: 'slick';
    font-size: 6px;
    line-height: 20px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 8px;
    height: 8px;
    content: '';
    text-align: center;
    opacity: .3;
    color: black;
    background-color: var(--text-white);
    border-radius: 30px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* 오피니언 */
.opinion {
    width: 300px;
}

.opinionBox {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    padding: 16px 0;
    border-top: 1px solid var(--text-gray-300);
}

.opinionBox span{
    display: inline-block;
}

.opinionBox .opinionTitleWrap h2 {
    margin: 4px 0 8px;
}

.opinionBox:nth-child(1) {
    padding-top: 0;
    border-top: 0;
}

.opinionBox:last-child {
    border-bottom: 0;
}

.opinionImage {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 64px;
    height: 64px;
    border-radius: 40px;
    overflow: hidden;
    background-color: #D9D9D9;
}

.opinionImage>img {
    border-radius: 40px;
}

#slick-opinionBox {
	width: 300px;
	/*padding-bottom: 30px;*/
	padding-bottom: 0; /*0802*/
}

#slick-opinionBox .slick-slide {
	width: 300px;
}

.opinionBox {
	display: flex !important;
}
#slick-opinionBox .slick-slide div li {
    box-sizing: border-box;
    min-height: 100%;
}
#slick-opinionBox .slick-slide div:first-child li {
	border-bottom: 1px solid var(--text-gray-300);
}

#slick-opinionBox .slick-slide div:last-child li {
    padding-top: 16px;
    padding-bottom: 20px;
}

/* 20240712 */
.photoNewsBox {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.photoNewsBox .articleImage {
    border-radius: 12px;
    overflow: hidden;
}

.adArea .ad {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 250px;
    background: var(--bg-b-bg);
    color: var(--text-white);
}

.longAd .ad {
    height: 600px;
}

.main-rightBoxWrap section:not(:first-child) {
    margin: 100px 0;
}

.interactive_newest .articleImage {
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    width: 300px;
    border-radius: 12px;
}

.interactive_newest .articleImage img {
    border-radius: 12px;
}

.interactive_newest h2.articleTitle {
    margin: 12px 0 4px;
}

.interactBox h2 {
    padding: 20px 0;
    border-bottom: 1px solid var(--text-gray-300);
}

#slick-interractive {
    margin-top: 32px;
    /*padding-bottom: 54px;*/
	padding-bottom: 16px;
}

#slick-interractive li {
    width: 300px;
}

#slick-interractive li.slick-slide .interactBox:first-child h2 {
    padding-top: 0;
}

#slick-interractive li.slick-slide .interactBox:last-child h2 {
    border: 0;
}

/*--- 0802 ---*/
#slick-interractive .interactBox h2 {
  padding: 0 0 20px;
  border-bottom: 0;
}

.cartoon .articleImage {
    margin: 0 auto 8px;
    max-width: 660px;
    border-radius: 12px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.cartoon .articleImage img {
    border-radius: 12px;
}

.listSide .introduction .articleImage {
    margin-bottom: 8px;
    border-radius: 12px;
}

.listSide .introduction .articleImage img {
    border-radius: 12px;
}

/* 투표 */

/* .voteWrap {
    margin: 40px 0 0;
} */

.voteSubject {
    position: relative;
    display: flex;
    gap: 12px;
    align-items: center;
    margin-bottom: 8px;
    padding-left: 23px;
}

.voteSubject:before {
    display: block;
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 11px;
    height: 18px;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat;
    background-position: -165px -198px;
}


.voteContent {
    margin-bottom: 14px;
}

.voteForm .voteList {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.voteBtn .input-check {
    display: none;
}

.voteBtn .form-check {
    display: block;
    font-size: 16px;
    font-weight: 700;
    line-height: 26px;
    letter-spacing: -0.16px;
    border-radius: 10px;
    cursor: pointer;
    padding: 14px 20px;
    border-radius: 10px;
    background: var(--text-gray-200, #F4F4F4);
    color: var(--text-gray-700, #999);
}

.input-check:checked+.form-check {
    transition: all .25s;
    color: var(--text-white);
    background: var(--bg-primary-100);
}

.voteBtn .input-check:hover:not(:checked)+.form-check {
    transition: all .3s;
    background: var(--text-gray-400);
    color: var(--text-black);
}

.voteSubmit {
    display: flex;
    width: 300px;
    padding: 14px 40px;
    justify-content: center;
    align-content: center;
    border-radius: 100px;
    color: var(--text-white);
    background: var(--text-black);
    border: 0;
    cursor: pointer;
    margin-top: 0;
    /* margin-top: 24px; */
    font-family: Pretendard;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 26px;
    letter-spacing: -0.16px;
}

.voteSubmit:hover {
    transition: all .3s;
    opacity: .7;
}

section.vote .buttonWrap {
    margin-top: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

section.vote .buttonWrap > * {
    width: 146px;
}

section.vote .buttonWrap .goLink{
    display: flex;
    gap: 4px;
    padding: 14px 0;
    background: var(--bg-primary-100);
    border-radius: 50px;
    text-align: center;
    justify-content: center;
    align-items: center;
}

 section.vote .buttonWrap .goLink .icon{
    width: 16px;
    height: 16px;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp);
    background-repeat: no-repeat;
    background-position: -298px -72px;
    filter: brightness(1000%);
}

.voteAnswerText {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}

.voteAnswerText .answerTitle {
 position: relative;
    text-indent: 24px;
}


.voteAnswerText .answerTitle:before{
    content: '';
    position: absolute;
    top:50%;
    left:0;
    transform: translateY(-50%);
    width: 16px;
    height: 16px;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat;
    background-position: -99px -229px;
}

.voteAnswerTextWrap { display: flex; align-items: center; justify-content: space-between; width: 100%; }
.voteAnswerTextWrap .voteAnswerDesc { display: flex; gap: 8px; width: calc(100% - 60px); }
.voteAnswerTextWrap .voteAnswerDesc .check { width: 20px; height: 16px; background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat; background-position: -99px -229px; margin-top: 3px; }
.voteAnswerTextWrap .voteAnswerDesc .h16 { width: calc(100% - 20px); }

/* .progress-bar {
    display: flex;
    flex-direction: column;
    gap: 8px;
} */
/* 
.progress {
    height: 12px;
    width: 100%;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

::-webkit-progress-bar {
    width: 100%;
    height: 12px;
    background: var(--text-gray-100);
    border-radius: 4px;
}

::-webkit-progress-value {
    background: var(--bg-primary-100);
    height: 12px;
    border-radius: 4px;
} */

.voteAnswer {
    display: flex;
    flex-direction: column;
    gap: 40px;
    display: none;
}

.voteAnswerBox {
    margin-bottom: 40px;
}

.horizontal .progress-bar {
    float: left;
    height: 12px;
    width: 100%;
    padding: 12px 0;
}

.horizontal .progress-track {
    position: relative;
    width: 100%;
    height: 12px;
    background: var(--text-gray-100);
    border-radius: 4px;
}

.horizontal .progress-fill {
    position: relative;
    /* background: var(--bg-primary-100); */
    height: 12px;
    width: 50%;
    color: #fff;
    text-align: center;
    font-family: "Lato", "Verdana", sans-serif;
    font-size: 12px;
    line-height: 20px;
    border-radius: 4px;
}

.first-progress-fill {
    background: var(--bg-primary-100);
}

.secound-progress-fill {
    background: var(--text-gray-600);
}

.third-progress-fill {
    background: var(--text-gray-400);
}



/* 기획·연재 */
.serial .sectionContentWrap {
    padding-bottom: 14px;
}

#slick-serial {
    position: relative;
}

#slick-serial .slick-dots {
    bottom: -50px;
}

.serialList li {
    /*padding-right: 40px;*/
    width: 400px;
	padding-right: 0; /*0802*/
}

.serialList .articleTitleWrap {
    margin-bottom: 16px;
}

.serialList .contentNum {
    display: inline-block;
    vertical-align: top;
    padding-left: 8px;
}

.serialList .articleImage {
    display: flex;
    width: 400px;
    height: 320px;
    border-radius: 12px;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.serialList .articleImage img {
    border-radius: 12px;
    height: 100%;
    width: auto;
}

.serialList .articleLayout {
    position: relative;
    margin-bottom: 64px;
}

.serialList .articleContentWrap {
    box-sizing: border-box;
    position: absolute;
    z-index: 100;
    bottom: -60px;
    background-color: var(--text-white);
    width: 320px;
    padding: 12px 24px 0 0;
    border-top-right-radius: 12px;
}

.serialList .articleContentWrap::before {
    content: "";
    position: absolute;
    z-index: -1;
    background-color: transparent;
    top: -50px;
    height: 50px;
    width: 25px;
    border-top-right-radius: 12px;
    box-shadow: 0 -25px 0 0 #fff;
    transform: rotate(180deg);
}

.serialList .articleContentWrap::after {
    content: "";
    position: absolute;
    background-color: transparent;
    bottom: 60px;
    right: -25px;
    height: 50px;
    width: 25px;
    border-top-right-radius: 12px;
    box-shadow: 0 -25px 0 0 #fff;
    transform: rotate(180deg);
}

.serialList .articleContentWrap span {
    display: block;
}

.serialList .articleContentWrap h2 {
    margin-top: 8px;
    margin-bottom: 0;
    min-height: 60px;
}

.serialList .img-wrapper {
    position: relative;
    width: 400px;
    height: 320px;
}

.serialList .img-wrapper img {
    border-radius: 12px;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    margin: auto;
}

/* ---0802 ---*/
#serial-arrowSlider .owl-prev:before {
  content: '';
  opacity: 1;
  position: absolute;
  top: 0;
  left: 0;
  background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat center;
  background-position: -89px 0;
  width: 50px;
  height: 50px;
}

#serial-arrowSlider .owl-prev {
  border: 0;
  background: 0;
  cursor: pointer;
  position: absolute;
  top: 50%;
  left: -80px;
  transform: translateY(-50%);
  transition: all .3s;
  width: 50px;
  height: 50px;
}

#serial-arrowSlider .owl-prev:hover:before {
  background-position: -300px 1px;
  width: 51px;
  height: 51px;
}

#serial-arrowSlider .owl-next {
  border: 0;
  background: 0;
  cursor: pointer;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: auto;
  right: -80px;
  width: 50px;
  height: 50px;
}

#serial-arrowSlider .owl-next:before {
  content: '';
  opacity: 1;
  position: absolute;
  top: 0;
  left: 0;
  background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat center;
  background-position: -151px 0;
  width: 50px;
  height: 50px;
}

#serial-arrowSlider .owl-next:hover:before {
  background-position: -362px 1px;
  width: 51px;
  height: 51px;
}
/* -------*/

/* 많이 본 뉴스 */
/* .topRankNewsWrap {
    margin-top: 40px;
} */

.topRankList .newsBox {
    position: relative;
    width: 400px;
}

.topRankList .rank_1 .orderNum {
    position: absolute;
    top: 10px;
    left: 10px;
}

.topRankList .rank_1 .articleTitle {
    margin-top: 20px;
}

.orderNum {
    display: flex;
    width: 33px;
    height: 32px;
    padding: 1px 0px;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    background: var(--bg-b-bg);
    border-radius: 6px;
    color: var(--text-white, #FFF);
    text-align: center;
    font-size: 17px;
    font-weight: 700;
    line-height: 30px;
    letter-spacing: -0.17px;
}

.topRankList {
    height: 354px;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    gap: 0 40px;
}


.topRankList li {
    flex: 0 0 calc(156px - 32px);
    box-sizing: border-box;
}

.topRankList li:nth-child(1) {
    flex: 0 0 100%;
}

.topRankList li:nth-child(2),
.topRankList li:nth-child(4) {
    padding-bottom: 32px;
    border-bottom: 1px solid var(--text-gray-300);
}


.topRankList li:nth-child(3),
.topRankList li:nth-child(5) {
    padding-top: 32px;
}

.topRankList .newsBox .articleImage {
    display: flex;
    width: 400px;
    height: auto;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
}

.topRankList .newsBox .articleImage img {
    border-radius: 12px;
}

.topRankList li .txt_newsBox {
    display: flex;
    gap: 16px;
}

.topRankList li .txt_newsBox .articleContent {
    margin-top: 8px;
}

.topRankList li .txt_newsBox .articleContentWrap h2 {
    min-height: 60px;
}

.topRankList li .txt_newsBox .articleContent {
    min-height: 56px;
}

/* 1분 컷 뉴스 */

#slick-shorts li {
    position: relative;
    margin-right: 20px;
}

/* 0802 */
#slick-shorts .owl-item img {
  height: 100%;
  width: auto;
}

.shortsImage {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 240px;
    height: 426px;
    border-radius: 12px;
    background: var(--bg-b-bg);
    overflow: hidden;
}

.shortsImage img {
    height: 100%;
    width: auto;
}

.shortsImage:after {
    z-index: 1;
    content: '';
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
}

.shortsImage:before {
    z-index: 2;
    content: '';
    position: absolute;
    display: block;
    top: 185px;
    left: 50%;
    transform: translateX(-50%);
    width: 28px;
    height: 28px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -285px -223px;
}

.shrotsContentWrap {
    z-index: 3;
    position: absolute;
    bottom: 0;
    padding: 24px;
}

.shrotsContentWrap h4 {
    margin-bottom: 8px;
}

.shrotsCount {
    display: flex;
    gap: 21px;
}

.shortsView {
    position: relative;
}

.shortsView::after {
    position: absolute;
    top: 50%;
    right: -13px;
    transform: translateY(-50%);
    content: '';
    display: block;
    width: 5px;
    height: 5px;
    background: rgba(255, 255, 255, .7);
    border-radius: 10px;
}



/********** 역사관 **********/
.viewOfHistory-section {
    position: relative;
}

#slick-viewOfHistory li {
    cursor: pointer;
    width: 1280px;
}

.viewOfHistory {
    position: relative;
    box-sizing: border-box;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    height: 570px;
    border-radius: 12px;
    padding: 72px 70px 70px 72px;
}

.viewOfHistory01 {
    /*background-image: url("../img/history/viewOfHistory_bg_1.png");*/
    background-repeat: no-repeat;
    background-color: var(--bg-primary-100);
    background-blend-mode: multiply;
    background-position: 502px 0;
    background-size: contain;
}

.viewOfHistory02 {
    /*background-image: url("../img/history/viewOfHistory_bg_2.png");*/
    background-repeat: no-repeat;
    background-color: var(--bg-b-bg);
    background-position: 476px 0;
    background-size: contain;
}

.viewOfHistory03 {
    /*background-image: url("../img/history/viewOfHistory_bg_3.png");*/
    background-repeat: no-repeat;
    background-color: #F0F1F1;
    background-position: 162px 0;
    background-size: contain;
}

.viewOfHistory:after {
    z-index: 0;
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 262px;
    border-bottom-left-radius: 11px;
    border-bottom-right-radius: 11px;
}

.viewOfHistory01:after {
    background: linear-gradient(180deg, rgba(242, 105, 48, 0.00) 0%, rgba(242, 105, 48, 0.70) 100%);
}

.viewOfHistory02:after {
    background: linear-gradient(180deg, rgba(38, 35, 35, 0.00) 0%, rgba(38, 35, 35, 0.90) 100%);
}


.viewOfHistory .historyLeftSide {
    z-index: 3;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
    width: 351px;
    flex-grow: 0;
    flex-shrink: 0;
}

.historyLeftSide .historyTitle {
    position: relative;
}

.historyLeftSide .historyTitle:before {
    content: '';
    display: block;
    position: absolute;
    top: -22px;
    left: -20px;
    width: 33px;
    height: 50px;
    /*background: url(../img/logo_bgIcon_1.png) no-repeat center;*/
}

.viewOfHistory02 .historyLeftSide .historyTitle:before,
.viewOfHistory03 .historyLeftSide .historyTitle:before {
    /*background: url(../img/logo_bgIcon_2.png) no-repeat center;*/

}


.historyLeftSide .boxTitle {
    margin-top: 12px;
}

.historyList {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.historyList dl {
    display: flex;
    gap: 12px;
}

.viewOfHistory .historyRightSide {
    z-index: 3;
    width: 770px;
}


.viewOfHistory .historyRightSide .boxContentWrap {
    height: 112px;
}

.btnFloat {
    float: right;
    display: flex;
    align-items: flex-end;
    height: 100%;
    shape-outside: inset(calc(100% - 24px) 0 0 0);
}

.viewOfHistory .historyRightSide .boxContent .moreHistoryBtn {
    font-size: 15px;
    font-weight: 700;
    letter-spacing: -0.15px;
    margin-bottom: 6px;
    margin-left: 8px;
    line-height: normal;
    border-bottom: 1px solid var(--text-white);
}

.viewOfHistory03 .historyRightSide .boxContent .moreHistoryBtn {
    border-bottom: 1px solid var(--text-black);
}

/* 0802 */
.btn-large .owl-prev:before {
  content: '';
  opacity: 1;
  position: absolute;
  top: 0;
  left: 0;
  background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat center;
  background-position: -89px 0;
  width: 50px;
  height: 50px;
}

.btn-large .owl-prev {
  border: 0;
  background: 0;
  cursor: pointer;
  position: absolute;
  top: 50%;
  left: -80px;
  transform: translateY(-50%);
  transition: all .3s;
  width: 50px;
  height: 50px;
}

.btn-large .owl-prev:hover:before {
  background-position: -300px 1px;
  width: 51px;
  height: 51px;
}

.btn-large .owl-next {
  border: 0;
  background: 0;
  cursor: pointer;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: auto;
  right: -80px;
  width: 50px;
  height: 50px;
}

.btn-large .owl-next:before {
  content: '';
  opacity: 1;
  position: absolute;
  top: 0;
  left: 0;
  background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat center;
  background-position: -151px 0;
  width: 50px;
  height: 50px;
}

.btn-large .owl-next:hover:before {
  background-position: -362px 1px;
  width: 51px;
  height: 51px;
}
/*---*/


/* 상단 역사관 */
.top_history {
    position: relative;
    top: 0;
    left: 0;
    /* height: 100%; */
    width: 100%;
	min-width:1280px; /*20240221*/
    padding: 19px 0 21px;
    background-color: var(--bg-b-bg);
}

.top_history_tit.hide {
    display: none;
}

.top_history_tit_wrap {
    display: flex;
    align-items: center;
    justify-content: center;
}

.top_history_tit_wrap>div {
    display: flex;
    align-items: center;
}

.top_history .logo {
    display: inline-block;
    width: 72px;
    height: 18px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -350px -198px;
}

.top_history .go_history {
    color:  var(--bg-primary-100);;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: -0.16px;
    padding-left: 12px;
}

/* history content */

.show {
    animation: fadeAni .5s;
    display: block;
    visibility: visible;
}

.hidden {
    /* animation: fadeAni .5s ;  */
    visibility: hidden;
    /* display: none; */
    opacity: 0;
    transition: all .3s;
}

.top_history_content {
    display: none;
}

.top_history_content.show {
    display: block;
}

.top_history_content_wrap {
    display: flex;
    justify-content: space-between;
    gap: 75px;
    padding: 40px 0 60px;
}

.top_history_content .leftSide {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 37px 0 0;
    gap: 37px;
}

.top_history_content .leftSide .leftSideTop {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.top_history_content .leftSide .leftSideTop span {
    font-size: 14px;
    font-weight: 700;
    letter-spacing: -0.14px;
    color: #F26930;
}

.top_history_content .leftSide .leftSideTop strong {
    font-size: 60px;
    font-weight: 700;
    letter-spacing: -0.6px;
    color: #F26930;
    padding: 4px 0 16px;
}

.top_history_content .leftSide .leftSideTop>div {
    padding-left: 4px;
    display: flex;
    align-items: center;
    gap: 3px;
}

.top_history_content .leftSide .leftSideTop .logo {
    width: 70px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -350px -199px;
}

.top_history_content .leftSide .arrowBtnWrap {
    position: relative;
    width: 100%;
    height: 24px;
}

.top_history_content_wrap .rightSide {
    width: 1373px;
}

.top_history_content .arrowBtnWrap .slickPrevArrow {
    cursor: pointer;
    position: absolute;
    top: 12px;
    transform: 0;
    left: 0;
    width: 24px;
    height: 24px;
}


.top_history_content .arrowBtnWrap .slickNextArrow {
    cursor: pointer;
    position: absolute;
    top: 12px;
    transform: 0;
    left: 28px;
    width: 24px;
    height: 24px;
}

#top_history-prevArrow:before {
    content: '';
    opacity: 1;
    position: absolute;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat center;
    background-position: -607px -294px;
    width: 26px;
    height: 26px;
}

#top_history-nextArrow:before {
    content: '';
    opacity: 1;
    position: absolute;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat center;
    background-position: -491px -294px;
    width: 26px;
    height: 26px;
}

/* history slide */

#slick-history .slick-slide {
    margin: 0 20px;
}

/*--- 0802 ---*/
#slick-history li div {
   width: 620px;
}

#history-arrowSlider {
  position: relative;
}

#history-arrowSlider .owl-prev {
  border: 0;
  background: 0;
  cursor: pointer;
  position: absolute;
  top: 0;
  left: 0;
  width: 24px;
  height: 24px;
}

#history-arrowSlider .owl-prev:before {
  content: '';
  opacity: 1;
  position: absolute;
  top: 0;
  left: 0;
  background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat center;
  background-position: -607px -294px;
  width: 26px;
  height: 26px;
}

#history-arrowSlider .owl-next {
  border: 0;
  background: 0;
  cursor: pointer;
  position: absolute;
  top: 0;
  left: 28px;
  width: 24px;
  height: 24px;
}

#history-arrowSlider .owl-next:before {
  content: '';
  opacity: 1;
  position: absolute;
  top: 0;
  left: 0;
  background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat center;
  background-position: -491px -294px;
  width: 26px;
  height: 26px;
}
/*----------*/

.historyBox {
    box-sizing: border;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 620px !important;
    height: 362px;
    border-radius: 12px;
}

/*
.historyBox01 {
    background: url("../img/history_con_01.png") no-repeat center right;
}


.historyBox02 {
    background: url("../img/history_con_02.png") no-repeat center right;
}

.historyBox03 {
    background: url("../img/history_con_03.png") no-repeat center right;
}
*/

.hisBoxStl_1 {
    position: relative;
    background-color: #F26930;
}

.hisBoxStl_2 {
    position: relative;
    background-color: #262323;
}

.hisBoxStl_3 {
    position: relative;
    background-color: #eee;
}

.hisBoxStl_1 .boxTitle::after {
    content: '';
    position: absolute;
    top: 44px;
    left: 28px;
    display: block;
    width: 30px;
    height: 45px;
    /*background: url("../img/logo_bgIcon_1.png") no-repeat center;*/
}

.hisBoxStl_2 .boxTitle::after {
    content: '';
    position: absolute;
    top: 44px;
    left: 28px;
    display: block;
    width: 30px;
    height: 45px;
    /*background: url("../img/logo_bgIcon_2.png") no-repeat center;*/
}

.hisBoxStl_3 .boxTitle::after {
    content: '';
    position: absolute;
    top: 44px;
    left: 28px;
    display: block;
    width: 30px;
    height: 45px;
    /*background: url("../img/logo_bgIcon_2.png") no-repeat center;*/
}


.hisBoxStl_1:after {
    z-index: 0;
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 262px;
    background: linear-gradient(180deg, rgba(242, 105, 48, 0.00) 0%, rgba(242, 105, 48, 0.70) 100%);
    border-bottom-left-radius: 11px;
    border-bottom-right-radius: 11px;
}


.hisBoxStl_2:after {
    z-index: 0;
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 262px;
    background: linear-gradient(180deg, rgba(38, 35, 35, 0.00) 0%, rgba(38, 35, 35, 0.90) 100%);
    border-bottom-left-radius: 11px;
    border-bottom-right-radius: 11px;
}


.hisBoxStl_3:after {
    z-index: 0;
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 262px;
    border-radius: var(--spacing-none, 0px);
    background: linear-gradient(180deg, rgba(238, 238, 238, 0.00) 0%, rgba(238, 238, 238, 0.30) 100%);
    border-bottom-left-radius: 11px;
    border-bottom-right-radius: 11px;
}

.historyBox .boxTitle {
    position: relative;
    padding: 56px 0 0 50px;
}

.top_history .boxContentWrap {
    height: 100%;
}

.top_history .boxContent {
    z-index: 1;
    font-size: 16px;
    font-weight: 500;
    line-height: 28px;
    letter-spacing: -0.16px;
    color: var(--text-white);
    padding: 50px;
}

.btnFloat {
    float: right;
    display: flex;
    align-items: flex-end;
    height: 100%;
    shape-outside: inset(calc(100% - 24px) 0 0 0);
}

.top_history .boxContent .moreHistoryBtn {
    position: relative;
    padding-left: 8px;
    margin-bottom: 6px;
}

.top_history .boxContent .moreHistoryBtn:after {
    display: block;
    position: absolute;
    bottom: 0;
    left: 8px;
    content: '';
    width: 100%;
    height: 1px;
    background: var(--text-white);
}

.top_history .historyBox03 .boxContent .moreHistoryBtn:after {
    background: var(--text-gray-700);

}

.showMoreBtn {
    z-index: 100;
    position: absolute;
    bottom: -18px;
    left: 50%;
    transform: translateX(-50%);
    cursor: pointer;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat var(--text-white);
    width: 32px;
    height: 32px;
    border-radius: 30px;
    background-position: -64px -65px;
    transform: rotate(90deg);
    box-shadow: 2px 0px 5px 0 #ddd;
}

.showMoreBtn.open {
    transform: rotate(-90deg);
    box-shadow: -2px 0 5px 0 #ddd;
}

.hideText {
    overflow: hidden;
    text-indent: -9999px;
    color: transparent;
    font-size: 0;
}


.showMoreBtn img {
    width: 30px;
    height: 30px;
}


/* 서울 미디어 홀딩스 */
.seoulEnWrap,
.seoulMHWrap {
    display: flex;
    justify-content: space-between;
    gap: 40px;
}

.newsBrand-2row {
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.newsBrand .sectionContentWrap {
    width: 287px;
}

.ourNews .sectionContentWrap {
    width: 300px;
}

#slick-seoulMH-ebn,
#slick-seoulMH-nowNews,
#slick-seoulMH-gong {
    width: 287px;
}

#slick-seoulMH-ebn div.slick-slide,
#slick-seoulMH-nowNews div.slick-slide,
#slick-seoulMH-gong div.slick-slide {
    width: 287px;
}

.seoulEn_newsList li,
.seoulMH_newsList li {
    padding: 16px 0;
    border-top: 1px solid var(--text-gray-300);	
}

.seoulEn_newsList .slick-slide div:first-child li,
.seoulMH_newsList .slick-slide div:first-child li {
    padding: 12px 0 16px;
    border-top: 0;
}

.seoulMH_newsList li:first-child{
    border-top:0
}

.seoulEn_newsList .articleImage,
.seoulMH_newsList .articleImage {
    position: relative;
    width: 287px;
    height: 192px;
}

.seoulEn_newsList .articleImage img,
.seoulMH_newsList .articleImage img {
    border-radius: 12px;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    margin: auto;
    border-radius: 12px;
}

.seoulEn_newsList .articleTitle,
.seoulMH_newsList .articleTitle {
    margin: 12px 20px 0 0;
}

.seoulEn_newsList li h4,
.seoulMH_newsList li h4 {
    margin-right: 20px;
}

.seoulEn_newsList li:first-child {
    border-top: 0;
    padding-top: 0;
}

/* 0802 */
/*.seoulEn_newsList li,*/
.seoulMH_newsList li {
  padding-top: 0;
  border-top: 0;
}

.seoulEn_newsList .articleLine,
.seoulMH_newsList .articleLine {
  width: 287px;
  padding: 16px 0;
  border-top: 1px solid var(--text-gray-300);
}

.seoulEn_newsList .articleLine:first-child,
.seoulMH_newsList .articleLine:first-child {
  border-top: 0;
}

.seoulEn_newsList .slick-slide div:first-child .articleLine,
  .seoulMH_newsList .slick-slide div:first-child .articleLine {
    padding: 12px 0 16px;
    border-top: 0;
  }

.seoulEn_newsList .articleLine,
.seoulMH_newsList .articleLine {
  padding: 16px 0
}

.ourNews_newsList li {
  padding: 16px 0;
  border-top: 1px solid var(--text-gray-300);
}
/*----*/




.bottom-banner {
    margin-top: 40px;
    border-radius: 8px;
    width: 300px;
}

.banner li {
    overflow: hidden;
    border-radius: 8px;
}

.hide {
    display: none;
}


.lineclamp1 {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    line-height: 1.4em;
}

.lineclamp2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    /* 라인수 */
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
    /* max-height: 2.8em; */
    /* text-align:left; */
}


.lineclamp3 {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    /* 라인수 */
    -webkit-box-orient: vertical;
    white-space: normal;
    overflow: hidden;
    /* max-height: 4.2em; */
    text-overflow: ellipsis;
}


.lineclamp4 {
    display: -webkit-box;
    -webkit-line-clamp: 4;
    /* 라인수 */
    -webkit-box-orient: vertical;
    white-space: normal;
    overflow: hidden;
    text-overflow: ellipsis;
}

.lineclamp5 {
    display: -webkit-box;
    -webkit-line-clamp: 5;
    /* 라인수 */
    -webkit-box-orient: vertical;
    white-space: normal;
    overflow: hidden;
    text-overflow: ellipsis;
}

.lineclamp6 {
    display: -webkit-box;
    -webkit-line-clamp: 6;
    /* 라인수 */
    -webkit-box-orient: vertical;
    white-space: normal;
    overflow: hidden;
    text-overflow: ellipsis;
}


@keyframes fadeAni {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.slick-dots {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    bottom: 0;
    left: 50%;
    margin: 0;
    padding: 0;
    transform: translateX(-50%);
}

#slick-interractive .slick-dots li {
    width: auto;
}

.slick-dots li {
    position: relative;
    display: inline-block;
    width: 20px;
    height: 20px;
    margin: 0;
    padding: 0;
    cursor: pointer;
}

.slick-dots li button {
    font-size: 0;
    line-height: 0;
    display: block;
    width: 20px;
    height: 20px;
    padding: 5px;
    cursor: pointer;
    color: transparent;
    border: 0;
    outline: none;
    background: transparent;
}

.slick-dots li button:hover,
.slick-dots li button:focus {
    outline: none;
}

.slick-dots li button:hover:before,
.slick-dots li button:focus:before {
    opacity: 1;
}


.slick-dots li.slick-active button:before {
    opacity: 1;
    color: black;
    background-color: var(--bg-b-bg);
}

.slick-dots li button:before {
    font-family: 'slick';
    font-size: 6px;
    line-height: 20px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 8px;
    height: 8px;
    content: '';
    text-align: center;
    opacity: 1;
    color: black;
    background-color: #BEBDBD;
    border-radius: 30px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}


/* slick-shorts */

.slickContentWrap {
    position: relative;
}

.seoulShorts #shorts-prevArrow {
    cursor: pointer;
    position: absolute;
    top: 50%;
    left: -80px;
    transform: translateY(-50%);
    transition: all .3s;
    width: 50px;
    height: 50px;
}

.seoulShorts #shorts-nextArrow {
    cursor: pointer;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: auto;
    right: -80px;
    width: 50px;
    height: 50px;
}

.seoulShorts #shorts-prevArrow:before {
    content: '';
    opacity: 1;
    position: absolute;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat center;
    background-position: -89px 0;
    width: 50px;
    height: 50px;
}

.seoulShorts #shorts-nextArrow:before {
    content: '';
    opacity: 1;
    position: absolute;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat center;
    background-position: -151px 0;
    width: 50px;
    height: 50px;
}

.seoulShorts #shorts-prevArrow:hover:before {
    background-position: -300px 1px;
    width: 51px;
    height: 51px;
}

.seoulShorts #shorts-nextArrow:hover:before {
    background-position: -362px 1px;
    width: 51px;
    height: 51px;
}

.slickPrevArrow {
    cursor: pointer;
    position: absolute;
    top: 50%;
    left: -80px;
    transform: translateY(-50%);
    transition: all .3s;
    width: 50px;
    height: 50px;
}

.slickNextArrow {
    cursor: pointer;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: auto;
    right: -80px;
    width: 50px;
    height: 50px;
}

.slickPrevArrow:before {
    content: '';
    opacity: 1;
    position: absolute;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat center;
    background-position: -89px 0;
    width: 50px;
    height: 50px;
}

.slickNextArrow:before {
    content: '';
    opacity: 1;
    position: absolute;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat center;
    background-position: -151px 0;
    width: 50px;
    height: 50px;
}

.slickPrevArrow:hover:before {
    background-position: -300px 1px;
    width: 51px;
    height: 51px;
}

.slickNextArrow:hover:before {
    background-position: -362px 1px;
    width: 51px;
    height: 51px;
}


/* footer */
footer {
    background: var(--bg-b-bg);	
}

/*20240221*/
.pc-footer{
    background: var(--bg-b-bg);	
	min-width:1280px;  
}

.pc-footer .footer-top {
    padding: 24px 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid rgba(102, 102, 102, .5);
}


.pc-footer .footer-top .leftSide {
    display: flex;
    gap: 32px;
}

.pc-footer .footer-top .rightSide>ul {
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    gap: 0 32px;
}

.pc-footer .footer-main {
    display: flex;
    justify-content: space-between;
    padding: 40px 0 50px;
    border-bottom: 1px solid rgba(102, 102, 102, .5);
}

.pc-footer .footer-main .rightSide {
    display: flex;
    flex-direction: column;
    gap: 8px 0;
}

.pc-footer .footer-sitemap {
    display: flex;
    gap: 0 76px
}

.pc-footer .footer-sitemap .column-layout {
    display: flex;
    flex-direction: column;
    gap: 40px 0;
}

.pc-footer .footer-sitemap dl {
    min-width: 60px;
}

.pc-footer .footer-sitemap dt {
    font-size: 14px;
    font-weight: 700;
    line-height: 24px;
    letter-spacing: -0.14px;
    color: var(--text-white);
    padding-bottom: 12px;
}

.pc-footer .footer-sitemap dd {
    color: var(--text-gray-500, #999);
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 32px;
    letter-spacing: -0.14px;
}

.pc-footer .footer-bottom {
    padding: 32px 0 50px;
}

.pc-footer .footer-bottom .topSide {
    display: flex;
    justify-content: space-between;
}

.pc-footer .footer-bottom .leftSide ul {
    display: flex;
    gap: 0 24px;
    margin-bottom: 16px;
}

.pc-footer .footer-bottom .rightSide .snsWrap ul {
    display: flex;
    gap: 0 10px;
}

.pc-footer .footer-bottom .rightSide .snsWrap ul li {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    width: 32px;
    height: 32px;
    border-radius: 16px;
    background: var(--text-gray-700);
}

.pc-footer .footer-bottom .rightSide .snsWrap ul li a .icon {
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp");
    background-repeat: no-repeat;
    overflow: hidden;
    color: transparent;
    font-size: 0;
    text-indent: -99999px;
}

.pc-footer .footer-bottom .rightSide .snsWrap ul li a .facebookBtn {
    width: 32px;
    height: 32px;
    background-position: -321px -158px;
}

.pc-footer .footer-bottom .rightSide .snsWrap ul li a .twitterBtn {
    width: 32px;
    height: 32px;
    background-position: -363px -158px;
}

.pc-footer .footer-bottom .rightSide .snsWrap ul li a .youtubeBtn {
    width: 32px;
    height: 32px;
    background-position: -447px -158px;
}

.pc-footer .footer-bottom .rightSide .snsWrap ul li a .instaBtn {
    width: 32px;
    height: 32px;
    background-position: -405px -158px;
}

.pc-footer .footer-bottom .rightSide .snsWrap ul li a .naverBtn {
    width: 32px;
    height: 32px;
    background-position: -489px -158px;
}

.pc-footer .footer-bottom .rightSide .snsWrap ul li a .naverBlogBtn {
    width: 32px;
    height: 32px;
    background-position: -531px -158px;
}

.pc-footer .footer-bottom .bottomSide span {
    position: relative;
    padding: 0 12px 0 0;
}


.pc-footer .footer-bottom .bottomSide span.after:after {
    content: '';
    position: absolute;
    display: block;
    top: 50%;
    transform: translateY(-50%);
    right: 4px;
    width: 1px;
    height: 11px;
    background: var(--text-gray-500);
}

.pc-footer .footer-bottom .copyright {
    margin-top: 4px;
}

.selectBox {
    position: relative;
}

.selectBox-li.active .selectBoxBtn-bg-white span {
    background-position: -126px -231px;
    transform: rotate(-180deg);
}

.selectBox-li.active .selectBoxBtn-bg-black span {
    background-position: -29px -226px;
    transform: rotate(-180deg);
}

.hamburgerMenu-depth .select-optionBox {
    z-index: 1;
    display: none;
    position: absolute;
    bottom: 43px;
}

.select-optionBox {
    display: none;
    position: absolute;
    padding-top: 8px;
}

.selectBox-li:not(.active) .select-optionBox {
    display: none;
}

.selectBox-li.active .select-optionBox {
    display: block;
}

.select-optionBox-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 8px 24px;
    padding: 24px 32px 24px 24px;
    width: 122px;
    border-radius: 8px;
    border: 1px solid var(--text-gray-400);
    background-color: var(--text-white);
}

.select-optionBox-list li {
    width: calc(50% - 12px);
}

.select-optionBox-list li:hover {
    transition: all .3s;
    color: var(--text-gray-700);
    text-decoration: underline;
}

.selectBoxBtn-bg-black {
    display: flex;
    cursor: pointer;
    gap: 8px;
}

.selectBoxBtn-bg-black>span {
    display: inline-block;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat;
    background-position: -29px -225px;
    width: 24px;
    height: 24px;
    vertical-align: text-bottom;
}

.selectBoxBtn-bg-white {
    display: flex;
    align-items: center;
    cursor: pointer;
    gap: 2px;
}

.selectBoxBtn-bg-white>span {
    display: inline-block;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat;
    background-position: -126px -231px;
    width: 12px;
    height: 12px;
}

.selectBox-01 .select-optionBox-list {
    width: 175px;
}

.selectBox-02 .select-optionBox-list {
    width: 168px;
}

.relative {
    position: relative;
}

.paddingTB20 {
    padding: 20px 0;
}


.popup {
    margin-top: 8px;
    position: absolute;
    width: 216px;
    background: var(--text-white);
    padding: 20px;
    border-radius: 12px;
}

.popup h5 {
    margin-bottom: 4px;
    text-indent: 22px;
    background: url("https://www.seoul.co.kr/img/n24/check-bg-primary.webp") no-repeat;
}

.popup .email {
    margin-top: 2px;
    text-decoration: underline;
}

.reportPopup {
    display: none;
}


/* listPage */

.listPage-wrapper {
    display: flex;
    justify-content: space-between;
}

.listPage-wrapper .listSide {
    width: 300px;
}

.listPage-wrapper .listSide {
    position: relative;
    width: 300px;
    flex-shrink: 0;
    padding-right: 69px;
    border-right: 1px solid var(--text-gray-400);
}


.listPage-wrapper .listSide section {
    margin: 100px 0;
}

.listPage-wrapper .listMain {
    margin: 80px 0 200px;
    padding-left: 69px;
    min-width: 840px;
}

.listPage-wrapper .listMain.noMargin {
    margin-top: 0;
}

.listPage-wrapper .listOnly {
    margin: 80px 0 200px;
}

.listPage-wrapper .listHeader {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.listPage-wrapper .pageListTitle {
    margin-bottom: 30px;
}

.listCategory {
    padding-top: 80px;
    margin-bottom: 160px;
}

.listCategory .pageTitle {
    margin-bottom: 32px;
}

.listCategory .submenuList {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.listCategory .submenuList li.on {
    font-size: 18px;
    font-weight: 700;
    line-height: 30px;
    letter-spacing: -0.18px;
    color: var(--bg-primary-100);
}

.listCategory.noPadding {
    padding-top: 0;
}

.topic #slick-topic {
    /*padding-bottom: 54px;*/
	padding-bottom: 0; /*0802*/
}

#slick-topic .articleImage {
    padding: 15px 0 11px;
}

#slick-topic>li,
#slick-topic div {
    width: 300px;
}

/* 0802 */
#slick-topic .owl-nav.disabled+.owl-dots {
  margin-top: 30px;
}

.pageTopNews li {
    padding: 20px 0;
    border-bottom: 1px solid var(--text-gray-300);
}

.pageTopNews li:first-child {
    padding-top: 0;
}

.pageTopNews li:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.pageTopNews .newsBox {
    display: flex;
    gap: 0 8px;
    align-items: center;
}

.pageTopNews .newsBox .orderNum {
    color: var(--bg-primary-100, #F26930);
    font-size: 40px;
    font-weight: 500;
    line-height: 44px;
    letter-spacing: -0.4px;
    background: none;
}

.pageTopNews .newsBox .articleWrap {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 24px;
}

.pageTopNews .newsBox .badge {
    margin-top: 8px;
}

.pageTopNews .newsBox .articleImage {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 64px;
    height: 64px;
    border-radius: 8px;
    overflow: hidden;
    flex-shrink: 0;
}

.pageTopNews .newsBox .articleImage img {
    border-radius: 8px;
}

.listpage-topNews {
    position: relative;
    margin: 0 0 20px;
    padding: 0 20px 100px 0;
}

.listpage-topNews .articleImage {
    position: relative;
    display: flex;
    max-width: 660px;
    max-height: 440px;
    height: 440px;
    border-radius: 12px;
    margin-top: 24px;
    overflow: hidden;
    align-items: center;
}


.listpage-topNews .articleImage img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    margin: auto;
}


.listpage-topNews .articleContent {
    margin: 24px 0;
}

.listpage-topNews:before {
    position: absolute;
    display: block;
    content: '';
    bottom: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background: var(--bg-b-bg);
    border-radius: 20px;
}

.ArticleInfo {
    display: flex;
    gap: 24px;
}

.ArticleInfo span:first-child {
    position: relative;
}

.ArticleInfo span:first-child:after {
    content: '';
    position: absolute;
    display: block;
    top: 50%;
    transform: translateY(-50%);
    right: -12px;
    width: 1px;
    height: 12px;
    background: var(--text-gray-700);
}

.listPhoto-ul li .newsBox {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 0;
    border-bottom: 1px solid var(--text-gray-300);
}

.listPhoto-ul li:last-of-type .newsBox {
    border-bottom: 0;
    padding-bottom: 0;
}

.listPhoto-ul .newsBox .articleTitle {
    width: 202px;
}

.listPhoto-ul .newsBox .articleImage {
    display: flex;
    border-radius: 100px;
    align-items: center;
    width: 64px;
    height: 64px;
    box-sizing: border-box;
    overflow: hidden;
}

.listPhoto-ul.circle .newsBox .articleImage {
    border-radius: 100px;
}


/* pagenation */
.pagination {
    margin-top: 100px;
    display: flex;
    justify-content: center;
}

.pagination ul {
    display: flex;
    gap: 4px;
}

.pagination ul li {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 32px;
    height: 32px;
    cursor: pointer;
}

.pagination ul li.pagePrevBtn a,
.pagination ul li.pageNextBtn a {
    text-indent: -9999px;
    font-size: 0;
    color: transparent;
    width: 24px;
    height: 24px;
}


.pagination ul li.pagePrevBtn {
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    margin-right: 12px;
    background-position: -248px -64px;
}

.pagination ul li.pageNextBtn {
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    margin-left: 12px;
    background-position: -290px -64px;
}

.pagination ul li.presentPage {
    background: var(--bg-b-bg);
    border-radius: 8px;
    color: var(--text-white);
}

.goTopBtn {
    cursor: pointer;
    position: fixed;
    bottom: 70px;
    right: 24px;
    width: 50px;
    height: 50px;
    border-radius: 12px;
    text-indent: -9999px;
    color: transparent;
    font-size: 0;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp");
    background-repeat: no-repeat;
    background-position: -452px -56px;
    display: none;
}


.blankList {
    width: 100%;
    padding: 100px 0 0;
    height: 274px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: url("https://img.seoul.co.kr/img/n24/logo_bgIcon_L.png") no-repeat center;
}

.modal {
    display: none;
    position: fixed;
    z-index: 9999;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow-y: auto;
    background-color: rgba(0, 0, 0, 0.3);
}

.modal::-webkit-scrollbar {
    display: none;
}

.modal {
    -ms-overflow-style: none;
    scrollbar-width: none;
    /* 파이어폭스 */
}

.modal_content {
    position: relative;
    margin: 5% 0;
    top: 0;
    left: 50%;
    transform: translate(-50%, 0);
    width: 100%;
    max-width: 1000px;
    height: auto;
    /* max-height: 666px; */
    border-radius: 10px;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    box-shadow: 0px 4px 30px 0px rgba(0, 0, 0, 0.25);
}

.modal_content img {
    border-radius: 10px;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.modal .btnWrap {
    z-index: 1000;
    position: absolute;
    display: flex;
    flex-direction: column;
    gap: 8px;
    top: 24px;
    right: 24px;
}

.modal .btnWrap .close {
    position: relative;
    display: block;
    transition: 0.3s;
    width: 26px;
    height: 26px;
    padding: 7px;
    background: rgba(38, 35, 35, 0.60);
    border-radius: 8px;
}

.modal .close:after {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(45deg);
    width: 2px;
    height: 20px;
    border-radius: 3px;
    background: var(--text-white);
}

.modal .close::before {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(-45deg);
    width: 2px;
    height: 20px;
    border-radius: 3px;
    background: var(--text-white);
}

.modal .btnWrap .magnifier {
    position: relative;
    display: block;
    transition: 0.3s;
    width: 26px;
    height: 26px;
    padding: 7px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: 10px -246px;
    background-color: rgba(38, 35, 35, 0.60);
    border-radius: 8px;
}

.modal .btnWrap span:hover,
.modal .btnWrap span:focus {
    color: #bbb;
    text-decoration: none;
    cursor: pointer;
}

.modal-textWrap {
    background: var(--text-white);
    padding: 12px 20px;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}


.modal-has-opened {
    overflow: hidden;
    padding-right: 17px !important;
}


/****************** view page *****************/

.viewpage-header.mobile-header .header-wrap {
    padding: 20px 18px 20px 19px;
}

.viewpage-header div.logoImage {
    width: 105px;
    height: 20px;
    background: url("https://img.seoul.co.kr/img/n24/logo_fixed.png") no-repeat;
    background-size: contain;
}

.viewpage-header.mobile-header .rightSide {
    flex-direction: row-reverse;
    gap: 16px;
}

.viewHeader-wrapper {
    padding-top: 64px;
}

.viewHeader-wrapper .adArea {
    width: 100%;
    height: 50px;
    background: var(--text-gray-500);
    display: flex;
    justify-content: center;
    align-items: center;
    color: var(--text-white, #FFF);
    font-size: 12px;
    font-weight: 700;
    line-height: 24px;
    letter-spacing: -0.24px;
}

.bg-black .breadcrumb ol {
    font-size: 14px;
    font-weight: 700;
    line-height: 24px;
    letter-spacing: -0.14px;
}

.viewPageLayout {
    display: flex;
    justify-content: space-between;
    margin-bottom: 200px;
}

.viewHeader {
    position: absolute;
    left: 0;
    width: 100%;
}

/* article view header style -- bg color primary */
.bg-primary {
    background: var(--bg-primary-100);
}

.bg-primary .viewHeader-wrapper {
    border-bottom: 0;
}

.bg-primary .breadcrumb ol {
    color: var(--text-white);
}

.bg-primary .breadcrumb li:not(:last-child):after {
    background: rgba(255, 255, 255, .8);
}

.bg-primary h1 {
    color: var(--text-white);
}

.bg-primary .reporterInfo .name {
    color: rgba(255, 255, 255, .8);
}

.bg-primary .reporterInfo .dateInfo>div {
    color: var(--text-gray-300);
    opacity: .7;
}

.bottomSide .viewTool li div.hideText {
    display: block;
    width: 40px;
    height: 40px;
    border-radius: 20px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    overflow: hidden;
}

.bg-primary .bottomSide .viewTool>li {
    background: rgba(255, 255, 255, 0.20);
}

.bg-primary .bottomSide .viewTool>li:nth-child(1) div.hideText {
    background-position: -481px -247px;
}

.bg-primary .bottomSide .viewTool>li:nth-child(2) div.hideText {
    background-position: -349px -247px;
}

.bg-primary .bottomSide .viewTool>li:nth-child(3) div.hideText {
    background-position: -435px -247px;
}

.bg-primary .bottomSide .viewTool>li:nth-child(4) div.hideText {
    background-position: -393px -247px;
}


/* article view header style -- bg color black */
.bg-black {
    background: var(--bg-b-bg);
}

/* 241016 jhr add css :: start */
    .bg-black .focusArticle .articleTitle3 {
        color: #fff;
    }

    .bg-black #slick-onLineSpecial .articleTitle {
        color: #fff;
    }

    .bg-black #slick-onLineSpecial:after {
        background: linear-gradient(90deg, rgb(255 255 255 / 0%) 40%, rgba(38, 35, 35, 1) 84%, rgba(38, 35, 35, 1) 100%);
    }

    .special-template .arrowBtnWrap {
        position: unset;
    }
/* 241016 jhr add css :: end */

.bg-black .viewHeader-wrapper {
    border-bottom: 0;
}

.bg-black .breadcrumb ol {
    color: var(--text-white);
}

.bg-black .breadcrumb li:not(:last-child):after {
    background: rgba(255, 255, 255, .8);
}

.bg-black h1 {
    color: var(--text-white);
}

.bg-black .reporterInfo .name {
    color: rgba(255, 255, 255, .8);
}

.bg-black .reporterInfo .dateInfo>div {
    color: var(--text-gray-300);
    opacity: .7;
}

.bg-primary .reporter .reporterInfo .dateInfo div:first-child:after {
    content: '';
    position: absolute;
    display: block;
    top: 50%;
    transform: translateY(-50%);
    right: -5px;
    width: 1px;
    height: 10px;
    background: var(--text-gray-300);
    opacity: .7;
}

.bg-black .bottomSide .viewTool>li {
    background: rgba(255, 255, 255, 0.20);
}

.bg-black .bottomSide .viewTool>li:nth-child(1) div.hideText {
    background-position: -481px -247px;
}

.bg-black .bottomSide .viewTool>li:nth-child(2) div.hideText {
    background-position: -349px -247px;
}

.bg-black .bottomSide .viewTool>li:nth-child(3) div.hideText {
    background-position: -435px -247px;
}

.bg-black .bottomSide .viewTool>li:nth-child(4) div.hideText {
    background-position: -393px -247px;
}

.bg-primary .bottomSide .viewTool>li.open,
.bg-black .bottomSide .viewTool>li.open {
    background: rgba(255, 255, 255, 0.40);
}


/* header bg-vote */
.bg-vote {
    /*background-color: var(--text-gray-700);*/
    background-color: #8266BD;
}

.bg-vote .viewHeader-wrapper {
    border-bottom: 0;
}

.bg-vote .breadcrumb li {
    color: var(--text-white);
}

.bg-vote .breadcrumb li:not(:last-child):after {
    background-color: var(--text-white);
    opacity: .8;
}

.bg-vote h1 {
    color: var(--text-white);
}

.bg-vote .header-bottom:after {
    background: var(--text-white);
}

.bg-vote .reporterInfo div {
    color: var(--text-white);
}

.bg-vote .reporterInfo .name {
    opacity: .8;
}

.bg-vote .reporterInfo .dateInfo {
    opacity: .7;
}

.bg-vote .utilBtn {
    background: var(--text-gray-700);
    color: var(--text-white)
}

.bg-vote .utilBtn.newsLetterBtn {
    background: var(--text-white);
    color: var(--text-black);
}

.bg-vote .utilBtn .loginBlock>a:first-child:after {
    background: var(--text-white)
}

.bg-vote .nav-searchBtn {
    background-position: 0 -120px;
}

.bg-vote .utilMenu .newsLetterBtn span {
    background-position: -95px -126px;
}

.bg-vote .nav-menuList {
    color: var(--text-white);
}

.bg-vote .showMoreBtn {
    box-shadow: 0;
}

.bg-vote .bottomSide .viewTool>li {
    background-color: rgba(255, 255, 255, .2);
}

.bg-vote .bottomSide .viewTool>li:nth-child(1) div.hideText {
    background-position: -481px -247px;
}

.bg-vote .bottomSide .viewTool>li:nth-child(2) div.hideText {
    background-position: -349px -247px;
}

.bg-vote .bottomSide .viewTool>li:nth-child(3) div.hideText {
    background-position: -435px -247px;
}

.bg-vote .bottomSide .viewTool>li:nth-child(4) div.hideText {
    background-position: -392px -247px;
}



/***********************************/


.viewHeader-wrapper {
    display: flex;
    flex-direction: column;
    gap: 61px;
    padding: 80px 0 36px;
    border-bottom: 1px solid var(--text-gray-300);
}

.breadcrumb ol {
    display: flex;
    gap: 16px;
    margin-bottom: 12px;
}

.breadcrumb li {
    position: relative;
    flex-shrink: 0;
}

.breadcrumb li:not(:last-child):after {
    position: absolute;
    top: 50%;
    right: -10px;
    transform: translateY(-50%);
    content: '';
    display: block;
    width: 3px;
    height: 3px;
    background: var(--text-gray-500);
    border-radius: 10px;
}

.viewHeader-wrapper .bottomSide {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.reporter {
    display: flex;
    gap: 12px;
}

.reporter .image {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 30px;
    background-color: var(--text-gray-300);
    box-sizing: border-box;
    overflow: hidden;
}

.reporter .reporterInfo .dateInfo {
    display: flex;
    gap: 9px;
}

.reporter .reporterInfo .dateInfo div:first-child {
    position: relative;
}

.reporter .reporterInfo .dateInfo div:first-child:after {
    content: '';
    position: absolute;
    display: block;
    top: 50%;
    transform: translateY(-50%);
    right: -5px;
    width: 1px;
    height: 10px;
    background: var(--text-gray-700);
}

.bottomSide .viewTool {
    display: flex;
    gap: 12px;
}

.bottomSide .viewTool>li {
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 40px;
    background: var(--text-gray-200);
    border-radius: 20px;
}

.bottomSide .viewTool>li.open {
    background: var(--text-gray-300);
}

.bottomSide .viewTool>li:nth-child(1) {
    position: relative;
}

.bottomSide .viewTool>li:nth-child(2) {
    background-position: -135px -246px;
}

.bottomSide .viewTool>li:nth-child(3) {
    position: relative;
    background-position: -135px -246px;
}

.bottomSide .viewTool>li:nth-child(4) {
    position: relative;
    background-position: -135px -246px;
}

.bottomSide .viewTool>li:nth-child(1) div.hideText {
    background-position: -211px -247px;
}

.bottomSide .viewTool>li:nth-child(2) div.hideText {
    background-position: -35px -247px;
}

.bottomSide .viewTool>li:nth-child(3) div.hideText {
    background-position: -164px -247px;
}

.bottomSide .viewTool>li:nth-child(4) div.hideText {
    background-position: -78px -247px;
}

.bottomSide .viewTool .replyNum {
    position: absolute;
    top: 2px;
    right: -2px;
    display: block;
    background: var(--etc-notice);
    border-radius: 20px;
    padding: 0 5px;
}

.bottomSide .viewToolPopup {
    display: none;
    z-index: 10;
    position: absolute;
    top: 48px;
    left: 0;
    background: var(--text-white);
    border-radius: 8px;
    border: 1px solid var(--text-gray-300);
    padding: 20px 20px 30px;
    width: 272px;
    height: 208px;
    box-sizing: border-box;
}

.popupBox .popupHeader {
    display: flex;
    justify-content: space-between;
}

.nav-wrap .viewTool li div.popupBox div.hideText.closePopup,
.bottomSide .viewTool li div.popupBox div.hideText.closePopup {
    cursor: pointer;
    width: 26px;
    height: 26px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -198px -224px;
}

.bottomSide .viewToolPopup .popContent {
    margin: 12px 0 20px;
}

.bottomSide .viewToolPopup .fontSizeList {
    display: flex;
    justify-content: space-between;
}

.bottomSide .viewToolPopup .fontSizeList li {
    width: 40px;
    height: 40px;
    border-radius: 20px;
    border: 1px solid var(--text-gray-300);
    color: var(--text-gray-600);
}

.bottomSide .viewToolPopup .fontSizeList li div {
    width: 40px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
}

.bottomSide .viewToolPopup .fontSizeList li.pick {
    color: var(--text-black);
    background: var(--text-gray-100);
}

.snsSharePopupBox {
    cursor: default;
    z-index: 10;
    position: absolute;
    display: none;
    top: 48px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--text-white);
    border-radius: 8px;
    border: 1px solid var(--text-gray-300);
    padding: 20px 20px 30px;
    width: 324px;
    height: 320px;
    box-sizing: border-box;
}

.snsSharePopupBox .snsShareList {
    padding: 16px 0 24px 10px;
    display: flex;
    flex-wrap: wrap;
    gap: 16px 24px;
}

.snsSharePopupBox .snsShareList li {
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    width: 72px;
    height: 72px;
}

.snsSharePopupBox .snsShareList li .snsBtn {
    width: 40px;
    height: 40px;
    background-repeat: no-repeat;
    margin: 0 auto 8px;

}

.snsSharePopupBox .snsShareList li:nth-child(1) .snsBtn {
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp");
    background-position: -353px -287px;
}

.snsSharePopupBox .snsShareList li:nth-child(2) .snsBtn {
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp");
    background-position: -253px -287px;
}

.snsSharePopupBox .snsShareList li:nth-child(3) .snsBtn {
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp");
    background-position: -153px -287px;
}


.snsSharePopupBox .snsShareList li:nth-child(4) .snsBtn {
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp");
    background-position: -103px -287px;
}

.snsSharePopupBox .snsShareList li:nth-child(5) .snsBtn {
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp");
    background-position: -303px -287px;
}

.snsSharePopupBox .snsShareList li .snsTit {
    flex-shrink: 0;
}

.snsSharePopupBox .linkCopy {
    display: flex;
}

.snsSharePopupBox .linkCopy .linkArea {
    flex-shrink: 0;
    width: 191px;
    padding: 10px 8px 10px 12px;
    border-top-left-radius: 8px;
    border-bottom-left-radius: 8px;
    border: 1px solid var(--text-gray-400);
    border-right: 0;
}

.snsSharePopupBox .linkCopy .copyBtn {
    cursor: pointer;
    flex-shrink: 0;
    display: block;
    padding: 8px 10px;
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
    border: 1px solid var(--text-gray-400);
    background: var(--text-gray-200);
}


.viewLayout,
.viewContentWrap {
    display: flex;
    width: 778px;
    justify-content: center;
    flex-direction: column;
    align-items: center;
}

.viewRightSide {
    width: 300px;
    margin-top: 308px;
    padding: 64px 0 60px;
}

.viewRightSide section {
    margin: 100px 0;
}

.viewRightSide section:nth-child(1) {
    margin: 0;
}

.viewContentWrap {
    padding-top: 308px;
}

/* .viewContentWrap br {
    content: "";
    display: block;
    font-size: 100%;
    height: 16px;
} */

.width730 {
    width: 730px;
    padding: 0 24px;
}

.viewContent {
    padding: 64px 0 60px;
    width: 730px;
}

.viewContent .subTitle {
    padding-right: 20px;
    margin-bottom: 60px;

}

.stit {
    padding-right: 20px;
    margin-bottom: 60px;
    color: var(--text-black, #111);
    font-family: Pretendard;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 34px;
    letter-spacing: -0.24px;
}

.expendImageWrap {
    position: relative;
    padding: 8px 0;
    margin: 0 auto;
    width: min-content;
}

.expendImageBtn {
    z-index: 100;
    cursor: pointer;
    position: absolute;
    top: 20px;
    right: 12px;
    width: 40px;
    height: 40px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat rgba(38, 35, 35, 0.60);
    background-position: 10px -246px;
    border-radius: 8px;
}

.viewImage {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    border-radius: 12px;
}

.viewImage.viewTable { border-radius: 0; }

/* 
.viewImageWrap.small {
    padding: 8px 92px;
}

.viewImageWrap {
    margin: 32px 0;
}

.viewImageWrap .viewImageText {
    margin-top: 8px;
}

.viewImageWrap .viewImageTitle {
    display: inline-block;
}

.viewContent .paragraph {
    margin-bottom: 32px;
} */

.viewContent .adWrap {
    padding: 32px 0;
}

.viewContent .ad {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 250px;
    background: var(--text-gray-500);
}

/* 포토그룹 확대 */
.expendPhotoGroup {
    z-index: 99999;
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    overflow: hidden;
    background: var(--bg-b-bg);
}

.expendPhotoGroup .close {
    z-index: 10;
    cursor: pointer;
    position: absolute;
    top: 31px;
    right: 31px;
    width: 27px;
    height: 27px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -429px -294px;
}

.expendPhotoGroup.on {
    display: block;
}

.expendPhotoGroup .photoGroup {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 100%;
    height: 100%;
    margin-bottom: 0;
    background: 0;
    padding: 0;
}

.expendPhotoGroup .photoList {
    position: relative;
    display: flex;
    justify-content: center;
    border-radius: 8px;
    margin-top: 136px;
}

#slick-expendPhotoGroup {
    box-sizing: border-box;
    width: 830px;
}

#slick-expendPhotoGroup .slick-list {
    border-radius: 8px;
}

#slick-expendPhotoGroup li {
    width: 830px;
    height: 552px;
}

#slick-expendPhotoGroup li .articleImage {
    width: 830px;
    height: 552px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    overflow: hidden;
}

#slick-expendPhotoGroup li .articleImage picture {
    position: relative;
}

#slick-expendPhotoGroup li .articleImage img {
    display: block;
    width: auto;
    height: 100%;
    border-radius: 8px;
}


#slick-expendPhotoGroup li .articleImage picture::before {
    content: '';
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 165px;
    background: linear-gradient(180deg, rgba(17, 17, 17, 0.00) 0%, rgba(17, 17, 17, 0.70) 95%);
}


.photoGroup .photoContents {
    padding: 32px 40px 12px;
}

.expendPhotoGroup .thumbList {
    position: relative;
    display: flex;
    justify-content: center;
    padding: 16px 36px 8px;
    background: 0
}

#slick-expendPhotoGroup-thumb {
    width: 100%;
}

#slick-expendPhotoGroup-thumb .slick-list {
    border-radius: 8px;
}

#slick-expendPhotoGroup-thumb li {
    margin-right: 7px;
    cursor: pointer;
}

#slick-expendPhotoGroup-thumb li .thumbImage {
    position: relative;
    width: 87px;
    height: 87px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    overflow: hidden;
}

#slick-expendPhotoGroup-thumb .slick-current .thumbImage:after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(0deg, rgba(242, 105, 48, 0.20) 0%, rgba(242, 105, 48, 0.20) 100%);
}

#slick-expendPhotoGroup-thumb li .thumbImage img {
    height: 100%;
    width: auto;
    border-radius: 8px;
}

#slick-expendPhotoGroup-thumb .slick-current .thumbImage {
    box-sizing: border-box;
    border: 3px solid var(--bg-primary-100);
    border-radius: 11px;
}

#expendPhotoGroup-prevArrow {
    left: 20px;
}

#expendPhotoGroup-nextArrow {
    right: 20px;
}


.photoGroupWrap {
    padding: 10px 0;
}

.photoGroup {
    position: relative;
    width: 100%;
    background: var(--text-gray-100);
    padding-top: 40px;
    margin: 32px 0;
}

.expandImageBtn {
    position: absolute;
    top: 0;
    right: 0;
    cursor: pointer;
    display: flex;
    width: 40px;
    height: 40px;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: var(--text-gray-200);
}

.expandImageBtn span {
    display: block;
    box-sizing: border-box;
    width: 17px;
    height: 17px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -402px -298px;
}

.photoList {
    position: relative;
    display: flex;
    justify-content: center;
    border-radius: 8px;
}

#slick-photoGroup {
    box-sizing: border-box;
    width: 610px;
}

#slick-photoGroup .slick-list {
    border-radius: 8px;
}

#slick-photoGroup li {
    width: 610px;
    height: 407px;
}

#slick-photoGroup li .articleImage {
    width: 610px;
    height: 407px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    overflow: hidden;
}

#slick-photoGroup li .articleImage img {
    width: auto;
    height: 100%;
    border-radius: 8px;
}

.photoGroup .photoContents {
    padding: 32px 40px 12px;
}


.thumbList {
    position: relative;
    display: flex;
    justify-content: center;
    padding: 14px 36px;
    background: var(--text-gray-300);
}

#slick-photoGroup-thumb {
    width: 100%;
}

#slick-photoGroup-thumb .slick-list {
    border-radius: 8px;
}

#slick-photoGroup-thumb li {
    margin-right: 7px;
    cursor: pointer;
}

#slick-photoGroup-thumb li .thumbImage {
    width: 126px;
    height: 126px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    overflow: hidden;
}

#slick-photoGroup-thumb li .thumbImage img {
    height: 100%;
    width: auto;
    border-radius: 8px;
}

#slick-photoGroup-thumb .slick-current .thumbImage {
    position: relative;
    box-sizing: border-box;
    border: 3px solid var(--bg-primary-100);
    border-radius: 11px;
}

#slick-photoGroup-thumb .slick-current .thumbImage:after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(0deg, rgba(242, 105, 48, 0.20) 0%, rgba(242, 105, 48, 0.20) 100%);
}

.photoGroup-prevArrow {
    cursor: pointer;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    transition: all .3s;
    width: 50px;
    height: 50px;
}

.photoGroup-nextArrow {
    cursor: pointer;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: auto;
    right: 0;
    width: 50px;
    height: 50px;
}

.photoGroup-prevArrow:before {
    content: '';
    opacity: 1;
    position: absolute;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat center;
    background-position: -392px -56px;
    transform: rotate(-180deg);
    width: 50px;
    height: 50px;
}

.photoGroup-nextArrow:before {
    content: '';
    opacity: 1;
    position: absolute;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat center;
    background-position: -392px -56px;
    width: 50px;
    height: 50px;
}

.ug-thumb-wrapper {
    cursor: pointer;
}

.ug-thumb-wrapper.ug-thumb-selected {
    position: relative;
    /* border:3px solid #f26930!important; */
}

.ug-thumb-wrapper.ug-thumb-selected:after {
    z-index: 100;
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(0deg, rgba(242, 105, 48, 0.20) 0%, rgba(242, 105, 48, 0.20) 100%);
}

.photoThumb-prevArrow {
    cursor: pointer;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    transition: all .3s;
    width: 32px;
    height: 32px;
}

.photoThumb-nextArrow {
    cursor: pointer;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: auto;
    right: 0;
    width: 32px;
    height: 32px;
}

.photoThumb-prevArrow:before {
    content: '';
    opacity: 1;
    position: absolute;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat center;
    background-position: -249px -66px;
    width: 32px;
    height: 32px;
}

.photoThumb-nextArrow:before {
    content: '';
    opacity: 1;
    position: absolute;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat center;
    background-position: -291px -66px;
    width: 32px;
    height: 32px;
}

/*  ug-gallery */
.ug-gallery-wrapper .ug-textpanel-description {
    font-size: 14px;
    color: var(--text-gray-700) !important;
    text-align: left;
    z-index: 3;
}

.ug-gallery-wrapper.ug-theme-grid.ug-under-780 .ug-slider-wrapper {
    background: var(--text-gray-100) !important;
}

.ug-gallery-wrapper.ug-theme-grid.ug-under-780 .ug-strip-panel {
    background: var(--text-gray-300) !important;
}

.ug-gallery-wrapper.ug-under-780 .ug-textpanel-title {
    font-size: 16px;
    color: var(--text-gray-700);
    line-height: 26px;
}

.ug-under-780 .ug-button-fullscreen.ug-skin-default {
    position: relative;
    top: 0;
    left: auto;
    right: 0;
    cursor: pointer;
    display: flex;
    width: 40px;
    height: 40px;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background-image: none;
    background-color: var(--text-gray-200);
}

.ug-under-780 .ug-button-fullscreen.ug-skin-default {
    position: relative;
    top: 0 !important;
    left: auto !important;
    right: 0 !important;
    cursor: pointer;
    display: flex;
    width: 40px;
    height: 40px;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background-image: none;
}

.ug-under-780 .ug-button-fullscreen.ug-skin-default:after {
    content: '';
    position: absolute;
    display: block;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -402px -298px;
    box-sizing: border-box;
    width: 17px;
    height: 17px;
}

.ug-gallery-wrapper .ug-slider-wrapper {
    background: var(--bg-b-bg);
}

.ug-gallery-wrapper .ug-strip-panel {
    background: var(--bg-b-bg);
}

.ug-gallery-wrapper .ug-textpanel-title {
    color: var(--text-gray-700);
    font-size: 18px;
}

.ug-button-fullscreen.ug-skin-default {
    position: relative;
    top: 24px;
    left: auto;
    right: 24px;
    cursor: pointer;
    display: flex;
    width: 40px;
    height: 40px;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background-image: none;
}

.ug-button-fullscreen.ug-skin-default:after {
    content: '';
    position: absolute;
    display: block;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") -429px -293px no-repeat;
    box-sizing: border-box;
    width: 27px;
    height: 27px;
}

.ug-arrow-left.ug-skin-default {
    width: 50px;
    height: 50px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -392px -56px;
    transform: rotate(-180deg);
}

.ug-arrow-right.ug-skin-default {
    width: 50px;
    height: 50px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -392px -56px;
}

.ug-arrow-left.ug-skin-default.ug-arrow-hover,
.ug-arrow-right.ug-skin-default.ug-arrow-hover {
    background-position: -392px -56px;
}

.ug-strip-panel .ug-strip-arrow-left.ug-skin-default,
.ug-strip-panel .ug-strip-arrow-right.ug-skin-default {
    width: 32px;
    height: 32px;
}

.ug-strip-panel .ug-strip-arrow.ug-strip-arrow-left.ug-skin-default .ug-strip-arrow-tip {
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat;
    background-position: -249px -66px;
    width: 32px;
    height: 32px;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%);
    opacity: 1;
}

.ug-strip-panel .ug-strip-arrow.ug-strip-arrow-right.ug-skin-default .ug-strip-arrow-tip {
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat;
    background-position: -291px -66px;
    width: 32px;
    height: 32px;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%);
    opacity: 1;
}

.ug-strip-panel .ug-strip-arrow-left.ug-skin-default.ug-button-disabled .ug-strip-arrow-tip {
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat;
    background-position: -249px -66px;
    width: 32px;
    height: 32px;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%);
    opacity: .5;
}

.ug-strip-panel .ug-strip-arrow-right.ug-skin-default.ug-button-disabled .ug-strip-arrow-tip {
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat;
    background-position: -291px -66px;
    width: 32px;
    height: 32px;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%);
    opacity: .5;
}

.ug-gallery-wrapper.ug-under-780 .ug-textpanel-description {
    line-height: 24px;
}

.ug-gallery-wrapper.ug-under-780 .ug-thumbs-strip {
    top: 14px !important;
}

.ug-gallery-wrapper.ug-under-780 .ug-strip-panel {
    height: 152px !important;
}

.v_photoarea {
    clear: both;
    text-align: center;
    max-width: 780px;
    margin: 32px 0;
}

.v_photoarea_L {
    float: left;
    text-align: center;
    max-width: 780px;
    margin-bottom: 20px;
    margin-right: 20px;
}

.v_photoarea_R {
    float: right;
    text-align: center;
    max-width: 780px;
    margin-bottom: 20px;
    margin-left: 20px;
}

.v_photo .expendImageWrap>figure {
    position: relative;
    display: inline-block;
}

.v_photo .expendImageWrap>figure>img {
    max-width: 730px;
    width: auto;
}

/* figure > .viewImage width값을 expendImageWrap 로 지정 */

.v_photo_caption {
    text-align: left;
    padding-top: 8px;

    color: var(--text-gray-700);
    font-family: Pretendard;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    /* 171.429% */
    letter-spacing: -0.14px;
}

.v_photo_caption strong.viewImageTitle {
    color: var(--text-gray-700);
    font-family: Pretendard;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 26px;
    letter-spacing: -0.16px;
}

.v_photo {
    /*position:relative;*/
    margin: 0 auto;
}

.v_photo img {
    margin: 0 auto;
}

.subTitle_s0 {
    /* margin: 32px 0 0 0;*/  /*20240312 jjw 정현용부장 요청 */ 
    padding-bottom: 20px;
    border-bottom: 1px solid var(--text-black);
    display: block;
    color: var(--text-black);
    font-family: Pretendard;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    letter-spacing: -0.2px;
}

.subTitle_s2 {
    display: block;
    color: var(--text-black);
    font-family: Pretendard;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    letter-spacing: -0.2px;
    padding-left: 20px;
    border-left: 4px solid var(--bg-primary-100);
    margin-top: 20px;
    margin-bottom: 32px;
}

.con_quotation_01 {
    margin: 32px 0;
    position: relative;
    padding: 32px 0 8px;
    color: var(--text-black);
    font-family: Pretendard;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    letter-spacing: -0.2px;
}

.con_quotation_01::before {
    content: '';
    font-size: 0;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 24px;
    height: 17px;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat;
    background-position: -185px -199px;
}

.con_quotation_span {
    display: block;
    color: var(--text-gray-500);
    font-family: Pretendard;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    letter-spacing: -0.14px;
    padding: 8px 0 0;
}

.con_quotation_03 {
    box-sizing: border-box;
    border-radius: 0;
    width: auto;
    left: auto;
    top: auto;
    background: none;
    border: 0;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 32px 0;
    text-align: center;
    padding: 40px 0;
    color: var(--text-black);
    font-family: Pretendard;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    letter-spacing: -0.2px;
}

.con_quotation_03::before {
    content: '';
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    width: 40px;
    height: 40px;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat;
    background-position: -1px -287px;
}

.con_quotation_03::after {
    content: '';
    position: absolute;
    display: block;
    bottom: 0;
    right: 0;
    width: 40px;
    height: 40px;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat;
    background-position: -1px -287px;
    transform: rotate(-180deg);
}

.con_quotation_03 .con_quotation_span {
    padding-top: 12px;
}

.rowAd {
    display: flex;
    gap: 32px;
}

.rowAd .ad {
    width: 300px;
    height: 250px;
    flex-shrink: 0;
    margin: 0;
}

article .textbox {
    border-radius: 12px;
    padding: 32px;
    margin-bottom: 32px;
}

.con_textbox_01 {
    min-height: auto;
    color: var(--text-gray-700);
    font-family: Pretendard;
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 32px;
    letter-spacing: -0.18px;
    padding: 32px;
    margin: 32px;
    border: 0;
    border-radius: 12px;
    background-color: var(--text-gray-200);
}

.con_textbox_02 {
    min-height: auto;
    color: var(--text-gray-700);
    font-family: Pretendard;
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 32px;
    letter-spacing: -0.18px;
    padding: 32px;
    margin: 32px;
    border: 0;
    border-radius: 12px;
    background: rgba(232, 240, 249, 1);
}


.con_textbox_03 {
    min-height: auto;
    color: var(--text-gray-700);
    font-family: Pretendard;
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 32px;
    letter-spacing: -0.18px;
    padding: 32px;
    margin: 32px;
    border: 0;
    border-radius: 12px;
    background: rgba(240, 248, 239, 1);
}

.con_textbox_04 {
    min-height: auto;
    color: var(--text-gray-700);
    font-family: Pretendard;
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 32px;
    letter-spacing: -0.18px;
    padding: 32px;
    margin: 32px;
    border: 0;
    border-radius: 12px;
    background: rgba(240, 248, 239, 1);
    background: rgba(249, 245, 219, 1);
}

.con_textbox_05 {
    min-height: auto;
    color: var(--text-gray-700);
    font-family: Pretendard;
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 32px;
    letter-spacing: -0.18px;
    padding: 32px;
    margin: 32px;
    border: 0;
    border-radius: 12px;
    background: rgba(240, 248, 239, 1);
    background: rgba(249, 237, 231, 1);
}


.con_hr_01 {
    border-bottom: 4px solid var(--text-black);
    margin-bottom: 40px;
}

.con_hr_02 {
    border-bottom: 2px solid var(--text-black);
    margin-bottom: 40px;
}

.con_hr_03 {
    border-bottom: 1px solid var(--text-gray-300);
    margin-bottom: 40px;
}

.con_hr_04 {
    border-top: 1px solid var(--text-gray-500);
    border-bottom: 1px solid var(--text-gray-500);
    border-left: 0;
    border-right: 0;
    padding-bottom: 3px;
    margin-bottom: 40px;
}

article table {
    margin: 64px 0;
}

article table thead th,
article table tbody td {
    padding: 16px 24px;
    border: 1px solid var(--text-gray-400);
}

.articleBranchNews {
    margin-top: 24px;
    height: 64px;
    overflow: hidden;
}

.articleBranchNews.open {
    height: 100%;
    overflow: none;
}

.articleBranchNews .branchNewsList li:not(:first-child) {
    padding-top: 8px;
}

.articleBranchNews .branchNewsList li {
    position: relative;
    text-indent: 12px;
}

.articleBranchNews .branchNewsList li:before {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 4px;
    height: 4px;
    background: var(--text-black, #111);
    border-radius: 6px;
}

.showMorBranch {
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 4px;
    padding: 16px 12px;
    text-align: center;
}

.showMorBranch span.arrow {
    display: block;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -150px -232px;
    width: 10px;
    height: 9px;
}

.showMorBranch.open span.arrow {
    background-position: -150px -232px;
    transform: rotate(-180deg);
}

.articleKeyword {
    border-top: 1px solid var(--text-gray-300);
    padding-top: 32px;
}

.articleKeyword ul {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.articleKeyword ul li {
    padding: 4px 16px;
    background-color: var(--text-gray-100);
    border-radius: 30px;
    flex-shrink: 0;
}

.articleBottomAD {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 778px;
    /*height: 125px;*/
    /*background: var(--text-gray-500);*/
    margin: 60px 0;
}

.articleBottomNews {
    margin: 60px 0;
}

.articleBottomList {
    padding-top: 40px;
    display: flex;
    gap: 40px 20px;
    flex-wrap: wrap;
}

.articleBottomList li {
    width: 230px;
    flex-shrink: 0;
}

.articleBottomList li .articleImage {
    width: 230x;
    border-radius: 12px;
    overflow: hidden;
}

.articleBottomList li .articleImage img {
    border-radius: 12px;
}

.articleBottomList li h3 {
    padding: 12px 10px 0 0;
}

.listAD ul {
    display: flex;
    flex-direction: column;
}

.listAD ul li {
    padding-right: 20px;
    padding-top: 12px;
    padding-bottom: 12px;
}

.listAD ul li:not(:last-child) {
    border-bottom: 1px solid var(--text-gray-300);
}

.listAD ul li:last-child {
    padding-bottom: 0;
}

/* 기사 공유하기 */
.con_openLinkBox_V .con_openLinkThumb {
    display: flex;
    justify-content: center;
    align-items: center;
}

.con_openLinkBox_V .con_openLinkThumb img {
    max-width: 510px;
    max-height: 268px;
    border-top-right-radius: 12px;
    border-top-left-radius: 12px;
    border-bottom: 1px solid var(--text-gray-300);
}

.con_openLinkBox_V .con_openLinkTitle {
    color: var(--text-black);
    font-family: Pretendard;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 28px;
    letter-spacing: -0.16px;
    text-align: left;
    padding: 12px 20px 0;
    max-width: 510px;
    margin: 0 auto;
}

.con_openLinkBox_V .con_openLinkSummery {
    color: var(--text-gray-600);
    font-family: Pretendard;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    letter-spacing: -0.14px;
    text-align: left;
    word-break: break-all;
    padding: 4px 20px 0;
    max-width: 510px;
    margin: 0 auto;
}

.con_openLinkBox_V .con_openLinkHost {
    color: var(--text-gray-500);
    font-family: Pretendard;
    font-size: 13px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px;
    letter-spacing: -0.13px;
    padding: 8px 20px 16px;
    text-align: left;
    max-width: 510px;
    margin: 0 auto;
}

.con_openLinkBox_V {
    text-align: center;
    border: 1px solid var(--text-gray-300);
    border-radius: 12px;
    max-width: 510px;
    margin: 32px auto;
    cursor: pointer;
    padding: 0;
    text-decoration: none;
}

.con_openLinkBox_H {
    display: flex;
    justify-content: center;
    text-align: center;
    /* max-width: 510px; */ /*정연호부장 요청*/
    margin: auto;
    cursor: pointer;
    text-decoration: none;
}

.con_openLinkBox_H .con_content {
    display: flex;
    border: 1px solid var(--text-gray-300);
    border-radius: 12px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-left: 0;
    padding: 0 20px 0;
    flex-direction: column;
    justify-content: center;
    max-width: 510px;
}

.con_openLinkBox_H .con_openLinkThumb {
    flex-shrink: 0;
    width: 110px;
    height: 110px;
    border-top-left-radius: 8px;
    border-bottom-left-radius: 8px;
    overflow: hidden;
    float: none;
}

.con_openLinkBox_H .con_openLinkThumb img {
    border-top-left-radius: 8px;
    border-bottom-left-radius: 8px;
    max-width: 110px;
    max-height: 110px;
}

.con_openLinkBox_H .con_openLinkTitle {
    color: var(--text-black);
    font-family: Pretendard;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 28px;
    letter-spacing: -0.16px;
    text-align: left;
}

.con_openLinkBox_H .con_openLinkSummery {
    color: var(--text-gray-600);
    font-family: Pretendard;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    letter-spacing: -0.14px;
    text-align: left;
    word-break: break-all;
}

.con_openLinkBox_H .con_openLinkHost {
    color: var(--text-gray-500);
    font-family: Pretendard;
    font-size: 13px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px;
    letter-spacing: -0.13px;
    text-align: left;
}

/* 가로형 링크 수정 240814 */
.con_openLinkA { display: block; }
.con_openLinkBox_H { overflow: hidden; border: 1px solid #eee; box-sizing: border-box; border-radius: 12px; display: block; cursor: pointer; text-decoration: none; margin-bottom: 8px; }
.con_openLinkBox_H .con_openLinkThumb,
.con_openLinkBox_H .con_openLinkTitle,
.con_openLinkBox_H .con_openLinkSummery,
.con_openLinkBox_H .con_openLinkHost { float: left; }
.con_openLinkBox_H .con_openLinkTitle,
.con_openLinkBox_H .con_openLinkSummery,
.con_openLinkBox_H .con_openLinkHost { width: calc(100% - 150px); padding: 0 20px; }
.con_openLinkBox_H .con_openLinkThumb { position: relative; }
.con_openLinkBox_H .con_openLinkThumb img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; margin: auto; }
.con_openLinkBox_H .con_openLinkTitle { padding-top: 6px; }
.con_openLinkBox_H .con_openLinkSummery { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; white-space: normal; }
.con_openLinkBox_H .con_openLinkHost { padding-top: 4px; }

/* 지도 */
.con_googleMap {
    width: 730px;
    height: 417px;
    border-radius: 12px;
    background: var(--text-gray-100);
    overflow: hidden;
    margin: 32px 0;
    text-align: center;
}

article .videoWrap {
    width: 730px;
    height: 411px;
    border-radius: 12px;
    background: var(--text-gray-100);
    overflow: hidden;
}


.fixedBottom {
    display: none;
    position: fixed;
    z-index: 100;
    bottom: 0;
    left: 0;
    width: 100%;
    background: var(--bg-b-bg);
    box-shadow: none;
}


/* 회원가입-로그인 배너 */

.joinBanner {
    padding: 14px 0;
    position: relative;
}

/*
.joinBanner .bannerBtn {
    cursor: pointer;
    position: absolute;
    right: 0;
    top: -5px;
    width: 32px;
    height: 32px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -60px -221px;
}
*/

.joinBanner .content {
    position: relative;
    width: 1280px;
    margin: 0 auto;
}

.joinBanner .bannerBtn {
    cursor: pointer;
    position: absolute;
    z-index: 10;
    right: 0;
    top: -10px;
    width: 44px;
    height: 44px;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat;
    background-position: -189px -216px;
    filter: brightness(203%);
}

.joinBanner div {
    text-align: center;
    font-size: 17px;
    font-weight: 700;
    line-height: 22px;
    letter-spacing: -0.17px;
}

.bottomBanner>div {
    position: relative;
    width: 1280px;
    margin: 0 auto;
    text-align: center;
}

.bottomBanner .seoulLogo {
    display: inline-block;
    vertical-align: bottom;
    width: 71px;
    height: 22px;
    overflow: hidden;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat;
    background-position: -351px -196px;
}

.loginBanner {
    padding: 40px 0 50px;
    display: none;
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
}

.dim {
    z-index: 0;
    content: '';
    display: none;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100vh;
    background: var(--bg-b-bg);
    opacity: .3;
}

.loginBanner .bottomBanner .bannerBtn {
    cursor: pointer;
    position: absolute;
    right: 0;
    top: -5px;
    width: 32px;
    height: 32px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -1px -9px;
    transform: rotate(-90deg);
}

.loginBanner .bottomBanner .bannerBtn:hover {
    background-position: -213px -9px;
}

.loginBanner .logoin-layout {
    width: 340px;
    margin: 0 auto;
}

.loginBanner .loginForm {
    margin-top: 30px;
}

.loginBanner .loginForm input[type="text"] {
    box-sizing: border-box;
    width: 100%;
    border: 1px solid var(--text-gray-300);
    background: var(--text-white);
    padding: 12px 20px;
    border-radius: 4px;
}

.loginForm input::placeholder {
    color: var(--text-gray-500);
}

.loginBanner .loginForm input:first-child {
    margin-bottom: 4px;
}

.loginUtil {
    margin: 16px 0 40px;
    display: flex;
    justify-content: center;
    gap: 0 32px;
}

.loginUtil li {
    position: relative;
}

.loginUtil li:not(:last-child):after {
    content: '';
    position: absolute;
    display: block;
    top: 50%;
    transform: translateY(-50%);
    right: -16px;
    width: 1px;
    height: 10px;
    background: var(--text-gray-400);
}

.loginBanner .loginBtn {
    cursor: pointer;
    margin-top: 24px;
    padding: 14px 40px;
    width: 100%;
    background: var(--text-black);
    border: 0;
    border-radius: 100px;
}

.socialLoginBtn>.socialLoginTitle {
    position: relative;
    text-align: center;
}

.socialLoginBtn>.socialLoginTitle span {
    position: relative;
    z-index: 1;
    display: inline-block;
    background: var(--text-white);
    padding: 0 8px;
	font-weight: 700;
}

.socialLoginBtn>.socialLoginTitle:after {
    z-index: 0;
    content: '';
    position: absolute;
    display: block;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    right: -16px;
    width: 100%;
    height: 1px;
    background: var(--text-gray-400);
}

.socialLoginBtn ul {
    margin-top: 24px;
    display: flex;
    justify-content: center;
    gap: 24px;
}

.socialLoginBtn ul li div {
    cursor: pointer;
    width: 40px;
    height: 40px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
}

.socialLoginBtn ul li:nth-child(1) a div {
    background-position: -253px -287px;
}

.socialLoginBtn ul li:nth-child(2) a div {
    background-position: -103px -287px;
}

.socialLoginBtn ul li:nth-child(3) a div {
    background-position: -353px -287px;
}

.socialLoginBtn ul li:nth-child(4) a div {
    width: 42px;
    height: 42px;
    background-position: -51px -286px;
}


/* 오피니언 */
.opinion-top {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 40px;
}

.opinion-top .topBox {
    display: flex;
    justify-content: space-between;
}

.opinion-top .leftSide {
    box-sizing: border-box;
    width: 50%;
    padding: 30px 21px 30px 32px;
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
    background: var(--text-gray-100);
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 50px;
}

.opinion-top .leftSide {
    position: relative;
}

.opinion-top .leftSide:after {
    position: absolute;
    content: '';
    display: block;
    bottom: 22px;
    right: 42px;
    width: 60px;
    height: 87px;
    background: url("https://img.seoul.co.kr/img/n24/seoulLogo/opinion-bg.webp") no-repeat;
    background-size: contain;
}

.opinion-top .articleInfo {
    display: flex;
    gap: 20px;
    margin-bottom: 20px;
}

.opinion-top .articleInfo>div:nth-child(1) {
    position: relative;
    padding-left: 15px;
}

.opinion-top .articleInfo>div:nth-child(1):before {
    position: absolute;
    content: '';
    display: block;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    width: 8px;
    height: 12px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -148px -201px
}

.opinion-top .articleInfo>div:nth-child(1):after {
    position: absolute;
    display: block;
    content: '';
    top: 50%;
    right: -12px;
    transform: translateY(-50%);
    width: 4px;
    height: 4px;
    border-radius: 5px;
    background: rgba(217, 217, 217, 1);
}

.opinion-top .rightSide {
    width: 50%;
}

.opinion-top .rightSide .articleImage {
    width: 100%;
    box-sizing: border-box;
    height: 268px;
    display: flex;
    align-items: center;
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
    overflow: hidden;
    background: var(--text-gray-100);
    justify-content: flex-end;
    text-align: right;
}

.opinion-top .rightSide .articleImage img {
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
}

.opinion-top .rightSide .topList li {
    width: 240px;
    padding: 20px 0;
    border-bottom: 1px solid var(--text-gray-300);
}

.opinion-top .rightSide .topList li:first-child {
    padding-top: 0;
}

.opinion-top .rightSide .topList li:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.opinion-top .bottomList ul {
    display: flex;
    gap: 40px;
}

.opinion-top .bottomList ul li {
    width: 400px;
}

.opinion-top .bottomList .articleInfo {
    margin-bottom: 8px;
}


/* 기자별 칼럼 */
.opinionList section {
    margin: 100px 0 0;
}

.opinionList section:first-child {
    margin-top: 0
}

.todayEditorial {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    /* gap: 20px; */
}

.todayEditorial li {
    width: 50%;
}
.todayEditorial li:nth-child(1) .editorial,
.todayEditorial li:nth-child(2) .editorial{
    padding-top:0;
}

.todayEditorial li:nth-last-child(1) .editorial,
.todayEditorial li:nth-last-child(2) .editorial{
    border-bottom: 0;
    padding-bottom: 0;
}

.todayEditorial li:nth-child(odd) .editorial {
    padding-right: 28px;
}

.todayEditorial li:nth-child(even) .editorial {
    padding-left: 28px;
}

.todayEditorial .editorial {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid var(--text-gray-300);
    padding: 32px 0;
}

.todayEditorial .editorial>div:nth-child(1) {
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    gap: 4px;
    max-width: 283px;
}

.todayEditorial .editorial>div:nth-child(1) h2 {
    margin-bottom: 0;
}

.todayEditorial .editorial .expertImage {
    flex-shrink: 0;
    width: 87px;
    height: 87px;
    border-radius: 60px;
    overflow: hidden;
    background: var(--text-gray-500);
}

.reporterList {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.reporterList li {
    width: 195px;
    position: relative;
}

.reporterList .back {
    position: absolute;
    top: 0;
    left: 0;
}

.reporterList .front {
    position: relative;
    box-sizing: border-box;
}

.reporterList .front .reporterImage {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    border-radius: 12px;
    overflow: hidden;
}

.reporterList .front .reporterImage img {
    border-radius: 12px;
}

.reporterList .reporterName {
    z-index: 10;
    top: 16px;
    left: 16px;
    position: absolute;
    padding: 4px 16px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.80);
}

.reporterList .back {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    border-radius: 12px;
    background: var(--text-gray-200);
    padding: 38px 17px 38px 18px;
    opacity: 0;
}

.reporterList .back:after {
    content: '';
    display: block;
    position: absolute;
    top: 30px;
    right: 30px;
    width: 70px;
    height: 102px;
    background: url("https://img.seoul.co.kr/img/n24/seoulLogo/report-bg.webp") no-repeat;
}

.reporterList li:hover .reporterImage {
    transition: all .25s;
    opacity: 0;
    z-index: -1;
}

.reporterList li:hover .reporterName {
    transition: all .25s;
    opacity: 0;
    z-index: -1;
}

.reporterList li:hover .back {
    transition: all .25s;
    opacity: 1;
}


/* 전문가별 칼럼 */

.expertList {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.expertList li {
    width: 195px;
    background: var(--text-gray-100);
    border-radius: 12px;
}

.expertList .expertBox {
    width: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding: 17px 0;
}

.expertList .expertBox .expertImage {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 120px;
    height: 120px;
    border-radius: 60px;
    overflow: hidden;
    background: var(--text-gray-300);
}

.expertList .expertBox .expertImage img {
    border-radius: 20px;
}

.expertList .expertBox .expertInfo {
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0 8px;
}
.expertList li.hide { display: none; }
.listMoreBtn {
  cursor: pointer;
  width: 300px;
  margin: 40px auto 0;
  padding: 8px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 6px;
}
.listMoreBtn span {
  display: block;
  width: 16px;
  height: 16px;
  background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp");
  background-repeat: no-repeat;
  background-position: -256px -73px;
  transform: rotate(-90deg);
}
.listMoreBtn.open span {
  transform: rotate(90deg);
}

/* 주제별 칼럼 */

.subjectList .listWrap {
    font-size: 0;
    overflow: hidden;
}

.subjectList .list {
    box-sizing: border-box;
    float: left;
    width: 33.333%;
    padding: 0 0 40px;
    border-bottom: 1px solid var(--text-gray-300);
    position: relative;
    height: 179px;
}

.subjectList .list:first-child {
    padding-top: 0;
}

.subjectList .list a>div {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.subjectList .categoryTitle {
    padding-top: 40px;
    padding-right: 40px;
}

.subjectList .listWrap:nth-child(1) .list:nth-child(1),
.subjectList .listWrap:nth-child(1) .list:nth-child(2),
.subjectList .listWrap:nth-child(1) .list:nth-child(3) {
    height: 139px;
}

.subjectList .listWrap:nth-child(1) .list:nth-child(1) .categoryTitle,
.subjectList .listWrap:nth-child(1) .list:nth-child(2) .categoryTitle,
.subjectList .listWrap:nth-child(1) .list:nth-child(3) .categoryTitle {
    padding-top: 0;
}

.subjectList .categoryInfo {
    display: inline-block;
    padding-right: 20px;
    margin-right: 20px;
}

/* 기획연재 */
#slick-series {
    margin: 60px 0 100px;
    width: 1280px;
}

#slick-series .newsBox_row1 .articleContentWrap .articleTitle h2{
    width: 800px;
}

.border-b-0 {
    border-bottom: 0;
}

.photobox-list {
    margin: 32px 0 100px;
    display: flex;
    flex-wrap: wrap;
    gap: 40px;
}

.photobox-list li .photobox {
    width: 400px;
    position: relative;
}

.photobox-list li .photobox .articleImage {
    width: 400px;
    height: auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    border-radius: 12px;
    margin-bottom: 12px;
    overflow: hidden;
}

.photobox-list li .photobox .articleImage img {
    border-radius: 12px;
}

.photobox-list li .photobox .listBadge {
    position: absolute;
    top: 16px;
    left: 16px;
    ;
    display: block;
    padding: 4px 12px;
    border-radius: 4px;
    background: rgba(255, 255, 255, .9)
}

.last-list {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.last-list li {
    flex-shrink: 0;
    box-sizing: border-box;
    padding: 20px 0 20px 32px;
    border-radius: 50px;
    border: 1px solid var(--text-gray-400);
}

.last-list li:not(:last-child) a {
    display: flex;
    align-items: center;
    gap: 16px;
}

.last-list li div {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
}

.last-list li .arrow {
    opacity: 0;
    visibility: hidden;
}

.last-list li .arrow {
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -235px -230px;
    overflow: hidden;
    width: 19px;
    height: 14px;
}

.last-list li:hover {
    cursor: pointer;
    transition: all .3s;
    background: var(--text-gray-100);
    padding: 20px 32px 20px 32px;
}

.last-list li:hover .arrow {
    transition: all .3s;
    opacity: 1;
    visibility: visible;
}

.last-list li.moreListBtn {
    padding: 0;
    background: var(--text-gray-200);
}

.last-list li.moreListBtn div {
    padding: 20px 32px 20px 32px;
    ;
}

.moreListBtn .plus {
    margin-left: 8px;
    display: inline-block;
    width: 14px;
    height: 14px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -172px -230px;
}

.listHeader .showList {
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 12px;
}

.showList .icon {
    position: relative;
    display: block;
    width: 40px;
    height: 40px;
    border-radius: 20px;
    background: var(--text-gray-300);
}

.showList .icon:after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 24px;
    height: 24px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -131px -254px;
}

.showList .icon:hover {
    transition: all .3s;
    background: var(--text-gray-400);
}

/******* 오피니언 - 만평 *******/

.cartoonList .articleImage {
    width: 660px;
    border-radius: 12px;
    margin-bottom: 20px;
}

.cartoonList .articleImage img {
    border-radius: 12px;
}

.slick-disabled {
    opacity: 0.3;
}

.hideScroll {
    -ms-overflow-style: none;
    /* IE and Edge */
    scrollbar-width: none;
    /* Firefox */
}

.hideScroll::-webkit-scrollbar {
    display: none;
    /* Chrome, Safari, Opera*/
}

.moblie-footer {
    display: none;
}

.only-m {
    display: none;
}

.viewHeader-wrapper .adArea {
    display: none;
}

.m-hamburgerMenu-depth {
    display: none;
    z-index: 100000;
    position: fixed;
    width: 100%;
    height: 100vh;
    background: var(--text-white);
    overflow: hidden;
}

.m-hamburgerMenu-depth .scrollWrap {
    overflow-y: scroll;
    height: 100%;
}

.m-hamburgerMenu-depth .closeBtn {
    position: absolute;
    right: 18px;
    width: 24px;
    height: 24px;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat;
    background-position: -199px -225px;
}

.m-hamburgerMenu-top .layout-wrapper {
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 14px 18px 32px 19px;
    border-bottom: 1px solid var(--text-gray-300);
}

.m-hamburgerMenu-top .textInfo {
    width: 190px;
}

.m-hamburgerMenu-top .utilMenu {
    display: flex;
    justify-content: flex-start;
    gap: 20px;
}

.m-hamburgerMenu-top>.utilMenu a {
    display: flex;
    gap: 8px;
}

.m-hamburgerMenu-top>.utilMenu span {
    display: inline-block;
    width: 22px;
    height: 22px;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat var(--text-gray-100);
    background-position: -360px -288px;
    border-radius: 16px;
    vertical-align: top;
}

.m-hamburgerMenu-middle {
    padding: 24px 0 40px;
}

.m-hamburgerMenu-middle .inputSearch {
    width: 100%;
}

.m-hamburgerMenu-middle .sitemap {
    padding-top: 32px;
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.m-hamburgerMenu-middle .sitemap li {
    width: calc(50% - 10px);
}

.m-hamburgerMenu-bottom {
    padding: 40px 0 0;
}

.m-hamburgerMenu-bottom {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.m-hamburgerMenu-bottom .showListBtn {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 18px 8px 19px;

}

.m-hamburgerMenu-bottom .showListBtn span {
    display: block;
    width: 16px;
    height: 16px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -146px -228px;
    transform: rotate(-180deg);
}

.m-hamburgerMenu-bottom .depthList {
    display: none;
    flex-wrap: wrap;
    gap: 16px;
    padding: 20px 18px;
    background: var(--text-gray-100);
}

.m-hamburgerMenu-bottom .depthList.open {
    display: flex;
}

.m-hamburgerMenu-bottom .depthList li {
    width: calc(50% - 8px);
}

.m-hamburgerMenu-bottom .outLink {
    display: flex;
    gap: 8px;
    padding: 0 18px 8px 19px;
}

.m-hamburgerMenu-bottom .outLink span {
    display: block;
    width: 16px;
    height: 22px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -264px -226px;
}

.listPageTopBanner {
    width: 1280px;
    margin: 0 auto;
    padding: 75px 0 60px;
}

/* 404 page */
.page404 {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 130px;
    width: 100%;
    padding: 130px 0 180px;
    text-align: center;
}
.page404 .textWrap {
    display: flex;
    flex-direction: column;
    gap: 50px;
}

.page404 .textWrap .ErrorTitle {
    padding-top: 163px;
    background: url("https://img.seoul.co.kr/img/n24/404bg.webp") no-repeat center 0;
}

.page404 .buttonWrap {
    display: flex;
    justify-content: space-between;
    gap: 20px;
}

.page404 .buttonWrap div {
    box-sizing: border-box;
    border-radius: 12px;
    padding: 14px 40px;
    width: 290px;
}

.page404 .buttonWrap .goBackPageBtn {
    background: var(--text-gray-500);
}

.page404 .buttonWrap .goHomeBtn {
    background: var(--bg-primary-100);
}

/* 돋보기 */
.img-magnifier-container {
    max-width: 1000px;
    position: relative;
}

.img-magnifier-glass {
    position: absolute;
    border: 3px solid #000;
    border-radius: 12px;
    cursor: none;
    /*Set the size of the magnifier glass:*/
    width: 160px;
    height: 100px;
}

#slick-photoNews {
    /*padding-bottom: 42px;*/
	padding-bottom: 0;  /*0802*/ 
}

#slick-photoNews li.slick-slide {
    width: 300px;
}

#slick-photoNews li.slick-slide:nth-child(5) {
    border-bottom: 0;
}

/*--- 0802 ---*/
#slick-photoNews .owl-nav.disabled+.owl-dots {
  margin-top: 24px;
  height: 20px;
}


#slick-twig {
    /*padding-bottom: 40px;*/
    width: 300px;
	padding-bottom: 0; /*0802*/
}

#slick-twig.listPhoto-ul li:last-of-type .newsBox {
    padding: 16px 0;
    border-bottom: 1px solid var(--text-gray-300);
}

#slick-twig.listPhoto-ul div.slick-slide div:last-child li:last-of-type .newsBox {
    border-bottom: 0;
}

/* 0802 */
#slick-twig .owl-nav.disabled+.owl-dots {
  margin-top: 24px;
}

#slick-twig.listPhoto-ul .listBlock div:first-of-type .newsBox {
  padding-top: 0;
}

#slick-twig.listPhoto-ul .listBlock div:last-of-type .newsBox {
  border-bottom: 0;
}
/* ---- */


/* list page template */
/* imgS */
.imgS .sectionContentWrap {
    margin-top: 30px;
}

.imgS .newsBox_row1 {
    padding: 48px 0 50px;
}

.imgS .newsBox_row1:first-child {
    padding-top: 0;
}

.imgS .Box_row1 .articleContentWrap {
    justify-content: flex-start;
}

.imgS .newsBox_row1 .articleImage {
    width: 240px;
    height: 160px;
}

.imgS .articleContentWrap .articleTitle {
    margin-bottom: 5px;
}

.imgS .articleContentWrap .articleTitle h2 {
    margin: 0 0 7px;
}

.imgS .layoutTitle,
.imgS .calendar_wrap {
    padding-top: 0;
}

/* imgL */
.imgL .newsBox_row1 {
    gap: 20px;
    flex-direction: column;
}

.imgL .newsBox_row1 .articleImage {
    width: 660px;
    height: auto;
}

.imgL .newsBox_row1 .articleContentWrap .articleTitle h2 {
    margin-bottom: 0;
    font-size: 24px;
    font-weight: 700;
    line-height: 34px;
    letter-spacing: -0.24px;
}

.imgL .body16,
.imgL .ArticleInfo {
    display: none;
}

.imgL .newsBox_row1 .articleContentWrap .articleTitle .badge {
    display: none;
}

.imgL .layoutTitle,
.imgL .calendar_wrap {
    padding-top: 0;
}

.onlyImgL {
    display: none;
}

.pageListWrap.imgL .onlyImgL {
    display: block;
}

.pageListWrap .newsBox_row1 .articleContentWrap .articleTitle .badge {
    margin-bottom: 12px;
}

.imgNone .newsBox_row1 {
    display: block;
}

.imgNone .newsBox_row1 .articleImage {
    display: none;
}


/* ad */
.ad_row {
    width: 100%;
    margin: 32px 0;
    display: flex;
    align-items: center;
    gap: 30px;
}

.ad_row .adImage {
    flex-shrink: 0;
    width: 180px;
    height: 100%;
    border-radius: 12px;
    overflow: hidden;
}

.ad_row .adImage img {
    width: 100%;
    height: auto;
}

.adContentWrap {
    display: flex;
    flex-direction: column;
    gap: 12px;
    ;
}

/* imgL */
.ad_row.imgL {
    margin: 60px 0;
}

.ad_row.imgL .adImage {
    width: 260px;
    height: 168px;
}

.ad_row.imgL .adContentWrap>div {
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    white-space: normal;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ad_list{
    margin: 60px 0;
    width: 730px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: space-between;
}

.ad_list li{
    width: calc(50% - 30px);
    position: relative;
    text-indent: 15px;
}
.ad_list li:before {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 4px;
    height: 4px;
    background: var(--text-black, #111);
    border-radius: 6px;
}

/* PC 모바일 보기 버튼 추가 240507 */
.goMobile { width: 100%; padding: 32px 0; display: none; }
.goMobile div { box-sizing: border-box; display: flex; align-items: center; gap: 17px; justify-content: center; color: var(--bg-black, #000); text-align: center; font-size: 25px; font-weight: 700; line-height: 24px; letter-spacing: -0.25px; }
.goMobile div span { width: 28px; height: 36px; display: inline-block; background: url("https://img.seoul.co.kr/img/n24/goMobile.webp") no-repeat; background-position: 0 0; }

/* 파리 올림픽 */
.bg-paris { background: linear-gradient(247deg, #6C8FB0 6.68%, #1D737F 69.87%) }
.bg-paris .viewHeader-wrapper { border-bottom: 0; }
.bg-paris h1 { color: var(--text-white); }
.bg-paris .breadcrumb li { color: var(--text-white); }
.bg-paris .breadcrumb li:not(:last-child):after { background: var(--text-white); opacity: .8; }
.bg-paris .reporterInfo .name { color: var(--text-white); opacity: .8; }
.bg-paris .reporterInfo .dateInfo div { color: var(--text-white); opacity: .7; }
.bg-paris .reporter .reporterInfo .dateInfo div:first-child:after { background: var(--text-white); opacity: .7; }
.bg-paris .bottomSide .viewTool>li { background: rgba(255, 255, 255, 0.20) }
.bg-paris .bottomSide .viewTool li div.hideText { display: block; width: 40px; height: 40px; border-radius: 20px; background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat; overflow: hidden; }
.bg-paris .bottomSide .viewTool>li:nth-child(1) div.hideText { background-position: -481px -247px; }
.bg-paris .bottomSide .viewTool>li:nth-child(2) div.hideText { background-position: -349px -247px; }
.bg-paris .bottomSide .viewTool>li:nth-child(3) div.hideText { background-position: -435px -247px; }
.bg-paris .bottomSide .viewTool>li:nth-child(4) div.hideText { background-position: -393px -247px; }

/* newbr 추가 240814 */
.new_br { margin-top: 0; margin-bottom: -32px !important; }
.videoWrap.new_br { margin-top: 32px; }
.con_openLinkA.new_br .con_openLinkBox_H,
.con_openLinkA.new_br .con_openLinkBox_V { margin-top: 0; margin-bottom: 0; }
.con_snsBox.new_br > iframe { margin-bottom: 0 !important; }
.new_br + .byline { margin-top: 62px !important; }
.subTitle_s0, .subTitle_s2{margin-top:0px; margin-bottom:40px;}

/* copyright  관련 20241120*/
.byline {margin:30px 0; clear: both; }
.paperInfo {margin-top: 32px; clear: both; }
.articleCopyright {margin-top: 32px; clear: both; }


/*tts start*/

/*default reset*/	
.resetTTS .loadingIcon{display:none !important;}
.resetTTS .soundNewsButton{display:flex !important;}
.resetTTS .viewTool-soundNews{display:flex !important;}	


/*loading*/
.loadingTTS .loadingIcon{display:flex !important;}
.loadingTTS .viewTool-soundNews{display:none !important;}


/*play*/
.playTTS .loadingIcon{display:none !important;}
.playTTS .viewTool-soundNews{display:flex !important;padding: 0 12px !important;}

.playTTS .soundNewsButton {background-position: -485px -626px !important;}
.bg-primary .playTTS .soundNewsButton,
.bg-black .playTTS .soundNewsButton{		
	background-position: -442px -626px !important;
}

.playTTS .soundWave{
	display: block !important;
	background: url("https://img.seoul.co.kr/img/n24/tts-sound.webp") no-repeat center !important;
	background-size: contain !important;
}

.bg-primary .playTTS .soundWave,
.bg-black .playTTS .soundWave{
	background: url("https://img.seoul.co.kr/img/n24/tts-sound-w.webp") no-repeat center !important;		
	background-size: contain !important;
}
.playTTS .newsReplay{display:block !important;}



/*pause*/
.pauseTTS .loadingIcon{display:none !important; }
.pauseTTS .viewTool-soundNews{display:flex !important;padding: 0 12px !important;}	
.pauseTTS .soundNewsButton {background-position: -396px -626px !important;}
.pauseTTS .soundWave {
	display: block !important;
	background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp?v=1") no-repeat !important;
	background-position: -625px -633px !important;
	
}
.bg-primary .pauseTTS .soundWave,
.bg-black .pauseTTS .soundWave {
	background-position: -670px -633px !important;
}
.bg-primary .pauseTTS .soundNewsButton,
.bg-black .pauseTTS .soundNewsButton{		
	background-position: -353px -626px !important;
}
.pauseTTS .newsReplay{display:block !important;}






.bottomSide .viewTool>li {
	position: relative;
	background: 0;
}

.bottomSide .viewTool li.soundNews-button-wrap {
	cursor: inherit;
	display: block;
	width: 100%;
	background: var(--text-gray-200);
	padding: 0;
}

.bottomSide .viewTool li .loadingIcon {
	display: flex;
	width: 40px;
	height: 40px;
	background: url("https://img.seoul.co.kr/img/n24/loading-black.svg") no-repeat center;
}

.bottomSide .viewTool li div.viewTool-soundNews.hideText {
	transition: all .15s ease-in-out;
	display: none;
	width: auto;
	align-items: center;
	background: 0;
	gap: 4px;
}

.bottomSide .viewTool li div.soundNewsButton.hideText {
	cursor: pointer;
	border: 0;
	background: none;
	width: 40px;
	height: 40px;
	border-radius: 20px;
	background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp?v=1") no-repeat;
	background-position: -396px -626px;
}

.bottomSide .viewTool li div.soundWave {
	display: none;
	flex-shrink: 0;
	width: 24px;
	height: 24px;
	background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp?v=1") no-repeat;
	background-position: -625px -633px;
}

.bottomSide .viewTool li div.soundWave img {
	display: block;
}

.bottomSide .viewTool li div.newsReplay.hideText {
	cursor: pointer;
	display: none;
	width: 40px;
	height: 40px;
	border-radius: 20px;
	background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp?v=1") no-repeat;
	background-position: -573px -626px;
}

.bottomSide .viewTool li .viewTool-soundNews.layout {
	padding: 0 12px;
}

.bottomSide .viewTool li div.soundNewsButton.pause {
	background-position: -485px -626px;
}

.bottomSide .viewTool li div.soundWave.show {
	display: block;
	background: url("https://img.seoul.co.kr/img/n24/tts-sound.webp") no-repeat center;
	background-size: contain;
}


.bottomSide .viewTool li div.soundWave.on {
	display: block;
}


.bottomSide .viewTool li div.newsReplay.show {
	display: block;
}

.bottomSide .viewTool li div.newsReplay {
	display: block;
	width: 40px;
	height: 40px;
	border-radius: 20px;
	background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp?v=1") no-repeat;
	overflow: hidden;
}

.bottomSide .viewTool li.fontSize-button div.hideText {
	background-position: -303px -112px;
}

.bottomSide .viewTool li.print-button div.hideText {
	background-position: -353px -112px;
}

.bottomSide .viewTool li.share-button div.hideText {
	background-position: -403px -112px;
}

.bottomSide .viewTool li.reply-button div.hideText {
	background-position: -453px -112px;
}


 /* tts background icon */
.bg-primary .bottomSide .viewTool > li {
	position: relative;
	background: 0;
}

.bg-primary .bottomSide .viewTool li.soundNews-button-wrap,
.bg-black .bottomSide .viewTool li.soundNews-button-wrap {
	display: block;
	width: 100%;
	background: rgba(255, 255, 255, 0.20);
	padding: 0;
}

.bg-primary .bottomSide .viewTool li .loadingIcon,
.bg-black .bottomSide .viewTool li .loadingIcon {
	display: flex;
	width: 40px;
	height: 40px;
	background: url("https://img.seoul.co.kr/img/n24/loading-white.svg") no-repeat center;
}

.bg-primary .bottomSide .viewTool li div.viewTool-soundNews.hideText,
.bg-black .bottomSide .viewTool li div.viewTool-soundNews.hideText  {
	transition: all .15s ease-in-out;
	display: none;
	width: auto;
	align-items: center;
	background: 0;
	gap: 4px;
}

.bg-primary .bottomSide .viewTool li div.soundNewsButton.hideText,
.bg-black .bottomSide .viewTool li div.soundNewsButton.hideText {

	border: 0;
	background: none;
	width: 40px;
	height: 40px;
	border-radius: 20px;
	background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp?v=1") no-repeat;
	background-position: -353px -626px;
}

.bg-primary .bottomSide .viewTool li div.soundWave img,
.bg-black .bottomSide .viewTool li div.soundWave img {
	display: block;
}

.bg-primary .bottomSide .viewTool li div.newsReplay.hideText,
.bg-black .bottomSide .viewTool li div.newsReplay.hideText {
	display: none;
	width: 40px;
	height: 40px;
	border-radius: 20px;
	background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp?v=1") no-repeat;
	background-position: -530px -626px;
}

.bg-primary .bottomSide .viewTool li .viewTool-soundNews.layout,
.bg-black .bottomSide .viewTool li .viewTool-soundNews.layout {
	padding: 0 12px;
}

.bg-primary .bottomSide .viewTool li div.soundNewsButton.pause,
.bg-black .bottomSide .viewTool li div.soundNewsButton.pause {
	background-position: -442px -626px;
}

.bg-primary .bottomSide .viewTool li div.soundWave.show,
.bg-black .bottomSide .viewTool li div.soundWave.show {
	display: block;
	background: url("https://img.seoul.co.kr/img/n24/tts-sound-w.webp") no-repeat center;
	background-size: contain;
}

.bg-primary .bottomSide .viewTool li div.soundWave,
.bg-black .bottomSide .viewTool li div.soundWave {
	display: none;
	flex-shrink: 0;
	width: 24px;
	height: 24px;
	background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp?v=1") no-repeat;
	background-position: -670px -633px;
}

.bg-primary .bottomSide .viewTool li div.soundWave.on,
.bg-black .bottomSide .viewTool li div.soundWave.on {
	display: block;
}


.bg-primary .bottomSide .viewTool li div.newsReplay.show,
.bg-black .bottomSide .viewTool li div.newsReplay.show {
	display: block;
}

.bg-primary .bottomSide .viewTool li.fontSize-button div.hideText,
.bg-black .bottomSide .viewTool li.fontSize-button div.hideText {
	background-position: -529px -112px;
}

.bg-primary .bottomSide .viewTool li.print-button div.hideText,
.bg-black .bottomSide .viewTool li.print-button div.hideText {
	background-position: -579px -112px;
}

.bg-primary .bottomSide .viewTool li.share-button div.hideText ,
.bg-black .bottomSide .viewTool li.share-button div.hideText {
	background-position: -629px -112px;
}

.bg-primary .bottomSide .viewTool li.reply-button div.hideText,
.bg-black .bottomSide .viewTool li.reply-button div.hideText {
	background-position: -679px -112px;
}

.bg-black .bottomSide .viewTool>li {
	position: relative;
	background: 0;
}

.bg-black .bottomSide .viewTool li.fontSize-button div.hideText {
	background-position: -529px -112px;
}

.bg-black .bottomSide .viewTool li.print-button div.hideText {
	background-position: -579px -112px;
}

.bg-black .bottomSide .viewTool li.share-button div.hideText {
	background-position: -629px -112px;
}

.bg-black .bottomSide .viewTool li.reply-button div.hideText {
	background-position: -679px -112px;
}
/*tts end*/

/* 240905 유지보수 */
.owl-theme .owl-dots .owl-dot {
	pointer-events: none;
}


.photoNews .arrowBtnWrap {
	margin-top: 32px;
}

#slick-interractive li {
	width: 300px !important;
}

.topic .arrowBtnWrap {
	margin-top: 32px;
}

.twigArrowBtn,
.opinionArrowBtn {
	margin-top: 16px;
}

.arrowBtnWrap {
	position: relative;
	display: flex;
	justify-content: center;
}

.numcount span {
	vertical-align: text-bottom;
}

.owl-theme .owl-dots .owl-dot.active span,
.owl-theme .owl-dots .owl-dot:hover span {
	background: var(--bg-b-bg);
}

.owl-theme .owl-dots .owl-dot span {
	width: 8px;
	height: 8px;
	margin: 6px 6px;
	background: #BEBDBD;
}

.listSlideArrow .owl-prev {
	font-size: 0;
	border: 0;
	background: 0;
	cursor: pointer;
	position: absolute;
	z-index: 1;
	top: -3px;
	left: calc(50% - 56px);
	width: 30px;
	height: 30px;
}

.listSlideArrow .owl-prev::before {
	content: '';
	opacity: 1;
	position: absolute;
	top: 0;
	left: 0;
	background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp?ver=240905") no-repeat;
	background-size: 772px;
	background-position: -479px -49px;
	width: 30px;
	height: 30px;
}

.listSlideArrow .owl-next {
	font-size: 0;
	border: 0;
	background: 0;
	cursor: pointer;
	position: absolute;
	z-index: 1;
	top: -3px;
	transform: 0;
	left: auto;
	right: calc(50% - 56px);
	width: 30px;
	height: 30px;
}

.listSlideArrow .owl-next:before {
	content: '';
	opacity: 1;
	position: absolute;
	top: 0;
	left: 0;
	background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp?ver=240905") no-repeat;
	background-size: 772px;
	background-position: -512px -49px;
	width: 30px;
	height: 30px;
}
/*******************/

/********** 240925 **********/
/* 회원가입 모달창 추가 */
.alertModal.hide { display: none; }
.alertModal { z-index: 99999; box-sizing: border-box; /* position: absolute; */ position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); border-radius: 9px; background: var(--text-gray-300); box-shadow: 1px 1px 6px 0px rgba(0, 0, 0, 0.30); padding: 30px; width: 309px; max-width: 360px; display: flex; flex-direction: column; }
.alertModal.alertDim { width: 360px; }
.alertModal .closeWrap { cursor: pointer; display: flex; justify-content: flex-end; margin-bottom: 6px; }
.alertModal .closeBtn { width: 26px; height: 26px; background: url("https://img.seoul.co.kr/img/n24/seoulIconX2.webp") no-repeat; background-position: -198px -224px; background-size: 979px; }
.alertModal .modalContent { text-align: center; }
.alertModal .modalBtnWrap { margin-top: 30px; display: flex; justify-content: center; gap: 10px; }
.alertModal .modalBtn { border: 0; cursor: pointer; display: inline-block; padding: 4px 20px; border-radius: 6px; }
.alertModal .modalBtn.cancelBtn { background: var(--text-white); }
.alertModal .modalBtn.confirmBtn { background: var(--text-gray-500); }
.dim { z-index: 9999; content: ''; display: none; position: fixed; left: 0; top: 0; width: 100%; height: 100vh; background: rgba(0, 0, 0, .7); opacity: 1; }

/********** 241211 **********/
.liveVideo {
  z-index: 1000;
  position: fixed;
  top: calc(100% - 302px);
  left: calc(100% - 470px);
  width: 470px;
  border:1px solid #000;
}

.liveVideo .videoTitle {
  box-sizing: border-box;
  width: 100%;
  height: 38px;
  display: flex;
  align-items: center;
  background: #000;
  color: #fff;
  padding: 5px 4px 3px 11px;
}

.liveVideo .videoTitle .videoTitleBox::before {
  position: absolute;
  display: block;
  content: '';
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  width: 6px;
  height: 6px;
  border-radius: 8px;
  background: var(--etc-notice);
}

.liveVideo .videoTitle .videoTitleBox {
  position: relative;
  display: flex;
  gap: 4px;
  padding-left: 12px;
  width: calc(100% - 40px);
}

.liveVideo .videoTitle .liveBadge {
  display: block;
}

.liveVideo .videoTitle .videoTit {
  padding-top: 2px;
}

.liveVideo .videoTitle .closeBtn {
  cursor: pointer;
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp");
  background-position: -199px -225px;
}

/* 250415 프로모션 배너 관련 추가 */
.bottomBanner .owl-carousel {
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.bottomBanner .owl-item {
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.5s ease-in-out;
}

@keyframes slideOutUp {
    0% {
        transform: translateY(0);
    }

    100% {
        transform: translateY(-100%);
    }
}

@keyframes slideInUp {
    0% {
        transform: translateY(100%);
    }

    100% {
        transform: translateY(0);
    }
}

.owl-item.out {
    animation: slideOutUp 0.5s forwards;
}

.owl-item.in {
    animation: slideInUp 0.5s forwards;
}

.bottomBanner .content {
    position: relative;
    max-width: 1280px;
    margin: 0 auto;
}

.bottomBanner .closeBtn {
    z-index: 10;
    cursor: pointer;
    position: absolute;
    display: block;
    width: 32px;
    height: 32px;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp?ver=002") no-repeat;
    background-position: -314px -221px;
}

.bannerImage img {
    margin: 0 auto;
}

/* 광고영역 웹표준 추가 */
.alternating-thumbnails-c .syndicatedItem .branding,
.alternating-thumbnails-b .syndicatedItem .branding,
.alternating-blend-next-up-b .syndicatedItem .branding {
	color: #666 !important;
}
.listpage-topNews .articleImage img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    margin: auto;
}


.listpage-topNews .articleContent {
    margin: 24px 0;
}

.listpage-topNews:before {
    position: absolute;
    display: block;
    content: '';
    bottom: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background: var(--bg-b-bg);
    border-radius: 20px;
}

.ArticleInfo {
    display: flex;
    gap: 24px;
}

.ArticleInfo span:first-child {
    position: relative;
}

.ArticleInfo span:first-child:after {
    content: '';
    position: absolute;
    display: block;
    top: 50%;
    transform: translateY(-50%);
    right: -12px;
    width: 1px;
    height: 12px;
    background: var(--text-gray-700);
}

.listPhoto-ul li .newsBox {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 0;
    border-bottom: 1px solid var(--text-gray-300);
}

.listPhoto-ul li:last-of-type .newsBox {
    border-bottom: 0;
    padding-bottom: 0;
}

.listPhoto-ul .newsBox .articleTitle {
    width: 202px;
}

.listPhoto-ul .newsBox .articleImage {
    display: flex;
    border-radius: 100px;
    align-items: center;
    width: 64px;
    height: 64px;
    box-sizing: border-box;
    overflow: hidden;
}

.listPhoto-ul.circle .newsBox .articleImage {
    border-radius: 100px;
}


/* pagenation */
.pagination {
    margin-top: 100px;
    display: flex;
    justify-content: center;
}

.pagination ul {
    display: flex;
    gap: 4px;
}

.pagination ul li {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 32px;
    height: 32px;
    cursor: pointer;
}

.pagination ul li.pagePrevBtn a,
.pagination ul li.pageNextBtn a {
    text-indent: -9999px;
    font-size: 0;
    color: transparent;
    width: 24px;
    height: 24px;
}


.pagination ul li.pagePrevBtn {
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    margin-right: 12px;
    background-position: -248px -64px;
}

.pagination ul li.pageNextBtn {
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    margin-left: 12px;
    background-position: -290px -64px;
}

.pagination ul li.presentPage {
    background: var(--bg-b-bg);
    border-radius: 8px;
    color: var(--text-white);
}

.goTopBtn {
    cursor: pointer;
    position: fixed;
    bottom: 70px;
    right: 24px;
    width: 50px;
    height: 50px;
    border-radius: 12px;
    text-indent: -9999px;
    color: transparent;
    font-size: 0;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp");
    background-repeat: no-repeat;
    background-position: -452px -56px;
    display: none;
}


.blankList {
    width: 100%;
    padding: 100px 0 0;
    height: 274px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: url("https://img.seoul.co.kr/img/n24/logo_bgIcon_L.png") no-repeat center;
}

.modal {
    display: none;
    position: fixed;
    z-index: 9999;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow-y: auto;
    background-color: rgba(0, 0, 0, 0.3);
}

.modal::-webkit-scrollbar {
    display: none;
}

.modal {
    -ms-overflow-style: none;
    scrollbar-width: none;
    /* 파이어폭스 */
}

.modal_content {
    position: relative;
    margin: 5% 0;
    top: 0;
    left: 50%;
    transform: translate(-50%, 0);
    width: 100%;
    max-width: 1000px;
    height: auto;
    /* max-height: 666px; */
    border-radius: 10px;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    box-shadow: 0px 4px 30px 0px rgba(0, 0, 0, 0.25);
}

.modal_content img {
    border-radius: 10px;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.modal .btnWrap {
    z-index: 1000;
    position: absolute;
    display: flex;
    flex-direction: column;
    gap: 8px;
    top: 24px;
    right: 24px;
}

.modal .btnWrap .close {
    position: relative;
    display: block;
    transition: 0.3s;
    width: 26px;
    height: 26px;
    padding: 7px;
    background: rgba(38, 35, 35, 0.60);
    border-radius: 8px;
}

.modal .close:after {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(45deg);
    width: 2px;
    height: 20px;
    border-radius: 3px;
    background: var(--text-white);
}

.modal .close::before {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(-45deg);
    width: 2px;
    height: 20px;
    border-radius: 3px;
    background: var(--text-white);
}

.modal .btnWrap .magnifier {
    position: relative;
    display: block;
    transition: 0.3s;
    width: 26px;
    height: 26px;
    padding: 7px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: 10px -246px;
    background-color: rgba(38, 35, 35, 0.60);
    border-radius: 8px;
}

.modal .btnWrap span:hover,
.modal .btnWrap span:focus {
    color: #bbb;
    text-decoration: none;
    cursor: pointer;
}

.modal-textWrap {
    background: var(--text-white);
    padding: 12px 20px;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}


.modal-has-opened {
    overflow: hidden;
    padding-right: 17px !important;
}


/****************** view page *****************/

.viewpage-header.mobile-header .header-wrap {
    padding: 20px 18px 20px 19px;
}

.viewpage-header div.logoImage {
    width: 105px;
    height: 20px;
    background: url("https://img.seoul.co.kr/img/n24/logo_fixed.png") no-repeat;
    background-size: contain;
}

.viewpage-header.mobile-header .rightSide {
    flex-direction: row-reverse;
    gap: 16px;
}

.viewHeader-wrapper {
    padding-top: 64px;
}

.viewHeader-wrapper .adArea {
    width: 100%;
    height: 50px;
    background: var(--text-gray-500);
    display: flex;
    justify-content: center;
    align-items: center;
    color: var(--text-white, #FFF);
    font-size: 12px;
    font-weight: 700;
    line-height: 24px;
    letter-spacing: -0.24px;
}

.bg-black .breadcrumb ol {
    font-size: 14px;
    font-weight: 700;
    line-height: 24px;
    letter-spacing: -0.14px;
}

.viewPageLayout {
    display: flex;
    justify-content: space-between;
    margin-bottom: 200px;
}

.viewHeader {
    position: absolute;
    left: 0;
    width: 100%;
}

/* article view header style -- bg color primary */
.bg-primary {
    background: var(--bg-primary-100);
}

.bg-primary .viewHeader-wrapper {
    border-bottom: 0;
}

.bg-primary .breadcrumb ol {
    color: var(--text-white);
}

.bg-primary .breadcrumb li:not(:last-child):after {
    background: rgba(255, 255, 255, .8);
}

.bg-primary h1 {
    color: var(--text-white);
}

.bg-primary .reporterInfo .name {
    color: rgba(255, 255, 255, .8);
}

.bg-primary .reporterInfo .dateInfo>div {
    color: var(--text-gray-300);
    opacity: .7;
}

.bottomSide .viewTool li div.hideText {
    display: block;
    width: 40px;
    height: 40px;
    border-radius: 20px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    overflow: hidden;
}

.bg-primary .bottomSide .viewTool>li {
    background: rgba(255, 255, 255, 0.20);
}

.bg-primary .bottomSide .viewTool>li:nth-child(1) div.hideText {
    background-position: -481px -247px;
}

.bg-primary .bottomSide .viewTool>li:nth-child(2) div.hideText {
    background-position: -349px -247px;
}

.bg-primary .bottomSide .viewTool>li:nth-child(3) div.hideText {
    background-position: -435px -247px;
}

.bg-primary .bottomSide .viewTool>li:nth-child(4) div.hideText {
    background-position: -393px -247px;
}


/* article view header style -- bg color black */
.bg-black {
    background: var(--bg-b-bg);
}

/* 241016 jhr add css :: start */
    .bg-black .focusArticle .articleTitle3 {
        color: #fff;
    }

    .bg-black #slick-onLineSpecial .articleTitle {
        color: #fff;
    }

    .bg-black #slick-onLineSpecial:after {
        background: linear-gradient(90deg, rgb(255 255 255 / 0%) 40%, rgba(38, 35, 35, 1) 84%, rgba(38, 35, 35, 1) 100%);
    }

    .special-template .arrowBtnWrap {
        position: unset;
    }
/* 241016 jhr add css :: end */

.bg-black .viewHeader-wrapper {
    border-bottom: 0;
}

.bg-black .breadcrumb ol {
    color: var(--text-white);
}

.bg-black .breadcrumb li:not(:last-child):after {
    background: rgba(255, 255, 255, .8);
}

.bg-black h1 {
    color: var(--text-white);
}

.bg-black .reporterInfo .name {
    color: rgba(255, 255, 255, .8);
}

.bg-black .reporterInfo .dateInfo>div {
    color: var(--text-gray-300);
    opacity: .7;
}

.bg-primary .reporter .reporterInfo .dateInfo div:first-child:after {
    content: '';
    position: absolute;
    display: block;
    top: 50%;
    transform: translateY(-50%);
    right: -5px;
    width: 1px;
    height: 10px;
    background: var(--text-gray-300);
    opacity: .7;
}

.bg-black .bottomSide .viewTool>li {
    background: rgba(255, 255, 255, 0.20);
}

.bg-black .bottomSide .viewTool>li:nth-child(1) div.hideText {
    background-position: -481px -247px;
}

.bg-black .bottomSide .viewTool>li:nth-child(2) div.hideText {
    background-position: -349px -247px;
}

.bg-black .bottomSide .viewTool>li:nth-child(3) div.hideText {
    background-position: -435px -247px;
}

.bg-black .bottomSide .viewTool>li:nth-child(4) div.hideText {
    background-position: -393px -247px;
}

.bg-primary .bottomSide .viewTool>li.open,
.bg-black .bottomSide .viewTool>li.open {
    background: rgba(255, 255, 255, 0.40);
}


/* header bg-vote */
.bg-vote {
    /*background-color: var(--text-gray-700);*/
    background-color: #8266BD;
}

.bg-vote .viewHeader-wrapper {
    border-bottom: 0;
}

.bg-vote .breadcrumb li {
    color: var(--text-white);
}

.bg-vote .breadcrumb li:not(:last-child):after {
    background-color: var(--text-white);
    opacity: .8;
}

.bg-vote h1 {
    color: var(--text-white);
}

.bg-vote .header-bottom:after {
    background: var(--text-white);
}

.bg-vote .reporterInfo div {
    color: var(--text-white);
}

.bg-vote .reporterInfo .name {
    opacity: .8;
}

.bg-vote .reporterInfo .dateInfo {
    opacity: .7;
}

.bg-vote .utilBtn {
    background: var(--text-gray-700);
    color: var(--text-white)
}

.bg-vote .utilBtn.newsLetterBtn {
    background: var(--text-white);
    color: var(--text-black);
}

.bg-vote .utilBtn .loginBlock>a:first-child:after {
    background: var(--text-white)
}

.bg-vote .nav-searchBtn {
    background-position: 0 -120px;
}

.bg-vote .utilMenu .newsLetterBtn span {
    background-position: -95px -126px;
}

.bg-vote .nav-menuList {
    color: var(--text-white);
}

.bg-vote .showMoreBtn {
    box-shadow: 0;
}

.bg-vote .bottomSide .viewTool>li {
    background-color: rgba(255, 255, 255, .2);
}

.bg-vote .bottomSide .viewTool>li:nth-child(1) div.hideText {
    background-position: -481px -247px;
}

.bg-vote .bottomSide .viewTool>li:nth-child(2) div.hideText {
    background-position: -349px -247px;
}

.bg-vote .bottomSide .viewTool>li:nth-child(3) div.hideText {
    background-position: -435px -247px;
}

.bg-vote .bottomSide .viewTool>li:nth-child(4) div.hideText {
    background-position: -392px -247px;
}



/***********************************/


.viewHeader-wrapper {
    display: flex;
    flex-direction: column;
    gap: 61px;
    padding: 80px 0 36px;
    border-bottom: 1px solid var(--text-gray-300);
}

.breadcrumb ol {
    display: flex;
    gap: 16px;
    margin-bottom: 12px;
}

.breadcrumb li {
    position: relative;
    flex-shrink: 0;
}

.breadcrumb li:not(:last-child):after {
    position: absolute;
    top: 50%;
    right: -10px;
    transform: translateY(-50%);
    content: '';
    display: block;
    width: 3px;
    height: 3px;
    background: var(--text-gray-500);
    border-radius: 10px;
}

.viewHeader-wrapper .bottomSide {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.reporter {
    display: flex;
    gap: 12px;
}

.reporter .image {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 30px;
    background-color: var(--text-gray-300);
    box-sizing: border-box;
    overflow: hidden;
}

.reporter .reporterInfo .dateInfo {
    display: flex;
    gap: 9px;
}

.reporter .reporterInfo .dateInfo div:first-child {
    position: relative;
}

.reporter .reporterInfo .dateInfo div:first-child:after {
    content: '';
    position: absolute;
    display: block;
    top: 50%;
    transform: translateY(-50%);
    right: -5px;
    width: 1px;
    height: 10px;
    background: var(--text-gray-700);
}

.bottomSide .viewTool {
    display: flex;
    gap: 12px;
}

.bottomSide .viewTool>li {
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 40px;
    background: var(--text-gray-200);
    border-radius: 20px;
}

.bottomSide .viewTool>li.open {
    background: var(--text-gray-300);
}

.bottomSide .viewTool>li:nth-child(1) {
    position: relative;
}

.bottomSide .viewTool>li:nth-child(2) {
    background-position: -135px -246px;
}

.bottomSide .viewTool>li:nth-child(3) {
    position: relative;
    background-position: -135px -246px;
}

.bottomSide .viewTool>li:nth-child(4) {
    position: relative;
    background-position: -135px -246px;
}

.bottomSide .viewTool>li:nth-child(1) div.hideText {
    background-position: -211px -247px;
}

.bottomSide .viewTool>li:nth-child(2) div.hideText {
    background-position: -35px -247px;
}

.bottomSide .viewTool>li:nth-child(3) div.hideText {
    background-position: -164px -247px;
}

.bottomSide .viewTool>li:nth-child(4) div.hideText {
    background-position: -78px -247px;
}

.bottomSide .viewTool .replyNum {
    position: absolute;
    top: 2px;
    right: -2px;
    display: block;
    background: var(--etc-notice);
    border-radius: 20px;
    padding: 0 5px;
}

.bottomSide .viewToolPopup {
    display: none;
    z-index: 10;
    position: absolute;
    top: 48px;
    left: 0;
    background: var(--text-white);
    border-radius: 8px;
    border: 1px solid var(--text-gray-300);
    padding: 20px 20px 30px;
    width: 272px;
    height: 208px;
    box-sizing: border-box;
}

.popupBox .popupHeader {
    display: flex;
    justify-content: space-between;
}

.nav-wrap .viewTool li div.popupBox div.hideText.closePopup,
.bottomSide .viewTool li div.popupBox div.hideText.closePopup {
    cursor: pointer;
    width: 26px;
    height: 26px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -198px -224px;
}

.bottomSide .viewToolPopup .popContent {
    margin: 12px 0 20px;
}

.bottomSide .viewToolPopup .fontSizeList {
    display: flex;
    justify-content: space-between;
}

.bottomSide .viewToolPopup .fontSizeList li {
    width: 40px;
    height: 40px;
    border-radius: 20px;
    border: 1px solid var(--text-gray-300);
    color: var(--text-gray-600);
}

.bottomSide .viewToolPopup .fontSizeList li div {
    width: 40px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
}

.bottomSide .viewToolPopup .fontSizeList li.pick {
    color: var(--text-black);
    background: var(--text-gray-100);
}

.snsSharePopupBox {
    cursor: default;
    z-index: 10;
    position: absolute;
    display: none;
    top: 48px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--text-white);
    border-radius: 8px;
    border: 1px solid var(--text-gray-300);
    padding: 20px 20px 30px;
    width: 324px;
    height: 320px;
    box-sizing: border-box;
}

.snsSharePopupBox .snsShareList {
    padding: 16px 0 24px 10px;
    display: flex;
    flex-wrap: wrap;
    gap: 16px 24px;
}

.snsSharePopupBox .snsShareList li {
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    width: 72px;
    height: 72px;
}

.snsSharePopupBox .snsShareList li .snsBtn {
    width: 40px;
    height: 40px;
    background-repeat: no-repeat;
    margin: 0 auto 8px;

}

.snsSharePopupBox .snsShareList li:nth-child(1) .snsBtn {
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp");
    background-position: -353px -287px;
}

.snsSharePopupBox .snsShareList li:nth-child(2) .snsBtn {
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp");
    background-position: -253px -287px;
}

.snsSharePopupBox .snsShareList li:nth-child(3) .snsBtn {
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp");
    background-position: -153px -287px;
}


.snsSharePopupBox .snsShareList li:nth-child(4) .snsBtn {
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp");
    background-position: -103px -287px;
}

.snsSharePopupBox .snsShareList li:nth-child(5) .snsBtn {
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp");
    background-position: -303px -287px;
}

.snsSharePopupBox .snsShareList li .snsTit {
    flex-shrink: 0;
}

.snsSharePopupBox .linkCopy {
    display: flex;
}

.snsSharePopupBox .linkCopy .linkArea {
    flex-shrink: 0;
    width: 191px;
    padding: 10px 8px 10px 12px;
    border-top-left-radius: 8px;
    border-bottom-left-radius: 8px;
    border: 1px solid var(--text-gray-400);
    border-right: 0;
}

.snsSharePopupBox .linkCopy .copyBtn {
    cursor: pointer;
    flex-shrink: 0;
    display: block;
    padding: 8px 10px;
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
    border: 1px solid var(--text-gray-400);
    background: var(--text-gray-200);
}


.viewLayout,
.viewContentWrap {
    display: flex;
    width: 778px;
    justify-content: center;
    flex-direction: column;
    align-items: center;
}

.viewRightSide {
    width: 300px;
    margin-top: 308px;
    padding: 64px 0 60px;
}

.viewRightSide section {
    margin: 100px 0;
}

.viewRightSide section:nth-child(1) {
    margin: 0;
}

.viewContentWrap {
    padding-top: 308px;
}

/* .viewContentWrap br {
    content: "";
    display: block;
    font-size: 100%;
    height: 16px;
} */

.width730 {
    width: 730px;
    padding: 0 24px;
}

.viewContent {
    padding: 64px 0 60px;
    width: 730px;
}

.viewContent .subTitle {
    padding-right: 20px;
    margin-bottom: 60px;

}

.stit {
    padding-right: 20px;
    margin-bottom: 60px;
    color: var(--text-black, #111);
    font-family: Pretendard;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 34px;
    letter-spacing: -0.24px;
}

.expendImageWrap {
    position: relative;
    padding: 8px 0;
    margin: 0 auto;
    width: min-content;
}

.expendImageBtn {
    z-index: 100;
    cursor: pointer;
    position: absolute;
    top: 20px;
    right: 12px;
    width: 40px;
    height: 40px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat rgba(38, 35, 35, 0.60);
    background-position: 10px -246px;
    border-radius: 8px;
}

.viewImage {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    border-radius: 12px;
}

.viewImage.viewTable { border-radius: 0; }

/* 
.viewImageWrap.small {
    padding: 8px 92px;
}

.viewImageWrap {
    margin: 32px 0;
}

.viewImageWrap .viewImageText {
    margin-top: 8px;
}

.viewImageWrap .viewImageTitle {
    display: inline-block;
}

.viewContent .paragraph {
    margin-bottom: 32px;
} */

.viewContent .adWrap {
    padding: 32px 0;
}

.viewContent .ad {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 250px;
    background: var(--text-gray-500);
}

/* 포토그룹 확대 */
.expendPhotoGroup {
    z-index: 99999;
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    overflow: hidden;
    background: var(--bg-b-bg);
}

.expendPhotoGroup .close {
    z-index: 10;
    cursor: pointer;
    position: absolute;
    top: 31px;
    right: 31px;
    width: 27px;
    height: 27px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -429px -294px;
}

.expendPhotoGroup.on {
    display: block;
}

.expendPhotoGroup .photoGroup {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 100%;
    height: 100%;
    margin-bottom: 0;
    background: 0;
    padding: 0;
}

.expendPhotoGroup .photoList {
    position: relative;
    display: flex;
    justify-content: center;
    border-radius: 8px;
    margin-top: 136px;
}

#slick-expendPhotoGroup {
    box-sizing: border-box;
    width: 830px;
}

#slick-expendPhotoGroup .slick-list {
    border-radius: 8px;
}

#slick-expendPhotoGroup li {
    width: 830px;
    height: 552px;
}

#slick-expendPhotoGroup li .articleImage {
    width: 830px;
    height: 552px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    overflow: hidden;
}

#slick-expendPhotoGroup li .articleImage picture {
    position: relative;
}

#slick-expendPhotoGroup li .articleImage img {
    display: block;
    width: auto;
    height: 100%;
    border-radius: 8px;
}


#slick-expendPhotoGroup li .articleImage picture::before {
    content: '';
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 165px;
    background: linear-gradient(180deg, rgba(17, 17, 17, 0.00) 0%, rgba(17, 17, 17, 0.70) 95%);
}


.photoGroup .photoContents {
    padding: 32px 40px 12px;
}

.expendPhotoGroup .thumbList {
    position: relative;
    display: flex;
    justify-content: center;
    padding: 16px 36px 8px;
    background: 0
}

#slick-expendPhotoGroup-thumb {
    width: 100%;
}

#slick-expendPhotoGroup-thumb .slick-list {
    border-radius: 8px;
}

#slick-expendPhotoGroup-thumb li {
    margin-right: 7px;
    cursor: pointer;
}

#slick-expendPhotoGroup-thumb li .thumbImage {
    position: relative;
    width: 87px;
    height: 87px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    overflow: hidden;
}

#slick-expendPhotoGroup-thumb .slick-current .thumbImage:after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(0deg, rgba(242, 105, 48, 0.20) 0%, rgba(242, 105, 48, 0.20) 100%);
}

#slick-expendPhotoGroup-thumb li .thumbImage img {
    height: 100%;
    width: auto;
    border-radius: 8px;
}

#slick-expendPhotoGroup-thumb .slick-current .thumbImage {
    box-sizing: border-box;
    border: 3px solid var(--bg-primary-100);
    border-radius: 11px;
}

#expendPhotoGroup-prevArrow {
    left: 20px;
}

#expendPhotoGroup-nextArrow {
    right: 20px;
}


.photoGroupWrap {
    padding: 10px 0;
}

.photoGroup {
    position: relative;
    width: 100%;
    background: var(--text-gray-100);
    padding-top: 40px;
    margin: 32px 0;
}

.expandImageBtn {
    position: absolute;
    top: 0;
    right: 0;
    cursor: pointer;
    display: flex;
    width: 40px;
    height: 40px;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: var(--text-gray-200);
}

.expandImageBtn span {
    display: block;
    box-sizing: border-box;
    width: 17px;
    height: 17px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -402px -298px;
}

.photoList {
    position: relative;
    display: flex;
    justify-content: center;
    border-radius: 8px;
}

#slick-photoGroup {
    box-sizing: border-box;
    width: 610px;
}

#slick-photoGroup .slick-list {
    border-radius: 8px;
}

#slick-photoGroup li {
    width: 610px;
    height: 407px;
}

#slick-photoGroup li .articleImage {
    width: 610px;
    height: 407px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    overflow: hidden;
}

#slick-photoGroup li .articleImage img {
    width: auto;
    height: 100%;
    border-radius: 8px;
}

.photoGroup .photoContents {
    padding: 32px 40px 12px;
}


.thumbList {
    position: relative;
    display: flex;
    justify-content: center;
    padding: 14px 36px;
    background: var(--text-gray-300);
}

#slick-photoGroup-thumb {
    width: 100%;
}

#slick-photoGroup-thumb .slick-list {
    border-radius: 8px;
}

#slick-photoGroup-thumb li {
    margin-right: 7px;
    cursor: pointer;
}

#slick-photoGroup-thumb li .thumbImage {
    width: 126px;
    height: 126px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    overflow: hidden;
}

#slick-photoGroup-thumb li .thumbImage img {
    height: 100%;
    width: auto;
    border-radius: 8px;
}

#slick-photoGroup-thumb .slick-current .thumbImage {
    position: relative;
    box-sizing: border-box;
    border: 3px solid var(--bg-primary-100);
    border-radius: 11px;
}

#slick-photoGroup-thumb .slick-current .thumbImage:after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(0deg, rgba(242, 105, 48, 0.20) 0%, rgba(242, 105, 48, 0.20) 100%);
}

.photoGroup-prevArrow {
    cursor: pointer;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    transition: all .3s;
    width: 50px;
    height: 50px;
}

.photoGroup-nextArrow {
    cursor: pointer;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: auto;
    right: 0;
    width: 50px;
    height: 50px;
}

.photoGroup-prevArrow:before {
    content: '';
    opacity: 1;
    position: absolute;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat center;
    background-position: -392px -56px;
    transform: rotate(-180deg);
    width: 50px;
    height: 50px;
}

.photoGroup-nextArrow:before {
    content: '';
    opacity: 1;
    position: absolute;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat center;
    background-position: -392px -56px;
    width: 50px;
    height: 50px;
}

.ug-thumb-wrapper {
    cursor: pointer;
}

.ug-thumb-wrapper.ug-thumb-selected {
    position: relative;
    /* border:3px solid #f26930!important; */
}

.ug-thumb-wrapper.ug-thumb-selected:after {
    z-index: 100;
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(0deg, rgba(242, 105, 48, 0.20) 0%, rgba(242, 105, 48, 0.20) 100%);
}

.photoThumb-prevArrow {
    cursor: pointer;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    transition: all .3s;
    width: 32px;
    height: 32px;
}

.photoThumb-nextArrow {
    cursor: pointer;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: auto;
    right: 0;
    width: 32px;
    height: 32px;
}

.photoThumb-prevArrow:before {
    content: '';
    opacity: 1;
    position: absolute;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat center;
    background-position: -249px -66px;
    width: 32px;
    height: 32px;
}

.photoThumb-nextArrow:before {
    content: '';
    opacity: 1;
    position: absolute;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat center;
    background-position: -291px -66px;
    width: 32px;
    height: 32px;
}

/*  ug-gallery */
.ug-gallery-wrapper .ug-textpanel-description {
    font-size: 14px;
    color: var(--text-gray-700) !important;
    text-align: left;
    z-index: 3;
}

.ug-gallery-wrapper.ug-theme-grid.ug-under-780 .ug-slider-wrapper {
    background: var(--text-gray-100) !important;
}

.ug-gallery-wrapper.ug-theme-grid.ug-under-780 .ug-strip-panel {
    background: var(--text-gray-300) !important;
}

.ug-gallery-wrapper.ug-under-780 .ug-textpanel-title {
    font-size: 16px;
    color: var(--text-gray-700);
    line-height: 26px;
}

.ug-under-780 .ug-button-fullscreen.ug-skin-default {
    position: relative;
    top: 0;
    left: auto;
    right: 0;
    cursor: pointer;
    display: flex;
    width: 40px;
    height: 40px;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background-image: none;
    background-color: var(--text-gray-200);
}

.ug-under-780 .ug-button-fullscreen.ug-skin-default {
    position: relative;
    top: 0 !important;
    left: auto !important;
    right: 0 !important;
    cursor: pointer;
    display: flex;
    width: 40px;
    height: 40px;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background-image: none;
}

.ug-under-780 .ug-button-fullscreen.ug-skin-default:after {
    content: '';
    position: absolute;
    display: block;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -402px -298px;
    box-sizing: border-box;
    width: 17px;
    height: 17px;
}

.ug-gallery-wrapper .ug-slider-wrapper {
    background: var(--bg-b-bg);
}

.ug-gallery-wrapper .ug-strip-panel {
    background: var(--bg-b-bg);
}

.ug-gallery-wrapper .ug-textpanel-title {
    color: var(--text-gray-700);
    font-size: 18px;
}

.ug-button-fullscreen.ug-skin-default {
    position: relative;
    top: 24px;
    left: auto;
    right: 24px;
    cursor: pointer;
    display: flex;
    width: 40px;
    height: 40px;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background-image: none;
}

.ug-button-fullscreen.ug-skin-default:after {
    content: '';
    position: absolute;
    display: block;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") -429px -293px no-repeat;
    box-sizing: border-box;
    width: 27px;
    height: 27px;
}

.ug-arrow-left.ug-skin-default {
    width: 50px;
    height: 50px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -392px -56px;
    transform: rotate(-180deg);
}

.ug-arrow-right.ug-skin-default {
    width: 50px;
    height: 50px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -392px -56px;
}

.ug-arrow-left.ug-skin-default.ug-arrow-hover,
.ug-arrow-right.ug-skin-default.ug-arrow-hover {
    background-position: -392px -56px;
}

.ug-strip-panel .ug-strip-arrow-left.ug-skin-default,
.ug-strip-panel .ug-strip-arrow-right.ug-skin-default {
    width: 32px;
    height: 32px;
}

.ug-strip-panel .ug-strip-arrow.ug-strip-arrow-left.ug-skin-default .ug-strip-arrow-tip {
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat;
    background-position: -249px -66px;
    width: 32px;
    height: 32px;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%);
    opacity: 1;
}

.ug-strip-panel .ug-strip-arrow.ug-strip-arrow-right.ug-skin-default .ug-strip-arrow-tip {
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat;
    background-position: -291px -66px;
    width: 32px;
    height: 32px;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%);
    opacity: 1;
}

.ug-strip-panel .ug-strip-arrow-left.ug-skin-default.ug-button-disabled .ug-strip-arrow-tip {
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat;
    background-position: -249px -66px;
    width: 32px;
    height: 32px;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%);
    opacity: .5;
}

.ug-strip-panel .ug-strip-arrow-right.ug-skin-default.ug-button-disabled .ug-strip-arrow-tip {
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat;
    background-position: -291px -66px;
    width: 32px;
    height: 32px;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%);
    opacity: .5;
}

.ug-gallery-wrapper.ug-under-780 .ug-textpanel-description {
    line-height: 24px;
}

.ug-gallery-wrapper.ug-under-780 .ug-thumbs-strip {
    top: 14px !important;
}

.ug-gallery-wrapper.ug-under-780 .ug-strip-panel {
    height: 152px !important;
}

.v_photoarea {
    clear: both;
    text-align: center;
    max-width: 780px;
    margin: 32px 0;
}

.v_photoarea_L {
    float: left;
    text-align: center;
    max-width: 780px;
    margin-bottom: 20px;
    margin-right: 20px;
}

.v_photoarea_R {
    float: right;
    text-align: center;
    max-width: 780px;
    margin-bottom: 20px;
    margin-left: 20px;
}

.v_photo .expendImageWrap>figure {
    position: relative;
    display: inline-block;
}

.v_photo .expendImageWrap>figure>img {
    max-width: 730px;
    width: auto;
}

/* figure > .viewImage width값을 expendImageWrap 로 지정 */

.v_photo_caption {
    text-align: left;
    padding-top: 8px;

    color: var(--text-gray-700);
    font-family: Pretendard;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    /* 171.429% */
    letter-spacing: -0.14px;
}

.v_photo_caption strong.viewImageTitle {
    color: var(--text-gray-700);
    font-family: Pretendard;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 26px;
    letter-spacing: -0.16px;
}

.v_photo {
    /*position:relative;*/
    margin: 0 auto;
}

.v_photo img {
    margin: 0 auto;
}

.subTitle_s0 {
    /* margin: 32px 0 0 0;*/  /*20240312 jjw 정현용부장 요청 */ 
    padding-bottom: 20px;
    border-bottom: 1px solid var(--text-black);
    display: block;
    color: var(--text-black);
    font-family: Pretendard;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    letter-spacing: -0.2px;
}

.subTitle_s2 {
    display: block;
    color: var(--text-black);
    font-family: Pretendard;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    letter-spacing: -0.2px;
    padding-left: 20px;
    border-left: 4px solid var(--bg-primary-100);
    margin-top: 20px;
    margin-bottom: 32px;
}

.con_quotation_01 {
    margin: 32px 0;
    position: relative;
    padding: 32px 0 8px;
    color: var(--text-black);
    font-family: Pretendard;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    letter-spacing: -0.2px;
}

.con_quotation_01::before {
    content: '';
    font-size: 0;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 24px;
    height: 17px;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat;
    background-position: -185px -199px;
}

.con_quotation_span {
    display: block;
    color: var(--text-gray-500);
    font-family: Pretendard;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    letter-spacing: -0.14px;
    padding: 8px 0 0;
}

.con_quotation_03 {
    box-sizing: border-box;
    border-radius: 0;
    width: auto;
    left: auto;
    top: auto;
    background: none;
    border: 0;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 32px 0;
    text-align: center;
    padding: 40px 0;
    color: var(--text-black);
    font-family: Pretendard;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    letter-spacing: -0.2px;
}

.con_quotation_03::before {
    content: '';
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    width: 40px;
    height: 40px;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat;
    background-position: -1px -287px;
}

.con_quotation_03::after {
    content: '';
    position: absolute;
    display: block;
    bottom: 0;
    right: 0;
    width: 40px;
    height: 40px;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat;
    background-position: -1px -287px;
    transform: rotate(-180deg);
}

.con_quotation_03 .con_quotation_span {
    padding-top: 12px;
}

.rowAd {
    display: flex;
    gap: 32px;
}

.rowAd .ad {
    width: 300px;
    height: 250px;
    flex-shrink: 0;
    margin: 0;
}

article .textbox {
    border-radius: 12px;
    padding: 32px;
    margin-bottom: 32px;
}

.con_textbox_01 {
    min-height: auto;
    color: var(--text-gray-700);
    font-family: Pretendard;
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 32px;
    letter-spacing: -0.18px;
    padding: 32px;
    margin: 32px;
    border: 0;
    border-radius: 12px;
    background-color: var(--text-gray-200);
}

.con_textbox_02 {
    min-height: auto;
    color: var(--text-gray-700);
    font-family: Pretendard;
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 32px;
    letter-spacing: -0.18px;
    padding: 32px;
    margin: 32px;
    border: 0;
    border-radius: 12px;
    background: rgba(232, 240, 249, 1);
}


.con_textbox_03 {
    min-height: auto;
    color: var(--text-gray-700);
    font-family: Pretendard;
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 32px;
    letter-spacing: -0.18px;
    padding: 32px;
    margin: 32px;
    border: 0;
    border-radius: 12px;
    background: rgba(240, 248, 239, 1);
}

.con_textbox_04 {
    min-height: auto;
    color: var(--text-gray-700);
    font-family: Pretendard;
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 32px;
    letter-spacing: -0.18px;
    padding: 32px;
    margin: 32px;
    border: 0;
    border-radius: 12px;
    background: rgba(240, 248, 239, 1);
    background: rgba(249, 245, 219, 1);
}

.con_textbox_05 {
    min-height: auto;
    color: var(--text-gray-700);
    font-family: Pretendard;
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 32px;
    letter-spacing: -0.18px;
    padding: 32px;
    margin: 32px;
    border: 0;
    border-radius: 12px;
    background: rgba(240, 248, 239, 1);
    background: rgba(249, 237, 231, 1);
}


.con_hr_01 {
    border-bottom: 4px solid var(--text-black);
    margin-bottom: 40px;
}

.con_hr_02 {
    border-bottom: 2px solid var(--text-black);
    margin-bottom: 40px;
}

.con_hr_03 {
    border-bottom: 1px solid var(--text-gray-300);
    margin-bottom: 40px;
}

.con_hr_04 {
    border-top: 1px solid var(--text-gray-500);
    border-bottom: 1px solid var(--text-gray-500);
    border-left: 0;
    border-right: 0;
    padding-bottom: 3px;
    margin-bottom: 40px;
}

article table {
    margin: 64px 0;
}

article table thead th,
article table tbody td {
    padding: 16px 24px;
    border: 1px solid var(--text-gray-400);
}

.articleBranchNews {
    margin-top: 24px;
    height: 64px;
    overflow: hidden;
}

.articleBranchNews.open {
    height: 100%;
    overflow: none;
}

.articleBranchNews .branchNewsList li:not(:first-child) {
    padding-top: 8px;
}

.articleBranchNews .branchNewsList li {
    position: relative;
    text-indent: 12px;
}

.articleBranchNews .branchNewsList li:before {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 4px;
    height: 4px;
    background: var(--text-black, #111);
    border-radius: 6px;
}

.showMorBranch {
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 4px;
    padding: 16px 12px;
    text-align: center;
}

.showMorBranch span.arrow {
    display: block;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -150px -232px;
    width: 10px;
    height: 9px;
}

.showMorBranch.open span.arrow {
    background-position: -150px -232px;
    transform: rotate(-180deg);
}

.articleKeyword {
    border-top: 1px solid var(--text-gray-300);
    padding-top: 32px;
}

.articleKeyword ul {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.articleKeyword ul li {
    padding: 4px 16px;
    background-color: var(--text-gray-100);
    border-radius: 30px;
    flex-shrink: 0;
}

.articleBottomAD {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 778px;
    /*height: 125px;*/
    /*background: var(--text-gray-500);*/
    margin: 60px 0;
}

.articleBottomNews {
    margin: 60px 0;
}

.articleBottomList {
    padding-top: 40px;
    display: flex;
    gap: 40px 20px;
    flex-wrap: wrap;
}

.articleBottomList li {
    width: 230px;
    flex-shrink: 0;
}

.articleBottomList li .articleImage {
    width: 230x;
    border-radius: 12px;
    overflow: hidden;
}

.articleBottomList li .articleImage img {
    border-radius: 12px;
}

.articleBottomList li h3 {
    padding: 12px 10px 0 0;
}

.listAD ul {
    display: flex;
    flex-direction: column;
}

.listAD ul li {
    padding-right: 20px;
    padding-top: 12px;
    padding-bottom: 12px;
}

.listAD ul li:not(:last-child) {
    border-bottom: 1px solid var(--text-gray-300);
}

.listAD ul li:last-child {
    padding-bottom: 0;
}

/* 기사 공유하기 */
.con_openLinkBox_V .con_openLinkThumb {
    display: flex;
    justify-content: center;
    align-items: center;
}

.con_openLinkBox_V .con_openLinkThumb img {
    max-width: 510px;
    max-height: 268px;
    border-top-right-radius: 12px;
    border-top-left-radius: 12px;
    border-bottom: 1px solid var(--text-gray-300);
}

.con_openLinkBox_V .con_openLinkTitle {
    color: var(--text-black);
    font-family: Pretendard;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 28px;
    letter-spacing: -0.16px;
    text-align: left;
    padding: 12px 20px 0;
    max-width: 510px;
    margin: 0 auto;
}

.con_openLinkBox_V .con_openLinkSummery {
    color: var(--text-gray-600);
    font-family: Pretendard;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    letter-spacing: -0.14px;
    text-align: left;
    word-break: break-all;
    padding: 4px 20px 0;
    max-width: 510px;
    margin: 0 auto;
}

.con_openLinkBox_V .con_openLinkHost {
    color: var(--text-gray-500);
    font-family: Pretendard;
    font-size: 13px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px;
    letter-spacing: -0.13px;
    padding: 8px 20px 16px;
    text-align: left;
    max-width: 510px;
    margin: 0 auto;
}

.con_openLinkBox_V {
    text-align: center;
    border: 1px solid var(--text-gray-300);
    border-radius: 12px;
    max-width: 510px;
    margin: 32px auto;
    cursor: pointer;
    padding: 0;
    text-decoration: none;
}

.con_openLinkBox_H {
    display: flex;
    justify-content: center;
    text-align: center;
    /* max-width: 510px; */ /*정연호부장 요청*/
    margin: auto;
    cursor: pointer;
    text-decoration: none;
}

.con_openLinkBox_H .con_content {
    display: flex;
    border: 1px solid var(--text-gray-300);
    border-radius: 12px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-left: 0;
    padding: 0 20px 0;
    flex-direction: column;
    justify-content: center;
    max-width: 510px;
}

.con_openLinkBox_H .con_openLinkThumb {
    flex-shrink: 0;
    width: 110px;
    height: 110px;
    border-top-left-radius: 8px;
    border-bottom-left-radius: 8px;
    overflow: hidden;
    float: none;
}

.con_openLinkBox_H .con_openLinkThumb img {
    border-top-left-radius: 8px;
    border-bottom-left-radius: 8px;
    max-width: 110px;
    max-height: 110px;
}

.con_openLinkBox_H .con_openLinkTitle {
    color: var(--text-black);
    font-family: Pretendard;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 28px;
    letter-spacing: -0.16px;
    text-align: left;
}

.con_openLinkBox_H .con_openLinkSummery {
    color: var(--text-gray-600);
    font-family: Pretendard;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    letter-spacing: -0.14px;
    text-align: left;
    word-break: break-all;
}

.con_openLinkBox_H .con_openLinkHost {
    color: var(--text-gray-500);
    font-family: Pretendard;
    font-size: 13px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px;
    letter-spacing: -0.13px;
    text-align: left;
}

/* 가로형 링크 수정 240814 */
.con_openLinkA { display: block; }
.con_openLinkBox_H { overflow: hidden; border: 1px solid #eee; box-sizing: border-box; border-radius: 12px; display: block; cursor: pointer; text-decoration: none; margin-bottom: 8px; }
.con_openLinkBox_H .con_openLinkThumb,
.con_openLinkBox_H .con_openLinkTitle,
.con_openLinkBox_H .con_openLinkSummery,
.con_openLinkBox_H .con_openLinkHost { float: left; }
.con_openLinkBox_H .con_openLinkTitle,
.con_openLinkBox_H .con_openLinkSummery,
.con_openLinkBox_H .con_openLinkHost { width: calc(100% - 150px); padding: 0 20px; }
.con_openLinkBox_H .con_openLinkThumb { position: relative; }
.con_openLinkBox_H .con_openLinkThumb img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; margin: auto; }
.con_openLinkBox_H .con_openLinkTitle { padding-top: 6px; }
.con_openLinkBox_H .con_openLinkSummery { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; white-space: normal; }
.con_openLinkBox_H .con_openLinkHost { padding-top: 4px; }

/* 지도 */
.con_googleMap {
    width: 730px;
    height: 417px;
    border-radius: 12px;
    background: var(--text-gray-100);
    overflow: hidden;
    margin: 32px 0;
    text-align: center;
}

article .videoWrap {
    width: 730px;
    height: 411px;
    border-radius: 12px;
    background: var(--text-gray-100);
    overflow: hidden;
}


.fixedBottom {
    display: none;
    position: fixed;
    z-index: 100;
    bottom: 0;
    left: 0;
    width: 100%;
    background: var(--bg-b-bg);
    box-shadow: none;
}


/* 회원가입-로그인 배너 */

.joinBanner {
    padding: 14px 0;
    position: relative;
}

/*
.joinBanner .bannerBtn {
    cursor: pointer;
    position: absolute;
    right: 0;
    top: -5px;
    width: 32px;
    height: 32px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -60px -221px;
}
*/

.joinBanner .content {
    position: relative;
    width: 1280px;
    margin: 0 auto;
}

.joinBanner .bannerBtn {
    cursor: pointer;
    position: absolute;
    z-index: 10;
    right: 0;
    top: -10px;
    width: 44px;
    height: 44px;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat;
    background-position: -189px -216px;
    filter: brightness(203%);
}

.joinBanner div {
    text-align: center;
    font-size: 17px;
    font-weight: 700;
    line-height: 22px;
    letter-spacing: -0.17px;
}

.bottomBanner>div {
    position: relative;
    width: 1280px;
    margin: 0 auto;
    text-align: center;
}

.bottomBanner .seoulLogo {
    display: inline-block;
    vertical-align: bottom;
    width: 71px;
    height: 22px;
    overflow: hidden;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat;
    background-position: -351px -196px;
}

.loginBanner {
    padding: 40px 0 50px;
    display: none;
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
}

.dim {
    z-index: 0;
    content: '';
    display: none;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100vh;
    background: var(--bg-b-bg);
    opacity: .3;
}

.loginBanner .bottomBanner .bannerBtn {
    cursor: pointer;
    position: absolute;
    right: 0;
    top: -5px;
    width: 32px;
    height: 32px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -1px -9px;
    transform: rotate(-90deg);
}

.loginBanner .bottomBanner .bannerBtn:hover {
    background-position: -213px -9px;
}

.loginBanner .logoin-layout {
    width: 340px;
    margin: 0 auto;
}

.loginBanner .loginForm {
    margin-top: 30px;
}

.loginBanner .loginForm input[type="text"] {
    box-sizing: border-box;
    width: 100%;
    border: 1px solid var(--text-gray-300);
    background: var(--text-white);
    padding: 12px 20px;
    border-radius: 4px;
}

.loginForm input::placeholder {
    color: var(--text-gray-500);
}

.loginBanner .loginForm input:first-child {
    margin-bottom: 4px;
}

.loginUtil {
    margin: 16px 0 40px;
    display: flex;
    justify-content: center;
    gap: 0 32px;
}

.loginUtil li {
    position: relative;
}

.loginUtil li:not(:last-child):after {
    content: '';
    position: absolute;
    display: block;
    top: 50%;
    transform: translateY(-50%);
    right: -16px;
    width: 1px;
    height: 10px;
    background: var(--text-gray-400);
}

.loginBanner .loginBtn {
    cursor: pointer;
    margin-top: 24px;
    padding: 14px 40px;
    width: 100%;
    background: var(--text-black);
    border: 0;
    border-radius: 100px;
}

.socialLoginBtn>.socialLoginTitle {
    position: relative;
    text-align: center;
}

.socialLoginBtn>.socialLoginTitle span {
    position: relative;
    z-index: 1;
    display: inline-block;
    background: var(--text-white);
    padding: 0 8px;
	font-weight: 700;
}

.socialLoginBtn>.socialLoginTitle:after {
    z-index: 0;
    content: '';
    position: absolute;
    display: block;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    right: -16px;
    width: 100%;
    height: 1px;
    background: var(--text-gray-400);
}

.socialLoginBtn ul {
    margin-top: 24px;
    display: flex;
    justify-content: center;
    gap: 24px;
}

.socialLoginBtn ul li div {
    cursor: pointer;
    width: 40px;
    height: 40px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
}

.socialLoginBtn ul li:nth-child(1) a div {
    background-position: -253px -287px;
}

.socialLoginBtn ul li:nth-child(2) a div {
    background-position: -103px -287px;
}

.socialLoginBtn ul li:nth-child(3) a div {
    background-position: -353px -287px;
}

.socialLoginBtn ul li:nth-child(4) a div {
    width: 42px;
    height: 42px;
    background-position: -51px -286px;
}


/* 오피니언 */
.opinion-top {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 40px;
}

.opinion-top .topBox {
    display: flex;
    justify-content: space-between;
}

.opinion-top .leftSide {
    box-sizing: border-box;
    width: 50%;
    padding: 30px 21px 30px 32px;
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
    background: var(--text-gray-100);
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 50px;
}

.opinion-top .leftSide {
    position: relative;
}

.opinion-top .leftSide:after {
    position: absolute;
    content: '';
    display: block;
    bottom: 22px;
    right: 42px;
    width: 60px;
    height: 87px;
    background: url("https://img.seoul.co.kr/img/n24/seoulLogo/opinion-bg.webp") no-repeat;
    background-size: contain;
}

.opinion-top .articleInfo {
    display: flex;
    gap: 20px;
    margin-bottom: 20px;
}

.opinion-top .articleInfo>div:nth-child(1) {
    position: relative;
    padding-left: 15px;
}

.opinion-top .articleInfo>div:nth-child(1):before {
    position: absolute;
    content: '';
    display: block;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    width: 8px;
    height: 12px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -148px -201px
}

.opinion-top .articleInfo>div:nth-child(1):after {
    position: absolute;
    display: block;
    content: '';
    top: 50%;
    right: -12px;
    transform: translateY(-50%);
    width: 4px;
    height: 4px;
    border-radius: 5px;
    background: rgba(217, 217, 217, 1);
}

.opinion-top .rightSide {
    width: 50%;
}

.opinion-top .rightSide .articleImage {
    width: 100%;
    box-sizing: border-box;
    height: 268px;
    display: flex;
    align-items: center;
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
    overflow: hidden;
    background: var(--text-gray-100);
    justify-content: flex-end;
    text-align: right;
}

.opinion-top .rightSide .articleImage img {
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
}

.opinion-top .rightSide .topList li {
    width: 240px;
    padding: 20px 0;
    border-bottom: 1px solid var(--text-gray-300);
}

.opinion-top .rightSide .topList li:first-child {
    padding-top: 0;
}

.opinion-top .rightSide .topList li:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.opinion-top .bottomList ul {
    display: flex;
    gap: 40px;
}

.opinion-top .bottomList ul li {
    width: 400px;
}

.opinion-top .bottomList .articleInfo {
    margin-bottom: 8px;
}


/* 기자별 칼럼 */
.opinionList section {
    margin: 100px 0 0;
}

.opinionList section:first-child {
    margin-top: 0
}

.todayEditorial {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    /* gap: 20px; */
}

.todayEditorial li {
    width: 50%;
}
.todayEditorial li:nth-child(1) .editorial,
.todayEditorial li:nth-child(2) .editorial{
    padding-top:0;
}

.todayEditorial li:nth-last-child(1) .editorial,
.todayEditorial li:nth-last-child(2) .editorial{
    border-bottom: 0;
    padding-bottom: 0;
}

.todayEditorial li:nth-child(odd) .editorial {
    padding-right: 28px;
}

.todayEditorial li:nth-child(even) .editorial {
    padding-left: 28px;
}

.todayEditorial .editorial {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid var(--text-gray-300);
    padding: 32px 0;
}

.todayEditorial .editorial>div:nth-child(1) {
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    gap: 4px;
    max-width: 283px;
}

.todayEditorial .editorial>div:nth-child(1) h2 {
    margin-bottom: 0;
}

.todayEditorial .editorial .expertImage {
    flex-shrink: 0;
    width: 87px;
    height: 87px;
    border-radius: 60px;
    overflow: hidden;
    background: var(--text-gray-500);
}

.reporterList {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.reporterList li {
    width: 195px;
    position: relative;
}

.reporterList .back {
    position: absolute;
    top: 0;
    left: 0;
}

.reporterList .front {
    position: relative;
    box-sizing: border-box;
}

.reporterList .front .reporterImage {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    border-radius: 12px;
    overflow: hidden;
}

.reporterList .front .reporterImage img {
    border-radius: 12px;
}

.reporterList .reporterName {
    z-index: 10;
    top: 16px;
    left: 16px;
    position: absolute;
    padding: 4px 16px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.80);
}

.reporterList .back {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    border-radius: 12px;
    background: var(--text-gray-200);
    padding: 38px 17px 38px 18px;
    opacity: 0;
}

.reporterList .back:after {
    content: '';
    display: block;
    position: absolute;
    top: 30px;
    right: 30px;
    width: 70px;
    height: 102px;
    background: url("https://img.seoul.co.kr/img/n24/seoulLogo/report-bg.webp") no-repeat;
}

.reporterList li:hover .reporterImage {
    transition: all .25s;
    opacity: 0;
    z-index: -1;
}

.reporterList li:hover .reporterName {
    transition: all .25s;
    opacity: 0;
    z-index: -1;
}

.reporterList li:hover .back {
    transition: all .25s;
    opacity: 1;
}


/* 전문가별 칼럼 */

.expertList {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.expertList li {
    width: 195px;
    background: var(--text-gray-100);
    border-radius: 12px;
}

.expertList .expertBox {
    width: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding: 17px 0;
}

.expertList .expertBox .expertImage {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 120px;
    height: 120px;
    border-radius: 60px;
    overflow: hidden;
    background: var(--text-gray-300);
}

.expertList .expertBox .expertImage img {
    border-radius: 20px;
}

.expertList .expertBox .expertInfo {
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0 8px;
}
.expertList li.hide { display: none; }
.listMoreBtn {
  cursor: pointer;
  width: 300px;
  margin: 40px auto 0;
  padding: 8px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 6px;
}
.listMoreBtn span {
  display: block;
  width: 16px;
  height: 16px;
  background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp");
  background-repeat: no-repeat;
  background-position: -256px -73px;
  transform: rotate(-90deg);
}
.listMoreBtn.open span {
  transform: rotate(90deg);
}

/* 주제별 칼럼 */

.subjectList .listWrap {
    font-size: 0;
    overflow: hidden;
}

.subjectList .list {
    box-sizing: border-box;
    float: left;
    width: 33.333%;
    padding: 0 0 40px;
    border-bottom: 1px solid var(--text-gray-300);
    position: relative;
    height: 179px;
}

.subjectList .list:first-child {
    padding-top: 0;
}

.subjectList .list a>div {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.subjectList .categoryTitle {
    padding-top: 40px;
    padding-right: 40px;
}

.subjectList .listWrap:nth-child(1) .list:nth-child(1),
.subjectList .listWrap:nth-child(1) .list:nth-child(2),
.subjectList .listWrap:nth-child(1) .list:nth-child(3) {
    height: 139px;
}

.subjectList .listWrap:nth-child(1) .list:nth-child(1) .categoryTitle,
.subjectList .listWrap:nth-child(1) .list:nth-child(2) .categoryTitle,
.subjectList .listWrap:nth-child(1) .list:nth-child(3) .categoryTitle {
    padding-top: 0;
}

.subjectList .categoryInfo {
    display: inline-block;
    padding-right: 20px;
    margin-right: 20px;
}

/* 기획연재 */
#slick-series {
    margin: 60px 0 100px;
    width: 1280px;
}

#slick-series .newsBox_row1 .articleContentWrap .articleTitle h2{
    width: 800px;
}

.border-b-0 {
    border-bottom: 0;
}

.photobox-list {
    margin: 32px 0 100px;
    display: flex;
    flex-wrap: wrap;
    gap: 40px;
}

.photobox-list li .photobox {
    width: 400px;
    position: relative;
}

.photobox-list li .photobox .articleImage {
    width: 400px;
    height: auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    border-radius: 12px;
    margin-bottom: 12px;
    overflow: hidden;
}

.photobox-list li .photobox .articleImage img {
    border-radius: 12px;
}

.photobox-list li .photobox .listBadge {
    position: absolute;
    top: 16px;
    left: 16px;
    ;
    display: block;
    padding: 4px 12px;
    border-radius: 4px;
    background: rgba(255, 255, 255, .9)
}

.last-list {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.last-list li {
    flex-shrink: 0;
    box-sizing: border-box;
    padding: 20px 0 20px 32px;
    border-radius: 50px;
    border: 1px solid var(--text-gray-400);
}

.last-list li:not(:last-child) a {
    display: flex;
    align-items: center;
    gap: 16px;
}

.last-list li div {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
}

.last-list li .arrow {
    opacity: 0;
    visibility: hidden;
}

.last-list li .arrow {
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -235px -230px;
    overflow: hidden;
    width: 19px;
    height: 14px;
}

.last-list li:hover {
    cursor: pointer;
    transition: all .3s;
    background: var(--text-gray-100);
    padding: 20px 32px 20px 32px;
}

.last-list li:hover .arrow {
    transition: all .3s;
    opacity: 1;
    visibility: visible;
}

.last-list li.moreListBtn {
    padding: 0;
    background: var(--text-gray-200);
}

.last-list li.moreListBtn div {
    padding: 20px 32px 20px 32px;
    ;
}

.moreListBtn .plus {
    margin-left: 8px;
    display: inline-block;
    width: 14px;
    height: 14px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -172px -230px;
}

.listHeader .showList {
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 12px;
}

.showList .icon {
    position: relative;
    display: block;
    width: 40px;
    height: 40px;
    border-radius: 20px;
    background: var(--text-gray-300);
}

.showList .icon:after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 24px;
    height: 24px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -131px -254px;
}

.showList .icon:hover {
    transition: all .3s;
    background: var(--text-gray-400);
}

/******* 오피니언 - 만평 *******/

.cartoonList .articleImage {
    width: 660px;
    border-radius: 12px;
    margin-bottom: 20px;
}

.cartoonList .articleImage img {
    border-radius: 12px;
}

.slick-disabled {
    opacity: 0.3;
}

.hideScroll {
    -ms-overflow-style: none;
    /* IE and Edge */
    scrollbar-width: none;
    /* Firefox */
}

.hideScroll::-webkit-scrollbar {
    display: none;
    /* Chrome, Safari, Opera*/
}

.moblie-footer {
    display: none;
}

.only-m {
    display: none;
}

.viewHeader-wrapper .adArea {
    display: none;
}

.m-hamburgerMenu-depth {
    display: none;
    z-index: 100000;
    position: fixed;
    width: 100%;
    height: 100vh;
    background: var(--text-white);
    overflow: hidden;
}

.m-hamburgerMenu-depth .scrollWrap {
    overflow-y: scroll;
    height: 100%;
}

.m-hamburgerMenu-depth .closeBtn {
    position: absolute;
    right: 18px;
    width: 24px;
    height: 24px;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat;
    background-position: -199px -225px;
}

.m-hamburgerMenu-top .layout-wrapper {
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 14px 18px 32px 19px;
    border-bottom: 1px solid var(--text-gray-300);
}

.m-hamburgerMenu-top .textInfo {
    width: 190px;
}

.m-hamburgerMenu-top .utilMenu {
    display: flex;
    justify-content: flex-start;
    gap: 20px;
}

.m-hamburgerMenu-top>.utilMenu a {
    display: flex;
    gap: 8px;
}

.m-hamburgerMenu-top>.utilMenu span {
    display: inline-block;
    width: 22px;
    height: 22px;
    background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat var(--text-gray-100);
    background-position: -360px -288px;
    border-radius: 16px;
    vertical-align: top;
}

.m-hamburgerMenu-middle {
    padding: 24px 0 40px;
}

.m-hamburgerMenu-middle .inputSearch {
    width: 100%;
}

.m-hamburgerMenu-middle .sitemap {
    padding-top: 32px;
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.m-hamburgerMenu-middle .sitemap li {
    width: calc(50% - 10px);
}

.m-hamburgerMenu-bottom {
    padding: 40px 0 0;
}

.m-hamburgerMenu-bottom {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.m-hamburgerMenu-bottom .showListBtn {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 18px 8px 19px;

}

.m-hamburgerMenu-bottom .showListBtn span {
    display: block;
    width: 16px;
    height: 16px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -146px -228px;
    transform: rotate(-180deg);
}

.m-hamburgerMenu-bottom .depthList {
    display: none;
    flex-wrap: wrap;
    gap: 16px;
    padding: 20px 18px;
    background: var(--text-gray-100);
}

.m-hamburgerMenu-bottom .depthList.open {
    display: flex;
}

.m-hamburgerMenu-bottom .depthList li {
    width: calc(50% - 8px);
}

.m-hamburgerMenu-bottom .outLink {
    display: flex;
    gap: 8px;
    padding: 0 18px 8px 19px;
}

.m-hamburgerMenu-bottom .outLink span {
    display: block;
    width: 16px;
    height: 22px;
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp") no-repeat;
    background-position: -264px -226px;
}

.listPageTopBanner {
    width: 1280px;
    margin: 0 auto;
    padding: 75px 0 60px;
}

/* 404 page */
.page404 {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 130px;
    width: 100%;
    padding: 130px 0 180px;
    text-align: center;
}
.page404 .textWrap {
    display: flex;
    flex-direction: column;
    gap: 50px;
}

.page404 .textWrap .ErrorTitle {
    padding-top: 163px;
    background: url("https://img.seoul.co.kr/img/n24/404bg.webp") no-repeat center 0;
}

.page404 .buttonWrap {
    display: flex;
    justify-content: space-between;
    gap: 20px;
}

.page404 .buttonWrap div {
    box-sizing: border-box;
    border-radius: 12px;
    padding: 14px 40px;
    width: 290px;
}

.page404 .buttonWrap .goBackPageBtn {
    background: var(--text-gray-500);
}

.page404 .buttonWrap .goHomeBtn {
    background: var(--bg-primary-100);
}

/* 돋보기 */
.img-magnifier-container {
    max-width: 1000px;
    position: relative;
}

.img-magnifier-glass {
    position: absolute;
    border: 3px solid #000;
    border-radius: 12px;
    cursor: none;
    /*Set the size of the magnifier glass:*/
    width: 160px;
    height: 100px;
}

#slick-photoNews {
    /*padding-bottom: 42px;*/
	padding-bottom: 0;  /*0802*/ 
}

#slick-photoNews li.slick-slide {
    width: 300px;
}

#slick-photoNews li.slick-slide:nth-child(5) {
    border-bottom: 0;
}

/*--- 0802 ---*/
#slick-photoNews .owl-nav.disabled+.owl-dots {
  margin-top: 24px;
  height: 20px;
}


#slick-twig {
    /*padding-bottom: 40px;*/
    width: 300px;
	padding-bottom: 0; /*0802*/
}

#slick-twig.listPhoto-ul li:last-of-type .newsBox {
    padding: 16px 0;
    border-bottom: 1px solid var(--text-gray-300);
}

#slick-twig.listPhoto-ul div.slick-slide div:last-child li:last-of-type .newsBox {
    border-bottom: 0;
}

/* 0802 */
#slick-twig .owl-nav.disabled+.owl-dots {
  margin-top: 24px;
}

#slick-twig.listPhoto-ul .listBlock div:first-of-type .newsBox {
  padding-top: 0;
}

#slick-twig.listPhoto-ul .listBlock div:last-of-type .newsBox {
  border-bottom: 0;
}
/* ---- */


/* list page template */
/* imgS */
.imgS .sectionContentWrap {
    margin-top: 30px;
}

.imgS .newsBox_row1 {
    padding: 48px 0 50px;
}

.imgS .newsBox_row1:first-child {
    padding-top: 0;
}

.imgS .Box_row1 .articleContentWrap {
    justify-content: flex-start;
}

.imgS .newsBox_row1 .articleImage {
    width: 240px;
    height: 160px;
}

.imgS .articleContentWrap .articleTitle {
    margin-bottom: 5px;
}

.imgS .articleContentWrap .articleTitle h2 {
    margin: 0 0 7px;
}

.imgS .layoutTitle,
.imgS .calendar_wrap {
    padding-top: 0;
}

/* imgL */
.imgL .newsBox_row1 {
    gap: 20px;
    flex-direction: column;
}

.imgL .newsBox_row1 .articleImage {
    width: 660px;
    height: auto;
}

.imgL .newsBox_row1 .articleContentWrap .articleTitle h2 {
    margin-bottom: 0;
    font-size: 24px;
    font-weight: 700;
    line-height: 34px;
    letter-spacing: -0.24px;
}

.imgL .body16,
.imgL .ArticleInfo {
    display: none;
}

.imgL .newsBox_row1 .articleContentWrap .articleTitle .badge {
    display: none;
}

.imgL .layoutTitle,
.imgL .calendar_wrap {
    padding-top: 0;
}

.onlyImgL {
    display: none;
}

.pageListWrap.imgL .onlyImgL {
    display: block;
}

.pageListWrap .newsBox_row1 .articleContentWrap .articleTitle .badge {
    margin-bottom: 12px;
}

.imgNone .newsBox_row1 {
    display: block;
}

.imgNone .newsBox_row1 .articleImage {
    display: none;
}


/* ad */
.ad_row {
    width: 100%;
    margin: 32px 0;
    display: flex;
    align-items: center;
    gap: 30px;
}

.ad_row .adImage {
    flex-shrink: 0;
    width: 180px;
    height: 100%;
    border-radius: 12px;
    overflow: hidden;
}

.ad_row .adImage img {
    width: 100%;
    height: auto;
}

.adContentWrap {
    display: flex;
    flex-direction: column;
    gap: 12px;
    ;
}

/* imgL */
.ad_row.imgL {
    margin: 60px 0;
}

.ad_row.imgL .adImage {
    width: 260px;
    height: 168px;
}

.ad_row.imgL .adContentWrap>div {
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    white-space: normal;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ad_list{
    margin: 60px 0;
    width: 730px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: space-between;
}

.ad_list li{
    width: calc(50% - 30px);
    position: relative;
    text-indent: 15px;
}
.ad_list li:before {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 4px;
    height: 4px;
    background: var(--text-black, #111);
    border-radius: 6px;
}

/* PC 모바일 보기 버튼 추가 240507 */
.goMobile { width: 100%; padding: 32px 0; display: none; }
.goMobile div { box-sizing: border-box; display: flex; align-items: center; gap: 17px; justify-content: center; color: var(--bg-black, #000); text-align: center; font-size: 25px; font-weight: 700; line-height: 24px; letter-spacing: -0.25px; }
.goMobile div span { width: 28px; height: 36px; display: inline-block; background: url("https://img.seoul.co.kr/img/n24/goMobile.webp") no-repeat; background-position: 0 0; }

/* 파리 올림픽 */
.bg-paris { background: linear-gradient(247deg, #6C8FB0 6.68%, #1D737F 69.87%) }
.bg-paris .viewHeader-wrapper { border-bottom: 0; }
.bg-paris h1 { color: var(--text-white); }
.bg-paris .breadcrumb li { color: var(--text-white); }
.bg-paris .breadcrumb li:not(:last-child):after { background: var(--text-white); opacity: .8; }
.bg-paris .reporterInfo .name { color: var(--text-white); opacity: .8; }
.bg-paris .reporterInfo .dateInfo div { color: var(--text-white); opacity: .7; }
.bg-paris .reporter .reporterInfo .dateInfo div:first-child:after { background: var(--text-white); opacity: .7; }
.bg-paris .bottomSide .viewTool>li { background: rgba(255, 255, 255, 0.20) }
.bg-paris .bottomSide .viewTool li div.hideText { display: block; width: 40px; height: 40px; border-radius: 20px; background: url(https://img.seoul.co.kr/img/n24/seoulIcon.webp) no-repeat; overflow: hidden; }
.bg-paris .bottomSide .viewTool>li:nth-child(1) div.hideText { background-position: -481px -247px; }
.bg-paris .bottomSide .viewTool>li:nth-child(2) div.hideText { background-position: -349px -247px; }
.bg-paris .bottomSide .viewTool>li:nth-child(3) div.hideText { background-position: -435px -247px; }
.bg-paris .bottomSide .viewTool>li:nth-child(4) div.hideText { background-position: -393px -247px; }

/* newbr 추가 240814 */
.new_br { margin-top: 0; margin-bottom: -32px !important; }
.videoWrap.new_br { margin-top: 32px; }
.con_openLinkA.new_br .con_openLinkBox_H,
.con_openLinkA.new_br .con_openLinkBox_V { margin-top: 0; margin-bottom: 0; }
.con_snsBox.new_br > iframe { margin-bottom: 0 !important; }
.new_br + .byline { margin-top: 62px !important; }
.subTitle_s0, .subTitle_s2{margin-top:0px; margin-bottom:40px;}

/* copyright  관련 20241120*/
.byline {margin:30px 0; clear: both; }
.paperInfo {margin-top: 32px; clear: both; }
.articleCopyright {margin-top: 32px; clear: both; }


/*tts start*/

/*default reset*/	
.resetTTS .loadingIcon{display:none !important;}
.resetTTS .soundNewsButton{display:flex !important;}
.resetTTS .viewTool-soundNews{display:flex !important;}	


/*loading*/
.loadingTTS .loadingIcon{display:flex !important;}
.loadingTTS .viewTool-soundNews{display:none !important;}


/*play*/
.playTTS .loadingIcon{display:none !important;}
.playTTS .viewTool-soundNews{display:flex !important;padding: 0 12px !important;}

.playTTS .soundNewsButton {background-position: -485px -626px !important;}
.bg-primary .playTTS .soundNewsButton,
.bg-black .playTTS .soundNewsButton{		
	background-position: -442px -626px !important;
}

.playTTS .soundWave{
	display: block !important;
	background: url("https://img.seoul.co.kr/img/n24/tts-sound.webp") no-repeat center !important;
	background-size: contain !important;
}

.bg-primary .playTTS .soundWave,
.bg-black .playTTS .soundWave{
	background: url("https://img.seoul.co.kr/img/n24/tts-sound-w.webp") no-repeat center !important;		
	background-size: contain !important;
}
.playTTS .newsReplay{display:block !important;}



/*pause*/
.pauseTTS .loadingIcon{display:none !important; }
.pauseTTS .viewTool-soundNews{display:flex !important;padding: 0 12px !important;}	
.pauseTTS .soundNewsButton {background-position: -396px -626px !important;}
.pauseTTS .soundWave {
	display: block !important;
	background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp?v=1") no-repeat !important;
	background-position: -625px -633px !important;
	
}
.bg-primary .pauseTTS .soundWave,
.bg-black .pauseTTS .soundWave {
	background-position: -670px -633px !important;
}
.bg-primary .pauseTTS .soundNewsButton,
.bg-black .pauseTTS .soundNewsButton{		
	background-position: -353px -626px !important;
}
.pauseTTS .newsReplay{display:block !important;}






.bottomSide .viewTool>li {
	position: relative;
	background: 0;
}

.bottomSide .viewTool li.soundNews-button-wrap {
	cursor: inherit;
	display: block;
	width: 100%;
	background: var(--text-gray-200);
	padding: 0;
}

.bottomSide .viewTool li .loadingIcon {
	display: flex;
	width: 40px;
	height: 40px;
	background: url("https://img.seoul.co.kr/img/n24/loading-black.svg") no-repeat center;
}

.bottomSide .viewTool li div.viewTool-soundNews.hideText {
	transition: all .15s ease-in-out;
	display: none;
	width: auto;
	align-items: center;
	background: 0;
	gap: 4px;
}

.bottomSide .viewTool li div.soundNewsButton.hideText {
	cursor: pointer;
	border: 0;
	background: none;
	width: 40px;
	height: 40px;
	border-radius: 20px;
	background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp?v=1") no-repeat;
	background-position: -396px -626px;
}

.bottomSide .viewTool li div.soundWave {
	display: none;
	flex-shrink: 0;
	width: 24px;
	height: 24px;
	background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp?v=1") no-repeat;
	background-position: -625px -633px;
}

.bottomSide .viewTool li div.soundWave img {
	display: block;
}

.bottomSide .viewTool li div.newsReplay.hideText {
	cursor: pointer;
	display: none;
	width: 40px;
	height: 40px;
	border-radius: 20px;
	background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp?v=1") no-repeat;
	background-position: -573px -626px;
}

.bottomSide .viewTool li .viewTool-soundNews.layout {
	padding: 0 12px;
}

.bottomSide .viewTool li div.soundNewsButton.pause {
	background-position: -485px -626px;
}

.bottomSide .viewTool li div.soundWave.show {
	display: block;
	background: url("https://img.seoul.co.kr/img/n24/tts-sound.webp") no-repeat center;
	background-size: contain;
}


.bottomSide .viewTool li div.soundWave.on {
	display: block;
}


.bottomSide .viewTool li div.newsReplay.show {
	display: block;
}

.bottomSide .viewTool li div.newsReplay {
	display: block;
	width: 40px;
	height: 40px;
	border-radius: 20px;
	background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp?v=1") no-repeat;
	overflow: hidden;
}

.bottomSide .viewTool li.fontSize-button div.hideText {
	background-position: -303px -112px;
}

.bottomSide .viewTool li.print-button div.hideText {
	background-position: -353px -112px;
}

.bottomSide .viewTool li.share-button div.hideText {
	background-position: -403px -112px;
}

.bottomSide .viewTool li.reply-button div.hideText {
	background-position: -453px -112px;
}


 /* tts background icon */
.bg-primary .bottomSide .viewTool > li {
	position: relative;
	background: 0;
}

.bg-primary .bottomSide .viewTool li.soundNews-button-wrap,
.bg-black .bottomSide .viewTool li.soundNews-button-wrap {
	display: block;
	width: 100%;
	background: rgba(255, 255, 255, 0.20);
	padding: 0;
}

.bg-primary .bottomSide .viewTool li .loadingIcon,
.bg-black .bottomSide .viewTool li .loadingIcon {
	display: flex;
	width: 40px;
	height: 40px;
	background: url("https://img.seoul.co.kr/img/n24/loading-white.svg") no-repeat center;
}

.bg-primary .bottomSide .viewTool li div.viewTool-soundNews.hideText,
.bg-black .bottomSide .viewTool li div.viewTool-soundNews.hideText  {
	transition: all .15s ease-in-out;
	display: none;
	width: auto;
	align-items: center;
	background: 0;
	gap: 4px;
}

.bg-primary .bottomSide .viewTool li div.soundNewsButton.hideText,
.bg-black .bottomSide .viewTool li div.soundNewsButton.hideText {

	border: 0;
	background: none;
	width: 40px;
	height: 40px;
	border-radius: 20px;
	background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp?v=1") no-repeat;
	background-position: -353px -626px;
}

.bg-primary .bottomSide .viewTool li div.soundWave img,
.bg-black .bottomSide .viewTool li div.soundWave img {
	display: block;
}

.bg-primary .bottomSide .viewTool li div.newsReplay.hideText,
.bg-black .bottomSide .viewTool li div.newsReplay.hideText {
	display: none;
	width: 40px;
	height: 40px;
	border-radius: 20px;
	background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp?v=1") no-repeat;
	background-position: -530px -626px;
}

.bg-primary .bottomSide .viewTool li .viewTool-soundNews.layout,
.bg-black .bottomSide .viewTool li .viewTool-soundNews.layout {
	padding: 0 12px;
}

.bg-primary .bottomSide .viewTool li div.soundNewsButton.pause,
.bg-black .bottomSide .viewTool li div.soundNewsButton.pause {
	background-position: -442px -626px;
}

.bg-primary .bottomSide .viewTool li div.soundWave.show,
.bg-black .bottomSide .viewTool li div.soundWave.show {
	display: block;
	background: url("https://img.seoul.co.kr/img/n24/tts-sound-w.webp") no-repeat center;
	background-size: contain;
}

.bg-primary .bottomSide .viewTool li div.soundWave,
.bg-black .bottomSide .viewTool li div.soundWave {
	display: none;
	flex-shrink: 0;
	width: 24px;
	height: 24px;
	background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp?v=1") no-repeat;
	background-position: -670px -633px;
}

.bg-primary .bottomSide .viewTool li div.soundWave.on,
.bg-black .bottomSide .viewTool li div.soundWave.on {
	display: block;
}


.bg-primary .bottomSide .viewTool li div.newsReplay.show,
.bg-black .bottomSide .viewTool li div.newsReplay.show {
	display: block;
}

.bg-primary .bottomSide .viewTool li.fontSize-button div.hideText,
.bg-black .bottomSide .viewTool li.fontSize-button div.hideText {
	background-position: -529px -112px;
}

.bg-primary .bottomSide .viewTool li.print-button div.hideText,
.bg-black .bottomSide .viewTool li.print-button div.hideText {
	background-position: -579px -112px;
}

.bg-primary .bottomSide .viewTool li.share-button div.hideText ,
.bg-black .bottomSide .viewTool li.share-button div.hideText {
	background-position: -629px -112px;
}

.bg-primary .bottomSide .viewTool li.reply-button div.hideText,
.bg-black .bottomSide .viewTool li.reply-button div.hideText {
	background-position: -679px -112px;
}

.bg-black .bottomSide .viewTool>li {
	position: relative;
	background: 0;
}

.bg-black .bottomSide .viewTool li.fontSize-button div.hideText {
	background-position: -529px -112px;
}

.bg-black .bottomSide .viewTool li.print-button div.hideText {
	background-position: -579px -112px;
}

.bg-black .bottomSide .viewTool li.share-button div.hideText {
	background-position: -629px -112px;
}

.bg-black .bottomSide .viewTool li.reply-button div.hideText {
	background-position: -679px -112px;
}
/*tts end*/

/* 240905 유지보수 */
.owl-theme .owl-dots .owl-dot {
	pointer-events: none;
}


.photoNews .arrowBtnWrap {
	margin-top: 32px;
}

#slick-interractive li {
	width: 300px !important;
}

.topic .arrowBtnWrap {
	margin-top: 32px;
}

.twigArrowBtn,
.opinionArrowBtn {
	margin-top: 16px;
}

.arrowBtnWrap {
	position: relative;
	display: flex;
	justify-content: center;
}

.numcount span {
	vertical-align: text-bottom;
}

.owl-theme .owl-dots .owl-dot.active span,
.owl-theme .owl-dots .owl-dot:hover span {
	background: var(--bg-b-bg);
}

.owl-theme .owl-dots .owl-dot span {
	width: 8px;
	height: 8px;
	margin: 6px 6px;
	background: #BEBDBD;
}

.listSlideArrow .owl-prev {
	font-size: 0;
	border: 0;
	background: 0;
	cursor: pointer;
	position: absolute;
	z-index: 1;
	top: -3px;
	left: calc(50% - 56px);
	width: 30px;
	height: 30px;
}

.listSlideArrow .owl-prev::before {
	content: '';
	opacity: 1;
	position: absolute;
	top: 0;
	left: 0;
	background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp?ver=240905") no-repeat;
	background-size: 772px;
	background-position: -479px -49px;
	width: 30px;
	height: 30px;
}

.listSlideArrow .owl-next {
	font-size: 0;
	border: 0;
	background: 0;
	cursor: pointer;
	position: absolute;
	z-index: 1;
	top: -3px;
	transform: 0;
	left: auto;
	right: calc(50% - 56px);
	width: 30px;
	height: 30px;
}

.listSlideArrow .owl-next:before {
	content: '';
	opacity: 1;
	position: absolute;
	top: 0;
	left: 0;
	background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp?ver=240905") no-repeat;
	background-size: 772px;
	background-position: -512px -49px;
	width: 30px;
	height: 30px;
}
/*******************/

/********** 240925 **********/
/* 회원가입 모달창 추가 */
.alertModal.hide { display: none; }
.alertModal { z-index: 99999; box-sizing: border-box; /* position: absolute; */ position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); border-radius: 9px; background: var(--text-gray-300); box-shadow: 1px 1px 6px 0px rgba(0, 0, 0, 0.30); padding: 30px; width: 309px; max-width: 360px; display: flex; flex-direction: column; }
.alertModal.alertDim { width: 360px; }
.alertModal .closeWrap { cursor: pointer; display: flex; justify-content: flex-end; margin-bottom: 6px; }
.alertModal .closeBtn { width: 26px; height: 26px; background: url("https://img.seoul.co.kr/img/n24/seoulIconX2.webp") no-repeat; background-position: -198px -224px; background-size: 979px; }
.alertModal .modalContent { text-align: center; }
.alertModal .modalBtnWrap { margin-top: 30px; display: flex; justify-content: center; gap: 10px; }
.alertModal .modalBtn { border: 0; cursor: pointer; display: inline-block; padding: 4px 20px; border-radius: 6px; }
.alertModal .modalBtn.cancelBtn { background: var(--text-white); }
.alertModal .modalBtn.confirmBtn { background: var(--text-gray-500); }
.dim { z-index: 9999; content: ''; display: none; position: fixed; left: 0; top: 0; width: 100%; height: 100vh; background: rgba(0, 0, 0, .7); opacity: 1; }

/********** 241211 **********/
.liveVideo {
  z-index: 1000;
  position: fixed;
  top: calc(100% - 302px);
  left: calc(100% - 470px);
  width: 470px;
  border:1px solid #000;
}

.liveVideo .videoTitle {
  box-sizing: border-box;
  width: 100%;
  height: 38px;
  display: flex;
  align-items: center;
  background: #000;
  color: #fff;
  padding: 5px 4px 3px 11px;
}

.liveVideo .videoTitle .videoTitleBox::before {
  position: absolute;
  display: block;
  content: '';
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  width: 6px;
  height: 6px;
  border-radius: 8px;
  background: var(--etc-notice);
}

.liveVideo .videoTitle .videoTitleBox {
  position: relative;
  display: flex;
  gap: 4px;
  padding-left: 12px;
  width: calc(100% - 40px);
}

.liveVideo .videoTitle .liveBadge {
  display: block;
}

.liveVideo .videoTitle .videoTit {
  padding-top: 2px;
}

.liveVideo .videoTitle .closeBtn {
  cursor: pointer;
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp");
  background-position: -199px -225px;
}

/* 250415 프로모션 배너 관련 추가 */
.bottomBanner .owl-carousel {
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.bottomBanner .owl-item {
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.5s ease-in-out;
}

@keyframes slideOutUp {
    0% {
        transform: translateY(0);
    }

    100% {
        transform: translateY(-100%);
    }
}

@keyframes slideInUp {
    0% {
        transform: translateY(100%);
    }

    100% {
        transform: translateY(0);
    }
}

.owl-item.out {
    animation: slideOutUp 0.5s forwards;
}

.owl-item.in {
    animation: slideInUp 0.5s forwards;
}

.bottomBanner .content {
    position: relative;
    max-width: 1280px;
    margin: 0 auto;
}

.bottomBanner .closeBtn {
    z-index: 10;
    cursor: pointer;
    position: absolute;
    display: block;
    width: 32px;
    height: 32px;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    background: url("https://img.seoul.co.kr/img/n24/seoulIcon.webp?ver=002") no-repeat;
    background-position: -314px -221px;
}

.bannerImage img {
    margin: 0 auto;
}

/* 광고영역 웹표준 추가 */
.alternating-thumbnails-c .syndicatedItem .branding,
.alternating-thumbnails-b .syndicatedItem .branding,
.alternating-blend-next-up-b .syndicatedItem .branding {
	color: #666 !important;
}