/*-----폰트-----*/
.inn h2{font-size: 3.5rem;}
.inn h3{font-size: 2.2rem;}
.inn h4{font-size: 1.8rem; margin-bottom: .75rem; }
.cts4 .con_tab{font-size: 1.2rem;}
.inn h5{font-size: 1.25rem; margin-bottom: .75rem;}
.call_box li em{font-size: .85rem;}
.quick_menu ul{font-size: .8rem;}
.view_more,
.call_box li{font-size: .75rem;}

/*-----공통-----*/
.line_wrap { position: relative; margin: 0 auto;}
.inn { position: relative; width: 1200px; margin: 0 auto; padding: 5rem 0;}
.inn h2 { line-height: 1.3; color:#222;}
.inn h5 {}
.sr-only { position:absolute; left:-9999px; right:9999px;}
.SBtween { display: flex; justify-content: space-between; flex-wrap: wrap; }

/*-----자세히 보기-----*/
.view_more{position: relative; margin-top: 1.25rem; padding-right: 2.5rem; display: inline-block; font-weight: 600;}
.view_more:after{position: absolute; content: ''; display: block; right:0; top: 50%; transform: translateY(-50%); width: 2rem; height: .7rem; background: url('/images/default/main/view_more_g.png') no-repeat right center; background-size: contain;}


/*메인 비주얼*/
.cts1 { position: relative; font-family: 'Pretendard-Bold'; }
.swiper1 .swiper-button-prev {width:27px;height:44px;margin-top:-22px;overflow:hidden;background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 44'%3E%3Cpath fill='%23fff' d='M0 22 22 0l2.1 2.1L4.2 22l19.9 19.9L22 44 0 22z'/%3E%3C/svg%3E");}
.swiper1 .swiper-button-next {width:27px;height:44px;margin-top:-22px;overflow:hidden;background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 44'%3E%3Cpath fill='%23fff' d='M27 22 5 44l-2.1-2.1L22.8 22 2.9 2.1 5 0l22 22z'/%3E%3C/svg%3E");}
.swiper1 .swiper-button-prev svg,
.swiper1 .swiper-button-next svg {display:none;}
.swiper1 .swiper-button-prev span,
.swiper1 .swiper-button-next span {position:absolute;left:-2px;top:-2px;display:flex;width:1px;height:1px;font-size:1px;overflow:hidden;}
.swiper1 .ctrl-box {position:absolute;left:50%;transform:translateX(-50%);bottom:15px;z-index:1;padding:10px;height:40px;background:rgba(0,0,0,0.4);border-radius:30px;}
.swiper1 .ctrl-box button {position:relative;display:inline-block;vertical-align:top;width:20px;height:20px;overflow:hidden;}
.swiper1 .ctrl-box button span {position:absolute;left:-2px;top:-2px;display:flex;width:1px;height:1px;font-size:1px;overflow:hidden;}
.swiper1 .ctrl-box .swiper-btn-pause::before {content:"";position:absolute;left:5px;top:3px;width:3px;height:14px;background:#fff;border-radius:1px;}
.swiper1 .ctrl-box .swiper-btn-pause::after {content:"";position:absolute;right:5px;top:3px;width:3px;height:14px;background:#fff;border-radius:1px;}
.swiper1 .ctrl-box .swiper-btn-start::after {content:"";position:absolute;left:7px;top:3px;display:flex;border-block:7px solid transparent;border-left:7px solid #fff;border-right:7px solid transparent;}
.swiper1 .swiper-pagination-fraction {position:relative;left:auto;bottom:auto;width:33px;display:inline-block;vertical-align:top;line-height:25px;height:20px;font-size:13px;color:#fff;}
.cts1 .line_wrap { height: 700px; }
.cts1 .line_wrap .inn { position: relative; display: block; height: inherit; font-size: 2.5rem; color: #FFF; }
.cts1 .mainTxt { position: absolute; top: 50%; left: 0;  transform: translateY(-50%); font-weight: 600; text-shadow: 0 0 20px rgba(0,0,0,0.5); }
.cts1 .line_wrap h2 {font-weight: 600; font-size: 2.5rem; color: #FFF; }
.cts1 .line_wrap h5 {font-weight: 400; padding: 1rem 0 1rem .25rem; margin-bottom:0; line-height:1.8; color: #FFF; }

.cts1 .main_news { overflow: hidden; margin: 0 -.5rem;}
.cts1 .main_news li { position: relative; float: left; width: 50%; padding: 0 .5rem;}
.cts1 .main_news li h5 { display: inline-block; text-overflow:ellipsis; overflow: hidden; text-overflow: ellipsis; display: -webkit-box;
-webkit-line-clamp: 1; -webkit-box-orient: vertical; word-wrap:break-word; line-height: 1.3em; height: 1.3em;}



/*장애인의 건강한 삶을 위한 사업*/
.cts2 { background: url('/images/default/main/mainCard_bg.png') no-repeat top center; font-family: 'Pretendard-Medium'; }
.cts2 .inn h4 { font-family: 'Pretendard-Bold'; text-align: center; }
.cts2 .inn p{ display: inline-block; margin-bottom: 4rem; width: 100%; height: 2.6rem; text-align: center; color: #999; }
.cts2 .line_wrap{ z-index: 1; }

.cts2 .mainCard { margin-bottom: 6rem; }
.cts2 .mainCard article { padding: 2rem; width: calc(100% / 4 - 20px); height: 360px; border-radius: 20px; }
.cts2 .mainCard article:nth-of-type(even) { margin-top: 2rem; }
.cts2 .mainCard article:nth-of-type(1) { background: #C4F6FF; box-shadow: 0 8px 20px rgba(225,250,255,1); }
.cts2 .mainCard article:nth-of-type(2) { background: #FFEAB1; box-shadow: 0 8px 20px rgba(255,245,220,1); }
.cts2 .mainCard article:nth-of-type(3) { background: #ADF5DF; box-shadow: 0 8px 20px rgba(200,255,240,1); }
.cts2 .mainCard article:nth-of-type(4) { background: #CDF5B6; box-shadow: 0 8px 20px rgba(225,255,210,1); }
.cts2 .mainCard article:hover { transform: translateY(-30px); transition: 1s; }



/* 지역별 등록장애인 현황 */
.cts2 .inn h5 { display: block; margin-bottom: 1.5rem; padding-left: 40px; padding-bottom: 1rem; border-bottom: 1px solid #DBDBDB; font-family: 'GmarketSansMedium'; font-weight: 500;}
.cts2 .regiTotal { position: absolute; top: 10px; right:0; font-family: 'GmarketSansLight'; font-size: 0.8rem; }
.cts2 .registrationList span { display: inline-block; font-weight: 700; font-size: 1.2rem; font-family: 'Montserrat', sans-serif; }

.cts2 .registrationList { position: relative; display: block; font-family: 'GmarketSansMedium'; }
.cts2 .registrationList > img { position: absolute; top: 0; left:0; display: inline-block; }
.cts2 .registrationList > article { display: flex; justify-content: space-between; flex-wrap: wrap; }
.cts2 .registrationList > article > div { position: relative; display: flex; align-items: center; margin-bottom: 20px; width: calc(100% / 5 - 10px); height: 65px; text-align: center; border-radius: 5rem; border: 5px solid #EDEDED; }
.cts2 .registrationList > article > div a { position: absolute; top: 0; left: 0; display: inline-block; width: 100%; height: 100%; border-radius: 5rem; }
.cts2 .registrationList > article > div small { display: inline-block; padding-top: 5px; width: 40%; font-size: 0.9rem; line-height: 1rem; border-right: 1px solid #DDD; }
.cts2 .registrationList > article > div span { display: inline-block; width: 50%; text-align: right; font-size: 1.2rem; color: #00A284; }

.cts2 .mainCard {  }
.cts2 .mainCard article { }
.cts2 .mainCard article > img { display: block; }
.cts2 .mainCard article > img:first-of-type { margin-bottom: 80px; width: 80px; height: 80px; object-fit:contain;}
.cts2 .mainCard article > img:last-of-type { margin-bottom: 20px; width: 35px; }






/* 검색 */
.cts3{ height: 670px; background:url('/images/default/main/img_searchMap_bg.png') no-repeat bottom / cover; }
.cts3 .inn { padding: 1rem 0; }
.cts3 article { position: relative; padding: 3rem; background: #FFF; border-radius: 20px; }
.cts3 article h4 { line-height: 2rem; font-family: 'GmarketSansBold'; color: #005EB2; }
.cts3 article img { position: absolute; top: -35%; left: -12%; }

.cts3 .SBtween { align-items: center; }
.cts3 .search_input_wrap {position: relative; width: 100%; max-width: 900px; margin: 3rem auto 0;}
.cts3 .search_input_wrap .insearch { padding: 0 2rem 0 .5rem; height: 3rem; }

.cts3 .search_input_wrap .inbtn { position: absolute; right: 0rem; top: 50%; transform: translateY(-50%);  display: block;  margin: 0; border: none; padding: 0 0 0 0;  width: 2rem; height:2rem; line-height: 2rem; font-size:0; background: url("/images/default/main/search_g.png") no-repeat center center; background-size:1rem 1rem;}
.cts3 .search_area { position: relative; }
.cts3 .search_area:before { content:''; position: absolute; top: 3.3rem; left: 0.3rem; display: block; width: 100%; height: 60px; background: #005EB2; }

.cts3 .searchMap { width: 700px; }
.cts3 .searchMap svg { width: 100%; }
.cts3 .searchMap .item:hover { position: relative; fill: #36EFA5; transition: all .6s;}
.cts3 .searchMap a { position: absolute; top: 0; left: 0; display: inline-block; width: 100px; height: 100px;}
.cts3 .searchMap a:focus-visible {outline:1px solid !important;}






/*공지사항*/
.cts4 { position: relative; }
.cts4 .moreTxt {position:absolute;left:5rem;top:10rem;display: inline-block; margin-top: 2rem; padding-left: 1rem; }
.cts4 > img { position: absolute; top: 0; left: -10%; z-index: -1; }
.cts4 .inn { padding: 5rem; }
.cts4 .inn h4 { position: relative; display: block; padding: 1.5rem 0 0 1rem; width: 220px; text-align: left !important; font-family: 'GmarketSansBold'; }
.cts4 .inn h4:after { content:''; position: absolute; top: 0; left: 0; display: inline-block; width: 100%; height: 5px; background: #EDEDED; }
.cts4 .inn h4,
.cts4 .inn > p{/* color: #fff; */ text-align: center;}
.cts4 .con_tab{margin: 1.5rem 0;}
.cts4 .con_tab ul{width: 100%; display: flex; justify-content: center;}
.cts4 .con_tab li{position: relative; margin: 0 .5rem; /* color: #fff; */}
.cts4 .con_tab li:after{position: absolute; content: ''; display: block; width: 100%; height: 2px; background: #fff; left:0; bottom: -.2rem;}
/* .cts4 .con_tab li:hover, */
.cts4 .con_tab li.on{/* color: #0A662D; */ background:#075023; color:#fff; padding: 0 .8rem; transition: all .2s; -webkit-transition: all .2s;}
.cts4 .con_tab li.on:after{background: #075023;}

.cts4 .con_tab2{margin: 2rem 0 0;}
.cts4 .con_tab2 ul{width: 100%; display: flex; justify-content: center;}
.cts4 .con_tab2 li{position: relative; width: 20%; margin: 0 .5rem; background: #fff; height: 3rem; line-height: 3rem; border-radius: .2rem; border: 2px solid #FFF; box-shadow: 0 0 .5rem rgba(0, 0, 0, .2);}
.cts4 .con_tab2 li:hover,
.cts4 .con_tab2 li.on{background: #075023; color: #fff; transition: all .2s; -webkit-transition: all .2s;}

.cts4 .floor_box{position: relative; text-align: center;}
.cts4 .floor_box .floor_bg{text-align: center; background:#FBFBFB;padding:1rem; box-shadow: 0 0 .5rem rgba(0, 0, 0, .2);}
.cts4 .floor_box .floor_bg h5{text-indent: -999999999px;}

.cts4 .noticeList { width: calc(100% - 300px); }
.cts4 .noticeList div { position: relative; display: flex; align-items: center; padding: 0.7rem 1.5rem; border-bottom: 1px solid #DBDBDB;  }
.cts4 .noticeList div:before { content:''; position: absolute; top: 40%; left: 10px; display: block; width: 6px; height: 6px; background: #00A284; }

.cts4 .noticeList div a { display: inline-block; width: 85%; }
.cts4 .noticeList div span { display: inline-block; width: 15%; font-size: 0.7rem; text-align: right; color: #464646; }

@media (max-width:767px){
	.cts4 .moreTxt {left:auto;top:1rem;right:1rem;}
}


/* 하단 전화번호*/
.call_wrap{ display: flex; align-items: center; width: 100%; height: 150px; background: #FBFBFB; }
.call_box { margin: auto; width: 1200px; display: flex; align-items: center; }
.call_box li { display: flex; padding: 0 2rem; width: 30%; border-right: 1px solid #9A9A9A; }
.call_box li.callBox { width: 34%; }
.call_box li.mailBox { width: 36%; border-right: none; }

.call_box li img { width: 3rem; height: 3rem; margin-right: 1rem; }
.call_box li a { display: block; }
.call_box li em { display: block; color: #0036A2; font-family:'Montserrat', sans-serif; font-size: 1.2rem; font-weight: bold; }


/* 배너 */
.banner_box{background: #0ba848;}
.botBan{position: relative; padding: 1rem 0; width: 1460px; margin: 0 auto;}
.botBan:after{position: absolute; content: ""; display: block; width: 100vw; height: 1px; background: rgba(255, 255, 255, .3); left: 50%; transform: translateX(-50%); bottom:0;}

.botBan .swiper-container{position: relative; width: calc(100% - 6rem);}
.botBan .swiper-slide{background: #fff; height: 3.5rem; text-align: center; overflow: hidden;}
.botBan .swiper-slide a{display: block; width: 100%; height: 100%;}
.botBan .swiper-slide a div{width: 100%; height: 100%; display: flex; width: 100%; height: 100%; justify-content: center; align-items: center;}
.botBan .swiper-slide img{max-height: 80%;}
.botBan .remocon{position: absolute; top:50%; left:0; width: 100%;}

.botBan .remocon .swiper-button-next, .botBan .remocon .swiper-button-prev{width: 1rem; height: 1.5rem; background-size: 1rem 1.5rem; margin-top:0; transform: translateY(-50%);}
.botBan .remocon .swiper-button-next{background-image: url('/images/default/main/bot_r.png');}
.botBan .remocon .swiper-button-prev{background-image: url('/images/default/main/bot_l.png');}
.banner_box .botBan:nth-of-type(2):after{display: none;}
.banner_box .botBan:nth-of-type(2) .swiper-slide{background: #0ba848;}
.banner_box .botBan:nth-of-type(2) .swiper-slide img{width: 100%; height: 100%; max-height: inherit;}
.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled{opacity: 1 !important;}


/********************************************************
■ 레이아웃 변경
********************************************************/

@media (max-width:1700px){
	/*-----공통-----*/
	.line_wrap{width:100%;}

}
@media (max-width:1460px){
	.botBan{width:100%;}

}
@media (max-width:1200px){
	/*-----공통-----*/
	.inn{width: 100%; padding: 3rem 2rem;}
	
	/*-----퀵메뉴-----*/
	.quick_menu{display: flex; right: -.5rem;}
	.quick_menu p{writing-mode: vertical-rl; height: 12rem; border-radius: 1rem 0 0 1rem; padding: 1rem;}
	.quick_menu ul{display: none; width: 10rem ; border-radius: 0 1rem 1rem 0;}

	/*메인 비주얼*/
	.cts1 .line_wrap:nth-of-type(2):before {left: -3.2rem; width: 5rem; height: 5rem;}
	.cts1 .inn{padding: 3rem 1rem;}


	/*전화번호*/
	.call_wrap{width: 100%; padding: 0 1rem;}

	
	/* 배너 */
	.botBan{width: 100%;}
}


/********************************************************
■ 태블릿
********************************************************/
@media (max-width:1350px){
	.cts1 .mainTxt { left:3rem;right:3rem; }
}
@media (max-width:1030px){
	.cts4 .floor_box .floor_bg img{max-width:100%;}
	.wrap-autoplay-control {right:3rem;}
	.call_box li { width: 100% !important; }

}


/********************************************************
■ 모바일
********************************************************/
@media (max-width:767px){
	.inn{width: 100%; padding: 3rem 1rem;}

	/*-----폰트-----*/
	.inn h2{font-size: 2.3rem;}
	.inn h3{font-size: 2rem;}


	/*메인 비주얼*/
	.cts1 .line_wrap { height: 400px; }
	.cts1 .line_wrap:nth-of-type(1) .inn h5{font-size:1rem; padding-right:40px; line-height:1.5;}
	.cts1 .main_news{margin: -2rem 0 0;}
	.cts1 .main_news li{position: relative; float: none; width: 100%; padding: 0; margin-top: 2rem;}
	
	.cts1 .line_wrap h2 {font-weight: 600; font-size: 1.8rem; color: #FFF; }
	.cts1 .line_wrap h5 {font-weight: thin; font-size: 1rem; padding: 1rem 0 1rem .25rem; margin-bottom:0; line-height:1.3rem; color: #FFF; }


	/*장애인의 건강한 삶을 위한 사업*/
	.cts2 .center_news {display: block;}
	.cts2 .inn h3 {margin-bottom: 1rem;}
	.cts2 .inn p { margin-bottom: 2rem; }

	.cts2 .mainCard article { position: relative; margin-bottom: 1rem; padding: 1rem 2rem; width: 100%; height: 80px; }
	.cts2 .mainCard article:nth-of-type(even) { margin-top: 0; }
	.cts2 .mainCard article > a { position: absolute; top: 50%; left: 35%; transform: translateY(-50%); }
	.cts2 .mainCard article > img:first-of-type { margin-bottom: 15px; width: 50px; height: 50px; }
	.cts2 .mainCard article > img:last-of-type { margin-bottom: 20px; width: 25px; display: none; }
	.cts2 .mainCard article:hover { transform: translateY(0); transform: translateX(-10px);transition: 1s; }


	/*지역별 등록장애인 현황*/
	.cts2 .inn h5 { display: block; margin-bottom: 1.5rem; padding-left: 40px; padding-bottom: 1rem; }
	.cts2 .inn h5 small { display: block; }
	.cts2 .regiTotal { top: 23px; right:0; font-size: 0.7rem; }
	.cts2 .registrationList > article > div { margin-bottom: 5px; width: calc(100% / 2 - 2px); height: 50px; border: 4px solid #EDEDED; }


	/* 검색 */
	.cts3 { height: 750px; }
	.cts3 .inn { padding: 1rem; }
	.cts3 article { margin-top: 2rem; padding: 2.5rem 1.5rem; }
	.cts3 article img { width: 110px; top: -35%; left: 60%; transform: scaleX(-1) }
	.cts3 .search_area:before { height: 47px; }
	.cts3 .searchMap { width: 100%; position: absolute; left:50%; top: 60%; transform: translateX(-50%); }


	/* 공지사항 */
	.cts4 .inn { padding: 1rem; }
	.cts4 .inn h4:after { display: none; }
	.cts4 .inn > div:first-child { display: flex; justify-content: space-between; width: 100%; }

	.cts4 .noticeList { width: 100%; }
	.cts4 > img { display: none; }
	
	.cts4 .noticeList div { position: relative; display: flex; align-items: center; padding: 0.7rem 1.5rem; border-bottom: 1px solid #DBDBDB;  }
	.cts4 .noticeList div:before { top: 40%; left: 10px; }
	.cts4 .noticeList div:last-of-type { border-bottom: 0; }

	.cts4 .noticeList div a { width: 70%; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }
	.cts4 .noticeList div span { width: 30%; font-size: 0.7rem; }


	/*전화번호*/
	.call_wrap{ display: flex; align-items: center; padding: 2rem 0; width: 100%; height: fit-content; background: #FBFBFB; }
	.call_box li { margin-bottom: 10px; width: 100%; border: none; }
	.call_box li:last-of-type { width: 100%; }
	.call_box li img { width: 3rem; height: 3rem; margin-right: 1rem; }
	.call_box li a { display: block; width: 80%; text-align: left; }

}
@media (max-width:550px){
	.cts1 .line_wrap {word-break:break-all;}
	.cts1 .line_wrap br {display:none;}
}