.col_gray {
    color:#999;
}

/* 연재 TOP3 */
.top3_wrap {width:100%; min-width:320px; height: auto; min-height:430px; overflow: hidden; overflow-x: hidden; background:#333333;}
.top3_wrap h2 {width: 100%; height: 20px;  margin:25px 0 25px 15px; font-size:18px;}
.top3_wrap h2 b {color:#FFF;}

.swiper {
    width: 100% !important;
    height: auto;
    min-height: 340px;
    margin-bottom: 30px;
}

.swiper-slide {
    position: relative;
    height: 345px;
    text-align: left;
    font-size: 18px;
    background: #fff;
    padding: 15px;
    /* Center slide text vertically */
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: block;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}

.swiper-slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.icon50s {
    position: absolute; top:7px; left:28px; width:43px; height:40px; background: url(https://image.edaily.co.kr/images/realty/best_mo.png) no-repeat; display: none;
}
.icon50m {
    float:left; width:20px; height:24px; background: url(https://image.edaily.co.kr/images/realty/best_mini.png) no-repeat; margin-right: 5px;
} 
.top3_img {display: block; width:100%; height:260px; border:1px solid #e5e5e5;}
.top3_img img {object-fit: cover;}
.top3_tit {float: left; width:100%; font-weight:700; color:#333; padding: 20px 0 10px 0; margin-bottom:19px; border-bottom:1px solid #e5e5e5; font-size:1.02em;}
.top3_tit.on a {font-weight:700; color:#e60012; margin-right: 10px;}
.top3_tit a {font-weight:700; color:#333;}
.top3_sub {float:left; display: block; font-weight: 700; font-size: 0.95em; height: auto; min-height: 42px;; line-height: 21px; display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; white-space: normal; -webkit-line-clamp: 2;}
.top3_sub a {font-weight: 700;}
.banner_info {float: left; width:auto; min-width: 320px; height:20px; font-size: 0.8em; margin-top: 10px;}
.banner_info span.up_icon {float: left; width: 24px;height:14px; border: 1px solid #e60012;background:#FFF;color:#e60012;text-align:center; font-size:0.6em; line-height: 12px;border-radius: 40px; margin-right: 5px; margin-top: 2px;font-weight: 600;}
.banner_info .date_area {float:left; margin-right: 14px; color:#999;}

/* 연재 시리즈 타이틀 (모바일) */
.m_realty_tit {float: left; width:100%; min-width: 320px; height:35px; font-size: 1.2em; font-weight: 600; border-bottom:2px solid #f5f5f5; margin-top: 20px; margin-bottom: 15px;}
.realty_toggle {float:right;font-size: 0.8em;width:85px;height: 30px;}
.realty_toggle p {float:left; margin-top: 1px;}
.toggleSwitch {
    float: right;
    width: 40px;
    height: 20px;
    display: block;
    position: relative;
    border-radius: 2rem;
    background-color: #fff;
    border: 1px solid #e8e7e7;
    cursor: pointer;
}

.toggleSwitch .toggleButton {
    width: 16px;
    height: 16px;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    border-radius: 50%;
    background: #f03d3d;
}

/* 체크박스가 체크되면 변경 이벤트 */
.toggleSwitch.active {
    background: #f03d3d;
}

.toggleSwitch.active .toggleButton {
    left: calc(100% - 2rem);
    background: #fff;
}

.toggleSwitch, .toggleButton {
    transition: all 0.2s ease-in;
}

/* 연재 시리즈 리스트 (모바일) */

.list {
    padding: 0;
}
.list li {
    opacity: 1;
    list-style: none;
    margin-top: 10px;
    text-align: center;
    border-radius: 4px;
    line-height: 32px;
    font-size: 13px;
    padding-bottom: 1px;
    transition: all 0.4s ease 0s;
    }
.list li.is-hidden {
    opacity: 0;
    height: 0;
    margin: 0;
}

.more {
    color: #333;
    margin-top: 52px;
    width: 100%;
    min-width: 350px;
    float: left;
    margin-left: 25%;
    text-align: center;
}
.button {
    background-color: #e60012;
    border: none;
    cursor: pointer;
    outline: none;
    padding: 0;
    height: 60px;
    line-height: 60px;
    width: 50%;
    color: #FFF;
    font-size: 18px;
    font-weight:600;
    border-radius: 50px;
}
.button a {
    float:left; width:100%; height:100%; color:#FFF;
}

.m_realty_wrap {width:100%; height:auto; min-height: 900px; padding-top: 5px; padding-bottom: 20px; background:#FFF;}
.m_realty_wrapIn { display: block; margin: 10px 20px;}
.m_list_box_wrap {width:100%; height:auto; margin-top: 140px; padding: 0 20px;}
.m_list_box_tit{width:100%; height:30px; font-weight: 700; font-size: 1.2em; margin-bottom: 10px; float:left; margin-top: 70px;}
.m_list_box {display: flex; min-width: 320px; width:100%; max-height: 190px; border: 1px dashed #ccc; padding: 18px 18px; background: #FFF; margin-bottom: 10px;}
.list_box_l {float: left; width: 82%; height: auto; margin-right: 3%;}
.list_box_l span.box_txt a{float: left; width:90%; font-size: 1.2em; text-align: justify; line-height: 22px; min-height: 40px; display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; white-space: normal; -webkit-line-clamp: 2;}
.n_name {color:#28d31f;}
.box_tit {width:90%; height:auto; margin-bottom:20px;}
.box_tit h4 {width:auto; max-width:100%; height:auto; margin-right: 8px; overflow: hidden; text-align: left; font-size: 1.3em; letter-spacing: -0.05em; display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; white-space: normal; -webkit-line-clamp: 1;}
.box_tit h4 a {font-weight: 700; color:#0c43b7;}
.box_info {float: left; width:auto; height:20px; font-size: 0.9em; background: #fff; margin-top: 20px;}
.box_info span.up_icon {float: left; width: 24px;height:14px; border: 1px solid #e60012;background:#FFF;color:#e60012;text-align:center; font-size:0.7em; line-height: 12px;border-radius: 40px; margin-right: 5px; font-weight: 600;}
.box_info .date_area {float:left; margin-right: 14px; color:#999;}
.box_info span.win_img {float: left; margin-top: 2px; margin-right: 5px;}
.box_info span img {width:12px;}
.box_info p.article {float:left; color:#999;}
.box_info p.article span {float:right; margin-left: 3px;}

.list_box_r {position: relative; float:right; width:75px; margin-top: 2px;}
.lists_box_r {float:right; width:75px; margin-top: -4px; z-index: 99;}
.subscription_box {float:right; width:100%; height:20px; margin-bottom:5px;}
.subscription_box a span {float:right; width:82%; text-align: right; font-size: 16px; font-weight:700; margin-bottom: 10px; cursor: pointer;}
.subscription_box a span p {float:left; margin:3px 0px; width:14px; height:14px; text-align:center; font-size: 14px; line-height:11px; color:#FFF; border-radius:40px; background: url(https://image.edaily.co.kr/images/realty/plus_mini.png) no-repeat;}
.subscription_box a span p.n_name {float:left; color:#28d31f;}
.subscribe_area {float: left; width:100%; margin-bottom: 3px; font-size:13px; text-align: right;}

.view_icon {
    position: absolute; bottom:0px; right:0px; width:43px; height:40px; background: url(https://image.edaily.co.kr/images/realty/best_mo.png) no-repeat; display: none;
}


.update_area {
    float:left; width:100%; min-width: 320px; height:20px; text-align: right; margin-bottom:20px; 
}
#update_icon { font-family:'arial'; }
#update_icon ul{ width:138px; margin:0; padding:0; cursor: pointer; float:right;}
#update_icon ul.menu li{ position:relative; float:left; width:100%; height: 35px; list-style-type:none; font-size:0.9em; text-align: center; letter-spacing: -0.5px; background: #FFF;}
#update_icon ul.menu li p {
    position:absolute; top:6px; right:2px; z-index: 99;
}
#update_icon ul.menu li a{ width:110px; height:30px; line-height:31px; text-align: right; color:#000; font-weight:bold; text-decoration:none;  background: #fff;}
#update_icon ul.menu li .sub { border:1px solid #333;  height: 108px; background: #fff; width:144px; margin-top: 12px;}
#update_icon ul.menu li .sub a{ position:relative; float:left; display:block; z-index:999; width:100%; line-height: 35px; height: 35px; font-size:1.05em; font-weight: 500; text-align: right; padding-right:17px;}

/* 구독 알림창 영역 */
#gnb_all{position:absolute; top:29px; left:132px; width:50%; padding: 17px 20px; letter-spacing: -1px; font-size: 0.7em;; line-height: 23px; display:none; position:absolute; color:#929294; background: #fff; border:1px solid #333; z-index:99999; text-align:left; margin:0px auto}
.gnb_menu_btn{position: absolute; top:29px; left:108px; border-radius: 50px; width:17px; height: 17px; margin:0 auto; cursor:pointer; text-align:center; padding:3px; background: url(https://image.edaily.co.kr/images/realty/tit_ico.png) no-repeat;}
.close_bn {
    position: absolute;
    top: 5px;
    right: 10px;
    font-weight: 700;
    text-shadow: 0 1px 0 #fff;
    font-size: 1.8rem;
}
.final_icon {width:50px;height:50px;border-radius:50px;text-align:center;line-height:50px;font-weight:600;font-size: 14px; margin-left:19px; background:#bbb;margin: 50% auto;color: #fff;}

/* 연재 시리즈 상세리스트 (모바일) */
.list_tit_wrap {width:100%; min-width:320px; height:100px; margin-top: 30px; border-bottom:1px solid #333; margin-bottom: 20px;}
.list_tit_wrapIn {float: left; width:78%; height: auto; margin-right: 3%; margin-top:15px; margin-bottom: 10px;}
.list_tit_sup {width:100%; margin-top:20px; font-weight:700; font-size:1.2em; margin-bottom:10px;}
.list_tit_top {width:100%; height:auto; font-weight:700; font-size: 1.6em;  display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; white-space: normal; -webkit-line-clamp: 1;}
.list_tit_txt {width:100%; height:auto; margin-top:10px; display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; white-space: normal; -webkit-line-clamp: 1;}
.lists_box_r_wrap {position:relative; float: right; width:60px; margin-top: 0px;}
.date_section {float:right; width:120px; height:20px; text-align: right; font-size: 0.9em; line-height: 21px; color:#333;}
.date_section span {float:right; margin-left: 10px; margin-top: 2.5px; font-size: 0.95em !important; color:#999;}

/* 구독 알림창 */
#gnb_all_btn{position:absolute; top:92px; left:21px; width:40px; letter-spacing: -1px; font-size: 0.7em; line-height: 23px; display:none; position:absolute; color:#333; background: #fff; z-index:99999; text-align:center; margin:0px auto}
#gnb_all_btn li {width:38px; height: 34px; display: grid; margin-right:5px; border-right:1px solid #999; border-left:1px solid #999; padding:5px 5px; background: #FFF;}
#gnb_all_btn li:first-of-type {border-top: 1px solid #999; margin-top: 3px;}
#gnb_all_btn li:last-of-type {border-bottom: 1px solid #999;}
.sns_menu_btn{float: right; width:30px; height:30px; cursor: pointer; margin-top: 9px; margin-right: 0px; cursor:pointer; z-index: 99;}
.sns_menu_btn img {width:30px; height: 30px;}
.close_btns {
    position: absolute;
    bottom: -33px;
    right: 14px;
    font-weight: 700;
    text-shadow: 0 1px 0 #fff;
    font-size: 2.2rem;
}

/* 연재 시리즈 상세리스트 반응형 (모바일) */
.realtybox {
    position:relative; width:100%; height:140px; float: left;
}
.realtybox_l {
    position: relative;
    float: left; width:37%; height:124px; margin-top: 7px; margin-right: 3%; overflow: hidden; padding-right: 3px;
}
.realtybox_l a img {
    float: left; width:100%; height: 100%; margin-top: 5px; margin-right: 5px; object-fit:cover;  border: 1px solid #f5f5f5;
}

.realty_titBox {float:left; width:100%; height:20px; margin:10px 0 0 0;}
.realty_titBox p {float:left; font-weight: 600; color:#999; margin-right: 10px;}
.realty_titBox span {float:left; font-weight: 700;}

.view_50 {
    position:absolute; right: 0; top:1px; width:44px; height:23px; color:#FFF; line-height: 23px; text-align: center;
    font-size: 11px; letter-spacing: 0.1px; font-weight: 600; border-radius: 0 4px 0 4px; background:#e60012;
    z-index: 9;
}
.view_50s {
    position:absolute; left:0; top:19px; width:60px; height:25px; color:#FFF; line-height: 25px; text-align: center;
    font-size: 11px; letter-spacing: 0.1px; font-weight: 600; border-radius: 0 4px 0 4px; background:#e60012;
    z-index: 9;
}
.realtybox_r {
    float: left; width:60%; height:100px; margin-top: 28px; overflow: hidden;
}
.realtybox_r h3 {
    float:left; width:100%; height:auto; overflow: hidden; text-align: left; background:#fff; font-size:20px; display: -webkit-box;
        overflow: hidden;
        text-overflow: ellipsis;
        -webkit-box-orient: vertical;
        white-space: normal;
        -webkit-line-clamp: 2;
}
.realtybox_r h3 a{ 
    font-weight: 700;
}

.realty_date {
    float: left;
    position: relative;
    width: 100%;
    margin-top: 15px;
    color: #999;
    font-size: 14px;
    text-align: left;
}
.realty_date::before {
    content: '';
    position: absolute;
    left: 71px;
    top: 5px;
    width: 1px;
    height: 10px;
    background: #ccc;
}
.realty_date p {
    float: left ;margin-right: 18px; font-size: 14px;
    
}

@media screen and (max-width: 580px) {
    .realtybox {
        height: 135px;
    }
    .realtybox_l {height: 110px;}
    .realtybox_r {margin-top: 23px;}
    .realtybox_r h3 {font-size: 18px;}
    .subscription_box a span {width: 80%;}
    .top3_img { height: 250px;}
}

@media screen and (max-width: 460px) {
    .realtybox {
        height: 110px;
    }
    .subscription_box a span {width: 79%;}
    .realtybox_l { height: 98px; }
    .realtybox_r {margin-top: 19px; font-size: 16px;}
    .list_box_r {width: 85px;}
    .top3_img { height: 217px;}
}

@media screen and (max-width: 380px) {
    .realtybox {
        height: 100px;
    }
    .subscription_box a span {width:80%;}
    .realtybox_l { height: 87px; }
    .realtybox_r {margin-top: 12px;}
    .realtybox_r h3 {margin-top:3px;}
    .realtybox_r h3 a { font-size: 16px;}
    .realty_date { margin-top: 9px;}
    .top3_img { height: 170px;}
}
@media screen and (max-width: 340px) {
    .realtybox_l { height: 76px; }
    .realtybox_r h3 {margin-top:-1px;}
    .realtybox_r h3 a { font-size: 0.8em;}
    .realty_date {margin-top: 5px;}
    .top3_img { height: 142px;}
}