@charset "UTF-8";
.news{background: #F2F8F8; padding-block: 200px;}
.news a{text-decoration: none;}
.news-area,.content-inn,.breadcrumbs{max-width: 1024px; margin: auto;}
.title span{color: #bcbcbc; letter-spacing: 1px; font-size: 14px; margin-left: 15px;}
.news-area-list a{display: flex; justify-content: space-between; align-items: center; gap: 15px; padding: 1.2rem 1em; border-bottom: thin solid #ddd;}
.news-area-list span,.news-arrow{color: #1F717A;}
.news-area-list a > span{width: 10%;}
.news-title{width: 65%;}
.news-arrow{position: relative; width: 100px;}
.news-arrow::after{content: ''; position: absolute; top: 50%; right: 0; transform: translateY(-50%); width: 16px; height: 16px; background: no-repeat center/auto 100% url("../img/arrow-right-line_g.svg"); transition: all .3s ease;}
.list-btn:hover{background: #F2F8F8;}
.news-area-list:nth-child(1) a,
.news-area-list:first-of-type a {border-top: thin solid #ddd;}
.news-area-list a{transition: all .3s ease;}
.news-area-list a:hover{background: #e5f9f9;}
.news-area-list a:hover .news-arrow::after{right: -10px;}
.news-list-btn{margin: 80px 0 0 auto;}
.news-area-list a{width: 100%; min-height: 80px;}
.category{display: flex; flex-direction: column;}

.title-box{margin-bottom: 80px;}
.title-box,.news-filter{display: flex; justify-content: space-between; gap: 20px;}
.emerald-dropdown { display: inline-flex; align-items: center; position: relative;}
.emerald-dropdown::after { position: absolute; right: 15px; width: 10px; height: 7px; background-color: #535353; clip-path: polygon(0 0, 100% 0, 50% 100%); content: ''; pointer-events: none;}
.emerald-dropdown select { appearance: none; min-width: 130px; height: 2.8em; padding: .4em calc(.8em + 30px) .4em .8em; border: none; border-bottom: 1px solid #d0d0d0; font-size: 1em; cursor: pointer; background-color: transparent;}
.emerald-dropdown select:focus {outline: none;}

.breadcrumbs{margin-bottom: 80px;}
.breadcrumbs a{text-decoration: underline;}
.material-icons{font-size: 20px;}


/* single
-----------------------------------------------------------*/
h2{font-size: 1.6rem; border-bottom: 1px dotted #ccc; padding-bottom: 10px; margin-block: 15px 30px;}
.article_header{display: flex; gap: 20px; align-items: center;}
.news-category-list{display: flex; gap: 10px;}
.news-category{ font-size: 12px; border: thin solid #ddd; padding: 0 .8rem; border-radius: 100vh; background: #fff;}
.time{color: #00A6B9;}
.article_body{padding-bottom: 200px;}
.btn{margin: auto;}
.news-content img{margin-block: 30px; border-radius: 10px;}


/* mobile
-----------------------------------------------------------*/
@media (max-width: 767px) {
    .main-content-wrapper{flex-wrap: wrap; padding: 0 5% 80px 5%; min-height: auto;}
    .main-content-left{display: none;}
    .main-content-right{width: 100%; padding: 0;}

    .news{padding: 150px 5%;}
    .title-box{flex-wrap: wrap;}
    .news-area-list a{flex-wrap: wrap; justify-content: start;}
    .news-area-list a > span{width: 90px;}
    .category{flex-direction: row; width: 120px;}
    .news-title{width: 100%;}
    .news-list-btn{margin: 30px 0 0 0; width: 100%;}
    .article_body{padding-bottom: 100px;}

    .breadcrumbs{margin-bottom: 30px;}
    .breadcrumbs a{font-size: 2.4vw;}
    .breadcrumbs .category{display: inline;}
    .post-post { display: inline-block; max-width: 40vw; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; vertical-align: bottom;}


}

@media (max-width: 375px) {

}