@charset "utf-8";

.m_content {position: relative;}

/* 비주얼 영역 */
#m_bg_psc {background-image:url('/_jbcommittee/images/main/main_visual_psc.jpg');} /* 운영위원회 */
#m_bg_aac {background-image:url('/_jbcommittee/images/main/main_visual_aac.jpg');} /* 행정자치위원회 */
#m_bg_ewc {background-image:url('/_jbcommittee/images/main/main_visual_ewc.jpg');} /* 환경복지위원회 */
#m_bg_aec {background-image:url('/_jbcommittee/images/main/main_visual_aec.jpg');} /* 농산업경제위원회 */
#m_bg_csc {background-image:url('/_jbcommittee/images/main/main_visual_csc.jpg');} /* 문화건설안전위원회 */
#m_bg_edc {background-image:url('/_jbcommittee/images/main/main_visual_edc.jpg');} /* 교육위원회 */

#m_bg_bsc {background-image:url('/_jbcommittee/images/main/main_visual_bsc.jpg');} /* 예산/결산특별위원회 */
#m_bg_esc {background-image:url('/_jbcommittee/images/main/main_visual_esc.jpg');} /* 윤리특별위원회 */
#m_bg_jsc {background-image:url('/_jbcommittee/images/main/main_visual_jsc.jpg');} /* 전북특별자치도특별위원회 */
#m_bg_cnc {background-image:url('/_jbcommittee/images/main/main_visual_cnc.jpg');} /* 탄소중립특별위원회 */
#m_bg_ssc {background-image:url('/_jbcommittee/images/main/main_visual_ssc.jpg');} /* 새만금 특별지자체설치특별위원회 */
#m_bg_sbc {background-image:url('/_jbcommittee/images/main/main_visual_sbc.jpg');} /* 전북 이차전지 특별위원회 */

/* 공통타이틀 */
.title_area { display: flex; letter-spacing: -0.05em; margin-bottom: 20px; position: relative; width: 100%; justify-content: space-between; align-items: center;}
.title_area h3 {font-size: 170%; color:#22263b; font-weight: 700; display: block; line-height: 40px; position: relative;  }
.title_area h3 span {color: var(--point_color);}

.title_area a {font-weight: 500; display: block; padding-right: 10px; font-size: 90%;}

#container { background-image: url(/_jbcommittee/images/sub/patten_dot.png); }

.main_visual { padding-bottom: 32%; background-color: #857072; position: relative; -webkit-background-size:cover; -moz-background-size:cover; -o-background-size:cover; background-size: cover; background-position: center center;  }

.nav { left:0px; right:0px; top:26%}
.nav .prev, .nav .next{  position:absolute; width:50px; height:50px;}
.nav .prev {left:0}
.nav .next {right:-10px}
.nav button{  background-color: #273450;}
.nav button::before{ font-size: 130%; color: #fff;}


.m_goto {margin-top: -70px;}
.m_goto .wrap_container{ background-image: url(/_jbcommittee/images/main/icon_bg.jpg); -webkit-background-size:cover; -moz-background-size:cover; -o-background-size:cover; background-size: cover; background-position: center center;  border-radius: 70px 15px 70px 15px; padding: 40px 80px; box-shadow: 3px 3px 15px rgba(0,0,0,0.4); }
.m_goto ul li{margin-top: 3px; margin-bottom: 3px;}
.m_goto ul li a{color:#fff; font-weight: 500; font-size: 120%; display: flex; width: 100%; align-items: center; white-space: nowrap;}
.m_goto ul li a img{border-radius: 50%; background-color: #cbceeb; transition: all 0.3s; width:20%; max-width: 70px;}
.m_goto ul li a span{display: block; padding-left: 20px;  transition: all 0.3s;}
.m_goto ul li a:hover img{background-color: #fff; box-shadow: 3px 3px 15px rgba(0,0,0,0.4);}
.m_goto ul li a:hover span{font-size: 105%;}

.m_bbs {background-color: #f3f3f6;}
.m_bbs .col-md-6{padding-top: 10px; padding-bottom: 10px;}

.m_bbs .view li {position: relative; width: 100%; font-weight: 400;}
.m_bbs .view li.title::before{content:''; position:absolute; left:0; top:16px; border-radius: 50%; width:3px; height:3px; background-color: #999;}
.m_bbs .view li.title > a{display:block; padding-left:15px; width:calc(100% - 120px);width:-webkit-calc(100% - 120px); line-height: 35px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
.m_bbs .view li.title > .date{ position: absolute; right:10px; z-index: 3; top:7px; font-family: 'Roboto'; color:#666; font-weight: 300;}



.lawmaker_slider {position: relative; margin-left: -20px; margin-right: -20px;}
.lawmaker_slider .slider {position: relative; }
.lawmaker_slider .cell { padding: 10px 20px; display: block;}
.lawmaker_box {width:100%; display: flex; background-color: #f3f3f6; box-shadow: 0px 0px 10px rgba(64, 86, 150, 0.2); overflow: hidden; padding:6% 6%; margin-bottom: 15px; border-radius: 50px 15px; border: 1px solid #dfdfe0;} 
.lawmaker_box > .photo{width:40%; display: flex; align-items: center; justify-content: center; padding: 0 10px;}
.lawmaker_box > .photo img {background-color: #fff; border: 1px solid var(--border_color); border-radius: 10px; }
.lawmaker_box > .txt{width:60%; padding-left: 30px; }
.lawmaker_box > .txt dt{font-size: 160%; font-weight: 700; display: block; margin:10px 0 15px 0; color:#000}
.lawmaker_box > .txt dt span{font-size: 80%; font-weight: 400;}
.lawmaker_box > .txt dd {font-size: 90%; color:#353746; font-weight: 400; }
.lawmaker_box > .txt dd ul li {display: block;}
.lawmaker_box > .txt a {margin-top:15px; display: inline-block; padding: 0 15px; background-color: #80839f; color:#fff; font-weight:500; border-radius: 10px; line-height: 32px;}
.lawmaker_box > .txt dd strong {font-weight: 500;}


.m_gallery { }
.m_gallery::before {content: ''; position: absolute; left:0; right:0; bottom: 0; top:50%; background: var(--Gradation3);}

.gallery_slider {position: relative; margin-left: -20px; margin-right: -20px;}
.gallery_slider .slider {margin: 0px}
.gallery_slider .cell {display: block; margin:5px; padding:0 20px}
.gallery_slider .cell a{display: block; transition: all 0.5s;}
.gallery_slider .cell a:hover{}
.gallery_slider .cell a .img {display: block; overflow: hidden;  border-radius: 10px; }
.gallery_slider .cell a .img img{transition: all 2s;transform: scale(1);}
.gallery_slider .cell a:hover .img img{transform: scale(1.2);}
.gallery_slider .cell img{width: 100%; border-radius: 10px; transition: all 0.3s;}
.gallery_slider .cell .text_box {display: block; margin: 0 10px 10px 10px; background-color: #f2f5fa;  border-radius: 15px; position: relative; margin-top: -20px; padding: 15px 15px; transition: all 0.5s; }
.gallery_slider .cell a:hover .text_box {  margin-left: 0; margin-right: 0; padding: 20px 15px; margin-top: -30px; box-shadow: 3px 3px 5px rgba(0,0,0,0.4); }
.gallery_slider .cell .text_box strong {display: block;text-align: center; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; font-size: 100%; color: #000; font-weight: 700; letter-spacing: -0.03em; font-size: 110%; }
.gallery_slider .cell .text_box span {font-family: 'Roboto';display: block; text-align: center;  color:#555; line-height: 30px;  }

.gallery_slider .cell:hover .text_box { background: var(--deep_Gradation);}
.gallery_slider .cell:hover .text_box strong, .gallery_slider .cell:hover .text_box span {color:#fff}



@media only screen and (max-width: 1300px) {
    .gallery_slider, .lawmaker_slider  { margin-left: 0px; margin-right: 0px;}
    .m_goto .wrap_container{  padding: 3% 5%;  }

}


@media only screen and (max-width:991px){
    .main_visual{ padding-bottom: 50%; }
    .m_goto {margin-top: -20px;}
}

@media only screen and (max-width:762px){
    .main_visual{ padding-bottom: 45%; }
    .title_area { margin-bottom: 0px;}
    .title_area h3 {font-size: 140%; line-height: 30px;}
    .m_gallery .title_area {margin-bottom: 10px;}

    .m_bbs .title_area{margin-bottom: 10px;}
    .lawmaker_box {padding:20px 4% 20px 4%}
    .lawmaker_slider .cell {padding: 10px 8px;}
    .gallery_slider .cell { padding:0 5px}

    .nav {top:40%}
    .nav .prev, .nav .next{  position:absolute; width:30px; height:30px;}

}
@media only screen and (max-width:762px){
    .lawmaker_box > .txt {padding-left: 3px; font-size: 90%;}
    .lawmaker_box > .txt dt {margin:10px 0 5px 0; font-size: 130%;}
    .m_goto .wrap_container{  border-radius: 30px 5px 30px 5px; }
    .m_goto ul li a{font-size: 100%;}
    .m_goto ul li a span {padding-left: 10px;}

}

@media only screen and (max-width:450px){
    .lawmaker_box {padding:10px 4% 10px 4%}
    .m_bbs .view li.title > a {line-height: 30px; padding-left: 8px; font-size: 95%; letter-spacing: -0.05em;}
    .m_bbs .view li.title::before {top:12px}
    .main_visual{ padding-bottom: 60%; }

}