.stories-page .news {
padding: 100px 0 40px;
}
.stories-page .sub-content {
display: block;
text-align: center;
}
.stories-page .personal-blk {
background-color: var(--bg-weak-100);
padding-top: 100px;
}
.modal {
display: none;
position: fixed;
top: 50%;
right: 0;
left: 0;
bottom: -50%;
z-index: 100;
width: 95%;
padding: 0 100px;
margin: 0 auto;
background-color: var(--txt-color);
transform: translateY(-50%);
max-height: 700px;
overflow-y: auto;
border-radius: 10px;
}
.story-overlay {
display: none;
position: fixed;
right: 0;
bottom: 0;
left: 0;
z-index: 99;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.7);
overflow-y: auto;
}
.modal .slider-detail-list{
padding: 100px 0;
}
.modal .slider-detail-list .slider-list {
align-items: center;
}
.modal .slider-detail-list .slider-list img {
height: 100%;
object-fit: cover;
max-height: 570px;
border-radius: 8px;
}
.modal .slider-detail-list .modal-close-btn {
position: absolute;
top: 35px;
right: 35px;
padding: 12px;
border: none;
background: none;
outline: none;
cursor: pointer;
} @media only screen and (min-width:768px) and (max-width:1280px) {
.stories-page .news {
padding: 7.813vw 0 3.125vw;
}
.stories-page .personal-blk {
padding-top: 7.813vw;
}
.modal {
max-height: 54.688vw;
border-radius: 0.781vw;
}
.modal .slider-detail-list{
padding: 7.813vw 0;
}
.modal .slider-detail-list .slider-list img {
max-height: 44.531vw;
border-radius: 0.625vw;
}
.modal .slider-detail-list .modal-close-btn {
top: 2.734vw;
right: 2.734vw;
padding: 0.938vw;
}
} @media all and (max-width:767.9px) {
.stories-page .news {
padding: 50px 0 0;
}
.stories-page .personal-blk {
padding-top: 0;
}
.modal {
max-height: 700.001px;
border-radius: 7.999px;
width: 90%;
padding: 0 30px;
}
.modal .slider-detail-list{
padding: 13.333vw 0;
}
.modal .slider-detail-list .slider-list img {
max-height: 93.333vw;
border-radius: 2.133vw;
}
.modal .slider-detail-list .modal-close-btn {
top: 2.667vw;
right: 0;
padding: 2.133vw;
}
}