@charet "utf-8";

/* Common */
.section-header{margin-bottom:18px;}
.section-header h2{font-size:18px;}
.section-footer{position:absolute;right:0;top:0;}
.section-footer .btn-more-details{display:block;height:18px;padding-right:12px;background:url(../images/nav/btn-more-details-d8ac26bbe036655c1ea13027e845c496.png) 100% 50% no-repeat;font-size:16px;font-weight:700;color:#747474;line-height:18px;transition:0.3s;}

/* Key Visual */
.popular-keywords{margin-bottom:100px;}
.key-visual{float:left;display:table;position:relative;width:calc( 100% - 258px );height:491px;background-position:50% 50%;background-size:cover;border-radius:15px;}
.key-visual .image-area{position:absolute;left:0;top:0;}
.key-visual .text-area{display:table-cell;position:relative;z-index:10;padding-bottom:30px;text-align:center;vertical-align:bottom;}
.key-visual .text-area .slogan{margin-bottom:20px;font-size:18px;line-height:1.5;}
.key-visual .text-area .date time{font-size:15px;color:#999;}

[class*="popular-keywords-type-0"] .key-visual{table-layout:fixed;}
[class*="popular-keywords-type-0"] .key-visual a{display:table-row;width:100%;height:100%;}
[class*="popular-keywords-type-0"] .slogan{overflow:hidden;max-height:54px;padding:0 20px;white-space:nowrap;text-overflow:ellipsis;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;}

/* 정방형 */
.popular-keywords-type-02 .key-visual{width:calc( (100% - 258px) / 2 - 8px );}

.popular-keywords-type-02 .key-visual:nth-of-type(odd){margin-right:16px;}

/* 1:2 비율 */
.popular-keywords-type-03 .key-visual:nth-of-type(odd){width:calc( (100% - 258px) * 0.322896 );margin-right:18px;}
.popular-keywords-type-03 .key-visual:nth-of-type(even){width:calc( (100% - 258px) * 0.659491 );}

/* 2:1 비율 */
.popular-keywords-type-04 .key-visual_20210706_2{width:calc( (125% - 258px) / 2 - 8px )!important;}
.popular-keywords-type-04 .key-visual_20210706_1{width:calc( (62% - 100px) / 2 - 8px )!important;}
.popular-keywords-type-04 .key-visual:nth-of-type(odd){width:calc( (100% - 258px) * 0.659491 );margin-right:18px;}
.popular-keywords-type-04 .key-visual:nth-of-type(even){width:calc( (100% - 258px) * 0.322896 );}

/* Key Words */
.keywords-area{float:right;width:240px;height:491px;padding:34px 34px 20px;background-color:#1b1b1b;border-radius:15px;}
.keywords-area h2{margin-bottom:12px;font-size:17px;font-weight:700;}
.keywords-list .list-item a{display:block;width:calc(100% - 2px);height:40px;line-height:40px;font-size:0;letter-spacing:0;}
.keywords-list .list-item a .number,
.keywords-list .list-item a .keywords{display:inline-block;vertical-align:top;}
.keywords-list .list-item a .number{width:30px;font-size:14px;color:#7d7d7d;font-weight:700;}
.keywords-list .list-item a .keywords{width:calc( 100% - 30px );font-size:14px;color:#a4a4a4;line-height:40px;overflow:hidden;max-width:100%;text-overflow:ellipsis;white-space:nowrap;word-wrap:normal;}

/* Latest Products */
.latest-products{position:relative;font-size:0;}

.latest-products .product-item a{display:block;}
.latest-products .product-item figure img{width:100%;margin-bottom:13px;border-radius:15px;}
.latest-products .product-item figcaption{font-size:14px;text-align:center;line-height:1.3;}

.latest-products-slider{font-size:0;letter-spacing:0;}
.latest-products-slider > .product-item{width:calc( 20% - 7px );margin-right:8.75px;}
.latest-products-slider > .product-item{display:inline-block;vertical-align:top;}
.latest-products-slider > .product-item:last-child{margin-right:0;}

.latest-products-slider .slick-slide > div{font-size:0;}

/* Data Bulletin Board */
.data-bulletin-board{margin-top:110px;}
.bulletin-board-area{float:left;position:relative;width:calc( 50% - 12.5px );}
.bulletin-board-area:first-of-type{margin-right:25px;}
.bulletin-board-area .section-header{margin-bottom:40px;padding-bottom:18px;border-bottom:1px solid #434343;}

.post-item-area{}
.post-item-area .post-item{margin-bottom:43px;font-size:0;letter-spacing:0;}
.post-item-area .post-item:last-child{margin-bottom:0;}
.post-item .post-image,
.post-item .post-contents{display:inline-block;vertical-align:top;}
.post-item .post-image{width:280px;}
.post-item .post-image figure{overflow:hidden;border:1px solid #313131;border-radius:15px;}
.post-item .post-image figure img{width:100%;}

.post-item .post-contents{width:calc( 100% - 310px );padding-left:24px;}
.post-item .post-contents .date{margin-bottom:2px;}
.post-item .post-contents .date time{margin-bottom:10px;font-size:12px;font-weight:700;color:#999;}
.post-item .post-contents > .title{margin-bottom:30px;}
.post-item .post-contents > .title a{display:block;overflow:hidden;max-height:118px;font-size:19px;font-weight:700;line-height:1.5;transition:color 0.3s;}
.post-item .post-contents .hashtag{display:block;overflow:hidden;max-height:46px;font-size:0;letter-spacing:0;}
.post-item .post-contents .hashtag a{display:inline-block;position:relative;margin-right:12px;margin-top:5px;padding-bottom:3px;font-size:12px;color:#999;line-height:1.3;vertical-align:top;transition:0.3s;}
.post-item .post-contents .hashtag a.last{overflow:hidden;margin-right:0;max-width:100%;text-overflow:ellipsis;white-space:nowrap;word-wrap:normal;}
.post-item .post-contents .hashtag a:after{display:block;content:'';position:absolute;bottom:0;width:0;height:1px;background-color:#000;transition:0.3s;}

.post-item .post-contents > .title a span{}

.post-item.no-image-item .post-contents{width:100%;padding-left:0;}

/*:*:*:*:*:*:*:* PC & TABLET *:*:*:*:*:*:*:*/
@media all and (min-width:768px){

/* Key Words */
.keywords-list .slick-slide{float:none;width:100% !important;}



}

/*:*:*:*:*:*:*:* MOBILE & TABLET *:*:*:*:*:*:*:*/
@media all and (min-width:0) and (max-width:1279px){

/* Latest Products */
.latest-products .latest-products-slider{position:relative;left:-5px;width:calc( 100% + 10px );}
.latest-products .latest-products-slider .slick-slide{padding:0 5px;}

}

/*:*:*:*:*:*:*:* MOBILE *:*:*:*:*:*:*:*/
@media all and (min-width:0) and (max-width:767px){

/* Common */
.section-header h2{font-size:17px;}
.section-footer .btn-more-details{height:17px;padding-right:9px;background-size:auto 8px;font-size:13px;line-height:17px;}

/*
.section-footer{position:static;margin-top:20px;text-align:center;}
.section-footer .btn-more-details{display:inline-block;padding:0 15px;height:25px;background-color:#333;background-image:none;border-radius:14.5px;color:#fff;font-size:10px;text-align:center;letter-spacing:0.5px;line-height:25px;}*/

/* Class */
.excluding-mobile{display:none;}

/* Key Visual */
.key-visual{float:none;width:100%;height:113.672727vw;max-height:500px;background-position:50% 0;}
.key-visual .text-area{padding:0 15px 35px;text-align:left;}
.key-visual .text-area .slogan{margin-bottom:15px;font-size:17px;line-height:1.3;}
.key-visual .text-area .slogan > span{display:block;background-color:#f000;}
.key-visual .text-area .date time{font-size:12px;}

[class*="popular-keywords-type-0"] .key-visual{width:100% !important;margin-right:0;margin-bottom:10px;}
[class*="popular-keywords-type-0"] .key-visual:last-child{margin-bottom:0;}
[class*="popular-keywords-type-0"] .key-visual .slogan{max-height:44px;padding:0;}
[class*="popular-keywords-type-0"] .key-visual .text-area{padding:0 15px 10px;}

/* 정방형 */
.popular-keywords-type-02 .key-visual{height:75.757575vw;}

/* 1:2 비율 */
.popular-keywords-type-03 .key-visual:nth-of-type(odd){height:57.575757vw;}
.popular-keywords-type-03 .key-visual:nth-of-type(even){height:90.909090vw;}

/* 2:1 비율 */
.popular-keywords-type-04 .key-visual:nth-of-type(odd){height:90.909090vw;}
.popular-keywords-type-04 .key-visual:nth-of-type(even){height:57.575757vw;}

/* Key Words */
.popular-keywords{margin-bottom:20px;}
.keywords-area{float:none;width:100%;height:auto;padding:20px 20px 16px;}
.keywords-area h2{height:auto;padding-bottom:10px;border-bottom:1px solid #434343;font-size:16px;}
.keywords-list .list-item{}
.keywords-list .list-item a{height:26px;line-height:26px;}
.keywords-list .list-item a .number{width:25px;font-size:13px;}
.keywords-list .list-item a .keywords{width:calc( 100% - 25px );font-size:13px;line-height:26px;}

/* Latest Products */
.latest-products .product-item figcaption{font-size:13px;}
.latest-products-slider > .product-item{width:50%;margin-right:0;padding:0 5px;vertical-align:top;}

/* Data Bulletin Board */
.data-bulletin-board{margin-top:0;margin-bottom:20px;}
.bulletin-board-area{float:none;width:100%;}
.bulletin-board-area:first-of-type{margin-right:0;margin-bottom:20px;}
.bulletin-board-area .section-header{margin-bottom:23px;padding-bottom:0;border-bottom-width:0;}

.post-item-area .post-item{margin-bottom:15px;padding-bottom:13px;border-bottom:1px solid #262626;}
.post-item-area .post-item:nth-child(4){display:none;}
.post-item .post-image{width:115px;}
.post-item .post-contents{width:calc( 100% - 115px );padding-left:13px;}
.post-item .post-contents .date time{font-size:10px;}
.post-item .post-contents > .title{margin-bottom:8px;}
.post-item .post-contents > .title a{max-height:57px;font-size:13px;}
.post-item .post-contents .hashtag{max-height:17px;}
.post-item .post-contents .hashtag a{margin-top:3px;padding-bottom:0;font-size:11px;}

.bulletin-board-area:nth-of-type(2) .post-item-area .post-item:last-child{padding-bottom:0;border-bottom-width:0;}


}

/*:*:*:*:*:*:*:* TABLET *:*:*:*:*:*:*:*/
@media all and (min-width:768px) and (max-width:1279px){

/* Common */
.section-header h2{font-size:18px;}
.section-footer .btn-more-details{height:25px;line-height:25px;background:url(../images/nav/mo/btn-more-details-2ba480df9660df777071513a710c9ba8.png) 100% 50% no-repeat;background-size:auto 10px;}

/* Key Visual */
.popular-keywords{margin-bottom:45px;}
.key-visual .text-area .slogan{margin-bottom:16px;font-size:18px;}

/* Key Words */
.key-visual{width:calc( 100% - 225px );height:380px;}
.keywords-area{width:210px;height:380px;padding:25px;}
.keywords-list .list-item a{height:30px;line-height:30px;}
.keywords-list .list-item a .number{width:25px;font-size:13px;}
.keywords-list .list-item a .keywords{width:calc( 100% - 25px );font-size:13px;line-height:30px;}

/* 정방형 */
.popular-keywords-type-02 .key-visual{width:calc( (100% - 226px) / 2 - 8px );}

/* 1:2 비율 */
.popular-keywords-type-03 .key-visual:nth-of-type(odd){width:calc( (100% - 228px) * ( 32.289628 / 100 ) );margin-right:1.761252vw;}
.popular-keywords-type-03 .key-visual:nth-of-type(even){width:calc( (100% - 228px) * ( 65.949119 / 100 ) );}

/* 2:1 비율 */
.popular-keywords-type-04 .key-visual_20210706_2{width:calc( (126% - 226px) / 2 - 8px );}
.popular-keywords-type-04 .key-visual_20210706_1{width:calc( (63% - 90px) / 2 - 8px );}
.popular-keywords-type-04 .key-visual:nth-of-type(odd){width:calc( (100% - 228px) * ( 65.949119 / 100 ) );margin-right:1.761252vw;}
.popular-keywords-type-04 .key-visual:nth-of-type(even){width:calc( (100% - 228px) * ( 32.289628 / 100 ) );}

/* Latest Products */
.latest-products{}
.latest-products .product-item figcaption{font-size:13px;}

/* Data Bulletin Board */
.data-bulletin-board{margin-top:0;margin-bottom:45px;}
.post-item .post-image{width:150px;}
.post-item .post-contents{overflow:hidden;width:calc( 100% - 150px );height:160px;padding-left:20px;}
.post-item .post-contents > .title{margin-bottom:10px;}
.post-item .post-contents > .title a{max-height:69px;font-size:17px;line-height:1.4;}
.post-item .post-contents .hashtag{max-height:41.2px;}
.post-item .post-contents .hashtag a{padding-bottom:0;font-size:12px;}

}
@media all and (min-width:768px) and (max-width:915px){
	
.popular-keywords-type-04 .key-visual_20210706_1{width:calc( (60% - 90px) / 2 - 8px );}
}
/*:*:*:*:*:*:*:* PC *:*:*:*:*:*:*:*/
@media all and (min-width:1280px){

/* Common */
.section-footer .btn-more-details:hover{background:url(../images/nav/btn-more-details-on-99db89fc0c6cb4a88effe1ce163e816d.png) 100% 50% no-repeat;color:#fff;}

/* Data Bulletin Board */
.post-item .post-contents > .title a:hover{color:#00d3ff;}
.post-item .post-contents a:hover .title,
.post-item .post-contents a:hover .explanation{color:#00d3ff;}
/*
.post-item .post-contents > .title a:hover .ellip,
.post-item .post-contents > .title a:hover .ellip-line{background:linear-gradient(to right, #00d3ff, #bc95d2, #d9c2cb);-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
*/
.post-item .post-contents .hashtag a:hover{color:#fff;}
.post-item .post-contents .hashtag a:hover:after{width:100%;background-color:#fff;}

/* Key Visual */
.key-visual .text-area .slogan{padding:0 50px;}
[class*="popular-keywords-type-0"] .key-visual .text-area .slogan{padding:0 65px;}
[class*="popular-keywords-type-0"] .key-visual .text-area .slogan2{padding:0 0px;}

}
