/* ============================================================
   블로그 띠 배너 (추천 블로그 전용)
   ------------------------------------------------------------
   블로그 제목 아래, 검색칸 위. 배너를 올리지 않은 블로그에서는
   이 조각 자체가 나오지 않으므로 아무 자리도 차지하지 않는다.
   ============================================================ */

/* 머리말의 폭을 끝에서 끝까지 쓴다 - 가운데 좌우가 비면
   띄가 아니라 사진 한 장처럼 보인다. */
.BlogBannerStrip {
    width: 100%;
    margin: 14px 0 0;
    padding: 0;
    box-sizing: border-box;
    text-align: center;
}

.BlogBannerStrip a { display: block; }

/* 가로:세로 10:1 안팎의 긴 그림을 받는다. 높이를 정해 두지 않고 폭에만
   맞추므로 어떤 비율을 올려도 잘리지 않는다 - 좁은 화면에서는 그대로
   같이 줄어든다. */
.BlogBannerImage {
    display: block;
    width: 100%;
    height: auto;
    max-width: 100%;
    border: 0;
    border-radius: 4px;
}

/* ---------- 관리 화면 ---------- */
.BlogBannerPreview {
    display: block;
    max-width: 100%;
    height: auto;
    margin-top: 8px;
    border: 1px solid #dfe4e8;
    border-radius: 4px;
}

.BlogBannerEmpty {
    display: inline-block;
    margin-top: 8px;
    color: #8a949c;
}