@charset "utf-8";

/* 리스트 */
.board-list-wrap {padding:clamp(90px, calc(160 / var(--inner) * 100vw ), 160px) 0;}
.board-list-wrap.bg {background:#f8f8f8;}

.board-heading {text-align:center; margin-bottom:clamp(35px, calc(55 / var(--inner) * 100vw ), 55px);}
.board-heading h2 {font-size:clamp(20px, calc(42 / var(--inner) * 100vw ), 42px); line-height:1.3em;}

.board-categorys {margin-bottom:clamp(50px, calc(120 / var(--inner) * 100vw ), 120px); text-align:center;}
.board-categorys .swiper-wrapper {display:inline-flex; width:auto; max-width:100%; margin:0 auto;}
.board-categorys .swiper-slide {width:auto; padding:0 clamp(5px, calc(13 / var(--inner) * 100vw ), 13px);}
.board-categorys .link-item {display:block; min-width:135px; padding:11px 15px; background:#fff; border:1px solid #000; border-radius:50px; text-align:center; font-size:clamp(12px, calc(18 / var(--inner) * 100vw ), 18px); font-weight:300; line-height:1.3em;}
.board-categorys .link-item.active {background:#000; color:#fff;}

.works-list {display:grid; grid-template-columns:repeat(3, 1fr); gap:var(--space-100) var(--space-30);}
.works-list .link-item {display:block;}
.works-list .link-item .image {margin-bottom:clamp(15px, calc(20 / var(--inner) * 100vw ), 20px); aspect-ratio:1/1; border-radius:var(--border-radius-24); overflow:hidden;}
.works-list .link-item .image img {width:100%; height:100%; object-fit:cover; transition:.4s;}
.works-list .link-item .title {max-height:2.7em; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; font-size:font-size:clamp(16px, calc(24 / var(--inner) * 100vw ), 24px); line-height:1.35em; font-weight:700;}
.works-list .link-item .text {margin-top:var(--space-5); color:#888888; font-size:clamp(12px, calc(18 / var(--inner) * 100vw ), 18px); line-height:1.35em;}
.works-list .link-item:hover .image img {transform:scale(1.1);}

.news-list {display:grid; grid-template-columns:repeat(4, 1fr); gap:var(--space-100) var(--space-30);}
.news-list .link-item {display:block;}
.news-list .link-item .image {margin-bottom:clamp(15px, calc(20 / var(--inner) * 100vw ), 20px); aspect-ratio:327/190; background:#f8f8f8; border-radius:var(--border-radius-24); overflow:hidden;}
.news-list .link-item .image img {width:100%; height:100%; object-fit:cover; transition:.4s;}
.news-list .link-item .title {max-height:2.7em; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; font-size:font-size:clamp(16px, calc(24 / var(--inner) * 100vw ), 24px); line-height:1.35em; font-weight:700;}
.news-list .link-item .text {margin-top:var(--space-10); color:#888888; font-size:clamp(12px, calc(18 / var(--inner) * 100vw ), 18px); line-height:1.35em;}
.news-list .link-item:hover .image img {transform:scale(1.1);}

.more-button-area {text-align:center; margin-top:clamp(40px, calc(100 / var(--inner) * 100vw ), 100px);}

/* 상세보기 */
.works-hero {aspect-ratio:1920/634; margin-top:var(--header-height); overflow:hidden;}
.works-hero img {width:100%; height:100%; object-fit:cover;}

.works-detail {padding:clamp(50px, calc(130 / var(--inner) * 100vw ), 130px) 0 clamp(100px, calc(200 / var(--inner) * 100vw ), 200px);}
.works-detail .heading {text-align:center; margin-bottom:clamp(45px, calc(150 / var(--inner) * 100vw ), 150px);}
.works-detail .heading .title {font-family:var(--font-serif); font-size:clamp(32px, calc(92 / var(--inner) * 100vw ), 92px); font-weight:400; line-height:1.3em;}
.works-detail .heading .text {margin-top:clamp(20px, calc(40 / var(--inner) * 100vw ), 40px);  font-size:clamp(14px, calc(24 / var(--inner) * 100vw ), 24px); line-height:1.5em;}
.works-detail .heading .category {margin-top:clamp(20px, calc(30 / var(--inner) * 100vw ), 30px); color:#898989; font-size:clamp(12px, calc(18 / var(--inner) * 100vw ), 18px); line-height:1.3em;}
.works-detail .imgs {display:grid; gap:clamp(25px, calc(90 / var(--inner) * 100vw ), 90px) 0; max-width:1175px; margin:0 auto;}

.news-detail {padding:clamp(100px, calc(160 / var(--inner) * 100vw ), 160px) 0; background:#f8f8f8;}
.news-detail .contain {max-width:1280px;}
.news-detail .heading {text-align:center; padding-bottom:clamp(20px, calc(40 / var(--inner) * 100vw ), 40px); border-bottom:1px solid #d8d8d8;}
.news-detail .heading .category {display:inline-block; margin-bottom:clamp(16px, calc(25 / var(--inner) * 100vw ), 25px); min-width:135px; padding:11px 15px; background:#fff; border:1px solid #000; border-radius:50px; text-align:center; font-size:clamp(12px, calc(18 / var(--inner) * 100vw ), 18px); font-weight:300; line-height:1.3em;}
.news-detail .heading .title {font-size:clamp(25px, calc(44 / var(--inner) * 100vw ), 44px); font-weight:700; line-height:1.3em;}
.news-detail .heading .date {margin-top:clamp(12px, calc(30 / var(--inner) * 100vw ), 30px); color:#898989; font-size:clamp(12px, calc(18 / var(--inner) * 100vw ), 18px); line-height:1.3em;}
.news-detail .content {padding:clamp(25px, calc(60 / var(--inner) * 100vw ), 60px) 0 clamp(50px, calc(120 / var(--inner) * 100vw ), 120px); margin-bottom:clamp(50px, calc(75 / var(--inner) * 100vw ), 75px); border-bottom:1px solid #282828;}
.news-detail .inner-content {max-width:1024px; margin:0 auto;}

.btn-list {display:inline-flex; justify-content:center; align-items:center; width:clamp(180px, calc(255 / var(--inner) * 100vw ), 255px); height:clamp(50px, calc(75 / var(--inner) * 100vw ), 75px); border:0; cursor:pointer; background:#282828; color:#fff; font-size:clamp(17px, calc(24 / var(--inner) * 100vw ), 24px); font-weight:400; line-height:1.3em;}