
/*레이어 팝업*/
.layer-popup {
	position: absolute;
	top: 150px;
	left: 150px;
	z-index: 101;
}
.layer-popup p.pop-close {
	position: absolute;
	right: 0;
	bottom: -30px;
	width: 100%;
	height: 30px;
	padding-top: 5px;
	padding-right: 10px;
	text-align: right;
	background: #000;
}
.layer-popup .pop-close input {
	vertical-align: top;
	margin-top: 3px;
}
.layer-popup .pop-close label {
	font-weight: 200;
	font-size: 14px;
	color: #fff;
	margin-bottom: 0;
	margin-right: 6px;
}
.layer-popup .pop-close a {display: inline-block;}
.layer-popup .pop-close a img {
	width: 10px;
	height: 10px;
	margin-top: -2px;
}

@media (max-width: 991px) {
	.layer-popup {
		top: 15px;
		left: 5%;
		width: 90%;		
	}
	.layer-popup .popup-img img {
		width: 100%;
	}
}


@media (min-width: 992px) {
	.main {
        z-index: 1;
        word-break: keep-all;
        position: relative;
    }
	
	.section1 {
		position: relative;
		width: 100%;
	}
	.section1 .video_wrap {
		width: 100%;
		overflow: hidden;
	}
    .section1 .video_wrap video {
		min-width: 100%;
		margin-top: -300px;
		z-index: 1;
	}
	.section1 .mouse {
		animation: motion 0.5s linear 0s infinite alternate; 
		position: absolute;
		bottom: 80px;
		left: calc( 50% - 17px );
		display: inline-block;
		width: 38px;
		height: 81px;
		background-image: url(/pub/site/default/2022/images/main/mouse_icon.png);
		background-repeat: no-repeat;
		background-position: 100%;
	}
	@keyframes motion {
		0% {bottom: 80px;}
		100% {bottom: 90px;}
	}
	-webkit-@keyframes motion {
		0% {margin-top: 80px;}
		100% {margin-top: 90px;}
	}


	.section2 {
		width: 100%;
		display: flex;
		margin-top: -5px;
	}
	.section2 .share-con {
		width: 30%;
		padding: 110px 30px 30px 30px;
	}
	.section2 .share-con h3 {
		padding-bottom: 10px;
		font-size: 28px;
		font-weight: 600;
		color: #333;
	}
	.section2 .share-con .share-txt {
		font-size: 16px;
		color: #333;
		font-weight: 400;
		line-height: 160%;
	}
	.section2 .share-con .share-txt .more-btn {
		color: #009F73;
		font-size: 14px;
	}
	.section2 .share-con .share-board {
		position: relative;
		margin-top: 55px;
	}
	.section2 .share-con .share-board h3 {
		padding-bottom: 30px;
	}
	.section2 .share-con .share-board .board-list li {
		display: flex;
		align-items: center;
		width: 100%;
		margin-bottom: 25px;
	}
	.section2 .share-con .share-board .board-list li .date {
		display: inline-flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		width: 73px;
		height: 73px;		
		font-size: 14px;
		color: #fff;
		font-weight: 600;
		background-image: url(/pub/site/default/2022/images/main/date_bg_normal.png);
		background-repeat: no-repeat;
		background-position: center;
		background-size: 100%;
	}	
	.section2 .share-con .share-board .board-list li .date span {
		font-size: 28px;	
	}
	.section2 .share-con .share-board .board-list li a {
		display: block;
		width: calc( 100% - 93px );
		padding-left: 20px;
		font-size: 18px;
		color: #333;
		font-weight: 400;
		overflow: hidden;
		text-overflow:ellipsis;
		word-break: break-word;
		display:-webkit-box; 
		-webkit-line-clamp:2;
		-webkit-box-orient:vertical;
	}
	.section2 .share-con .share-board .more-btn {
		position: absolute;
		top: 5px;
		right: 0;
		font-size: 14px;
		color: #009F73;
	}

	.section2 .share-map {
		position: relative;
		width: 70%;
	}
	.section2 .share-map .share-list {
		position: absolute;
		top: 0;
		right: 0;
		width: 190px;
		height: 100%;
		padding: 50px 10px;
		background-color: rgba(255, 255, 255, .8);
		z-index: 100;
	}
	.section2 .share-map .share-list h3 {
		padding-top: 60px;
		text-align: center;
		color: #333;
		font-size: 16px;
		font-weight: 400;
		background-image: url(/pub/site/default/2022/images/main/sharing_man_icon.png);
		background-repeat: no-repeat;
		background-position: center top;
		background-size: 47px;
	}
	.section2 .share-map .share-list .total {
		font-size: 30px;
		font-weight: 600;
		text-align: center;
	}
	.section2 .share-map .share-list ul {
		display: flex;
		flex-wrap: wrap;
		margin-top: 30px;
	}
	.section2 .share-map .share-list ul li {
		display: flex;
		flex-direction: column;
		align-items: center;
		width: 50%;
		padding-bottom: 22px;
		text-align: center;
		color: #333;
		font-size: 12px;
		font-weight: 400;
	}
	.section2 .share-map .share-list ul li .num {
		display: inline-block;
		width: 55px;
		height: 55px;
		margin-bottom: 10px;
		line-height: 55px;
		text-align: center;
		color: #fff;
		font-size: 16px;
		font-weight: 600;
		border-radius: 50%;
	}
	.section2 .share-map .share-list ul li.list1 .num {	background-color: #4DBB1D; }
	.section2 .share-map .share-list ul li.list2 .num {	background-color: #8DA714; }
	.section2 .share-map .share-list ul li.list3 .num {	background-color: #14A767; }
	.section2 .share-map .share-list ul li.list4 .num {	background-color: #14A7A5; }
	.section2 .share-map .share-list ul li.list5 .num {	background-color: #1471A7; }
	.section2 .share-map .share-list ul li.list6 .num {	background-color: #4A65D7; }
	.section2 .share-map .share-list ul li.list7 .num {	background-color: #A941EB; }
	.section2 .share-map .share-list ul li.list8 .num {	background-color: #EB4199; }
	.section2 .share-map .share-list ul li.list9 .num {	background-color: #DD4629; }
	.section2 .share-map .share-list ul li.list10 .num { background-color: #D06E0F; }
	.section2 .share-map .share-list ul li.list11 .num { background-color: #A57D44; }
	.section2 .share-map .share-list ul li.list12 .num { background-color: #6E6E6E; }
	.section2 .share-map .share-list ul li .txt {
		display: block;
	}

	.section2 .share-map .wrap_map {
		height: 950px !important;
	}

	.section2 .share-map .resources-search {
		position: absolute;
		top: 60px;
		left: 30px;
		z-index: 10;

	}
	.section2 .share-map .resources-search form {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 100%;
	}
	.section2 .share-map .resources-search form .select_none select {
		height: 50px;
		margin-right: 8px;
		color: #333;
		font-size: 18px;
		border: none;
		border-radius: 5px;
		background-color: #fff;
	}
	.section2 .share-map .resources-search form .search_td {
		display: flex;
		width: 430px;
		margin-right: 10px;
	}
	.section2 .share-map .resources-search form .search_td input {
		width: calc( 100% - 50px );
		height: 50px;
		padding-left: 25px;
		color: #666;
		font-size: 18px;
		border-radius: 5px 0 0 5px;
		border: none;
		background-color: #fff;
	}
	.section2 .share-map .resources-search form .search_td button {
		width: 50px;
		height: 50px;
		border-radius: 0 5px 5px 0;
		border: none;
		background-color: #009F73;
	}
	.section2 .share-map .resources-search .use-btn {
		display: inline-block;
		width: 125px;
		height: 50px;
		line-height: 50px;
		font-size: 18px;
		color: #fff;
		text-align: center;
		border-radius: 5px;
		border: none;
		background-color: #0073BD;
	}
	.section2 .share-map .resources-search .use-btn i {
		padding-left: 5px;
	}


	.section3 {
		padding: 80px 0 120px;
		background-color: #E2F9F3;
	}
	.section3 h3 {
		text-align: center;
		color: #333;
		font-size: 40px;
		font-weight: 600;
	}
	.section3 .main-facility {
		display: flex;
		width: 100%;
		flex-wrap: wrap;
		margin-top: 55px;
	}
	.section3 .main-facility .facility-list {
		display: flex;
		width: 50%;
		padding-right: 35px;
		margin-bottom: 30px;
	}
	.section3 .main-facility .facility-list .img {
		display: block;	
		width: 250px;
		height: 170px;
		background-repeat: no-repeat;
		background-size: cover;
		background-position: center;
	}
	.section3 .main-facility .facility-list .img a {
		display: block;
		width: 100%;
		height: 100%;
	}
	.section3 .main-facility .facility-list .box {
		width: calc( 100% - 250px );
		padding-left: 25px;
	}
	.section3 .main-facility .facility-list .box .label-groups {
		display: block;
	}
	.section3 .main-facility .facility-list .box .label-groups span {
		display: inline-block;
		height: 28px;
		padding: 0 12px;
		margin-right: 10px;
		font-size: 14px;
		font-weight: 400;
		line-height: 28px;
		border-radius: 14px;
	}
	.section3 .main-facility .facility-list .box .label-groups span.b-no {
		color: #fff;
		background-color: #666;
	}
	.section3 .main-facility .facility-list .box .label-groups span.b-ok {
		color: #333;
		border: 1px solid #DBDBDB;
		background-color: #fff;
	}
	.section3 .main-facility .facility-list .box .label-groups span.green {
		color: #fff;
		background-color: #009F73;
	}
	.section3 .main-facility .facility-list .box a {
		display: block;
		margin-top: 15px;
	}
	.section3 .main-facility .facility-list .box a .tit {
		display: block;
		margin-bottom: 5px;
		font-size: 20px;
		font-weight: 400;
		color: #333;
		overflow:hidden;
		white-space:nowrap;
		text-overflow:ellipsis;  
	}
	.section3 .main-facility .facility-list .box a .txt {
		display: block;
		font-size: 14px;
		font-weight: 400;
		color: #666;
		line-height: 180%;
		overflow:hidden;
		white-space:nowrap;
		text-overflow:ellipsis;  
	}
	.section3 .main-facility .more-btn {
		margin: 0 auto;
		margin-top: 15px;
	}
	.section3 .main-facility .more-btn a {
		display: inline-block;
		width: 105px;
		height: 35px;
		line-height: 33px;
		text-align: center;
		color: #009F73;
		font-size: 16px;
		font-weight: 400;
		border-radius: 5px;
		border: 1px solid #009F73;
	}

   
}

@media (max-width: 1199px) and (min-width: 992px) {

	.section2 .share-con {
		padding-right: 20px;
		padding-left: 20px;
	}

	.section3 .main-facility .facility-list .img {
		width: 195px;
		height: 130px;
	}
	.section3 .main-facility .facility-list .box {
		width: calc( 100% - 195px );
	}
	.section3 .main-facility .facility-list .box a {
		margin-top: 10px;
	}
	.section3 .main-facility .facility-list .box a .tit {
		margin-bottom: 0;
	}



}


@media (max-width: 991px) {
    .pc-hide {
        display: block !important;
    }

    .mo-hide {
        display: none !important;
    }

    .main {
        z-index: 1;
        word-break: keep-all;
        /* padding-bottom: 30px; */
        position: relative;
    }

	.main {
        z-index: 1;
        word-break: keep-all;
        position: relative;
    }
	
	.section1 {
		position: relative;
		width: 100%;
		margin-top: 60px;
	}
	.section1 .video_wrap {
		width: 100%;
		overflow: hidden;
	}
    .section1 .video_wrap video {
		max-width: 100%;
		z-index: 1;
	}
	.section1 .mouse {
		display: none;
	}


	.section2 {
		width: 100%;
		display: flex;
		flex-direction: column;
		margin-top: -5px;
	}
	.section2 .share-con {
		width: 100%;
		padding: 35px 10px;
	}
	.section2 .share-con h3 {
		padding-bottom: 10px;
		font-size: 26px;
		font-weight: 600;
		color: #333;
	}
	.section2 .share-con .share-txt {
		font-size: 16px;
		color: #333;
		font-weight: 400;
		line-height: 160%;
	}
	.section2 .share-con .share-txt .more-btn {
		color: #009F73;
		font-size: 14px;
	}
	.section2 .share-con .share-board {
		position: relative;
		margin-top: 50px;
	}
	.section2 .share-con .share-board h3 {
		padding-bottom: 30px;
	}
	.section2 .share-con .share-board .board-list li {
		display: flex;
		align-items: center;
		width: 100%;
		margin-bottom: 25px;
	}
	.section2 .share-con .share-board .board-list li .date {
		display: inline-flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		width: 73px;
		height: 73px;		
		font-size: 14px;
		color: #fff;
		font-weight: 600;
		background-image: url(/pub/site/default/2022/images/main/date_bg_normal.png);
		background-repeat: no-repeat;
		background-position: center;
		background-size: 100%;
	}	
	.section2 .share-con .share-board .board-list li .date span {
		font-size: 28px;	
	}
	.section2 .share-con .share-board .board-list li a {
		display: block;
		width: calc( 100% - 93px );
		padding-left: 20px;
		font-size: 18px;
		color: #333;
		font-weight: 400;
		overflow: hidden;
		text-overflow:ellipsis;
		word-break: break-word;
		display:-webkit-box; 
		-webkit-line-clamp:2;
		-webkit-box-orient:vertical;
	}
	.section2 .share-con .share-board .more-btn {
		position: absolute;
		top: 5px;
		right: 0;
		font-size: 14px;
		color: #009F73;
	}

	.section2 .share-map {
		position: relative;
		width: 100%;
	}
	.section2 .share-map .share-list {
		width: 100%;
		padding: 20px 15px 10px;
		background-color: #EDF6FC;
		z-index: 100;
	}
	.section2 .share-map .share-list h3 {
		display: inline-block;
		padding-left: 60px;
		color: #333;
		font-size: 18px;
		line-height: 47px;
		font-weight: 400;
		background-image: url(/pub/site/default/2022/images/main/sharing_man_icon.png);
		background-repeat: no-repeat;
		background-position: left center;
		background-size: 47px;
	}
	.section2 .share-map .share-list .total {
		display: inline-block;
		font-size: 30px;
		font-weight: 600;
		text-align: center;
	}
	.section2 .share-map .share-list ul {
		display: flex;
		flex-wrap: wrap;
		margin-top: 25px;
	}
	.section2 .share-map .share-list ul li {
		display: flex;
		flex-direction: column;
		align-items: center;
		width: 25%;
		padding-bottom: 15px;
		text-align: center;
		color: #333;
		font-size: 12px;
		font-weight: 400;
	}
	.section2 .share-map .share-list ul li .num {
		display: inline-block;
		width: 55px;
		height: 55px;
		margin-bottom: 10px;
		line-height: 55px;
		text-align: center;
		color: #fff;
		font-size: 16px;
		font-weight: 600;
		border-radius: 50%;
	}
	.section2 .share-map .share-list ul li.list1 .num {	background-color: #4DBB1D; }
	.section2 .share-map .share-list ul li.list2 .num {	background-color: #8DA714; }
	.section2 .share-map .share-list ul li.list3 .num {	background-color: #14A767; }
	.section2 .share-map .share-list ul li.list4 .num {	background-color: #14A7A5; }
	.section2 .share-map .share-list ul li.list5 .num {	background-color: #1471A7; }
	.section2 .share-map .share-list ul li.list6 .num {	background-color: #4A65D7; }
	.section2 .share-map .share-list ul li.list7 .num {	background-color: #A941EB; }
	.section2 .share-map .share-list ul li.list8 .num {	background-color: #EB4199; }
	.section2 .share-map .share-list ul li.list9 .num {	background-color: #EB4199; }
	.section2 .share-map .share-list ul li.list10 .num { background-color: #D06E0F; }
	.section2 .share-map .share-list ul li.list11 .num { background-color: #A57D44; }
	.section2 .share-map .share-list ul li.list12 .num { background-color: #6E6E6E; }	
	.section2 .share-map .share-list ul li .txt {
		display: block;
	}

	.section2 .share-map .wrap_map {
		height: 465px !important;
	}

	.section2 .share-map .resources-search {
		position: absolute;
		bottom: 400px;
		left: 0;
		width: 100%;
		z-index: 10;

	}
	.section2 .share-map .resources-search form {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 100%;
		padding: 0 15px;
	}
	.section2 .share-map .resources-search form .select_none select {
		height: 42px;
		margin-right: 8px;
		color: #333;
		font-size: 16px;
		border: none;
		border-radius: 5px;
		background-color: #fff;
	}
	.section2 .share-map .resources-search form .search_td {
		display: flex;
		width: calc( 100% - 120px );
		margin-right: 10px;
	}
	.section2 .share-map .resources-search form .search_td input {
		width: calc( 100% - 42px );
		height: 42px;
		padding-left: 15px;
		color: #666;
		font-size: 18px;
		border-radius: 5px 0 0 5px;
		border: none;
		background-color: #fff;
	}
	.section2 .share-map .resources-search form .search_td button {
		width: 42px;
		height: 42px;
		border-radius: 0 5px 5px 0;
		border: none;
		background-color: #009F73;
	}
	.section2 .share-map .resources-search .use-btn {
		display: inline-block;
		width: 110px;
		height: 42px;
		line-height: 42px;
		font-size: 16px;
		color: #fff;
		text-align: center;
		border-radius: 5px;
		border: none;
		background-color: #0073BD;
	}
	.section2 .share-map .resources-search .use-btn i {
		padding-left: 5px;
	}


	.section3 {
		padding: 50px 15px 110px;
		background-color: #E2F9F3;
	}
	.section3 h3 {
		color: #333;
		font-size: 26px;
		font-weight: 600;
	}
	.section3 .main-facility {
		display: flex;
		width: 100%;
		flex-wrap: wrap;
		margin-top: 25px;
	}
	.section3 .main-facility .facility-list {
		display: flex;
		flex-direction: column;
		width: 100%;
		margin-bottom: 40px;
	}
	.section3 .main-facility .facility-list .img {
		display: block;	
		width: 100%;
		height: 220px;
		margin-bottom: 25px;
		background-repeat: no-repeat;
		background-size: cover;
		background-position: center;
	}
	.section3 .main-facility .facility-list .img a {
		display: block;
		width: 100%;
		height: 100%;
	}
	.section3 .main-facility .facility-list .box {
		width: 100%;
	}
	.section3 .main-facility .facility-list .box .label-groups {
		display: block;
	}
	.section3 .main-facility .facility-list .box .label-groups span {
		display: inline-block;
		height: 28px;
		padding: 0 12px;
		margin-right: 10px;
		font-size: 14px;
		font-weight: 400;
		line-height: 28px;
		border-radius: 14px;
	}
	.section3 .main-facility .facility-list .box .label-groups span.gray {
		color: #fff;
		background-color: #666;
	}
	.section3 .main-facility .facility-list .box .label-groups span.white {
		color: #333;
		border: 1px solid #DBDBDB;
		background-color: #fff;
	}
	.section3 .main-facility .facility-list .box .label-groups span.green {
		color: #fff;
		background-color: #009F73;
	}
	.section3 .main-facility .facility-list .box a {
		display: block;
		margin-top: 15px;
	}
	.section3 .main-facility .facility-list .box a .tit {
		display: block;
		margin-bottom: 5px;
		font-size: 18px;
		font-weight: 400;
		color: #333;
		overflow:hidden;
		white-space:nowrap;
		text-overflow:ellipsis;  
	}
	.section3 .main-facility .facility-list .box a .txt {
		display: block;
		font-size: 14px;
		font-weight: 400;
		color: #666;
		line-height: 180%;
		overflow:hidden;
		white-space:nowrap;
		text-overflow:ellipsis;  
	}
	
	.section3 .main-facility .facility-list:nth-of-type(3),
	.section3 .main-facility .facility-list:nth-of-type(4),
	.section3 .main-facility .facility-list:nth-of-type(5),
	.section3 .main-facility .facility-list:nth-of-type(6) {
		display: none;
	}
	.section3 .main-facility .more-btn {
		margin: 0 auto;
		margin-top: 15px;
	}
	.section3 .main-facility .more-btn a {
		display: inline-block;
		width: 105px;
		height: 35px;
		line-height: 33px;
		text-align: center;
		color: #009F73;
		font-size: 16px;
		font-weight: 400;
		border-radius: 5px;
		border: 1px solid #009F73;
	}


   
}



/*공유자원 모달*/
.resources-modal .modal-header {
	position: relative;
	padding: 50px 50px 15px 50px;
	border: none;
}
.resources-modal .modal-header .modal-title {
	color: #009F73;
	font-size: 18px;
	font-weight: 600;
}
.resources-modal .modal-header .modal-title i {
	padding-right: 10px;
}
.resources-modal .modal-header .close {
	position: absolute;
	top: 20px;
	right: 20px;
	font-size: 18px;
	font-weight: 400;
	color: #333;
	text-shadow: none;
	opacity: 1;
}
.resources-modal .modal-header .close i {
	padding-right: 5px;
}
.resources-modal .modal-body {
	padding: 0 50px 50px;
}
.resources-modal .modal-body p {
	padding-bottom: 5px;
	font-size: 16px;
	color: #333;
}
.resources-modal .modal-body .txt-box {
	margin-bottom: 25px;
	padding: 20px;
	font-size: 16px;
	color: #333;
	background-color: #E2F9F3;
}
.resources-modal .modal-body h3 {
	font-size: 22px;
	font-weight: 600;
}
.resources-modal .modal-body ul {
	padding: 0;
	margin-bottom: 40px;
}
.resources-modal .modal-body ul li {
	position: relative;
	margin-bottom: 10px;
	background: none;
	padding-left: 10px;
	font-size: 16px;
	color: #333;
}
.resources-modal .modal-body ul li:before {
	content: '';
	position: absolute;
	top: 8px;
	left: 0;
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background-color: #333;
}


@media (max-width: 991px) {
	/*공유자원 모달*/
	.resources-modal .modal-header {
		padding: 15px;
	}
	.resources-modal .modal-body {
		padding: 0 15px 15px;
	}
	.resources-modal .modal-body .txt-box {
		padding: 15px;
	}
}