.main_box_title{font-size:22px; font-weight: 700; color:#666; padding: 5px; margin: 10px 16px}
.main_box_title span{font-weight: 800; color:#333}
.main_box_title a.more{font-weight: 400; font-size: 14px; display: inline-block; margin: 0; padding: 3px 11px 1px; border:1px solid #524b2d; border-radius: 8px; background-color:#524b2d; color:#fff; float:right; line-height: 20px}
.main_box_title a.more:hover{color:#524b2d; background-color: #fff}


.main_top_box{display: flex; flex-wrap: nowrap; gap: 20px;}

.main_view_box{overflow: hidden; border:0px dotted #aaa; margin-top: 50px; padding: 0; width:50%}

ul.favo_btn {list-style:none; margin: 0; padding: 0;  height: 325px; display: flex;flex-wrap: wrap; align-items: center; justify-content: space-between;}
ul.favo_btn  li{list-style:none; display: inline-block; text-align: center; width:20%; margin: 12px }
ul.favo_btn  li a{display: inline-block;padding-top: 0px;background-size: 90px;width: 90%;font-size: 1.0625rem;line-height: 1.3em;background-repeat: no-repeat;}
ul.favo_btn  li a:hover{color:var(--icon-hover-color)}
ul.favo_btn  li a span{margin-top:10px; display: inline-block}

.main_alert_box{overflow: hidden; border:0px dotted #aaa; margin-top: 50px; padding: 0;  width:25%; /*height:335px; */margin-bottom:50px}
.main_alert_box div.main_slide{width:100%; height:325px;margin: 0 auto; position: relative;border: 1px solid #aaa;overflow: hidden;border-radius: 13px;}
.main_alert_box li.slide_li{ width: 100%; height:325px; background-position:center center ; z-index:-100 ;background-repeat: no-repeat; background-size: cover}
.main_alert_box ul{margin: 0; padding: 0}


.main_cardnews_box{overflow: hidden; border:0px dotted #aaa; margin-top: 50px; padding: 0; width:25%; /*height:335px;*/ margin-bottom:50px}
.main_cardnews_box div.main_slide{height: 325px; /*aspect-ratio: 1 / 1;*/ margin: 0 auto; position: relative;border: 1px solid #aaa;overflow: hidden;border-radius: 13px;}
.main_cardnews_box li.slide_li{ width: 100%; height:325px; background-position:center center ; z-index:-100 ;background-repeat: no-repeat; background-size:contain}
.main_cardnews_box ul{margin: 0; padding: 0}


.main_qna_box{overflow: hidden; border:0px dotted #aaa; margin: 0px 0 20px 0; padding: 0; width:max-content; float: right; width:100%; height:225px}
.main_qna_box ul.favo_btn {list-style:none; margin: 0; padding: 0; text-align: center; height: auto}
.main_qna_box ul.favo_btn  li{list-style:none; display: inline-block; text-align: center; width:9%; margin: 0.6%}
.main_qna_box ul.favo_btn  li a{display: inline-block;padding-top: 0px;background-size: 90px;width: 90%;font-size: 19px;line-height: 1.3em;background-repeat: no-repeat; text-wrap: nowrap}
.main_qna_box ul.favo_btn  li a:hover{color:var(--icon-hover-color)}
.main_qna_box ul.favo_btn  li a span{margin-top:20px; display: inline-block; letter-spacing: -1px}

.main_qna_box  lottie-player{filter: sepia(0.75) saturate(0.5); transition: filter 0.3s ease-in-out }
.main_qna_box  lottie-player:hover{filter: sepia(0) saturate(1) ; }

.icon2_box{border-radius: 100px; overflow: hidden; /*background-color:#fff3c8; */background-color: #e0f6c8 ; width:100%; aspect-ratio: 1 / 1; }



.main_noti_box{overflow: hidden; margin: 30px 0 50px 0; padding: 0; width:33%; float: right; border-bottom: 1px solid #aaa; border-radius: 0; background-color: #fff}
.main_noti_box p.tit{padding: 13px 5px 10px 10px; border-top: 1px solid #ccc; margin: 0; background-color: #fff; }
.main_noti_box p.aa{padding: 13px 5px 10px 10px; border-top: 1px solid #ccc; margin: 0; background-color: #fff; }
.main_noti_box p.aa a{display: inline-block; font-size: 19px; white-space: nowrap; width:calc(100% - 50px); text-overflow: ellipsis; overflow: hidden; vertical-align: middle }
.main_noti_box p.aa a span{vertical-align: -3px; font-size:20px; color:var(--icon-hover-color); margin-right:7px}
.main_noti_box p.aa span.day{ color:#999; font-size:17px; vertical-align: middle }

.main_photo_box{overflow: hidden;  margin: 30px 0 50px 0; padding: 0; width:100%; border: 0px solid #aaa; border-radius: 0px; background-color: #fff; height: 305px}
.main_photo_box div.photo_area{text-align: center;background-color:#fff; padding: 0 0 10px 0;}
.main_photo_box div.photo_area div.photo_box{display: inline-block; width: 19%; margin: 0.2%; border:0px solid #aaa; border-radius: 12px; overflow: hidden; }
.main_photo_box div.photo_area div.photo_box div.photos{width: 100%; height: 221px; background-size: cover; cursor: pointer; background-position: center center;border-radius: 12px;}
.main_photo_box div.photo_area div.photo_box a{display: block; white-space: nowrap;	width: max-content; overflow: hidden; text-overflow: ellipsis;margin: 0 auto; color: #333;line-height: 1em; background-color: #fff; border-radius: 0 0 20px 20px; padding:7px 15px; font-size: 16px; opacity:0.75; border:1px solid #fff; border-top-width: 0px;max-width: 100%}
/*
.main_photo_box div.photo_area div.photo_box div.photos span{display: block; white-space: nowrap;	width: max-content; overflow: hidden; text-overflow: ellipsis;margin: 0 auto; color: #333;line-height: 1em; background-color: #fff; border-radius: 0 0 20px 20px; padding:7px 15px; font-size: 16px; opacity:0.75; border:1px solid #fff; border-top-width: 0px;max-width: 92%}
.main_photo_box div.photo_area div.photo_box div.photos:hover span{color: #fff; background-color: #333;  opacity:1}
.main_photo_box div.photo_area div.photo_box div.photos span.date{}
*/


.main_chart_box{overflow: hidden; border:0px dotted #aaa; margin: 30px 0 50px 0; padding: 0; width:64%; float:left}
.main_chart_box .counter-container {display: flex;justify-content: space-around;padding: 14px; text-align: center; border:0px solid #e5b233; border-radius: 12px ; background-color: #fffae7}
.main_chart_box h3.counter, h3.add {font-family: var(--body-font);font-size: 3.7rem;font-weight: 500;color: #524135; margin: 40px auto 88px; display: inline-block}
.main_chart_box .counter-container p{padding: 20px 0; font-size: 25px; text-align: left; color:#835b36}
.main_chart_box .counter-container p span{display: inline-block; color:#777; font-size: 18px}
.main_chart_box .main_box_title{}

/*

.main_chart_box{overflow: hidden; border:0px dotted #aaa; margin: 30px 0 50px 0; padding: 0; width:64%; background-color: #1a87e4; border-radius: 30px; float:right}
.main_chart_box .counter-container {display: flex;justify-content: space-around;padding: 5px; text-align: center;}
.main_chart_box h3.counter, h3.add {font-family: var(--body-font);font-size: 5rem;font-weight: bold;color: #fff304; margin-bottom: 10px; display: inline-block}
.main_chart_box .counter-container p{padding: 20px 0; font-size: 22px}
.main_chart_box .counter-container p span{display: block; color:#fff; font-size: 18px}
.main_chart_box .main_box_title{text-align: center; font-size:36px; color:#fff; margin-top:30px; background-color: #213b52;margin: 0; padding: 30px 0}

*/

/*main banner - 관련사이트 - */
div.main_banner_wrap{background-color: #fffef9; width: 100%; overflow: hidden; border:1px solid #f3f3f3; border-radius: 12px;}
div.main_banner_link{width:98%;margin:0 auto; padding:13px 22px; overflow: hidden; position: relative;}

div.bannerslider{background-color:#fff;  }
li.banner_slider{width: 100%; height:50px; background-position:center center; background-color: #fff; background-size:contain ;z-index:-100 ;background-repeat: no-repeat; border:1px solid #aaa; border-radius: 12px; margin:0 10px; border-right:1px dached #999}
img#slider-next{position: absolute; top: 29px; left: 0px; cursor: pointer;}
img#slider-prev{position: absolute; top: 29px; right:0px; cursor: pointer;}




/* 슬라이드 */
	/* 1. 부모 컨테이너 설정 */
.anim-container {position: relative;width: 100%;height: 310px;overflow: hidden;border-radius: 10px;box-shadow: 0 4px 10px -4px rgba(0,0,0,0.1);background-color: #f0f0f0;}

/* 2. 개별 아이템 기본 상태 (숨김) */
.anim-item {position: absolute;top: 0;left: 0;width: 100%;height: 100%;display: flex;align-items: center;justify-content: center;font-size: 24px;font-weight: bold;color: #333;
		opacity: 0; /* 처음엔 투명하게 */
		transition: all 0.6s ease-in-out; /* 부드러운 애니메이션 속도 */
		/* 좌에서 우로 이동하는 기본 위치 세팅 */
		transform: translateX(-30px); 
}

/* 3. 활성화된 상태 (화면에 보임) */
.anim-item.active {opacity: 1; transform: translateX(0); /* 원래 위치로 */z-index: 1; /* 가장 위로 올림 */}

/* 4. 컨트롤 버튼 영역 스타일  */
.controls {margin-top:-25px;display: block; align-items: center; z-index: 10; position: sticky; text-align: right; padding-right: 20px}

.controls span {
vertical-align: middle;
  padding: 0;
  border: 0px solid #333;
  border-radius: 5px;
  background-color: transparent;
  color: #333;
  cursor: pointer;
  transition: background 0.2s;
  font-size: 24px;
  line-height: 10px;
  display: inline-block;
}

.controls span:hover {
  color: #fff;
}

.controls span.pages{font-size:18px; margin: 0px -3px -2px -8px;}