:root {
    --color-portfolio-01: #CBDA0A;
    --color-portfolio-02: #1E1850;
    --color-portfolio-03: #EE4525;
}

.sec-03 .box1,
.sec-03 .box2,
.sec-03 .box3,
.sec-03 .box4 {display: flex;justify-content: center;align-items: center;aspect-ratio: 1;position: relative;}
.sec-03 .box1 img {aspect-ratio: 1; object-fit: contain;}
.sec-03 .box2 {background-color: var(--color-portfolio-02);}
.sec-03 .box3 {background-color: var(--color-portfolio-03);}

.sec-03 { padding: 0 70px; overflow: hidden; }
.sec-03 > div { background-color: var(--color-portfolio-01);}
.sec-03 .box2 img,
.sec-03 .box3 img { width: 80%; }
.sec-03 .box4 {flex-direction: column;justify-content: flex-end;align-items: flex-start;padding: 0;}
.sec-03 .box4 h2 {font-size: clamp(1.3rem, 4vw, 4rem);margin-bottom: 0;font-weight: 400;}
.sec-03 .box2 span,
.sec-03 .box3 span {position: absolute;top: 10px;right: 15px;color: white;font-size: clamp(0.8rem, 1vw, 1rem);}
.sec-03 .box4 span {position: absolute;top: 10px;right: 25px;color: black;font-size: clamp(0.8rem, 1vw, 1rem);}

.sec-05-img-wrapper {padding: 24px 0;}
.sec-05 .column1 .img1 {width: 100%;aspect-ratio: 9 / 16;object-fit: cover;}
.sec-05 .column1 .img2 {width: 100%;aspect-ratio: 16 / 9;margin-top: 24px;object-fit: cover;}
.sec-05 .column2 .img1 {width: 100%;aspect-ratio: 16 / 10.5;object-fit: cover;}
.sec-05 .column2 .img2 {width: 100%;aspect-ratio: 1;margin-top: 24px;object-fit: cover;}

.sec-06 img {width: 100%; aspect-ratio: 16 / 9; object-fit: contain;}

.sec-07-main{display: flex;gap:24px;}
.sec-07-main .column1,
.sec-07-main .column2{background-color: var(--color-portfolio-01);}
.sec-07-main .column1{ width:60%;}
.sec-07-main .column2{ width:40%;}
.sec-07-main .column1 img{ aspect-ratio: 16 / 9; object-fit: cover;}
.sec-07-main .column2 img{ aspect-ratio: 16 / 14; object-fit: cover;}

.sec-08 img {width: 100%; aspect-ratio: 16 / 9; object-fit: contain;}


@media (max-width: 1366px) {
    .sec-05 .column2 .img1 { aspect-ratio: 16 / 10.4;}
}

@media (max-width: 1280px) {

}

@media (max-width: 992px) {
    .sec-05 .column2 .img1 { aspect-ratio: 16 / 10.2;}
}

@media (max-width: 768px) {

}

@media (max-width: 767px) {
    .sec-05 .column2 { margin-top: 24px;}
    .sec-07-main { flex-direction: column; }
    .sec-07-main .column1, .sec-07-main .column2{ width:100%;}
}

@media (max-width: 576px) {
	
    .sec-03 .box2 span,.sec-03 .box3 span { top: 4px; right: 10px;}
    .sec-03 .box4 span { top: 4px; right: 15px;}
}