/*
Theme Name: Brandpage
Theme URI: http://www.webactually.com/
Author: Webactually Korea
Author URI: http://www.webactually.com/
Description: A great responsive magazine theme for brandpage that is suitable for showing lots of articles, images and videos. Optional widgets located at the right side are easy to control.
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: brandpage, blog, magazine, black, blue, white, grey, images, videos, articles, responsive-width, responsive-layout, right-sidebar, sitcky-post, editor-style, featured-images, category-templete, tag-ticker, webactually 
Text Domain: brandpage
*/

/* Custom Styles */
/**
 * 실제 배포는 style.min.css 이며, style.css는 개발 참고하시기 바랍니다.
 * 클래스를 기본으로 스타일하였으므로, CSS 명시도 이용하여 아이디로 우선 적용할 수 있습니다.
 */

/* 전체 */
#body {

}

/* 전체 wrapper */
#wrap {

}

/* 헤더 */
#header {

}

/* 푸터 */
#footer {

}

/* 컨테이너 : 콘텐츠 및 사이드바 ; */
#container {

}

/* 콘텐츠 */
#content {

}

/* 사이드바 */
#sidebar {

}

/* portrait img in post will be align to center and auto sized */

a.portrait-img {
	width: 100%;
	text-align: center;
}
a.portrait-img img {
	min-width: 0 !important;
	margin-left: 0 !important;
	width: auto !important;
	height: auto !important;
	display: inline-block !important;
}

.mod-promotion__media {
    margin: 0 auto !important;
    max-width: 1188px;
}
.mod-promotion__list {
    margin-top: 16px;
    margin-right: 30px;
    width: 382px;
}
.mod-promotion__list__item {
    margin-top: 12px;
}
@media all {
    .mod-promotion__category, .mod-promotion__title {
        font-size: 16px;
    }
}
@media screen and (max-width: 1187px) {
    .mod-promotion__media {
        width: 970px;
        margin-left: auto !important;
        margin-right: auto !important;
    }
    .mod-promotion__list {
        margin-top: 9px;
        margin-right: 20px;
        width: 318px;
    }
    .mod-promotion__list__item {
        margin-top: 4px;
    }
    .mod-promotion__list li {
        margin-right: 10px;
    }
    .mod-promotion__category, .mod-promotion__title {
        font-size: 16px;
    }
}
@media screen and (max-width: 969px) {
    .mod-promotion__media {
        width: 768px;
        margin-left: auto !important;
        margin-right: auto !important;
    }
    .mod-promotion__list {
        width: 100%;
        padding: 0 26px 35px;
    }
    .mod-promotion__list__item {
        margin-top: 14px;
    }
    .mod-promotion__category, .mod-promotion__title {
        font-size: 16px;
    }
}
@media screen and (max-width: 767px) {
    .mod-promotion__media {
        margin: 0 !important;
    }
    .mod-promotion__media {
        width: 100%;
        padding: 15px 15px 0 15px;
        background-color: #fff;
    }
    .mod-promotion__list {
        padding: 0 60px 20px;
        width: 100%;
    }
    .mod-promotion__category, .mod-promotion__title {
        font-size: 14px;
    }
}
@media screen and (max-width: 479px) {
    .mod-promotion__media {
        margin: 0 !important;
    }
    .mod-promotion__media a {
        position: relative;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }
    .mod-promotion__list {
        padding: 0 40px 15px;
        width: 100%;
    }
}
@media (max-width: 360px) {
    .mod-promotion__media {
        height: auto;
    }
    .mod-promotion__media img {
        width: 100%;
        height: auto;
        margin: 0;
    }
    .mod-promotion__list {
        padding: 0 38px 10px;
        width: 100%;
    }
}
@media (max-width: 320px) {
    .mod-promotion__media {
        margin: 0 !important;
    }
    .mod-promotion__media img {
        width: 100%;
        height: auto;
        margin: 0;
    }
    .mod-promotion__list {
        padding: 0 32px 10px;
        width: 100%;
    }
}
