@charset "UTF-8";

/* ユーザー設定モーダル用のCSS ============================= */
.userinfo-content{
	box-sizing: border-box;
	overflow: auto;
	width: 600px;
	max-width: 90%;
	max-height: 90%;
	margin:0;
	padding:30px 30px 40px 30px;
	/*border:2px solid #aaa;*/
	background:#fff;
	position:fixed;
	display:none;
	z-index:2;
	border-radius: 4px;
	box-shadow: 0 0 6px rgba(0,0,0,.8);
}
.userinfo-content h2 {
	padding:10px 0 0px;
	font-weight:bold;
}
.userinfo-content .inputBox {
	clear: both;
}
.userinfo-content .inputBox + .inputBox {
	padding-top: 16px;
}
.userinfo-content .inputBox p {
	position: relative;
}
.userinfo-content .hints {
	position: absolute;
	top: 3.3em;
	right: .5em;
	display: none;
	padding: 1em;
	width: 200px;
	box-sizing: border-box;
	border-radius: 4px;
	background-color: #222;
	background-color: rgba(0,0,0,.8);
	color: #fff;
}
.userinfo-content .hints:after {
	content: "";
	position: absolute;
	top: -4px;
	right: 4px;
	display: block;
	width: 0;
	height: 0;
	border-bottom: 4px solid #222;
	border-bottom-color: rgba(0,0,0,.8);
	border-left: 4px solid transparent;
	border-right: 4px solid transparent;
}

.userinfo-content .btnBox{
	padding: 24px 0px 0;
}
.userinfo-content .btnBox .button {
	float: none;
	display: block;
	width: 49%;
	margin: 0;
	padding: 12px 24px;
	box-sizing: border-box;
	height: auto;
	line-height: 1;
}
.userinfo-content .btnBox .btnSave {
	float: right;
}
#userinfo-content .btnBox .button.btnClose:before {
	content: "\e60d";
}
#userinfo-content input.error {
	background-color: #fdd;
}
.info-menu{
	box-sizing: border-box;
	overflow: auto;
	width: 600px;
	max-width: 90%;
	max-height: 90%;
	margin:0;
	padding:30px 30px 40px 30px;
	/*border:2px solid #aaa;*/
	background:#fff;
	position:fixed;
	display:none;
	z-index:2;
	border-radius: 4px;
	box-shadow: 0 0 6px rgba(0,0,0,.8);
}
.info-menu h2 {
	padding:10px 0 0px;
	font-weight:bold;
}
.info-menu .inputBox {
	clear: both;
}
.info-menu .inputBox + .inputBox {
	padding-top: 16px;
}
.info-menu .inputBox p {
	position: relative;
}
.info-menu .hints {
	position: absolute;
	top: 3.3em;
	right: .5em;
	display: none;
	padding: 1em;
	width: 200px;
	box-sizing: border-box;
	border-radius: 4px;
	background-color: #222;
	background-color: rgba(0,0,0,.8);
	color: #fff;
}
.info-menu .hints:after {
	content: "";
	position: absolute;
	top: -4px;
	right: 4px;
	display: block;
	width: 0;
	height: 0;
	border-bottom: 4px solid #222;
	border-bottom-color: rgba(0,0,0,.8);
	border-left: 4px solid transparent;
	border-right: 4px solid transparent;
}

.info-menu .btnBox{
	padding: 24px 0px 0;
}
.info-menu .btnBox .button {
	float: none;
	display: block;
	width: 49%;
	margin: 0;
	padding: 12px 24px;
	box-sizing: border-box;
	height: auto;
	line-height: 1;
}
.info-menu .btnBox .btnSave {
	float: right;
}
#info-menu .btnBox .button.btnClose:before {
	content: "\e60d";
}
#info-menu input.error {
	background-color: #fdd;
}
.user-certification{
	box-sizing: border-box;
	overflow: auto;
	width: 600px;
	max-width: 90%;
	max-height: 90%;
	margin:0;
	padding:30px 30px 40px 30px;
	/*border:2px solid #aaa;*/
	background:#fff;
	position:fixed;
	display:none;
	z-index:2;
	border-radius: 4px;
	box-shadow: 0 0 6px rgba(0,0,0,.8);
}
.user-certification h2 {
	padding:10px 0 0px;
	font-weight:bold;
}
.user-certification .inputBox {
	clear: both;
}
.user-certification .inputBox + .inputBox {
	padding-top: 16px;
}
.user-certification .inputBox p {
	position: relative;
}
.user-certification .hints {
	position: absolute;
	top: 3.3em;
	right: .5em;
	display: none;
	padding: 1em;
	width: 200px;
	box-sizing: border-box;
	border-radius: 4px;
	background-color: #222;
	background-color: rgba(0,0,0,.8);
	color: #fff;
}
.user-certification .hints:after {
	content: "";
	position: absolute;
	top: -4px;
	right: 4px;
	display: block;
	width: 0;
	height: 0;
	border-bottom: 4px solid #222;
	border-bottom-color: rgba(0,0,0,.8);
	border-left: 4px solid transparent;
	border-right: 4px solid transparent;
}

.user-certification .btnBox{
	padding: 24px 0px 0;
}
.user-certification .btnBox .button {
	float: none;
	display: block;
	width: 49%;
	margin: 0;
	padding: 12px 24px;
	box-sizing: border-box;
	height: auto;
	line-height: 1;
}
.user-certification .btnBox .btnSave {
	float: right;
}
#user-certification .btnBox .button.btnClose:before {
	content: "\e60d";
}
#user-certification input.error {
	background-color: #fdd;
}

.user-certification-valid{
	box-sizing: border-box;
	overflow: auto;
	width: 600px;
	max-width: 90%;
	max-height: 90%;
	margin:0;
	padding:30px 30px 40px 30px;
	/*border:2px solid #aaa;*/
	background:#fff;
	position:fixed;
	display:none;
	z-index:2;
	border-radius: 4px;
	box-shadow: 0 0 6px rgba(0,0,0,.8);
}
.user-certification-valid h2 {
	padding:10px 0 0px;
	font-weight:bold;
}
.user-certification-valid .inputBox {
	clear: both;
}
.user-certification-valid .inputBox + .inputBox {
	padding-top: 16px;
}
.user-certification-valid .inputBox p {
	position: relative;
}
.user-certification-valid .hints {
	position: absolute;
	top: 3.3em;
	right: .5em;
	display: none;
	padding: 1em;
	width: 200px;
	box-sizing: border-box;
	border-radius: 4px;
	background-color: #222;
	background-color: rgba(0,0,0,.8);
	color: #fff;
}
.user-certification-valid .hints:after {
	content: "";
	position: absolute;
	top: -4px;
	right: 4px;
	display: block;
	width: 0;
	height: 0;
	border-bottom: 4px solid #222;
	border-bottom-color: rgba(0,0,0,.8);
	border-left: 4px solid transparent;
	border-right: 4px solid transparent;
}

.user-certification-valid .btnBox{
	padding: 24px 0px 0;
}
.user-certification-valid .btnBox .button {
	float: none;
	display: block;
	width: 49%;
	margin: 0;
	padding: 12px 24px;
	box-sizing: border-box;
	height: auto;
	line-height: 1;
}
.user-certification-valid .btnBox .btnSave {
	float: right;
}
#user-certification-valid .btnBox .button.btnClose:before {
	content: "\e60d";
}
#user-certification-valid input.error {
	background-color: #fdd;
}
.user-backup-code{
	box-sizing: border-box;
	overflow: auto;
	width: 600px;
	max-width: 90%;
	max-height: 90%;
	margin:0;
	padding:30px 30px 40px 30px;
	/*border:2px solid #aaa;*/
	background:#fff;
	position:fixed;
	display:none;
	z-index:2;
	border-radius: 4px;
	box-shadow: 0 0 6px rgba(0,0,0,.8);
}
.user-backup-code h2 {
	padding:10px 0 0px;
	font-weight:bold;
}
.user-backup-code .inputBox {
	clear: both;
}
.user-backup-code .inputBox + .inputBox {
	padding-top: 16px;
}
.user-backup-code .inputBox p {
	position: relative;
}
.user-backup-code .hints {
	position: absolute;
	top: 3.3em;
	right: .5em;
	display: none;
	padding: 1em;
	width: 200px;
	box-sizing: border-box;
	border-radius: 4px;
	background-color: #222;
	background-color: rgba(0,0,0,.8);
	color: #fff;
}
.user-backup-code .hints:after {
	content: "";
	position: absolute;
	top: -4px;
	right: 4px;
	display: block;
	width: 0;
	height: 0;
	border-bottom: 4px solid #222;
	border-bottom-color: rgba(0,0,0,.8);
	border-left: 4px solid transparent;
	border-right: 4px solid transparent;
}

.user-backup-code .btnBox{
	padding: 24px 0px 0;
}
.user-backup-code .btnBox .button {
	float: none;
	display: block;
	width: 49%;
	margin: 0;
	padding: 12px 24px;
	box-sizing: border-box;
	height: auto;
	line-height: 1;
}
.user-backup-code .btnBox .btnSave {
	float: right;
}
#user-backup-code .btnBox .button.btnClose:before {
	content: "\e60d";
}
#user-backup-code input.error {
	background-color: #fdd;
}
.invalid{
	box-sizing: border-box;
	overflow: auto;
	width: 600px;
	max-width: 90%;
	max-height: 90%;
	margin:0;
	padding:30px 30px 40px 30px;
	/*border:2px solid #aaa;*/
	background:#fff;
	position:fixed;
	display:none;
	z-index:2;
	border-radius: 4px;
	box-shadow: 0 0 6px rgba(0,0,0,.8);
}
.invalid h2 {
	padding:10px 0 0px;
	font-weight:bold;
}
.invalid .inputBox {
	clear: both;
}
.invalid .inputBox + .inputBox {
	padding-top: 16px;
}
.invalid .inputBox p {
	position: relative;
}
.invalid .hints {
	position: absolute;
	top: 3.3em;
	right: .5em;
	display: none;
	padding: 1em;
	width: 200px;
	box-sizing: border-box;
	border-radius: 4px;
	background-color: #222;
	background-color: rgba(0,0,0,.8);
	color: #fff;
}
.invalid .hints:after {
	content: "";
	position: absolute;
	top: -4px;
	right: 4px;
	display: block;
	width: 0;
	height: 0;
	border-bottom: 4px solid #222;
	border-bottom-color: rgba(0,0,0,.8);
	border-left: 4px solid transparent;
	border-right: 4px solid transparent;
}

.invalid .btnBox{
	padding: 24px 0px 0;
}
.invalid .btnBox .button {
	float: none;
	display: block;
	width: 49%;
	margin: 0;
	padding: 12px 24px;
	box-sizing: border-box;
	height: auto;
	line-height: 1;
}
.invalid .btnBox .btnSave {
	float: right;
}
#invalid .btnBox .button.btnClose:before {
	content: "\e60d";
}
#invalid input.error {
	background-color: #fdd;
}

/*.button-link{
	color:#00f;
	text-decoration:underline;
}
.button-link:hover{
	cursor:pointer;
	color:#f00;
}*/
#modal-overlay{
	z-index:1;
	display:none;
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background-color:rgba(0,0,0,.75);
}
#modal-overlay5{
	z-index:1;
	display:none;
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background-color:rgba(0,0,0,.75);
}

.flRight{
	float: right;
}
/*
 * Main stylesheet for Switchery.
 * http://abpetkov.github.io/switchery/
 */
.switchery {
	position: relative;
	display: block;
	box-sizing: content-box;
	margin: 0 auto;
	width: 40px;
	height: 16px;
	border: 1px solid rgba(0,0,0,.2) !important;
	border-radius: 16px;
	background-color: #fff;
	box-shadow: 0 0 1px rgba(0,0,0,.4) inset !important;
	cursor: pointer;
	vertical-align: middle;
}
.switchery > small {
	position: absolute;
	top: 0;
	width: 16px;
	height: 16px;
	border-radius: 100%;
	background: #fff;
	box-shadow: 0 0 3px rgba(0,0,0,.4);
}

.update_msg {
	background-color: #faefb6;
	color: #d51004;
	padding: 10px 20px;
}

.errorMsg{
	color: #dd0000;
}
.user-content-href
{
        cursor: pointer;
}
.user-certification-href
{
        cursor: pointer;
}

}