/*
메인 레이아웃
*/
a:hover {text-decoration: none;}
#mainContent {
    overflow: hidden;
    position: relative;
    font-family: 'score';
    font-size: 16px;
    font-weight: 300;
}

#mainContent h4 {
    font-family: 'score';
    font-weight: 500;
}

#mainContent h4+p {
    padding: 4px 0 28px;
    color: #777;
}

#mainContent .section {
    padding: 60px 0;
    background: #f7f7f7;
}

.control {
    position: absolute;
    top: 5px;
    right: 0;
}

.control button,
a.more {
    margin: 0 0 0 5px;
    padding: 0;
    border: none;
    position: relative;
    width: 20px;
    height: 20px;
    float: left;
    background: #fff;
    font-size: 0;
    text-indent: -999px;
    border-radius: 5px;
}

a.more:before,
a.more:after {
    margin: -1px 0 0;
    top: 50%;
    left: 6px;
    width: 9px;
    height: 1px;
    background: #777;
    transform: none;
}

a.more:after {
    margin: 0;
    top: 5px;
    left: 50%;
    width: 1px;
    height: 9px;
}

/* 메인비주얼 */
.visual_wrap {
    padding: 40px 0 110px;
    background: #fff url(/images/kr/main/sec1_bg.jpg) no-repeat bottom center;
    background-size: contain;
    box-sizing: border-box;
}

#visual {
    box-shadow: 5px 1px 20px rgba(170, 170, 170, 0.5);
    position: relative;
    width: 64.5%;
    height: 560px;
    float: left;
    border-radius: 10px;
}

#visual .list_wrap,
#visual .slick-list,
#visual .slick-track,
#visual .slick-slide,
#visual .slick-slide >div,
#visual .slick-slide .list{
    height: 100%;
}

#visual .list_wrap * {
    vertical-align: top;
}

#visual .list_wrap .list>img {
    overflow: hidden;
    width: 100%;
    height: 100%;
    border-radius: 10px;
}

#visual .list_wrap .list:not(:first-of-type) {
    display: none;
}

#visual .list_wrap.slick-initialized .list:not(:first-of-type) {
    display: inline-block;
}

#visual .slogan {
    position: absolute;
    top: 78px;
    left: 77px;
    z-index: 1;
    font-family: 'sebang';
    font-size: 30px;
    font-weight: 700;
    color: #222;
    text-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
}

#visual .slogan .s1{
    display: inline-flex;
    align-items: center;
    vertical-align: baseline;
}

#visual .slogan .s2 {
    display: block;
    padding: 10px 0 0 0;
    font-family: 'score';
    font-size: 17px;
    font-weight: 300;
    line-height: 1.5;
    color: #555;
    text-shadow: none;
}

#visual .slogan .navy{ padding-left: 8px;font-size: 38px;color: #39337c;}
#visual .slogan .pink{ padding-left: 8px;font-size: 38px;color: #eb5786;}

#visual .control {
    margin-left: 10px;
    top: auto;
    bottom: -5px;
    left: 50%;
    width: fit-content;
}

#visual .control button {
    border: none;
    background: transparent;
}

#visual .control .btns {
    width: 18px;
    height: 18px;
    background: transparent url(/images/kr/main/ico_control.png) no-repeat;
    border-radius: 4px;
}

#visual .control button:before{
    display: none;
}

#visual .control .btns:hover {
    outline: 1px solid #fff;
}

#visual .control .btn_prev {
    background-position: 7px 2px;
}

#visual .control .btn_stop {
    background-position: -15px 2px;
}

#visual .control .btn_stop.on {
    background-position: -53px 2px;
}

#visual .control .btn_next {
    background-position: -35px 2px;
}

.sec {
    width: 32.5%;
    float: right;
}

.tit_wrap h4 {
    display: inline-block;
    margin: 0 0 15px;
    font-size: 23px;
}

.tit_wrap h4+p {
    display: inline-block;
    padding: 0 0 0 23px;
    font-size: 14px;
    color: #777;
}

.page {
    padding: 0 0 0 19px;
    position: absolute;
    bottom: -20px;
    left: 50%;
    width: 194px;
    height: 50px;
    background: #2e2e33;
    font-family: 'score';
    font-weight: 500;
    line-height: 50px;
    color: #9c9c9c;
    transform: translateX(-50%);
    box-sizing: border-box;
    border-radius: 33px;
}

.page .current {
    color: #fff;
}

.page .current:after {
    display: inline-block;
    margin: -2px 10px 0 11px;
    width: 37px;
    height: 1px;
    vertical-align: middle;
    background: #ddd;
    content: '';
}


.control {
    position: absolute;
    bottom: -13px;
    left: 50%;
    z-index: 2;
}

.control:after {
    display: block;
    clear: both;
    content: '';
}

.control button,
.control a {
    margin: 0 4px 0 0;
    border: 1px solid #e0e0e0;
    position: relative;
    width: 26px;
    height: 26px;
    float: left;
    vertical-align: top;
    font-size: 0;
    text-indent: -9999px;
    box-sizing: border-box;
    border-radius: 50%;
}

.control button:before {
    border-top: 2px solid #767676;
    border-right: 2px solid #767676;
    position: absolute;
    top: 8px;
    left: 10px;
    width: 7px;
    height: 7px;
    content: '';
    transform: rotate(-135deg);
}

.control .btn_next:before {
    left: 8px;
    transform: rotate(45deg);
}

.control .btn_stop:before {
    border-top: none;
    border-left: 2px solid #767676;
    border-right-width: 2px;
    top: 6px;
    left: 9px;
    width: 7px;
    height: 11px;
    transform: none;
}

.control .btn_stop.on:before {
    border-top: 8px solid #767676;
    border-right: none;
    border-left: 8px solid transparent;
    top: 7px;
    left: 6px;
    transform: rotate(45deg);
}

.control a:before,
.control a:after {
    margin: -2px 0 0 -6px;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 12px;
    height: 2px;
    background: #767676;
    content: '';
}

.control a:after {
    margin: 0;
    top: 6px;
    left: 12px;
    width: 2px;
    height: 12px;
}

em.tit {
    display: inline-block !important;
    padding: 0 20px 0 0;
    overflow: hidden;
    max-width: 98%;
    vertical-align: middle;
    font-weight: 400;
    white-space: nowrap;
    text-overflow: ellipsis;
    box-sizing: border-box;
}

.new {
    display: inline-block !important;
    margin: -1px 0 0 -20px;
    width: 16px;
    height: 16px;
    vertical-align: middle;
    background: #d3485f;
    font-size: 10px;
    font-weight: 500;
    line-height: 16px;
    color: #fff;
    text-align: center;
    text-transform: uppercase;
    border-radius: 50%;
}

.no_list {
    padding: 6em 0 0 0 !important;
    width: 100% !important;
    text-align: center;
}

.no_list:before {
    display: none !important;
}

@media all and (max-width:568px) {
    .no_list {
        padding: 3em 0 0 0 !important;
    }
}

/* 열린의장실 */
#chairman {
    margin: 0 0 22px;
    padding: 34px 0 30px 37px;
    border: 7px solid #fff;
    border: 1px solid #e1e3f1;
    box-shadow: 5px 1px 15px rgba(170, 170, 170, 0.25);
    overflow: hidden;
    position: relative;
    background: #646189 url(/images/kr/main/bg_chairman.jpg) center no-repeat;
    background-size: cover;
    border-radius: 10px;
    box-sizing: border-box;
}

#chairman .pic {
    position: absolute;
    right: 0;
    bottom: 0;
}

#chairman .txt {
    padding: 0;
    font-family: 'sebang';
    font-weight: 500;
    color: #fff;
    word-break: keep-all;
    box-sizing: border-box;
}

#chairman .txt p.tt{
	padding: 0 0 12px;
	font-size:25px;
	text-shadow: 0 0 5px rgba(17,17,17,0.2);
	font-weight: 600;
}

#chairman .txt p {
    padding: 0px 0 20px;
    font-size: 23px;
    line-height: 1.4;
    text-shadow: 0 0 5px rgba(17,17,17,0.2);
}

#chairman .txt strong {
    font-size: 30px;
    color: #fff8bf;
}

#chairman .btns a {
    display: block;
    margin: 0 0 8px;
    padding: 10px 25px;
    border: 1px solid transparent;
    position: relative;
    width: 99px;
    background: #fff;
    font-family: 'score';
    font-size: 14px;
    font-weight: 300;
    color: #333;
    transition: .3s ease-in-out;
    border-radius: 21px;
}

#chairman .btns a:hover{
    border-color: #646189;
}

#chairman .btns a:after {
    display: inline-block;
    margin: -4px 0px 0 10px;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    background: url(/images/kr/main/ico_pen.png) no-repeat;
    content: '';
}

#chairman .btns a:last-child:after {
    background-image: url(/images/kr/main/ico_lnk.png);
}

/* 의사일정 */
#agenda {
    padding: 0 38px 30px;
    border: 1px solid #ffbbd5;
    box-shadow: 5px 1px 20px rgba(170, 170, 170, 0.1);
    position: relative;
    background: #fff;
    box-sizing: border-box;
    border-radius: 10px;
}

#agenda .tit_wrap {
    padding: 32px 0 0 0;
    position: relative;
    font-family: 'Nanum Square';
    text-align: center;
}

#agenda .tit_wrap:after {
    display: block;
    margin-top: 15px;
    width: 100%;
    height: 4px;
    clear: both;
    background: url(/images/kr/main/pat_agenda.png) center no-repeat;
    background-size: cover;
    content: '';
}

#agenda h4 {
    margin: 0;
    vertical-align: middle;
    font-family: 'Nanum Square';
    font-size: 23px;
    color: #333;
}

#agenda h4 span {
    font-size: 25px;
    font-weight: 900;
    color: #eb5786;
}

#agenda .month {
    display: inline-block;
    padding: 0px 0 0 19px;
    position: relative;
    vertical-align: top;
    font-family: 'Nanum Square';
    font-size: 25px;
    font-weight: 700;
    line-height: 28px;
    color: #222;
}

#agenda .month:before {
    position: absolute;
    top: 10px;
    left: 9px;
    width: 1px;
    height: 16px;
    background: #d5d5d5;
    content: '';
    transform: rotate(15deg);
}

#agenda .month strong {
    font-family: 'Nanum Square';
    font-size: 30px;
    font-weight: 900;
}

#agenda .tit_wrap .day{font-size: 23px; color: #333;}

#agenda .date {
    display: table;
    padding: 25px 0 25px;
	width: 90%;
    margin: auto;
    table-layout: fixed;
}

#agenda .date p {
    display: table-cell;
    position: relative;
    font-family: 'score';
    font-size: 15px;
    font-weight: 500;
    color: #333;
    text-align: center;
	z-index: 1;
}

#agenda .date p.sat { color: #447cd8;}

#agenda .date p.sun { color: #d84455;}

#agenda .date p.today:before {
    position: absolute;
    top: 50%;
    left: 51%;
    width: 30px;
    height: 30px;
    background: #eb5786;
    content: '';
    transform: translate(-50%, -50%);
    border-radius: 50%;
	z-index: -1;
}

#agenda .date p.today {
    color: #fff;
}
#agenda .date p.today span {
    position: relative;
    color: #fff;
}

#agenda .txt { position: relative;}

#agenda .list_wrap {
    padding: 0 0 0 20px;
    overflow: hidden;
    height: 50px;
    background: #f3f3f3;
    border-radius: 10px;
    box-sizing: border-box;
}

#agenda .list_wrap .list a,
#agenda .list_wrap .list p {
    display: block;
    padding: 0 80px 0 15px;
    overflow: hidden;
    position: relative;
    font-size: 15px;
    font-weight: 300;
    line-height: 50px;
    color: #333;
    white-space: nowrap;
    box-sizing: border-box;
    text-overflow: ellipsis;
}

#agenda .list_wrap .list p:before,
#agenda .list_wrap .list a:before {
    margin: -2px 0 0;
    position: absolute;
    top: 50%;
    left: 0;
    width: 5px;
    height: 5px;
    background: #bbb;
    content: '';
    border-radius: 50%;
}

#agenda .control {
    top: 16px;
    right: 8px;
    bottom: 12px;
    left: auto;
}

#agenda .control button {
    border: none;
    width: 16px;
    height: 18px;
    background: url(/images/common/ico_controlB.png) no-repeat;
}

#agenda .control button:before{display: none;}
#agenda .control button.btn_prev{background-position: 6px 2px;}
#agenda .control button.btn_stop{background-position: -16px 2px;}
#agenda .control button.btn_stop.on{background-position: -54px 2px;}
#agenda .control button.btn_next{background-position: -39px 2px;}



#agenda .date-control button {border: none; font-size: 0; width: 20px; height: 20px; background: url(/images/common/ico_controlB.png) no-repeat 4px 2px; vertical-align: top; position: absolute; top: 107px;}
#agenda .date-control button.btn_prev {left: 35px;}
#agenda .date-control button.btn_next {background-position: -36px 2px; right: 35px;}
#agenda .date p {cursor: pointer;}
#agenda div.month-wrap {display: inline-block; vertical-align: top;}
#agenda p.today {color: #fff !important;}
#agenda .date {padding: 16px 0;}
#agenda div.date div.slick-list {padding: 8px 0;}
#agenda div.date p.agenda:after {content: ''; width: 60%; height: 2px; background: #67106d; position: absolute; bottom: -7px; left: 50%; transform: translate(-50%, 0);}


@media all and (max-width:1500px) {
    #chairman { margin: 0 0 10px;}
    #chairman .txt strong {display: block;}

    #agenda {padding: 0 25px 40px;}
}

@media all and (max-width:1330px) {
	#agenda h4 {font-size: 20px;}
	#agenda h4 span {font-size: 23px;}
	#agenda .month {font-size: 23px;}
	#agenda .month strong {font-size: 26px;}
    #agenda .tit_wrap {padding: 15px 0 15px;}
	#agenda .date {padding: 0 0 15px; width: 80%;}
	#agenda .date-control button {top: 90px;}

}
@media all and (max-width:1280px) {
    #agenda {padding: 0 20px 30px}
    #agenda .tit_wrap {padding: 15px 0 16px;}
	#agenda .month strong {font-size: 30px;}
    #agenda .month {font-size: 25px;}
    /* #agenda .tit_wrap {padding: 38px 0 26px;}
    #agenda .date-control button {top: 155px;} */
	
	
}

@media all and (max-width:1230px) {
    #visual {
        width: 100%;
        height: 400px;
    }
    

    #visual *:not(.page):not(.slogan):not(.control) {
        height: 100%;
    }


    #visual .slogan{
        top: 30px; 
        left: 40px;
        font-size: 24px;
    }

    #visual .slogan .navy{padding-left: 6px;font-size: 30px;}
    #visual .slogan .pink{ padding-left: 6px;font-size: 30px;} 
    #visual .slogan .s2{font-size: 16px;}     
    .page{height: 40px; line-height: 40px;}
    #visual .control{
        bottom: -14px;
        width: 75px;
        height: 24px;
    }

    .sec {
        padding: 40px 0 0;
        width: 100%;
    }

    #chairman {
        padding: 34px 0 24px 20px;
        width: 460px;
        float: left;
    }

    #chairman .txt h5{font-size: 22px;}
    #chairman .txt p{padding: 0px 0 16px; font-size: 20px;}
    #chairman .txt strong{ display: inline-block;font-size: 27px}
    #chairman .pic{width: 40%;}
    #chairman .pic img{width: 100%;}

    #agenda {width: calc(100% - 480px);float: right;}
    #agenda .tit_wrap {padding: 46px 0 26px;}
    #agenda .date {padding: 26px 0 29px;}
	
	#agenda .date-control button {top: 157px;}
	
}

@media all and (max-width:1024px) {
    .visual_wrap {padding: 20px 0;}
}

@media all and (max-width:940px) {
    #chairman {width: 440px;}

    #agenda {width: calc(100% - 460px);}
    #agenda .tit_wrap {padding: 30px 0 0px;}
    #agenda h4{ display: block;font-size: 20px; line-height: 1.5;}
    #agenda h4 span{font-size: 23px;}
    #agenda .month{font-size: 22px;}
    #agenda .month:before{display: none;}
    #agenda .month strong{font-size: 26px;}
    #agenda .tit_wrap .day{font-size: 18px;}
    #agenda .date-control button {top: 151px;}
}

@media all and (max-width:840px) {
    .visual_wrap{background-size: cover;}
    #visual .slogan {font-size: 20px;}
    #visual .slogan img {height: 33px;}
    .tit_wrap h4 {margin: 0 0 5px !important;}
    .tit_wrap h4+p {
        display: block;
        padding: 0;
    }

    #chairman {width: 100%; padding: 34px 0 24px 40px;}
    #chairman .txt p {font-size: 1.133em;}
    #chairman .txt strong {
        display: inline;
        font-size: 1.533em;
    }

    #chairman .pic{width: 180px;}

    #agenda {width: 100%;}
    #agenda .tit_wrap {padding: 30px 0 20px;}

    #agenda .tit_wrap:after{
        margin-top: 6px;
        background-repeat: repeat;
        background-size: contain;
    }

    #agenda h4{display: inline-block;}
    #agenda .month:before{display: block; line-height: 34px;}
    #agenda .date {padding: 16px 0 16px;}
    #agenda .list_wrap .list a, 
    #agenda .list_wrap .list p{padding: 0 120px 0 15px;}
	#agenda .date-control button {top: 125px;}
	
	
	
}

@media all and (max-width:620px) {
    #visual{height: 300px;}
    #visual .slogan {
        top: 17px;
        left: 15px;
        font-size: 17px;
    }

    #visual .slogan .navy,
    #visual .slogan .pink{font-size: 24px;}
    #visual .slogan .s1{ flex-wrap: wrap;letter-spacing: 0;}
    #visual .slogan .s2 {padding-left: 0px;font-size: 14px;}
    .page{height: 34px;line-height: 34px;}
    #visual .control{bottom: -17px;}

    .tit_wrap h4 {font-size: 21px;}

    #agenda .month {
        padding-top: 0;
        font-size: 21px;
    }

    #agenda .month:before {top: 1px;}

    #agenda .list_wrap .list p:before,
    #agenda .list_wrap .list a:before {
        margin: -3px 0 0;
    }
}

@media all and (max-width:380px) {
    #visual{height: 260px;}
    #visual .slogan {font-size: 15px;}
    #visual .slogan .navy, #visual .slogan .pink{padding: 0;}

    #chairman { padding: 15px 0 20px 20px;}
    #chairman .txt h5{font-size: 22px;}
    #chairman .txt p {
        padding: 0 0 14px;
        font-size: 1.133em;
    }

    #chairman .pic {width: 135px;}
    #chairman .btns a{padding: 7px 14px; width: 100px;}

    .tit_wrap h4,
    #agenda .month {
        font-size: 19px;
    }

    #agenda {padding: 0 15px 15px;}
    #agenda .tit_wrap {padding: 20px 0 10px;}
    #agenda .month:before{display: none;}
    #agenda .date {padding: 15px 0 24px;}
    
    #agenda .date-control button {top: 105px;}
	#agenda .date-control button.btn_prev {left: 15px;}
	#agenda .date-control button.btn_next {right: 15px;}

}
@media (max-width: 349px) {
	#agenda .month {padding: 0;}
	#agenda div.month-wrap {display: block;}
    #agenda .date {padding: 0 0 24px;}
    #agenda .date-control button {top: 123px;}
}
/* 게시판 */
#board{padding: 80px 0 77px;}
#board .tit{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-bottom: 30px;
    position: relative;
}

#board .tit h5{
    font-family: 'sebang';
    font-size: 30px;
    font-weight: 400;
    color: #333333;
}

#board .tit h5 .pink{
    font-size: 38px;
    font-weight: 700;
    color: #e76395;
}

#board .list_wrap{
    display: flex;
    align-items: center;
    margin-left: auto;
}

#board .list_wrap .list_item{padding: 0 37px;position: relative;}
#board .list_wrap .list_item:after{
    display: inline-block;
    position: absolute;
    top: 5px;
    right: 0;
    width: 1px;
    height: 15px;
    background: #cecece;
    content: '';
    transform: rotate(15deg);
}

#board .list_wrap .list_item.list_item4:after {display: none;}

#board .list_wrap .list_item a{
    position:relative;
    font-family: 'Nanum Square';
    font-size: 20px;
    color: #555555;
}
#board .list_wrap .list_item a::before{
    display: inline-block;
    position: absolute;
    bottom: -3px;
    left: 50%;
    z-index: -1;
    width: 0%;
    height: 16px;
    background: #f3f3f3;
    transition: .3s;
    content: '';
    border-radius: 8px;
    transform: translateX(-50%);
}

#board .list_wrap .list_item.on a:before{width: calc(100% + 20px);}

#board .list_wrap .list_item.on a{
    font-size: 26px;
    font-weight: 900;
    color: #111;
}

#board .more_wrap{ margin-left: 5.7vw; position: relative;}
#board .more_i{ display: none;}
#board .more_i.on{ display: block;}

#board .more_i a{
    display: block;
    border: none;
    position: relative;
    width: 50px;
    height: 50px;
    background: #2d2f3c url(/images/kr/main/ico_plus.png) center no-repeat;
    border-radius: 50px;
}

#board .cont_item{
    display: none;
}

#board .cont_item.on{display: block; }

#board .cont_item > ul{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
#board .cont_item .cont{
    padding: 30px 16px 36px 26px;
    border: 1px solid #ddd;
    outline: 2px solid transparent;
    outline-offset: -1px;
    box-shadow: 0 0 0 rgba(170,111,133, 0);
    width: 19.95%;
    transition: .3s;
    border-radius: 10px;
}

#board .cont_item > ul li + li {
    margin-left: 35px;
}

#board .cont .desc{
    display: flex;
    align-items: start;
    justify-content: start;
    flex-direction: column;
    width: 100%;
    max-width: 280px;
    height: 100%;
    font-family: 'score';
}

#board .cont .tip{
    margin-bottom: 9px;
    padding: 6px 15px;
    box-shadow: 0 0 7px transparent;
    max-width: 60px;
    background: #ddd;
    font-size: 14px;
    color: #111;
    border-radius: 16px;
}
#board div.cont_wrap div.cont_item.cont_item3 .cont .tip {max-width: 110px;}
#board .cont .date{
    margin-bottom: 9px;
    font-size: 15px;
    font-weight: 500;
    color: #555;
    letter-spacing: -0.3px;
}

#board .cont h4{
    display: block;
    overflow: hidden;
    width: 100%;
    min-height: 31px;
    font-size: 18px;
    font-weight: 500;
    color: #333;
    white-space: nowrap;
    transition: .3s;
    text-overflow: ellipsis;
}

#board .cont .new{
    margin: 0px 0 14px 0;
    width: 16px;
    height: 17px;
    background-color: #f5434a;
    border-radius: 3px;
}

#board .cont .txt{
    display: -webkit-box;
    overflow: hidden;
    position: relative;
    font-size: 15px;
    font-weight: 300;
    line-height: 1.56;
    color: #555;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    text-overflow: ellipsis;
}

#board .cont_item .cont:hover{border-color: transparent; outline-color: #e76395; box-shadow: 0 0 20px rgba(171, 111, 133, 0.2);}
#board .cont_item .cont:hover .tip{box-shadow: 0 0 7px rgba(203, 187,170,0.35); background-color: #e76395; color: #fff;}
#board .cont_item .cont:hover h4{color: #e76395;}
#board .more_i:first-child {
    visibility: hidden;
}

@media screen and (max-width: 1500px) {
    #board .tit h5{font-size: 24px;}
    #board .tit h5 .pink{font-size: 34px;}
    #board .list_wrap .list_item{padding: 0 24px;}
    #board .list_wrap .list_item a{font-size: 18px;}
    #board .list_wrap .list_item.on a{font-size: 24px;}
    #board .more_i a{width: 40px; height: 40px;}

    #board .cont_item .cont{
        margin: 0 0 20px 0;
    }
}
@media screen and (max-width: 1000px) {
    #board{padding: 50px 0 60px;}
    #board .tit h5{margin-bottom: 14px;}
    #board .more_wrap{margin-left: 2.3vw;}
    #board .more_i a{width: 34px;height: 34px;border-radius: 8px;}
}

@media screen and (max-width: 980px) {
    #board .cont_item .cont{width: calc((100% - 110px)  / 2);}
	#board .cont .desc {max-width: 340px;}
    #board .list_wrap .list_item.on a {font-size: 20px;}

	/* #board .list_wrap {margin-top: 55px;} */

}
@media screen and (max-width: 768px) {
    #board{padding: 50px 0 50px;}
    #board .tit h5 { margin-bottom: 30px; font-size: 22px; }
    #board .tit h5 .pink { font-size: 28px; }

    /* #board .list_wrap {
        justify-content: start;
        flex-wrap: wrap;
        margin-left: 0;
        padding: 8px 0;
        width: 100%;
        background: #f4f6fc;
        border-radius: 8px;
    }
    
    #board .list_wrap .list_item {
        padding: 10px 0;
        width: 33.333%;
        text-align: center;
        box-sizing: border-box;
    } */

    /* #board .list_wrap .list_item:nth-child(3):after{display: none;} */
    #board .list_wrap .list_item.list_item5:after { display: block; }
    #board .list_wrap .list_item:after { top: 50%; transform: rotate(0deg) translateY(-50%); }

    #board .list_wrap .list_item a,
    #board .list_wrap .list_item.on a { font-size: 17px; }

    /* #board .more_wrap {margin-top: 12px;width: 30.33%;} */
    #board .more_i a {width: 100%;height: 32px;}
    #board .cont_item .cont {
        margin: 0 0 15px 0;
        padding: 20px;
        width: 42%;
    }
    #board .cont .desc{position: relative;}
    #board .cont .tip{
        margin-bottom: 5px;
        padding: 4px 15px;
        font-size: 13px;
    }
    #board .cont .date{font-size: 14px}
    #board .cont h4{font-size: 16px;}
    #board .cont .txt{font-size: 14px;}
    #board .cont .new{position: absolute; right: 0;}
	
    #board .more_wrap {width: 32px; margin-top: 0;}
    #board .list_wrap .list_item {padding: 0 15px;}	
}

@media screen and (max-width: 568px){
    #board{padding: 36px 0 77px;}
    #board .tit h5 {margin-bottom: 24px;font-size: 20px;}
    #board .tit h5 .pink {font-size: 25px;}
    #board .cont_item .cont {margin: 0 0 15px 0;width: 40%;}
}

@media screen and (max-width: 500px){
	#board .list_wrap {justify-content: start; flex-wrap: wrap; margin-left: 0; padding: 8px 0; width: 100%; background: #f4f6fc; border-radius: 8px;}
    #board .list_wrap .list_item {padding: 10px 0; width: 50%; text-align: center; box-sizing: border-box;}
    #board .list_wrap .list_item2:after {display: none;}
	#board .more_wrap {position: absolute; top: 0; right: 0; height: 32px;}
}
@media screen and (max-width: 480px){
	#board {padding: 36px 0 50px;}
	#board .tit {margin-bottom: 15px;}
}
@media screen and (max-width: 440px){
    #board .cont_item .cont {width: 100%; padding: 10px; box-sizing: border-box;}

}
@media screen and (max-width: 340px){
    /* #board .cont_item .cont{width: calc(100% - 40px);} */
}

/* 퀵 메뉴 */
#quick .wrap{
    display: flex; 
    justify-content: space-between; 
    margin-bottom: 120px;
}

#quick .wrap li{
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 30px;
    margin-bottom: 12px;
    width: calc((100% - 43px * 5) / 7);
}

#quick .wrap li:last-child{margin-right: 0;}

#quick .wrap a{
    display: inline-flex; 
    align-items: center; 
    flex-direction: column;
}

#quick .wrap .icon{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #eee;
    box-shadow: 0 0 20px rgba(170, 170, 170, 0.2);
    width: 125px;
    height: 125px;
    background-color: #fff;
    transition: .3s;
    border-radius: 125px;
}

#quick .wrap .txt{
    margin-top: 22px;
    font-size: 18px;
    font-weight: 500;
    color: #222;
}

#quick .wrap a:hover .icon{border-color: #eb5786;}

@media screen and (max-width: 1350px) {
    #quick .wrap{margin-bottom: 40px;}
    #quick .wrap li {width: 22%; margin-right: 0px; margin-bottom: 46px; align-items: flex-start;}
	#quick .wrap .txt {font-size: 15px;}
}

@media screen and (max-width: 1040px){
    #quick .wrap {flex-wrap: wrap; width: 580px; margin: 0 auto 40px;}
	#quick .wrap li:nth-child(4) {margin-right: 0;}
    #quick .wrap li {width: 23%;}
}
@media screen and (max-width: 768px){
    #quick .wrap .icon{width: 100px; height: 100px;}
    #quick .wrap .icon img{width: 100%;}
    #quick .wrap .txt{ margin-top: 16px;font-size: 16px;}
}

@media screen and (max-width: 650px){
    #quick .wrap .icon{width: 80px;height: 80px;}
    #quick .wrap .txt{margin-top: 14px;font-size: 15px; text-align: center;}
}

@media screen and (max-width: 600px){
    #quick .wrap {width: 100%;}
    #quick .wrap li {width: 22%; margin-right: 0;}	
    #quick .wrap li:nth-child(4) {margin-right: 0px;}
	#quick .wrap li:nth-child(3n) {margin-right: 0;}
	
	
	
}
@media screen and (max-width: 480px){
    #quick .wrap {display: block; width: 325px;}
	#quick .wrap li {width: 90px; display: inline-block; text-align: center; margin: 0 20px 20px 0;}
    #quick .wrap li:nth-child(4) {margin-right: 20px;}
	
	

}
@media screen and (max-width: 350px){
    #quick .wrap li {margin: 0 10px 20px 0;}
	#quick .wrap li:nth-child(4) {margin-right: 10px;}

}

/* 현역의원 */
#member {
    padding: 95px 0 53px;
    overflow: hidden;
    position: relative;
    /* min-height: 660px; */
    background: linear-gradient(to right, #ebeaf9, #fcf4fb);
}

#member:before{
    content: '';
    width: 570px;
    height: 570px;
    display: inline-block;
    background: url(/images/kr/main/mem_cir.png) center no-repeat;
    position: absolute;
    top: -14rem;
    left: -11rem;
    pointer-events: none; 
}

#member .member_layout {
    display: -ms-flexbox;
    display: flex;
    align-items: flex-start;
    -ms-flex-align: start;
}

#member .member_left {
    -ms-flex: 1;
    flex: 1;
    margin-right: 49px;
    padding: 0 24px 0 0;
    min-width: 0;
}

#member .member_right {
    flex-shrink: 0;
    padding-top: 50px;
    position: relative;
    width: 665px;
    -ms-flex-negative: 0;
}

#member .member_right .map_tip {
    position: absolute;
    top: 12px;
    right: 32px;
    z-index: 1;
    font-size: 15px;
    font-weight: 300;
    line-height: 1.6;
    color: #333;
    text-align: left;
}

#member .map_area {
    z-index: 4;
    position: relative;
}

#member .map_area .map_img {
    display: none;
    width: 100%;
    height: auto;
}

#member .map_area .map_img.on {
    display: block;
}

#member .tit_wrap .top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-bottom: 0;
    -ms-flex-align: center;
}

#member .tit_wrap h4 {
    flex-shrink: 0;
    margin-bottom: 10px;
    font-family: 'sebang';
    font-size: 35px;
    font-weight: 400;
    color: #333;
    letter-spacing: -1.5px;
}

#member .tit_wrap h4 .navy {
    font-size: 40px;
    font-weight: 700;
    color: #39337c;
}

#member .control {
    position: static;
}

#member .control .btns {
    border: 1px solid #d9daee;
    width: 32px;
    height: 32px;
    background: #fff url(/images/common/ico_controlB.png) no-repeat;
    border-radius: 5px;
}

#member .control button:before { display: none; }

#member .control .btns:hover { outline: 1px solid #fff; }
#member .control .btn_prev  { background-position: 11px 7px; }
#member .control .btn_stop  { background-position: -9px 7px; }
#member .control .btn_stop.on { background-position: -49px 7px; }
#member .control .btn_next  { background-position: -29px 7px; }

#member .more {
    display: inline-block;
    padding: 0 21px 0 17px;
    border: 1px solid #d9daee;
    position: relative;
    width: 92px;
    height: 32px;
    background: #fff;
    font-size: 14px;
    line-height: 32px;
    color: #333;
    text-decoration: none;
    text-indent: 0;
    box-sizing: border-box;
    border-radius: 5px;
}

#member .more:before,
#member .more:after {
    margin: 0;
    position: absolute;
    top: 50%;
    right: 20px;
    left: auto;
    width: 10px;
    height: 2px;
    background: #353535;
    content: '';
    transform: translateY(-50%);
}

#member .more:after {
    top: 50%;
    right: 24px;
    width: 2px;
    height: 10px;
}

#member .mem_sch {
    display: -ms-flexbox;
    display: flex;
    align-items: center;
    margin-bottom: 24px;
    padding: 24px 0;
    border-top: 2px solid #e7e6eb;
    border-bottom: 2px solid #e7e6eb;
    -ms-flex-align: center;
    justify-content: space-between;
}

#member .mem_sch h5 {
    flex-shrink: 0;
    font-family: 'Nanum Square';
    font-size: 23px;
    font-weight: 900;
}

#member .mem_sch .mem_schBox {
    margin: 0 11px 0 24px;
    padding: 3px 20px;
    border: 1px solid #ddd;
    box-shadow: 0 0 10px rgba(149, 147, 170, 0.2);
    width: 390px;
    height: 46px;
    background-color: #fff;
    border-radius: 23px;
    box-sizing: border-box;
}

#member .mem_sch .mem_schBox::placeholder {
    font-family: 'Noto Sans KR';
    font-size: 15px;
    font-weight: 500;
    color: #999;
}

#member .mem_sch button {
    display: -ms-inline-flexbox;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: none;
    width: 100px;
    height: 46px;
    background: #eb5786;
    font-family: 'Noto Sans KR';
    font-size: 15px;
    color: #fff;
    cursor: pointer;
    border-radius: 23px;
    -ms-flex-align: center;
    -ms-flex-pack: center;
}

#member .mem_sch button i { margin-right: 4px; }

#member .list_wrap {
    position: relative;
}

.member_list { padding: 0; }

.member_list .district {
    margin-bottom: 10px;
    padding: 0 0 14px 35px;
    background: url(/images/kr/main/ico_map.png) no-repeat top 0 left;
}

.member_list .district strong {
    font-family: 'Nanum Square';
    font-size: 25px;
    font-weight: 900;
    color: #333;
}

.member_list .district span {
    font-family: 'Nanum Square';
    font-size: 20px;
    font-weight: 600;
    color: #333;
}

.member_list > ul {padding-top: 28px;overflow: hidden;}
.member_list > ul:after {
    display: block;
    clear: both;
    content: '';
}

.member_list > ul > li {
    margin: 30px 22px 50px 0;
    padding: 90px 17px 32px;
    border: 1px solid #eee;
    box-shadow: 5px 0 20px rgba(204, 204, 204, 0.2);
    width: 206px;
    height: 285px;
    float: left;
    background: #fff;
    box-sizing: border-box;
    border-radius: 15px;
}

.member_list > ul > li:nth-child(3n){margin-right: 0;}

.member_list > ul > li .pic {
    margin: -145px auto 15px;
    border: 1px solid #a2a4c5;
    overflow: hidden;
    width: 113px;
    height: 131px;
    background: #f6f6f6;
    text-align: center;
    transition: .5s;
    border-radius: 56px;
}

.member_list > ul > li:hover .pic,
.member_list > ul > li:active .pic,
.member_list > ul > li:focus .pic { border-color: #84a1d3; }

.member_list > ul > li .pic img { width: 100%; height: 100%; }
.member_list > ul > li .txt { text-align: center; }

.member_list > ul > li .txt .name {
    font-family: 'Nanum Square';
    font-size: 21px;
    font-weight: 900;
    color: #333;
    text-align: center;
	font-family: 'Noto Sans KR';
}

.member_list > ul > li .dot {
    margin: 24px 0 0;
    padding-left: 4px;
    font-size: 18px;
    font-weight: 600;
}

.member_list > ul > li .dot li {
    padding-bottom: 6px;
    padding-left: 12px;
    position: relative;
    background: none;
    font-size: 14px;
    font-weight: 300;
    color: #333;
    text-align: left;
}

.member_list > ul > li .dot li:before {
    display: inline-block;
    position: absolute;
    top: 6px;
    left: 0;
    width: 5px;
    height: 5px;
    background: #ccc;
    content: '';
}

.member_list > ul > li .txt .btn_wrap {
    margin: 0 auto;
    padding: 6px 0 0;
    text-align: center;
	font-size: 0;
}

.member_list > ul > li .txt a {
    display: inline-block;
    width: 32px;
    height: 32px;
    background: #39337c url(/images/kr/main/ico_home.png) center no-repeat;
    font-size: 0;
    line-height: 32px;
    color: #fff;
    text-align: center;
    border-radius: 32px;
}

.member_list > ul > li .txt a:last-child {
    margin: 0 0 0 5px;
    background: #232447 url(/images/kr/main/ico_profile.png) center no-repeat;
}

/* 원형 텍스트 */
#member .circle_txt {
    position: absolute;
    right: -6rem;
    bottom: -6rem;
    z-index: 0;
    pointer-events: none;
}

#member .circle_txt svg,
#member .circle_txt svg * {
    outline: none;
    pointer-events: none;
}

#member .circle_txt svg text {
    font-family: 'score';
    font-size: 18px;
    font-weight: 900;
    letter-spacing: 5px;
    pointer-events: none;
    fill: #ebe2ec;
}


@media all and (max-width: 1420px){
    #member .tit_wrap h4{font-size: 30px;}
    #member .tit_wrap h4 .navy{font-size: 34px;}
	#member .member_right{width: 45%;}
    #member .member_left { margin-right: 16px; padding: 0;}
    .member_list .district strong{font-size: 24px;}
    .member_list .district span{font-size: 18px;}
}
@media all and (max-width: 1183px){
	#member .mem_sch .mem_schBox {width: 330px;}

}

@media all and (max-width: 1105px) {
    #member{padding: 40px 0;}

    #member .member_layout {
        -ms-flex-direction: column;
        flex-direction: column-reverse;
    }

    #member .member_left {
        margin-right: 0;
        margin-bottom: 30px;
        position: relative;
        z-index: 3;
        width: 100%;
        flex: none;
    }

    #member .mem_sch{
        justify-content: center;
    }

    #member .member_right {
        margin: 0 auto 30px;
        padding: 0;
        width: 70%;
        flex: none;
    }

    #member .map_area .map_img.on {
        display: block;
        margin: 0 auto;
        max-width: 650px;
    }


    #member .member_right .map_tip {
        margin: 20px 0 12px;
        position: static;
        text-align: left;
    }

    #member .member_right .map_tip br:first-child{display: none;}
    
    .member_list > ul{padding-top: 100px;}

    .member_list > ul > li {
        margin-right: 1.3%;
        width: 32%;
        height: auto;
    }

    .member_list > ul > li:nth-child(3n) { margin-right: 0; }
    .member_list > ul > li {
        padding: 20px 0 15px 20px;
        height: auto;
    }

}


@media all and (max-width: 860px) {
    #member .tit_wrap h4{font-size: 24px;}
    #member .tit_wrap h4 .navy{font-size: 31px;}
    #member .mem_sch{flex-wrap: wrap;}
    .member_list > ul{padding-top: 20px;}
    .member_list > ul > li { padding: 20px 0 15px; }

    .member_list > ul > li .pic {
        margin: -65px auto 0;
        float: none;
    }

    .member_list > ul > li .txt {
        padding: 10px 0 0;
        float: none;
        text-align: center;
    }

    .member_list > ul > li .txt a { display: inline-block; }
    .member_list > ul > li .dot{
        margin: 24px auto 0;
        width: calc(100% - 40px);
    }
}

@media all and (max-width: 768px) {
    #member { padding: 45px 0; }
    #member .tit_wrap { padding: 0 0 10px; }
    #member .mem_sch h5{font-size: 22px;}
    /* #member .mem_sch .mem_schBox {margin: 0 11px 0 10px;width: calc(100% - 240px);} */

    .member_list > ul > li {
        margin-right: 2%;
        width: 49%;
    }

    .member_list > ul > li:nth-child(3n) { margin-right: 2%; }
    .member_list > ul > li:nth-child(2n) { margin-right: 0; }
    #member .circle_txt{bottom: -10rem;}
    #member .circle_txt svg{width: 280px; width: 280px;}
}

@media all and (max-width: 568px) {
    #member .tit_wrap .top{justify-content: center;}
    #member .tit_wrap h4{font-size: 18px;}
    #member .tit_wrap h4 .navy{font-size: 26px;}
    #member .control{
        margin: 2% 0 2% auto;
        position: absolute;
        bottom: auto;
        top: 7rem;
        display: flex;
        justify-content: end;
    }
    #member .control .btns{width: 26px; height: 26px;}
    #member .control .btn_prev  {background-position: 8px 5px;}
    #member .control .btn_stop  {background-position: -12px 5px;}
    #member .control .btn_stop.on { background-position: -52px 5px; }
    #member .control .btn_next  {background-position: -32px 5px;}
    #member .more{height: 26px; line-height: 26px;}
    #member .mem_sch{margin-bottom: 12px; padding: 12px 0 15px;}
    #member .mem_sch h5{font-size: 17px;}
    #member .mem_sch .mem_schBox{ width: calc(100% - 140px);height: 38px;}
    #member .mem_sch button{height: 38px;}
    .member_list .district {
        padding: 0 0 8px 28px;
        background-position: top 0 left;
        background-size: 21px;
    }

    .member_list .district strong{font-size: 20px;}
    .member_list .district span{
        display: block;
        margin-top: 6px; 
        margin-left: -28px;
        font-family: 'score'; 
        font-size: 14px;
        font-weight: 400;
    }

    .member_list > ul{padding-top: 0;}
    .member_list > ul > li{margin: 0 2% 2% 0;}
    .member_list > ul > li .pic { margin-top: 0;width: 90px;height: 100px;}
    .member_list > ul > li .dot{ padding-left: 0;width: calc(100% - 20px);}

    #member .member_right{width: 100%; margin-bottom: 16px;}
    #member .member_right .map_tip{font-size: 14px;}
    #member .member_right .map_tip br{display: none;}
}

@media all and (max-width: 400px) {
    .member_list > ul > li {
        margin: 0 1% 10px 0;
        width: 49.5%;
        word-break: break-all;
    }

    .member_list > ul > li:nth-child(3n){margin-right: 1%;}
    .member_list > ul > li:nth-child(2n) { margin-right: 0; }
    .member_list > ul > li .pic { width: 80px; height: 85px; }
	
    #member .mem_sch h5 {width: 100%; text-align: center; margin-bottom: 10px;}
    #member .control {top: 9rem;}
	
}
@media all and (max-width: 380px) {
	#member .more:after {right: 21px;}
	#member .more:before {right: 17px;}
	#member .map_area .map_img {width: 300px; height: auto;}
/*     #member .map_area {
        width:300px;
        margin:0 auto;
    }	 */
}

/* 갤러리 */
#gallery {
    padding: 70px 0 60px;
    background:
        url(/images/kr/main/bg_gallery.jpg) center bottom no-repeat;
}

#gallery .top {
    margin-bottom: 0;
    padding-top: 1rem;
    text-align: center;
}

#gallery .top h4 {
    margin-bottom: 10px;
    font-family: 'sebang';
    font-size: 35px;
    font-weight: 400;
    line-height: 1.65;
    color: #333;
}

#gallery .top h4 .navy {
    font-size:40px;
    font-weight:700;
    color: #39337c;
}

#gallery .top .pcnone {
    display: none;
}

#gallery .sld_wrap{
    display: flex;
    align-items: center;
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
}

#gallery .sld_control {
    display: flex;
    align-items: center;
    padding: 4px 11px;
    border: 1px solid #aaacca;
    overflow: hidden;
    height: 40px;
    background: #fff;
    border-radius: 25px;
}

#gallery .sld_control .sld_btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: none;
    width: 40px;
    height: 36px;
    background: #fff url(/images/kr/main/ico_controlG.png) no-repeat;
    cursor: pointer;
    border-radius: 8px;
}

#gallery .sld_control .sld_btn:hover {
    background-color: #ececec;
}

#gallery .sld_control .sld_btn.prev {
    margin-right: 10px;
    background-position: 14px 10px;
}

#gallery .sld_control .sld_btn.next {
    background-position: -79px 10px;
}

#gallery .sld_control .sld_btn.stop {
    margin-right: 10px;
    background-position: -34px 10px;
}

#gallery .sld_control .sld_btn.stop.on {
    background-position: -125px 10px;
}

#gallery .btn_more {
    display: block;
    margin-left: 10px;
    border: none;
    position: relative;
    width: 50px;
    height: 50px;
    background: #2d2f3c url(/images/kr/main/ico_plus.png) center no-repeat;
    border-radius: 50px;
}

#gallery .slider_wrap {
    position: relative;
    min-height: 468px;
}

#gallery .gal_cont { overflow: hidden;}

#gallery .gallery_item{ padding: 40px 35px;}

#gallery .gallery_inner {
    display: block;
    outline: 3px solid transparent;
    box-shadow: 0 0 8px rgba(51, 51, 51, 0.2);
    width: 100%;
    max-width: 427px;
    height: 100%;
    transition: 0.2s;
    cursor: pointer;
    border-radius: 10px;
    border-radius: 8px;
}

#gallery .gallery_inner:focus { outline: 2px solid #000}

#gallery .gallery_inner:hover {
    outline: 3px solid #39337c;
    box-shadow: 0 0 20px rgba(51, 51, 51, 0.4);
    transform: translateY(-20px);
}

#gallery .gallery_thumb {
    overflow: hidden;
    position: relative;
    width: 100%;
    max-height: 290px;
    background: #c8d0da;
    border-radius: 10px 10px 0 0;
}

#gallery .gallery_thumb img {
    display: block;
    width: 100%;
    height: 290px;
    transition: .3s;
}

#gallery .gallery_info {
    display: flex;
    align-items: start;
    justify-content: center;
    flex-direction: column;
    padding: 24px 18px;
    min-height: 55px;
    background-color: #fff;
    border-radius: 0 0 10px 10px;
}

#gallery .gallery_tit {
    display: -webkit-box;
    margin-bottom: 5px;
    overflow: hidden;
    max-height: 24px;
    font-size: 17px;
    font-weight: 500;
    line-height: 1.45;
    color: #333;
    text-overflow: ellipsis;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}

#gallery .gallery_date {
    padding-left: 23px;
    position: relative;
    font-size: 14px;
    color: #666;
}

#gallery .gallery_date::before {
    display: inline-block;
    position: absolute;
    top: 50%;
    left: 0;
    width: 14px;
    height: 15px;
    background: url(/images/kr/main/ico_calG.png) 0px 0px no-repeat;
    content: '';
    transform: translateY(-50%);
}

#gallery .gallery_date.date_new::before { background-position: -26px 0px;}

#gallery .slick-prev,
#gallery .slick-next {
    border: 1px solid #ddd;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    z-index: 10;
    width: 36px;
    height: 36px;
    background: #fff;
    transition: background 0.18s;
    border-radius: 50%;
}

#gallery .slick-prev { left: -2px;}

#gallery .slick-next {right: -2px;}

#gallery .slick-prev:hover,
#gallery .slick-next:hover {
    border-color: #999;
}

#gallery .slick-prev::before,
#gallery .slick-next::before {
    font-size: 14px;
    line-height: 1;
    color: #666;
}

@media screen and (max-width: 1400px) {
    #gallery {
        padding: 56px 0 32px;
        position: relative;
    }
    
    #gallery .top {
        margin-bottom: 0;
        min-height: auto;
    }

    #gallery .top .inner {
        flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        position: static;
    }

    #gallery .top h4 {
        font-size: 28px;
    }

    #gallery .top h4 {
        width: 100%;
    }

    #gallery .sld_wrap{
        top: 15%;
    }
    
    #gallery .gallery_item{
        padding: 12px;
    }

    #gallery .gallery_inner{
        max-width: 380px;
    }

    #gallery .gallery_thumb{
        min-height: 250px;
    }
}

@media screen and (max-width:1150px) {

    #gallery .top h4 {
        font-size: 28px;
    }

    #gallery .top h4 .navy{
        font-size: 36px;
    }

    #gallery .sld_wrap{
        position: absolute;
        top: auto;
        right: auto;
        bottom: 2rem;
        left: 50%;
        transform: translateX(-50%);
    }
}

@media screen and (max-width: 810px) {
    #gallery {
        padding: 15px 0 75px;
        background-size: auto 95%;
    }

    #gallery .top {
        margin-bottom: 10px;
    }

    #gallery .top h4 {
        font-size: 24px;
    }

    #gallery .top h4 .navy{
        font-size: 30px;
    }

    #gallery .top .inner {
        position: static;
    }

    #gallery .sld_control {
        justify-content: center;
        width: 120px;
        z-index: 7;
        padding: 4px;
        height: 32px;
    }

    #gallery .sld_control .sld_btn{
        width: 28px;
        height: 28px;
    }

    #gallery .sld_control .sld_btn.prev {
        background-position: 10px 6px;
    }

    #gallery .sld_control .sld_btn.next {
        background-position: -85px 6px;
    }

    #gallery .sld_control .sld_btn.stop {
        background-position: -39px 6px;
    }

    #gallery .sld_control .sld_btn.stop.on {
        background-position: -131px 6px;
    }

    #gallery .btn_more{
        width: 36px;
        height: 36px;
        border-radius: 8px;
    }

    #gallery .slider_wrap {
        padding: 0px;
        min-height: 325px;
    }

    #gallery .gal_cont {
        max-height: initial;
    }

    #gallery .gallery_inner{
        max-width: 270px;
    }

    #gallery .gallery_item {
        padding: 40px 12px 0;
        max-width: initial;
    }

    #gallery .gallery_thumb {
        height: 150px;
        min-height: auto;
    }

    #gallery .gallery_tit {
        font-size: 16px;
    }
}

@media screen and (max-width: 580px) {
    #gallery {
        background-size: auto 105%;
        padding: 15px 0 54px ;
    }

    #gallery .top .pcnone {
        display: block;
    }

    #gallery .top {
        margin-bottom: 8px;
    }

    #gallery .top h4 {
        margin-bottom: 0;
        font-size: 21px;
    }

    #gallery .top h4 .navy{
        font-size: 25px;
    }

    #gallery .slider_wrap {
        padding: 0;
        min-height: 270px;
    }
    
    #gallery .gallery_inner{
        max-width: 220px;
    }

    #gallery .gallery_inner:hover {
        transform: translateY(0px);
    }

    #gallery .gallery_item {
        padding: 3px 12px;
    }
    

    #gallery .gallery_info {
        padding: 10px 12px;
    }

    #gallery .gallery_tit {
        font-size: 14px;
    }

    #gallery .gallery_date {
        font-size: 13px;
    }
    

}

@media screen and (max-width: 520px) {
	#gallery .gallery_slider .slick-slide {margin: 0 15px;}
}
@media screen and (max-width: 410px) {
    #gallery .gallery_item{
        padding: 3px 0px;
    }

    #gallery .gallery_inner{
       max-width: 88%;
       margin: 0 auto;
    }
	#gallery .gallery_slider .slick-slide {margin: 0px;}
}


/* 바로가기 */
#link {
    padding: 44px 0 46px;
}

#link h4 {
    font-size: 28px;
    text-align: center;
}

#link h4+p {
    text-align: center;
}

#link ul:after {
    display: block;
    clear: both;
    content: '';
}

#link ul li {
    width: 16.666%;
    float: left;
}

#link ul li a {
    display: block;
    padding: 147px 0 0 0;
    position: relative;
    font-size: 18px;
    text-align: center;
    text-decoration: none;
}

#link ul li a:before,
#link ul li a:after {
    margin: 0 0 0 -67px;
    border: 2px solid #eee;
    box-shadow: 5px 0 25px rgba(221, 221, 221, 0.3);
    position: absolute;
    top: 0;
    left: 50%;
    width: 135px;
    height: 135px;
    background: #fff;
    transition: .5s;
    content: '';
    border-radius: 50%;
}

#link ul li a:after {
    background: url(/images/kr/main/q1.png) no-repeat 50%;
}

#link ul li:nth-child(2) a:after {
    background-image: url(/images/kr/main/q2.png);
}

#link ul li:nth-child(3) a:after {
    background-image: url(/images/kr/main/q3.png);
}

#link ul li:nth-child(4) a:after {
    background-image: url(/images/kr/main/q4.png);
}

#link ul li:nth-child(5) a:after {
    background-image: url(/images/kr/main/q5.png);
}

#link ul li:nth-child(6) a:after {
    background-image: url(/images/kr/main/q6.png);
}

#link ul li a:hover:before,
#link ul li a:focus:before,
#link ul li a:active:before,
#link ul li a:hover:after,
#link ul li a:focus:after,
#link ul li a:active:after {
    border-color: #709fe2;
}

@media screen and (max-width:1024px) {
    #link h4 {
        font-size: 23px;
    }

    #link ul li a {
        padding: 120px 0 0;
        font-size: 17px;
    }

    #link ul li a:before,
    #link ul li a:after {
        margin: 0 0 0 -55px;
        width: 110px;
        height: 110px;
    }

    #link ul li a:after {
        background-size: 45px;
    }
}

@media screen and (max-width:767px) {
    #link {
        padding: 25px 0 30px;
    }

    #link h4 {
        font-size: 21px;
    }

    #link ul li a {
        padding: 100px 0 0;
        font-size: 1em;
    }

    #link ul li a:before,
    #link ul li a:after {
        margin: 0 0 0 -45px;
        width: 90px;
        height: 90px;
    }

    #link ul li a:after {
        background-size: 35px;
    }
}

@media screen and (max-width:568px) {
    #link {
        padding: 25px 0 15px;
    }

    #link h4 {
        font-size: 19px;
    }

    #link ul li {
        width: 33.33%;
    }

    #link ul li a {
        margin: 0 0 15px;
    }
}

@media screen and (max-width:380px) {
    #link ul li a {
        padding: 75px 0 0;
    }

    #link ul li a:before,
    #link ul li a:after {
        margin: 0 0 0 -35px;
        width: 70px;
        height: 70px;
    }

    #link ul li a:after {
        background-size: 20px;
    }
}


/* 배너모음 */
#banner {
    overflow: hidden;
    position: relative;
    width: 100%;
    height: 116px;
    background: #fff;
}

#banner .list_wrap {
    padding: 27px 90px 27px 120px;
    position: relative;
    width: 100%;
    float: left;
    box-sizing: border-box;
}

#banner .list {
    float: left;
}

#banner .list img {
    transition: 0.2s ease-in-out;
}

#banner .list a {
    display: block;
    margin: 0 20px 0 0;
    padding: 0;
    transition: 0.2s ease-in-out;
    border: 1px solid #ddd;
    height: 62px;
}

#banner .list a img{
    height:100%;
}

#banner .list a:hover,
#banner .list a:focus,
#banner .list a:active {
    padding: 0;
}

#banner .list a:hover img {
    box-shadow: 4px 4px 0 #ddd;
}

#banner .sld_control {
    top: 48px;
    left: 0;
    width: 100%;
    position: absolute;
    width: auto;
    z-index: 4;
}

#banner .sld_control .sld_btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: none;
    width: 31px;
    height: 31px;
    background: #fff url(/images/kr/main/ico_controlB2.png) no-repeat;
    cursor: pointer;
    border-radius: 8px;
    font-size:0;
}

#banner .sld_control .sld_btn:hover {
    background-color: #ececec;
}

#banner .sld_control .sld_btn.prev {
    background-position: 6px 4px;
}

#banner .sld_control .sld_btn.next {
    background-position: -86px 4px;
}

#banner .sld_control .sld_btn.stop {
    margin-right: 0px;
    background-position: -39px 4px;
}

#banner .sld_control .sld_btn.stop.on {
    background-position: -127px 4px;
}

@media all and (max-width:1230px) {
    #banner .list_wrap {
        padding: 27px 0px 27px 96px;
    }
    
    #banner .list a {
        margin: 0 20px 0 0;
    }

    #banner .btn_prev {
        left: 15px;
    }

    #banner .btn_next {
        right: 55px;
    }

    #banner .btn_stop {
        right: 15px;
    }
}

@media all and (max-width:1024px) {
    #banner {
        height: auto;
    }

    #banner .list_wrap {
        padding: 25px 0px 25px 95px;
    }

    #banner .list a {
        margin: 0 25px 0 0;
        padding: 0;
    }

    #banner .list a:hover img {
        box-shadow: none;
    }

    #banner .control {
        top: 35px;
    }
}

@media all and (max-width: 800px) {
    #banner .list_wrap {
        padding: 48px 0px 23px 0px;
    }

    #banner .list a{
        height: 44px;
    }

    #banner .sld_control{
        left: auto;
        top: 10px;
        right: 4px;
    }
    #banner .sld_control .sld_btn{border: 1px solid rgba(51,51,51,0.45);background-size: auto 16px;}
    #banner .sld_control .sld_btn.prev {
        background-position: 9px 7px;
    }

    #banner .sld_control .sld_btn.next {
        background-position: -52px 6px;
    }

    #banner .sld_control .sld_btn.stop {
        margin-right: 0px;
        background-position: -21px 6px;
    }

    #banner .sld_control .sld_btn.stop.on {
        background-position: -79px 6px;
    }
}