@charset "UTF-8"; /* ---------- 定義 ---------- */ :root { --color_order_status00: #ffffff; --color_order_status01: #ffffff; --color_order_status10: #ffffff; --color_order_status60: #ffffff; --color_order_status70: #ffffff; --color_order_status90: #333333; --color_order_status91: #ffffff; --color_order_status99: #ffffff; --bgcolor_order_status00: #6c757d; --bgcolor_order_status01: #28A745; --bgcolor_order_status10: #007bff; --bgcolor_order_status60: #e0a800; --bgcolor_order_status70: #a260bf; --bgcolor_order_status90: #e2e6ea; --bgcolor_order_status91: #343a40; --bgcolor_order_status99: #992200; } /* ---------- ---------- */ * { box-sizing: border-box; } html { height: 100%; margin: 0; padding: 0; border: none; background-color: #ebedef; overflow-y: auto; overscroll-behavior-y: contain; } body { height: 100%; margin: 0; padding: 0; border: none; background: none; } #app { position: relative; min-height: 100%; margin: 0; padding: 0 0 7vh 0; border: none; user-select: none; } /* #app { display: flex; display: -ms-flexbox; flex-flow: column nowrap; -ms-flex-direction: column; -ms-flex-flow: column nowrap; } */ #fixed-area { position: fixed; top: 0; left: 0; width: 100%; margin: 0; border: none; padding: 0; background-color: #ffffff; } #header { position: relative; right: 0; left: 0; margin: 0; padding: 10px; background-color: #ffffff; } #header .arrow { display: inline-block; width: 28px; height: 28px; margin: 0 10px 0 0; vertical-align: middle; color: #34495e; background-color: #ffffff; cursor: pointer; } #header .arrow i { display: block; margin: 0; font-size: 30px; text-align: center; line-height: 28px; } #header .title { display: inline-block; vertical-align: middle; color: #34495e; background-color: #ffffff; } #header .title h1 { display: block; margin: 0; padding: 0; font-size: 20px; width: 283px; height: 28px; text-indent: -99999px; } #header .title h1 { background-image: url('../../img/ContractorMyPage/common/logo.svg'); background-repeat: no-repeat; background-position: center left; } #header .menu { position: absolute; top: 0; right: 0; width: 48px; height: 48px; color: #34495e; background-color: #ffffff; cursor: pointer; } #header .menu i { display: block; font-size: 36px; text-align: center; margin-top: 4px;} #header .menu span { display: block; font-size: 8px; text-align: center; } #header .menu div.badge { position: absolute; top: 0; right: 0; font-size: 24px; color: #ff0000; padding: 1px 3px; } #breadcrumb-list { display: none; position: relative; right: 0; left: 0; padding: 0 10px; background-color: #e9ecef; white-space: nowrap; overflow-x: auto; overflow-y: hidden; } #breadcrumb-list > span { padding: 0; line-height: 40px; font-size: 13px; color: #000000; letter-spacing: -1px; } #breadcrumb-list a { padding: 0; line-height: 40px; font-size: 13px; text-decoration: none; letter-spacing: -1px; } #breadcrumb-list a::after { padding: 0 3px; line-height: 40px; font-size: 12px; content: '＞'; color: #000000; } #screen-name { position: relative; right: 0; left: 0; margin: 0; padding: 0; background-color: #34495e; font-size: 0; vertical-align: middle; } #screen-name { display: flex; display: -ms-flexbox; flex-direction: row; -ms-flex-direction: row; } #screen-name > span { padding: 0 10px; color: #ffffff; line-height: 40px; font-size: 20px; vertical-align: middle; white-space: nowrap; } #footer { position: fixed; bottom: 0; width: 100%; height: 7vh; background-color: #34495e; color: #ffffff; font-size: 7vh; text-align: center; } #app.upmove #footer { animation: UpAnime 0.5s forwards; } #app.downmove #footer { animation: DownAnime 0.5s forwards; } #footer .global-button-area { position: relative; display: flex; bottom: 0; flex-direction: row; flex-wrap: nowrap; align-items: center; justify-content: center; height: 5vh; } #footer .global-button-area > div { text-align: center; width:100%; height: 100%; margin-top: 4px; cursor: pointer; } #footer .global-button-area > div .icon { height: 3.5vh; } #footer .global-button-area > div .label { height: 1.5vh; font-size: 1.3vh; text-align: center; } #footer .global-button-area > div .icon img { display: block; height: 100%; margin: 0 auto; } #footer .copyright { position: relative; bottom: 0; height: 2vh; line-height: 2vh; font-size: 0.8vh; } #global-menu { display: block; position: fixed; top: 48px; right: 0; border: none; padding: 5px; background-color: #fffff8; opacity: 0; } #global-menu { transition: opacity 0.3s ease 0s; pointer-events: none; } #global-menu { box-shadow: 0px 0px 5px 0px rgba(128,128,128,0.5); -moz-box-shadow: 0px 0px 5px 0px rgba(128,128,128,0.5); -ms-box-shadow: 0px 0px 5px 0px rgba(128,128,128,0.5); } #global-menu.on { opacity: 1; pointer-events: auto; } #global-menu div.user-info { display: block; padding: 15px 15px 0px 15px; font-size: 16px; line-height: 30px; color: #34495e; } #global-menu div.user-info #user-name { text-align: right; display: block; } #global-menu div.user-info #app-version { text-align: right; display: block; font-size: 14px; } #global-menu div.menus span { position: relative; display: block; padding: 0 15px; font-size: 16px; line-height: 60px; color: #34495e; cursor: pointer; } #global-menu div.menus span[name=clearunreads] { color: #cc0000; } #global-menu div.menus span span.badge { position: absolute; top: 6px; right: 6px; padding: 0 6px; font-size: 14px; color:#ffffff; background-color: #ff4444; height:24px; width:24px; border-radius:50%; line-height:24px; text-align:center;} #global-menu hr { display: block; border-color: #34495e; } #global-menu div.menus span:hover { background-color: #f8f8ff; } #waiting-mask { display: none; position: fixed; top: 0; right: 0; bottom: 0; left: 0; background-color: #000000; opacity: 0.5; } #waiting-mask div { position: absolute; width: 80px; height: 80px; top: 0; right: 0; bottom: 0; left: 0; margin: auto; } #waiting-mask div { background-image: url('../../img/waiting.gif'); background-position: center center; background-repeat: no-repeat; } body.waiting #waiting-mask { display: block; } @keyframes UpAnime { from { margin-bottom: 0; } to { margin-bottom: -7vh; } } @keyframes DownAnime { from { margin-bottom: -7vh; } to { margin-bottom: 0; } }