@charset "utf-8";

/*setting*/
.m_content a{display:block;}

/*header*/
.head h1 a{display:inline-block;padding:0 50px 0 0;position:relative;}
.head h1 em{display:inline-block;color:#414141;font-size:12px;font-style:normal}
.head h1 strong{display:inline-block;color:#000;font-weight:900;font-size:20px;position:absolute;left:54px;top:20px}
.menu{min-width:320px;width:80%;}
.menu>ul>li>a{width:40%;}
.depth_box{left:45%;}

@media all and (min-width:768px){
.menu{width:100%;}
.menu>ul>li>a{width:auto;}
.depth_box{left:0;}
}
@media all and (min-width:1024px){
.menu{width:800px}
.menu1 .depth_boxcon ul{margin-left:280px;}
.menu2 .depth_boxcon ul{margin-left:380px;}
.menu3 .depth_boxcon ul{float:none;text-align:center}
.menu3 .depth_boxcon ul li{float:none;display:inline-block;}
.menu4 .depth_boxcon ul{float:none;text-align:center}
.menu4 .depth_boxcon ul li{float:none;display:inline-block;}
.menu5 .depth_boxcon ul{float:right}
.menu6 .depth_boxcon ul{float:right;}
}

/*슬로건*/
.m_content{background:url(/images/04_assemblyman/main/main_bg.jpg) top center;}
.m_wrap{max-width:1200px;margin:0 auto;padding:40px 20px 50px;}
.m_wrap .main_tit{padding:0 0 45px;text-align:center}
.m_wrap .main_tit img{max-width:100%;display:block;margin:0 auto;}
.m_wrap .main_tit img:first-child{display:none;}
/*의원소개*/
.member{padding: 20px 0;background:rgba(11,28,94,.85)}
.member span{width: 180px;height: 207px;margin:0 auto;/* border-radius:50%; */overflow:hidden;background: #fff;display:block;}
.member span img{width: 102%;height: 103%;}
.member dl{color:#fff;width:154px;margin:24px auto;}
.member dt{font-size:1.125rem;text-align:center}
.member dt strong{font-size:1.875rem;display:inline-block;vertical-align:bottom}
.member dd{font-size:1rem;padding:14px 0 0 26px;position:relative}
.member dd:before{background:url(/images/04_assemblyman/main/icon.png) no-repeat #cdd0d7;width:20px;height:20px;border-radius:50%; position:absolute;top:14px;left:0;content:""}
.member dd:nth-of-type(1):before{background-position:-61px -284px}
.member dd:nth-of-type(2):before{background-position:-61px -332px}
.member dd em{line-height:22px;font-size:12px;font-style:normal;display:block;}
.member a{width:150px;line-height:38px;margin:0 auto;text-align:center;background:#fff;box-shadow:10px 10px 0 0 #0a1132;font-weight:600;color:#2b2c57;}
/*활동사진*/
.gallery{padding:27px 20px;background:url(/images/04_assemblyman/main/bg_bbs.png);position:relative;height: 327px;overflow: hidden;}
.gallery h2{padding:0 0 30px;font-size:1.875rem;font-weight:600;text-align:center;}
.gallery .gal_wrap ul{box-sizing:border-box;width:100% !important;}
.gallery .gal_wrap li{max-width:270px;border:5px solid #354274;margin:0 auto;box-sizing:border-box;margin-bottom: 40px;display:block;width:100% !important;}
.gallery .gal_wrap li.nodata{padding:20px 0;text-align:center;background:#fff}
.gallery .gal_wrap span{height:170px;overflow:hidden;display:block;}
.gallery .gal_wrap img{max-width:100%;}
.gallery .gal_wrap p{padding:20px;height:80px;background:#fff;color:#393939;font-size:0.875rem;text-align:center;box-sizing:border-box}
.gallery .gal_wrap strong{padding:0 0 10px;font-size:1rem;color:#000;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.btn_more{width:40px;height:40px;background:url(/images/04_assemblyman/main/icon.png) -51px -232px #354274;position:absolute;top:27px;right:20px;}
/*활동사진_좌우버튼추가230216*/
.mphoto_btn{position:relative;top:170px;z-index:2;}
.mphoto_btn button{width:50px;height:50px;border-radius:50%;background:#213266d4;border:1px solid #fff;position:absolute;}
.mphoto_btn button span{display:block;font-size:0;background:url("/images/04_council/main/mphoto_btn_icon.png")no-repeat top;width:15px;height:25px;background-size:cover;position:relative;}
.mphoto_btn .prev span{background-position:0 0;left:7px;top:1px;}
.mphoto_btn .next span{background-position:0 -59px;left:12px;top:1px;}
.mphoto_btn .prev{left:-10px;}
.mphoto_btn .next{right:-10px;}
/*바로가기링크*/
.link_banner:after{display:block;clear:both;content:""}
.link_banner li{width:33.33%;float:left;}
.link_banner li:nth-of-type(1){background-color:#4b559e;}
.link_banner li:nth-of-type(2){background-color:#354274;}
.link_banner li:nth-of-type(3){background-color:#347e8c;}
.link_banner a{padding:10px 0 16px;height:100px;font-size:1.125rem;font-weight:600;color:#fff;text-align:center;box-sizing:border-box}
.link_banner i{width:50px;height:50px;background:url(/images/04_assemblyman/main/icon.png);display:block;margin:0 auto 3px;vertical-align:middle}
.link_banner li:nth-of-type(1) i{background-position:-45px 0px;}
.link_banner li:nth-of-type(2) i{background-position:-49px -76px;}
.link_banner li:nth-of-type(3) i{background-position:-45px -153px;}

/* Tablet */
@media all and (min-width:768px) {
/*슬로건*/
.m_wrap{padding:70px 20px 80px;}
.m_wrap:after{display:block;clear:both;content:""}
.m_wrap .main_tit{padding:0 0 70px;}
.m_wrap .main_tit img:first-child{padding:0 0 24px;}
/*의원소개*/
.member{width:40%;float:left;}
/*활동사진*/
.con_wrap{width:60%;float:left;}
.gallery{height: 331px;}
.gallery .gal_wrap li.nodata{padding:90px 0}
/*활동사진_좌우버튼추가230216*/
.mphoto_btn .prev{left:0px;}
.mphoto_btn .next{right:0px;}
/*바로가기링크*/
.link_banner a{padding:10px 0px;height:70px;}
.link_banner i{display:inline-block;margin:0 auto;}
}

/* Desktop */
@media all and (min-width:1024px) {
	.m_content{min-width:1200px;}
/*의원소개*/
.member{width:300px;}
.member a{animation:pop-up .5s both}
.member a:hover{animation:pop-down .5s both}
/*활동사진*/
.con_wrap{width:calc(100% - 300px);}
.gallery{padding:27px 25px;}
.gallery .gal_wrap ul:after{display:block;clear:both;content:""}
.gallery .gal_wrap ul{width:3000px !important;}
.gallery .gal_wrap li{float:left;max-width:280px;width:32.9%;margin:0 5px 0 0;border:5px solid transparent;transition:.3s linear}
.gallery .gal_wrap li:last-child{margin:0;}
.gallery .gal_wrap li:hover{border:5px solid #354274;transition:.3s linear}
.gallery .gal_wrap li:hover strong{text-decoration:underline}
.btn_more:hover{animation:jelly 0.9s both;}
/*활동사진_좌우버튼추가230216*/
.mphoto_btn .prev{left:-20px;}
.mphoto_btn .next{right:-20px;}
/*바로가기링크*/
.link_banner a{font-size:1.5rem;position:relative;overflow:hidden}
.link_banner a:before{width:0;height:5px;position:absolute;bottom:0;left:0;transition:all ease-out 0.5s;content:"";}
.link_banner li:hover a:before{width:100%;background:#fff}
.link_banner i{margin:0 14px 0 0;}
}
@keyframes pop-down{0%{box-shadow:10px 0 #0a1132,0 10px #0a1132;transform:translateX(0) translateY(0)}100%{box-shadow:10px 10px #0a1132,10px 10px #0a1132;transform:translateX(-8px) translateY(-8px)}}
@keyframes pop-up{0%{box-shadow:10px 10px #0a1132,10px 10px #0a1132;transform:translateX(-8px) translateY(-8px)}100%{box-shadow:0px 0 #0a1132,0 0px #0a1132;transform:translateX(0) translateY(0)}}
@keyframes jelly {0% {transform: scale3d(1, 1, 1);}30% {transform: scale3d(0.75, 1.25, 1);}40% {transform: scale3d(1.25, 0.75, 1);}50% {transform: scale3d(0.85, 1.15, 1);}65% {transform: scale3d(1.05, 0.95, 1);}75% {transform: scale3d(0.95, 1.05, 1);}100% {transform: scale3d(1, 1, 1);}}
                                                                                                                                                            