@charset "utf-8";

img{max-width: 100%;}
.wrap{ max-width: 1400px; }
.dangname{display: inline-block; width: 120px; aspect-ratio:3/1;  background: url(/assembly/img/img2026/txt_dang.png) no-repeat left bottom / cover; overflow:hidden; text-indent: -5000px; }
.dangname.democratic{background-position-y:0px}
.dangname.liberty{background-position-y:-40px}
/* 의원 써머리 */
#intro{margin: auto; max-width: 1800px; width: 96%; background: url(/assembly/img/img2026/visual_bg.jpg) no-repeat center center  / cover; border-radius:calc(2.66 * var(--fz))}
/* #intro>div{display: flex; flex-direction: column; flex-wrap: wrap; height:616px; align-content: space-between}
#intro>div>*{width:50.28571%}
#intro #visual{width: 44%} */
#intro>div:After{content: ''; display: block; clear: both;}
#intro>div>*{float: right; width:50.28571%}
#intro #visual{float: left; position: relative; width: 44%; max-width: 583px}
#intro #visual .con{position: absolute; top:17%; left: 6%;}
#intro #visual .con *{font-family: var(--cngfont); line-height: 150%;}
#intro #visual .con .txt{font-size: var(--18px);}
#intro #visual .con .name{font-size: calc(2.53 * var(--fz)); color: #444;}
#intro #visual .con .name span{font-size: 1.13em; font-weight: 500; color: #333}
#intro #visual .img{aspect-ratio:1/1.05660; overflow:hidden}
#intro .slogan{text-align: center; margin-top: clamp(30px, 6vw, 7.5%); padding-right: 8%;}
#intro .slogan img{max-width: 530px; width: 100%;}
#intro .profile{display: grid; gap: 7px; grid-template-columns: 250px minmax(0,1fr) minmax(0,1fr); margin: clamp(30px, 6vw, 4.8%) 0px }
#intro .profile>*{display: flex; flex-direction: column; gap: 7px; padding: clamp(15px, 1.3vw, 30px) clamp(18px, 1.7vw, 32px); background: #fff; border-radius:var(--fz)}
#intro .profile .email{grid-column: 1; grid-row: 2;}
#intro .profile .area dd{word-break: keep-all; ; font-size: var(--16px)}
#intro .profile dl dt{font-family:var(--cngfont); font-size: var(--18px)}
#intro .profile dl dd{font-size: calc(var(--16px) + 1px); color: #666; font-weight: 400;}
#intro .profile .btn_profile{padding: 0px; border:1px solid var(--dang); overflow:hidden }
#intro .profile .btn_profile a{display: flex; gap:5px; align-items: center; justify-content:center; height: 100%; color: var(--dang); font-size: var(--18px); font-family:var(--cngfont); transition:background ease .3s}
#intro .profile .btn_profile svg{display: none; width:calc(0.6 * var(--fz)); aspect-ratio:1/1.6; margin-left:8px}
#intro .profile .btn_profile a:after{content: ''; display: inline-block; width:calc(0.6 * var(--fz)); aspect-ratio:1/1.6; margin-left:2px;
	background:var(--dang);
    -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 9 15'%3E%3Cpath d='M1.5 1.5L7.5 7.5L1.5 13.5' stroke='black' fill='none' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / contain;
    mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 9 15'%3E%3Cpath d='M1.5 1.5L7.5 7.5L1.5 13.5' fill='none'  stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / contain;
}
#intro .profile .btn_profile a:hover{background:var(--dang); color: #fff;}
#intro .profile .btn_profile a:hover:after{background: #fff;}

/* 배너 */
#banr{position: relative; top:calc(0px - var(--fz) * 5); background: var(--dang) url(/assembly/img/img2026/banr_bg.png) no-repeat center center / cover; background-blend-mode:darken ; border-radius:var(--20px); overflow:hidden}
#nogroup #banr{ background-image: var(--dang), url(/assembly/img/img2026/banr_bg.png)}
#banr ul{display: flex; justify-content: space-evenly; padding:35px 4.5%; }
#banr ul li{}
#banr ul li a{display: block; text-align: center; ; font-size:calc(1.15 * var(--fz));}
#banr ul li a:before{display: block; content: ''; width: calc(5.33333 * var(--fz)); height: calc(3.33333 * var(--fz)); margin:0px auto min(10%, 11px); background: url(/assembly/img/img2026/ic_banr.png) no-repeat center top / cover; --posY:calc(3.33333 * var(--fz))}
#banr ul li.ic02 a:before{background-position-y:calc(0px - var(--posY) * 1) ;}
#banr ul li.ic03 a:before{background-position-y:calc(0px - var(--posY) * 2) ;}
#banr ul li.ic04 a:before{background-position-y:calc(0px - var(--posY) * 3) ;}
#banr ul li.ic05 a:before{background-position-y:calc(0px - var(--posY) * 4) ;}
#banr ul li.ic06 a:before{background-position-y:calc(0px - var(--posY) * 5) ;}
#banr ul li.ic07 a:before{background-position-y:calc(0px - var(--posY) * 6) ;}
#banr ul li a{color: #fff;}

/*** 컨텐츠공통 ***/
#contents .wrap {display: flex; gap:4%}
#contents .wrap .conL{flex-grow: 1; ; min-width: 0;}
#contents .wrap .conR{flex:0 0 33%}
#contents .wrap h3{float: left;}
#contents .wrap .more{float: right}
#contents .wrap .more+*{clear:both}
#contents h3{font-size: calc(2.53333 * var(--fz)); font-family: var(--cngfont); color: #333; font-weight: bold;}
#contents .fzsize_tit{font-size:var(--20px); font-family: var(--cngfont); color: #333; letter-spacing: 0px; line-height:140%}
#contents .fzsize_date{font-size:var(--16px); color:#888}
#contents .fzsize_txt{font-size:var(--16px); color:#666}

/* 최근소식  */
#news{z-index: 1;}
#news .more{display: flex; gap:4px; margin-top: -8px;}
#news .more a{display: flex; gap:3px; align-items: center; padding:calc(.7 * var(--fz)) calc(2 * var(--fz)); background: #F0F0F0; font-size: var(--18px); font-weight: 500; border-radius:100px}
#news .more a:after{content: ''; display: inline-block; width:calc(0.53 * var(--fz)); aspect-ratio:1/1.6;
	background:#666;
    -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 9 15'%3E%3Cpath d='M1.5 1.5L7.5 7.5L1.5 13.5' stroke='black' fill='none' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / contain;
    mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 9 15'%3E%3Cpath d='M1.5 1.5L7.5 7.5L1.5 13.5' fill='none'  stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / contain;
}
#photo{display: flex; gap:var(--20px); margin-top: calc(var(--fz) * 3.5);}
#photo>li{flex:1; min-width: 0px;}
#photo>li:nth-child(2)+li{display: none;}
#photo a.img{display: block; border-radius:var(--20px); overflow:hidden; }
#photo a.img img{object-fit:cover; height:300px}
#photo .tit {object-fit:cover; margin-top: calc(var(--20px) / 2)}
#photo .tit span{display: block;}
#photo .tit .fzsize_tit{display: inline-block; max-width: 95%; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; margin-top: var(--18px)}
#photo .tit .fzsize_date{margin-top: calc(.2 * var(--fz));}

/* 보도 */
#report{padding-top:  calc(var(--fz) * .5); background: #fff; position: relative; box-shadow:0px -5px 0px #333; border-radius:var(--20px) var(--20px) calc(var(--20px) - 2px) calc(var(--20px) - 2px); }
#report:before{display: block; content: ''; position: absolute; left: -1px; top: -1px; right:-1px; bottom:-1px; background-image:linear-gradient(to bottom, #333, var(--dang)); z-index: -1; border-radius:var(--20px); overflow:hidden}
#nogroup #report:before{background-image:var(--dang)}
#report .cate{position: relative; left:-3px; padding:3px 12px; color: #fff; background: #383838; border-radius:4px; font-family: var(--cngfont); font-size: var(--16px); letter-spacing: 0px; }
#report li + li{border:0px dashed #ccc; border-top-width:1px}
#report li{display: flex; gap:7px; flex-direction: column; align-items: flex-start; padding:min(4vw, 35px) 3px; margin:0px min(5vw, 45px); height:calc(12.8 * var(--fz)); box-sizing:content-box}
#report a{flex-grow:1}
#report .fzsize_tit{display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; max-width: 100%; }
#report .fzsize_txt{margin-top: calc(.6 * var(--fz)); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; max-width: 100%; }

/* 발의 및 영상  */
#gray{position: relative; margin-top:calc(-3 * var(--fz)); padding:calc(4.5 * var(--fz)) 0px; background: #F0F0F0;}
#gray .wrap{align-items: flex-end}
#propose{padding-right: 1%; position: relative;}
#propose>ul{display: flex; gap:var(--20px); margin-top: max(70px, 8%)}
#propose>ul>li{flex:1; position: relative; }
#propose>ul>li .cate{position: absolute; left:calc(clamp(20px, 10%, 50px) - 20px); top:calc(5px - clamp(20px, 10%, 50px)); padding:8px calc(var(--20px) / .7) 7px; background: #614796; border-radius:100px; color: #fff; font-size:calc(1.26 * var(--fz)); font-family: var(--cngfont);}
#propose>ul>li .cate span{font-size: 0.789em}
#propose>ul>li a{display: flex;flex-direction: column; padding:calc(10px + clamp(20px, 10%, 35px)) clamp(20px, 10%, 50px) clamp(20px, 10%, 35px); background: #fff; border-radius:var(--20px); height: calc(17.33333 * var(--fz)); word-break: keep-all;}
#propose>ul>li a .num{font-size:calc(1.1 * var(--fz)); }
#propose>ul>li .fzsize_tit{margin-top: 5px; flex-grow: 1; }
#propose>ul>li .fzsize_tit span{display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; max-width: 100%; }
#propose>ul>li a ul>li{position: relative; padding-left: 10px;}
#propose>ul>li a ul>li:before{display: block; content: ''; position: absolute; left: 0px; top:calc(var(--fz) / 2 + 3px); width: 5px; height: 1px; background: #888}
#propose .more{position: absolute; right: 1%; top: 0px; }
#propose .more a{display: block; width: calc(2 * var(--20px)); height: calc(2 * var(--20px)); background: #8A949E; border-radius:15px; text-indent: -5000px;}
#propose .more a:before,
#propose .more a:after{content: ''; position: absolute; left: 0; top: 0; right: 0px; bottom: 0; margin: auto; width: 35%; height: 2px; background: #fff;}
#propose .more a:before{transform: rotate(90deg);}
#propose .nolist a{text-decoration: none !important;}
#propose .nolist a .fzsize_tit{font-size: var(--16px);}

#video {padding-top:  calc(var(--fz) * .5); }
#video p.tit{display: flex; align-items: center; gap:20px; margin-bottom: calc(.9 * var(--fz))}
#video p.tit>span{display: block; text-overflow:ellipsis; overflow:hidden; white-space: nowrap; min-width: 0; font-size: var(--18px); font-family: var(--cngfont);}
#video p.tit:before,
#video p.tit:after{display: block; content: ''; flex-grow:1; height:1px; background: rgba(0,0,0,.1)}
#video p.img{position: relative; overflow:hidden; background: #000; border-radius:var(--fz)}
#video p.img:after{display: block; content: ''; position: absolute; left: 0px; right: 0px; top: 0px; bottom: 0px; margin: auto; width:calc(3.333 * var(--fz)); height:calc(3.333 * var(--fz)); background: url(/assembly/img/img2026/ic_play.png) no-repeat center top / cover; }
#video p.img {aspect-ratio:1.68 / 1 }
#video p.img img{opacity: .6; height: 270px; object-fit:cover}

@media all and (max-width:1280px) {
	#intro>div{display: flex; flex-direction: column; align-items: center}
	#intro>div>*{all:unset; text-align: center; }
	#intro #visual{width: 100%;}
	#intro #visual .img{margin: auto; aspect-ratio:1/.95}
	#intro .slogan{order:-1; padding:5% 2%; text-align: center;}
	#intro .slogan img.dp_pc{max-width: 800px}
	/* #intro .profile{grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);}
	#intro dl:nth-child(2n) + .btn_profile a{min-height: calc(6 * var(--fz));} */
	 #intro .profile{display: flex; flex-wrap: wrap; margin-top: 0px;}
	#intro dl:nth-child(2n) + .btn_profile a{padding:10px}
	#intro .profile>*{flex:1 0 48%}
	#banr{top:0px; margin:2vw auto}
	#contents>div{margin-top: 40px;}
	#contents>div#news{flex-direction: column; gap:40px }
}

@media all and (min-width:800px) and (max-width:1280px) {
	#report{display: flex; gap:10px}
	#report>li{flex:1 0; padding:0px 3vw; margin:3vw 0px}
	#report>li + li{border-top-width: 0px; border-left-width: 1px;}
}
@media all and (max-width:800px) {
	#intro #visual .con{transform: scale(.8); transform-origin: left; left:3%; top:15%}
	#banr ul{flex-wrap: wrap; gap:20px 2%; justify-content: flex-start;}
	#banr ul li{width: 23.5%;}
	#banr ul li a:before{margin-bottom: 0px;}
	#contents .wrap{flex-direction: column; gap:40px; align-items: stretch;}
	#photo a.img img{height:auto; aspect-ratio:3/2}
	#photo .tit{margin-top: 0px;}
	#photo .tit .fzsize_date{margin-top: 0px;}
	#propose>ul>li .cate{padding:5px 15px}
	#propose>ul>li .cate, #propose>ul>li .cate span{font-size: 13px; font-weight: 500;}
	#propose>ul>li .cate span{font-weight: 300;}
	#propose>ul>li .cate span:before,
	#propose>ul>li .cate span:after{display: inline-block; content: '';}
	#propose>ul>li .cate span:before{content: '[';}
	#propose>ul>li .cate span:after{content: ']';}
}