@charset "utf-8";

/* 구분 -----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) {.YJM_MAIN_02{width: 100%; float: left;   margin-bottom: 100PX; }
}
/**** pc2 ****/
@media all and (max-width:1280px) and (min-width:768px) {
}
/**** 모바일 ****/
@media only all and (max-width:767px) {.YJM_MAIN_02{width: 100%; float: left;   margin-bottom: 100PX; margin-top: 50PX}
}
/**** 모바일2 ****/
@media only all and (max-width:400px) {
}
/* 구분 //end -----------------------------------*/



/* 구분 -----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) {
.YJM_MAIN_02 .contents-container .grid_box{width: 100%; float: left; display: grid; grid-template-columns: 1fr 1fr clamp(300px, calc(9.868vw + 260.526px), 450px);  grid-gap:clamp(10px, calc(2.632vw + -0.526px), 50px)}
.YJM_MAIN_02 .contents-container .grid_box>div{width: 100%; float: left;  padding: 40px;   box-shadow:3px 3px 50px rgba(100,131,184,0.15); border-radius: 30px}
.YJM_MAIN_02 .contents-container .grid_box>div:nth-child(3){width: 100%; float: left;  padding:0px!important;   box-shadow:3px 3px 50px rgba(100,131,184,0.15); border-radius: 30px; overflow: hidden}


}
/**** pc2 ****/
@media all and (max-width:1280px) and (min-width:768px) {
  .YJM_MAIN_02 .contents-container .grid_box {
    grid-template-columns: 1fr 1fr; /* 2열 */
  }
  .YJM_MAIN_02 .contents-container .grid_box > *:first-child {
    grid-column: 1 / -1; /* 첫 번째는 가로 전체 */
  }
}
/**** 모바일 ****/
@media only all and (max-width:767px) {
.YJM_MAIN_02 .contents-container .grid_box{width: 100%; float: left; display: flex;flex-direction: column; grid-gap:clamp(20px, calc(1.316vw + 14.737px), 40px) }
.YJM_MAIN_02 .contents-container .grid_box>div{width: 100%; float: left;  padding:20px;   box-shadow:3px 3px 50px rgba(100,131,184,0.15); border-radius:10px}
.YJM_MAIN_02 .contents-container .grid_box>div:nth-child(3){width: 100%; float: left;  padding:0px!important;   box-shadow:3px 3px 50px rgba(100,131,184,0.15); border-radius: 10px; overflow: hidden}

}
/**** 모바일2 ****/
@media only all and (max-width:400px) {
}
/* 구분 //end -----------------------------------*/

.YJM_MAIN_02 .title-wrap {width: 100%; float: left;
    display: flex; flex-direction: column;grid-gap:5px!important  ; margin-bottom:clamp(10px, calc(1.316vw + 4.737px), 30px)
}




.YJM_MAIN_02  .main_info{width: 100%; float: left;;font-size: var(--main_big_stit_size)
    color: #666; padding-bottom: 0px; font-weight:500
}


.YJM_MAIN_02  .content-title-box  {width: 100%; float: ; position: relative; margin-bottom: 10px}
.YJM_MAIN_02  .content-title-box  .more_btn{position: absolute; right: 0px; 

top:50%;transform: translateY(-50%);; font-size:calc(var(--tx-sm-size) * 0.9);}






.YJM_MAIN_02 .contents-container .grid_box  .bbs_box{width: 100%; float: left; }


.MULTI_NOTICE { position: relative;overflow: hidden;    z-index: 9; }





.MULTI_NOTICE .content-title-box .title-link {
    display: flex;
    justify-content: flex-end;
    align-items: center
}

.MULTI_NOTICE .content-title-box .title-link span {
    color: var(--black);
    margin-right: 0.8rem
}

.MULTI_NOTICE .content-title-box .title-link em {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 4rem;
    height: 4rem;
    background: var(--white);
    border-radius: 1rem;
    border: 1px solid var(--line-color1)
}
/* 구분 -----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) {
	
.MULTI_NOTICE .tabset { width: auto;
    margin: 0rem 0; position: absolute;right:0px;  bottom:20px; z-index: 9
}


}
/**** pc2 ****/
@media all and (max-width:1280px) and (min-width:768px) {
}
/**** 모바일 ****/
@media only all and (max-width:767px) {
	
.MULTI_NOTICE .tabset {  width: auto;
    margin: 0rem 0; position: absolute;right:0px;  bottom:15px; z-index: 9
}


}
/**** 모바일2 ****/
@media only all and (max-width:400px) {
}
/* 구분 //end -----------------------------------*/

.MULTI_NOTICE .tabset-list {
    justify-content: flex-start;
    overflow-x: auto; grid-gap:3px
}

.MULTI_NOTICE .tabset-item {
    flex-shrink: 0
}

.MULTI_NOTICE .tabset-link {
    padding:clamp(14px, 1.042vw, 26px) 5px clamp(14px, 1.042vw, 26px) 10px;
    transition: 0.3s; position: relative
}
.MULTI_NOTICE .tabset-link span{
    color: #999; font-size:calc(var(--tx-sm-size) * 0.84); transition: all 0.5s;-moz-transition: all 0.5s; -webkit-transition: all 0.5s;-o-transition: all 0.5s; font-weight: 500
}


.MULTI_NOTICE .tabset-link.active {
	  padding:clamp(14px, 1.042vw, 26px) clamp(20px, 5.469vw, 40px) clamp(14px, 1.042vw, 26px) 10px;
    transition: 0.3s; position: relative;
    color: #000; font-weight: 700; background-color: transparent!important;
}

.MULTI_NOTICE .tabset-link.first.active {
	  padding:clamp(14px, 1.042vw, 26px) 5px clamp(14px, 1.042vw, 26px) 0px;
    transition: 0.3s; position: relative;
    color: #000; font-weight: 700; background-color: transparent!important;
}

.MULTI_NOTICE .tabset-link .morebtn{
position: absolute; right: 5px;top: 50%;transform: translateY(-50%); background-color: #333; color: #fff; border-radius: 50px; padding: clamp(2px, 0.391vw, 5px) 10px; display: none;font-size: 12px
}

.MULTI_NOTICE .tabset-link.active .morebtn{
position: absolute; right: 5px;  to: 50%;transform: translateY(-50%); background-color: #333; color: #fff; border-radius: 50px; padding: clamp(2px, 0.391vw, 5px) 10px; display: block
}


.MULTI_NOTICE .tabset-link:before {
   content: "";    width: 1px; height:15px; border-radius: 100%; background-color: #666; position: absolute; top: 50%; transform: translateY(-50%); left:0px
}
.MULTI_NOTICE .tabset-item:first-child .tabset-link:before {
  display: none
}


.MULTI_NOTICE .tabset-link.active span{
    color: #000;

}
.MULTI_NOTICE .tabset-link:hover{
  background-color: transparent!important;
}
.MULTI_NOTICE .tabset-link:hover span{
     color: #000; 
}
.MULTI_NOTICE .content-swiper-box {
    position: relative;
    display: none
}







/*달력 영역*/

.calendar-wrapper { 
  width: 100%; 
  float: left; 

  overflow: hidden; 
  
}

.calendar-left { 
  width: 100%; 
}

.calendar-all{display: grid;grid-template-columns:80px auto ; margin-bottom: 15px; grid-gap:10px}
/* 연도/월 표시 헤더 */
.calendar-header { 
  display: flex; 
  flex-direction: column; 
  align-items: flex-start;  margin-top: 15px


}

.calendar-year {
  font-size: 14px;
  color: #666;
  font-weight: normal;
  margin: 0;
  line-height: 1;
}

.calendar-month {
  font-size: 32px;
  
  font-weight: 600;
  margin: 0;
  line-height: 1; width:auto; float: left
}
.calendar-month .year{
  font-size:20px;
  font-weight:800;
  margin: 0;
  line-height: 1;text-align: center; width: 100%; float: left
}
.calendar-month .month{
  font-size: 40px;
  color:var(--point);;
  font-weight:800;
  margin: 0;
  line-height: 1; text-align: center; width: 100%; float: left
}

.calendar-nav {
  display: flex;
  align-items: center;
  gap: 20px;
  margin-top: 10px; display: flex;  justify-content: center;  align-items: center;width: 100%; float: left
}
.nav_btn_all{ 
 width: 100%; float: left;  display: flex;  justify-content: center;  align-items: center; grid-gap: 5px; margin-top: 10px
}
.nav-btn { 
  background: none; 
  border: none; 
  font-size: 16px; 
  color: #666;
  cursor: pointer; 
  padding: 5px;
  border-radius: 10px;
  transition: all 0.2s; width: 25px; aspect-ratio:1 / 1!important; background-color: #eee ; display: flex;  justify-content: center;  align-items: center;
}
.nav-btn i{ 
  color: #666; font-size: 25px;
}
.nav-btn:hover {
  background: #f0f0f0;
  color: #333;
}

/* 요일 헤더 */
.weekdays { 
  display: grid; 
  grid-template-columns: repeat(7, 1fr); 
  list-style: none; 
  padding: 0; 
  margin: 0 0 10px 0; 
  text-align: center; 
}

.weekdays li { 
  font-weight: 800; 
  color:var(--point); ; 
  font-size: 14px;
  padding: 10px 0; letter-spacing: 0px!important; font-family: "Pretendard"; 
}

/* 날짜 그리드 */
.days { 
  display: grid; 
  grid-template-columns: repeat(7, 1fr); 
  list-style: none; 
  padding: 0; 
  margin: 0; 
  text-align: center; font-family: "Pretendard"; 

}

.days li { 
  margin: 0; 
  padding: 10px 10px; 
  color: #333; 
  position: relative; 
  cursor: pointer; 
  font-size: 16px;
  font-weight: 500;
  transition: all 0.2s;font-family: "Pretendard"; 
}

.days li .da { 
  color: inherit; 
  position: relative;
  z-index: 2;
}

/* 기본 날짜 배경 */
.days li:before { 
  width: 40px; 
  height: 40px; 
  background: transparent; 
  content: ""; 
  position: absolute; 
  left: 50%; 
  top: 50%; 
  transform: translate(-50%, -50%); 
  z-index: -1; 
  border-radius: 50%; 
  transition: all 0.2s;
}

/* 선택된 날짜 스타일 */
.days li.active { 
  color: #fff; 
}

.days li.active:before { 
  width: 40px; 
  height: 40px; 
  background: var(--point); 
  content: ""; 
  position: absolute; 
  left: 50%; 
  top: 50%; 
  transform: translate(-50%, -50%); 
  z-index: -1; 
  border-radius: 50%; 
}

/* 선택된 날짜 하단 점 */
.days li.active::after { 
  content: ""; 
  width: 4px; 
  height: 4px; 
  background: #fff; 
  border-radius: 50%; 
  position: absolute; 
  bottom: 8px; 
  left: 50%; 
  transform: translateX(-50%); 
  z-index: 2;
}

/* 오늘 날짜 스타일 */
.days li.today { 
  color: #fff; 
}

.days li.today:before { 
  width: 40px; 
  height: 40px; 
  background:#333; 
  content: ""; 
  position: absolute; 
  left: 50%; 
  top: 50%; 
  transform: translate(-50%, -50%); 
  z-index: -1; 
  border-radius: 50%; 
}

/* 일정이 있는 날짜 표시 */
.days li.dayon::after { 
  content: ""; 
  width: 4px; 
  height: 4px; 
  background:var(--point)!important; 
  border-radius: 50%; 
  position: absolute; 
  bottom: 7px!important; 
  left: 50%; 
  transform: translateX(-50%); 
  z-index: 2;
}

/* 다른 달 날짜 */
.days li.other-month { 
  color: #ccc; 
}

/* 일정 표시 영역 */
.calendar-right { 
  width: 100%; 
  background: #fff;  padding-left: 100px; position: relative
}

.selected-date { 
  display: flex; 
  align-items: center; flex-direction: row;
  gap: 5px;
  padding: 15px 0;
 position: relative
}

.date-info {width: 100%; float: left;font-family: "Pretendard"; 

}

.date-label { float: left!important;width: auto!important;
font-size:calc(var(--tx-sm-size) *1); font-family:var(--ff-ko10)!important;
  color: #333; 
  font-weight: 500; margin-right: 10px; letter-spacing: 0px!important
}

.time-label {float: left!important;width: auto!important;; letter-spacing: 0px!important;
font-size:calc(var(--tx-sm-size) * 0.9);font-family:var(--ff-ko10)!important;
  color: #999;
}

.schedule-indicator {
  width: 12px;
  height: 12px;

  border-radius: 50%;
  flex-shrink: 0; border: 2px solid var(--point);
}


.schedule { 
  list-style: none; 
  padding: 0;
  margin: 0;
  color: #333; 
  font-size: 14px;
  line-height: 1.6; padding-left: 20px; ; position: relative
}
.schedule li{ 
font-size:calc(var(--tx-sm-size) *1); font-family:var(--ff-ko10)!important;
}


.schedule:before { 
content: "";  height: 100%; width: 1px; position: absolute; left: 5px; top: 0px; background-color: var(--point);
}


/* 구분 start -----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) {


}
/**** pc2 ****/
@media all and (max-width:1280px) and (min-width:768px) {
	
	
}
/**** 모바일 ****/
@media only all and (max-width:767px) {
.calendar-wrapper { 
  display: flex;   
  flex-direction: column;  

  max-width: 100%!important; 
  border-radius: 20px; 
  overflow: hidden; 

}	

.calendar-left { 

  width: 100%!important; 
}

.calendar-right { 
  width: 100%!important; 
  background: #fff; 

  border-left: none; 
  border-top: 1px solid #eee; 
}

.calendar-month {
  font-size: 28px;
}

.calendar-nav {
  gap: 15px;
}

.days li { 
  margin: 0; 
  padding: 12px 8px; 
  color: #333; 
  position: relative; 
  cursor: pointer; 
  font-size: 15px;
}	

.days li:before { 
  width: 36px;   
  height: 36px; 
  background: transparent; 
  content: ""; 
  position: absolute; 
  left: 50%; 
  top: 50%; 
  transform: translate(-50%, -50%); 
  z-index: -1; 
  border-radius: 50%; 
}

.days li.active:before { 
  width: 36px; 
  height: 36px; 
  background: #4A90E2; 
  content: ""; 
  position: absolute; 
  left: 50%; 
  top: 50%; 
  transform: translate(-50%, -50%); 
  z-index: -1; 
  border-radius: 50%; 
}

.days li.today { 
  color: #fff; 
}

.days li.today:before { 
  width: 36px; 
  height: 36px; 
  background: #4A90E2; 
  content: ""; 
  position: absolute; 
  left: 50%; 
  top: 50%; 
  transform: translate(-50%, -50%); 
  z-index: -1; 
  border-radius: 50%; 
}	

.selected-date {
  padding: 10px 0;
  margin-bottom: 15px;
}

.date-label {
  font-size: 15px;
}

.time-label {
  font-size: 13px;
}

.schedule li{
  font-size: 13px;font-family: "Pretendard"!important; 
}
	
}
/**** 모바일2 ****/
@media only all and (max-width:400px) {
	
}
/* 구분 //end -----------------------------------*/