.s_status01 {display:inline-block;line-height:28px; padding:0 5px;min-width:55px;font-size:0.9em;text-align:center;letter-spacing:-1px; border:1px solid #f67510;color:#f67510; border-radius:2px;} .s_status02 {display:inline-block;line-height:28px;padding:0 5px;min-width:55px;font-size:0.9em;text-align:center; letter-spacing:-1px;border:1px solid #5087f6;color:#5087f6;border-radius:2px;} .s_status03 {display:inline-block;line-height:28px;padding:0 5px;min-width:55px;font-size:0.9em;text-align:center; letter-spacing:-1px;border:1px solid #ccc;color:#999;border-radius:2px;} input[type="checkbox"] {margin-bottom: 3px;} /* 관리자 - 공통 ================================================================================== */ .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 {border:1px solid #dfdfdf; padding:15px; margin-bottom:5px; background-color:#f7f7f7; } .room_graybox2 {font-size:0.9em;} .room_input_view {background:transparent !important; border:1px solid transparent !important;} .room_input_check {-webkit-appearance: none; position: relative;outline: none !important; border: 1px solid #eeeeee; border-radius: 2px; background: #fbfbfb;} .room_input_check::before {content: "\2713";position: absolute;top: 50%;left: 50%;overflow: hidden;transform: scale(0) translate(-50%, -50%);line-height: 1;} .room_input_check:disabled {background-color: #555;border-color: rgba(255, 255, 255, 0.3);color: white;} .room_input_check:disabled::before {border-radius: 2px;transform: scale(1) translate(-50%, -50%)} /* 관리자 - 시설 타임테이블 ================================================================================== */ .room_timetable_wrap {position:relative;background:#ffffff;border:1px solid #ddd;padding:15px 24px;height:120px;} .room_timetable_wrap .groups {position:absolute;height:70px;width:900px;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;background:url("../img/time_line_bg.png") no-repeat 15px 25px;} .room_timetable_wrap .bars {position:absolute;margin:28px 0 0 0;width:900px;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 .barbt {position:relative;top:48px;border:1px solid #e5e5e5;background:#f2f2f2;height:20px;} /* 관리자 - 시설 예약현황 ================================================================================== */ .room_member_title {background:#4a566e;padding: 12px 8px;text-align: center;font-weight: 500;font-size:1.2em;color: #fff;} .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; } .room_member_divs {position:absolute; display: none; width:380px; border:1px solid #bbb;background:#fff; box-shadow: 0 0 10px 0 rgba(0,0,0,0.3);z-index:999;} .room_member_divs .title {padding:15px; background:#fafafa; border-bottom:1px solid #dfdfdf; overflow:hidden;display: grid; grid-template-columns:auto 100px; } .room_member_divs .title div {color: #333;font-weight: 500; font-size: 1.25em;} .room_member_divs .title i {color: #666 !important;font-size: 1.1em;} .room_member_divs .cont {margin: 0;padding: 10px 15px 15px 20px;} .room_member_divs .cont dl {margin: 0;border-bottom: 1px solid #fff;text-align: left; overflow:hidden; display: grid; grid-template-columns:75px auto;} .room_member_divs .cont dt {position: relative; padding: 4px 10px; font-size: 0.95em;} .room_member_divs .cont dt:after {position: absolute; content: ''; display: block; left: 0; top: 13px; width: 3px; height: 3px; border-radius: 100%; background: #3a7cda;} .room_member_divs .cont dd {position:relative; padding: 4px 0;font-size: 0.95em;} .room_member_divs .cont dd:after {position: absolute; content: ''; left:-10px; top:7px;width:1px;height:15px; background:#dfdfdf;} .calendar_year {position:relative;text-align:center; font-size:2.2em;color:#222; padding:8px 0 10px 0;height:50px;margin:10px 0; } .calendar_year span {font-weight:500;} .calendar_year .arrow {position:absolute;top:0;left:0;width:100%;z-index:1;} .calendar_year .arrow a {position:absolute;display:block; width:40px; height:40px; border:1px solid #b5b5b5; cursor:pointer; background:#fff; opacity:0.6;} .calendar_year .arrow span {display:inline-block; border:solid #000; border-width:0px 1px 1px 0; padding:6px; } .calendar_year .arrow a:hover {opacity:1;} .calendar_year .arrow .prev {left:calc(50% - 120px); } .calendar_year .arrow .prev span {transform: rotate(135deg); margin:13px 0 0 7px;} .calendar_year .arrow .next {right:calc(50% - 120px); } .calendar_year .arrow .next span {transform: rotate(-45deg); margin:13px 0 0 -6px;} .calendar_room {position:absolute;z-index:2;} /* 관리자 - 시설 예약폼 ================================================================================== */ #room_win_title {padding:20px;background:#333;letter-spacing:0; overflow:hidden;} #room_win_title .tit {float:left;font-size:1.5em;line-height:30px; font-weight:500;color:#fff;} #room_win_title .close {position:relative;float:right;width:30px;height:30px;cursor:pointer;} #room_win_title .close:before, #room_win_title .close:after {position:absolute;left:calc(50% - 1px);content:'';height:30px;width:2px;background-color:#fff;} #room_win_title .close:before {transform:rotate(45deg);} #room_win_title .close:after {transform:rotate(-45deg);} /* 리스트 ================================================================================== */ .room_listbox {position:relative; display: grid; grid-template-columns: repeat(3, 1fr); gap:30px 30px; } .room_listbox:after {content:''; display:block; clear:both;} .room_listbox li {position:relative; overflow:hidden;} .room_listbox figure {position:relative; height:240px; overflow: hidden; border-radius:10px; border:1px solid #dfdfdf; } .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 dl {padding:25px 0; transition: all 0.5s ease;} .room_listbox dl dt {margin-bottom:15px; font-size: 1.3em; font-weight:700; line-height:1; letter-spacing: -1.75px; color:#333; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;} .room_listbox dl dd {padding:2px 0; color:#808080; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;} .room_listbox dl dd strong {position:relative; display:inline-block; min-width:75px;padding-right:15px; font-weight:500; color:#333;} .room_listbox .enter {position:relative; font-family: 'GmarketSansMedium'; border-top:1px dashed #aaa; height:52px; line-height:52px; padding:0 20px; text-align:center; color:#1ca6ad; transition: all 0.5s ease;} .room_listbox li:hover .enter {background:#189fa5; border-color:#189fa5; color:#fff;} .room_listbox li:hover figure {box-shadow: 0 0 8px 0 rgba(0,0,0,0.2);} .room_listbox li:hover figure img {transform: scale(1.03);} .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:1024px) { .room_listbox {gap:10px 20px; grid-template-columns: repeat(2, 1fr);} .room_listbox figure {height:220px;} .room_listbox em {font-size:0.85em; line-height:30px; min-width:68px; left:-10px; top:15px;} .room_listbox dl {padding:20px 0;} .room_listbox dl dt {font-size:1.1em; margin-bottom:12px;} .room_listbox dl dd {padding:0; font-size:0.95em;} .room_listbox .enter {font-size:0.85em; height:48px; line-height:48px;} .online_nolist {padding:60px 0;} } @media screen and (max-width:768px) { .room_listbox {grid-template-columns: repeat(1, 1fr);} .room_listbox figure {height:200px;} .room_listbox dl {min-height:auto;} } /* 뷰페이지 ================================================================================== */ .room_view_wrap {position:relative; overflow:hidden;} .room_view_top {position:relative; margin-bottom:40px;} .room_view_top .tit {position:relative;font-weight:700; font-size:1.8em; color:#222; letter-spacing:-2px; line-height:140%; margin:0 0 20px 0;} .room_view_top .box {position:relative; background:#f7f7f7; border:1px solid #eee; padding:20px; display:grid;grid-template-columns:repeat(2, 1fr); gap:15px 10px;} .room_view_top .box li {position:relative;display:flex; } .room_view_top .box li .icon {position:relative;width:42px;height:42px;line-height:40px; font-size:1.1em;margin-right:15px; background:#fff; color:#1ca6ad; border-radius:50px; text-align:center;} .room_view_top .box li .txt {position:relative; font-size:0.95em; color:#797979; line-height:1.4; } .room_view_top .box li .txt span {display:block; font-weight:500; color:#333; margin-bottom:3px;} .room_view_photo {position:relative; display:grid;grid-template-columns:50% 46%;gap:4%; margin-bottom:30px;} .room_view_photo figure {height:350px;border:1px solid #eaeaea;} .room_view_photo figure img {width:100%; height:100%; object-fit:cover; } .room_view_photo .info div {line-height:1.5;} .room_view_calendar {position:relative; margin:0 0 50px 0; display:grid;grid-template-columns:50% 46%;gap:4%; } .room_view_calendar .rt2 {} .room_view_wrap .rt .stit {color:#146ebe;} .room_view_wrap h5 span {float:right; font-size:15px; color:#006edd;} .room_view_wrap h5 span i {margin-right:3px;} .room_view_wrap .cont {margin-bottom:40px; line-height:1.6;} .room_view_wrap .room_subbox {margin:0 0 30px 0; border-top: 1px solid #252525; border-bottom:1px dashed #ccc; padding:0 0 30px 0;} .room_view_wrap .room_subbox li {float:left; width:50%; background:#fff; border-bottom:1px solid #d2d2d2; text-align:center; padding:10px 0; font-size:0.95em; cursor:pointer;} .room_view_wrap .room_subbox li:nth-child(even) {border-left:1px solid #d2d2d2;} .room_view_wrap .room_subbox li:hover, .room_view_wrap .room_subbox li.on {background:#ffa000;color:#fff;} .room_calendar_top {background:#efefef; 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;} .room_timetable {border-collapse:collapse; width:100%; table-layout:fixed; } .room_timetable thead th {background:#798291;border:1px solid #5d636c; color:#fff; line-height:46px; font-weight:500;} .room_timetable tbody th {padding:0px 5px; background:#cdcfd4; border:1px solid #dddddd;} .room_timetable tbody td {background:#ffffff; border:1px solid #dddddd; line-height:46px; text-align:center; padding:0px 5px; cursor:pointer;} .room_timetable tbody td.adm {vertical-align:top; line-height:30px !important;} .room_timetable tbody td:hover {background:#fef7c0;} .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:#f9f9f9;} .room_table .notday p {color:#ccc; text-decoration:line-through;} .room_table .notday:hover {background:#f9f9f9; 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 {padding:10px 0; font-size:15px; text-align:right;} .room_table_btm em {background:#fff; display:inline-block; width:15px; height:15px; border-radius:100%; border:1px solid #d2d2d2; margin:0 5px 0 0; vertical-align:middle;} .room_table_btm em.disable {background:#f4f4f4; margin-left:10px;} .room_table_btm em.already {background:#006edd; border-color:#006edd; margin-left:10px;} .room_table_time {overflow:hidden; border:1px solid #d4d4d4; border-top:1px solid #252525; border-bottom:0; margin-bottom:20px;} .room_table_time li {position:relative; float:left; width:50%; background:#fff; border-bottom:1px solid #d4d4d4; padding:12px 15px; height:52px; font-size:0.95em; cursor:pointer;} .room_table_time li:nth-child(even) {border-left:1px solid #d4d4d4;} .room_table_time li span {font-size:0.85em; color:#0866c5;} .room_table_time li em {position:absolute; right:15px; display:inline-block; font-size:11px; color:#999; width:25px; line-height:20px; border-radius:100%; text-align:center; border:2px solid #d1d1d1;} .room_table_time li:hover, .room_table_time .on {background:#eaeef5;} .room_table_time li:hover em, .room_table_time .on em {background:#006edd; color:#fff; border-color:#006edd;} .room_table_time .off {text-decoration:line-through; color:#bbb; background:#f9f9f9;} .room_table_time .off span {color:#bbb;} .room_table_time .off em {display:none;} .room_table_time .off:hover {background:#f9f9f9; cursor:auto; color:#bbb; font-weight:300;} .room_view_form {border-top:1px solid #222;} .room_view_form .textarea_form {font-size:0.9em; border-color:#ddd; padding:15px;} .room_view_form .textarea_form2 {background:#f7f7f7;} .room_view_form .right label {display:block; font-size:0.9em; color:#797979; margin:5px 0 0 0;} .room_view_wrap .table {border-collapse:collapse; width:100%; table-layout:fixed; } .room_view_wrap .table tbody th {color:#333; font-weight:500; line-height:150%; padding:12px 15px;letter-spacing:-1px; border-bottom:1px solid #dadada ; border-right:1px solid #fff; text-align:left;} .room_view_wrap .table tbody td {line-height:150%; padding:12px 8px; border-bottom:1px solid #dadada ; border-right:1px solid #dadada ; border-left:1px solid #dadada ; background-color:#fff; } .room_view_wrap .table tbody td:first-child {border-left:1px solid #fff; } .room_view_wrap .table tbody td:last-child {border-right:1px solid #fff; } .room_view_wrap .table .input_form {border-color:#ddd; line-height:42px;} .gtable .selday {background:#fef7c0;} .gtable .selday p {color:#000;} .gtable .notday {background:#fafafa;} .gtable .notday p {color:#ccc;} .gtable .today {background:#fdf9f2 !important;} .gtable .today p {color:#f66000;} .gtable .redday {color:#f64a1b;} .gtable .blueday {color:#397fe7;} @media screen and (max-width:1024px) { .room_view_top .tit {font-size:1.4em;} .room_view_photo {display:block; margin:0;} .room_view_calendar {display:block;} .room_view_photo .info {border-top:0; padding:20px 0;} .room_view_calendar .rt2 {padding:30px 0 0 0;} .room_calendar_top span {font-size:1em;} .room_table thead th, .room_table tbody td {line-height:42px; font-size:0.95em;} } @media screen and (max-width:768px) { .room_view_top .box {display:grid;grid-template-columns:repeat(1, 1fr); gap: 15px; padding:10px;} .room_view_wrap figure {height:auto;} .room_view_wrap .wrap {margin-bottom:20px;} .room_table_time li {float:none; width:100%;} .room_table_time li:nth-child(even) {border-left:0;} } .homepage {display:revert;} .mobile {display:none;} .mobiles2 {display:none;} @media screen and (max-width:1024px) { .mobile {display:revert;} .homepage {display:none;} }