@charset "utf-8";


/* 타이틀 */
[data-main-con] h2.title							{ font-size:2.625em; font-weight:normal; line-height:1; margin-bottom:1em; font-family: var(--font-TTWanju);} 


@media all and (max-width:1268px){
	/* 타이틀 */
	[data-main-con] h2.title						{ font-size:2em; }
	
	/* 더보기 */
	.icon_more											{  width:30px; height:30px; }
	.icon_more::before								{ background-size:9px; }
}
@media all and (max-width:868px){
	/* 타이틀 */
	[data-main-con] h2.title						{ font-size:1.8em; }
}
@media all and (max-width:468px){
	/* 타이틀 */
	[data-main-con] h2.title						{ font-size:1.6em; }
}		



@media all and (max-width:1368px){
	.more													{ width:36px; height:36px; }
}	

@media all and (max-width:468px){
	.more													{ width:34px; height:34px; }
}	


/* 더보기 */
.icon_more										{ display:flex; align-items:center; justify-content:center; position:relative; width:35px; height:35px; border:1px solid #c9c9c9; border-radius:100%; background:var(--color-white); transition:var(--trans-ani);}
.icon_more::before							{ position:absolute; width:100%; height:100%; left:0; top:0; content:''; background:url(/resource/farm/images/common/icon_more.svg) no-repeat 50% 50% / 11px; transition:var(--trans-ani);}
.icon_more:hover,
.icon_more:focus								{ transform:rotate(90deg); background:var(--color-point); border-color:var(--color-point) }
.icon_more:hover::before,
.icon_more:focus::before					{ filter:invert(1); }


/************************************************************
					메인 : 상단
************************************************************/

/* 1. 메인 초기 상태 (body.main) */
body.main .header 									{ background: rgba(0,0,0,0.5) !important; }
body.main .header .h_logo .ci 					{ background: url("/resource/farm/images/common/img_logo_w.png") no-repeat 50% 50% / contain;}
body.main .header .h_logo .txt 					{ color: var(--color-white) !important;}
body.main .header .gnb>li>a 						{ color:var(--color-white); }
body.main .header .h_icon [data-util]>a::before,
body.main .header .h_icon .icon_search::before,
body.main .header .h_icon .sitemap_open 		{ filter: brightness(0) invert(1) !important;}

/* 1차 메뉴 hover 상태 (active 아닐 때) */
body.main .header:not(.active):has(.gnb > li:hover) 								{ background: var(--color-white) !important;}
body.main .header:not(.active):has(.gnb > li:hover) .h_logo .ci 				{ background: url("/resource/farm/images/common/img_logo.png") no-repeat 50% 50% / contain;}
body.main .header:not(.active):has(.gnb > li:hover) .h_logo .txt 				{ color: var(--color-black) !important;}
body.main .header:not(.active):has(.gnb > li:hover) .gnb > li > a 			{ color: var(--color-black) !important;}
body.main .header:not(.active):has(.gnb > li:hover) .depth2 					{ background: var(--color-white) !important;}
body.main .header:not(.active):has(.gnb > li:hover) .depth2 a 					{ color: var(--color-black) !important;}
body.main .header:not(.active):has(.gnb > li:hover) .h_icon [data-util]>a::before,
body.main .header:not(.active):has(.gnb > li:hover) .h_icon .icon_search::before,
body.main .header:not(.active):has(.gnb > li:hover) .h_icon .sitemap_open 		{ filter: none !important;}

/* 스크롤 active 상태 (.header.active) */
body.main .header.active 															{ background: var(--color-white) !important;}
body.main .header.active .h_logo .ci 											{ background: url("/resource/farm/images/common/img_logo.png") no-repeat 50% 50% / contain;}
body.main .header.active .h_logo .txt 											{ color: var(--color-black) !important;}
body.main .header.active nav > ul > li > a 									{ color: var(--color-black) !important;}
body.main .header.active .h_icon [data-util]>a::before,
body.main .header.active .h_icon .icon_search::before,
body.main .header.active .h_icon .sitemap_open 								{ filter: none !important;}
body.main .header.active .h_icon .search_wrap .searchForm .icon_search::before 	{ filter: brightness(0) invert(1) !important;}


/************************************************************
					비주얼
************************************************************/

[data-main-visual] .visual               										{ position:relative;}
[data-main-visual] .visual .img													{ position:relative; width: 100%; height:100svh; top:0; left: 0;  overflow:hidden;}
[data-main-visual] .visual .img img												{ position:absolute; top:50%; left:50%; min-width:100%; min-height:100%; transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); 
																							-webkit-transform:translate(-50%,-50%); -moz-transform: translate(-50%,-50%); object-fit:cover; -o-object-fit:cover;  z-index: 0}

[data-main-visual] .visual_inner   												{ position: absolute; top: 50%; left: 50%; width: 94%; max-width: 1700px; transform: translate(-50%, -50%); z-index: 10;}
[data-main-visual] .visual_btn  													{ position:absolute; top:50%; right:0; transform: translateY(-50%); }
[data-main-visual] .visual_btn a  												{ width:100%; height:100%;  padding:25px; min-width:325px; min-height:180px; display:inline-block; background:#3f3ecf; border-radius:15px 15px 15px 40px;}
[data-main-visual] .visual_btn a:before  										{ content:''; position:absolute; bottom:0; right:0; background: url("/resource/farm/images/main/visual_btn.png") no-repeat right bottom; width:100%; height:100%; z-index:0}


[data-main-visual] .visual .text                    						{ position: absolute; left: 50%; top: 45%; transform: translate(-50%,-45%); color: var(--color-white); z-index: 2; }
[data-main-visual] .visual .text .title  										{ display: inline-block; max-width: 100%; min-width: 260px;}
[data-main-visual] .visual .text .title span  								{  font-size:clamp(14px, 1.2vw, 22px); margin-bottom:1em; display:block;}
[data-main-visual] .visual .text .title img  								{ height:auto; display:block; width: clamp(260px, 20vw, 373px);}
[data-main-visual] .visual .text .title strong     						{ font-size: clamp(1.875em, 4vw, 5em); font-family: var(--font-TTT); font-weight: normal; line-height:1.1; text-shadow: 2px 2px 4px rgba(0,0,0,0.7);}
[data-main-visual] .visual .text .title strong em.color1  				{ color:#ffd154; }
[data-main-visual] .visual .text .title strong em.color2  				{ color:#ffb554; }

[data-main-visual] .swiper_control .page										{ display:flex; position:absolute; left: 50%; transform:translate(-50%, -35%); bottom:35%; z-index:3; gap:0 1em; align-items:center}

[data-main-visual] .swiper_control button 									{ filter:invert(1); }
[data-main-visual] .swiper_control .swiper_page								{ display:flex; width:auto;align-items:center; justify-content:center; line-height:1; color:var(--color-white); font-size:1.563em; font-family: var(--font-pretendard); font-weight:300;}
[data-main-visual] .swiper_control .swiper_page .swiper-pagination-total		{ opacity:1;}
[data-main-visual] .swiper_control .swiper_page i::after					{ display:inline-block; vertical-align:middle; width:18px; height:1px; background:var(--color-white); content:''; margin-top:0; transform: rotate(-70deg); transform-origin: center;}

[data-main-visual] .swiper_auto 													{ background:none; width:35px; height:35px; border-radius:30px; border:1px solid var(--color-black); position: relative; margin-left:70px}
[data-main-visual] .swiper_auto:after  										{ content:''; position:absolute; top:50%; left:-70px; width:55px; height:1px; background: var(--color-black); transform: translateY(-50%);}

/* 날씨 */
.weather_wrap 												{ position:absolute; top:20%; left:50%; transform:translateX(-50%); z-index:3; }
.weather_wrap .weather 									{ display:inline-flex; align-items:center; background:var(--color-white); backdrop-filter:blur(5px); padding:10px 50px 10px 30px; border-radius:50px; border:3px solid #013a91; gap: 10px}
.weather .icon												{ display:inline-block; text-indent:-9999em; font-size:0; }
.weather .icon::before									{ content:''; display:block; background-position:50% 50%; background-repeat:no-repeat; background-size:contain; width:43px; height:43px;}
.weather .icon1::before									{ background-image:url(/resource/farm/images/weather/weather_sun.svg);  }
.weather .icon2::before									{ background-image:url(/resource/farm/images/weather/weather_suncloud.svg);  }
.weather .icon3::before									{ background-image:url(/resource/farm/images/weather/weather_cloud.svg);  }
.weather .icon4::before									{ background-image:url(/resource/farm/images/weather/weather_rain.svg); }
.weather .icon5::before									{ background-image:url(/resource/farm/images/weather/weather_snow.svg); }

.weather_info 												{ flex-shrink: 0; flex-grow: 0 }
.weather_info .date 									{line-height:1.2;}
.weather_info .date span 								{ font-size:1.563em; font-weight:bold; margin-left:10px; color:#013a91; }
.weather_info .date strong 							{ font-weight:600 }
.weather_info .air strong 								{ color:#013a91; font-weight:700}
.weather_btn 												{ position:absolute; bottom:0px; right:-10px; border-radius:50%; background:#013a91; width:40px; height:40px; border-radius:50%; }
.weather_btn:before 										{ content:''; background: url("/resource/farm/images/main/quick_more.svg") no-repeat center; background-size: 18px; width:100%;height:100%; display:inline-block;}
.weather_btn:hover,
.weather_btn:focus 										{ background:var(--color-point); }

/* 바로가기 배너 */
.quick_menu 												{ position:absolute; bottom:10%; left:50%; transform:translate(-50%, -10%);  z-index: 3;}
.quick_list 												{ display:flex; justify-content:center; align-items:center; gap:40px;}
.quick_list li a 											{ width:180px; height:180px; background:#f5f4f2; border-radius:10px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; transition:all .3s; font-size:1.125em; font-weight:500; position: relative;}
.quick_list li a:hover,
.quick_list li a:focus 									{ color:var(--color-point); font-size:1.25em; font-weight:700; border-radius: 90px 90px 35px 35px; border:3px solid var(--color-point); text-decoration: underline;  text-underline-offset: 4px;}
.quick_list .icon img 									{ width:90px; height:60px; margin-bottom:15px;}
.quick_list li a::after 								{ content:""; position:absolute; top:10px; right:10px; width:40px; height:40px; border-radius:50%; background:var(--color-point); display:flex; align-items:center; justify-content:center;	opacity:0;	transform:translateY(-10px); transition:all .35s ease; background-image: url("/resource/farm/images/main/quick_more.svg"); background-repeat: no-repeat; background-position: center; background-size: 18px; }
.quick_list li a:hover::after,
.quick_list li a:focus::after 						{ opacity:1; transform:translateY(0);}

@media (max-width:1500px) {
	/*[data-main-visual] .visual .img 					{ height: 80vh;}*/
	.weather_wrap 											{ top: 18%;}
	.quick_menu 											{ bottom: 8%; transform: translate(-50%, -8%);}
	.quick_list li a 										{ width:150px; height:150px;}
	.quick_list .icon img 								{ width:70px; height:50px;}
}

@media (max-width:1024px) {
	/*[data-main-visual] .visual .img 					{ height: 65vh;}*/
	[data-main-visual] .visual .text 				{ text-align: center; width: 100%;}
	[data-main-visual] .visual .text .title strong { font-size: clamp(1.5em, 5vw, 3.2em);}
	[data-main-visual] .swiper_control .page 		{ justify-content:center; bottom:30%}
	.weather_wrap .weather 								{ padding: 8px 30px 8px 20px;}
	.quick_menu 											{ bottom:2% }
	.quick_list 											{ gap: 25px; display:flex;}
	.quick_list li 										{ flex:1 }
	.quick_list li a 										{ display:block; width:100%; height:auto; font-size:1em; padding:1em;}
	.quick_list .icon img 								{ width:55px; height:40px;}
}

@media (max-width:768px) {
	/*[data-main-visual] .visual .img { height: 55vh;}*/
	[data-main-visual] .visual .text .title span { font-size:invert;}
	[data-main-visual] .visual .text .title strong 	{ font-size: 2em;}
	[data-main-visual] .swiper_control .swiper_page { font-size:inherit; }
	[data-main-visual] .swiper_auto 					{ width:30px; height:30px; }
	.weather_wrap .weather 								{ border-width: 2px;}
	.weather_info .date span 							{ font-size:1.2em;}
	.quick_menu 											{ bottom: 4%;}
	.quick_list 											{ gap:18px;}
	.quick_list li a 										{ font-size:inherit;}
	.quick_list li a:hover, 
	.quick_list li a:focus 								{ border-radius:10px; border:0;  font-size:inherit; background:var(--color-point); color:var(--color-white);}
	.quick_list li a::after								{ display:none; }
}

@media (max-width:480px) {
	.quick_list 											{ display:flex; flex-wrap: wrap; gap: 5px}
	.quick_list li 										{ flex: 1 1 calc(50% - 10px);}
	.quick_list li a 										{ width: 100%; display:flex; flex-direction: row; align-items:center;}
	.quick_list .icon img 								{ display:none;}
}


/**********************************************************************
 					순창군 교육일정안내
**********************************************************************/

[data-main-con="education"] { margin-bottom:6.25em; position: relative; padding-top: 10em;}
[data-main-con="education"]:before { content:'training schedule'; position:absolute; top:0; left:0; font-size: 7.5vw; text-transform: uppercase; font-weight:900; opacity:.05; line-height:1; pointer-events: none;  white-space: nowrap;} 
[data-main-con="education"] .title_wrap {  margin-top: 0; position: relative; padding-left:150px; padding-bottom:30px;}
[data-main-con="education"] .title_wrap:before { content:''; position:absolute; bottom:0; left:0; background:url("/resource/farm/images/main/education_tit.svg") no-repeat; background-size:contain; width:150px; height:160px; }
[data-main-con="education"] .title_wrap h2.title { margin:0;  }
[data-main-con="education"] .title_wrap span{ font-size:1.125em;}

/* 더보기 */
[data-main-con="education"] .icon_more  { position:absolute; top: 11em; right:0; width:40px; height:40px; background:var(--color-point2); box-sizing: content-box; box-shadow: 0 0 0 10px rgba(71, 103, 180, 0.2); border:none;}
[data-main-con="education"] .icon_more::before { position:absolute; width:100%; height:100%; left:0; top:0; content:''; background:url(/resource/farm/images/main/education_more.svg) no-repeat 50% 50% / 13px; transition:var(--trans-ani);}

[data-main-con="education"] .icon_more:hover,
[data-main-con="education"] .icon_more:focus   				{ border:0; }

[data-main-con="education"] .icon_more:hover::before,
[data-main-con="education"] .icon_more:focus::before		{ filter:invert(0); }


/* 캘린더 영역 */
.edu_calendar    										{ display: flex; align-items: center; width: 100%; background: #f5f4f2; border-radius: 18px; padding:0 1.875em; box-sizing: border-box; margin-bottom:1em;}
.edu_calendar .year_month    						{ width: 120px; min-width: 70px; flex-shrink: 0; text-align: center; font-family: var(--font-pretendard); line-height: 1; font-weight: bold}
.edu_calendar .year_month .year   	 			{ color:#3e3c35; font-size:1.25em; display:block;}
.edu_calendar .year_month .month   	 			{ color:var(--color-black); font-size:3.125em;}

.day_item    											{ display:flex; flex-direction:column; align-items:center; justify-content:center; position: relative; margin:0 20px;}
.day_item .day_num    								{ font-size:1.25rem; font-weight:700; margin:0.25em 0; }
.day_item .dot   										{ width:15px; height:15px; background:#ccc; border-radius:50%; }
.day_item .dot.on    								{ background:var(--color-point2); }
.today_badge, .nextmonth_badge 					{ position:absolute; top:-15px; right:-15px; border-radius:5px; color:var(--color-white); width:40px; height:25px; line-height:25px; font-size:12px;font-weight:500; text-align:center; }
.today_badge:after 									{ position:absolute;bottom:-7px;left:14px;content:"";display:block;width:0;border-style:solid;border-width:4px;border-color:var(--color-red) transparent transparent var(--color-red)}
.nextmonth_badge:after 								{ position:absolute;bottom:-7px;left:14px;content:"";display:block;width:0;border-style:solid;border-width:4px;border-color:var(--color-point2) transparent transparent var(--color-point2)}


.today_badge    										{ background:var(--color-red); }
.nextmonth_badge    									{ background:var(--color-point2); }

.calendarSwiper .swiper-wrapper  				{ display: flex; box-sizing: content-box; align-items:center; min-height:150px;}
.calendarSwiper .swiper-slide  					{ flex-shrink: 0; box-sizing: border-box;}
.calendarSwiper .swiper-slide a  				{ padding:0.5em 0; }
.calendarSwiper .swiper-slide a:hover,
.calendarSwiper .swiper-slide a:focus  		{ background:var(--color-white); border:1px solid var(--color-line); border-radius:20px; }

.edu_calendar .today  								{ background:var(--color-white); border-radius:20px; border:1px solid var(--color-line);}
.edu_calendar .active 								{ background:#eff4ff; border-radius:20px; border:1px solid var(--color-point2); }

.calendarSwiper .swiper_prev,
.calendarSwiper .swiper_next  					{ position:absolute; top:50%; transform:translateY(-50%); width:32px; height:32px; border-radius:50%; background:var(--color-white); z-index:3; }
.calendarSwiper .swiper_prev   					{ left:0px; }
.calendarSwiper .swiper_next   					{ right:0px; }
.calendarSwiper button 								{ transition: var(--trans-ani); }
.calendarSwiper button:hover,
.calendarSwiper button:focus  					{ background:var(--color-point2); }

.calendarSwiper button:hover:before  			{ filter:invert(1); }


/* 교육 일정 리스트 */
.edu_list_wrap   										{ position:relative; padding:0;}
.edu_list_wrap .swiper,
.edu_list_wrap .swiper-slide						{ flex-shrink: 0; box-sizing: border-box;}
.edu_list_wrap .swiper-slide a					{ display:flex; flex-flow:wrap; width:100%; padding:1.563em; border:1px solid #c9c9c9; border-radius:25px; transition:var(--trans-ani);flex-direction:column; min-width: 0; gap: 10px;}
.edu_list_wrap .swiper-slide a:hover,
.edu_list_wrap .swiper-slide a:focus  			{ border:1px solid var(--color-point2); }
.edu_list_wrap .swiper-slide a:hover .title,
.edu_list_wrap .swiper-slide a:focus .title 	{ color:var(--color-point2); text-decoration: underline;  text-underline-offset: 4px;}
.edu_item .title										{ font-size:1.375em; font-weight:700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; width:100%}
.edu_item .place										{ font-size:1.125em; color:var(--color-base2); }
.edu_item .date										{ position: relative; padding-left:25px; font-size:0.875em; color:var(--color-base2);}
.edu_item .date::before								{ position:absolute; width:15px; height:15px; left:0; top:50%; background:url(/resource/farm/images/common/icon_clock.svg) no-repeat 50% 50% / auto; content:''; transform:translateY(-50%);}

.edu_list_wrap .list_control  button  			{ display: flex; align-items: center; justify-content: center; width: 50px; height: 50px; border-radius: 100%; background: rgba(0, 0, 0, .4); transition: var(--trans-ani); }
.edu_list_wrap .list_control  button:before  { filter: invert(1); }
.edu_list_wrap .list_control .swiper_prev  	{ position:absolute; top:50%; left:-25px; transform: translateY(-50%); z-index: 3}
.edu_list_wrap .list_control .swiper_next  	{ position:absolute; top:50%; right:-25px; transform: translateY(-50%); z-index: 3}
.edu_list_wrap .list_control  button:hover,
.edu_list_wrap .list_control  button:focus  				{ background: var(--color-point2); border:1px solid var(--color-point);}

.edu_list_wrap .list_control  button:hover::before,
.edu_list_wrap .list_control  button:focus::before{  transition: filter 0.3s ease;}
.edu_list_wrap .no-event-message							{ margin-right:0 !important; width:100% !important; text-align:center }
.edu_list_wrap .no-event-message .edu_item .title			{ font-size:1.067rem; }


@media (max-width: 1500px) {
	[data-main-con="education"]  					{ padding-top:8em }
	[data-main-con="education"] .icon_more   	{ top:9em; }
}

@media (max-width: 1280px) {
	.edu_list_wrap .list_control button  		{ width:20px;background:var(--color-point2); border-radius:0 }
	.edu_list_wrap .list_control .swiper_prev { left:0; border-radius: 0 5px 5px 0;}
	.edu_list_wrap .list_control .swiper_next { right:0; border-radius:5px 0 0 5px }
	.edu_list_wrap .swiper-slide a  				{ padding:1.563em 2em; }

}

@media (max-width: 768px) {
	[data-main-con="education"]  					{ padding-top:3em; margin-bottom:3em; }
	[data-main-con="education"] .icon_more   	{ top:3em; width:35px; height:35px; box-shadow:none;}
	[data-main-con="education"]:before,
	[data-main-con="education"] .title_wrap:before 		{ display:none; }
	[data-main-con="education"] .title_wrap  				{ padding-left:0; padding-bottom:10px}
	.edu_calendar .year_month  					{ width:auto; margin-right:20px }
	.edu_calendar .year_month .month  			{ font-size:2.188em; }
	.edu_list_wrap .swiper-slide   				{ width:50% }
	.edu_list_wrap .no-event-message .edu_item .title		{ font-size:.95rem; }
}


@media (max-width: 468px) {
	[data-main-con="education"] .title_wrap p { display:none; }
	[data-main-con="education"] .icon_more  	{ top:2.5em; }
}
@media (max-width:368px) {
	.edu_calendar								{ flex-wrap:wrap; position:relative }
	.edu_calendar .year_month					{ width:100%; margin-right:0; margin-top:20px; }
	.edu_calendar .swiper_prev, 
	.edu_calendar .swiper_next					{ position:absolute; top:35px; }
	.edu_calendar .swiper_prev					{ left:1em; }
	.edu_calendar .swiper_next					{ right:1em; }
	.edu_calendar .calendarSwiper 				{ width:100%; }
	.day_item									{ margin:0 5px; }
	.calendarSwiper .swiper-slide a:hover, 
	.calendarSwiper .swiper-slide a:focus,
	.edu_calendar .active						{ border-radius:15px; }
	.day_item .day_num							{ font-size:1.167rem; }
	.day_item .dot								{ width:10px; height:10px; }
	.calendarSwiper .swiper-wrapper				{ min-height:130px; }
	.today_badge, 
	.nextmonth_badge							{ right:-5px; }
			
}

/**********************************************************************
 					농업기술센터 소식 & POPUPZONE
**********************************************************************/

[data-main-con="notice"]												{ position:relative;display:flex;justify-content: space-between;--sizePop:540px;flex-wrap:wrap; margin-bottom:6.25em; align-items:stretch;}
[data-main-con="notice"] h2.title										{ margin-bottom:.5em; }

/*농업기술센터 소식*/
[data-main-con="notice"] .news											{ width:calc(100% - 4em - var(--sizePop)); position: relative; display:flex; flex-flow:column}
[data-main-con="notice"] .notice										{ height:100%; }
[data-main-con="notice"] .news .swiper									{ width:100%; height:100% }
[data-main-con="notice"] .news .swiper-wrapper							{ align-items:stretch;}
[data-main-con="notice"] .news .swiper-slide							{ display:flex; height:auto }
[data-main-con="notice"] .news .swiper-slide a							{ display:flex; flex-flow:wrap; width:100%; padding:1.875em 1.563em 1.563em 1.875em; border:1px solid #c9c9c9; border-radius:25px; transition:var(--trans-ani);}
[data-main-con="notice"] .news .tit  									{ color:#3e3c35; background:#f5f4f2; padding:0 1.625em; display:flex; border-radius: 50px; font-weight:700; height:30px; justify-content: center; align-items: center; margin-bottom:1.875em;}

[data-main-con="notice"] .news dl										{ display:flex; flex-flow:column; gap:1.625em; height:12em;}
[data-main-con="notice"] .news dl>dt									{ font-size:1.38em; font-weight:600; line-height:1.2; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; word-break:break-all; }
[data-main-con="notice"] .news dl>dd									{ font-size:1.06em; line-height:1.3; opacity:.74; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;  word-break:break-all;}
[data-main-con="notice"] .news .date									{ position:absolute; left:1.875em; bottom:2.5em; opacity:.54; padding-left:25px; height:15px; display:flex; align-items:center; line-height:1  }
[data-main-con="notice"] .news .date::before							{ position:absolute; width:15px; height:15px; left:0; top:0; background:url(/resource/farm/images/common/icon_clock.svg) no-repeat 50% 50% / auto; content:''; }

[data-main-con="notice"] .news .swiper_control  						{ position:absolute; right:0; top:-4px; background:rgba(62,60,53,.9);border-radius:30px; height:50px; padding:0 12px 0 1.875em; display:flex; align-items: center; justify-items: center}
[data-main-con="notice"] .news .swiper_control:before  					{ content:'';  }

[data-main-con="notice"] .swiper_prev::before,
[data-main-con="notice"] .swiper_next::before,
[data-main-con="notice"] .swiper_auto.paused::before,
[data-main-con="notice"] .swiper_auto::before 						{ filter:invert(1); }
[data-main-con="notice"] .news .icon_more							{ margin-left:10px; }

/* hover,focus */
[data-main-con="notice"] .news .swiper-slide a:hover,
[data-main-con="notice"] .news .swiper-slide a:focus  			{ border-color:var(--color-point); }

[data-main-con="notice"] .news .swiper-slide a:hover dl > dt,
[data-main-con="notice"] .news .swiper-slide a:focus dl > dt 	{ text-decoration: underline;}

[data-main-con="notice"] .news .swiper-slide a:hover .tit,
[data-main-con="notice"] .news .swiper-slide a:focus .tit 		{ background: var(--color-point); color: var(--color-white);}

/*POPUPZONE*/
[data-main-con="notice"] .popup	                              { position:relative;flex:none; width:var(--sizePop);} 
[data-main-con="notice"] .popup::before 								{ content: ""; position: absolute; top: 70px; left: 30px;  width: 100%; height: calc(100% - 70px);  background-color: var(--color-point); background-image: url("/resource/farm/images/main/popup_bg.png"); background-repeat: no-repeat; background-position: center; background-size: cover; z-index: -1; border-radius: 1.25em;}
[data-main-con="notice"] .popup .title									{ display:flex; justify-content: space-between;align-items:center; height:70px; padding-left:3.75em; color:var(--color-white); font-family: var(--font-TTWanju);}

[data-main-con="notice"] .popup .swiper								{ border-radius:1.25em;overflow:hidden;}
[data-main-con="notice"] .popup	.swiper-slide                   				{ width:100%; }
[data-main-con="notice"] .popup	.swiper-slide a                 				{ display:block; position:relative; }
[data-main-con="notice"] .popup	.swiper-slide a .img            			 	{ position:relative; width:100%;overflow:hidden; display:block; height:0; padding-top: 57.6%; }
[data-main-con="notice"] .popup	.swiper-slide a .img img        			 	{ position:absolute; top:50%; left:50%; min-width:100%; min-height:100%; transform:translate(-50%, -50%); -ms-transform:translate(-50%,-50%); -webkit-transform:translate(-50%, -50%);
    																								-moz-transform:translate(-50%,-50%); object-fit:cover; -o-object-fit:cover; }
[data-main-con="notice"] .popup	.swiper-slide > a span[data-alt] 			{ opacity:0; overflow:hidden; display:block; position:absolute; top:50%; left:50%; z-index:2; width:95%; height:95%; 
    																								outline:1px solid var(--color-white); text-indent:100%; white-space:nowrap; transform:translate(-50%, -50%);}
[data-main-con="notice"] .popup	.swiper-slide > a:focus span[data-alt]  	{ opacity:1;}
[data-main-con="notice"] .popup	.swiper_control                           {display:flex; justify-content:space-between; }

[data-main-con="notice"] .popup	.control                                  { display:flex; }
[data-main-con="notice"] .popup	.control .btn_slide_allView					{ display:block; width:24px; height:24px; background:url(/resource/farm/images/main/icon_allview.svg) no-repeat 50% / auto 14px; }

/* 배너모두보기 */
[data-main-con="notice"] .popup	.area_ban_all																{ opacity:0;visibility:hidden;position:fixed;top:0px;left:0px;z-index:90;width:100%;height:100%;background: rgba(0,0,0,0.6);transition:0.5s ease 0s;transition-property:opacity, visibility;}
[data-main-con="notice"] .popup	.area_ban_all.active														{ opacity:1; visibility:visible; }
[data-main-con="notice"] .popup	.area_ban_all .inr														{ position:absolute;top:50%;left:50%;width:94%;background: var(--color-white);max-width:1500px;max-height:80%;box-sizing:border-box;padding: 0;border-radius: 2.5em;transform:translate(-50%, calc(-50% - 0.5px));}
[data-main-con="notice"] .popup	.area_ban_all .title														{ position:relative; flex-flow: column;justify-content: center;align-items: center;background: #ebf1fb;padding:1.563em;margin-bottom: 0;border-radius: 2.5em 2.5em 0 0;overflow:hidden; height:auto;}
[data-main-con="notice"] .popup	.area_ban_all .title h2  												{ color:var(--color-black); font-size:1.875em; font-weight:normal;}
[data-main-con="notice"] .popup	.area_ban_all .title::before											{ content:'';display:block;width:20em;height:20em;background:var(--color-pink);position:absolute;top:-11em;right:-4em;opacity:.03;border-radius:100%;}
[data-main-con="notice"] .popup	.area_ban_all .title::after											{ content:'';display:block;width: 12em;height: 12em;border: 3.25em solid var(--color-point);position:absolute;bottom: -13em;left: 1em;opacity:.03;border-radius:100%;box-sizing: content-box;}
[data-main-con="notice"] .popup	.area_ban_all .title .text												{ color: var(--color-base1); font-size: 1.375em;font-weight:500;text-align:center;}
[data-main-con="notice"] .popup	.area_ban_all .title .text strong									{ font-weight:700;}
[data-main-con="notice"] .popup	.area_ban_all .box														{ padding:2.875em;}
[data-main-con="notice"] .popup	.area_ban_all .list_all													{ display:flex;flex-wrap:wrap;gap:10px;margin:0 auto;padding-right:15px;max-height: calc(100vh - 26.25em);overflow-y:auto;}
[data-main-con="notice"] .popup	.area_ban_all .list_all::-webkit-scrollbar 						{ -webkit-appearance:none; width:6px;}
[data-main-con="notice"] .popup	.area_ban_all .list_all::-webkit-scrollbar-thumb 				{ background-color:var(--color-point); border-radius:5px;  }
[data-main-con="notice"] .popup	.area_ban_all .list_all::-webkit-scrollbar-track 				{ border-radius:5px; background-color:#e2e2e2; }
[data-main-con="notice"] .popup	.area_ban_all .list_all > li											{ flex:0 1 calc((100% - 20px) / 3); }
[data-main-con="notice"] .popup	.area_ban_all .list_all > li a										{ position:relative; display:block; text-align:center; }
[data-main-con="notice"] .popup	.area_ban_all .list_all .img											{ position:relative; width:100%; overflow:hidden; display:block; height:0; padding-top: 57.6%; }
[data-main-con="notice"] .popup	.area_ban_all .list_all .img img										{ position:absolute; top:50%; left:50%; min-width:100%; min-height:100%; transform:translate(-50%, -50%); -ms-transform:translate(-50%,-50%);
    																														-webkit-transform:translate(-50%, -50%); -moz-transform:translate(-50%,-50%); object-fit:cover; -o-object-fit:cover; }
[data-main-con="notice"] .popup	.area_ban_all .list_all span[data-alt]								{ opacity:0; overflow:hidden; position:absolute; text-indent:-9999em; }
[data-main-con="notice"] .popup	.area_ban_all .btn_slide_allView										{ opacity:1;position:absolute;top: -30px;right: 30px;min-width:inherit;width:60px;height:60px;padding:0px;background-color:var(--color-point);border:0px;border-radius:100%;transition:var(--trans-ani);}
[data-main-con="notice"] .popup	.area_ban_all .btn_slide_allView:hover,
[data-main-con="notice"] .popup	.area_ban_all .btn_slide_allView:focus								{ background:var(--color-point2);}
[data-main-con="notice"] .popup	.area_ban_all .btn_slide_allView::before							{ position:absolute; width:2px; height:20px; left:50%; top:50%; transform:translate(-50%,-50%) rotate(45deg); content:''; background:var(--color-white);}
[data-main-con="notice"] .popup	.area_ban_all .btn_slide_allView::after                  	{ position:absolute; width:2px; height:20px; left:50%; top:50%; transform:translate(-50%,-50%) rotate(-45deg); content:''; background:var(--color-white);}

@media all and (max-width:1440px){
	[data-main-con="notice"] .news .swiper-slide 		{ width:50% }
}
@media all and (max-width:1268px){
	[data-main-con="notice"]  									{ gap: 20px; }
	[data-main-con="notice"] .news							{ width:100%; }
	[data-main-con="notice"] .news dl  						{ height:10em; }
	[data-main-con="notice"] .news dl>dt  					{ -webkit-line-clamp:1; }
	[data-main-con="notice"] .news .swiper-slide a  	{ flex-direction:column; align-items:flex-start}
	[data-main-con="notice"] .popup							{ width:100%; padding:0 1.5em }
	[data-main-con="notice"] .popup:before  				{ left:0 }
	[data-main-con="notice"] .popup .title  				{ padding:0 }
	[data-main-con="notice"] .popup .swiper																	{ width:calc(100% + 1em); margin-left:-.5em; margin-right:-.5em;border:none;border-radius:0; }
	[data-main-con="notice"] .popup .swiper-slide															{ width:50%;}
	[data-main-con="notice"] .popup .swiper-slide > a 														{ margin-right:.5em;margin-left:.5em;width:calc(100% - 1em);border:1px solid #e5e5e5;border-radius:1.25em;overflow:hidden;}
	[data-main-con="notice"] .popup .area_ban_all .title::before										{ width: 18em; height: 18em;top: -10em;right: -2em;}
	[data-main-con="notice"] .popup .area_ban_all .title::after											{ width: 10em;height: 10em;  bottom: -12em;left: 0;}
	
	[data-main-con="notice"] .news .swiper_control								{ height:40px; padding-right:7px; }
	[data-main-con="notice"] .news .swiper_control .icon_more					{ width:30px; height:30px; }
}

@media all and (max-width:1024px){
	[data-main-con="notice"] .news .swiper_control   	{ height:40px; top:-7px; }
	[data-main-con="notice"] .news .swiper-slide a  	{ align-items:flex-start; }
	[data-main-con="notice"] .popup .title  				{ height:50px; }
}
@media all and (max-width:868px){
	[data-main-con="notice"] .popup .area_ban_all .title,
	[data-main-con="notice"] .popup .area_ban_all .box										{ padding: 2.375em;}
	[data-main-con="notice"] .popup .area_ban_all .list_all								{ padding-right:10px;max-height: calc(100vh - 29em);}
	[data-main-con="notice"] .popup .area_ban_all .list_all > li						{ flex: 0 1 calc((100% - 20px) / 2);}
	[data-main-con="notice"] .popup .area_ban_all .btn_slide_allView					{ width:50px;height:50px;top: -25px;right: 25px;}
	[data-main-con="notice"] .popup .area_ban_all .inr										{ border-radius:2em;}
	[data-main-con="notice"] .popup .area_ban_all .title									{ border-radius:2em 2em 0 0;}
	[data-main-con="notice"] .popup .area_ban_all .title::before						{ width:17em;height:17em;top:-10em;right:-3em;}
	[data-main-con="notice"] .popup .area_ban_all .title::after							{ width:10em;height:10em;}
}

@media all and (max-width:768px){
	[data-main-con="notice"]  																		{ margin-bottom:3em; }
	[data-main-con="notice"] .popup .swiper													{ width:100%; margin-left:0; margin-right:0;border-radius: 1em; }
	[data-main-con="notice"] .popup .swiper-slide											{ width:100%;}
	[data-main-con="notice"] .popup .swiper-slide > a 										{ margin-right:0;margin-left:0;width:100%;border:none;border-radius:0;}
	[data-main-con="notice"] .popup .area_ban_all .title,
	[data-main-con="notice"] .popup .area_ban_all .box										{ padding: 2em;}
}


@media all and (max-width:668px){
	[data-main-con="notice"] .popup .area_ban_all .title									{ padding:3em 2em 2em 2em;gap:.5em;}
	[data-main-con="notice"] .popup .area_ban_all .title::before						{ width: 16em; height: 16em;}
	[data-main-con="notice"] .popup .area_ban_all .title::after							{ width: 9em;height: 9em;bottom: -10em;border-width: 2.5em;}
	[data-main-con="notice"] .popup .area_ban_all .title .h2_title						{ font-size:1.5em; text-align:center; line-height:1.2}
	[data-main-con="notice"] .popup .area_ban_all .title .text							{ font-size:1.125em; text-align:center; line-height:1.2}
	[data-main-con="notice"] .popup .area_ban_all .btn_slide_allView					{ transform: translateX(50%);right: 50%;}
	[data-main-con="notice"] .popup .area_ban_all .list_all > li						{ flex:0 1 100%;}
}

@media all and (max-width:568px){
	[data-main-con="notice"] .news  																{ padding-bottom:4em; }
	[data-main-con="notice"] .news .swiper-slide a  										{ padding:1.5em; }
	[data-main-con="notice"] .news .date  														{ left:1.5em; }
	[data-main-con="notice"] .news .tit  														{ margin-bottom:1em; }
	[data-main-con="notice"] .news dl  															{ gap:1em; height:9em;}
	[data-main-con="notice"] .news .swiper-slide  											{ width:100%; }
	[data-main-con="notice"] .news .swiper_control  										{ top:inherit; bottom:0; right:inherit; left:50%; transform:translateX(-50%); }
	[data-main-con="notice"] .popup .title  													{ flex-direction:column; height:auto; padding:.75em 0}
}
@media all and (max-width:368px){
	[data-main-con="notice"] .popup							{ padding:0 10px }
}
