@charset "utf-8";

/* 레이아웃 */
#cont1 { position:relative; width:100%; padding:7.2rem 0 0 0; margin:0 auto; /*display:flex; justify-content:space-between; gap:60px;*/ }
#cont1::before { position:absolute; left:0; top:0; z-index:-1; max-width:100rem; width:52%; height:100%; content:''; background:#ECF1FA; border-radius:0 0 10rem 0; }
#cont2 { position:relative; max-width:140rem; width:100%; padding:7.2rem 0 0 0; margin:0 auto; }
#cont2::before { position:absolute; top:10rem; right:0; content:''; width:calc(100% - 83rem); height:23rem; background:url(/images/mbrh/mbr_dot_bg.png) no-repeat center/contain; }
#cont3 { position:relative; width:100%; padding:12rem 0 0 0; margin:0 auto; }			
#cont3 .inner { position:relative; z-index:1; }

@media (min-width:1281px) and (max-width:1440px){
	#cont1 { position:relative; max-width:100%; width:100%; padding:7.2rem 2.8rem 0; margin:0 auto; }	
	#cont2 { position:relative; max-width:100%; width:100%; padding:7.2rem 2.8rem 0; margin:0 auto; }
	#cont3 { position:relative; max-width:100%; width:100%; padding:7.2rem 0 0; margin:0 auto; }

}

@media (min-width:1025px) and (max-width:1280px){
	#cont1 { position:relative; max-width:100%; width:100%; padding:7.2rem 2.8rem 0; margin:0 auto;  }	
	#cont2 { position:relative; max-width:100%; width:100%; padding:7.2rem 2.8rem 0; margin:0 auto; }
	#cont3 { position:relative; max-width:100%; width:100%; padding:7.2rem 0 0; margin:0 auto; }	
}

@media (min-width:769px) and (max-width:1024px){
	#cont1 { position:relative; max-width:100%; width:100%; padding:6.0rem 2.4rem 0; margin:0 auto; display:block; }	
	#cont2 { flex-direction:column; padding:6.0rem 2.4rem 0; margin:0 auto; }
	#cont3 { position:relative; max-width:100%; width:100%; padding:6.0rem 0 0; margin:0 auto; }	
}

@media (max-width:768px){
	#cont1 { position:relative; max-width:100%; width:100%; padding:5.2rem 1.6rem 0; margin:0 auto; display:block; }	
	#cont2 { flex-direction:column; padding:5.2rem 1.6rem 0; margin:0 auto; }
	#cont3 { position:relative; max-width:100%; width:100%; padding:8rem 0 0; margin:0 auto; }	
}



#cont1 .inner {  display:flex; justify-content:space-between; align-items:start; }
#cont2 { display:flex; justify-content:space-between; align-items:start; }
section h2 { font-size:4rem; }
section .btn-more { width:4rem; height:4rem; background:url(/images/mbrh/mbr_ico_quick.png) no-repeat center/2.4rem; }

@media (max-width:1024px){
	#cont1 .inner { flex-direction:column; }
}

/* 메인 비주얼 */

.mVisble { display:flex; justify-content:space-between; max-width:calc(60% - 5rem); width:100%; }

.mVisble .txt-wrap { display:flex; flex-direction:column; justify-content:space-between; }

.mVisble .txt-wrap .slogan { margin:6.4rem 0 0; }
.mVisble .txt-wrap .name { font-size:2.2rem; margin-bottom:4rem; }
.mVisble .txt-wrap .name p:nth-child(2) { font-weight:700; font-size:1.35em; }
.mVisble .txt-wrap .name p strong { font-size:1.4em; }
.mVisble .txt-wrap .name p span { color:#D8334E; }
.mVisble .txt-wrap .btn-wrap { margin-bottom:1.2rem; }
.mVisble .txt-wrap .btn-wrap .btn { min-width:18rem; width:100%; background:#1267AA; }
.mVisble .txt-wrap .btn-wrap .btn:hover { background:#11568D; }

.mVisble .pic { align-self: start; box-shadow:0 .4rem 2rem rgba(86,87,170,.25); border-radius:0 0 6.4rem 0; overflow:hidden; margin-left:4rem; }
.mVisble .pic img { width:100%; }

@media (max-width:1440px){

}

@media (max-width:1024px){
	.mVisble { flex-direction:column; max-width:100%; }
	.mVisble .txt-wrap { order:1; }
	.mVisble .txt-wrap .slogan { margin:2.4rem 0 1.2rem; }
	.mVisble .txt-wrap .slogan img { max-width:26rem; width:100%; }
	.mVisble .txt-wrap .name { font-size:2rem; margin-bottom:1.6rem; }

	.mVisble .pic { max-width:36rem; margin:0 auto; }
}


/* 프로필 정보 */
.mInfo { max-width:40%; width:100%; margin-top:2.4rem; }

.mInfo h2 { margin-bottom:2.4rem; }
.mInfo h2 span { font-size:.6em; font-weight:400; }

.mInfo dl { display:flex; flex-wrap:wrap; font-size:2rem; line-height:1.2; border-top:2px solid #7c7c7c; margin-bottom:2.8rem; }
.mInfo dl > * { padding:1.2rem 1.6rem; border-bottom:1px solid #cdd1d5; }
.mInfo dl dt { max-width:10rem; width:100%; color:#8A949E; text-align: justify; text-align-last: justify; text-justify: inter-character; }
.mInfo dl dd { max-width:calc(100% - 10rem); width:100%; }
.mInfo dl dd .small { font-size:.875em; color:#58616A; margin-left:.4rem;}

.mInfo .info-wrap { padding:1.2rem 2rem; border-radius:1.6rem; background:#fff; box-shadow:0 0 2rem rgba(0,0,0,.1); }
.mInfo .info-list { max-height:12rem; height:100%; color:#8A949E; overflow-y:auto; }

.mInfo .sns-list { display:flex; }
.mInfo .sns-list li { margin-right:.8rem; }
@media (max-width:1440px){
	.mInfo { max-width:40%; }
}

@media (max-width:1024px){
	.mInfo { max-width:100%; margin-top: 2rem; }

	.mInfo h2 { font-size:2.8rem; margin-bottom:1.2rem; }

	.mInfo dl { font-size:1.7rem; }
	.mInfo dl dt { max-width:6.4rem; }
	.mInfo dl dd { max-width:calc(100% - 6.4rem); }
	.mInfo dl > * { padding:1rem .6rem; }

	.mInfo .info-list {  max-height:8rem; }
}


/* 게시판 | 의원발의, 보도자료 */
.mNotice { position:relative; max-width:calc(100% - 72rem); width:100%; }
.mNotice .btn-more { position:absolute; right:0; top:0; width:4rem; height:4rem; }
.mNotice > ul { display:flex; position:relative; }
.mNotice h2 { display:inline-block; margin-bottom:2.4rem; margin-right:1.6rem; }
.mNotice h2 a { position:relative; font-size:2.8rem; color:#58616A; transition:.4s ease; }
.mNotice h2 a::after { position:absolute; right:0; top:0; background:#A5C7EE; content:''; width:0; height:0; border-radius:1.2rem; transition:.4s ease; }
.mNotice h2 a.on { font-size:4rem; color:#1E2124; padding-right:1.6rem; }
.mNotice h2 a.on::after { width:1.2rem; height:1.2rem; }
.mNotice .tab-item {  }

.mNotice .post-list { position:absolute; left:0; bottom:0; display:none; flex-direction:column; width:100%; }
.mNotice .post-list.on { display:flex; }

.mNotice .post-item a { position:relative; width:100%; padding:2.4rem 2rem 2.4rem 12rem; border:1px solid #cdd1d5; margin-bottom:1.2rem; transition:.4s ease; }
.mNotice .post-item:last-child a { border-radius:0 0 4rem 0; margin-bottom:0; }

.mNotice .post-item strong { display: block; width: 100%; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; transition:.4s ease; }
.mNotice .post-item p { display:flex; justify-content:space-between; color:#8A949E; margin-top:.8rem; }
.mNotice .post-item .date { position:absolute; left:2rem; top:50%; font-size:2.2rem; color:#58616A; transform:translateY(-50%); }
.mNotice .post-item .date em { display:block; font-weight:700; font-size:1.25em; color:#1E2124;}

.mNotice .post-item:hover a { border-color:#93216B; background:#FFF9F4; }
.mNotice .post-item:hover strong { color:#93216B; }

@media (max-width:1280px){
	.mNotice { max-width:calc(100% - 65rem) }
}

@media (max-width:1024px){
	.mNotice { max-width:100%; margin-bottom:3.2rem; }
	.mNotice h2 { margin-bottom:1.6rem; }
	.mNotice h2 a { font-size:2.4rem; }
	.mNotice h2 a.on { font-size:3.2rem; }

	.mNotice .post-item a { padding:5.6rem 2rem 2rem; }
	.mNotice .post-item p { font-size:1.6rem; }
	.mNotice .post-item .date { top:3.2rem; left:2rem; line-height: 1; font-size:2rem; }
	.mNotice .post-item .date em { display:inline; }
}


/* 회의록 | 최근회의록, 5분자유발언 */
.mMin { position:sticky; top:1rem; max-width:57rem; width:100%; }
.mMin h2 { font-size:2.8rem; margin-bottom:2rem; }

.mMin ul { display:flex; justify-content:space-between; }
.mMin ul li { position:relative; width:calc(50% - 2.4rem); padding:2.8rem 2rem; box-shadow:2rem 2rem 2rem rgba(0,0,0,.1); color:#fff; border-radius:3rem 3rem 6rem 3rem; }
.mMin ul li a { width:100%; }
.mMin ul li a strong { display:block; width:100%; margin-bottom:3.2rem; }
.mMin .btn-more { position:absolute; bottom:-1.8rem; right:-1.2rem; width:5.2rem; height:5.2rem; border-radius:3rem; }
.mMin .btn-more::before, 
.mMin .btn-more::after { position:absolute; left:50%; top:50%; content:''; width:2.2rem; height:.3rem; transform:translate(-50%, -50%); }
.mMin .btn-more::after { transform:translate(-50%, -50%) rotate(90deg); }

.mMin .min-wrap { background:url(/images/mbrh/box_deco.png) no-repeat right bottom, linear-gradient(#91206B,#C8335D); transform:translateY(4rem); }
.mMin .min-wrap .btn-more { background:#FFDEE3; }
.mMin .min-wrap .btn-more::before,
.mMin .min-wrap .btn-more::after { background:#C5325E; }

.mMin .speech-wrap { background:url(/images/mbrh/box_deco.png) no-repeat right bottom, linear-gradient(#144680,#1F599C); }
.mMin .speech-wrap .btn-more { background:#E9F3FF; }
.mMin .speech-wrap .btn-more::before,
.mMin .speech-wrap .btn-more::after { background:#1F589A; }

@media (max-width:1280px){

}

@media (max-width:1024px){
	.mMin { position:static; max-width:100%; }
}


/* 의정활동영상 */
.mVod { display:flex; align-items:center; justify-content:space-between; margin-bottom:6.4rem; }
.mVod .tit { display:flex; align-items:end; margin-right:2.4rem; }
.mVod .btn-more { position:relative; }
.mVod h2 { font-size:3.2rem; margin-right:.8rem; }
.mVod h2 span { display:block; font-size:1.25em; }

.mVod ul { display:flex; gap:2rem; max-width:calc(100% - 30rem); width:100%; height:35.4rem; }
.mVod ul li { display:flex; width:calc((100% - 55rem)/ 3); border-radius:1.6rem; overflow:hidden; transition:.4s ease-in; }
.mVod ul li a { position:relative; width:100%; padding-top:56.25%; background:no-repeat center/cover; color:#fff; }
.mVod ul li a::before { position:absolute; left:0; bottom:0; content:''; width:100%; height:200%; background:linear-gradient(rgba(0,0,0,0),rgba(0,0,0,.5) 50%,rgba(0,0,0,.8)); transition:.4s ease; transform:translateY(50%); }

.mVod li a div { position:absolute; bottom:0; left:0; z-index:1; display:inline-flex; align-items:center; justify-content:end; flex-direction:column; width:100%; height:100%; padding:0 1.6rem 1.2rem; }
.mVod li a .badge { display:block; padding:0 .8rem; border-radius:100rem; border:1px solid #fff; writing-mode: unset; max-width:100%; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; }
.mVod li a div strong { display:block; font-size:2.2rem; max-width:100%; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; margin:.8rem 0 0; }
.mVod li a div p { display:none; opacity:0; }
.mVod li a div p::before { position:relative; display:block; content:''; width:1px; height:2rem; background:#fff; opacity:.6; margin:0 auto 1.2rem; }

.mVod ul li.on a::before { transform:translateY(0%); }
.mVod ul li.on { max-width:55rem; width:100%; }
.mVod ul li.on p { display:block; opacity:1; transition:opacity .4s; }
.mVod ul li.on strong { font-size:3.2rem; margin-bottom:4rem}
.mVod li.on a div { top:0; transform:translateY(0); padding-bottom:10%;}


@media (min-width:1025px) and (max-width:1440px){
	
}

@media (max-width:1024px){
	.mVod { flex-direction:column; align-items:start; }
	.mVod .tit { justify-content:space-between; margin-bottom:1.6rem; width:100%; }
	.mVod h2 { font-size:2.8rem; }
	.mVod ul { max-width:100%; }

}
@media (max-width:768px){
	.mVod ul { flex-direction:column; height:auto; }
	.mVod ul li { width:100%; }
	.mVod ul li.on { max-width:100%; }

	.mVod ul li a { padding-top:32.5% }
	.mVod ul li.on a { padding-top:56.25%; }
	
}

/* 의정활동사진 */
.mPhoto { position:relative; padding-top:6rem; padding-bottom:10rem; border-radius:20rem 0 0 0; box-shadow:0 0 40rem #ECF5F6; }
.mPhoto::before { position:absolute; right:1.6rem; bottom:100%; content:''; width:35rem; height:21rem; background:url(/images/mbrh/mbr_blend_bg.png) no-repeat center bottom/contain; }
.mPhoto h2 { margin-bottom:4rem; text-align:center; }

.mPhoto .slick-track { display:flex; align-items:end; }
.mPhoto .slick-slide > div,
.mPhoto .slick-current > div { transition:.4s; }

.mPhoto .photo-item { display: flex !important; border-radius:1.6rem; overflow:hidden; }
.mPhoto .photo-item a { position:relative; width:100%; padding-top:56.25%; transition:.4s ease; }
.mPhoto .photo-item a .pic { position:absolute; top:0; display:block; width:100%; height:100%; background:no-repeat center/cover; transition:.4s; }
.mPhoto .photo-item a div::before { position:absolute; top:0; left:0; z-index:0; content:''; width:100%; height:200%; background:linear-gradient(rgba(0,0,0,0) 20%, rgba(0,0,0,.8) 50%); transition:.4s; }
.mPhoto .photo-item a div { position:absolute; bottom:0; display:inline-flex; flex-direction:column; justify-content:end; width:100%; height:100%; padding:1.2rem 1.6rem; transition:.4s; }
.mPhoto .photo-item a div strong { position:relative; z-index:1; display:inline-block; font-size:2.2rem; color:#fff; width:fit-content; max-width: 100%; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; }
.mPhoto .photo-item a div .date { position:relative; left:0; z-index:1; align-self: start; font-size:1.8rem; color:#ccc; transition:.4s; }
.mPhoto .photo-item a div em { z-index:1; position:absolute; left:50%; bottom:5.2rem; opacity:0; color:#ccc; transform:translateX(-50%); transition:.4s; }
.mPhoto .photo-item a div em::before { position:absolute; bottom:calc(100% + 1.6rem); left:50%; content:''; width:1px; height:0; background:#ccc; transition:.4s; }

.mPhoto .photo-item a:hover .pic { transform:scale(1.1); }


.mPhoto .slick-slide > div { margin-top:6.25%; }
.mPhoto .slick-current > div { margin-top:0; }

.mPhoto .slick-current a { padding-top:62.5%; }
.mPhoto .slick-current a div { padding-bottom:13rem; }
.mPhoto .slick-current a div::before { top:-100%; }
.mPhoto .slick-current a div .date { left:50%; transform:translateX(-50%); }
.mPhoto .slick-current a div strong { left:50%; transform:translateX(-50%); }
.mPhoto .slick-current a div em { opacity:1; }
.mPhoto .slick-current a div em::before { height:1.6rem; }
.mPhoto .slick-slide { transition:.4s; margin:0 1rem; }
.mPhoto .slick-list { margin:0 -1rem; }

.mPhoto .btn-wrap { position:absolute; right:0; top:0; display:flex; align-items:center; }
.mPhoto .btn-wrap button { margin-right:.4rem; }
.mPhoto .btn-wrap .btn-prev { background:url(/images/common/visible_btn_prev.gif) no-repeat center; }
.mPhoto .btn-wrap .btn-next { background:url(/images/common/visible_btn_next.gif) no-repeat center; }
.mPhoto .btn-pause.on { background:url(/images/common/visible_btn_play.gif) no-repeat center;}
.mPhoto .btn-pause { background:url(/images/common/visible_btn_pause.gif) no-repeat center; }

@media (max-width:1024px){
	.mPhoto { border-radius:1.6rem 0 0 0; }
	.mPhoto::before { width:24rem; }

	.mPhoto h2 { font-size:3.2rem; margin-bottom:1.6rem; }
}