

/* 관리자 - 공통 ================================================================================== */
.room_m									{padding:0 5px !important;line-height:28px !important;min-height:28px !important;min-width:40px !important;margin-left:2px;}
.room_text_deco01					{text-decoration:line-through !important;}
.room_graybox							{font-size:0.9em;}




/* 관리자 - 정렬버튼 ================================================================================== */
.gsearch_box .sort_btn				{position:relative; display: inline-block; cursor: pointer; text-align:center; white-space:nowrap; vertical-align:middle;  border-radius:2px;  padding: 0 14px;  line-height:32px;  border:1px solid #c5c5c5; background:#fff;color:#959595; font-size:0.9em; }
.gsearch_box .sort_btn i			{color:#959595; }
.gsearch_box .sort_btn.on,
.gsearch_box .sort_btn.on i		{ color:var(--color1);}



/* 관리자 - 시설 타임테이블 ================================================================================== */
.room_timetable_wrap							{position:relative;background:#ffffff;border:1px solid #ddd;padding:15px 24px;height:180px;}

.room_timetable_wrap .groups			{position:absolute;height:70px;width:1500px;z-index:66;}
.room_timetable_wrap .groups ul		{margin-left:-15px;width:100%;}
.room_timetable_wrap .groups li		{float:left;height:68px;font-weight:500;}

.room_timetable_wrap .bars				{position:absolute;margin:28px 0 0 0;width:1500px;z-index:33;}
.room_timetable_wrap .bars li				{float:left;padding:20px 0 0 0;} 
.room_timetable_wrap .bars p			{text-align:center;padding:8px 0;}
.room_timetable_wrap .bars .bar_c1		{border-top:1px solid #fa711a;border-bottom:1px solid #fa711a;background:#fc902b;height:20px;}
.room_timetable_wrap .bars .bar_c2		{border-top:1px solid #ababab;border-bottom:1px solid #ababab;background:#c2c2c2;height:20px;}
.room_timetable_wrap .bars .timetable_border	{border-left:1px solid #ddd;}
.room_timetable_wrap .bars .timetable_border:last-child	{border-right:1px solid #ddd;}
.room_timetable_wrap .barbt				{position:relative;top:48px;border:1px solid #e5e5e5;background:#f2f2f2;height:20px;}



/* 관리자 - 시설 예약현황 ================================================================================== */

.room_daybold										{position:relative;top:-6px;margin:0 0 5px 0; }
.room_daybold span								{padding:8px 18px 11px 18px;line-height:45px; font-size:20px;font-weight:600;border:1px dashed #bbb;border-top:0;border-left:0; }
 
.room_member_daybox						{padding:7px 5px;border-top:1px solid #efefef; }
.room_member_daybox:after				{content:""; display:block; clear:both;}
.room_member_wrap li:first-child		{border-top:0;}

.room_member_bg								{margin-bottom: 2px;background: #edeff3;border: 1px solid #96afd8;padding:6px 4px;position:relative; /* display: flex;justify-content: space-between; */   }
.room_member_bg:after						{content:""; display:block; clear:both;}
.room_member_bg .name					{flex:2;color: #4776c4;line-height:30px;font-size:1.05rem;font-weight:500;text-indent:0;cursor:pointer;}
.room_member_bg .name:hover		{text-decoration:underline;}
.room_member_bg.end .name			{color: #8f8f8f;}
.room_member_bg.end						{ background: #edeff3;border: 1px solid #dadada; }


.rcalendar_adminroom							{position:absolute;z-index:2;}

.rcalendar_adminyear							{position:relative;text-align:center;  color:#000; height:40px;margin:25px  0   ; } 
.rcalendar_adminyear span					{font-size:2.8em;  transition:all 0.3s ease;}
.rcalendar_adminyear select					{border:0; cursor:pointer; font-size:2.2em; font-weight:500;}
.rcalendar_adminyear select	 option	{text-align:center; font-size: 1.1rem;}
.rcalendar_adminyear .arrow				{position:absolute;top:4px;left:0;width:100%;z-index:1;}
.rcalendar_adminyear .arrow a			{position:absolute;display:block; top:0;width:40px; height:40px;  border:1px solid #b5b5b5; cursor:pointer; background:#fff; opacity:0.6; border-radius:50px; transition:all 0.3s ease;} 
.rcalendar_adminyear .arrow span		{position:absolute;top:14px;display:inline-block; width:10px;height:10px;border:solid #333; border-width:2px 2px 0 0;  transition:all 0.3s ease;}
.rcalendar_adminyear .arrow a:hover	 {opacity:1;}  
.rcalendar_adminyear .arrow .prev		{left:calc(50% - 175px);  }
.rcalendar_adminyear .arrow .prev span	{transform: rotate(-135deg); left:16px;}
.rcalendar_adminyear .arrow .next		{right:calc(50% - 175px); }
.rcalendar_adminyear .arrow .next span{transform: rotate(45deg);  right:16px;}




/* 리스트  ================================================================================== */
.room_listbox								{position:relative; display: grid; grid-template-columns:repeat(auto-fit, minmax(270px, 1fr)); gap:1.5em; transition: all 0.3s ease;}
.room_listbox:after					{content:''; display:block; clear:both;}
.room_listbox li							{position:relative; overflow:hidden; border:1px solid #cfcfcf; border-radius:10px; }
.room_listbox figure					{position:relative; width:100%; aspect-ratio: 4 / 2.4; overflow: hidden; }
.room_listbox figure img			{width:100%; height:100%; object-fit:cover; transition: all 0.5s ease;}
.room_listbox em						{position:absolute; z-index:1; left:-15px; top:20px; font-size:0.95em; display:inline-block; min-width:80px; line-height: 36px; font-style:normal; text-align: center;color:#fff;}
.room_listbox .ing						{background:#e94d6a;}
.room_listbox .acc						{color:#e94d6a; border:1px solid #e94d6a; background:#fff;}
.room_listbox .end					{background:#737171;}
.room_listbox .cont					{padding:25px 25px 75px 25px; }
.room_listbox .tit						{font-size:1.2em; font-weight:600; letter-spacing: -1px; color:#000; margin-bottom:15px; /* overflow:hidden; text-overflow:ellipsis; white-space:nowrap; */transition: all 0.3s ease;}
.room_listbox dl						{position:relative;font-size:0.9em;letter-spacing: -1px; display: grid; grid-template-columns:80px auto; gap:3px 10px;  }
.room_listbox dl dt					{position:relative;  color:#333; padding-left:10px;}
.room_listbox dl dt::before		{position:absolute; content:''; left:1px; top:12px; width:3px; height:3px; background:#555; border-radius:5px; }
.room_listbox dl dt::after			{position:absolute; content:'';  right:0; top:5px; width:1px; height:17px; background:rgb(0,0,0,0.15);}
.room_listbox dl dd					{  color:#808080; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;} 
.room_listbox .btn						{position:absolute;bottom:0; width:100%;text-align:center; color:#888; letter-spacing: -1px;  border-top:1px solid #ebe8e8; line-height:55px; transition: all 0.5s ease;}
.room_listbox .more					{position:relative; display:inline-block; top:6px; margin-left:13px; width:26px; height:26px; background:var(--color1); border-radius:50%;cursor:pointer;}
.room_listbox .more:after		{position:absolute; content:''; left:50%; top:50%; transform:translate(-50%, -50%); width:13px; height:2px; background:#fff;}
.room_listbox .more:before		{position:absolute; content:''; left:50%; top:50%; transform:translate(-50%, -50%); width:2px; height:13px; background:#fff;}
.room_listbox li:hover				{ border:1px solid var(--color1); box-shadow: 0 5px 30px rgba(0, 0, 0, 0.2);}
.room_listbox li:hover figure img	{transform: scale(1.05);}
.room_listbox li:hover .btn		{background:var(--color1); color:#fff;}
.room_listbox li:hover .more	{ background:rgb(255,255,255,0.4);  }

.room_nolist								{text-align:center; border-top:1px solid #ddd; border-bottom:1px solid #ddd; padding:100px 0; color:#999;}


@media screen and (max-width:1200px) {
.room_listbox .cont					{padding:20px 20px 70px 20px; }
.room_listbox .tit						{font-size:1.15em; margin-bottom:10px; }
.room_listbox .btn						{ line-height:52px; }
}
@media screen and (max-width:1024px) {
	.room_listbox em					{font-size:0.85em; line-height:30px; min-width:68px; left:-10px; top:15px;} 
	.room_nolist							{padding:60px 0;}
}

@media screen and (max-width:768px) {  
	.room_listbox .tit					{font-size:1.1em;  }
}

 
 
/* 뷰페이지 ================================================================================== */ 
.room_view_top2							{position:relative;  display:flex; gap:4%;  padding:30px; border:8px solid #f2f2f2;   /* box-shadow: 3px 3px 13px 0 rgba(0,0,0,0.07); */ }
.room_view_top2 .img					{width:48%; overflow:hidden;border-radius:10px; }
.room_view_top2 .img img			{width:100%;height:100%;object-fit:cover; }
.room_view_top2 .inner				{flex:2;   }
.room_view_top2 .inner .tit			{position:relative; font-size:1.65em; font-weight:600; color:#000; letter-spacing:-1px;line-height:1.3;padding:0 0 30px 0;}
.room_view_top2 .inner .tit strong		{display:block;padding:10px 0 0 0;}
 
.room_view_top2 .inner dl			{position:relative;display:flex;gap:15px; font-size:0.95em;   padding:4px 0 ; color:#000;}
.room_view_top2 .inner dt			{position:relative;width:110px;letter-spacing:-1px; padding:0 0 0 15px; font-weight:500; }
.room_view_top2 .inner dd			{flex:2; color:#777;  }
.room_view_top2 .inner dt::before		{position:absolute; content:''; display:block; left:3px; top:12px; width:4px; height:4px; background:#555; border-radius:5px; }
.room_view_top2 .inner dt::after		{position:absolute; content:''; display:block; right:0; top:5px; width:1px; height:17px; background:rgb(0,0,0,0.15);}
  
.room_contentbox						{ position:relative; background:#f2f2f2; padding:25px 30px 35px 30px;   display: grid; grid-template-columns:150px auto;    }
.room_contentbox .subject			{ font-weight:600;font-size:1.15em; color:#000; padding:0 0 15px 0; }
.room_contentbox .box				{color:#444;  }

@media screen and (max-width:1400px) { 
.room_view_top2							{ padding:25px;}
.room_view_top2 .inner .tit			{  font-size:1.55em; padding:0 0 25px 0;}
.room_view_top2 .inner dl			{  padding:3px 0 ;  }
}

@media screen and (max-width:1024px) {  
.room_view_top2 .inner .tit			{ font-size:1.45em;padding: 0 0 20px 0; }
.room_view_top2 .inner dl			{font-size:0.9em;padding:2px 0; gap:10px; }
.room_view_top2 .inner dt			{width:90px;} 
.room_contentbox						{padding:20px 25px 30px 25px;  grid-template-columns:1fr; }
}
@media screen and (max-width:800px) {  
.room_view_top2							{  border-width:6px;   flex-flow:wrap; flex-direction: column; gap:20px;}
.room_view_top2 .img					{ width:100%;  } 
.room_contentbox .subject			{ font-size:1.1em;   }
}
@media screen and (max-width:600px) {  
.room_view_top2							{ padding:20px;}
.room_view_top2 .inner .tit			{ font-size:1.2em;  }
.room_contentbox .subject			{ font-size:1.05em;padding:0 0 10px 0;    }
.room_contentbox						{padding:15px 20px 25px 20px;}
}



 
.room_view_calendar						{position:relative; margin:0 0 50px 0; display:grid;grid-template-columns:46% 50%; gap:4%;}
.room_view_calendar .rt2				{}
.room_view_wrap h5 span					{float:right; font-size:0.9rem; color:#006edd; padding-right:2px;}
.room_view_wrap .cont					{margin-bottom:40px; line-height:1.6;}			


.room_calendar_top						{text-align:center;overflow:hidden; border:1px solid #d2d2d2; border-top:1px solid #252525; border-bottom:0; height:48px; line-height:42px;}
.room_calendar_top span					{padding:0 6px;font-size:1.1em; color:#333;line-height:150%; vertical-align:middle; font-weight:600;}
.room_calendar_top i					{vertical-align:middle;}

@media screen and (max-width:1024px) {  
	.room_view_calendar				{display:block;}
	.room_view_calendar .rt2		{padding:30px 0 0 0;} 
	.room_calendar_top span			{font-size:1em;}
} 
@media screen and (max-width:768px) { 
	.room_view_wrap .wrap			{margin-bottom:20px;}
	.room_view_photo				{grid-template-columns:auto;gap:0px;}
}
@media screen and (max-width:400px) { 
    .room_view_wrap h5 span					{float:none; display:block; margin-top:0.5em; }
}





.room_table								{border-collapse:collapse; width:100%; table-layout:fixed; }
.room_table thead th					{background:#ffffff;border:1px solid #dddddd; color:#4e4e4e; line-height:46px; font-weight:500;}
.room_table thead th:first-child		{color:#f64a1b;}
.room_table thead th:last-child			{color:#397fe7;}
.room_table tbody td					{background:#ffffff; border:1px solid #dddddd; line-height:46px; text-align:center;  padding:0px 5px; cursor:pointer;} 
.room_table tbody td.adm				{vertical-align:top; line-height:30px !important;}
.room_table i							{display:none;}
.room_table tbody td:hover				{background:#fef7c0;}

.room_table .selday,
.room_table .selday:hover				{background:#006edd;}
.room_table .selday p					{display:inline-block; color:#fff; line-height:32px; padding:0 5px;}
.room_table .selday i					{display:inline-block; margin-right:5px; font-size:12px; vertical-align:middle;}
.room_table .notday						{background:#f8f8f9;}
.room_table .notday p					{color:#ccc; text-decoration:line-through;}
.room_table .notday:hover				{background:#f8f8f9; cursor:auto;}
.room_table .today						{background:#fff;}
.room_table .today p					{color:#f66000;}
.room_table .today i					{display:none;}
.room_table .redday						{color:#f64a1b;}
.room_table .blueday					{color:#397fe7;}
.room_table .usedday					{background:#ffcccc !important;}

.room_table_btm							{border:1px solid #ddd; border-top:0; padding:12px 10px; font-size:0.9em; color:#333;text-align:center;}
.room_table_btm span					{background:#fff; display:inline-block; width:13px; height:13px; border:1px solid #ccc; margin:0 5px 0 0; vertical-align:middle;}		
.room_table_btm span.disable	{background:#f4f4f4; margin-left:10px;}
.room_table_btm span.already	{background:#006edd; border-color:#006edd; margin-left:10px;}

.room_table_time						    {overflow:hidden; position:relative; display:grid; grid-template-columns:repeat(2, 1fr);gap:5px 5px; margin-bottom:20px;}
.room_table_time li						{position:relative; background:#fff; border:1px solid #dbdbdb; border-radius:3px; font-weight:500; padding:12px 14px; height:52px; font-size:0.95em; cursor:pointer;}
.room_table_time li span				{font-size:0.85em; color:#2780ed;}
.room_table_time li i					    {position:absolute; right:12px; display:inline-block; font-size:11px; color:#999; width:24px;height:24px; line-height:22px; border-radius:100%; text-align:center; border:1px solid #d1d1d1;}
.room_table_time li:hover,
.room_table_time .on					{background:#eaeef5; border-color:#4d95dd;}
.room_table_time li:hover i,
.room_table_time .on i					{background:#006edd; color:#fff; border-color:#006edd;}
.room_table_time .off					{text-decoration:line-through; color:#bbb; background:#f8f8f9; }
.room_table_time .off span			{color:#bbb; text-decoration:auto; }
.room_table_time .off i				    {display:none;}
.room_table_time .off:hover		{background:#f8f8f9; cursor:auto; color:#bbb; }


@media screen and (max-width:1024px) {   
	.room_table thead th,
	.room_table tbody td			{line-height:42px; font-size:0.95em;}
}
@media screen and (max-width:580px) { 
	.room_table_time				{grid-template-columns:none; gap: 5px 0;}
	.room_table tbody td			{padding:0px;}
}




/* 동의화면  ================================================================================== */
.room_agreebox															{position:relative;border:1px solid #dfdfdf; background:#fff;}
.room_agreebox .textarea_form									{border-color:#fff; font-size:0.95em;padding:20px; height:230px;}
.room_agreebox .bottom												{ position:relative;background:#f4f5f7; text-align:center; padding:12px; color:#000; }
.room_agreebox .bottom input[type="checkbox"]							{display: none;  } /* 체크박스 이미지 설정 */
.room_agreebox .bottom input[type="checkbox"] + label					{position: relative;padding-left:40px; cursor: pointer;display: inline-block; }
.room_agreebox .bottom input[type="checkbox"] + label:before			{content: '';position: absolute;left: 0;top:-1px;border:1px solid #ddd; border-radius:50%; width:30px; height:30px; background: url('../img/checkbox.png') no-repeat #fff; background-size: contain;}
.room_agreebox .bottom input[type="checkbox"]:checked + label:before	{background: url('../img/checkbox_on.png') no-repeat #3d89f6; border-color:#3d89f6; background-size:contain; }
 
@media screen and (max-width:1024px) {
	.room_agreebox .textarea_form										{height:200px;}
	.room_agreebox .bottom input[type="checkbox"] + label				{padding-left:37px;}
	.room_agreebox .bottom input[type="checkbox"] + label:before		{width:28px; height: 28px;}
}




/* 사용자 상세화면  ================================================================================== */
.room_memberview_infobox			{position:relative;display:grid; grid-template-columns:60% auto; gap:40px;}

@media screen and (max-width:580px) { 
	.room_memberview_infobox		{grid-template-columns:auto;gap:20px;}
}