/**/
.card {border-radius:20px; border:0; box-shadow: 0 0 20px rgba(0,0,0,0.1);}
.card .card-body {padding:40px;}
section {overflow-x:hidden;}
.circle-bg {position:relative;}
.circle-bg:before {
    content:''; z-index:1; background:#ebfaf6; width:28px; height:28px;
    position:absolute; left:26px; top:25px; border-radius:100%;
}
/**/
#main-visual {position:relative; margin-top: 86px}
#main-visual .slide {}
#main-visual .slide .item {background:no-repeat center center; height:841px;}
#main-visual .slide .wrap {
    position:absolute; margin:auto; top:0; right:0; bottom:0; left:0;
    height:500px; display:flex;
}
#main-visual .slide .wrap > div {width:50%; height:100%;}
#main-visual .owl-dots {
    position:absolute; width:100%; margin:auto; z-index: 2;
    top:auto; right:0; bottom:5%; left:0; 
}
#main-visual .owl-dots .owl-dot {}
#main-visual .owl-dots .owl-dot:focus {outline:0;}
#main-visual .owl-dots .owl-dot span {background:#fff; transition:width 200ms;}
#main-visual .owl-dots .owl-dot.active {}
#main-visual .owl-dots .owl-dot.active span {width:60px;}

/**/
#main-visual .notice {
    position:absolute; top:0; right:0; bottom:0; left:0; margin:auto; height:500px;
    display:flex; justify-content: flex-end; user-select:none; z-index:100;
}
#main-visual .notice > div {
    width:50%; flex-shrink:0; display:flex; align-items: center; justify-content: flex-end;
}
#main-visual .notice .card {min-height:327px; border-radius:30px; overflow:hidden; width:100%;}
#main-visual .notice .card .head {display:flex;}
#main-visual .notice .card .head a {
    width:50%; display:block; text-align:center; padding:20px 10px;
    color:#666; font-weight:bold; background:#f3f3f3;
}
#main-visual .notice .card .head a.active {color:#09847f; background:#fff;}
#main-visual .notice .card .head a.active span {border-bottom:2px solid #09847f; height:28px; display:inline-block;}
#main-visual .notice .card .head a:nth-child(1) {border-radius:0 0 30px 0;}
#main-visual .notice .card .head a:nth-child(2) {border-radius:0 0 0 30px;}
#main-visual .notice .card .body {padding:20px;}
#main-visual .notice .card .body .bbs-notice {}
#main-visual .notice .card .body .bbs-business {display:none;}
#main-visual .notice .card .body .post-one {
    position:relative; padding-bottom:15px; margin-bottom:15px; border:0; border-bottom:1px solid #ccc;
}
#main-visual .notice .card .body .post-one .date {
    border:2px dashed #b5b5b5; position:absolute;
    width:76px; height:76px; text-align:center; border-radius:100%; display:flex;
    flex-direction: column; justify-content: center; line-height:20px; flex-shrink: 0;
}
#main-visual .notice .card .body .post-one .date:before {
    content:'N'; font-size:12px; width:18px; height:18px; border-radius:100%; left:0; top:0;
    display:flex; justify-content: center; align-items: center; background:#f58220; color:#fff; font-weight:bold;
    z-index:90; position:absolute;
}
#main-visual .notice .card .body .post-one .subject {
    display:flex; flex-direction: column; justify-content: center;
    padding-left:90px; max-width:100%; height:70px;
}
#main-visual .notice .card .body .post {display:flex; justify-content: space-between; margin:5px 0;}
#main-visual .notice .card .body .post a {width:70%; padding-left:12px; position:relative; color:#333;}
#main-visual .notice .card .body .post a:before {
    content:''; width:3px; height:3px; top:9px; left:3px; background:#8ece94; position:absolute;
}
#main-visual .notice .card .body .post span {color:#999;}

@media(max-width:1024px){
    #main-visual .slide .wrap > div {width:100%; justify-content: center; text-align:center;}
    #main-visual .notice {position:relative; height:auto; margin-top:60px; padding-bottom:60px;}
    #main-visual .notice > div {width:100%;}
    #main-visual .notice .card {height:auto;}
}

/**/
.sec-head {text-align:center;}
.sec-head span {
    margin:0; padding:0; display:inline-block; position:relative; color:#09847f;
}
.sec-head span:before {
    content:''; width:5px; height:5px; border-radius:100%; background:#09847f;
    margin:auto; top:0; right:0; bottom:auto; left:0;
    position:absolute;
}

/**/
#center-booking {padding:100px 0 50px 0;}
#center-booking .sec-head {margin-bottom:50px;}
#center-booking .flex-1 {justify-content: space-between; margin-bottom:3%;}
#center-booking .flex-1 > div {width:48.5%;}
#center-booking .flex-1 .subject {}
#center-booking .flex-1 .info {height:76px; overflow:hidden; color:#666; font-weight:300;}
#center-booking .flex-1 .date {
    margin-top:20px; padding-left:22px; color:#666;
    background:url(/images/content/main/icon_calendar.png) no-repeat left 2px center;
}
#center-booking .flex-2 {justify-content: space-between;}
#center-booking .flex-2 > div {width:31%;}
#center-booking .flex-2 > div:last-child {justify-content: space-between; flex-direction: column;}
#center-booking .state {margin-bottom:25px;}
#center-booking .state span {
    display:inline-block; padding:5px 12px; border-radius:50px; font-size:14px; line-height:22px;
    background:#76777e; color:#fff; min-width:80px; text-align:center;
}
#center-booking .state span.on {background:#f58220;}
#center-booking .card-banner {border-radius:20px 20px 30px 30px; overflow:hidden;}
#center-booking .card-banner .card-body {padding:0;}
#center-booking .card-banner .cb-head {
    padding:30px 40px 25px 40px; display:flex; justify-content: space-between;
    font-weight:bold; position:relative;
}

#center-booking .card-banner .cb-head > div {position:relative; z-index:100;}
#center-booking .card-banner .cb-body {
    padding:40px;
    color:#fff; height:288px; background-size:100% 100%;
    display:flex; align-items: center; justify-content: center; text-align:center;
}
#center-booking .card-banner.banner-1 .cb-body {background:url(/images/content/main/center_booking_01.png) no-repeat;}
#center-booking .card-banner.banner-2 .cb-body {background:url(/images/content/main/center_booking_02.png) no-repeat;}
#center-booking .banner-3 {background:url(/images/content/main/center_booking_03.png) no-repeat; background-size:100% 100%;}
#center-booking .banner-4 {background:url(/images/content/main/center_booking_04.png) no-repeat; background-size:100% 100%;}
#center-booking .banner-3 .card-body,
#center-booking .banner-4 .card-body {padding:30px;}

@media(max-width:1024px){
    #center-booking {padding-top:20px;}
}
@media(max-width:768px){
    #center-booking .flex-1 {flex-wrap:wrap;}
    #center-booking .flex-1 > div {width:100%;}
    #center-booking .flex-1 > div:nth-child(1) {margin-bottom:20px;}
    #center-booking .flex-2 {flex-wrap:wrap;}
    #center-booking .flex-2 > div:nth-child(1),
    #center-booking .flex-2 > div:nth-child(2) {width:49%;}
    #center-booking .flex-2 > div:nth-child(3) {width:100%; margin-top:2%; flex-direction: row; flex-wrap: wrap;}
    #center-booking .banner-3,
    #center-booking .banner-4 {width:49%;}
    #center-booking .card-banner .cb-body br {display:none;}
}
@media(max-width:540px){
    #center-booking .flex-2 > div:nth-child(1),
    #center-booking .flex-2 > div:nth-child(2),
    #center-booking .banner-3,
    #center-booking .banner-4 {width:100%; margin-bottom:20px;}
    #center-booking .flex-2 > div:nth-child(3) {margin-top:0;}
    #center-booking .card-banner.banner-1 .cb-body,
    #center-booking .card-banner.banner-2 .cb-body {background-size:cover;}
}

/* 사업참여 액션그룹 */
#action-group {padding:50px 0 100px 0;}
#action-group .nav-action-group {
    display:flex; justify-content: space-between; margin-bottom:150px; position:relative;
    overflow:hidden;
}
#action-group .nav-action-group:before {
    content:''; position:absolute; margin:auto; top:29px; right:0; bottom:auto; left:0;
    background:#ebebec; width:98%; height:4px; z-index:10;
}
#action-group .nav-action-group .arr {
    width:60px; height:60px; display:flex; align-items: center; justify-content: center;
    background:#bdbdc2; color:#fff; border-radius:100%; z-index:100;
    flex-shrink: 0;
}
#owl-group-nav {width:200px; z-index:20;}
#owl-group-nav,
#owl-group-nav .owl-stage-outer,
#owl-group-nav .owl-stage-outer .owl-stage {height:130px;}
#owl-group-nav .owl-stage-outer {overflow:initial;}
#owl-group-nav .owl-item.active .nav .name {color:#09847f; box-shadow:0 0 20px rgba(0,0,0,0.2); font-weight:600;}
#owl-group-nav .owl-item.active .nav:after {
    content:''; position:absolute; margin:auto; top:-50px; right:0; bottom:auto; left:0;
    width:20px; height:20px; border-radius:100%; background:#fff; z-index:1;
    box-shadow:0 0 10px rgba(0,0,0,0.5);
}
#owl-group-nav .nav {
    width:200px; align-items: center; justify-content: center; height:40px;
    transform:translateY(70px); position:relative;
}
#owl-group-nav .nav:before {
    content:''; position:absolute; margin:auto; top:-45px; right:0; bottom:auto; left:0;
    width:10px; height:10px; border-radius:100%; background:#09847f; z-index:9;
}
#owl-group-nav .nav .name {padding:6px 20px; border-radius:50px; color:#333333;}

/**/
#action-group .banner {
    background:
            url(/images/content/main/action_banner_left.png) no-repeat left center,
            url(/images/content/main/action_banner_right.png) no-repeat bottom right,
            #129c98;
    background-size:auto 100%, auto 100%;
    border-radius:10px;
}
#action-group .banner > div {width:50%; flex-shrink: 0; padding:30px 60px; color:#fff;}
#action-group .banner > div:nth-child(1) {padding-left:240px;}
#action-group .banner > div:nth-child(1):before {
    content:''; width:1px; background:#71c4c1; height:50%;
    position:absolute; margin:auto; top:0; right:0; bottom:0; left:0;
}
#action-group .banner > div:nth-child(2) {padding-right:240px;}
#action-group .banner p a{color:#fff;}

@media(max-width:1204px){
    #action-group .banner {background:#129c98; flex-wrap:wrap; height:auto; padding:30px;}
    #action-group .banner > div:nth-child(1),
    #action-group .banner > div:nth-child(2) {width:100%; padding:0;}
    #action-group .banner > div:nth-child(1) {border-bottom:1px solid #71c4c1; padding-bottom:30px;}
    #action-group .banner > div:nth-child(1):before {display:none;}
    #action-group .banner > div:nth-child(2) {padding-top:30px;}
}


/**/
#owl-action {margin-top:50px; margin-bottom:50px;}
#owl-action.owl-carousel .owl-stage-outer {overflow: initial;}
#owl-action.owl-carousel .owl-item {}
#owl-action.owl-carousel .owl-item .item {
    height:450px; width:90%; margin:auto; display:flex; align-items: center;
}
#owl-action.owl-carousel .owl-item .flex {
    height:80%; margin:auto; top:0; bottom:0; overflow:hidden; transition: all 200ms; position:relative;
    box-shadow: 0 0 20px rgba(0,0,0,0.1); border-radius:35px;
}
#owl-action.owl-carousel .owl-item .flex:after {
    width:100%; height:100%; content:''; position:absolute; top:0; left:0; background:rgba(0,0,0,0.3);
}
#owl-action.owl-carousel .owl-item .data {padding:60px 40px 60px 40px; width:35%; position:relative;}
#owl-action.owl-carousel .owl-item.active {}
#owl-action.owl-carousel .owl-item.active .item {}
#owl-action.owl-carousel .owl-item.active .flex {height:100%; width:100%;}
#owl-action.owl-carousel .owl-item.active .flex:after {display:none;}
#owl-action.owl-carousel .owl-item.active .img {
    width:65%; overflow:hidden;
    display:flex; flex-direction: row-reverse; position:relative;
}
#owl-action.owl-carousel .owl-item.active .img img {display:block; height:500px; width:125%; position:absolute; right:-50px;}
#owl-action.owl-carousel .owl-item.active .data .circle-bg {}
#owl-action.owl-carousel .owl-item.active .data .circle-bg:before {
    top:-6px; left:-10px;
}
#owl-action.owl-carousel .owl-item.active .data .circle-bg p {position:relative; z-index:10;}
#owl-action.owl-carousel .owl-item.active .data .btns {
    position:absolute; left:0; bottom:40px; display:flex; justify-content: space-between; width:100%;
    padding:0 40px; align-items: center;
}
#owl-action.owl-carousel .owl-item.active .data .btns a {
    display:inline-block; background:#f58220; color:#fff; border-radius:50px;
    padding:10px 20px;
}
@media(max-width:820px){
	#owl-action.owl-carousel .owl-item .item {height:310px;}
	#owl-action {margin-top:-100px;}
	#owl-action.owl-carousel .owl-item.active .img img {width:125%; height:auto; right:-10%;}
}
@media(max-width:550px){
	#owl-action.owl-carousel .owl-item .item {height:450px;}
	#owl-action.owl-carousel .owl-item.active .flex{flex-wrap:wrap;}
	#owl-action.owl-carousel .owl-item .data{width:100%;padding:40px 40px 40px 40px;}
	#owl-action.owl-carousel .owl-item.active .img {width:100%; height:auto; flex-direction: column; min-height:100px; }
	#owl-action.owl-carousel .owl-item.active .img img {width:100%; height:auto; right:0;}
	
}

/**/
#active-news {
    padding:100px 0 150px 0;
    background:
            url(/images/content/main/news_bg_left.jpg) no-repeat left bottom,
            url(/images/content/main/news_bg_right.jpg) no-repeat right bottom,
            url(/images/content/main/news_bg_center.jpg) repeat-x center bottom,
            #f8efe5;
}
#active-news .wrap {}
#active-news .head {
    display:flex; justify-content: space-between; margin-bottom:30px;
}
#active-news .head .nav {display:flex; align-items: center;}
#active-news .head .nav a {
    width:50px; height:50px; border-radius:100%; background:#fff;
    display:flex; justify-content: center; align-items: center; margin-left:8px;
}
#active-news .body {}
#active-news .item {
    background:#fff; border-radius:20px; overflow:hidden;
}
#active-news .item .img {
    height:210px; background-position:center center;
}
#active-news .item .img img {display:none;}
#active-news .item .info {padding:20px;}
#active-news .item .info .subject {margin-bottom:20px;}
#active-news .item .info .date {display:flex; justify-content: space-between; align-items: center; color:#888;}
#active-news .item .info .date .link {}
#active-news .item .info .date .link a {
    display:inline-block; border-radius:50px; background:#f5f5f5; color:#888;
    padding:10px 20px; transition:all 200ms;
}
#active-news .item .info .date .link a:hover {background:#f58220; color:#fff;}
@media(max-width:550px){
	#active-news .head {flex-wrap:wrap;}
	#active-news .head .nav{width:100%; margin-top:40px;}
}

footer {margin-top:0;}