@charset "utf-8";

/* 최신글 슬릭 슬라이더 */


.adcontent { 
height:auto; 
margin:5px 0 0px; 
border: 1px solid #ccc; /* 회색 테두리 */
padding: 5px 10px 5px 10px; /* 테두리 안쪽 여백 */
background-color: #f1f1f1; /* 배경색 */
}

.icon-star { 
padding: 0px 0px 0px 0px;
display:flex; 
align-items:center; 
font-size:0.9rem;
font-weight:500; 
color: #c99918;
}

.icon-star2 { 
padding: 0px 0px 10px 0px;
display:flex; 
align-items:center; 
font-size:1rem;
font-weight:500; 
color: #000000;
}

.li_write span { margin:0 5px; color:#e9e9e9; }



.widgets-post-slick{position:relative;margin-bottom:40px;background:#fff;box-shadow:0px 0px 40px 0px rgba(0,0,0,0.05);}
.post-slick{border-radius:10px;overflow:hidden;display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;}
.post-slick .editor-picked-left{border-right:1px solid #c8e5ea;box-shadow:0 0px 15px rgba(0,0,0,0.15);}
.col-left{position: relative;background:#d4f4f9;width: 100%;padding-right: 0px;padding-left: 0px;-ms-flex:0 0 25%;flex:0 0 25%;max-width:25%;}

.col-right{position: relative;background:#fff; width: 100%; -ms-flex:0 0 100%;flex:0 0 75%;max-width:100%;}

.editor-picked{padding:30px}
.editor-picked h4{font-size:18px;}
.editor-picked p{font-size:13px;color:#889097;margin-top:20px !important;margin-bottom:30px !important;}
.editor-picked a.read-more{font-size:12px;border:1px solid;padding:6px 8px;}
/*.editor-picked a.read-more:hover{color:rgb(233, 27, 35);}*/
.post-slick-arrow{float:right;}
button.slick-arrow{background:none;border:0;position:relative;padding:0;margin:0 5px;}
button.slick-arrow [class^="flaticon-"]::before{font-size:15px;}

.slick-dots button{cursor:pointer;}
.slick-dots li.slick-active button{background:#ef3f48;}
.slick-dots li.slick-active button{border-color:#ef3f48;}
.slick-dots{display:-webkit-box;display:flex;-webkit-box-pack:center;justify-content:center;width:100%;margin:0;padding:0;list-style-type:none;padding-top:30px;text-align:center;}
.slick-dots li{margin:0 2px;}
.slick-dots button{display:block;height:8px;width:8px;border:2px solid #B2B2B2;background:transparent;text-indent:-9999px;padding:0;border-radius:6px;}
.slick-dots li.slick-active button{width:20px;}

.post-slick-items{padding:10px 15px 0px 15px; display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;margin-right: -15px;margin-left: -15px}
.post-slick-items .slider-single{position: relative;max-width: 100%;width: 100%;padding-right: 10px;padding-left: 10px;-ms-flex-preferred-size: 0;flex-basis: 0;-ms-flex-positive: 1;flex-grow: 1;}

.post-slick-items .post-title{font-size:1.25rem; font-family:TheJamsil, Noto Sans; margin-bottom:10px;  text-align: center;  }

.post-slick-items .text-limit-2-row{overflow:hidden !important; display:-webkit-box !important; -webkit-line-clamp:2 !important; -webkit-box-orient:vertical;}

.post-slick-items .lt_img img, 
.post-slick-items.lt_img video{max-width:100%;width:100%;height:auto;border-radius:0px;overflow:hidden;}
.post-slick-items .entry-meta{font-size:12px;color:#889097;margin-top:10px;padding-right:5px;padding-left:5px;}
.post-slick-items .entry-meta.meta-1 span{margin-right:10px;}

.post-slick-items .fa-lock {display:inline-block;line-height:14px;width:16px;font-size:0.833em;color:#4f818c;background:#cbe3e8;text-align:center;border-radius:2px;font-size:12px;border:1px solid #cbe3e8;vertical-align:middle}
.post-slick-items .slick_icon {display:inline-block;width:16px;line-height:16px;font-size:0.833em;color:#23db79;background:#b9ffda;text-align:center;border-radius:2px;margin-left:2px;font-weight:bold;vertical-align:middle}
.post-slick-items .hot_icon {display:inline-block;width:16px;line-height:16px;font-size:0.833em;color:#ff0000;background:#ffb9b9;text-align:center;border-radius:2px;vertical-align:middle}
.post-slick-items .fa-caret-right {color:#bbb}
.post-slick-items .fa-download {display:inline-block;width:16px;line-height:16px;font-size:0.833em;color:#daae37;background:#ffefb9;text-align:center;border-radius:2px;vertical-align:middle}
.post-slick-items .fa-link {display:inline-block;width:16px;line-height:16px;font-size:0.833em;color:#b451fd;background:#edd3fd;text-align:center;border-radius:2px;vertical-align:middle}

.widgets-post-slick .img-hover-scale{overflow:hidden;position:relative;}
.widgets-post-slick .img-hover-scale img{-webkit-transition:-webkit-transform .5s;transition:-webkit-transform .5s;-o-transition:transform .5s;transition:transform .5s;transition:transform .5s,-webkit-transform .5s;}
.widgets-post-slick .img-hover-scale:hover img{-webkit-transform:scale(1.1);-ms-transform:scale(1.1);transform:scale(1.1);-webkit-transition:-webkit-transform .5s;transition:-webkit-transform .5s;-o-transition:transform .5s;transition:transform .5s;transition:transform .5s,-webkit-transform .5s;}

.widgets-post-slick .top-right-icon{position:absolute;top:15px;right:15px;border-radius:50px;width:30px;height:30px;text-align:center;line-height:30px;z-index:3;color:#fff;-o-transition:all 0.4s ease;transition:all 0.4s ease;-webkit-transition:all 0.4s ease;-moz-transition:all 0.4s ease;transition-duration:0.4s;-ms-transition:all 0.4s ease;}
.widgets-post-slick .top-right-icon i{top:2px;}

.widgets-post-slick .img-hover-scale:hover .top-right-icon,
.widgets-post-slick .img-hover-slide:hover .top-right-icon{margin-top:-3px;-webkit-box-shadow:0 5px 11px 0 rgba(0,0,0,0.18),0 4px 15px 0 rgba(0,0,0,0.15);-moz-box-shadow:0 5px 11px 0 rgba(0,0,0,0.18),0 4px 15px 0 rgba(0,0,0,0.15);box-shadow:0px 5px 11px 0px rgba(0,0,0,0.18),0px 4px 15px 0px rgba(0,0,0,0.15);-o-transition:all 0.4s ease;transition:all 0.4s ease;-webkit-transition:all 0.4s ease;-moz-transition:all 0.4s ease;transition-duration:0.4s;-ms-transition:all 0.4s ease;}

.widgets-post-slick .hover-box-shadow{-o-transition:all 0.4s ease;transition:all 0.4s ease;-webkit-transition:all 0.4s ease;-moz-transition:all 0.4s ease;transition-duration:0.4s;-ms-transition:all 0.4s ease;}
.widgets-post-slick .hover-box-shadow:hover{-webkit-box-shadow:0 5px 11px 0 rgba(0,0,0,0.18),0 4px 15px 0 rgba(0,0,0,0.15);-moz-box-shadow:0 5px 11px 0 rgba(0,0,0,0.18),0 4px 15px 0 rgba(0,0,0,0.15);box-shadow:0px 5px 11px 0px rgba(0,0,0,0.18),0px 4px 15px 0px rgba(0,0,0,0.15);-o-transition:all 0.4s ease;transition:all 0.4s ease;-webkit-transition:all 0.4s ease;-moz-transition:all 0.4s ease;transition-duration:0.4s;-ms-transition:all 0.4s ease;}

.ellipsis { display:block; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; overflow:hidden; }

.bg-red { background-color: rgb(233, 27, 35); color: #fff;}
.bg-darkred { background-color: rgb(170, 60, 63); color: #fff;}
.bg-green { background-color: rgb(140, 195, 70); color: #fff; }
.bg-blue { background-color: rgb(52, 152, 219); color: #fff; }
.bg-violet{ background-color: rgb(85, 60, 125); color: #fff; }
.bg-yellow { background-color: rgb(241, 196, 15); color: #fff; }
.bg-navy { background-color: rgb(50, 60, 70); color: #fff; }
.bg-black {background-color: #333; color: #fff; }

@media (max-width: 768px) {
    .post-slick-items .slider-single {
        padding-right: 5px;
        padding-left: 5px;
        -ms-flex-preferred-size: 0;
        flex-basis: 50%; /* 한 줄에 2개씩 */
        max-width: 50%;
    }

.widgets-post-slick {
    margin-bottom: 5px;
}

.post-slick-items {
    padding: 10px 15px 0px 15px;
}

 .hide-mobile {
        display: none; /* 카테고리 숨기기 */
    }

.post-slick-items .post-title {
    font-size: 1.1rem;
margin-bottom: 5px;
}

.icon-star {
    font-size: 0.8rem;
}

.icon-star2 {
    font-size: 0.85rem;
padding: 5px 0px 0px 0px;
}

.adcontent {
padding: 5px 5px 5px 5px;
}

}



.slick_lt { 
    position: relative;
    margin-top: 30px;
    margin-bottom: 10px;
    background: #fff;
    padding: 0px 0px;
    width: 100%;
    box-sizing: border-box; /* 패딩과 테두리를 포함한 전체 너비 계산 */
}

.slick_lt ul { 
    margin: 0 0 0px; 
    padding: 0; 
    list-style: none; 
    border: none; 
    /* ul 요소의 기본 여백과 패딩을 제거하고, 목록 스타일을 없애며, 테두리를 설정합니다. */
}

.slick_lt li { 
border-top: 1px solid #f3f3f3; 
    padding: 4px 10px;  
    font-family: 'Noto Sans KR', sans-serif; /* Noto Sans KR 폰트를 사용합니다. */
    font-size: 1.1rem;
    font-weight: 400; /* Regular 스타일을 지정합니다. */
    /* li 요소에 상단 테두리와 내부 여백을 설정하고, 기본 폰트 크기를 지정합니다. */
    overflow: hidden !important; /* 영역을 벗어나는 텍스트 숨김 */
    text-overflow: ellipsis !important; /* 영역을 벗어나는 텍스트 말줄임표 표시 */
    white-space: nowrap !important; /* 텍스트를 한 줄로 표시 */
}

.slick_lt li a {
    color: #000 !important; 
    display: block; /* a 요소를 블록 요소로 설정 */
    width: 100%; /* a 요소의 너비를 100%로 설정 */
    overflow: hidden !important; /* 영역을 벗어나는 텍스트 숨김 */
    text-overflow: ellipsis !important; /* 영역을 벗어나는 텍스트 말줄임표 표시 */
    white-space: nowrap !important; /* 텍스트를 한 줄로 표시 */
}

.slick_lt li:first-child { 
    border: 0;   /* 첫 번째 li 요소의 테두리를 제거합니다. */
    padding: 4px  10px;

}

.slick_lt li i { 
    color: #9da4bc;  
    /* i 요소의 텍스트 색상을 설정합니다. */
}

.slick_lt li .fa-heart { 
    color: #ff0000; 
    /* 클래스가 'fa-heart'인 i 요소의 텍스트 색상을 빨간색으로 설정합니다. */
}

.slick_lt li .slick_icon { 
    display: inline-block; 
    padding: 0 3px; 
    line-height: 14px; 
    font-size: 0.833em; 
    color: #fff; 
    background: #c56bed; 
    /* 새로운 아이콘을 인라인 블록으로 표시하고, 패딩, 줄 높이, 폰트 크기, 텍스트 색상, 배경색을 설정합니다. */
}

.slick_lt li .cnt_cmt { 
    color: #ff3970; 
    /* 클래스가 'cnt_cmt'인 요소의 텍스트 색상을 설정합니다. */
 padding: 0px 5px; 
}

.slick_lt .slick_title { 
    display: flex;
    align-items: center; /* 세로 중앙 정렬 */
    justify-content: space-between; /* 제목과 더보기 링크를 양쪽으로 배치 */
    font-size: 1.2rem;
    background-color: #e6e3e3; 
    margin-bottom: 10px; /* 제목과 콘텐츠 사이의 간격 설정 */
    border-radius:0px;
    margin: 10px 10px 10px 10px;
}

.slickboard-title {
    color: #000;
    text-decoration: none; /* 링크의 기본 밑줄 제거 */
    flex: 1; /* 제목이 가능한 최대 너비를 가지도록 설정 */
}

.slick_title img {
    margin-right: 5px; /* 이미지와 제목 사이에 간격 추가 */
    margin-left: 10px;
    width: 32px;   /* 원하는 너비 (픽셀 단위) */
    height: 32px;  /* 원하는 높이 (픽셀 단위) */
    }

.slick_more {
    color: #253dbe;
    border-radius: 3px;
    text-align: center;
    display: inline-block;
    padding: 5px 15px; /* 적절한 패딩 추가 */
    font-size: 0.9rem; /* 폰트 크기 조정 */
    transition: color 0.3s, background-color 0.3s; /* 호버 효과에 부드러운 전환 추가 */
    text-decoration: none; /* 링크의 기본 밑줄 제거 */
}

.slick_more:hover {
    color: #777;
    background-color: #e0e0e0; /* 호버 시 배경 색상 변경 */
}

/* 모바일 뷰에서 폰트 크기 조절 */
@media (max-width: 767px) {
  /* 모바일에서 제목 글자 수를 줄이기 위한 스타일 */
    .slick_lt li a {
        max-width: 280px; /* 모바일에서 최대 너비 설정 */
    }

   .slick_lt li { 
        font-size: 1.125em; 
        /* 모바일 폰트 크기를 조절합니다. */
    }
    .slick_lt {
        padding: 0px 0px; /* 모바일에서 좌우 패딩 조정 */
        margin-top: 10px;
        margin-bottom: 0px;
    }

    .slick_lt .slick_title {
      font-size: 1.1em;
      margin-top: 20px; 
      margin-bottom: 0px;
    }

.slick_title img {
    margin-right: 5px; /* 이미지와 제목 사이에 간격 추가 */
    width: 24px;   /* 원하는 너비 (픽셀 단위) */
    height: 24px;  /* 원하는 높이 (픽셀 단위) */
    }
}