page 6 new
<style type="text/css">.page6-a5 {
width: 420px;
height: 595px;
margin: 0 auto;
background-color: white;
border: none;
box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);
position: relative;
overflow: hidden;
}
.page6 {
position: absolute;
background-repeat: no-repeat;
}
.page6.p1 {
width: 270px;
height: 360px; /* 3:4 세로 비율 */
left: 5mm;
top: 5mm;
z-index: 1;
}
.page6.p2 {
width: 125px;
height: 125px; /* 1:1 정방향 */
right: 0mm;
top: 5mm;
z-index: 1;
}
.page6.p3 {
width: 125px;
height: 227px;
right: 0mm;
top: calc(5mm + 125px + 2mm); /* p2 아래 2mm 여백 */
z-index: 1;
}
.page6-tbox {
position: absolute;
bottom: 10mm;
right: 2mm;
width: 200px;
background: rgba(255, 255, 255, 0.9);
padding: 10px;
box-shadow: 0 0 6px rgba(0,0,0,0.1);
font-size: 10px;
line-height: 1.4;
z-index: 2;
}
.page6-tbox h3 {
font-size: 16px;
margin: 0 0 8px;
}
.page6-tbox p {
margin: 0 0 6px;
}
.page6 img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
@media (max-width: 767px) {
.page6-a5 {
width: 100%;
max-width: 420px;
margin: 0 auto 40px;
}
}
</style>
<div class="page6-a5">
<!-- p1: 상단 왼쪽, 세로 2:3 -->
<div class="page6 p1">
<a data-lightbox="album" data-title="Top Left" href="/files/attach/images/2025/05/14/44c0a7a133cf6750be9b0461f788ce70.jpg">
<img alt="Top Left" src="/files/attach/images/2025/05/14/44c0a7a133cf6750be9b0461f788ce70.jpg" />
</a>
</div>
<!-- p2: 상단 오른쪽, 정방형 1:1 -->
<div class="page6 p2">
<a data-lightbox="album" data-title="Top Right" href="/files/attach/images/2025/05/14/4020a34df72660453772a6f9c00bed58.jpg">
<img alt="Top Right" src="/files/attach/images/2025/05/14/4020a34df72660453772a6f9c00bed58.jpg" />
</a>
</div>
<!-- p3: p2 아래 5mm 간격, 세로형 -->
<div class="page6 p3">
<a data-lightbox="album" data-title="Bottom Right" href="/files/attach/images/2025/05/14/de93bf8cda7cd091f2b003e7aa6d3dd9.jpg">
<img alt="Bottom Right" src="/files/attach/images/2025/05/14/de93bf8cda7cd091f2b003e7aa6d3dd9.jpg" />
</a>
</div>
<!-- 텍스트 박스: 하단 오른쪽 배치 -->
<div class="page6-tbox">
<h3>Desert Echoes</h3>
<p>사막의 아침 공기가 아직 따스함을 품기 전</br>
고요한 장면을 담은 한 컷</p>
<p>#빛 #바람 #침묵</p>
</div>
</div>
by eGrida posted May 14, 2025
