@charset "utf-8";

/* CSS Document */

:root {
	--black: #000;
	--blue1: #2B3390;
	--blue1-h: #3358c5;
	--blue1-h-t: #3358c533;
	--blue2: #18B6FF;
	--gray-bg: #f2f2f7;
	--heading: #495057;
	--gray-blue: #878a99;
	--gray-blue-h: #5c617d;
	--red-error: #df0000;
	--red-error-t: #df000033;
}
html { font-size: 10px; }
body { font-family: "LINE Seed JP", "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Osaka", "MS PGothic", "ＭＳ Ｐゴシック", "MS Gothic", sans-serif; font-size: 1.4rem; margin: 0px; text-align: center; line-height: 1.42857142857; color: var(--black); word-wrap: break-word; -webkit-text-size-adjust: none; image-rendering: -webkit-optimize-contrast; background-color: var(--gray-bg); overflow-y: scroll; }
body::-webkit-scrollbar { width: 10px; height: 10px; }
body::-webkit-scrollbar-track { background: var(--gray-bg); border-radius: 0px; border-left: #ddd solid 1px; }
body::-webkit-scrollbar-thumb { background: linear-gradient(to right, #ddd 1px, var(--gray-blue) 1px); border: var(--gray-bg) solid 1px; border-left-color: #ddd; border-radius: 5px 3px 3px 5px; min-height: 50px; opacity: 0.75; }
body::-webkit-scrollbar-thumb:hover { background: linear-gradient(to right, #ddd 1px, var(--gray-blue-h) 1px); }
body::-webkit-scrollbar-corner { background-color: #ddd; }

p, form { margin: 0px; padding: 0px; }
img { border: none; margin: 0px; padding: 0px; backface-visibility: hidden; -webkit-backface-visibility: hidden; max-width: 100%; height: auto; }
a { text-decoration: none; outline: none; color: var(--gray-blue); }
a:hover { color: var(--gray-blue-h); }
a, a img, input, textarea, select, button { transition: all 0.15s ease-in-out; outline: none; }
h1, h2, h3, h4, ul, dl, dt, dd { margin: 0px; padding: 0px; font-weight: normal; list-style: none; }
*, *:before, *:after { box-sizing: border-box; }

[x-cloak] { display: none !important; }

icon, [data-icon]:before { font-family: "Material Symbols Rounded"; font-weight: normal; font-style: normal; font-size: 1.6rem; line-height: 1; letter-spacing: normal; text-transform: none; display: inline-block; white-space: nowrap; word-wrap: normal; direction: ltr; -webkit-font-feature-settings: 'liga'; -webkit-font-smoothing: antialiased; font-variation-settings: 'FILL' 1; user-select: none; vertical-align: middle; margin-top: -0.15em; }
[data-icon]:before { content: attr(data-icon); }

tooltip { font-size: 1rem; line-height: 1.4; background-color: #333; position: absolute; top: -18px; left: 50%; transform: translateX(-50%); color: #fff; white-space: nowrap; padding: 3px 5px 1px 5px; border-radius: 3px; pointer-events: none; transition: all 0.15s ease-out; transition-delay: 0s; opacity: 0; text-align: center; min-width: 36px; box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.1); user-select: none; z-index: 500; }
tooltip:before { content: ''; border: solid 3px; border-color: #333 #333 transparent transparent; position: absolute; bottom: -3px; left: 50%; margin-left: -3px; transform: rotate(135deg); }
tooltip.on { opacity: 1; transition-delay: 500ms; }

.button { appearance: none; -webkit-appearance: none; font-family: inherit; border: none; border-radius: 50px; cursor: pointer; font-weight: bold; background-color: var(--gray-blue); color: #fff; padding: 16px 45px 16px 50px; line-height: 1; position: relative; margin: 0px; display: inline-block; font-size: inherit; text-align: center; user-select: none; }
.button icon { margin: 0px; width: 36px; height: 36px; display: flex; align-items: center; justify-content: center; position: absolute; left: 5px; top: 5px; font-size: 2rem; transition: all 0.15s ease-out; padding-right: 1px; }
.button:hover, .button:focus { background-color: var(--gray-blue-h); }
.button:hover icon { transform: translateX(3px); }
.button:focus { box-shadow: 0px 0px 0px 3px rgb(from var(--gray-blue-h) r g b / 0.2); }
.button.submit { background-color: var(--blue1); }
.button.submit:hover, .button.submit:focus { background-color: var(--blue1-h); }
.button.submit:focus { box-shadow: 0px 0px 0px 3px rgb(from var(--blue1-h) r g b / 0.2); }
.button.submit icon { border-radius: 50%; }
.button.submit icon:before { content: ''; width: 100%; height: 100%; top: 0px; left: 0px; position: absolute; border: 2px solid; border-color: #fff transparent; border-radius: 50%; animation: spin 2s linear infinite; visibility: hidden; opacity: 0; transition: all 0.15s ease-out; }
@keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }

.submitted { cursor: wait; }
.submitted * { pointer-events: none; }
.submitted .button.submit { opacity: 0.7; box-shadow: none; }
.submitted .button.submit icon { transform: scale(0.8); }
.submitted .button.submit icon:before { visibility: visible; opacity: 1; }

.input, .select:after { width: 100%; max-width: 100%; appearance: none; -webkit-appearance: none; font-family: inherit; line-height: inherit; font-size: inherit; border: #ccc solid 1px; border-radius: 5px; padding: 10px 12px; margin: 0px; text-align: left; }
.input::placeholder { color: #ccc; }
.input:hover, .input:focus { border-color: var(--blue1-h); }
.input:focus { box-shadow: 0px 0px 0px 3px var(--blue1-h-t); }
.ng .input { border-color: var(--red-error); }
.ng .input:focus { box-shadow: 0px 0px 0px 3px var(--red-error-t); }

.pw_input { position: relative; }
.pw_input .input { padding-right: 42px; }
.pw_input span { position: absolute; right: 0px; top: 0px; width: 42px; height: 100%; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.pw_input icon { margin: 0px; color: var(--gray-blue); transition: all 0.15s ease-in-out; padding-top: 1px; }
.pw_input icon:hover { color: var(--gray-blue-h); }
.pw_input tooltip { margin-top: 5px; }

.select { position: relative; }
.select:before { content: 'keyboard_arrow_down'; position: absolute; right: 0px; top: 0px; width: 42px; height: 100%; cursor: pointer; display: flex; align-items: center; justify-content: center; margin: 0px; color: var(--gray-blue); transition: all 0.15s ease-in-out; padding-top: 1px; pointer-events: none; z-index: 1; font-size: 2rem; }
.select:hover:before , .select:focus:before { color: var(--blue1-h); }
.select:after { content: attr(data-placeholder); border: none; background: none; position: absolute; left: 1px; top: 1px; width: auto; color: #ccc; pointer-events: none; }
.select:not(.empty):after { display: none; }
.select.empty .input { color: #fff; }
.select .input { padding-right: 42px; transition: all 0.15s ease-in-out, color 0s; }

.idate { position: relative; }
.idate:before { content: 'calendar_month'; position: absolute; right: 0px; top: 0px; width: 42px; height: 100%; cursor: pointer; display: flex; align-items: center; justify-content: center; margin: 0px; color: var(--gray-blue); transition: all 0.15s ease-in-out; pointer-events: none; z-index: 1; font-size: 2.2rem; }
.idate .input { padding-right: 42px; }

.field { text-align: left; }
.field .label { display: flex; justify-content: space-between; margin-bottom: 5px; }
.field .label > span { color: var(--heading); }
.field .error { display: grid; grid-template-rows: 0fr; transition: grid-template-rows 0.3s ease-out; overflow: hidden; }
.field .error span { min-height: 0; }
.field .error i { font-size: 1.2rem; padding-left: 20px; margin-top: 5px; display: block; font-style: normal; color: var(--red-error); position: relative; }
.field .error i:before { content: 'error'; position: absolute; margin-top: 0.02em; left: 0px; }
.field.ng .label > span, .field.ng_x .label > span { color: var(--red-error); }
.field.ng .error, .field.ng_x .error { grid-template-rows: 1fr; }

.auth_wrap { display: flex; align-items: center; justify-content: center; height: 100%; width: 100%; position: fixed; flex-direction: column; padding: 20px; }
.auth_wrap .inner { background-color: #fff; width: 440px; border-radius: 10px; padding: 20px 30px 30px 30px; box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.05); display: flex; flex-direction: column; align-items: center; }
.auth_wrap .logo { display: flex; flex-direction: column; align-items: center; border-bottom: var(--blue1) solid 2px; width: 100%; padding: 0px 30px 15px 0px; margin-bottom: 30px; }
.auth_wrap .logo span { font-size: 1.1rem; color: #ccc; margin: -5px 0px 0px 70px; }
.auth_wrap .copy { font-size: 1.2rem; color: #999; margin-top: 20px; }
.auth_wrap form { width: 100%; }
.auth_wrap .field:not(:last-child) { margin-bottom: 20px; }

.auth_wrap nav { border-top: #ccc solid 2px; margin-top: 30px; padding-top: 20px; }
.auth_wrap nav button {}

.particle { position: absolute; left: 0px; top: 0px; width: 100%; height: 40%; background: url(../img/bg01.jpg) no-repeat center; background-size: cover; z-index: -1; pointer-events: none; }
.particle:after { content: ''; position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; background-color: var(--blue1); opacity: 0.93; }
.particle canvas { z-index: 1; position: relative; }
.particle svg { position: absolute; left: 0px; bottom: 0px; width: 100%; fill: var(--gray-bg); z-index: 2; }

/* list */

.left_nav { background-color: var(--blue1); position: fixed; top: 0px; left: 0px; height: 100%; width: 90px; z-index: 500; display: flex; flex-direction: column; }
.left_nav .logo { background: linear-gradient(to bottom, #fff, #ffffffdd); margin: 10px; padding: 8px 5px; border-radius: 3px; }
.left_nav .logo img { display: block; margin: 0 auto; margin-bottom: 8px; width: 50px; }
.left_nav .logo span { font-size: 0.8rem; display: block; line-height: 1.2; color: var(--gray-blue); }
.left_nav > ul { border-top: #454b97 dotted 1px; }
.left_nav > ul > li { border-bottom: #454b97 dotted 1px; }
.left_nav > ul > li > a { display: block; color: #fff; padding: 15px 2px 8px 2px; font-size: 1.2rem; }
.left_nav > ul > li > a icon { font-size: 3rem; margin-bottom: 2px; }
.left_nav > ul > li > a span { display: block; letter-spacing: -0.04em; }
.left_nav > ul > li > a:hover { background-color: var(--blue1-h-t); }
.left_nav > ul > li.on > a { color: var(--gray-blue-h); background: linear-gradient(to right, #fff 50%, var(--gray-bg)); cursor: default; }
.left_nav > ul > li.on > a span { font-weight: bold; }
.left_nav .ver { margin-top: auto; color: #ffffff82; font-size: 1rem; padding: 10px; }

.main_col { padding: 65px 15px 15px 105px; min-height: 100vh; }
.main_col .head { position: fixed; top: 0px; left: 90px; width: calc(100% - 90px); z-index: 400; display: flex; align-items: center; padding: 5px 15px; height: 50px; justify-content: space-between; gap: 15px; }
.main_col .head:before { content: ''; position: absolute; width: 100%; height: 100%; left: 0px; top: 0px; box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3); z-index: 2; pointer-events: none; background-color: var(--gray-blue); }
.main_col .head form { position: relative; width: 300px; z-index: 2; }
.main_col .head form input { width: 100%; appearance: none; -webkit-appearance: none; border: none; border-radius: 30px; padding: 7px 10px 7px 30px; box-shadow: inset 0px 0px 2px rgba(0, 0, 0, 0.1); color: var(--heading); font-family: inherit; background-color: #fff; }
.main_col .head form input::placeholder { color: #ccc; }
.main_col .head form input:focus + icon { color: var(--blue1); }
.main_col .head form icon { position: absolute; z-index: 1; height: 100%; margin: 0px; display: flex; align-items: center; font-size: 2rem; color: #999; top: 0px; left: 8px; transition: all 0.15s ease-in-out; pointer-events: none; }
.main_col .head > ul { display: flex; align-items: center; gap: 10px; color: #fff; }
.main_col .head > ul .b1 { margin-right: 5px; position: relative; z-index: 2; }
.main_col .head > ul .b1 a { background-color: #fff; border-radius: 20px; padding: 2px 14px; display: block; font-size: 1.3rem; }
.main_col .head > ul .b1 a:hover { background-color: var(--gray-bg); color: var(--blue1-h); }

.main_col .head > ul .b2 > span { display: block; position: relative; padding: 5px; z-index: 2; border-radius: 50%; cursor: pointer; transition: all 0.15s ease-in-out; }
.main_col .head > ul .b2 > span icon { font-size: 2.4rem; margin: 0px; transition: all 0.15s ease-in-out; }
.main_col .head > ul .b2 > span i { position: absolute; font-style: normal; background-color: var(--red-error); color: #fff; font-size: 0.9rem; line-height: 1; display: flex; align-items: center; justify-content: center; min-width: 16px; height: 16px; border-radius: 50%; font-weight: bold; padding: 1px 4px 0px 4px; top: -2px; right: -2px; border: #fff solid 1px; box-shadow: 0px 0px 0px 2px var(--gray-blue); }
.main_col .head > ul .b2 > span.on { background-color: #73738b; }
.main_col .head > ul .b2 ul { position: fixed; width: 320px; height: 100%; right: 0px; top: 50px; background-color: #fff; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2); z-index: 1; text-align: left; padding: 10px 5px; transform: translateX(330px); transition: all 0.2s ease-in-out; }
.main_col .head > ul .b2 > span.on + ul { transform: translateX(0px); }
.main_col .head > ul .b2 ul li:not(:last-child) { border-bottom: #ddd dotted 1px; }
.main_col .head > ul .b2 ul a { font-size: 1.3rem; display: flex; justify-content: space-between; gap: 10px; white-space: nowrap; align-items: center; padding: 10px; }
.main_col .head > ul .b2 ul a span { display: block; overflow: hidden; text-overflow: ellipsis; }
.main_col .head > ul .b2 ul a icon { margin-right: 5px; }
.main_col .head > ul .b2 ul a i { font-size: 1.1rem; }
.main_col .head > ul .b2 .bg { position: fixed; width: 100%; height: 100%; top: 0px; left: 0px; background-color: #00000033; transition: all 0.2s ease-in-out; opacity: 0; visibility: hidden; }
.main_col .head > ul .b2 > span.on + ul + .bg { opacity: 1; visibility: visible; }

.main_col .head > ul .b3 { position: relative; padding: 4px 0px; z-index: 2; }
.main_col .head > ul .b3 > span { display: block; padding: 5px; transition: all 0.15s ease-in-out; cursor: pointer; }
.main_col .head > ul .b3 > span icon { font-size: 2.6rem; margin: 0px; }
.main_col .head > ul .b3 ul { position: absolute; white-space: nowrap; right: 0px; top: 100%; margin-top: -1px; text-align: left; background-color: #fff; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2); font-size: 1.2rem; border-radius: 5px; border: #ddd solid 1px; transition: all 0.2s ease-out; visibility: hidden; opacity: 0; transform: translateY(-5px); z-index: 2; }
.main_col .head > ul .b3 ul li:not(:last-child) { border-bottom: #ddd solid 1px; }
.main_col .head > ul .b3 ul a { display: block; padding: 6px 12px 6px 8px; }
.main_col .head > ul .b3 ul icon { margin-right: 5px; }
.main_col .head > ul .b3 ul:before { content: ''; width: 10px; height: 10px; border: #ddd solid; border-width: 1px 1px 0px 0px; position: absolute; background-color: #fff; top: -6px; right: 12px; transform: rotate(-45deg); }
.main_col .head > ul .b3:hover > span { color: var(--gray-bg); }
.main_col .head > ul .b3:hover ul { visibility: visible; opacity: 1; transform: translateY(0px); }

.cbox { background-color: #fff; border-radius: 5px; box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.1); padding: 15px; }
.cbox:not(:last-child) { margin-bottom: 15px; }

.app_head { display: flex; margin: -15px -15px 15px -15px; padding: 13px 15px 10px 15px; background-color: #fff; box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.1); gap: 10px; font-size: 1.3rem; }
.app_head div a { display: block; padding: 5px 10px 5px 8px; background-color: #ff8f00; color: #fff; border-radius: 5px; white-space: nowrap; }
.app_head div a icon { margin-right: 5px; }
.app_head ul { display: flex; gap: 5px; flex-flow: row wrap; padding-left: 10px; border-left: #ccc dotted 1px; }
.app_head li a { background-color: var(--gray-blue); color: #fff; border-radius: 0px 5px 5px 5px; display: block; padding: 5px 6px 5px 8px; position: relative; }
.app_head li a:before { content: ''; position: absolute; pointer-events: none; left: 0px; top: -3px; width: 30px; height: 10px; border-radius: 3px 10px 0px 0px; background-color: var(--gray-blue); opacity: 0.75; }
.app_head li a i { font-style: normal; background-color: #fff; color: var(--gray-blue); border-radius: 2px; margin-left: 5px; padding: 1px 2px; font-size: 1.2rem; }
.app_head li.f0 a, .app_head li.f0 a:before { background-color: #3795c3; }
.app_head li.f0 a i { color: #3795c3; }
.app_head li.f1 a, .app_head li.f1 a:before { background-color: #d54700; }
.app_head li.f1 a i { color: #d54700; }
.app_head li.f80 a, .app_head li.f80 a:before { background-color: #dfbc02; }
.app_head li.f80 a i { color: #dfbc02; }
.app_head li.f90 a, .app_head li.f90 a:before { background-color: #58ab00; }
.app_head li.f90 a i { color: #58ab00; }
.app_head li a:hover { opacity: 0.75; }

.app_search form { display: flex; justify-content: space-between; align-items: center; }
.app_search .wrap { text-align: left; flex-grow: 1; max-width: calc(100% - 200px); }
.app_search dl { display: flex; justify-content: space-between; }
.app_search dl:not(:last-child) { padding-bottom: 10px; margin-bottom: 10px; border-bottom: #ccc dotted 1px; }
.app_search dt { width: 100px; color: var(--gray-blue-h); border-right: #ccc dotted 1px; display: flex; align-items: center; font-weight: bold; }
.app_search dd { display: flex; flex-flow: row wrap; width: calc(100% - 115px); gap: 6px 10px; }

.app_search .field { display: flex; position: relative; }
.app_search .field .label { background-color: var(--gray-blue); color: #fff; font-size: 1.1rem; padding: 2px 5px 0px 5px; display: flex; align-items: center; border-radius: 3px 0px 0px 3px; font-weight: bold; margin: 0px; white-space: nowrap; margin-right: -1px; z-index: 1; }
.app_search .field .label > span { color: #fff; }
.app_search .field .error { display: none; }
.app_search .input { border-radius: 0px 3px 3px 0px; }
.app_search .select:before { width: 24px; }
.app_search .select:after, .app_search .input { font-size: 1.2rem; padding: 3px 8px; line-height: inherit; }
.app_search .select .input { padding-right: 20px; }
.app_search .input:focus { box-shadow: 0px 0px 0px 2px var(--blue1-h-t); }
.app_search .idate { width: 170px; }
.app_search .idate:before { width: 30px; font-size: 1.8rem; }
.app_search .idate .input { padding-right: 28px; }

.app_search nav { width: 180px; border-left: #ccc dotted 1px; padding-left: 20px; }
.app_search nav .button.submit { padding: 12px 20px 12px 36px; font-size: 1.4rem; }
.app_search nav .button.submit icon { top: 5px; left: 5px; width: 28px; height: 28px; }
.app_search nav span { font-size: 1.2rem; color: var(--gray-blue); display: inline-block; margin-bottom: 8px; cursor: pointer; margin-right: 5px; }
.app_search nav span:hover { color: var(--gray-blue-h); }
.app_search nav span icon { margin-right: 3px; }

.flatpickr-calendar { font-size: 1.2rem; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2); border: #ddd solid 1px; width: 232px; }
.flatpickr-calendar:before, .flatpickr-calendar:after { background-color: #fff; border: #ddd solid; border-width: 1px 1px 0px 0px; width: 10px; height: 10px; transform: rotate(-45deg); left: 15px; top: -6px; }
.flatpickr-calendar:after { display: none; }
.flatpickr-calendar.arrowTop { margin-top: 2px; }
.flatpickr-calendar .flatpickr-weekdays { padding: 0px 3px; background-color: var(--gray-bg); border-bottom: #ddd solid 1px; }
.flatpickr-calendar span.flatpickr-weekday:first-child { color: #ff6363; }
.flatpickr-calendar span.flatpickr-weekday:last-child { color: #477feb; }
.flatpickr-calendar .dayContainer { width: 224px; min-width: 224px; max-width: 224px; }
.flatpickr-calendar .flatpickr-days { width: auto; padding: 2px 3px 3px 3px; }
.flatpickr-calendar .flatpickr-day { width: 32px; height: 30px; flex-basis: calc(100% / 7); margin-top: 1px; line-height: 1; display: flex; align-items: center; justify-content: center; border-radius: 2px; }
.flatpickr-day { color: var(--gray-blue-h); }
.flatpickr-day.selected.startRange, .flatpickr-day.startRange.startRange, .flatpickr-day.endRange.startRange { z-index: 1; }
.flatpickr-months .flatpickr-month { border-bottom: #ddd solid 1px; }
.flatpickr-months .flatpickr-prev-month, .flatpickr-months .flatpickr-next-month { display: flex; align-items: center; justify-content: center; }
.flatpickr-months .flatpickr-prev-month:hover svg, .flatpickr-months .flatpickr-next-month:hover svg { fill: var(--blue1); }
.flatpickr-current-month { padding-top: 6px; }
.flatpickr-current-month .flatpickr-monthDropdown-months { font-size: 1.3rem; font-weight: bold; padding: 3px 5px; border-radius: 2px; color: var(--heading); }
.flatpickr-current-month input.cur-year { font-size: 1.3rem; font-weight: bold; padding: 4px 10px; border-radius: 2px; color: var(--heading); }

.pager { display: flex; flex-flow: row wrap; gap: 1px; }
.pager a, .pager span { display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; background-color: var(--gray-bg); }
.pager > *:first-child { border-radius: 2px 0px 0px 2px; }
.pager > *:last-child { border-radius: 0px 2px 2px 0px; }
.pager span { background-color: var(--gray-blue); color: #fff; }

.app_list { text-align: left; padding: 0px; }
.app_list table { width: 100%; border-collapse: collapse; font-size: 1.2rem; }
.app_list thead { position: sticky; top: 50px; z-index: 1; }
.app_list thead th { border-bottom: #ddd solid 2px; padding: 14px 8px; font-weight: bold; white-space: nowrap; background-color: var(--blue1); color: #fff; }
.app_list thead th:first-child { border-top-left-radius: 5px; }
.app_list thead th:last-child { border-top-right-radius: 5px; }
.app_list thead th:not(:last-child) { border-right: #ddd dotted 1px; }
.app_list thead th.cn { text-align: center; }
.app_list tbody td { padding: 10px 8px; border-bottom: #ddd solid 1px; color: var(--heading); background-color: #fff; cursor: pointer; }
.app_list tbody tr:nth-child(odd) td { background-color: #f9f9f9; }
.app_list tbody tr:hover td, .app_list tbody tr.on td { background-color: #ebf4ff; }
.app_list tbody tr.new td { background-color: #ffe9e9; }
.app_list tbody td:not(:last-child) { border-right: #ddd dotted 1px; }
.app_list tbody td.c01 { font-size: 1.1rem; text-align: center; width: 68px; }
.app_list tbody td.c02 { width: 80px; font-weight: bold; white-space: nowrap; text-align: center; }
.app_list tbody td.c02 a { color: var(--heading); }
.app_list tbody td.c02 a:hover, .app_list tbody tr:hover td.c02 a { color: var(--blue1-h); }
.app_list tbody td.c02 div { font-size: 1rem; padding-top: 3px; }
.app_list tbody td.c02 div a { background-color: #ff6307; color: #fff !important; padding: 2px 4px; border-radius: 2px; }
.app_list tbody td.c02 div a:hover { background-color: var(--blue1); }
.app_list tbody td.c03 { width: 150px; font-weight: bold; }
.app_list tbody td.c03 div { position: relative; padding-left: 25px; }
.app_list tbody td.c03 span { background-color: #ccc; display: inline-block; width: 20px; height: 20px; line-height: 1; padding: 3px 2px; border-radius: 50%; font-weight: bold; text-align: center; position: absolute; left: 0px; top: -1px; font-size: 1.4rem; white-space: nowrap; }
.app_list tbody td.c03 span.s1 { background-color: #2b3390; color: #fff; }
.app_list tbody td.c03 span.s2 { background-color: #3fc53a; color: #fff; }
.app_list tbody td.c03 span.s3 { background-color: #ffaa07; color: #fff; }
.app_list tbody td.c04 { width: 30px; text-align: center; }
.app_list tbody td.c04 span { display: inline-block; position: relative; }
.app_list tbody td.c04 span i { background-color: var(--red-error); color: #fff; font-style: normal; position: absolute; font-size: 1rem; width: 16px; height: 16px; border-radius: 50%; display: flex; align-items: center; justify-content: center; top: -5px; right: -5px; border: #fff solid 1px; line-height: 1; padding: 2px 0px 0px 1px; }
.app_list tbody td.c04 icon { font-size: 2rem; margin: 0px; color: var(--gray-blue); margin-top: 1px; }
.app_list tbody td.c04 icon.t1 { color: #2174e1; }
.app_list tbody td.c04 icon.t2 { color: #07b53b; }
.app_list tbody td.c04 icon.t3 { color: #ff6307; }
.app_list tbody td.c05 { width: 140px; }
.app_list tbody td.c06 { text-align: center; width: 78px; }
.app_list tbody td.c07 { width: 80px; }
.app_list tbody td.c08 {  }
.app_list tbody td.c08 .em { min-width: 100px; word-break: break-all; max-width: calc(100vw - 1400px); }
.app_list tbody td.c08 .sms { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.app_list tbody td.c09, .app_list tbody td.c10 { text-align: center; width: 100px; cursor: default; }
.app_list tbody td.c11 { width: 140px; }
.app_list tbody td.c11 .tags { display: flex; gap: 2px; flex-flow: row wrap; overflow: hidden; max-height: 32px; }
.app_list tbody td.c11 .tags span { background-color: var(--gray-blue); font-size: 1rem; padding: 3px 3px 2px 3px; border-radius: 2px; color: #fff; line-height: 1; }
.app_list tbody td.c11 .tags span.t1 { background-color: #3aa5c5; }
.app_list tbody td.c11 .tags span.t2 { background-color: #c54d3a; }
.app_list tbody td.c11 .tags span.t3 { background-color: #0ba505; }
.app_list tbody td.c11 .tags span.t4 { background-color: #d9ac2a; }
.app_list tbody td.c11 .tags span.t5 { background-color: #0a449b; }
.app_list tbody td.c12 { text-align: center; width: 60px; }
.app_list tbody td.c12 { text-align: center; width: 60px; }
.app_list tbody td.c13 { font-size: 1.1rem; }
.app_list tbody .iedit > div { position: relative; }
.app_list tbody .iedit > div > span { transition: all 0.15s ease-in-out; cursor: pointer; display: inline-block; line-height: 1.4; font-size: 1.1rem; }
.app_list tbody .iedit > div > span:hover { color: var(--blue1-h); }
.app_list tbody .iedit > div.on > span { color: var(--blue1); }
.app_list tbody .iedit .fm { position: absolute; width: 180px; left: 50%; bottom: 100%; margin-bottom: 5px; background-color: #fff; z-index: 1; padding: 5px; border: #ddd solid 1px; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2); border-radius: 5px; margin-left: -90px; transition: all 0.2s ease-out; opacity: 0; visibility: hidden; transform: translateY(5px); }
.app_list tbody .iedit > div.on .fm { opacity: 1; visibility: visible; transform: translateY(0px); }
.app_list tbody .iedit .fm:before { content: ''; width: 10px; height: 10px; border: #ddd solid; border-width: 1px 1px 0px 0px; background-color: #fff; position: absolute; left: 50%; margin-left: -5px; bottom: -6px; transform: rotate(135deg); }
.app_list tbody .iedit .select { margin-bottom: 5px; }
.app_list tbody .iedit .select:before { width: 24px; }
.app_list tbody .iedit .input { padding: 5px 20px 5px 8px; border-radius: 3px; }
.app_list tbody .iedit .fm .nav { display: flex; gap: 5px; position: relative; z-index: 1; }
.app_list tbody .iedit .fm button, .app_list tbody .iedit .fm span { display: flex; appearance: none; -webkit-appearance: none; border: none; background: none; font-family: inherit; font-size: 1.2rem; font-weight: normal; line-height: 1; padding: 4px 2px; margin: 0px; border-radius: 2px; cursor: pointer; align-items: center; justify-content: center; width: 50%; transition: all 0.15s ease-in-out; }
.app_list tbody .iedit .fm button { background-color: var(--blue1); color: #fff; flex-grow: 1; }
.app_list tbody .iedit .fm button:hover { background-color: var(--blue1-h); }
.app_list tbody .iedit .fm span { background-color: var(--gray-bg); font-size: 1.1rem; }
.app_list tbody .iedit .fm span:hover { opacity: 0.75; }

@media screen and (max-width: 1600px) {
	.app_list tbody td.c03 { width: 120px; }
	.app_list tbody td.c11 { width: 120px; }
}

.app_list nav { display: flex; padding: 8px; justify-content: space-between; align-items: center; }
.app_list nav .stat { padding: 0px 5px; font-size: 1.2rem; color: var(--gray-blue); }
.app_list nav .stat span { color: var(--heading); }
.app_list nav .stat b { font-size: 1.4rem; }

.app_detail { display: flex; gap: 10px; text-align: left; align-items: flex-start; }
.app_detail .hd1 { font-size: 1.4rem; font-weight: normal; padding: 10px 15px; background-color: var(--blue1); color: #fff; border-radius: 5px 5px 0px 0px; }
.app_detail .hd1 icon { margin-right: 5px; font-size: 2.2rem; }
.app_detail h3 { font-size: 1.4rem; border-bottom: #ddd solid 2px; color: var(--blue1); margin-bottom: 15px; padding-bottom: 5px; font-weight: bold; }
.app_detail h3:not(:first-child) { margin-top: 20px; }

.app_detail .app_det1 { width: calc(100% - 880px); padding: 0px; margin: 0px; position: sticky; top: 60px; }
.app_det1 .tabs { display: flex; font-size: 1.4rem; position: relative; }
.app_det1 .tabs li { flex-grow: 1; padding: 10px 5px; color: var(--heading); cursor: pointer; user-select: none; border-right: #ddd solid 1px; text-align: center; transition: all 0.15s ease-in-out; }
.app_det1 .tabs li:after { content: ''; background-color: var(--blue1); opacity: 0; pointer-events: none; position: absolute; left: 0px; bottom: 0px; height: 2px; width: 100%; }
.app_det1 .tabs li:first-child { border-top-left-radius: 5px; }
.app_det1 .tabs li:last-child { border-top-right-radius: 5px; border-right: none; }
.app_det1 .tabs li:hover { color: var(--blue1-h); }
.app_det1 .tabs li.on { background-color: var(--blue1); color: #fff; cursor: default; }
.app_det1 .tabs li.on i { background-color: #fff; color: var(--blue1); }
.app_det1 .tabs li.on:after { opacity: 1; }
.app_det1 .tabs li.t3 { color: #07b53b; }
.app_det1 .tabs li.t3:after, .app_det1 .tabs li.t3 i { background-color: #07b53b; }
.app_det1 .tabs li.t3:hover { color: #148937; }
.app_det1 .tabs li.t3.on { background-color: #07b53b; color: #fff; }
.app_det1 .tabs li.t3.on i { background-color: #fff; color: #07b53b; }
.app_det1 .tabs icon { margin-right: 8px; }
.app_det1 .tabs i { font-style: normal; font-size: 1.2rem; background-color: var(--gray-blue); color: #fff; display: inline-block; padding: 0px 4px; border-radius: 2px; margin-left: 8px; }
.app_det1 .tab_body > div { padding: 15px; }
.app_det1 .tab_body > div:not(.on) { display: none; }
.app_det1 .list1 { padding-bottom: 2px; }
.app_det1 .list1 dt { display: flex; font-size: 1.2rem; background-color: var(--gray-bg); color: var(--heading); border-radius: 3px; align-items: center; padding-right: 36px; position: relative; cursor: pointer; transition: all 0.15s ease-in-out; }
.app_det1 .list1 dt:hover { color: var(--blue1-h); }
.app_det1 .list1 dt:after { content: ''; width: 36px; height: 100%; border-left: #fff solid 1px; position: absolute; right: 0px; top: 0px; background: linear-gradient(var(--blue1)) no-repeat center; background-size: 16px 2px; }
.app_det1 .list1 dt:before { content: ''; width: 2px; height: 16px; background-color: var(--blue1); position: absolute; right: 16px; top: 50%; margin-top: -8px; transition: all 0.15s ease-in-out; }
.app_det1 .list1.on dt { background-color: #e6e6f9; color: var(--black); border-radius: 3px 3px 0px 0px; }
.app_det1 .list1.on dt:before { transform: scaleY(0); }
.app_det1 .list1 dt span { padding: 8px; }
.app_det1 .list1 dt .c1 { width: 90px; text-align: center; color: var(--gray-blue); line-height: 1.4; font-size: 1.1rem; border-right: #fff solid 1px; position: relative; padding-left: 25px; }
.app_det1 .list1 dt .c1 icon { position: absolute; left: 5px; top: 50%; margin-top: -8px; }
.app_det1 .list1 dt .c2 { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; flex-grow: 1; }
.app_det1 .list1 dt .c3 { margin-left: auto; white-space: nowrap; }
.app_det1 .list1 dd { display: none; font-size: 1.2rem; border: var(--gray-bg) solid 2px; border-top: none; padding: 10px; border-radius: 0px 0px 5px 5px; }
.app_det1 .list1:not(:last-child) dd { margin-bottom: 10px; }
.app_det1 .list1.on dd { display: block; }
.app_det1 .fm .field { margin-bottom: 10px; }
.app_det1 .fm .button.submit { padding: 12px 45px 12px 50px; }
.app_det1 .fm .button.submit icon { width: 32px; height: 32px; left: 3px; top: 3px; }
.app_det1 .fm textarea { resize: vertical; height: 200px; }
.app_det1 .fm nav { padding: 5px 0px; }
.app_det1 .fm2 .fields { display: flex; gap: 10px; }
.app_det1 .fm2 .field { width: 50%; }
.app_det1 .fm3 textarea { height: 160px; }
.app_det1 .fm3 .button.submit { background-color: #07b53b; }
.app_det1 .fm .error { display: none; }

.app_det1 .line_head { background-color: #263147; color: #8c9fc5; border-radius: 5px 5px 0px 0px; text-align: center; padding: 5px 8px; display: flex; justify-content: space-between; align-items: center; font-size: 1.2rem; }
.app_det1 .line_head span b { color: #fff; font-size: 1.4rem; }
.app_det1 .line_head i { font-size: 1rem; font-style: normal; padding-top: 1px; }
.app_det1 .line_list { background: linear-gradient(#7494c2cc, #7494c2cc), url(../img/line_chat_bg.jpg) no-repeat center; background-size: cover; border-radius: 0px 0px 5px 5px; margin-bottom: 20px; padding: 20px; display: flex; flex-direction: column; gap: 15px; color: #000; }
.app_det1 .line_list > div { display: flex; align-items: flex-end; gap: 5px; }
.app_det1 .line_list p { padding: 10px 15px; font-size: 1.2rem; max-width: 360px; box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.1); border-radius: 20px; position: relative; }
.app_det1 .line_list p:before { content: ''; border: 10px solid; position: absolute; top: 5px; }
.app_det1 .line_list > div > span { font-size: 1.1rem; color: #fff; }
.app_det1 .line_list > div.u { margin-right: auto; flex-direction: row-reverse; }
.app_det1 .line_list > div.u p { background-color: #fff; }
.app_det1 .line_list > div.u p:before { border-color: #fff #fff transparent transparent; left: -10px; transform: rotate(10deg); }
.app_det1 .line_list > div.a { margin-left: auto; }
.app_det1 .line_list > div.a p { background-color: #85e248; }
.app_det1 .line_list > div.a p:before { border-color: #85e248 transparent transparent #85e248; right: -10px; transform: rotate(-10deg); }

.app_det1 .links { border-top: #ccc solid 2px; padding: 20px 15px; }
.app_det1 .links table { width: 100%; border-collapse: collapse; }
.app_det1 .links th, .app_det1 .links td { border: #ddd solid 1px; padding: 8px 10px; }
.app_det1 .links th { background-color: #efefef; font-size: 1.2rem; }
.app_det1 .links td { font-size: 1.2rem; }
.app_det1 .links td div { display: flex; justify-content: space-between; align-items: center; }
.app_det1 .links td icon { margin: 0px; color: var(--blue1); cursor: pointer; }

.app_detail .app_det2 { width: 500px; min-width: 480px; padding: 0px; margin: 0px; position: sticky; top: 60px; }
.app_det2 .hd1 icon { transform: translateY(2px); }
.app_det2 .inner { padding: 15px; }
.app_det2 .hd_wrap { position: relative; }
.app_det2 .hd_wrap div { position: absolute; top: 13px; right: 10px; font-size: 1.2rem; display: flex; gap: 10px; }
.app_det2 .hd_wrap a { color: #fff; }
.app_det2 .hd_wrap a icon { font-size: 1.5rem; margin-right: 3px; }
.app_det2 .info { display: flex; flex-flow: row wrap; gap: 10px; }
.app_det2 .info dl { width: calc(50% - 5px); border-bottom: #ddd dotted 1px; padding-bottom: 10px; }
.app_det2 .info dl.w100 { width: 100%; }
.app_det2 .info dt { color: var(--heading); font-size: 1.1rem; margin-bottom: 2px; }
.app_det2 .info dd { font-size: 1.3rem; }
.app_det2 .more { text-align: center; padding: 20px 0px; display: flex; align-items: center; gap: 15px; }
.app_det2 .more:before, .app_det2 .more:after { content: ''; width: 50%; border-bottom: #ccc solid 2px; }
.app_det2 .more span { display: inline-block; cursor: pointer; user-select: none; white-space: nowrap; width: 150px; padding-right: 10px; font-size: 1.2rem; color: var(--blue1); font-weight: bold; }
.app_det2 .more span icon { margin-right: 5px; }
.app_det2 .more + .info { display: none; }
.app_det2 .more.on + .info { display: flex; }

.app_detail .app_det3 { width: 360px; min-width: 340px; padding: 0px; margin: 0px; position: sticky; top: 60px; }
.app_det3 .inner { padding: 15px; }
.app_det3 .fm .field { margin-bottom: 8px; border-bottom: #ddd dotted 1px; padding-bottom: 8px; }
.app_det3 .fm .input, .app_det3 .fm .select:after { padding: 6px 8px; }
.app_det3 .fm .error { display: none; }
.app_det3 .fm nav { text-align: center; padding: 5px 0px; }
.app_det3 .fm .button.submit { background-color: #299100; }

@media screen and (max-width: 1600px) {
	.app_detail .app_det1 { width: calc(100% - 780px); }
	.app_detail .app_det2 { width: 450px; min-width: 450px; }
	.app_detail .app_det3 { width: 310px; min-width: 310px; }
}
@media screen and (max-width: 1480px) {
	.app_detail .app_det1 { width: calc(100% - 680px); }
	.app_detail .app_det2 { width: 380px; min-width: 380px; }
	.app_detail .app_det3 { width: 280px; min-width: 280px; }
}

.app_status { display: flex; padding: 0px; }
.app_status .num { font-weight: bold; font-size: 1.8rem; display: flex; align-items: center; padding: 10px 15px 10px 0px; border-right: #ddd solid 1px; white-space: nowrap; }
.app_status .num span { font-weight: normal; color: #fff; font-size: 1.2rem; background-color: var(--gray-blue); border-radius: 0px 2px 2px 0px; margin-right: 8px; padding: 2px 5px; }
.app_status .com { text-align: left; display: flex; align-items: center; font-size: 1.2rem; color: var(--heading); flex-grow: 1; padding: 5px 15px; border-right: #ddd solid 1px; }
.app_status .list { display: flex; padding: 5px 10px; align-items: center; gap: 10px; margin-left: auto; }
.app_status .list ul { display: flex; border-radius: 30px; overflow: hidden; }
.app_status .list li { clip-path: polygon(calc(100% - 8px) 0%, 100% 50%, calc(100% - 8px) 100%, 0% 100%, 8px 50%, 0% 0%); margin-right: -3px; }
.app_status .list li:first-child { margin-left: -10px; padding-left: 25px; }
.app_status .list .step { padding: 8px 15px; font-size: 1.2rem; font-weight: bold; background-color: var(--gray-bg); color: var(--gray-blue); min-width: 140px; display: flex; align-items: center; justify-content: center; }
.app_status .list .step.on { background-color: #00adcb; color: #fff; }
.app_status .list .step.cur { background-color: var(--blue1); color: #fff; }
.app_status .list div.step { border-radius: 30px; min-width: 200px; }

@media screen and (max-width: 1600px) {
	.app_status .list .step { padding: 8px 15px; font-size: 1.1rem; min-width: 120px; }
.app_status .list div.step { min-width: 140px; }
}