/* 메인비주얼 */
.main-visual{width:98%;height:93.5vh;margin:0 auto;border-radius:32px;overflow:hidden;background:#000;}
.main-visual h3{position:absolute;left:4%;top:6%;z-index:10;font-size:20px;}
.main-visual .title{position:absolute;left:4%;bottom:10%;text-align:left;z-index:10;}
.main-visual .title h2{font-size:40px;margin-bottom:0.4em;font-weight:600;line-height:1.4;}
.main-visual .title p{color:#fff;opacity:0.7;font-size:18px;line-height:1.6;}
.main-visual .video{width:100%;height:100%;overflow:hidden;transition:1s;background:#000;z-index:0;}
.main-visual .video video{
	position:absolute;
	top:50%;
	left:50%;
	width:100%;
	transform:translate(-50%,-50%);
	opacity:0.9;
	object-fit:cover;
}

@media all and (min-width:1921px){.main-visual .video video{width:100%;height:auto;}}

/* 키워드 */
.main-keyword{margin-top:2%;}
.main-keyword .inner{display:flex;justify-content:space-between;align-items:center;}
.main-keyword .inner .main-keyword-list{position:relative;width:49%;height:90vh;background:#0f0f0f;border:1px solid #222;border-radius:32px;overflow:hidden;}
.main-keyword .inner .main-keyword-list.list01{text-align:right;background:url(../image/main/main-keyword-list01.jpg) no-repeat 50% / cover;}
.main-keyword .inner .main-keyword-list.list02{text-align:left;background:url(../image/main/main-keyword-list02.jpg) no-repeat 50% / cover;}
.main-keyword .inner .main-keyword-list .title{position:absolute;}
.main-keyword .inner .main-keyword-list.list01 .title{right:6%;top:8%;}
.main-keyword .inner .main-keyword-list.list02 .title{left:6%;bottom:8%;}
.main-keyword .inner .main-keyword-list .title h3{font-size:24px;}
.main-keyword .inner .main-keyword-list .title h2{font-size:54px;font-weight:600;margin:0.1em 0 0.4em;}
.main-keyword .inner .main-keyword-list .title p{opacity:0.6;line-height:1.8;font-size:17px;}

/* 스토리 */
.main-stroy{margin-top:8%;padding:10% 2% 5%;background:url(../image/main/bg-main-stroy.jpg) no-repeat 50% 0 / cover;text-align:left;}
.main-stroy>.title{margin-left:8%;text-align:left;}
.main-stroy>.title h3{color:#9054ff;font-weight:bold;font-size:16px;}
.main-stroy>.title h2{font-size:92px;font-weight:600;margin:0.1em 0 0.2em;}
.main-stroy>.title p{font-size:26px;}
.main-stroy .main-stroy-list{max-width:1400px;margin:0 auto;}
.main-stroy .main-stroy-list .story-list{display:flex;justify-content:space-between;align-items:center;padding:5% 0;border-bottom:1px solid rgba(255,255,255,0.1);}
.main-stroy .main-stroy-list .story-list:last-child{border-bottom:none;}
.main-stroy .main-stroy-list .story-list:nth-child(even){flex-direction:row-reverse;}
.main-stroy .main-stroy-list .story-list .title h3{color:#9054ff;font-weight:bold;font-size:16px;}
.main-stroy .main-stroy-list .story-list .title h2{font-size:48px;font-weight:600;margin:0.1em 0 0.3em;}
.main-stroy .main-stroy-list .story-list .title p{font-size:17px;opacity:0.6;line-height:1.7;}
.main-stroy .main-stroy-list .story-list .icon-list{display:flex;flex-wrap:wrap;width:50%;gap:10px;text-align:center;}
.main-stroy .main-stroy-list .story-list .icon-list li{display:flex;flex-direction:column;align-items:center;width:calc(100%/3 - 10px);padding:24px 0;border:1px solid rgba(255,255,255,0.1);border-radius:16px;box-sizing:border-box;background:rgba(255,255,255,0.04);backdrop-filter:blur(10px);transition:0.3s;}
.main-stroy .main-stroy-list .story-list:hover .icon-list li{background:rgba(255,255,255,0.09);}
.main-stroy .main-stroy-list .story-list:hover .icon-list li span{opacity:1;}
.main-stroy .main-stroy-list .story-list .icon-list li img{width:75px;margin-bottom:8px;}
.main-stroy .main-stroy-list .story-list .icon-list li span{font-size:15px;opacity:0.6;transition:0.3s;}

/* 포트폴리오 */
.main-portfolio{position:relative;padding:8% 0;}
/* .main-portfolio:before,.main-portfolio:after{content:'';position:absolute;top:0;width:25%;height:100%;z-index:10;} */
/* .main-portfolio:before{left:0;background:linear-gradient(90deg,rgba(10,10,10,1) 10%,rgba(10,10,10,0) 100%);} */
/* .main-portfolio:after{right:0;background:linear-gradient(-90deg,rgba(10,10,10,1) 10%,rgba(10,10,10,0) 100%);} */
.main-portfolio .title{margin-bottom:2em;}
.main-portfolio .title h2{font-size:60px;margin-bottom:0.3em;}
.main-portfolio .title p{font-size:20px;opacity:0.7;}
.main-portfolio .main-portfolio-list .swiper-container{margin-bottom:2em;}
.main-portfolio .main-portfolio-list .swiper-slide{background:#fff;padding:32px 0;border-radius:16px;width:auto;max-height:50px;height:auto;}
.main-portfolio .main-portfolio-list .swiper-slide img{display:block;margin:0 auto; width: 80%; height: 100%; object-fit: contain;}
.main-portfolio .main-portfolio-list .swiper-wrapper{transition-timing-function:linear;}

.client_list{max-width:1600px; margin:0 auto;}
.client_list ul{display:flex; flex-wrap:wrap; gap:12px	}
.client_list ul li{width:calc(100% / 8 - 19px);padding:4px; background:#fff;border-radius:8px; overflow: hidden;}
.client_list ul li img{width:95%;}


/* 반응형 (메인~키워드) */
@media all and (max-width:1400px){
	.main-keyword .inner .main-keyword-list h2 img{width:89%;max-width:100%;}
	.main-keyword .inner .main-keyword-list.list02 h2 img{width:70%;max-width:320px;}

}
@media all and (max-width:1200px){
	.main-visual{width:96%;}
	.main-keyword .inner .main-keyword-list .title h3{font-size:20px;}
	.main-keyword .inner .main-keyword-list .title p{font-size:16px;width:80%;float:right;}
	.main-keyword .inner .main-keyword-list .title p br{display:none;}
	.main-keyword .inner .main-keyword-list.list02 .title p{float:none;}
}
@media all and (max-width:1024px){
	.main-visual .title h2{font-size:32px;}
	.main-visual .title p{font-size:17px;}
	.main-visual h3{font-size:16px;}
	.main-visual .video video{top:40%;}
}
@media all and (max-width:786px){
	.main-visual{width:94%;}
	.main-visual h3{font-size:16px;left:auto;right:7%;}
	.main-visual .title{width:85%;left:7%;}
	.main-visual .title h2{font-size:26px;}
	.main-visual .title p br{display:none;}
	.main-keyword .inner{flex-wrap:wrap;gap:16px;}
	.main-keyword .inner .main-keyword-list{width:100%;}
	.main-visual .video video{top:35%;}
}
@media all and (max-width:500px){
	.main-visual .video video{top:28%;}
}



/* ===== CLIENT LIST 기본 (PC : 8열) ===== */
.client_list ul li{display:block;width:calc(100% / 8 - 19px);}
.client_list ul li:nth-child(n + 57){display:none;}

/* ===== 1400px 이하 (6열) ===== */
@media all and (max-width:1400px){
.client_list{max-width:90%;}
.client_list ul li{display:block;width:calc(100% / 6 - 18px);}
.client_list ul li:nth-child(n + 55){display:none;}
}

/* ===== 1200px 이하 (5열) ===== */
@media all and (max-width:1200px){
.main-stroy{margin-top:15%;padding:25vh 2% 5%;background:url(../image/main/bg-main-stroy.jpg) no-repeat 55% 0 / 200%;}
.main-stroy>.title{margin-left:7%;}
.main-stroy>.title h3{font-size:14px;}
.main-stroy>.title h2{font-size:54px;}
.main-stroy>.title p{font-size:18px;}
.main-portfolio .title h2{font-size:54px;}
.main-portfolio .title p{font-size:18px;}
.client_list ul li{display:block;width:calc(100% / 5 - 19px);}
.client_list ul li:nth-child(n + 61){display:none;}
}

/* ===== 1024px 이하 (3열) ===== */
@media all and (max-width:1024px){
.main-stroy{padding:25vh 5% 5%;}
.main-stroy .main-stroy-list .story-list{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;width:100%;padding:13% 0;}
.main-stroy .main-stroy-list .story-list .title{margin-bottom:1em;}
.main-stroy .main-stroy-list .story-list .title h3{font-size:14px;}
.main-stroy .main-stroy-list .story-list .title h2{font-size:40px;}
.main-stroy .main-stroy-list .story-list .title p{font-size:16px;}
.main-stroy .main-stroy-list .story-list .title p br{display:none;}
.main-stroy .main-stroy-list .story-list .icon-list{width:100%;gap:10px;}
.main-stroy .main-stroy-list .story-list .icon-list li img{width:55px;margin-bottom:8px;}
.main-stroy .main-stroy-list .story-list .icon-list li span{font-size:14px;opacity:0.6;transition:0.3s;}
.client_list ul li{display:block;width:calc(100% / 3 - 19px);}
.client_list ul li:nth-child(n + 61){display:none;}
}

/* ===== 768px 이하 ===== */
@media all and (max-width:768px){
.main-stroy .main-stroy-list .story-list .icon-list li img{width:40px;margin-bottom:6px;}
.main-stroy .main-stroy-list .story-list .icon-list li span{font-size:13px;}
.main-portfolio .title h2{font-size:42px;}
.main-portfolio .title p{font-size:17px;}
.main-portfolio .main-portfolio-list .swiper-slide img{max-height:50px;height:auto;}
}