@import url(./reset.css);
@import url(./base.css);
@import url(./common.css);
@import url(./fonts.css);
@import url(./blog.css);

.contents-wrap {
    margin-bottom: 80px;
}
@media all and (max-width:480px) {
    .contents-wrap {
        margin-bottom: 32px;
    }
}
.contents-box a:hover .contents-title-large,
.contents-box a:hover .contents-title-small {
    text-decoration: underline;
}
.review .image-wrap {
    width: 50%;
    min-height: 284px;
    height: 284px;
    background-color: #1E1F21;
    margin-bottom: 0;
    padding: 0;
}
.review .image-wrap > img {
    width: auto;
    min-width: 284px;
    height: 100%;
    margin: 0 auto;
}
@media all and (max-width: 480px) {
    .review .image-wrap {
        width: 100%;
        min-width: none;
        height: auto;
    }
    .review .image-wrap > img {
        min-width: none;
    }
}
.review .title-wrap {
    margin-top: 64px;
    width: 50%;
    padding-left: 64px;
}
@media all and (max-width:1024px) {
    .review .title-wrap {
        padding-left: 24px;
    }
}
@media all and (max-width: 480px) {
    .review .title-wrap {
        width: 100%;
        padding: 0 8px;
        margin-top: 16px;
    }
}

.review .contents-box {
    padding: 0 32px;
}
@media all and (max-width:1024px){
    .review .contents-box {
        padding: 0 8px;
        margin-bottom: 80px;
    }
}



.theme-news.card-box {
    width: 22%;
}
@media all and (min-width:481px) and (max-width:1023px) {
    .card-box {
        padding:0;
    }
}
@media all and (max-width:480px) {
	.theme-news.card-box {
        width: 100%;
    }
}
.theme-news.contents-image-wrap {
    width: 100%;
    padding-top:75%;
/*     background-color: #54A5EB; */
}

/* 寃뚯떆湲� */
.theme-post {
	background-color: #fff;
}

.theme-post .category-title-wrap{
    margin-bottom: 16px;	
}
.theme-post .contents-title-cate {
    font-size: 16px;
    margin-bottom: 8px;
}
.theme-post .post-title-wrap {
    text-align: center;
}
.theme-post .contents-title-date {
    margin-left: 16px;
}
.theme-post .post-contents-wrap {
    padding: 80px 0;
    width:100%;
    text-align: left;
}
@media screen and (max-width:767px) {
	.post-contents-wrap img {
		width:100%;
	}
}
.theme-post .image-wrap{
	text-align:center;
}
.theme-post .post-contents-wrap .image-wrap {
	/*max-width:340px;*/
	/*margin:0 auto;*/
    margin:0 auto 40px auto;
}
.theme-post .post-contents-wrap .image-wrap img {
	width:100%;
}
.theme-post .post-contents-wrap p {
	margin: 5px 0;
	font-size:18px;
	line-height:150%;
}
@media all and (max-width:1024px) {
    .theme-post .post-contents-wrap {
        padding: 80px 0;
    }
}
@media all and (max-width:480px) {
    .theme-post .post-contents-area img {
        width: 100%;
    }
}

.theme-post .another-post-more {
    margin: 80px 0;
}
.theme-post .another-post-more .more-button {
    width: 148px;
}
.theme-post .another-post-more .card-box .image-wrap,
.theme-post .another-post-more .card-box img {
    transition: all .3s ease-in-out;
}
.theme-post .another-post-more .card-box:hover .image-wrap {
    box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.2);
}
.theme-post .another-post-more .card-box:hover img {
    transform: scale(1.05);
}

/* blog detail*/
.page-more-button{
	text-align:center;
}

.list_btn {
	padding:12px 28px;
	color:#fff;
	border-radius:10px;
	background-color:#0056ff;
}

.slick-blog-next .slick-list {
	margin-right:-24px;
}
.slick-blog-next .slick-slide {
	margin-right:24px;
}

@media screen and (max-width:767px) {
	.slick-blog-next .slick-list {
		margin-right:-16px;
	}
	.slick-blog-next .slick-slide {
		margin-right:16px;
	}
}

.slick-btn-box {
	position: absolute;
    bottom: -24px;
    left: 50%;
    transform: translateX(-50%);
}
#slick-blog-left, #slick-blog-right {
	position:relative;
	color: #8a8a9d;
}
#slick-blog-left:before {
	position:absolute;
	left: -10px;
    top: 4px;
	width:6px;
	height:6px;
	border-top:2px solid #afaebe;
	border-right:2px solid #afaebe;
	transform:rotate(225deg);
	content:'';
}
#slick-blog-right:after {
	position:absolute;
	right:-10px;
	top:4px;
	width:6px;
	height:6px;
	border-top:2px solid #afaebe;
	border-right:2px solid #afaebe;
	transform:rotate(45deg);
	content:'';
}

@media screen and (max-width:1023px) {
	.slick-btn-box {
		display:none;
	}
}