@charset "utf-8";
/* ===================================================== */
/* MAIN-COMMON */
.body-main #skip-nav::before {content: ''; position: fixed; inset: 0; pointer-events: none; background-color: #000; z-index: 9999; animation: fade-out .8s ease-in .2s both;}
.section { background: #fff no-repeat center/cover;}
.sec-header {position: relative; text-align: center;}
.sec-tit {font-weight: 700; font-size: 4rem; letter-spacing: -0.02em; color:#222;}
.sec-desc {font-size: 1.6rem; font-weight: 600; color:#ababab; text-transform: uppercase; }

@media (hover: hover) and (pointer: fine) {
}
@media (max-width: 1280px){
}
@media (max-width: 1024px){
}
@media (max-width: 768px){
}
@media (max-width: 576px){
}
@media (max-width: 480px){
}
/* MAIN-COMMON */
/* ===================================================== */


/* ===================================================== */
/* MAIN-VISUAL */
.main__visual {background-image: url('../images/main/section01_bg01.jpg'); padding:10rem 0 5rem;}
.main__visual-header {display: flex; align-items: center; justify-content: space-between; margin-bottom:8rem;}
.main__visual-header .text {color:#222; font-weight: 700;}
.main__visual-header .text .stxt {font-size:2.5rem;}
.main__visual-header .text .title {font-size:4rem;}
.main__visual-header .text .stxt .char{
	--vdd: 1s; /* visual-desc 애니메이션 시간 */
	animation: fade-down .5s ease-out calc(1.5s + (var(--vdd) / var(--char-total) * var(--char-index))) both; }

.main__visual-header .text .title .char {
	--vdd: 2s; /* visual-desc 애니메이션 시간 */
	animation: fade-in .5s ease-out calc(0.8s + (var(--vdd) / var(--char-total) * var(--char-index))) both;}

.main__visual-header .text .title em {color:var(--color-main); font-weight: 900;}
.main__visual-header .certi {display: flex; align-items: center; gap:4rem;}

.main__visual-list {border-radius: 2rem; overflow: hidden; height:37rem;}
.main__visual-list .item { overflow: hidden; height:100%;}
.main__visual-list .item-box {width:100%;  height:100%; position: relative;  display: flex; align-items: center; }
.main__visual-list .item-box::before {content:''; display: block; width:100%;  height:100%; background:transparent no-repeat center/cover;transition: all 10s ease-in-out; position: absolute;}
.main__visual-list .item.nth-1 .item-box::before {background-image:url('../images/main/main_visual01.png');}
.main__visual-list .item.nth-2 .item-box::before{background-image:url('../images/main/main_visual02.png');}
.main__visual-list .item.nth-3 .item-box::before{background-image:url('../images/main/main_visual03.png');}
.main__visual-list .item.nth-4 .item-box::before{background-image:url('../images/main/main_visual04.png');}
.main__visual-list .item.nth-5 .item-box::before{background-image:url('../images/main/main_visual05.png');}
.main__visual-list .item.nth-6 .item-box::before{background-image:url('../images/main/main_visual06.png');}
.main__visual-list .item.nth-7 .item-box::before{background-image:url('../images/main/main_visual07.png');}
.main__visual-list .item.nth-8 .item-box::before{background-image:url('../images/main/main_visual08.png');}
.main__visual-list .item.nth-9 .item-box::before{background-image:url('../images/main/main_visual09.png');}
.main__visual-list .item.nth-10 .item-box::before{background-image:url('../images/main/main_visual10.png');}
.main__visual-list .swiper-slide-active .item-box::before {transform:scale(1.2)}

.main__visual-list .copy-box {color:#fff;padding:0 6rem;}
.main__visual-list .copy-box h3 {font-weight: 700; font-size:3rem; margin-bottom:3rem;}
.main__visual-list .copy-box p {font-weight: 600; font-size:1.6rem;}
.main__visual-list .swiper-slide-active .copy-box h3{animation: fade-down 1s linear both;}
.main__visual-list .swiper-slide-active .copy-box p {animation: fade-up 1s linear both;}


@media (max-width: 1024px){
	.main__visual {padding:8rem 0 5rem;}
}

@media (max-width: 768px){
	.main__visual {padding:6rem 0 5rem;}
	.main__visual-header { margin-bottom:5rem;}

	.main__visual-header {flex-direction: column; text-align: center; gap:2rem;}
	.main__visual-header .certi {gap:3rem; }
	.main__visual-header .certi img {max-height:5rem; }

	.main__visual-list {height:32rem;}

	.main__visual-list .copy-box {padding:0 5rem;}
	.main__visual-list .copy-box h3 {font-size:2.6rem; margin-bottom:2rem;}
}


@media (max-width: 480px){
	.main__visual-header { margin-bottom:4rem;}

	.main__visual-header .text .stxt {font-size:2.4rem;}
	.main__visual-header .text .title {font-size:3.6rem;}

	.main__visual-header .certi {gap:3rem; }
	.main__visual-header .certi img {max-height:4rem; }

	.main__visual-list .copy-box {padding:0 4rem; letter-spacing: 0;}
	.main__visual-list .copy-box h3 {font-size:2.4rem; margin-bottom:2rem;}
	.main__visual-list .copy-box h3 br {display: none;}
}





.main__visual-control {display: flex; align-items: center; justify-content: center; margin-top:2rem; gap:2.5rem;}
.main__visual-control .paging {width:28rem; position: relative; display: flex; align-items: center;}

.main__visual-control .progress{width:calc(100% - 6rem); height:2px; background-color: #ababab; position: absolute; top:50%; left:50%; transform: translate(-50%, -50%);}
.main__visual-control .progress span{--pro: 0; width: calc(100% * var(--pro)); max-width: 100%; height:100%; display: block; background:#000; position: absolute; top:0; left:0;}
.main__visual-control .pagination {display: flex; align-items: center; justify-content: space-between; font-size: 1.4rem; font-weight: 700;}
.main__visual-control .pagination .current {color:#222;}
.main__visual-control .pagination .total {color:#878787;}


.main__visual-control .btn-wrap {display: flex; gap:1rem;}
.main__visual-control .slide-btn {width:1.4rem; height:1.4rem; cursor: pointer; position: relative; z-index: 2; font-size:0;}
.main__visual-control .slide-btn.next {transform: rotate(180deg);}
.main__visual-control .slide-btn::before,
.main__visual-control .slide-btn::after {content:''; display: block; width:0.9rem; height:3px; background-color: rgba(0, 0, 0, 1); border-radius: 4px; position: absolute; top:50%; left:0; transition:all 0.3s ease-in-out;}
.main__visual-control .slide-btn::before{transform: translate(0, -150%) rotate(-45deg);}
.main__visual-control .slide-btn::after{transform: translate(0, 50%) rotate(45deg);}

.main__visual-control .slide-btn span {display: block; height:3px; width:100%; border-radius: 4px; background-color: rgba(0, 0, 0, 1); position: absolute; top:50%; left:0; transform: translate(0, -50%); transition:all 0.3s ease-in-out;}
.main__visual-control .slide-btn.swiper-button-disabled {opacity: 0.3; pointer-events: none;}

.main__visual-control .slide-btn:hover::before,
.main__visual-control .slide-btn:hover::after,
.main__visual-control .slide-btn:hover span {background-color: var(--color-main);}

@media (hover: hover) and (pointer: fine) {
}

@media (max-width: 768px) {
	.main__visual-control .slide-btn::before,
	.main__visual-control .slide-btn::after {width:1rem; height:3px; }
	.main__visual-control .slide-btn::before{transform: translate(0, -125%) rotate(-45deg);}
	.main__visual-control .slide-btn::after{transform: translate(0, 25%) rotate(45deg);}
}
@media (max-width: 576px) {
	.main__visual-control .slide-btn span{height:2px;}
	.main__visual-control .slide-btn::before,
	.main__visual-control .slide-btn::after {width:0.9rem; height:2px; }
	.main__visual-control .slide-btn::before{transform: translate(0, -175%) rotate(-45deg);}
	.main__visual-control .slide-btn::after{transform: translate(0, 75%) rotate(45deg);}
	
}

/* MAIN-VISUAL */
/* ===================================================== */


/* ===================================================== */
/* Section 2 : Featured Products*/
.main__products {background-color: #f7f7f7; padding:10rem 0 0 0;}
.main__products-wrap {position: relative; padding:2rem 0 6rem; z-index: 1; margin-top:3rem;}
.main__products-wrap::after {content:''; display: block; width:200%; height:38%; background-color: var(--color-main); position: absolute; bottom:0; left:50%; transform: translate(-50%, 0); z-index: -1;}


.main__products-list .swiper-wrapper {align-items: stretch; height:auto !important;}
.main__products-list .item { width:auto; margin:0 2rem;width:40rem !important;}
.main__products-list .item a{display: block;  background-color: #fff;  border:1px solid #eeee; border-radius: 1rem; padding:2rem; height: 100%; width:100%; transition: all 0.3s ease-in-out;}
.main__products-list .item .thumb {overflow:hidden; position: relative;}
.main__products-list .item .thumb span {display: flex; align-items: center; justify-content: center; transition: all 0.5s ease-in-out;}
.main__products-list .item .thumb span img {max-height: 100%;transition: all 0.5s ease-in-out;}

.main__products-list .item .thumb .on {position: absolute; top:50%; left:50%; transform: translate(-50%, -50%); width:100%; height:100%; opacity: 0; }
.main__products-list .item .thumb .on img {transition: all 0.5s ease-in-out;}

.main__products-list .item a:hover {border-color: var(--color-main); transform: translateY(-2rem);}
.main__products-list .item a:hover .thumb .off {opacity: 0;}
.main__products-list .item a:hover .thumb .on {opacity: 1;}
.main__products-list .item a:hover .thumb .on img {transform: scale(1.2);}
.main__products-list .item a:hover .thumb.once .off {opacity: 1;}
.main__products-list .item a:hover .thumb.once .off img {transform: scale(1.2);}


.main__products-list .item .title {color:#222; font-size:2rem; font-weight: 700; height:8rem; display: flex; align-items: center;justify-content: center; width:100%; border-top:1px solid #222; text-align: center;  letter-spacing: -0.015em;}
.main__products-list .item .title span {text-overflow: ellipsis; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; line-clamp: 2; -webkit-line-clamp: 2;}

.main__products-list .item .desc {border-top:1px solid #eaeaea; padding:2rem 0 0 0; transition: all 0.3s ease-in-out;}
.main__products-list .item .desc.on {display: none;}
.main__products-list .item .desc span {display: block; text-align: center; font-weight: 700; font-size:1.5rem; letter-spacing: -0.015em; line-height: 1.1;}
.main__products-list .item .txt-1 {color:#1c78a5; margin-bottom:1rem;}
.main__products-list .item .txt-2 {color:var(--color-main);}

.main__products-list .item a:hover .title {color:var(--color-main);}
.main__products-list .item a:hover .desc.off {display: none;}
.main__products-list .item a:hover .desc.on {display: block;}
.main__products-list .item a:hover .desc.once.off {display: block;}



.main__products-control {margin-top:6rem; display: flex; align-items: center; justify-content: center; gap:3rem;}
.main__products-control .pagination {position: relative; width: 32rem; height:1px; background-color: var(--color-white-a2);}
.main__products-control .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {height:3px; background-color: #fff; top:-1px;}


.main__products-control .slide-btn {width:2rem; height:2rem; cursor: pointer; position: relative; z-index: 2; font-size:0;}
.main__products-control .slide-btn.next {transform: rotate(180deg);}
.main__products-control .slide-btn::before,
.main__products-control .slide-btn::after {content:''; display: block; width:100%; height:3px; background-color: rgba(255, 255, 255, 1); border-radius: 4px; position: absolute; top:50%; left:0; transition:all 0.3s ease-in-out;}
.main__products-control .slide-btn::before{transform: translate(0, calc(-50% - 0.6rem)) rotate(-45deg);}
.main__products-control .slide-btn::after{transform: translate(0,  calc(0.6rem - 50%)) rotate(45deg);}

.main__products-control .slide-btn span {display: block; font-size:0; overflow: hidden; text-indent:-999999px;}
.main__products-control .slide-btn.swiper-button-disabled {opacity: 0.3; pointer-events: none;}

.main__products-control .slide-btn:hover::before,
.main__products-control .slide-btn:hover::after{background-color: #000;}
.main__products-control .slide-btn:hover::before{transform: translate(-1rem, calc(-50% - 0.6rem)) rotate(-45deg);}
.main__products-control .slide-btn:hover::after{transform: translate(-1rem,  calc(0.6rem - 50%)) rotate(45deg);}

@media (hover: hover) and (pointer: fine) {
}
@media (max-width: 1280px) {
}
@media (max-width: 1024px) {
}
@media (max-width: 768px) {
}
@media (max-width: 576px) {
}
@media (max-width: 480px) {
}
/* Section 2 : Featured Products*/
/* ===================================================== */


/* ===================================================== */
/* SECTION 3 New Arrivals */

.main__arrivals {padding: 6rem 0 10rem;}
.main__arrivals-wrap { margin:2rem calc(var(--inner-padding) - 1rem) 0;position: relative; z-index: 1;}




.main__arrivals-list {overflow: hidden; padding:1rem 0;}
.main__arrivals-list .item {padding: 1rem 1rem ;}
.main__arrivals-list .item a{display: flex;  background-color: #fff;  border:1px solid #e5e5e5; border-radius: 1rem; padding:1.8rem; height: 100%; width:100%; transition: all 0.3s ease-in-out; gap:4rem; position: relative; align-items: center;}
.main__arrivals-list .item a::after {content:''; display: block; width:1px; height:100%; background-color: #e5e5e5; position: absolute; top:0; left:calc(40% + 2rem);}
.main__arrivals-list .item .thumb {overflow:hidden; position: relative; flex-shrink: 0; width: 40%;}

.main__arrivals-list .item .thumb span {display: flex; align-items: center; justify-content: center; transition: all 0.5s ease-in-out;}
.main__arrivals-list .item .thumb span img {max-height: 100%;}

.main__arrivals-list .item .thumb .on {position: absolute; top:50%; left:50%; transform: translate(-50%, -50%); width:100%; height:100%; opacity: 0; }
.main__arrivals-list .item .thumb .on img {transition: all 0.5s ease-in-out;}

.main__arrivals-list .item a:hover {border-color: var(--color-main); transform: translateY(-1.2rem);}
.main__arrivals-list .item a:hover .thumb .off {opacity: 0;}
.main__arrivals-list .item a:hover .thumb .on {opacity: 1;}
.main__arrivals-list .item a:hover .thumb .on img {transform: scale(1.2);}


.main__arrivals-list .item .cate {font-size:1.3rem; line-height: 1.8; font-weight: 600; color:#929292; display: inline-flex; align-items: center; margin-bottom:1rem; text-decoration: underline; text-underline-offset: 0.4em; text-decoration-thickness: 1px;}

.main__arrivals-list .item .cate::after {content:''; display: inline-block; width: 0.8rem; height: 0.8rem; border: solid #929292; border-width: 1px 1px 0 0; transform: rotate(45deg); margin-left:0.5rem;}

.main__arrivals-list .item .cate-1 {font-size:1.5rem; text-overflow: ellipsis; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; line-clamp: 2; -webkit-line-clamp: 2; letter-spacing: -0.015em; line-height: 1.3; color:#929292; margin-bottom:2rem;}

.main__arrivals-list .item .title {color:#222; font-size:2rem; font-weight: 700;  width:100%; letter-spacing: -0.015em; transition: all 0.3s ease-in-out;}
.main__arrivals-list .item .title span {text-overflow: ellipsis; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; line-clamp: 3; -webkit-line-clamp: 3;}

.main__arrivals-list .item a:hover .cate-1{color:#000;}
.main__arrivals-list .item a:hover .title {color:var(--color-main);}





.main__arrivals-wrap .slide-btn {width:5rem; height:5rem; cursor: pointer; position: absolute; font-size:0; border-radius: 50%; background-color: #fff; box-shadow: 0 0 1.5rem var(--color-black-a2); display: flex; justify-content: center; align-items: center; top:50%; left:0; transform: translate(calc(1rem - 50%), -50%) rotate(-135deg); z-index:2; transition: all 0.3s ease-in-out;}
.main__arrivals-wrap .slide-btn.next {left:auto; right:0; transform: translate(calc(50% - 1rem), -50%) rotate(45deg);}
.main__arrivals-wrap .slide-btn span {display: block; font-size:0; overflow: hidden; text-indent:-999999px; border:solid #000; border-width: 2px 2px 0 0; width:1.4rem; height:1.4rem; transition: all 0.3s ease-in-out;}
.main__arrivals-wrap .slide-btn.swiper-button-disabled {opacity: 0.2; pointer-events: none;}

.main__arrivals-wrap .slide-btn:hover{background-color: #000; transform: translate(calc(0rem - 50%), -50%) rotate(-135deg);}
.main__arrivals-wrap .slide-btn.next:hover {background-color: #000; transform: translate(calc(50% - 0rem), -50%) rotate(45deg);}
.main__arrivals-wrap .slide-btn:hover span{border-color:#fff;}

.main__arrivals-control {margin-top:1rem;}
.main__arrivals-control .pagination{display: flex; align-items: center; justify-content: center;}
.main__arrivals-control .pagination .swiper-pagination-bullet{width: 1rem; height:1rem; margin:0 0.6rem;}
.main__arrivals-control .pagination .swiper-pagination-bullet-active{background-color: #242424;}




@media (hover: hover) and (pointer: fine) {
}
@media (max-width: 1480px) {
	.main__arrivals-wrap .slide-btn {transform: translate(0, -50%) rotate(-135deg);}
	.main__arrivals-wrap .slide-btn.next {transform: translate(0, -50%) rotate(45deg);}

	.main__arrivals-wrap .slide-btn:hover{transform: translate(-0.5rem, -50%) rotate(-135deg);}
	.main__arrivals-wrap .slide-btn.next:hover {transform: translate(0.5rem, -50%) rotate(45deg);}
}
@media (max-width: 1024px) {
}
@media (max-width: 768px) {
	.main__arrivals-wrap { margin:2rem var(--inner-padding) 0;position: relative; z-index: 1;}
	.main__arrivals-list .item {padding: 1rem 0rem ;}

	.main__arrivals-wrap .slide-btn {transform: translate(-1rem, -50%) rotate(-135deg);}
	.main__arrivals-wrap .slide-btn.next {transform: translate(1rem, -50%) rotate(45deg);}

	.main__arrivals-wrap .slide-btn:hover{transform: translate(-2rem, -50%) rotate(-135deg);}
	.main__arrivals-wrap .slide-btn.next:hover {transform: translate(2rem, -50%) rotate(45deg);}
}
@media (max-width: 576px) {
}
@media (max-width: 480px) {
	.main__arrivals-wrap .slide-btn {left:0; top:100%; transform: translate(-0.5rem, -25%) rotate(-135deg);}
	.main__arrivals-wrap .slide-btn.next {transform: translate(0.5rem, -25%) rotate(45deg);}
	.main__arrivals-wrap .slide-btn:hover{transform: translate(-1rem, -25%) rotate(-135deg);}
	.main__arrivals-wrap .slide-btn.next:hover {transform: translate(1rem, -25%) rotate(45deg);}
}
/* SECTION 3 New Arrivals */
/* ===================================================== */


/* ===================================================== */
/*Section 4 Client*/
.main__client {background: #808080 url('../images/main/section04_bg01.jpg') 98% 100% no-repeat; --cbanner-height:10rem;}
.main__client-wrap {display: flex; padding:4.8rem 0; gap:10rem;}
.main__client .sec-header {flex-shrink: 0;}
.main__client .sec-header .sec-desc {background-color: var(--color-main); color:#fff; font-weight: 700; font-size:1.4rem; padding:0 1rem;}
.main__client .sec-header .sec-tit {color:#fff; font-size: 5rem;}
.main__client-inner { width: 100%; display: flex; gap:1.8rem;}
.main__client-list {height:var(--cbanner-height); overflow: hidden; width:100%;}

.main__client-list .item {display: flex; gap:1rem;}
.main__client-list .item a {display: flex; align-items: center; justify-content: center; height:100%;  background-color: #fff; overflow: hidden;border-radius: 1rem; overflow: hidden; flex:1 1; width:25%; padding:1rem 1.5rem;}
.main__client-list .item a img {max-height:calc(var(--cbanner-height) - 2rem); transition: all 0.3s ease-in-out;}
.main__client-list .item a:hover {cursor: default;}
.main__client-list .item a:hover img {transform: scale(1.2);}


.main__client-control {display: flex; flex-direction: column; align-items: center; justify-content: center; gap:4rem; position: relative;}
.main__client-control::after {content:''; display: block; width:4px; height:4px; border-radius: 50%; background-color: #fff; position: absolute; top:50%; left:50%; transform:translate(-50%, -50%);}

.main__client .slide-btn {width:2rem; height:2rem; cursor: pointer; position: relative; z-index: 2;transform:rotate(90deg); transition: all 0.3s ease-in-out;}
.main__client .slide-btn.next {transform:rotate(270deg);}


.main__client .slide-btn span {display: block; height:4px; width:100%; border-radius: 4px; background-color:#fff; position: absolute; top:50%; left:0; transform: translate(0, -50%); font-size:0; text-indent:-99999px; transition: all 0.3s ease-in-out;}
.main__client .slide-btn span::before,
.main__client .slide-btn span::after {content:''; display: block; width:1.2rem; height:4px; background-color: #fff; border-radius: 4px; position: absolute; top:50%; left:0; transition: all 0.3s ease-in-out;}
.main__client .slide-btn span::before{transform: translate(0, -150%) rotate(-45deg);}
.main__client .slide-btn span::after{transform: translate(0, 50%) rotate(45deg);}

.main__client .slide-btn.swiper-button-disabled {opacity: 0.3; pointer-events: none;}

.main__client .slide-btn:hover { padding-left:1rem; transform: translate(0, -0.4rem) rotate(90deg);}
.main__client .slide-btn.next:hover {transform: translate(0, 0.4rem) rotate(270deg);}
.main__client .slide-btn:hover span::before,
.main__client .slide-btn:hover span::after,
.main__client .slide-btn:hover span {background-color: var(--color-main);}

@media (max-width: 1280px) {
	.main__client {--cbanner-height:9rem;}
	.main__client-wrap {gap:5rem;}
}

@media (max-width: 960px) {
	.main__client {--cbanner-height:8rem;}
	.main__client-wrap {gap:5rem;}
}

@media (max-width: 768px) {
	.main__client-wrap {flex-direction: column; gap:3rem;}
	.main__client .sec-header .sec-desc {display: inline-block;}
	.main__client .sec-header .sec-tit {font-size: 4rem;}
}

@media (max-width: 768px) {
	.main__client .slide-btn span {height:3px; border-radius: 3px;}
	.main__client .slide-btn span::before,
	.main__client .slide-btn span::after {width:1.1rem; height:3px;}
	.main__client .slide-btn span::before{transform: translate(0, -175%) rotate(-45deg);}
	.main__client .slide-btn span::after{transform: translate(0px, 50%) rotate(45deg);}

	



} 
@media (max-width: 480px) { 
	.main__client .slide-btn span::before{transform: translate(0, -150%) rotate(-45deg);}
	.main__client .slide-btn span::after{transform: translate(0px, 25%) rotate(45deg);}
}
/*Section 4 Client*/
/* ===================================================== */




/* ===================================================== */
/* Section 5 : Articles */
.main__article {background-color: #f7f7f7; padding:7rem 0 0 0; margin-top:8rem;}
.main__article-wrap {position: relative; padding-bottom:11rem; z-index: 1; margin-top:2rem;}
.main__article-wrap::before {content:''; display: block; width:calc(100% + var(--inner-padding) * 2); height:56.5%; background:#2c789e url('../images/main/section05_bg01.jpg') 98% 20% no-repeat; position: absolute; bottom:0; left:50%; transform: translate(-50%, 0); z-index: -1;}

.main__article-list {overflow: hidden; padding:2rem 0;}
.main__article-list .swiper-wrapper {align-items: stretch; height:auto !important;}
.main__article-list .item { margin-left:0px; }
.main__article-list .item a {display: block;  background-color: #fff;  border:1px solid #eeee; border-radius: 1rem; height: 100%; width:100%; transition: all 0.3s ease-in-out; position: relative; overflow: hidden; padding-bottom:8rem;}
.main__article-list .item .thumb {position: relative; padding:2rem 2rem 0;}
.main__article-list .item .thumb span {display: flex; align-items: center; justify-content: center; transition: all 0.5s ease-in-out; overflow: hidden;}
.main__article-list .item .thumb span img {max-height: 100%;}

.main__article-list .item .thumb img {transition: all 0.5s ease-in-out;}

.main__article-list .item:hover {z-index: 1;}
.main__article-list .item a:hover {border-color: #2c789e; transform: translateY(-2rem);}
.main__article-list .item a:hover .thumb img {transform: scale(1.2);}


.main__article-list .item .title {color:#222; font-size:1.8rem; line-height:1.4; font-weight: 700; height:16rem; display: flex; align-items: center;justify-content: center; width:100%; border-top:1px solid #e5e5e5; letter-spacing: -0.015em; padding:0 2rem;}
.main__article-list .item .title span {text-overflow: ellipsis; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; line-clamp: 3; -webkit-line-clamp: 3;}

.main__article-list .item .desc {padding:0 2rem;}
.main__article-list .item .desc span {display: block; font-weight: 500; font-size:1.5rem; letter-spacing: -0.05em; line-height: 1.5;text-overflow: ellipsis; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; line-clamp: 4; -webkit-line-clamp: 4;}
.main__article-list .item .txt-1 {color:#666;}


.main__article-list .item a:hover .title {color:#2c789e;}
.main__article-list .item a:hover .txt-1{color:var(--color-main);}



.main__article-list .more {width:8rem; height:7rem; position: absolute; bottom:-10rem; right:1.2rem; transition: all 0.3s ease-in-out; z-index: 1;}
.main__article-list .more::after {content:''; display: block; width:4.6rem; height:4rem; position: absolute; top:-1.46rem; right:0.9rem; background: url('../images/main/ico_hover01.png') 50% 50% no-repeat; background-size: contain; transition: all 0s ease-in-out; z-index: -1; opacity: 1;}
.main__article-list .more span {display: block; height:100%; width: 100%; font-size:0; overflow: hidden; text-indent: -9999px;; clip-path: polygon(50% 0, 100% 100%, 0 100%); background-color: #3a3c3e; position: relative;}

.main__article-list .more span::before,
.main__article-list .more span::after {content:''; display: block; width:3rem; height:2px; background-color: #fff; position: absolute; top:65%; left:50%; transition: all 1s ease-in-out;}
.main__article-list .more span::before {transform: translate(-50%, -50%);}
.main__article-list .more span::after {transform: translate(-50%, -50%) rotate(90deg);}

.main__article-list .item a:hover .more {bottom:0;}
.main__article-list .item a:hover .more span::before {transform: translate(-50%, -50%) rotate(450deg);}
.main__article-list .item a:hover .more span::after {transform: translate(-50%, -50%) rotate(540deg);}


.main__article-control .slide-btn {width:3rem; height:3rem; cursor: pointer; position: absolute; z-index: 2; font-size:0; top:35%; left:-6rem;}
.main__article-control .slide-btn.next {transform: rotate(180deg); left:auto; right:-6rem;}
.main__article-control .slide-btn::before,
.main__article-control .slide-btn::after {content:''; display: block; width:100%; height:4px; background-color:#222; border-radius: 4px; position: absolute; top:50%; left:0; transition:all 0.3s ease-in-out;}
.main__article-control .slide-btn::before{transform: translate(0, calc(-50% - 0.9rem)) rotate(-45deg);}
.main__article-control .slide-btn::after{transform: translate(0,  calc(0.9rem - 50%)) rotate(45deg);}

.main__article-control .slide-btn span {display: block; font-size:0; overflow: hidden; text-indent:-999999px;}
.main__article-control .slide-btn.swiper-button-disabled {opacity: 0.3; pointer-events: none;}

.main__article-control .slide-btn:hover::before,
.main__article-control .slide-btn:hover::after{background-color: #000;}
.main__article-control .slide-btn:hover::before{transform: translate(-1rem, calc(-50% - 0.9rem)) rotate(-45deg);}
.main__article-control .slide-btn:hover::after{transform: translate(-1rem,  calc(0.9rem - 50%)) rotate(45deg);}

@media (hover: hover) and (pointer: fine) {
}


@media (max-width: 1560px) {
	.main__article-control .slide-btn {left:-3.5rem;}
	.main__article-control .slide-btn.next {right:-3.5rem;}
}

@media (max-width: 1480px) {
	.main__article-control .slide-btn {top:-6rem; left:1rem;}
	.main__article-control .slide-btn.next {right:1rem;}
}
@media (max-width: 1024px) {
}
@media (max-width: 768px) {
}
@media (max-width: 576px) {
}
@media (max-width: 480px) {
}
/* Section 5 : Articles */
/* ===================================================== */