@charset "utf-8";
@import url("layout.css");

@font-face {
	font-family: 'NanumSquareNeo';
	font-style: normal;
	font-weight: 400;
	src: url('/include/font/NanumSquareNeoTTF-bRg.eot'); /* IE9 Compat Modes */
	src: local(''),
		 url('/include/font/NanumSquareNeoTTF-bRg.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		 url('/include/font/NanumSquareNeoTTF-bRg.woff2') format('woff2'), /* Super Modern Browsers */
		 url('/include/font/NanumSquareNeoTTF-bRg.woff') format('woff'), /* Modern Browsers */
		 url('/include/font/NanumSquareNeoTTF-bRg.svg#NotoSansKR') format('svg'); /* Legacy iOS */
}
@font-face {
	font-family: 'NanumSquareNeo';
	font-style: normal;
	font-weight: 600;
	src: url('/include/font/NanumSquareNeoTTF-dEb.eot'); /* IE9 Compat Modes */
	src: local(''),
		 url('/include/font/NanumSquareNeoTTF-dEb.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		 url('/include/font/NanumSquareNeoTTF-dEb.woff2') format('woff2'), /* Super Modern Browsers */
		 url('/include/font/NanumSquareNeoTTF-dEb.woff') format('woff'), /* Modern Browsers */
		 url('/include/font/NanumSquareNeoTTF-dEb.svg#NotoSansKR') format('svg'); /* Legacy iOS */
}
@font-face {
	font-family: 'NanumSquareNeo';
	font-style: normal;
	font-weight: 700;
	src: url('/include/font/NanumSquareNeoTTF-eHv.eot'); /* IE9 Compat Modes */
	src: local(''),
		 url('/include/font/NanumSquareNeoTTF-eHv.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		 url('/include/font/NanumSquareNeoTTF-eHv.woff2') format('woff2'), /* Super Modern Browsers */
		 url('/include/font/NanumSquareNeoTTF-eHv.woff') format('woff'), /* Modern Browsers */
		 url('/include/font/NanumSquareNeoTTF-eHv.svg#NotoSansKR') format('svg'); /* Legacy iOS */
}

#section {overflow:hidden; min-height:900px;}

/* 예약시스템 */
.reserveSystem{position:relative; color:#000;margin-bottom:0;padding:44px 0 50px 0;font-family: "NanumSquareNeo";letter-spacing:-0.05em;display:flex;justify-content: space-between;;border-radius:30px;}
.reserveSystem::before {display:block; content:''; width:200%; height:685px; background-color:#f5f8f9; position:absolute; left:-50%; top:0; z-index:-1;}
.reserveSystem .leftBox{position: relative;width:100%;}
.reserveSystem .leftBox .titleBox{margin-top:28px;margin-left:50px;}
.reserveSystem .leftBox .titleBox .txt{font-size:1.875em;margin-bottom:10px;}
.reserveSystem .leftBox .titleBox .title{font-size:3.500em;font-weight:600;line-height:1.3;}
.reserveSystem .leftBox .titleBox .title span{color:#d84048;font-weight: 700;}

/* 시간제 보육 예약 */
.reserveSystem .rightBox{width:550px;flex-shrink:0;}
.reserveSystem .rightBox .reserveLinkWrap{border-radius:30px;background:#fff;padding:25px;text-align:center;margin-bottom:37px;box-shadow: rgb(0 0 0 / 10%) 8px 5px 15px;transition: all .2s ease-out;}
.reserveSystem .rightBox .reserveLinkWrap:hover{transform: translateY(2px); box-shadow: 0 2px 5px rgba(0,0,0,.1),0 1px 2px rgba(0,0,0,.05)}
.reserveSystem .rightBox .reserveLinkWrap .reseveLinkIcon{display:flex;align-items:center;flex-direction: column;justify-content:center;border-radius: 30px;background:url("/include/image/nisarang/main/bg_reserve.png") no-repeat 0 0;background-size:cover;width:100%;height:134px;box-shadow: rgb(0 0 0 / 10%) 8px 5px 15px;}
.reserveSystem .rightBox .reserveLinkWrap .reseveLinkIcon::before{content:"";background:url("/include/image/nisarang/main/ico_reserve.png") no-repeat 0 0;width:54px;height:50px;display:inline-block;margin-bottom:5px;}
.reserveSystem .rightBox .reserveLinkWrap .reseveLinkIcon span{font-size:1.389em;color:#fff;display:block;font-weight:600;}

/* 바로가기 */
.mainSvcList{display:flex;margin:0 30px;margin-bottom:37px;}
.mainSvcList > li{text-align:center;width:25%;text-align:center;}
.mainSvcList > li > a{position:relative;}
.mainSvcList > li .ico{display:inline-block;border-radius:10px;width:80px;height:80px;border-radius:15px;background: linear-gradient(90deg, rgba(237,111,157,1) 0%, rgba(237,114,152,1) 100%);}
.mainSvcList > li:nth-child(3) .ico{background: linear-gradient(90deg, rgba(237,121,139,1) 0%, rgba(236,125,132,1) 100%);}
.mainSvcList > li:nth-child(4) .ico{background: linear-gradient(90deg, rgba(236,127,128,1) 0%, rgba(236,131,121,1) 100%);}
.mainSvcList > li .ico::after{content:"";width:100%;height:100%;background:url(/include/image/nisarang/main/ico_svc.png) no-repeat 0 0;display:block;}
.mainSvcList > li.item1 .ico::after{background-position-y:0;}
.mainSvcList > li.item2 .ico::after{background-position-y:-80px;}
.mainSvcList > li.item3 .ico::after{background-position-y:-160px;}
.mainSvcList > li.item4 .ico::after{background-position-y:-240px;}
.mainSvcList > li > a span{display:block;line-height:1.4;}

/* 팝업존 */
.visual-slider .swiper-container {box-shadow: 3px 4px 20px 0px rgba(0, 0, 0, 0.3);}
.visual-slider .btnSlidePlay,
.visual-slider .btnSlidePause{display:inline-block;width:15px;height:19px;background:url("/include/image/common/btn_mainpopup_gray.png") no-repeat 0 0;background-size:30px auto;margin-left:3px;}
.visual-slider .btnSlidePause{background-position:0 0;}
.visual-slider .btnSlidePlay{background-position:-15px 0;}
.visual-slider .swiper-pagination {height:20px; display:flex; align-items:center;}
.visual-slider .swiper-pagination-bullet {background:#fff; border-color:#8e8e8e;}
.visual-slider .swiper-pagination-bullet-active {background:#d84048;}

/* 공지사항 */
.noticeZone{border-radius:20px;background:#fff;position:relative;padding:26px 35px 40px;box-shadow: rgb(0 0 0 / 10%) 8px 5px 15px;}
.noticeZone .mtitle{font-size:1.563em;}
.noticeList > a:first-child{margin-top:20px;}
.noticeList > a{font-size:1.063em;text-overflow:ellipsis;white-space:nowrap;display:block;overflow: hidden;}
.noticeList > a + a{margin-top:6px;}
.noticeList .date{color:#d84048;display:inline-block; width:50px;font-family:'Noto Sans';font-weight:600;font-size:0.882em;}
.moreBtn{position:absolute;right:28px;top:23px;}
.moreBtn::before, .moreBtn::after{content:"";position:absolute;left: 50%;top: 50%;width: 14px;height: 2px;margin-left: -8px;background-color: #000;}
.moreBtn::after{transform: rotate(90deg);}
.moreBtn > a{display:block;width:40px;height:40px;}
.noData{display:flex;align-items:center;justify-content:center;flex-direction:column;font-size:1.063em;color:#555;height:170px;}
.noData::before{content:"";width:52px;height:64px;display:block;background:url("/include/image/nisarang/main/ico_noimg_main.png") no-repeat 0 0;margin-bottom:10px;}

@media screen and (max-width:1024px){
	/* 예약시스템 */
	.reserveSystem{flex-wrap:wrap;padding:110px 15px 70px;margin:0;border-radius:0;}
	.reserveSystem .leftBox {margin-bottom:45px;text-align:center;}
	.reserveSystem .leftBox .titleBox{margin:25px 0 30px;}
	.reserveSystem .rightBox{width:100%;}
	.visual-slider {margin:0 auto;}
}
@media screen and (max-width:768px){
	/* 예약시스템 */
	.reserveSystem{padding-bottom:50px;}
	.reserveSystem .leftBox .titleBox .txt{font-size:1.500em;}
	.reserveSystem .leftBox .titleBox .title{font-size:2.375em;}
	
	/* 시간제 보육 예약 */
	.reserveSystem .rightBox .reserveLinkWrap{padding:25px;}
	.reserveSystem .rightBox .reserveLinkWrap .reseveLinkIcon{border-radius:15px;height:130px;}

	/* 바로가기 */
	.mainSvcList > li .ico{width:70px;height:70px;}
	.mainSvcList > li .ico::after{background-size:70px;}
	.mainSvcList > li.item1 .ico::after{background-position-y:0;}
	.mainSvcList > li.item2 .ico::after{background-position-y:-70px;}
	.mainSvcList > li.item3 .ico::after{background-position-y:-140px;}
	.mainSvcList > li.item4 .ico::after{background-position-y:-210px;}
	
	/* 공지사항 */
	.noticeZone{padding:25px;}
	.moreBtn {position: absolute;right: 19px;top: 11px;}
}

@media screen and (min-width:1025px){
	#header{position:static;left:auto;top:auto}
	#container.main {height:auto;}

	/* 예약시스템 */
	.reserveSystem .leftBox .thumb{position:absolute;left:-50px;top:390px;}
	.reserveSystem .leftBox .thumb img{width:100%;}
}