/*
 * Copyright(c) 2009 limitlink,Inc. All Rights Reserved.
 * http://limitlink.jp/
 * 文字コードUTF-8
 */

.login {
	width: 300px;
	margin: 100px auto 100px auto;
	padding: 40px;
	border: 1px solid #999;
}

.login h1 {
	margin-bottom: 20px;
}

.logininput {
	width: 180px;
}

.loginsubmit {
	padding-top: 20px;
	text-align: center;
}

.login .error {
	padding-bottom: 5px;
}

.login th, .login td {
	padding: 3px;
	text-align: left;
}

.attachment li {
	float: left;
	margin: 10px 10px 0px 0px;
	text-align: center;
	line-height: 100%;
}

.layerwrapper {
	width: 500px;
	position: absolute;
	visibility: hidden;
	background-color: #fff;
	border-right: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
}

.layer {
	border: 1px solid #666;
}

.handle {
	width: 100%;
	background-color: #57d;
	background-image: url(../images/handle.gif);
	background-repeat: repeat-x;
	border-bottom: 1px solid #666;
}

.layercaption {
	float: left;
	padding: 3px 5px 2px 5px;
	color: #fff;
}

.layerclose {
	width: 14px;
	height: 13px;
	float: right;
	margin: 5px;
	background-image: url(../images/close.gif);
	background-repeat: no-repeat;
}

.layercontent {
	padding: 20px;
}

.layer th, .layer td {
	width: auto;
	padding: 3px 5px 3px 5px;
}

.layerlist {
	border: 1px solid #8be;
}

.layerlistcaption {
	padding: 3px 5px 2px 5px;
	white-space: nowrap;
	background-color: #eff7ff;
	border-bottom: 1px solid #8be;
}

.layerlist ul {
	padding: 5px;
}

.layerlist li {
	padding: 2px 5px 2px 5px;
}

.layerlistsubmit {
	padding: 0px 5px 5px 5px;
}

.explain {
	margin-left: 5px;
	vertical-align: text-bottom;
	cursor: pointer;
}

.explanation {
	width: 360px;
	display: none;
	position: absolute;
	padding: 20px 20px 10px 20px;
	color: #333;
	white-space: normal;
	background-color: #ffd;
	border: 1px solid #f90;
}

.explanation table {
	margin-top: 10px;
}

.explanation th {
	width: auto;
	padding: 0px 10px 5px 0px;
	font-weight: bold;
}

.explanation td {
	padding: 0px 10px 5px 0px;
}

.explanationclose {
	padding-top: 10px;
	font-size: 12px;
	text-align: center;
}

.explanationclose span {
	color: #666;
}

.itemlink {
	width: 400px;
	clear: both;
}

.itemlink a:link, .itemlink a:visited, .itemlink a:active {
	display: block;
	margin-bottom: 10px;
	padding: 15px;
	color: #333;
	font-size: 16px;
	border: 1px solid #57d;
}

.itemlink a:hover {
	text-decoration: none;
	background-color: #eff7ff;
}

.itemlink img {
	margin-right: 5px;
	vertical-align: top;
}

.setup {
	margin: 20px 40px 20px 40px;
	padding: 40px;
	border: 1px solid #999;
}

.setup h1 {
	margin-bottom: 20px;
}

.setup h2 {
	margin: 0px;
	padding: 5px 0px 5px 0px;
	color: #08d;
	font-size: 16px;
}

.setupdescription {
	padding-bottom: 10px;
	color: #080;
}



/* ------------------------------ 20230414 ------------------------------ */

.top_imghover{
	transition: opacity 0.3s ease 0s;
}

.top_imghover:hover{
	opacity: 0.7;
}

.top_all_wrap,
.top_all_wrap *,
.top_all_wrap *:before,
.top_all_wrap *:after{
	box-sizing: border-box;
}

.top_all_wrap figure{
	line-height: 0;
	margin: 0;
}

.top_all_wrap img{
	max-width: 100%;
	height: auto;
}

.top_all_wrap p{
	margin: 0;
}

body.top_login_type{
	background-color: #e9e9e9;
	background-image: url("../images/top_bg.png");
	background-size: 463px auto;
	background-position: 21% 41%;
}

@media screen  and (max-width:768px) {
	body.top_login_type{
		background-size: 231.5px auto;
	}
}

.top_all_wrap{
	overflow: hidden;
	height: 100vh;
	letter-spacing: -0.4em;
	font-size: 14px;
	line-height: 1.6;
	display: table;
	width: 100%;
}

.top_all_wrap_in{
	display: table-cell;
	vertical-align: middle;
	text-align: center;
}

@media screen and (max-height:720px)  and (min-width:769px) {
	.top_all_wrap{
		height: auto;
	}
}

@media screen and (max-height:692px)  and (max-width:768px) {
	.top_all_wrap{
		height: auto;
	}
}

.top_all_wrap ::-webkit-input-placeholder {
	color: #aaaaaa;
	opacity: 1;
}
.top_all_wrap ::-moz-placeholder {
	color: #aaaaaa;
	opacity: 1;
}
.top_all_wrap :-ms-input-placeholder {
	color: #aaaaaa;
}

.top_all_wrap :focus::-webkit-input-placeholder {
	opacity: 1;
	color: transparent;
}
.top_all_wrap :focus:-moz-placeholder {
	opacity: 1;
	color: transparent;
}
.top_all_wrap :focus::-moz-placeholder {
	opacity: 1;
	color: transparent;
}
.top_all_wrap :focus:-ms-placeholder {
	opacity: 1;
	color: transparent;
}

/* .top_content_wrap */

.top_content_wrap{
	display: inline-block;
	vertical-align: middle;
	text-align: left;
	letter-spacing: 0.05em;
	padding: 60px 30px;
	width: 100%;
}

.top_content{
	max-width: 960px;
	margin: 0 auto;
	background-color: #fff;
	border-radius: 10px;
	padding: 20px;
}

@media screen and (max-width:768px) {
	.top_content_wrap{
		padding: 10px;
	}
	.top_content{
		max-width: 355px;
		padding: 20px 25px 50px 25px;
		height: auto;
		min-height: 672px;
	}
}

/* .top_row */

.top_row{
	display: table;
	width: 100%;
}

@media screen and (max-width:768px) {
	.top_row{
		display: block;
	}
}

/* .top_row_text */

.top_row_text{
	position: relative;
	display: table-cell;
	vertical-align: middle;
	padding: 0 20px 0 0;
	width: 360px;
}

@media screen and (max-width:1020px) {
	.top_row_text{
		width: 39.1%;
	}
}

@media screen and (max-width:768px) {
	.top_row_text{
		display: block;
		width: 100%;
		padding: 0;
	}
}

/* .top_row_image */

.top_row_image{
	display: table-cell;
	text-align: center;
	vertical-align: middle;
	position: relative;
	width: 560px;
}

@media screen and (max-width:1020px) {
	.top_row_image{
		width: 60.9%;
	}
}

@media screen and (min-width:769px) {
	
}

@media screen and (max-width:768px) {
	.top_row_image{
		display: block;
		width: auto;
	}
}

/* top_image_obj_wrap */

.top_image_obj_wrap{
	display: inline-block;
	vertical-align: bottom;
	width: 100%;
}

.top_image_obj{
	overflow: hidden;
	border-radius: 10px;
	padding-bottom: 100%;
	position: relative;
}

.top_image_obj img{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

@media screen and (max-width:768px) {
	.top_image_obj_wrap{
		width: 250px;
	}
}

/* .top_header */

.top_header{
	position: absolute;
	top: 0;
	left: 0;
	padding: 10px 20px 0 0;
	width: 100%;
	text-align: center;
}

.top_header_logo{
	display: inline-block;
	vertical-align: bottom;
	max-width: 220px;
}

@media screen and (max-width:768px) {
	.top_header{
		position: static;
		margin:  0 0 17px 0;
		padding: 0;
	}
	.top_header_logo{
		max-width: 190px;
	}
}

/* .top_login_block */

.top_login_block{
	width: 100%;
	max-width: 300px;
	margin: 0 auto;
	padding: 70px 0 70px 0;
}

.top_login_block .top_login_title01{
	font-size: 18px;
	font-weight: 700;
	border-bottom: none;
	text-align: center;
	line-height: 1;
	letter-spacing: 0.1em;
	margin: 0 0 28px 0;
	padding: 0;
}

.top_login_block input[type="text"],
.top_login_block input[type="password"]{
	border: 1px solid #aaaaaa;
	font-size: 16px;
	height: 40px;
	padding: 7px 10px;
	width: 100%;
}

@media screen and (max-width:768px) {
	.top_login_block{
		padding: 0 0 20px 0;
	}
	.top_login_block h1{
		margin: 0 0 20px 0;
	}
}

/* .top_login_item_wrap */

.top_login_item_wrap{
	margin: 0 0 20px 0;
}

.top_login_item{
	margin: 0 0 20px 0;
}

.top_login_item:last-child{
	margin-bottom: 0;
}

/* .top_login_submit */

.top_login_submit{
	margin:  0 0 20px 0;
}

.top_login_submit input[type="submit"]{
	font-size: 16px;
	font-weight: 700;
	height: 40px;
	width: 100%;
	border-radius: 5px;
	background-color: #333333;
	color: #fff;
	border: none;
	cursor: pointer;
}

/* .top_login_storage */

.top_login_storage{
	display: flex;
	justify-content: center;
	margin:  0 0 23px 0;
}

.top_login_storage label{
	display: inline-block;
	vertical-align: middle;
}

.top_login_storage label input{
	display: none;
}

.top_login_storage label input + span{
	position: relative;
	display: inline-block;
	vertical-align: bottom;
	padding: 0 0 0 26px;
}

.top_login_storage label input + span:before,
.top_login_storage label input + span:after{
	content: "";
	display: block;
	position: absolute;
}

.top_login_storage label input + span:before{
	top: 0.8em;
	left: 0;
	width: 20px;
	height: 20px;
	margin: -10px 0 0 0;
	border-radius: 2px;
	border: 1px solid #aaaaaa;
	background-color: #ffffff;
}
.top_login_storage label input + span:after{
	top: 0.8em;
	left: 3px;
	width: 15px;
	height: 11px;
	margin: -5.5px 0 0 0;
	background-image: url("../images/top_checkmark.png");
	background-size: 100% auto;
	background-repeat: no-repeat;
}

.top_login_storage label input:checked + span:before{
	background-color: #333333;
}

/* .top_login_remind */

.top_login_remind{
	display: flex;
	justify-content: center;
	letter-spacing: 0.1em;
}

.top_login_remind a{
	color: #aaaaaa;
}

/* .top_login_alert */

.top_login_alert{
	display: flex;
	justify-content: center;
	color: #b42a2a;
	margin: -5px 0 10px 0;
}

.top_login_alert:last-child{
	margin-bottom: 0;
}

.top_login_alert p{
	margin: 0;
}
