@charset "UTF-8";
@import url("../bibe_fonts-v2.1/style.css");
/*
    root
*/
*,
*::before,
*::after {
    box-sizing: border-box;
    padding: 0;
    margin:  0;
    user-select: none;
}
:root {
	--purple: #DBA1CB;
	--indigo: #4960AA;
	--blue-back:   #EAF4F3;
	--footer-blue: #B2D7D8;
	--black:  #3E3A39;
	--gray6:  #666464;
	--gray9:  #8F9090;
	--white:  #FFFFFF;
	--button-gra: linear-gradient(to right, #CDB3D4, #FFBE88);
	-webkit-tap-highlight-color: transparent;
}
@media (width < 744px)
{
	.pc {
		display: none !important;
	}
}
@media (width >= 744px)
{
	.mobile {
		display: none !important;
	}
}
h1, h2, h3 {
	font-size: 1rem;
	margin: 2em 0 1em;
}
h1 span, h2 span, h3 span {
	font-size: smaller;
	font-weight: normal;
}
p {
	margin: 1em 0;
}
ul {
	list-style: none;
}
a {
	cursor: pointer;
}
img, iframe {
	max-width: 100%;
	vertical-align: middle;
}
label {
	display: block;
	font-weight: bold;
	margin-bottom: 1em;
}
label[for] {
	margin-bottom: 0;
}
label span {
	font-size: smaller;
	font-weight: normal;
}
input, textarea {
	width: 100%;
	font-size: 1rem;
	background-color: var(--white);
    padding: 0.75em 1em;
    border-radius: 0.5em;
    border: none;
    user-select: auto;
}
textarea {
    white-space: revert;
}
:focus {
	outline: var(--blue) solid 2px;
}
::placeholder {
    color: var(--gray9);
}
button {
	cursor: pointer;
}
button[type="submit"] {
	width: 100%;
	font-size: 1rem;
	line-height: 2.65625;
	color: var(--white);
	background-image: var(--button-gra);
	border: none;
	border-radius: 0.5em;
	margin-top: 0.5em;
}
.href {
	display: inline-block;
	color: var(--purple);
	text-decoration: underline;
	line-height: 2.65625;
	cursor: pointer;
}
.container {
	max-width: 1280px;
	margin: 0 auto;
}
.center,
.text-center {
	text-align: center;
}
.center-line {
	position: relative;
	text-align: center;
	border-bottom: 1px solid var(--black);
	margin: 0 0 2em;
}
.center-line span {
	position: relative;
	top: 1em;
	display: inline-block;
	font-size: 1rem;
	font-weight: bold;
	padding: 0 0.75em;
	background-color: var(--white);
}
.passwrap {
	display: flex;
	width: 100%;
	background-color: var(--white);
    border-radius: 0.5em;
    margin-bottom: 1em;
}
.passwrap:focus-within {
	outline: var(--blue) solid 2px;
}
.passwrap input {
	flex: 1 1 auto;
	margin-right: 1em;
}
.passwrap input:focus {
	outline: none;
}
.passwrap .passview {
	flex: 0 0 42.5px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.25rem;
	color: var(--gray6);
	cursor: pointer;
}
.line-login-button {
	display: inline-block;
	font-size: 1rem;
	font-weight: bold;
	text-decoration: none;
	line-height: 2.65625;
	width: 15em;
	color: var(--white);
	background-color: #06c755;
	border-radius: 1.328em;
	margin: 1em 0;
}
.line-login-button span.base {
	display: flex;
	padding: 0 2em;
}
.line-login-button span.logo {
	flex: 0 0 24%;
	font-size: 1.5em;
	display: flex;
	align-items: center;
	justify-content: center;
}
.line-login-button span.text {
	flex: 0 0 76%;
	display: flex;
	align-items: center;
	justify-content: center;
}
html {
    -moz-text-size-adjust: none;
    -webkit-text-size-adjust: none;
    text-size-adjust: none;
    height: 100%;
    overflow: hidden;
}
body {
    font-size: 0.875rem;
    font-size: 0.875rem;
    font-family: "Hiragino Sans", "Meiryo", sans-serif;
/*    font-weight: 500; */
/*    font-family: -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen,Ubuntu,Cantarell,'Open Sans','Helvetica Neue',sans-serif; */
    line-height: 1.75;
    color: var(--black);
    word-break: break-all;
    height: 100%;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}
#header {
	flex: 0 0 auto;
	text-align: center;
	padding: 1rem;
	background-color: var(--white);
}
#header img {
	width: 50%;
	max-width: 12rem;
}
#main {
	flex: 1 1 auto;
    background-color: var(--blue-back);
    overflow-y: scroll;
}
.container {
	position: relative;
	max-width: 600px;
	height: 100%;
}
#contents {
	padding: 1em 2em 4em;
}
h1 {
	text-align: center;
}
.center-line {
	margin-top: 2em;
}
.center-line span {
	background-color: var(--blue-back);
}
hr {
	margin-top: 3em;
}
#go-reset,
#go-login,
#go-login2 {
	margin-top: 2em;
}
#footer {
	flex: 0 0 auto;
	text-align: center;
	line-height: 2;
	color: var(--white);
	background-color: var(--footer-blue);
}
#main .container p.notice,
#main .container p.alert {
	display: none;
	position: absolute;
	top:   0.5rem;
	right: 1rem;
	color: var(--white);
	background-color: var(--indigo);
	padding: 0.25rem 1rem;
	border-radius: 0.5rem;
	margin: 0;
}
#main .container p.notice::after,
#main .container p.alert::after {
	position: absolute;
	top:   -0.5rem;
	right: 1.5rem;
	content: "";
	width: 0;
	height: 0;
	border-bottom: 0.5rem  solid var(--indigo);
	border-left:   0.25rem solid transparent;
	border-right:  0.25rem solid transparent;
}
#main .container p.alert {
	background-color: var(--purple);
}
#main .container p.alert::after {
	border-bottom: 0.5rem  solid var(--purple);
}
#mail-login input {
	box-shadow: 0 0 0 1.75em var(--white) inset;
}