html {
    font-family: 'NanumSquare', sans-serif !important;
    color: #062b49 !important;
    font-size: 22px;
}

/* 상단검색 */

.center{
    width:1100px;
    height:auto;
    margin: 0 auto;
}

#h_top{
    padding:20px 0;
}

#top_search{
    float:right;
    margin-top:5px;
}

#top_search>input {
    width:450px;
    height:auto;
    padding:18px;
    border:1px solid #4b9ab0;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    background:transparent;
    box-sizing: border-box;
    font-size: 18px;
    display: inline-block;
}

#top_search>button {
    background:transparent;
    border:none;
    float: right;
    padding:0;
    cursor: pointer;
}

/* 로그인 */

#login_bg{
    width:100%;
    height:70px;
    background: #24587a;
    box-sizing: border-box;
    padding-top:14px;
    vertical-align: middle;
    clear: both;
}

#login_bg input[type="text"],
#login_bg input[type="password"] {
    background:none;
    border:1px solid #fff;
    border-radius:3px;
    padding:10px 12px;
    margin-right: 5px;
    color:#fff;
    box-sizing: border-box;
}

#login_bg input::placeholder{
    color:#90a3b3;
}

#login_bg #login,
#login_bg #join,
#m_wrap #m_join {
    background-color: #fff;
    border:none;
    border-radius:3px;
    padding:8px 20px;
    margin-right: 5px;
    color: #24587a;
    font-size: .8rem;
    font-weight: 900;
    cursor: pointer;
    box-sizing: border-box;
    vertical-align: middle;
}

#login_bg #join,
#m_wrap #m_join
    {
    background-color: #ffe600;
}

#login_kakao{
    float:right;
}

#login_kakao span{
    color:#fff;
    font-size: .9rem;
    font-weight: 900;
    vertical-align: top;
    padding-top:12px;
    display: inline-block;
    margin:0 10px;
}

/* 메뉴 */

#menu_line{
    width:100%;
    height:70px;
    border-bottom: 1px solid #ddd;
    box-sizing: border-box;
    display: inline-block;
    padding-top: 25px;
}

#gnb>ul:first-child{
    display: inline-block;
}
#gnb>ul:last-child {
    float: right;
}

#gnb>ul>li {
    display:inline-block;
    font-size: .8rem;
    vertical-align: middle;
    letter-spacing: -.5px;
}

#gnb>ul>li>a{
    font-size: .9rem;
    color:#062b49;
    font-weight: 600;
}

/* 메인슬라이드 */
.swiper-container {
    width: 100%;
    height: 100%;
}

.swiper-slide {
    text-align: center;
    font-size: 18px;
    background: #fff;

    /* Center slide text vertically */
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -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;
}

.swiper-container-horizontal>.swiper-pagination-bullets,
.swiper-pagination-custom,
.swiper-pagination-fraction {
    bottom: 5px !important;
}

.swiper-pagination-bullet {
    width: 8px !important;
    height: 8px !important;
}

.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0 4px !important;
}

.swiper-pagination-bullet-active {
    background: #4b9ab0 !important;
}

/* 뉴스/등록 */
#news_line {
    width: 100%;
    height: 80px;
    border-bottom: 1px solid #ddd;
    box-sizing: border-box;
    display: inline-block;
    padding-top:15px;
}

#news_line #news{
    vertical-align: top;
    padding-top:20px;
    display: inline-block;
    font-size: .8rem;
}

#news_line #news span{
    font-family: arial, sans-serif !important;
}

#news_line #sign{
    float: right;
}

#news_line #sign a{
    margin-left:10px;
}

/* 매물유형 */

#roomtype{
    width:100%;
    height: auto;
}

#roomtype ul{
    display:flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
}

#roomtype ul>li{
    flex:1;
    margin-top: 30px;
}

#roomtype ul>li:nth-child(2),
#roomtype ul>li:nth-child(5) {
    text-align: center;
}

#roomtype ul>li:nth-child(3),
#roomtype ul>li:nth-child(6) {
    text-align: right;
}

#roomtype ul>li>img{
    width:100%;
    height:150px;
}

/* 매물정보 */

#roominfo{
    width:100%;
    height:auto;
    margin-top:30px;
}

#roominfo button{
    border:1px solid #062b49;
    border-radius:5px;
    padding:12px 22px;
    background:#fff;
    font-size: .8rem;
    font-weight: 600;
    margin-right: 10px;
    box-sizing: border-box;
    cursor: pointer;
}

#roominfo button span{
    color:#df244c;
}

#roominfo #info_more{
    float: right;
    font-weight: 600;
    padding-top: 15px;
}

#roominfo table{
    width:100%;
    margin-top:30px;
}
#roominfo table th{
    font-size: .9rem;
    font-weight: 900;
    letter-spacing:-.5px;
    border-top: 3px solid #062b49;
    border-bottom: 1px solid #ddd;
    padding:15px 0;
}
#roominfo table td{
    border-bottom: 1px solid #ddd;
    padding:15px 0;
    text-align:center;
}

#roominfo .info_color{
    color:#df244c;
}

/* 사장님모집 */

#partner_bg{
    width:100%;
    height:auto;
    background:url('/dv/img/partner_bg.jpg') no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    color:#fff;
    text-align: center;
    margin-top:30px;
    padding:80px 0;
}

#partner_bg h1,
#partner_bg h1 span{
    font-size: 1.5rem;
}

#partner_bg h1>b,
#partner_bg h1 span>b{
    font-weight: 900;
    font-size: 1.5rem;
}

#partner_bg h2 {
    font-size: 1.0rem;
    padding-top: 10px;
}

#partner_bg input{
    background-color: #ffe600;
    border:none;
    border-radius:3px;
    padding:10px 20px;
    color: #062b49;
    font-size: .8rem;
    cursor: pointer;
    font-weight: 900;
    box-sizing: border-box;
    margin-top: 20px;
}

/* 호잇소개 */

#hoit_bg{
    width:100%;
    height: auto;
    background-color:#eee;
    text-align: center;
}

#hoit_bg h1,
#hoit_bg h1 span{
    font-size: 1.3rem;
    font-weight: 900;
    padding: 60px 0;
}


#hoit_pc{
    text-align: left;
    display:inline-block;
    margin: 60px 0;
}

#hoit_link{
    float:right;
    display:flex;
    flex-direction: column;
    margin: 60px 150px 60px 0;
}

#hoit_link img{
    margin-bottom: 5px;
}

/* 관련사이트 */
#site_bg{
    width:100%;
    height:auto;
    border-bottom: 1px solid #ddd;
    box-sizing: border-box;
    display: inline-block;
    padding:30px 0;
}

#site_bg span{
    display:block;
    font-size: 1.0rem;
    font-weight: 900;
    margin-bottom:10px;
}

#site_bg ul>li{
    width:160px;
    height:50px;
    display:inline-block;
    vertical-align: middle;
    border:1px solid #ddd;
    margin-right: 10px;
    margin-bottom:15px;
    padding:15px;
}

#site_bg ul>li img{
    width:100%;
    height:auto;
    text-align:center;
    vertical-align: middle;
    position:relative;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
}
/* 하단 */

#f_info{
    display: inline-block;
    padding:20px 0;
}

#f_info li{
    display: inline-block;
}

#f_info li a{
    font-size: .7rem;
    color:#062b49;
}

footer{
    width:100%;
    height:auto;
    border-top: 1px solid #ddd;
    box-sizing: border-box;
    display: inline-block;
    padding:30px 0;
}

#f_logo{
    float:left;
}

#f_txt{
    display:inline-block;
    margin-left: 20px;
    font-size: .7rem;
    line-height: 1.2rem;
}

/* 모바일 */

#m_wrap,
#m_sign,
#m_roomtype,
#m_flogo,
#m_connect,
#m_join,
#m_part{
    display: none;
}

@media all and (max-width: 768px) {
    #h_top,
    #login_bg,
    #menu_line,
    #news_line,
    #roomtype,
    #roominfo,
    #flogo,
    #join,
    #part {
        display: none;
    }

    .center{
        width:100% !important;
        height:auto;
    }

    #m_wrap {
        display: block;
        padding:0 5vw;
        margin-top: 2vw;
    }

    #m_logo{
        width:100%;
        height:auto;
        vertical-align: top;
    }

    #m_join{
        display:block;
        margin-top: 10px;
        float:right;
        padding:8px 10px !important;
        font-size: .6rem !important;
    }

    #m_sign{
        display:block;
        border-top: 1px solid #ddd;
        text-align:center;
        padding:8px 0;
    }

    #m_roomtype {
        display:block;
        width:100% !important;
        height:100%;
        margin-top: 25px;
    }

    #m_roomtype img {
        width:100%;
        height:auto;
    }

    #m_foominfo{
        width:100%;
        height:auto;
    }

    #m_foominfo button{
        width:30%;
        margin-right: 10px;
        background-color:#fff;
        border:1px solid #062b49;
        border-radius: 5px;
        color:#062b49;
        font-size: .7rem;
        padding:10px;
        font-weight: 900;
    }
    #m_foominfo button:last-child {
        margin-right:0;
    }

    #m_foominfo button span{
        color:#df244c;
        display:block;
    }

    #news{
        display:block;
        margin-top: 5px;
        line-height: 1.0rem;
        font-size: .6rem;
    }

    #news span {
        font-family: arial, sans-serif !important;
    }

    #partner_bg{
        padding:50px 0 !important;
    }

    #m_partner,
    #m_hoit,
    #m_site,
    #m_finfo,
    #m_footer{
        padding:0 5vw;
    }
    
    #m_partner h1,
    #m_partner span,
    #m_partner h1 b{
        font-size: 1.0rem !important;
        line-height: 1.5rem !important;
    }

    #m_partner h1 span{
        display:block !important;
    }

    .strong{
        font-weight: 900;
    }

    #m_hoit h1 {
        font-size: .95rem !important;
        line-height: 1.4rem !important;
    }

    #m_hoit h1 span{
        font-size: .90rem !important;
        display:block !important;
        padding:0 !important;
    }

    #m_partner h2{
        font-size: .7rem !important;
        line-height: 1.0rem !important;
    }

    #m_part{
        display: inline-block;
    }

    #m_hoit img{
        width:100%;
        height:auto;
    }
    
    #hoit_link{
        display: inline-block;
        float:none;
        margin:0;
        text-align:center;
        padding-bottom: 50px;
    }

    #hoit_link img{
        width:80%;
        height:auto;
    }
    
    #m_site ul>li{
        width:45.5%;
        padding:20px;
        box-sizing: border-box;
    }

    #m_site ul>li img{
        width:100%;
        height:auto;
    }

    #m_finfo li {
        font-size: .5rem;
    }

    #m_finfo li a{
        font-size: .6rem;
        line-height: 1.0rem;
    }

    #m_flogo{
        display:block;
    }

    #m_footer #f_logo{
        width:100%;
        text-align: center;
    }

    #m_footer #f_txt{
        margin:10px 0 0 0;
        font-size: .6rem;
        line-height: .8rem;
        letter-spacing:-.5px;
    }

    #m_connect{
        width:100%;
        display: block;
    }
    
    #m_connect button{
        width:50%;
        height:auto;
        border:none;
        box-sizing:border-box;
        float:left;
        cursor:pointer;
        padding:12px 0;
    }

    #m_connect img{
        width:15%;
        height:auto;
        vertical-align:middle;
        margin-right:5px;
    }

    #m_connect a{
        color:#fff;
        letter-spacing:-.5px;
        font-size: .7rem;
        font-weight: 900;
        padding-top: 5px;
    }

    #call{
        background-color:#2b2b2b;
    }

    #kakao {
        background-color: #ffe600;
    }

    #kakao a{
        color:#381e1e;
    }

}