/* =========================
브로셔 영역
========================= */

.sv-brochures{

margin-top:50px;
padding:30px;
border-radius:16px;
min-height:400px;

background-size:cover;
background-position:center;

position:relative;
overflow:hidden;

}

/* 이미지 위에 희미한 레이어 */

.sv-brochures::before{

content:"";
position:absolute;
inset:0;

background:
radial-gradient(circle at 1px 1px, rgba(0,0,0,.04) 1px, transparent 0),
rgba(255,255,255,0.92);

background-size:18px 18px;

}

/* 내용이 위로 올라오게 */

.sv-brochures > *{

position:relative;
z-index:1;

}
.sv-brochure-desc{

margin-top:10px;
margin-bottom:25px;

font-size:18px;
line-height:1.6;

color:#555;

}
.view-link{
	color:#fff;
	font-size:12px;
	padding:3px 5px;
	border:1px solid #ccc;
	background:rgba(9,9,9,0.8);
}
.view-link:hover{
	background:#ddd;
	color:#000;
}
.sv-brochure-desc span{
	font-size:13px;
}
.sv-brochure-list{
display:flex;
flex-wrap:wrap;
gap:10px;
margin-top:20px;
}

.sv-brochure-btn{
background:#fff;
border:1px solid #ddd;
padding:20px 24px;
font-size:20px;
border-radius:6px;
cursor:pointer;
transition:.1s;
}

.sv-brochure-btn:hover{
background:#ccc;
}


/* =========================
모달
========================= */

.sv-brochure-modal{
    position:fixed;
    inset:0;
    background:rgba(0,0,0,.8);
    display:none;
    z-index:9999;
}

.sv-brochure-modal.active{
    display:flex;
    align-items:center;
    justify-content:center;
}

#brochureFrame{
    width:90%;
    height:90%;
    background:#fff;
}

.sv-brochure-close{
    position:absolute;
    top:5px;
    right:5px;
	width:40px;
	height:40px;
    font-size:20px;
    background:#fff;
    border:none;
    color:#000;
    cursor:pointer;
	border-radius:50%;
}
.sv-brochure-close:hover{
	background:#ccc;
}

/* =========================
모달 열리면 스크롤 막기
========================= */

body.modal-open{
overflow:hidden;
}


/* FAB 숨김 */

body.modal-open .sv-fab{
display:none;
}

body.modal-open .sv-mobile-bar{
display:none;
}

.view-info{
	display:inline-block;
	font-size:14px;
	line-height:1.8;
}
.view-info strong{
	color:#fbb101;
}
@media( max-width: 768px ){
	.sv-brochures{
		margin:50px 5px;
		padding:10px 15px 24px;
	}
	.view-info {
		font-size: 12px;
		word-break:keep-all;
	}
    .m-br{
        display:block;
		height: 15px;
    }
	.sv-brochure-desc{
		font-size:14px !important;
		color:#000 !important;
	}
	.sv-brochure-btn{
		font-size:15px;
		display:block;
		width:100%;
	}
}