:root {
	--main: #f0f2f5;
	--gr: #00b894; 
	--rd: #ff7675;
	--bl:#0984e3;
	--bt:#454c53;
}
table {
	border-collapse:  separate;
	background: #fff;
	border-spacing: 0;
  border-radius: 6px;
  overflow: hidden;
}
th,td { padding: 5px 15px; }
th { border-bottom: 2px solid var(--main);}
td { border-bottom: 1px solid var(--main);}

.table_wrap { 
	width: fit-content;
	background: #fff;
}
input[type="button"],
input[type="submit"] {
	padding: 5px;
	border: none;
	background: var(--bt);
	outline: none;
	font: inherit;
	border-radius: 5px;
	color: #fff;
}

input[type="button"]:hover,
input[type="submit"]:hover {
	opacity: 0.6;
}

.msg {
	font-weight: bold;
	color: #blue;
    padding: 5%;
    background: #fff;
    border-radius: 10px;
	margin-bottom: 20px;
}
.err {
	font-weight: bold;
	color: red;
}

.no_border {
	border: 0px;
	background-color: #FFF;
}
/*index*/
.wrap {
	display: grid;
	grid-template-areas: 

    "header header"

    "nav main"

    "footer footer";

	grid-template-columns: 0.75fr 2.25fr;
	grid-template-rows: auto;
	gap: 0px;
}

main {
	grid-area:main;
	background: var(--main);
	padding: 0 1.75rem 1.75rem 1.75rem;
}

nav {
	grid-area:nav;
	box-shadow: .25rem 0 .625rem #e4e7ed;
	padding: 1.5rem 1.5rem 1px;
}
nav li a {
	position: relative;
	display: flex;
	align-items: center;
	padding: .5rem 1.5rem;
	min-height: 2.5rem;
	line-height: 1.25rem;
	letter-spacing: .0125em;
	color: #383d42;
}
nav li a:hover, nav li a:hover i,
nav >p:hover {
	color: #0284c7;
}
nav li a i {
	flex: 0 0 auto;
    display: inline-block;
    margin-right: .625rem;
    min-width: 1.25rem;
    font-size: 1.3rem;
    text-align: center;
    color: #8d969f;
}
nav > p {
	padding: .5rem 1.5rem;
}
nav >p i {color: #8d969f;}
header {
	grid-area:header;
	background: var(--main);
}
footer {
	grid-area:footer;
	background: var(--main);
}
.wrap header h1 { padding-left: 15px;}
/*ログイン画面*/
#login {
	position: relative;
	background: url('/img/login.jpg') no-repeat center center;
	background-size: cover;
	height:100vh;
}

#login h1 { color: #fff; margin-bottom: 20px;}

#login .login_form { 
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateY(-50%) translateX(-50%);
	-webkit- transform: translateY(-50%) translateX(-50%);
}

#login .form_wrap {
	padding: 10% 5%;
	background: #fff;
	text-align: center;
	border-radius: 10px;
	box-shadow: 0 12px 40px rgba(0, 0, 0, .12);
    box-shadow: var(--shadow-component-outer);
}

#login .form_wrap dt { font-size: 15px; margin-bottom: 10px;}

#login input {
	padding: 2px;
	border: 1px solid #ddd;
	border-radius: 5px;
}
#login input[type="submit"] { 
	margin: 20px auto;
	display: block;
	width: 70%;
	padding: 3%;
	background: var(--gr);
	border-radius: 15px;
	color: #fff;
}

#login input[name="newregist"] {
	border: none;
	background: #fff;
	color: var(--rd);
	padding: 0;
	font-weight: bold;
	font-size: 13px;
}

#login .regist { font-size: 12px;}

/*tel*/

input[name="tel_report"] {
	color: #fff;
}

input[value="身内"]{
	background: #fff;
}

input[value="未定"]{
	background: #fff;
}
input[value="顧客"]{
	background: #f6c445;
}

input[value="反響"]{
	background: var(--bl);
}

input[value="紹介"]{
	background: var(--gr);
}

input[value="官公署"]{
	background: #6c5ce7;
}

input[value="同業者"],
input[value="協力者"] {
	background: #00b894;
}

input[value="異業種"]{
	background: #00b894;
}

input[value="お断り"],
input[value="営業"]{
	background: #d63031;
}

input[value="政治家"],
input[value="その他"]{
	background: #ededed;
	color: #555;
}

/*customer*/

section.form {
	background: #fff;
	border-radius: 10px;
	padding: 10px;
	margin-bottom: 20px;
}