232 lines
28 KiB
CSS
232 lines
28 KiB
CSS
.overview-main { display: none; }
|
|
.overview { display: flex; background-color: #fff; max-width: 100dvw; height: calc(100dvh - 4.5rem); position: absolute; overflow-x: auto; overflow-y: hidden; }
|
|
.overview-box-1 { min-width: 38rem; max-width: 38rem; display: flex; flex-direction: column; gap: 0.5rem; min-height: calc(100dvh - 4.5rem); overflow-x: hidden; overflow-y: auto; }
|
|
.overview-box-2 { min-width: 38rem; max-width: 38rem; display: flex; flex-direction: column; gap: 0.5rem; min-height: calc(100dvh - 4.5rem); overflow-x: hidden; overflow-y: auto; }
|
|
.overview-box-3 { display: flex; flex-direction: column; gap: 0.5rem; min-width: 43.5rem; max-width: 43.5rem; overflow-x: hidden; overflow-y: auto; }
|
|
.overview .section-division-border { background-color: #E9EEED; min-width: 0.25rem; }
|
|
.overview .overview-box--wrap { display: flex; gap: 0.5rem; }
|
|
.overview .type--wrap { display: flex; gap: 0.5rem;}
|
|
.overview .type--wrap-space-evenly { display: flex; justify-content: space-evenly; width: 100%; gap: 1rem; }
|
|
.overview .box-header { display: flex; justify-content: space-between; padding: 0.5rem 1rem; border-bottom: 0.0625rem solid var(--primary-lv2); color: var(--primary-lv5); align-items: center; height: 2.25rem; }
|
|
.overview .box-header--right { display: flex; gap: 0.5rem;}
|
|
.overview .box-header h5 { color: #111; }
|
|
.overview .box-header--right-set { display: flex; gap: 0.5rem; align-items: center; }
|
|
.overview .box-header img { width: 1.375rem; height: 1.375rem; }
|
|
.overview .type--wrap-left { min-width: 3.5rem; }
|
|
.overview .wrap-2-set { display: flex; flex-direction: column; width: 50%; gap: 1rem; }
|
|
.overview .wrap-3-set { display: flex; flex-direction: column; gap: 1rem; width: 100%; }
|
|
.overview .wrap-3-set .type--wrap-right { width: 100%; }
|
|
.overview .box-body { padding: 0.75rem 1rem; display: flex; flex-direction: column; gap: 1rem; font-size: 0.875rem; font-weight: 300; line-height: 1.25rem; flex-grow: 1;}
|
|
.overview .box-body.facility-size .type--wrap-right { flex: 1; overflow: hidden;}
|
|
.overview .box-body.facility-size .facility-overview {width: 95%; text-overflow: ellipsis; overflow: hidden; white-space: nowrap;}
|
|
.overview .scroll-box.facility-size .box-body { gap : 0.5rem; padding: 0.5rem 1rem;}
|
|
.overview .box-body.business-purpose {width: 95%; height: 50%; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; line-height: 1.25rem; white-space: normal;}
|
|
.overview .calendar { width: 100%; height: fit-content; }
|
|
.overview .xs-btn-type { color: #000; background-color: #fff; border-radius: 0.25rem; border: 0.0625rem solid #ddd; padding: 0 0.25rem; min-height: 1.25rem; max-height: 1.25rem; max-width: fit-content; min-width: fit-content; cursor: pointer; }
|
|
.overview h3 { font-size: 0.875rem; font-weight: 500; line-height: 1.25rem; color: var(--primary-lv5); }
|
|
.overview h4 { font-size: 0.875rem; font-weight: 300; line-height: 1.25rem; }
|
|
.overview h5 { font-size: 0.75rem; font-weight: 500; line-height: 1.25rem; }
|
|
.overview h6 { font-size: 0.75rem; font-weight: 300; line-height: 1.25rem; }
|
|
.overview p { font-size: 0.75rem; font-weight: 300; line-height: 1.25rem; color: #777; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
|
|
.overview .overview-table-container { overflow-x: auto; overflow-y: hidden; max-width: 100%; }
|
|
.overview .overview-table-container table { border-collapse: collapse; width: 100%; }
|
|
.overview .overview-table-container td { padding: 0.25rem; font-size: 0.875rem; font-weight: 300; line-height: 1.25rem; min-width: 7rem;}
|
|
.overview .overview-table-container th { padding: 0.25rem; text-align: left; color: #777; font-size: 0.75rem; font-weight: 300; line-height: 1.25rem; min-width: 7rem;}
|
|
.overview .overview-table-container th.sticky,.overview .overview-table-container .sticky { position: sticky; left: 0; background-color: #fff; color: #777; font-size: 0.75rem !important; font-weight: 300; line-height: 1.25rem; min-width: 5rem !important; }
|
|
.overview .total { color: #111 !important; }
|
|
.overview .host { color: #111; font-weight: 500; }
|
|
.overview .xs-btn { background-color: #fff; padding: 0.125rem; border: 0.0663rem solid #ddd; border-radius: 0.25rem; display: flex; justify-content: center; align-items: center; width: 1.25rem; height: 1.25rem; }
|
|
.overview .overview-map { width: 100%; height: 100%; border-radius: 0.25rem; border: 0.0625rem solid #ddd; object-fit: contain; }
|
|
.overview .location-map { width: 100%; height: 100%; border-radius: 0.25rem; border: 0.0625rem solid #ddd; object-fit: contain; }
|
|
.overview select { border: none; border-bottom: 0.0625rem solid #ddd; font-family: 'Pretendard'; font-size: 0.875rem; font-weight: 300; line-height: 1.25rem; color: #111; appearance: none; -webkit-appearance: none; -moz-appearance: none; }
|
|
.overview select:focus { outline: none; box-shadow: none; border-color: inherit; }
|
|
.overview .cursor-btn { cursor: pointer; }
|
|
.overview .issue-box { width: 100%; height: 100%;}
|
|
/*교류시간*/
|
|
.overview .exchange-time { display: none;}
|
|
.overview .top-section,.overview .top-section--div { display: flex; gap: 0.5rem; }
|
|
.overview .top-section { gap: 1rem; }
|
|
.overview .top-section--div { gap: 0.5rem; }
|
|
.overview .bottom-section-1,.bottom-section-2,.bottom-section-3,.bottom-section-4,.timetable { display: flex; align-items: center; }
|
|
.overview .timetable-block { width: 1.75rem; height: 1.75rem; border: 0.0625rem solid #ddd; display: flex;}
|
|
.overview .timetable-half-block { width: 0.875rem; height: 1.687rem; display: flex;}
|
|
.overview .timetable-quarter-block { width: 0.4375rem; height: 1.687rem;}
|
|
.overview .bottom-section { position: relative; }
|
|
.overview .bottom-section-1 p, .overview .bottom-section-4 p { text-overflow: unset; overflow: visible; }
|
|
.overview .bottom-section h4 { width: 3rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
|
|
.overview .time-bar { position: absolute; margin-left: 1.3rem; top: -0.3rem; display: flex; align-items: center; flex-direction: column; }
|
|
.overview .time-bar .bar { height: 3.8rem; width: 0.063rem; background-color: #111; }
|
|
.overview .time-bar .kst-time,.other-country-time { min-width: 3.5rem; background: #1E5149; border: 0.0625rem solid #ddd; color: #fff; border-radius: 0.25rem; padding: 0 0.25rem; }
|
|
.overview .type-em-red { color: var(--color-dahong); font-weight: 300; font-size: 0.75rem; }
|
|
|
|
/*캘린더*/
|
|
.overview #calendar { display: inline-block; text-align: left; width: 100%; height: 100%; overflow-y: auto; }
|
|
.overview .calendar-header { display: flex; justify-content: center; gap: 2rem; border-bottom: 0.0625rem solid #dddddd; padding-top: 0.5rem; position: relative; align-items: center; }
|
|
.overview .calendar-header .add-schedule-btn { position: absolute; right: 1.25rem; cursor: pointer; margin-bottom: 0.5rem; }
|
|
.overview .calendar-header .add-schedule-btn img { width: 1.375rem; height: 1.375rem; }
|
|
.overview .calendar-header .calendar-btn { cursor: pointer; margin-bottom: 0.5rem; }
|
|
.overview .calendar-header .calendar-btn img { width: 3.5rem; height: 1.875rem; }
|
|
.overview .schedule { width: 100%; display: flex; align-items: center; justify-content: space-evenly; cursor: pointer; }
|
|
.overview .schedule.start_date { border-top-left-radius: 0.25rem; border-bottom-left-radius: 0.25rem; margin-left: 0.5rem; }
|
|
.overview .schedule.end_date { border-top-right-radius: 0.25rem; border-bottom-right-radius: 0.25rem; margin-left: -0.5rem; }
|
|
.overview .schedule .color { display: flex; align-items: center; width: 10%; margin-left: 0.5rem; }
|
|
.overview .schedule .time { font-size: 0.625rem; font-weight: 300; color: #777777; }
|
|
.overview .schedule .title { font-size: 0.75rem; font-weight: 300; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width: 90%; }
|
|
.overview .schedule .schedule-point { margin-bottom: 0.25rem; }
|
|
.overview .schedule:hover { cursor: pointer; }
|
|
.overview .remain-schedules { margin-left: 0.5rem; }
|
|
.overview .month-header { font-size: 0.875rem; margin-bottom: 0.5rem; font-weight: 500; }
|
|
.overview .days-of-week { display: flex; justify-content: space-around; font-weight: 300; padding-top: 0.625rem; padding-bottom: 0.625rem; font-size: 0.75rem; }
|
|
.overview .days-of-week .days-of-week-day {font-size: 0.75rem;}
|
|
.overview .days-of-week .sunday { color: #FF3D00; font-weight: 400; }
|
|
.overview .days { display: flex; flex-wrap: wrap; justify-content: flex-start; outline: 0.0625rem solid #ddd; }
|
|
.overview .day { width: calc(100% / 7); height: 5.5rem; border-right: 0.0625rem solid #ddd; border-bottom: 0.0625rem solid #ddd; padding-top: 0.25rem; text-overflow: ellipsis; overflow: hidden; }
|
|
.overview .day.sunday { color: var(--color-dahong); font-weight: 300; }
|
|
.overview .day.saturday { color: var(--color-blue); font-weight: 300; }
|
|
.overview .day-today { padding: 0.25rem 0.5rem; font-size: 0.75rem; }
|
|
.overview .day.today .day-today { width: 1.25rem; height: 1.25rem; background-color: var(--primary-lv5); color: #fff; border-radius: 0.25rem; display: flex; justify-content: center; padding: 0.25rem 0.5rem; margin-left: 0.375rem; }
|
|
.overview .day .holiday { font-size: 0.625rem; display: flex; margin-left: 0.375rem; overflow: hidden; align-items: center; gap: 0.25rem; }
|
|
.overview .day .holiday img { width: 0.875rem; height: 0.875rem; margin-right: 0.125rem; object-fit: contain;}
|
|
.overview .work-hour { background-color: #E9EEED; color: #1E5149; display: flex; align-items: center; justify-content: center; }
|
|
.overview .scroll-box { display: flex; overflow-y: hidden; overflow-x: auto; padding: 0 1rem; }
|
|
.overview .scroll-box::-webkit-scrollbar { display: none; }
|
|
.overview .section-box { background-color: #E9EEED; border: 0.0625rem solid #BCCBC8; border-radius: 0.25rem; min-width: 20rem; margin-right: 0.5rem; }
|
|
.overview .section-box--header { color: var(--primary-lv5); padding: 0.5rem 1rem 0 1rem; }
|
|
.overview .scroll-box.facility-size h4 {width: 14rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
|
|
|
|
.overview .box.issue {display: flex; flex-direction: column; flex-grow: 1;}
|
|
.overview .box.issue .wrap {display: flex; flex-direction: column; flex-grow: 1; position: relative; padding: 0.5rem;}
|
|
.overview .box.issue .message {position: absolute; width: 100%; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 0.85rem; color: #777; font-size: 0.75rem; font-weight: 300; text-align: center; line-height: 1.25rem; letter-spacing: -0.0175rem; }
|
|
.overview .box.issue .message.active {color: #000; z-index: 1;}
|
|
.overview .box.issue .issue-content {width: 100%; resize: none; position: relative; border : 0.063rem solid #ddd; border-radius: 0.25rem; font-size: 0.875rem; padding: 0.5rem 1rem; font-weight: 300; line-height: 1.25rem; letter-spacing: -0.0175rem; flex-grow: 1;}
|
|
|
|
|
|
/* overview-modal */
|
|
.overview-modal-wrapper { z-index: 50; position: absolute; width: 100vw; height: 100dvh; background-color: rgb(17, 17, 17, 0.6); display: none; top: 0; }
|
|
.overview-modal { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); border: 0.0625rem solid #111; border-radius: 0.25rem; background-color: #ffffff; box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.16); z-index: 51; width: max-content; min-width: 40rem; max-height: calc(100dvh - 4rem)}
|
|
.overview-modal.section-left {max-width: 40rem;}
|
|
.overview-modal.section-middle {max-width: 53rem;}
|
|
.overview-modal .xs-btn-type-icon { display: flex; justify-content: center; align-items: center; background-color: #fff; border-radius: 0.25rem; border: 0.0625rem solid #ddd; padding: 0 0.25rem 0 0.125rem; gap: 0.125rem; min-height: 1.25rem; max-height: 1.25rem; max-width: fit-content; min-width: fit-content; cursor: pointer; }
|
|
.overview-modal .xs-btn-type-icon img { width: 1rem; height: 1rem; }
|
|
.overview-modal .overview-box--wrap { display: flex; gap: 0.5rem; }
|
|
.overview-modal .box-header { display: flex; justify-content: space-between; padding: 0.5rem 0; border-bottom: 0.0625rem solid var(--primary-lv2); color: var(--primary-lv5); font-weight: 500; font-size: 0.875rem; align-items: center; }
|
|
.overview-modal .box-header--right { display: flex; gap: 0.5rem; /* margin-right: 2rem; */}
|
|
.overview-modal .box-header h5 { color: #111; }
|
|
.overview-modal .box-header--right-set { display: flex; gap: 0.5rem; }
|
|
.overview-modal .wrap-2-set { display: flex; flex-direction: column; width: 50%; gap: 0.5rem; }
|
|
.overview-modal .wrap-3-set { display: flex; flex-direction: column; width: 33.3333%; gap: 0.5rem; }
|
|
.overview-modal .wrap-4-set { display: flex; width: 25%; gap: 0.5rem; align-items: center; }
|
|
.overview-modal .box { display: flex; flex-direction: column; gap: 0.5rem; }
|
|
.overview-modal .box-body { padding: 0.5rem 0; display: flex; flex-direction: column; gap: 0.5rem; font-size: 0.875rem; }
|
|
.overview-modal .type--wrap { display: flex; align-items: center; gap: 0.5rem; }
|
|
.overview-modal .type--wrap-left { min-width: 3.5rem; font-weight: 300; color: #777; font-size: 0.75rem; display: flex; }
|
|
.overview-modal .type--wrap-right {width: 100%;}
|
|
.overview-modal .wrap-3-set>.type--wrap>.type--wrap-right { width: 100%; width: 12.5rem; }
|
|
.overview-modal .overview-box--wrap { display: flex; gap: 0.0875rem; }
|
|
.overview-modal h3 { font-size: 0.875rem; font-weight: 500; line-height: 1.25rem; }
|
|
.overview-modal h4 { font-size: 0.875rem; font-weight: 300; line-height: 1.25rem; min-height: 1.5rem; width: 100%; display: flex; align-items: center; }
|
|
.overview-modal h5 { font-size: 0.75rem; font-weight: 400; line-height: 1.25rem; min-width: fit-content; }
|
|
.overview-modal h6 { font-size: 0.75rem; font-weight: 300; line-height: 1.25rem; min-width: fit-content; }
|
|
.overview-modal p { font-size: 0.75rem; font-weight: 300; line-height: 1.25rem; color: #777; }
|
|
.overview-modal p.project-code { min-width: 5.25rem; }
|
|
.overview-modal-header { display: flex; align-items: center; justify-content: space-between; padding: 0.5rem 1rem; border-bottom: 0.0625rem solid #ddd; }
|
|
.overview-modal .project-no {color: #111;}
|
|
.overview-modal-header--end { display: flex; gap: 0.5rem; }
|
|
.overview-modal-header--end img { pointer-events: auto; cursor: pointer; width: 1rem; height: 1rem; }
|
|
.overview-modal-body { padding: 0 1rem 0.5rem; display: flex; flex-direction: column; gap: 0.5rem; max-height: calc(100dvh - 10rem); overflow: hidden auto; }
|
|
.overview-table-container table { width: 100%; table-layout: auto; font-size: 0.765625rem; }
|
|
.overview-table-container th, .overview-modal-table-container td { padding: 0.4375rem 0.65625rem; text-align: center; vertical-align: middle; font-weight: 400; font-size: 0.75rem; }
|
|
.overview-modal .xs-btn-type {border-radius: 0.25rem; border: 0.0625rem solid #ddd; padding: 0 0.25rem; min-height: 1.25rem; max-height: 1.25rem; max-width: fit-content; min-width: fit-content; cursor: pointer; }
|
|
.overview-modal-select-box { background-color: #E9EEED; padding: 0.4375rem; }
|
|
.overview-modal .select,.overview-modal .select .sticky { background-color: #E9EEED; }
|
|
.overview-modal .btn-box { display: flex; gap: 0.875rem; justify-content: center; margin-top: 0.875rem; }
|
|
.overview-modal .modal-btn { display: flex; border: 0.0625rem solid #dddddd; border-radius: 0.25rem; width: 10rem; height: 2.25rem; justify-content: center; align-items: center; color: #111111; font-weight: 500; }
|
|
.overview-modal .modal-btn-green { display: flex; border: 0.0625rem solid #dddddd; border-radius: 0.25rem; width: 10rem; height: 2.25rem; justify-content: center; align-items: center; color: #ffffff; background-color: #1e5149; font-weight: 500; }
|
|
.overview-modal input[type="text"],.overview-modal textarea { border: 0.0625rem solid #ddd; border-radius: 0.25rem; font-size: 0.875rem; line-height: 1.25rem; font-family: 'Pretendard'; color: var(--color-dahong); font-weight: 300; width: 100%; padding: 0.125rem 0.5rem; }
|
|
.overview-modal input[type="text"] { padding: 0.125rem 0.5rem !important; }
|
|
.overview-modal textarea { resize: none; padding: 0.125rem 0.5rem !important; }
|
|
.overview-modal input[type="text"]:focus,.overview-modal textarea:focus { outline: 0.0625rem solid #111; }
|
|
.overview-modal .dropbox { background-color: #eee; border: 0.0625rem solid #ddd; border-radius: 0.25rem; display: flex; flex-direction: column; align-items: center; padding: 0.5rem; position: relative; z-index: 51; min-height: 10rem; justify-content: center;}
|
|
.overview-modal .dropbox-wrap {width: 100%;}
|
|
.overview-modal .dropbox .file-wrap-div {display: flex; border-bottom: 0.063rem solid #ddd; padding: 0.25rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
|
|
.overview-modal .dropbox label { font-weight: 400; font-size: 0.65625rem; color: #aaaaaa; width: 100%; cursor: pointer; }
|
|
.overview-modal .dropbox input[type="file"] { display: none; }
|
|
.overview-modal .dropbox-top { display: flex; gap: 0.5rem; padding: 0.5rem 0 1rem 0; }
|
|
.overview-modal .dropbox-top img { width: 2.5rem; height: 2.5rem; }
|
|
.overview-modal .dropbox-bottom { display: flex; justify-content: space-between; width: 100%; padding: 0.5rem; background-color: #fff; border: 0.0625rem solid #ddd; border-radius: 0.25rem; align-items: center; cursor: pointer; }
|
|
.overview-modal .dropbox-bottom img { width: 1rem; height: 1rem; }
|
|
.overview-modal .dropbox-file-img { width: 1.25rem; height: 1.25rem;}
|
|
.overview-modal .modal-footer { display: flex; justify-content: center; gap: 0.5rem; padding: 1rem; }
|
|
.overview-modal .modal-footer .btn-delete { display: flex; justify-content: center; align-items: center; width: 9.375rem; height: 2.25rem; background-color: #fff; border: 0.0625rem solid #ddd; border-radius: 0.25rem; color: #FF3D00; cursor: pointer; }
|
|
.overview-modal .modal-footer .btn-close { display: flex; width: 9.375rem; height: 2.25rem; justify-content: center; align-items: center; background-color: #fff; border: 0.0625rem solid #ddd; border-radius: 0.25rem; color: #111; cursor: pointer; }
|
|
.overview-modal .modal-footer .btn-active { display: flex; width: 9.375rem; height: 2.25rem; justify-content: center; align-items: center; background-color: #1E5149; border-radius: 0.25rem; color: #fff; cursor: pointer;}
|
|
.overview-modal .calendar-list { border: 0.0625rem solid #ddd; border-radius: 0.25rem; padding: 0.5rem 1rem; display: flex; gap: 0.25rem; min-width: 20.5rem; justify-content: space-between; align-items: center;}
|
|
.overview-modal .calendar-list .schedule-title { display: flex; align-items: center; gap: 0.5rem; }
|
|
.overview-modal .calendar-list h4 { max-width: 40rem; white-space: normal; word-break: break-word; }
|
|
.overview-modal .time-group { display: flex; align-items: center; gap: 0.5rem; font-size: 1rem; font-family: sans-serif; }
|
|
.overview-modal .time-field input { padding: 0.25rem 0.5rem; border: 0.0625rem solid #ddd; border-radius: 0.25rem; font-size: 0.875rem; font-family: 'Pretendard'; font-weight: 300; line-height: 1.25rem; cursor: pointer; }
|
|
.overview-modal .separator { font-size: 0.875rem; color: #777; padding: 0 0.25rem; }
|
|
.overview-modal .radio-wrapper { display: flex; gap: 0.5rem; cursor: pointer; user-select: none; margin: 0.125rem 0; align-items: center; }
|
|
.overview-modal .radio-wrapper input[type="radio"] { display: none; }
|
|
.overview-modal .custom-radio { width: 1.5rem; height: 1rem; border: 0.0625rem solid #ddd; border-radius: 100%; position: relative; }
|
|
.overview-modal .radio-wrapper input[type="radio"]:checked+.custom-radio { border-color: #1E5149; }
|
|
.overview-modal .custom-radio::after { content: ""; position: absolute; display: none; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 0.5rem; height: 0.5rem; border-radius: 100%; background-color: #1E5149; }
|
|
.overview-modal .radio-wrapper input[type="radio"]:checked+.custom-radio::after { display: block; }
|
|
.overview-modal input[type="color"] { width: 1.25rem; min-width: 1.25rem; height: 1.5rem; -webkit-appearance: none; -moz-appearance: none; appearance: none; background-color: transparent; border: none; }
|
|
.overview-modal input[type="color"]::-webkit-color-swatch { border: none; }
|
|
.overview-modal .custom-checkbox input[type="checkbox"] { display: none; }
|
|
.overview-modal .custom-checkbox span { position: relative; width: 1.25rem; height: 1.25rem; border: 0.0625rem solid #ddd; border-radius: 0.25rem; background-color: #fff; display: inline-block; background-size: contain; background-position: center; background-repeat: no-repeat; cursor: pointer; }
|
|
.overview-modal .custom-checkbox input[type="checkbox"]:checked+span { background-image: url(/main/img/overview/icon-checkbox.svg); width: 1.25rem; height: 1.25rem; }
|
|
.overview-modal .color button { width: 1rem; height: 1rem; border-radius: 1rem; background: none; cursor: pointer; margin: 0 0.125rem; border: 0.125rem solid #fff; }
|
|
.overview-modal .label-color.on { outline: 0.0625rem solid #111; border: 0.125rem solid #fff; }
|
|
.overview-modal .work-list { width: calc(100% - 1.75rem); display: flex; gap: 0.5rem; }
|
|
.overview-modal .work-list-number { min-width: 3.75rem; max-width: 3.75rem; overflow-x: hidden; text-overflow: ellipsis; white-space: nowrap; }
|
|
.overview-modal .work-list-date, .overview-modal .work-list-redate, .overview-modal .work-list-changedate { min-width: 7.5rem; max-width: 7.5rem; overflow-x: hidden; text-overflow: ellipsis; white-space: nowrap;}
|
|
.overview-modal .work-list-script { flex-grow: 1; min-width: 13rem; max-width: 13rem; overflow-x: hidden; text-overflow: ellipsis; white-space: nowrap; }
|
|
.overview-modal .work-list-detail { min-width: 20rem; max-width: 20rem; overflow-x: hidden; text-overflow: ellipsis; white-space: nowrap; }
|
|
.overview-modal .work-list li { display: flex; gap: 0.5rem; }
|
|
.overview-modal ul { border-top: 0.0625rem solid #ddd; }
|
|
.overview-modal li { padding: 0.5rem 0; border-bottom: 0.0625rem solid #eee; display: flex; gap: 0.5rem; align-items: center;}
|
|
.overview-modal .section-tabs { display: flex; gap: 0.25rem; align-items: center; margin-left: 0.25rem; overflow-x: auto; white-space: nowrap;}
|
|
.overview-modal .section-tabs._scrollbar::-webkit-scrollbar,.overview-table-container._scrollbar::-webkit-scrollbar, .overview-modal .overview-table-container._scrollbar::-webkit-scrollbar { height: 0.5rem;}
|
|
.overview-modal .section-tabs .xs-btn:hover {cursor: pointer; scale: 1.5; transition: 0.2s;}
|
|
.overview-modal .section-content--cell .xs-btn:hover {cursor: pointer; scale: 1.5; transition: 0.2s;}
|
|
.overview-modal .section-tabs .xs-btn.add {flex-shrink: 0;}
|
|
.overview-modal .click-on { background-color: #E9EEED; color: #1E5149; border: 0.0625rem solid #E9EEED !important; }
|
|
.overview-modal .tab { display: flex; flex: 0 0 auto; gap: 0.5rem; padding: 0.5rem 0.5rem 0.5rem 1rem; border: 0.0625rem solid #ddd; border-bottom: none; border-radius: 0.25rem 0.25rem 0 0; align-items: center; cursor: pointer; }
|
|
.overview-modal .tab-style-input { border: none !important; padding: 0rem !important; width: 7rem !important; }
|
|
.overview-modal .tab-style-input:focus { outline: none !important; }
|
|
.overview-modal .section-content { display: flex; flex-direction: column; gap: 0.5rem; background-color: var(--primary-lv0); padding: 0.5rem 1rem; border-radius: 0.25rem; }
|
|
.overview-modal .section-content--cell { display: flex; gap: 0.5rem; align-items: center; justify-content: center; }
|
|
.overview-modal .add-cell-btn { color: var(--primary-lv5); padding: 0.25rem 0; border: 0.0625rem solid var(--primary-lv2); border-radius: 0.25rem; gap: 0.25rem; align-items: center; justify-content: center; cursor: pointer; }
|
|
.overview-modal .xs-btn img { width: 0.75rem; height: 0.75rem; }
|
|
.overview-modal .joint-contract-add,.overview-modal .joint-contract-delete { color: #000; background-color: #fff; border-radius: 0.25rem; border: 0.063rem solid #ddd; padding: 0 0.25rem; min-height: 1.25rem; max-height: 1.25rem; max-width: fit-content; min-width: fit-content; cursor: pointer; font-size: 0.75rem; font-weight: 300; line-height: 1.25rem; }
|
|
.overview-modal-tooltip { position: absolute; display: inline-block; background: #444; color: #fff; padding: 0.25rem 0.5rem; border-radius: 0.25rem; font-size: 0.8rem; white-space: nowrap; transition: opacity 0.3s ease; visibility: hidden; pointer-events: none; z-index: 52;}
|
|
.overview-modal .overview-table-container { overflow-x: auto; max-width: 100%; }
|
|
.overview-modal .overview-table-container table { border-collapse: collapse; width: 100%; color: #777; }
|
|
.overview-modal .overview-table-container td { padding: 0.25rem; font-size: 0.875rem; font-weight: 300; line-height: 1.25rem; color: #111; min-width: 5rem;}
|
|
.overview-modal .overview-table-container th { padding: 0.25rem; text-align: left; color: #777; font-size: 0.75rem; font-weight: 300; line-height: 1.25rem; min-width: 5rem; }
|
|
.overview-modal .overview-table-container th.sticky,.overview-modal .overview-table-container td.sticky { position: sticky; left: 0; background-color: #fff; font-size: 0.75rem; font-weight: 300; line-height: 1.25rem; min-width: 4rem; color: #777 !important; }
|
|
.overview-modal .xs-btn.remove-img { position: absolute; top: 0; right: 0; margin: 0.5rem; background-color: #fff; border: 0.0625rem solid #ddd; border-radius: 0.25rem; padding: 0.125rem; display: flex; align-items: center; justify-content: center; }
|
|
.overview-modal .xs-btn.remove-img img { width: 0.75rem; height: 0.75rem; }
|
|
.overview-modal .order.work-list-number { width: 3.75rem; }
|
|
.overview-modal .suspension-date.work-list-date, .overview-modal .suspension-reason.work-list-script, .overview-modal .resumption-date.work-list-redate, .overview-modal .change-date.work-list-changedate { width: 7.5rem; }
|
|
.overview-modal .consuletation-content.work-list-detail { width: 13rem; }
|
|
.overview-modal .xs-btn.cell-remove {width: 2rem; height: 1rem; background-color: #fff; border: 0.063rem solid #ddd; border-radius: 0.25rem; display: flex; align-items: center; justify-content: center;}
|
|
.overview-modal .body-not-gap { gap: 0.5rem !important; padding: 1rem !important; }
|
|
.overview-modal .body-not-bottom { padding-bottom: 0 !important; }
|
|
|
|
.overview-modal input[type=date]{position: relative; -webkit-appearance: none; appearance: none; -moz-appearance: none; background: url(/main/img/overview/icon__calendar--aaa.svg) no-repeat; background-position: right 0.25rem center; padding-right: 0.5rem; background-size: 1rem 1rem; padding-right: 2rem; border: 0.0625rem solid #ddd; box-sizing:border-box; height: 1.75rem; border-radius: 0.25rem; width: 100%; padding: 0.125rem 0.5rem; color: #FF3D00; font-size: 0.875rem; font-weight: 300;}
|
|
.overview-modal input[type=time]{position: relative; -webkit-appearance: none; appearance: none; -moz-appearance: none; background: url(/main/img/overview/icon__time--aaa.svg) no-repeat; background-position: right 0.25rem center; padding-right: 0.5rem; background-size: 1rem 1rem; padding-right: 2rem; border: 0.0625rem solid #ddd; box-sizing:border-box; height: 1.75rem; border-radius: 0.25rem; width: 100%; padding: 0.125rem 0.5rem; color: #FF3D00; font-size: 0.875rem; font-weight: 300; min-width: 6.5rem;}
|
|
.overview-modal input[type=date]::-webkit-calendar-picker-indicator, .overview-modal input[type=time]::-webkit-calendar-picker-indicator { position:absolute; right: 0; top: 0; width: 100%; height: 100%; background: transparent; cursor: pointer;}
|
|
.overview-modal input[type=date]:hover, .overview-modal input:hover[type=time]{border: 0.063rem solid #111; cursor: pointer; background-color: #eee;}
|
|
|
|
/* overview swiper */
|
|
.overview .vb-swiper .swiper { width: 100%; height: 100%; position: relative; background: #eee; }
|
|
.overview .vb-swiper .swiper-slide { width: 36rem !important; height: 22rem;}
|
|
.overview .vb-swiper .swiper .swiper-slide img { width: 100%; height: 100%; display: block; object-fit: contain; }
|
|
.overview .vb-swiper .swiper .swiper-wrapper { display: flex; align-items: center;}
|
|
.overview .vb-swiper .swiper-button-prev, .overview .vb-swiper .swiper-button-next { position: absolute; top: 55%; width: 2rem; height: 2rem; transform: translateY(-50%); background-size: cover; cursor: pointer; z-index: 10; border: 0.0625rem solid #ddd; border-radius: 1rem; background-color: #fff; }
|
|
.overview .swiper-button-prev::after,.overview .swiper-button-next::after { display: none}
|
|
.overview .body-not-gap { gap: 0.5rem !important; padding: 1rem !important; }
|
|
.overview .body-not-bottom { padding-bottom: 0 !important; } |