.container {
	max-width: 100%;
	font-size: 0.95em;
}

/* .color_1 */
.color_title {
	background: #456F9A;
	border-color: #456F9A;
	color: #000000;
}

.color_red {
	color: #ff0000;
}

/* .color_grad1{
	border-bottom: 0.4em solid #d814ba;
} */

/* .color_grad3 */
.color_gradBlue {
	/* ログイン画面 社内HP 水色グラデーション*/
	background: linear-gradient(to top, #72B8FD 0, #E4F5FD 70%);
	border: 1px solid #004080;
	font-size: 0.8em;
}

.no_margin {
	margin: 0 0 0 0;
}

.no_padding {
	padding: 0 0 0 0;
}

.footer_style {
	color: #ffffff;
	background: #456F9A; border-color : #456F9A;
	text-align: center;
	font-size: 1.2em;
	height: 1.6em;
	line-height: 1.6em;
	border-color: #456F9A;
}

.hedder_style {
	margin: 0.3em auto 0 auto;
	padding: 0;
	height: 6%;
	border-bottom: 0.4em solid #d814ba;
}

/* Astra文言用 */
.systmNm_style {
	margin-top: -0.18em;
	font-family: HGPMinchoE, "HGP明朝E", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3",
		"Hiragino Mincho ProN", "HG明朝E", "ＭＳＰ明朝", "ＭＳ明朝", serif;
	font-size: 5em;
	text-shadow: 0 0.025em 0 #333333, 0 0.025em 0.012em rgba(0, 0, 0, 0.8);
}

.systmNm_mask>p,.systmNm_mask>p:before {
	position: absolute;
	top: 0;
	left: 0;
	color: #F7DE05;
}

.systmNm_mask>p:before {
	display: block;
	content: attr(title);
	color: #B67B03;
	-webkit-mask-image: -webkit-linear-gradient(45deg, rgba(0, 0, 0, 0),
		rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.3),
		rgba(0, 0, 0, 0.3));
	font-weight: bold;
}

.line {
	margin: 0 0 0 0;
	border: solid 1px #ffffff;
}

.pageTitle_style {
	display: block;
	width: 100%;
	background: #456F9A;
	color: #fff;
	font-size: 1.7em;
	line-height: 2em;
	text-align: left;
	text-decoration: none;
}

.text_centering {
	text-align: center;
}

.text_middle {
	vertical-align: middle !important;
}

.font_family {
	font-family: Arial, Meiryo, sans-serif;
}

@media ( min-width : 700px) {

	/* 背景色有 中央白浮き用 */
	body {
		background-color: #EBF4F4;
	}

	.footer_style {
		color: #ffffff;
		text-align: center;
		font-size: 1.2em;
		height: 1.6em;
		line-height: 1.6em;
		margin-top: 2em;
	}

	.box_whiye {
		box-shadow: 5px 5px 10px #000;
		-webkit-box-shadow: 5px 5px 10px #000;
		-moz-box-shadow: 5px 5px 10px #000;
		padding: 10px;
		border: 1px solid #ccc;
		background: #ffffff;
	}

	.line {
		margin: 0 0 0 0;
		border: solid 1px #EBF4F4;
	}
}

/* mobile*/
@media ( max-width : 479px) {

	body {
		font-size: 1.0em;
	}

	.container {
		margin: 0;
	}

	.btn {
		font-size: 1.0em;
	}
}

@font-face {
	font-family: 'Meiryo';
	src: url('C:\Windows\Fonts\Meiryo UI\meiryo.ttc')
		format('TrueType Collection');
}

@font-face {
	font-family: 'HGPMinchoE';
	src: url('C:\Windows\Fonts\HGRME.TTC') format('TrueType Collection');
}

.password-wrapper {
  display: flex;
  max-width: 500px;
  border: 1px solid #ddd;
  border-radius: 5px;
}

.password_input {
  flex: 1;
  outline: none;
  appearance: none;
  padding: 10px 0 10px 10px;
  border: none;
  border-radius: 5px 0 0 5px;
  font-size: 16px;
}

.password_toggle {
  width: 40px;
  border: none;
  background-image: url(/05_images/30_OP/password_open.png);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 50% auto;
  cursor: pointer;
}

.password_toggle.is-visible {
  background-image: url(/05_images/30_OP/password_close.png);
}

@media (any-hover: hover) {
  .password_toggle:hover {
    opacity: 0.7;
  }
}