@charset "utf-8";

/* 레이아웃 */
#cont1 { position:relative; padding:4rem 0 0; margin-bottom:5rem;}
	#cont1::before { position:absolute; left:0; top:0; z-index:-1; content:''; width:100%; height:calc(100% - 4rem); background:url(/images/mbrh/cont1_bg.png) no-repeat center/cover, linear-gradient(270deg, #EDF2F6,#F3EDF6,#FAF3F0,#FAF8F0); border-radius:0 0 0 12.5rem; }
	#cont1::after { position:absolute; right:0; bottom:0; z-index:-2; content:'DALSEONG-GUN COUNCIL'; font-weight:700; color:#F8F8FB; font-size:4rem; border-radius:0 0 0 12.5rem; }
#cont2 .inner { display:flex; }
#cont3 { padding:4rem 0 8rem; background:url(/images/mbrh/cont3_bg.jpg) repeat-x center bottom/contain; }

@media (max-width:1280px){

}

@media (max-width:1024px){
	#cont1 { padding:3rem 0 0; margin-bottom:3rem; }
	#cont1::before { height:100%; border-radius:0; }
	#cont2 .inner { flex-direction:column; }
}

@media (max-width:768px){

}


/* 공통 */
section h2 { font-size:2rem; }
section .btn-more{ position:absolute; right:0; top:0; display:flex; align-items:center; justify-content:center; width:2.25rem; height:2.25rem; border-radius:2rem; background:url(/images/council/main/more.svg) no-repeat center, linear-gradient(141deg,rgba(99, 103, 255, 1) 0%, rgba(69, 74, 87, 1) 100%); overflow:hidden;}
section .btn-more::before{content:''; position:absolute; left:0; top:0; display:block; width:100%; height:100%; background:rgba(255,255,255,0.2); opacity:0; transition:.3s;}




/* 의원 프로필 */

.mProfile { display:flex; }

.mProfile .pic-wrap { position:relative; max-width:42rem; width:48%; margin-right:4%; }
.mProfile .pic-wrap .pic { position:relative; padding-top:68.25%; border-radius:5rem; overflow:hidden; }
.mProfile .pic-wrap .pic img { position:absolute; left:50%; top:50%; width:100%; height:100%; object-fit:cover; transform:translate(-50%,-50%);}

.mProfile .pf-wrap { position:relative; max-width:42rem; width:48%; }
.mProfile .pf-wrap h2 { font-size:2rem; font-weight:400; margin:.5rem 0 3rem; }
.mProfile .pf-wrap h2 strong { position:relative; font-size:1.5em; }
.mProfile .pf-wrap h2 strong::before { position:absolute; left:-1.25rem; bottom:-.75rem; width:calc(100% + 3.625rem); height:1.25rem; content:''; background:url(/images/mbrh/mbr_name.png) no-repeat center/contain; }

.mProfile .btn-wrap { position:absolute; right:4rem; bottom:-1.5rem; display:flex; }
.mProfile .btn-wrap li { margin-left:16px; }
.mProfile .btn-wrap a { display:flex; flex-direction:column; align-items:center; width:7.5rem; padding:1.25rem 0; background:#fff; border-radius:1.5rem; border:1px solid #DEE5F1; box-shadow:0 .4rem 1rem rgba(0,0,0,.1); color:#716FA9; }
.mProfile .btn-wrap a i { display:block; width:1.125rem; height:1.125rem; background-color:#716FA9; mask:no-repeat center/contain; margin-bottom:.8rem; }
.mProfile .btn-wrap a.btn-greeting i { mask-image:url(/images/mbrh/m_ico_greeting.png); }
.mProfile .btn-wrap a.btn-hist i { mask-image:url(/images/mbrh/m_ico_list.png); }
.mProfile .btn-wrap a.btn-min i { mask-image:url(/images/mbrh/m_ico_min.png); }

.mProfile .pf-wrap dl { display:flex; flex-wrap:wrap; }
.mProfile .pf-wrap dl dt { display:flex; align-items:center; width:7.5rem; margin-bottom:1rem; }
.mProfile .pf-wrap dl dt i { width:1.5rem; height:1.5rem; display:block; background:no-repeat center/contain; margin-right:.5rem; }
.mProfile .pf-wrap dl dt span { width:5.5rem; text-align: justify; text-align-last: justify; text-justify: inter-character; word-break: keep-all; }
.mProfile .pf-wrap dl dd { width:calc(100% - 8.5rem); font-weight:700; margin-left:.75rem; margin-bottom:1rem; }

.mProfile .pf-wrap dl dt i.ico-profile { background-image:url(/images/mbrh/m_ico_profile.png); }
.mProfile .pf-wrap dl dt i.ico-map { background-image:url(/images/mbrh/m_ico_district.png); }
.mProfile .pf-wrap dl dt i.ico-party { background-image:url(/images/mbrh/m_ico_party.png); }
.mProfile .pf-wrap dl dt i.ico-tel { background-image:url(/images/mbrh/m_ico_call.png); }
.mProfile .pf-wrap dl dt i.ico-mail { background-image:url(/images/mbrh/m_ico_email.png); }


@media (max-width:1024px){
	.mProfile { flex-direction:column; }
	
	.mProfile .pic-wrap,
	.mProfile .pf-wrap { max-width:100%; width:100%; margin-right:0; }
	
	.mProfile .btn-wrap { right:0; width:100%; }
	.mProfile .btn-wrap li { width:33% }
	.mProfile .btn-wrap a { padding:.75rem 0; width:100%; }
	
	.mProfile .pic-wrap { margin-bottom:3rem; }
	
	.mProfile .pf-wrap { margin-bottom:1rem; }
	.mProfile .pf-wrap .slogan img { max-width:100%; }
	.mProfile .pf-wrap h2 { font-size:1.375rem; margin:.5rem 0 1.75rem }
}


/* 최근게시물 */
.mNotice { position:relative; max-width:calc(100% - 30rem); width:100%; margin-right:2.5rem; }

.mNotice .tab { display:flex; align-items: end; }
.mNotice .tab .tab-item ~ * { display:none; }

.mNotice .post-list { position:absolute; left:0; top:3.875rem; width:100%; }

.mNotice .tab .tab-item { font-size:1.625rem; color:#3A3F37; background:transparent; margin-bottom:1.5rem; margin-right:2rem; }
.mNotice .tab .tab-item.on { position:relative; z-index:1; font-size:2rem; font-weight:700; }
.mNotice .tab .tab-item.on::before { position:absolute; right:-1rem; top:-1rem; z-index: -1; content:''; width:2rem; height:2rem; background:#DDDBE9; border-radius:1rem; }

.mNotice .tab .tab-item.on ~ * { display:flex; }
.mNotice .tab .tab-item.on ~ ul { flex-direction:column; }

.mNotice .post-item:not(:first-child) { border-bottom:1px dashed #ddd; }
.mNotice .post-item a { border-radius:1rem; }
.mNotice .date { padding-left:1.25rem; background:url(/images/icon/ico_calendar.svg) no-repeat left center/1rem; }

.mNotice .post-item.none,
.mNotice .post-item:first-child a { position:relative; width:100%; background:#F9F7FE; padding:2rem 8.25rem 2rem 1.5rem; }
.mNotice .post-item.none .tit,
.mNotice .post-item:first-child a .tit { display: block; width: 100%; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; }
.mNotice .post-item:first-child a p { color:#8A949E; display: block; width: 100%; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; }
.mNotice .post-item:first-child .date { position:absolute; right:1.5rem; top:2rem; }

.mNotice .post-item:not(:first-child) a { display:flex; justify-content:space-between; padding:1rem; color:#58616A; }
.mNotice .post-item:not(:first-child) a:hover,
.mNotice .post-item:not(:first-child) a:focus { background:#F9F9F9; }

@media (max-width:1024px){
	.mNotice { max-width:100%; margin-right:0; }
	.mNotice .tab .tab-item { font-size:1.25rem; margin-right:1rem; }
	.mNotice .tab .tab-item.on { font-size:1.375rem; }
	.mNotice .tab .tab-item.on::before {  right:-.75rem; top:-.75rem; width:1.5rem; height:1.5rem; }
	
	.mNotice .post-list { top:3rem; }
	
	.mNotice .post-item:first-child .date { position:static; margin:0 0 0 auto }
	.mNotice .post-item:first-child a { display:flex; flex-direction:column; align-items:end; padding:1.5rem 1.25rem 1.5rem; }
	.mNotice .post-item:not(:first-child) a { padding:.5rem .75rem; }
}

/* 발언영상 */
.mVod { position:relative; max-width:27.5rem; width:100%; }

.mVod .vod-item { position:relative; width:100%; padding-top:66%; border-radius:1rem; background:#ddd; overflow:hidden; }

.mVod .vod-item img { position:absolute; left:50%; top:50%; width:100%; height:100%; object-fit:cover; transform:translate(-50%,-50%); }

.mVod .vod-item .bar { position:absolute; bottom:0; left:0; display:flex; flex-direction:column; width:100%; padding:1rem; background:linear-gradient(rgba(0,0,0,0),rgba(0,0,0,1)); }
.mVod .vod-item.none .bar { background:linear-gradient(rgba(0,0,0,0),rgba(0,0,0,.3)); text-align:center; }
.mVod .vod-item .bar strong { display: block; width: 100%; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; color:#fff; }
.mVod .vod-item .bar .date { color:#ccc; }

@media (max-width:1024px){
	.mVod { max-width:100%; margin-top:2rem;}
}



/* 의정활동사진 */
.mPhoto { position:relative; }
.mPhoto h2 { text-align:center; }

.mPhoto .photo-list { position:relative; overflow:hidden; }


.mPhoto .slick-slide { transition:.4s; padding-top:3.5rem; margin:0 1.25rem; }
.mPhoto .slick-list { margin:0 -1.25rem; }
.mPhoto .slick-current { padding-bottom:3.5rem; padding-top:0; }

/* .mPhoto .item { max-width:44rem; } */
.mPhoto .item a { display:flex; flex-direction:column; width:100%; }

.mPhoto .item .pic { position:relative; width:100%; padding-top:56.25%; background:#ddd no-repeat center/cover; border-radius:1.25rem; margin-bottom:1rem; overflow:hidden; }
.mPhoto .item .pic img { position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover; }

.mPhoto .title { display:block; font-size:1.25rem; text-overflow: ellipsis; white-space: nowrap; margin-bottom:.5rem; overflow: hidden; }
.mPhoto .date { font-size:1rem; opacity:.7; }

.mPhoto .bar { position:absolute; bottom:0; left:50%; display:flex; transform:translateX(-50%); background:#fff; border-radius:5rem; }
.mPhoto .bar button { width:2.5rem; height:2.5rem; background-color:transparent; }

.mPhoto .btn-more { right:calc(50% - 8rem); }

@media (max-width:1440px){
}

@media (max-width:1024px){
	.mPhoto .item { max-width:none; }
}

@media (max-width:768px){
	.mPhoto .photo-list::before,
	.mPhoto .photo-list::after { display:none; }

}