@charset "utf-8";

.sec01 {
    height: 738px;
    position: relative;
    background: url("../../images/member/main/bg_visual.png") top left no-repeat;
    z-index: 1;
}
.sec01::before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    width: 59%;
    height: 650px;
    background: url("../../images/member/main/bg_member.png") center right no-repeat;
    z-index: -1;
    border-radius: 0 0 0 100px;
}
#visual .left {display: inline-block; width: 35%; vertical-align: top;}
#visual .txt {
    color: #fff;
}
#visual .txt .top {
    padding-top: 90px;
}
#visual .txt .top p {
    font-family: "gmarket_medi";
    font-size: 42px;
    font-weight: 500;
}
#visual .txt .top p strong {
    font-family: "gmarket_bold";
    font-size: 62px;
    font-weight: 700;
}
#visual .txt .info {
    font-family: "score_400";
    font-size: 20px;
    margin-top: 30px;
}
#visual .txt .info li {
    height: 70px;
    border-bottom: 1px solid rgba(255,255,255,0.1);
    position: relative;
    padding-left: 45px;
}
#visual .txt .info li::after {
    content: "";
    display: block;
    position: absolute;
    left: 14px;
    top: 50%;
    width: 16px;
    height: 16px;
    transform: translateY(-50%);
    background: url("../../images/member/main/ico_info.png") center no-repeat;
}
#visual .txt .info li > span {
    display: inline-block;
    width: 80px;
    vertical-align: middle;
    line-height: 70px;
}
#visual .txt .info p {
    display: inline-block;
    width: 80%;
    vertical-align: middle;
}
#visual .txt .info .small {line-height: 110%; font-size: 100%;}
#visual .txt .info .small span {font-size: 15px;}

#visual .sns {display: flex; justify-content: space-between;width: 335px;margin: 50px 0 0;}
#visual .sns li a {
    display: block;
    width: 50px;
    height: 50px;
    position: relative;
    font-size: 0;
    border-radius: 50%;

}
#visual .sns li:nth-child(1) a {
     background-color: #4268b3;
}
#visual .sns li:nth-child(2) a {
     background-color: #000;
}
#visual .sns li:nth-child(3) a {
     background-color: #1ba32b;
}
#visual .sns li:nth-child(4) a {
    background:
    linear-gradient(135deg, #2f4ff0 0%, transparent 55%),
    linear-gradient(45deg, #f0bf5c 0%, #f05c2c 35%, transparent 70%),
    linear-gradient(180deg, #743fe2 0%, #ec3189 50%, #f03f54 100%);
}
#visual .sns li:nth-child(5) a {
     background-color: #ffcc00;
}
#visual .sns li a::after {
    content: "";
    display: block;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    background: url("../../images/common/ico_sns.png") no-repeat;
    transition: all 0.3s linear;
}
#visual .sns li:nth-child(1) a::after {
    width: 12px;
    height: 24px;
    background-position: 0 0;
}
#visual .sns li:nth-child(2) a::after {
    width: 22px;
    height: 20px;
    background-position: -34px 0;
}
#visual .sns li:nth-child(3) a::after {
     width: 21px;
    height: 21px;
    background-position: -72px 0;
}
#visual .sns li:nth-child(4) a::after {
    width: 25px;
    height: 25px;
    background-position: -106px 0;
}
#visual .sns li:nth-child(5) a::after {
    width: 14px;
    height: 25px;
    background-position: -147px 0;
}
#visual .sns li a:hover::after,
#visual .sns li a:focus::after {
    transform: translate(-50%,-50%) scale(1.2);
}
#visual .member {
    display: inline-block;
    width: 60%;
    height: 650px;
    position: relative;
    float: right;
}
#visual .member .member_pic {
    width: 580px;
    height: 600px;
    position: absolute;
    right: 70px;
    bottom: 0;
}
#visual .member .member_pic img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
}
#visual .member a {
    display: block;
    width: 150px;
    height: 135px;
    background: url("../../images/member/main/btn_bg.png") center / contain no-repeat;
    position: absolute;
    top: 297px;
    left: 145px;
    text-align: center;
    color: #fff;
    font-family: "score_400";
    font-size: 15px;
    padding-top: 85px;
    box-sizing: border-box;
    text-decoration: none;
}
#visual .member a::after {
    content: "";
    display: block;
    position: absolute;
    top: 25%;
    left: 50%;
    width: 37px;
    height: 39px;
    transform: translateX(-50%);
    background: url("../../images/member/main/ico_profile.png") center no-repeat;
}

#visual .member a:hover::after,
#visual .member a:focus::after{animation:ani_bg 0.6s ease-in-out;}
@keyframes ani_bg{
	0%{transform:translateX(-50%) rotate(0);}
	20%{transform:translateX(-50%) rotate(-8deg);}
	40%{transform:translateX(-50%) rotate(8deg);}
	60%{transform:translateX(-50%) rotate(-8deg);}
	80%{transform:translateX(-50%) rotate(8deg);}
	100%{transform:translateX(-50%) rotate(0deg);}
}

/* animation */
#visual .slogan{animation:slideup 1.3s both;}

#visual .info li{animation:slideup 1s both;}
#visual .info li:nth-child(1){animation-delay:0.6s;}
#visual .info li:nth-child(2){animation-delay:1s;}
#visual .info li:nth-child(3){animation-delay:1.2s;}
#visual .info li:nth-child(4){animation-delay:1.6s;}
#visual .info li:nth-child(5){animation-delay:1.8s;}

@keyframes slideup{
	0%{transform:translateY(20px); opacity:0; visibility:hidden;}
	100%{transform:translateY(0); opacity:100%; visibility:visible;}
}


/* 도의원소식 */
.sec02 {padding: 88px 0; position: relative;}
.sec02::after {
    content: "";
    display: block;
    position: absolute;
    top: -80px;
    left: -40px;
    width: 216px;
    height: 216px;
    background: url("../../images/member/main/bg_news.png") center no-repeat;
}
.sec02::before {
    content: "";
    display: block;
    position: absolute;
    right: -108px;
    top: 50%;
    transform: translateY(-50%);
    width: 216px;
    height: 216px;
    background: url("../../images/member/main/bg_news.png") center no-repeat;
}
#news {position: relative; display: inline-block;width: 72.5%;}
#news h4 {
    font-family: "gmarket_bold";
    font-size: 38px;
    color: #333;
}
#news h4 strong {
    color: #644f3e;
}
#news .news_list .news_box,
#news .news_list .slide_btn {
    display: none;
}
#news .news_list.on .news_box,
#news .news_list.on .slide_btn {
    display: block;
}
#news .news_list .tab_btn {
    font-family: "gmarket_medi";
    font-size: 19px;
    color: #555;
    position: absolute;
    top: 0;
    display: block;
    width: 153px;
    height: 48px;
    text-align: center;
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    line-height: 48px;
}
#news .news_list:nth-child(1) .tab_btn{
    left: 31%;
    border-left: 1px solid #ddd;
    border-radius: 10px 0 0 10px;
}
#news .news_list:nth-child(1) .tab_btn::after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: calc(100% * 4 + 3px);
    height: 100%;
    border-radius: 10px;
    box-shadow: 0 0 5px 3px rgba(0,0,0,0.05);
}
#news .news_list:nth-child(2) .tab_btn{
    left: calc(31% + 153px);
    border-left: 1px solid #ddd;
}
#news .news_list:nth-child(3) .tab_btn{
    left: calc(31% + 153px * 2);
    border-left: 1px solid #ddd;
}
#news .news_list:nth-child(4) .tab_btn{
    left: calc(31% + 153px * 3);
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
    border-radius: 0 10px 10px 0;
}
/* #news .news_list .tab_btn:hover,
#news .news_list .tab_btn:focus, */
#news .news_list.on .tab_btn {
    background-color: #644f3e;
    color: #fff;
    border-radius: 10px;
}
#news .news_list .slide_btn {
    position: absolute;
    top: 0;
    right: 0;
}
#news .news_list .slide_btn button {
    position: relative;
    font-size: 0;
    width: 48px;
    height: 48px;
    border: 1px solid #ddd;
    border-radius: 10px;
    transition: all 0.3s linear;
}
#news .news_list .slide_btn button:hover,
#news .news_list .slide_btn button:focus {
    border: 1px solid #a8a8a8;
}
#news .news_list .slide_btn button::after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 10px;
    height: 15px;
    transform: translate(-50%,-50%);
    background: url("../../images/member/main/ico_arrow.png") center no-repeat;
}
#news .news_list .slide_btn button.next::after {
    transform: translate(-50%,-50%) rotate(180deg);
}
#news .news_list .news_box {
    margin-top: 43px;
}
#news .slick-list {
    margin: 0 -20px;
}
#news .slick-slide {
    margin: 0 20px;
}
#news .news_list .news_box li > a {
    display: block;
    width: 260px;
    height: 260px;
    background-color: #fff;
    border: 2px solid #ddd;
    border-radius: 10px;
    transition: all 0.3s linear;
    padding: 30px 28px;
    box-sizing: border-box;
    text-decoration: none;
    box-shadow: 0 0 8px 3px rgba(0,0,0,0.05);
    margin: 10px 0;
    position: relative;
}
#news .news_list .news_box li > a:hover {
    border: 2px solid #644f3e;
}
#news a span.type {width: 70px; height: 60px; position: absolute; top: -13px; left: 30px; background: #777; border-radius: 0 0 8px 8px; color: #fff; padding: 12px 4px; text-align: center; box-sizing: border-box;font-family: "score_500"; font-weight: 500;font-size: 14px; }
#news a span.type:before {content: ''; position: absolute; left: -14px; top: 2px; z-index: -1; width: 0; height: 0; border-top: 12px solid #555555; border-left: 16px solid transparent; transform: rotate(90deg);}
#news li a:hover span.type {background: #644f3e;}
#news li a:hover span.type:before {border-top: 12px solid #33261c;}

#news .news_list p {
    font-family: "gmarket_medi";
    font-size: 18px;
    color: #333;
    margin: 50px 0 30px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    position: relative;
    max-width: 97%;
}
/* #news .news_list a:hover p,
#news .news_list a:focus p {
    color: #644f3e;
} */
#news .news_list li.new p::after {
    content: "";
    display: block;
    position: absolute;
    bottom: 0;
    right: 0px;
    width: 17px;
    height: 17px;
    background: url("../../images/member/main/ico_new.png") center no-repeat;
}
#news .news_list .date {
    font-family: "NanumSquare";
    font-weight: 300;
    font-size: 15px;
    position: absolute;
    bottom: 55px;
}

#news ul.few_news .slick-track {margin: 0;}


#quickmenu {display: inline-block;width: 370px; vertical-align: top;margin-left: 67px;}
#quickmenu ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
#quickmenu a {
    display: block;
    width: 174px;
    height: 165px;
    background-color: #f6ede6;
    color: #333;
    margin-bottom: 24px;
    padding: 22px;
    box-sizing: border-box;
    font-family: "gmarket_medi";
    font-size: 19px;
    border-radius: 5px;
    text-decoration: none;
    position: relative;
}
#quickmenu a::before {
    content: "";
    display: block;
    position: absolute;
    top: 60px;
    left: 22px;
    width: 31px;
    height: 2px;
    background: #877061;
}
#quickmenu a::after {
    content: "";
    display: block;
    position: absolute;
    right: 22px;
    bottom: 22px;
    filter: drop-shadow(0 0 10px rgba(209, 108, 32, 0.5));
}
#quickmenu a:hover::after {
    animation: ani_bg2 0.6s ease-in-out;
}
@keyframes ani_bg2{
	0%{transform: rotate(0);}
	20%{transform: rotate(-8deg);}
	40%{transform: rotate(8deg);}
	60%{transform: rotate(-8deg);}
	80%{transform: rotate(8deg);}
	100%{transform: rotate(0deg);}
}

#quickmenu li:nth-child(1) a::after {
    width: 62px;
    height: 59px;
    background: url("../../images/member/main/quick1.png") center / contain no-repeat;
}
#quickmenu li:nth-child(2) a::after {
    width: 59px;
    height: 66px;
    background: url("../../images/member/main/quick2.png") center / contain no-repeat;
}
#quickmenu li:nth-child(3) a::after {
    width: 65px;
    height: 66px;
     background: url("../../images/member/main/quick3.png") center / contain no-repeat;
}
#quickmenu li:nth-child(4) a::after {
    width: 47px;
    height: 60px;
    background: url("../../images/member/main/quick4.png") center / contain no-repeat;
}


/* 갤러리 */
#gallery {overflow:hidden; position:relative; box-sizing:border-box; padding:80px 0 0; background: #fff;}
#gallery:before {content: ''; width: 100%; height: 355px; background: linear-gradient(to right, #e0e7ed, #efded1); position: absolute; top: 0; left: 0;}
#gallery:after {content: ''; width: 285px; height: 353px; background: url(/images/committee/main/gallery_bg01.png) no-repeat center; position: absolute; top: 0; left: -130px;}
#gallery .inner {background: #fff; border-radius: 30px;}
#gallery .inner:before {content: ''; width: 200px; height: 200px; background: #fff; position: absolute; bottom: 0; left: 56%; z-index: 1;}
#gallery span.bg {background: #59483f; width: 38.851%; height: 600px; position: absolute; top: 80px; right: 0; z-index: 1;}
#gallery span.bg:after {content: ''; width: 369px; height: 575px; position: absolute; top: 0; right: -160px; background: url(/images/committee/main/gallery_bg02.png) no-repeat center;}

#gallery .list_wrap {z-index:1; position:relative; box-sizing:border-box; padding:80px 0 65px 80px;}
#gallery .inner > .tit {position:absolute; top:130px; left:80px;}
#gallery .tit:after {content:''; position:absolute; top:-29px; right:-39px; width:43px; height:42px; background:url(/images/member/main/bg_gallery_tit.png) no-repeat bottom left;}
#gallery .tit:before {content: ''; width: 357px; height: 175px; background: url(/images/committee/main/gallery_bg03.png) no-repeat center; position: absolute; top: -40px; right: -377px;}
#gallery .tit h4 {display:inline-block; font-family: 'gmarket_bold'; font-size: 35px;}
#gallery .tit h4 span {color:#1f4d7a;}

#gallery .page {position:absolute; top:-5px; left:-337px; width:115px; height:45px; line-height:45px; border-top-right-radius:25px; font-size:18px; color:#fff; background:rgba(0,0,0,0.15); text-align:center;}
#gallery .page .current {font-weight:800; font-size:20px; color:#f5cb6b;}
#gallery .page .current:after {content:''; display:inline-block; width:15px; height:1px; margin:-1px 8px 0; background:rgba(255,255,255,0.6); vertical-align:middle;}

#gallery .list {position: relative;}
#gallery .list img{width:100%; height:100%;}
#gallery .list_wrap .list:after{content:''; display:block; clear:both;}
#gallery .list_wrap .list .pic{overflow:hidden; display:block; float:right; width:660px; height:430px; border-radius:10px; background: #fff; position: relative; box-shadow: 0 0 6px 2px #0000001a;}
#gallery .list_wrap .list .pic .txt_wrap {position: absolute; bottom: 0; left: 0; width: 100%; height: 97px; background: #000000a3; color: #fff; padding: 20px; box-sizing: border-box;}
#gallery .list_wrap .list .pic .txt_wrap .tit {font-family: 'gmarket_medi'; font-size: 23px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-bottom: 10px; position: relative; display: inline-block;max-width: 100%;box-sizing: border-box; padding-right: 25px;}
#gallery .list_wrap .list .pic .txt_wrap .tit .new {
    display: inline-block;
    width: 16px;
    height: 18px;
    margin-left: 4px;
    vertical-align: middle;
    background: url("../../images/member/main/ico_new.png") center no-repeat;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
}
#gallery .list_wrap .list .pic .txt_wrap .date {font-family: 'score_300'; font-size: 16px; text-align: right; display: block;}
#gallery .con_wrap .next_wrap .list .txt_wrap {position: absolute; bottom: 0; left: 0; width: 100%; height: 69px; background: #000000a3; color: #fff; padding: 12px; box-sizing: border-box; border-radius: 5px 0 0 5px;}
#gallery .con_wrap .next_wrap .list .txt_wrap p.tit {display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-family: 'gmarket_medi'; font-size: 17px; margin-bottom: 5px;}
#gallery .con_wrap .next_wrap .list .txt_wrap .date {font-family: 'score_300'; font-size: 14px;}
#gallery .con_wrap .next_wrap .list {padding: 5px 0 0 5px;}

.con_wrap{z-index:2; position:absolute; bottom:60px; left:80px; width:calc(100% - 750px);}
.next_wrap .list a{overflow:hidden; position:relative; display:block; width: 240px; height: 193px; margin:0 30px 15px 0; border-radius:10px; margin-bottom: 5px; box-shadow: 0 0 6px 2px #0000001a;}

#gallery .slick-dots{position:absolute; top:-240px; left:0;}
#gallery .slick-dots:after{content:''; display:block; clear:both;}
#gallery .slick-dots li{float:left; margin:0 6px 0 0;}
#gallery .slick-dots li button{display:block; width:25px; height:25px; line-height:27px; border-radius:5px; text-align:center; font-family: 'gmarket_light'; font-size:14px; font-weight:800; color:#999;}
#gallery .slick-dots li.slick-active button{color:#fff; background:#1f4d7a;}

#gallery .control{z-index:2; position:absolute; top: -239px; left: 230px;}
#gallery .control button{position:relative; display:inline-block; width:40px; height:40px; font-size:0; text-indent:-999px;}
#gallery .control button:not(.btn_stop):before{content:''; position:absolute; top:13px; left:16px; width:15px; height:15px; border-top:1px solid #555; border-right:1px solid #555; transform:rotate(-135deg);}
#gallery .control button.btn_next:before{left:9px; transform:rotate(45deg);}

#gallery .control button.btn_stop{width:20px; height:20px;}
#gallery .btn_stop:before,
#gallery .btn_stop:after{content:''; position:absolute; top:50%; left:50%; width:2px; height:11px; margin:-5px 0 0 -3px; background:#999;}
#gallery .btn_stop:after{margin:-5px 0 0 2px;}
#gallery .btn_stop.on:before{width:auto; height:auto; border-top:6px solid #999; border-left:6px solid transparent; border-right:6px solid transparent; margin-top:-2px; background:none; transform:rotate(-90deg);}
#gallery .btn_stop.on:after{display:none}
#gallery .control button:not(.btn_stop){display:none !important;}
#gallery .no_list{padding:19em 0 0 0 !important;}
#gallery a.more_btn {font-family: 'score_300'; font-size: 14px; background-color: #fff; width: 190px; height: 50px; display: block; border: 1px solid #b2b2b2; border-radius: 10px; box-shadow: 0 0 5px 2px #b2b2b233; line-height: 50px; text-align: center; z-index: 2; position: relative; margin-top: 30px;}
#gallery a.more_btn:after {content: ''; width: 20px; height: 20px; background: url(/images/committee/main/main_ico.png
) no-repeat -165px -69px; display: inline-block; vertical-align: sub; margin-left: 18px; transition: 0.5s;}
#gallery a.more_btn:hover {text-decoration: none;}
#gallery a.more_btn:hover:after {transform: rotate(180deg);}


/* 작은 이미지 3개 이하 + 슬라이드가 아닐 때 */
#gallery.small_gallery .next_wrap:not(.slick-initialized) {display:flex; flex-wrap:nowrap;}
#gallery.small_gallery .next_wrap:not(.slick-initialized) .list {flex:0 0 240px; width:240px; margin-right: 15px;}
#gallery.small_gallery .inner {min-height: 575px;}
#gallery.small_gallery .inner:before {display: none;}





@media all and (max-width:1800px) {#gallery:after {display: none;}}
@media all and (max-width:1680px) {
    .sec01::before {width: 54%;}
    .inner {width: 95%;}
    #visual .member .member_pic {width: 550px; height: 570px;}
    #visual .member .member_pic {right: 50px;}
    #visual .txt .top p {font-size: 38px;}
    #visual .txt .top p strong {font-size: 50px;}
    #visual .txt .info {font-size: 18px;}
    #visual .sns li a {width: 42px;height: 42px;}
    #visual .left {width: 43%;}
    #visual .member {width: 54%;}
    #visual .member a {left: 10%;}
    #visual .txt .info li > span {width: 64px;}

    #quickmenu {margin-left: 2%; width: 25%;}
    #news .slick-list {margin: 0 -10px;}
    #news .slick-slide {margin: 0 10px;}
    #news .news_list .news_box li > a {width: 100%;}
    #quickmenu a {width: 165px;}

}
@media all and (max-width:1580px) {

}
@media all and (max-width:1480px) {
    .sec01 {height: 700px;}
    .sec01::before {height: 610px;}
    #visual .member {height: 610px;}
    #visual .member .member_pic {right: 0; width: 457px; height: 555px;}
    #visual .member a {width: 130px; top: 260px;}
    #visual .txt .top p {font-size: 32px;}
    #visual .txt .top p strong {font-size: 40px;}

    #news {width: 70%;}
 
    #news .news_list .tab_btn {
        width: 130px;
        font-size: 18px;
    }
    #news .news_list:nth-child(1) .tab_btn {
        left: 25%;
    }
    #news .news_list:nth-child(2) .tab_btn {
        left: calc(25% + 130px);
    }
    #news .news_list:nth-child(3) .tab_btn {
        left: calc(25% + 130px * 2);
    }
    #news .news_list:nth-child(4) .tab_btn {
        left: calc(25% + 130px * 3);
    }
    
    #quickmenu {margin-left: 3.5%; width: 26%;}
    #quickmenu li {width: 47%;}
    #quickmenu a {width: 100%; padding: 22px; font-size: 18px;}
    #quickmenu a::before {left: 22px;}
    #quickmenu a::after {right: 22px; bottom: 22px;}


}
@media all and (max-width:1280px) {
    #visual .txt .info {font-size: 16px;}
    #visual .txt .info .small span {font-size: 14px;}

    #news .news_list .tab_btn {width: 110px; height: 42px;line-height: 42px; font-size: 17px;}
        #news .news_list:nth-child(1) .tab_btn {left: 28%;}
        #news .news_list:nth-child(2) .tab_btn {left: calc(28% + 110px);}
        #news .news_list:nth-child(3) .tab_btn {left: calc(28% + 110px * 2);}
        #news .news_list:nth-child(4) .tab_btn {left: calc(28% + 110px * 3);}
    #news .news_list .slide_btn button {width: 42px;height: 42px;}
    #news .news_list .badge {
        font-size: 13px;
        width: 80px;
        height: 33px;
        line-height: 34px;
    }
    #news .news_list p {font-size: 17px;}

    #quickmenu a {padding: 18px; font-size: 17px;}
    #quickmenu a::before {left: 18px;top: 50px;}
    #quickmenu a::after {bottom: 18px; right: 18px;}


	#gallery.small_gallery .inner {min-height: 485px;}

}
@media all and (max-width:1180px) {

    #visual .member a {width: 118px; font-size: 14px;}
    #visual .member .member_pic {
        width: 421px;
        height: 526px;
    }

    #news {width: 100%;}
    #news .news_list .tab_btn {width: 150px; height: 45px; line-height: 45px;}
    #news .news_list:nth-child(1) .tab_btn {left: 23%;}
    #news .news_list:nth-child(2) .tab_btn {left: calc(23% + 150px);}
    #news .news_list:nth-child(3) .tab_btn {left: calc(23% + 150px * 2);}
    #news .news_list:nth-child(4) .tab_btn {left: calc(23% + 150px * 3);}
    
    #quickmenu {width: 100%; margin-left: 0; margin-top: 50px;}
    #quickmenu li {width: 24%;}
    #quickmenu a {height: 110px; margin-bottom: 0;}
    #quickmenu a::after {transform: scale(0.9);}
}
@media all and (max-width:1024px) {

    #visual .txt .top p {font-size: 28px;}
    #visual .txt .top p strong {font-size: 35px;}
    #visual .txt .info li > span {width: 58px;}

    #news h4 {font-size: 35px;}



}
@media all and (max-width:980px) {
    .sec01 {height: auto; background-size: cover;}
    .sec01::before {border-radius: 0; width: 100%;height: 500px;}
    #visual .left {display: block;width: 100%;}
    #visual .member {display: block;width: 100%;}
    #visual .sns {margin: 50px 0;}
    #visual .member {height: 500px;}
    #visual .member .member_pic {width: 440px;height: 460px;}
    #visual .member a {top: 40%; left: 13%;}

    #news .news_wrap {margin-top: 80px;}
    #news .news_list .tab_btn {top: 60px;}
    #news .news_list:nth-child(1) .tab_btn {left: 0;}
    #news .news_list:nth-child(2) .tab_btn {left: 150px;}
    #news .news_list:nth-child(3) .tab_btn {left: calc(150px * 2);}
    #news .news_list:nth-child(4) .tab_btn {left: calc(150px * 3);}
    #news .news_list .slide_btn {top: 60px;}

    #news .news_list .news_box li > a {padding: 20px; height: 220px;}
    #news .news_list .date {bottom: 40px;}

	#visual {display: flex; flex-wrap: wrap;}
	#visual > .left {order: 2;}
	#visual > .member {order: 1;}
	

}
@media all and (max-width:780px) {
    #visual .txt .top {padding-top: 60px;}
    
    #news .news_list .badge {width: 70px;}
    #news .news_list p {font-size: 16px;}
    #news .news_list .date{font-size: 14px;}
    #news .news_list .tab_btn {width: 100px; font-size: 16px;}
    #news .news_list:nth-child(2) .tab_btn {left: 100px;}
    #news .news_list:nth-child(3) .tab_btn {left: calc(100px * 2);}
    #news .news_list:nth-child(4) .tab_btn {left: calc(100px * 3);}

    #news .slick-list {margin: 0 -5px;}
    #news .slick-slide {margin: 0 5px;}
    
    #quickmenu a {font-size: 16px;}
    #quickmenu a::after {transform: scale(0.7); bottom: 10px;right: 10px;}
}
@media all and (max-width:580px) {
    #visual .member .member_pic {
        width: 364px;
        height: 454px;
    }
    #visual .member a {left: 7%;}

    .sec02 {padding: 60px 0;}
    #news .news_list .tab_btn {width: 25%;}
    #news .news_list:nth-child(2) .tab_btn {left: 25%;}
    #news .news_list:nth-child(3) .tab_btn {left: 50%;}
    #news .news_list:nth-child(4) .tab_btn {left: 75%;}
    #news .news_list .slide_btn {top: 0;}
    #news h4 {font-size: 30px;}

    #quickmenu li {width: 48%;}
    #quickmenu li:nth-child(1),
    #quickmenu li:nth-child(2) {margin-bottom: 15px;}
    #quickmenu a {height: 100px;}
}
@media all and (max-width:480px) {
    #visual .txt .info li {height: auto; padding: 10px 0 10px 28px;}
    #visual .txt .info li > span {display: block; line-height: 36px;}
    #visual .txt .info li::after {top: 22%; left: 0; transform: none;}
	.sec01::before {height: 380px;}
    #visual .txt .top p {font-size: 26px;}
    #visual .txt .top p strong {font-size: 32px;}
    #visual .txt .info p {width: 100%;}
    #visual .member {height: 380px;}
    #visual .member .member_pic {width: 280px; height: 345px;}
    #visual .member a {left: 0; width: 104px; padding-top: 80px;}
    #visual .sns {width: 100%;}
    #visual .sns li a {width: 38px; height: 38px;}
    #visual .sns li:nth-child(1) a::after {transform: translate(-50%,-50%) scale(0.8);}

    #news .news_list .tab_btn {width: 50%;}
    #news .news_list:nth-child(1) .tab_btn {border-radius: 10px 0 0 0;}
    #news .news_list:nth-child(2) .tab_btn {left: 50%;border-right: 1px solid #ddd; border-radius: 0 10px 0 0;}
    #news .news_list:nth-child(3) .tab_btn {left: 0; top: 104px; border-radius: 0 0 0 10px;}
    #news .news_list:nth-child(4) .tab_btn {left: 50%; top: 104px; border-radius: 0 0 10px 0;}
    #news .news_list .tab_btn:hover, #news .news_list .tab_btn:focus, #news .news_list.on .tab_btn {border-radius: 10px;}
    #news .news_wrap {margin-top: 140px;}
    #news .news_list:nth-child(1) .tab_btn::after {
        width: calc(100% * 2);
        height: calc(100% * 2);
        border-radius: 10px;
        box-shadow: 0 0 5px 5px rgba(0,0,0,0.05);
    }
}
@media all and (max-width:380px) {
    .sec01::before {height: 330px;}
	#visual .member {height: 330px;}
    #visual .member .member_pic {width: 240px; height: 298px;}
	#visual .member a {top: 30%;}
    #visual .txt .top p {font-size: 24px;}
    #visual .txt .top p strong {font-size: 30px;}
    #visual .txt .info {font-size: 15px;}
    #visual .txt .info .small span {font-size: 13px;}

}





/* 갤러리 반응형 */
@media all and (max-width:1680px) {
    .con_wrap {left: 40px; width: 53%;}
    #gallery .list_wrap {padding: 80px 0 65px 40px;}
    #gallery .inner > .tit {left: 40px;}
    #gallery .list img {object-fit: cover;}
    #gallery .list_wrap .list .pic {width: 45%;}
    #gallery .list_wrap .list .pic .txt_wrap .tit {font-size: 20px;}
}
@media all and (max-width:1480px) {
    .con_wrap {width: 51%;}
    #gallery .con_wrap .next_wrap .list .txt_wrap p.tit {font-size: 15px;}
    .next_wrap .list a {width: 95%;}
}
@media all and (max-width:1430px) {
    #gallery .list_wrap{padding-left:30px;}
    #gallery .con_wrap{left:45px;}
}

@media all and (max-width:1280px) {
    #gallery {padding: 50px 0 0;}
    #gallery span.bg {width: 38.851%; height: calc(100% - 50px); position: absolute; top: 50px; right: 0; z-index: 1;}
    #gallery .inner > .tit {top: 84px;}
    #gallery .slick-dots {top: -240px;}
    #gallery .control {top: -240px;}
    #gallery .inner:before {left: 51%;}
    #gallery .list_wrap .list .pic {height: 350px;}
    #gallery a.more_btn {margin-top: 20px;}
    .next_wrap .list a {height: 155px;}
}
@media all and (max-width:1024px) {
    #gallery{margin:0;}
    #gallery .tit h4 {font-size: 30px;}
    #gallery .list_wrap .list .txt{width:calc(100% - 500px); padding:99px 0 0;}
    #gallery .list_wrap .list .more{width:150px; height:40px; line-height:38px; padding:0 0 0 25px; margin:15px 0 0;}
    #gallery .list_wrap .list .more:before, .list_wrap .list .more:after{right:25px;}
    #gallery .list_wrap .list .more:after{top:15px;}
    
    #gallery .con_wrap {left: 30px;}
    #gallery .slick-dots{top:-217px;}
    #gallery a.more_btn {width: 165px; height: 45px; line-height: 45px;}
    #gallery .control{top:-217px;}
    #gallery .list_wrap .list .pic .txt_wrap {padding: 10px 20px; height: 80px;}
    #gallery .list_wrap .list .pic .txt_wrap .tit {font-size: 18px;}
    .next_wrap .list a {height: 165px;}
}

@media all and (max-width:820px) {
	#gallery .list_wrap {display: none;}
	#gallery .inner {min-height: 480px;}
	#gallery .tit:after,
	#gallery .tit:before,
	#gallery span.bg,
    #gallery .inner:before {display: none;}
    #gallery .slick-dots,
	#gallery .control {top: -200px;}
	#gallery .con_wrap {width: 90%;}
}	
@media all and (max-width:600px) {
	#gallery.few_gallery .next_wrap:not(.slick-initialized) .list {flex: 0 0 48%; width: 48%; margin-right: 15px;}
}

@media all and (max-width:520px) {
    #gallery .tit h4 {font-size: 26px;}
	#gallery .slick-dots {left: 10px;}
}

@media all and (max-width:400px) {
    #gallery .inner > .tit,
    #gallery .con_wrap {left: 20px;}
    #gallery .slick-dots {left: 0;}
}

@media all and (max-width:360px) {
    #gallery .tit h4 {font-size: 25px;}

}


