*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}:where([hidden]:not([hidden='until-found'])){display:none!important}:where(html){-webkit-text-size-adjust:none;color-scheme:dark light}@supports not (min-block-size:100dvb){:where(html){block-size:100%}}@media (prefers-reduced-motion:no-preference){:where(html:focus-within){scroll-behavior:smooth}}:where(body){block-size:100%;block-size:100dvb;line-height:1.5;font-family:system-ui,sans-serif;-webkit-font-smoothing:antialiased}:where(input,button,textarea,select){font:inherit;color:inherit}:where(textarea){resize:vertical;resize:block}:where(button,label,select,summary,[role='button'],[role='option']){cursor:pointer}:where(:disabled){cursor:not-allowed}:where(label:has(>input:disabled),label:has(+input:disabled)){cursor:not-allowed}:where(button){border-style:solid}:where(a){text-underline-offset:.2ex}:where(ul,ol){list-style:none}:where(img,svg,video,canvas,audio,iframe,embed,object){display:block}:where(img,picture,svg){max-inline-size:100%;block-size:auto}:where(p,h1,h2,h3,h4,h5,h6){overflow-wrap:break-word}:where(h1,h2,h3){line-height:calc(1em + 0.5rem)}:where(hr){border:none;border-block-start:1px solid;color:inherit;block-size:0;overflow:visible}:where(:focus-visible){outline:2px solid var(--focus-color,Highlight);outline-offset:2px}:where(.visually-hidden:not(:focus,:active,:focus-within,.not-visually-hidden)){clip-path:inset(50%)!important;height:1px!important;width:1px!important;overflow:hidden!important;position:absolute!important;white-space:nowrap!important;border:0!important}
/* nomal *@font-face {font-family:'Klee';src:url('/kumiai/css/KleeOne-Regular.ttf') format('truetype');font-weight:normal;font-style:normal;}
/* bold *@font-face {font-family:'Klee';src:url('/kumiai/css/KleeOne-SemiBold.ttf') format('truetype');font-weight:bold;font-style:normal;}
*/
body {/*font-family:Klee;*/font-famly:sans-seif;background-color: white}

article,header {margin:0 auto;width:80%;}
header {max-width:980px;}
ul {padding:15px 1em 2em 2em;}

nav {display:grid;grid-auto-flow:column;clear:both;/*width:100%;*/background-color:#34495e;border-radius:50px;height:3em;gap:12px;}
nav a {display:grid;align-items:center;justify-content:center;font-size:15px;text-decoration:none;/*text-transform:uppercase;text-align:center;height:100%;*/color:white;overflow:hidden;white-space:nowrap;cursor:pointer;transition:.5s ;transform:rotateX( 0deg ) ;position:relative;}


nav a::before {content:'';background-color:#25e0ce;position:absolute;left:0;height:0px;/*bottom:2px;;border:1px solid #fff;*/width:100%;z-index:-1;transition:all .3s ease-in-out;border-radius:50px;}

nav a:hover::before {/* bottom:0;*/height:100%;}
nav a:hover {color:#111;}
.active{background-color:#25e0ce;border-radius:50px;}

li{padding:14px 0;list-style:decimal-leading-zero;}
.account-menu,.salon_h {display:grid;grid-template-columns:repeat(auto-fit, 166px);gap:12px;margin:2em 0;padding:0;justify-content:center;}


.account-menu li {list-style:none;padding:0;}
.account-menu a {display:block;text-align:center;background-color:#333;padding:12px 0;border-radius:20px;text-decoration:none;color:#fff;transition:.5s ;}
.account-menu a:hover,.account-menu a:focus {background-color:#1b1b1b;}

.salon_h{grid-template-columns:repeat(auto-fit, 120px);gap: 10px;;margin:1em 0;}
.salon_h a{text-align:center;text-decoration:none;border:1px solid;border-radius:5px;padding:2px;}
.salon_t {width:100%}
.salon_t td:nth-of-type(1){width:10%;}
.salon_t td:nth-of-type(2){width:30%;}
.salon_t td:nth-of-type(3){width:6%;text-align:center;}
.salon_t td:nth-of-type(4){width:6%;text-align:center;}
.salon_t td:nth-of-type(5){width:30%;}
.salon_t td:nth-of-type(6){width:10%;}

/*.salon_t tr{display:grid}*/


.salon_t th{padding:0.5em;background-color:#777;color:#fff;font-size:80%;}
.salon_t th a{color:#fff;text-decoration:none;}
.salon_t td{padding:6px 1px;}
.salon_b {margin:2em 0 0;background-color:#d0e3e3;padding:1em;border-radius:10px 10px 0 0;}
.sumall {color:#6f6f6f;background:#e3e3e3;border-radius:8px;text-align:center;padding:0 3px;margin:0;font-size:80%;border:1px solid #d9d9d9;}
.sumall-c {text-align:center;}


.page-top-wrap {width:100%;height:5rem;margin:0 auto;display: flex;justify-content: flex-end;max-width: 810px;}
#page-top {text-decoration:none;font-size:200%;background:#66666685;color:#fff;cursor:pointer;transform:rotate(270deg);border-radius:50%;height:51px;width:51px;position:fixed;bottom: 3em;text-align: center;}
#page-top:hover{;background:#666666e5;}




.db_show_admin {overflow:scroll;display:block;#999;padding:0 0px 1em;/*border:1px solid ;*/position:relative;width:120%;left:-10%;overflow-y: auto;}
.db_show_admin th {white-space:nowrap;background:#00000069;padding:6px;transition:0.3s;}
.db_show_admin input[type="checkbox"] {margin:5px;}
#select_check{font: 0.7rem "Fira Sans", sans-serif;padding: 2px;}

.db_show_admin td{white-space:nowrap;border-right:1px solid #999;padding:padding:0 6px;;font-size:80%;padding:0 2px;}
.db_show_admin td:first-child{text-align:center;}

.fixed01{
  position: sticky;
  left: 0;
/*  &:before{
    content: "";
    position: absolute;
    top: -1px;
    left: -1px;
    width: 100%;
    height: 100%;
    border: 1px solid #ccc;
  }*/
}

table td {	background:#eee;}
table tr:nth-child(odd) td {	background:#fff;}
main{clear:both;}
.loading {position:absolute;top:50%;left:50%;}
loading.loading-bar {display:inline-block;width:4px;height:18px;border-radius:4px;animation:loading 1s ease-in-out infinite;}
loading.loading-bar:nth-child(1) {background-color:#3498db;animation-delay:0;}
loading.loading-bar:nth-child(2) {background-color:#c0392b;animation-delay:0.09s;}
loading.loading-bar:nth-child(3) {background-color:#f1c40f;animation-delay:.18s;}
loading.loading-bar:nth-child(4) {background-color:#27ae60;animation-delay:.27s;}
@keyframes loading {0% {transform:scale(1);}20% {transform:scale(1, 2.2);}40% {transform:scale(1);}}

.red{color:red;}
#username-message {display:inline-block;padding-left:1em;color:red;font-weight:800;}
/* START TOOLTIP STYLES */
[tooltip] {position:relative; /* opinion 1 */}
/* Applies to all tooltips */
[tooltip]::before,[tooltip]::after {text-transform:none; /* opinion 2 */font-size:.9em; /* opinion 3 line-height:1;*/user-select:none;pointer-events:none;position:absolute;display:none;opacity:0;}
[tooltip]::before {content:'';border:5px solid transparent; /* opinion 4 */z-index:1001; /* absurdity 1 */}
[tooltip]::after {content:attr(tooltip); /* magic! *//* most of the rest of this is opinion */font-family:Helvetica, sans-serif;text-align:center;/* Let the content set the size of the tooltips but this will also keep them from being obnoxious*/min-width:3em;max-width:21em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:1ch 1.5ch;border-radius:.3ch;box-shadow:0 1em 2em -.5em rgba(0, 0, 0, 0.35);background:#333;color:#fff;z-index:1000; /* absurdity 2 */}/* Make the tooltips respond to hover */
[tooltip]:hover::before,[tooltip]:hover::after {display:block;}
/* don't show empty tooltips */
[tooltip='']::before,[tooltip='']::after {display:none !important;}
/* FLOW:UP */
[tooltip]:not([flow])::before,[tooltip][flow^="up"]::before {bottom:100%;border-bottom-width:0;border-top-color:#333;}
[tooltip]:not([flow])::after,[tooltip][flow^="up"]::after {bottom:calc(100% + 5px);}
[tooltip]:not([flow])::before,[tooltip]:not([flow])::after,[tooltip][flow^="up"]::before,[tooltip][flow^="up"]::after {left:50%;transform:translate(-50%, -.5em);}
/* FLOW:DOWN */
[tooltip][flow^="down"]::before {top:100%;border-top-width:0;border-bottom-color:#333;}
[tooltip][flow^="down"]::after {top:calc(100% + 5px);}
[tooltip][flow^="down"]::before,[tooltip][flow^="down"]::after {left:50%;transform:translate(-50%, .5em);}
/* FLOW:LEFT */
[tooltip][flow^="left"]::before {top:50%;border-right-width:0;border-left-color:#333;left:calc(0em - 5px);transform:translate(-.5em, -50%);}
[tooltip][flow^="left"]::after {top:50%;right:calc(100% + 5px);transform:translate(-.5em, -50%);}
/* FLOW:RIGHT */
[tooltip][flow^="right"]::before {top:50%;border-left-width:0;border-right-color:#333;right:calc(0em - 5px);transform:translate(.5em, -50%);}
[tooltip][flow^="right"]::after {top:50%;left:calc(100% + 5px);transform:translate(.5em, -50%);}
/* KEYFRAMES */@keyframes tooltips-vert {to {opacity:.9;transform:translate(-50%, 0);}
}@keyframes tooltips-horz {to {opacity:.9;transform:translate(0, -50%);}
}/* FX All The Things */ 
[tooltip]:not([flow]):hover::before,[tooltip]:not([flow]):hover::after,[tooltip][flow^="up"]:hover::before,[tooltip][flow^="up"]:hover::after,[tooltip][flow^="down"]:hover::before,[tooltip][flow^="down"]:hover::after {animation:tooltips-vert 300ms ease-out forwards;}
[tooltip][flow^="left"]:hover::before,[tooltip][flow^="left"]:hover::after,[tooltip][flow^="right"]:hover::before,[tooltip][flow^="right"]:hover::after {animation:tooltips-horz 300ms ease-out forwards;}
[tooltip]{display:inline-block;/*display:grid;grid-template-columns:12em 1fr;*/}
.up2::after {left:34%;}


fieldset{border-radius:20px;max-width:766px;min-width:300px;margin:2em auto;	background:hsla(0,0%,93%,.34);}

.top-announce {border:none;background:none;}
.top-announce legend{background-color:#fef3e4;border:1px solid #666;}
._admin{padding:1em;max-width: 100%;}

legend {background-color:burlywood;padding:8px;margin:8px;border-radius:4px;min-width:11em;text-align:center;display:inline-block;}
/*_:lang(x)+_:-webkit-full-screen-document, legend {float:left;}
_:lang(x)+_:-webkit-full-screen-document, legend + *{color:red;clear:both;}
*/
.legend_wrap{text-align:left;}

.input-error {color:#ff1313;font-weight:800;font-size:13px;position:absolute;top:-6px;width:22em;}
input{border:2px solid #aaa;border-radius:4px;margin:16px 0 20px;outline:none;padding:8px;box-sizing:border-box;transition:0.3s;max-width:25em;font-size:16px;}

form {max-width:766px;min-width:300px;overflow:auto;padding:0 1em 1em 1em;margin:0 auto;}
textarea {margin:0 auto;width:100%;max-width:535px;box-sizing:border-box;}
.textarea{margin:0 1em;}
input[type="submit"],.submit {background:#0a9dff;border:2px solid transparent;border-radius:30px;box-shadow:0 8px 16px 2px rgba(10,157,255,.15);color:#fff;cursor:pointer;appearance:none;-webkit-appearance:none;-moz-appearance:none;font-size:16px;font-weight:400;height:50px;padding:5px 30px;width:100%;margin:0 auto;max-width:16em;}
.select-wrap .submit{padding:0;}
.select-wrap .small{width:6em;font-size:12px;padding:0;line-height:1em;height:auto;}


select{margin:0px 0px 0px -3px;padding:8px 0;height:3em;}
.submit-outer {display:flex;gap:10px;justify-content:center;padding:2em 0 1.5em;}
input[type="checkbox"] {margin:5px 5px 1em 0px;}
input[type="radio"] {margin:0px 5px 0 1em;}
input[type="submit"]:hover,.submit:hover {background-color:#0787dd;}
input[type="submit"]:focus,.submit:focus {outline:0;background-color:#0787dd;border:2px solid rgb(33, 150, 243);}

button{border:1px solid #777;border-radius:5px;}

#owner_name1,#owner_name2,#owner_name1_kana,#owner_name2_kana,#owner_birthday,#owner_phone_number,#opening_date{width:167px;}
.eye-show{margin:25px 0 0 -25px;cursor:pointer;padding:0;position:absolute;}

label{padding:10px 6px 0 5px;transition:0.3s;font-size:12px;display:inline-block;text-align:right;vertical-align:top;min-width:7em;}
label.mini{min-width:auto;font-size:100%;padding:0 0 0 .5em;text-indent:0;padding:0 1px;}
label.branch{min-width:6em;text-align:left;}
._form input{min-width:200px;}
._form label{min-width:8em;}
.template label{min-width:5em;margin-right:1em;}
.template p{margin:1em}

input:focus {border-color:dodgerBlue;box-shadow:0 0 8px 0 dodgerBlue;}
.grid-span2{display:grid;grid-template-columns:10em auto;padding:1em 0;}
.grid-span2 span{margin-left:1em;}
.register,.management,.worker{grid-template-columns:5em auto;}
.register span:first-child,.management span:first-child,.worker span:first-child{text-align:right;font-size:12px;}
.badge {background-color:#dc3545 !important;display:inline-block;padding:.35em .65em;font-size:.75em;font-weight:700;line-height:1;color:#fff;text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:.25rem;}
.div-separate {background-color:antiquewhite;padding:.4em;}

body,#page-top{animation-name:fadeInAnime;animation-duration:.8s;animation-fill-mode:forwards;opacity:0;}
@keyframes fadeInAnime{from {opacity:0;}to {opacity:1;}}
.fadeOut{animation-name:fadeOutAnime;animation-duration:1s;animation-fill-mode:forwards;opacity:1;}
@keyframes fadeOutAnime{from {opacity:1;}to {opacity:0;}}

.alert {display:flex;align-items:center;padding:1rem;margin-bottom:1rem;box-shadow:0 0 5px #999;border:1px solid transparent;border-radius:0.25rem;color:#333;gap:0.5rem;line-height:1.5;}
.alert i {font-size:1.3rem;}
.alert>a {cursor:pointer;color:#D4D4D4;margin-left:auto;}
.hide-box {opacity:0;visibility:hidden;transition:opacity 0.5s, visibility 1s;}
.alert-success {border-left:5px solid #5CBD9D;}
.alert-error {border-left:5px solid #E74C3C;}
.alert-warning {border-left:5px solid #F29C33;}
.alert-info {border-left:5px solid #3998DB;}
.fa-check-circle {color:#5CBD9D;}
.fa-times-circle {color:#E74C3C;}
.fa-exclamation-triangle{color:#F23232;}
.fa-exclamation-circle {color:#3998DB;}

.input-show{padding:5px;display:inline-block;font-size:18px;margin:5px 0px 8px;}
.registered{display:grid;grid-template-columns:7em auto;align-items:center;gap:5px;padding:1em;}
.registered span{font-size:12px}
.select-wrap div{display:grid;grid-template-columns:6em auto;align-items:center;border-bottom:1px solid #ccc;padding:3px;gap:2px;}
.select-wrap .mini{border:1px solid #aaa;border-radius:8px;margin:2px;padding:0 6px;box-sizing:content-box;font-size:13px;min-width:7em;text-align:left;line-height:2.5em;}
.select-wrap .header{border:0;padding:1em 0;text-align:initial;}
.select-wrap .header-label{text-align:center;background-color:burlywood;}
.select-wrap .mini:hover{background:#7fffd430;}


/*
.attachment-item {
position:relative;
margin-bottom:5px;
}

.attachment-filename {
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
padding:10px;
box-sizing:border-box;
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
}
*/

.visible {
visibility:visible;
opacity:1;
transition:opacity .5s linear;
}
.hidden {
visibility:hidden;
opacity:0;
transition:visibility 0s .5s, opacity .5s linear;
}.hidden-cell {
visibility:collapse;
opacity:0;
transition:visibility 0s .5s, opacity .5s linear;
}
@media all and (max-width:700px) {
.grid-span2 {grid-template-columns:auto;}
.register,.management,.worker{grid-template-columns:5em auto;}
article,.page-top-wrap{width:95%;}
.page-to-wrap {width:100%;}
header{width:100%;padding: 10px 5px;}
.active,nav,nav a::before {border-radius:8px;}
form {padding:1em 0;}
.db_show_admin{width:100%;left:0;}
#owner_name1, #owner_name2, #owner_name1_kana, #owner_name2_kana {width:8em;}
#opening_date,#owner_birthday{height:3em}
input{font-size:13px;}
label.owner_name2,label.owner_name2_kana{min-width:4em;}
  .scroll {
    overflow-x: auto;
    
  }

.salon_t {width:650px}
.salon_t td:nth-of-type(1){width:50px;}
.salon_t td:nth-of-type(2){width:200px;}
.salon_t td:nth-of-type(3){width:40px;}
.salon_t td:nth-of-type(4){width:40px;}
.salon_t td:nth-of-type(5){width:200px;}
.salon_t td:nth-of-type(6){width:120px;}
.salon_h {grid-template-columns: repeat(auto-fit, 116px);}
.salon_h a{padding:7px 1px;}

}
@media all and (max-width:400px) {
nav a{font-size:14px;}
h2{font-size:1em;}
}