.container {
	min-width: 980px;
}

#site_logo {
	text-align: center;
	padding-top: 120px;
	margin-bottom: 40px;
}

#site_logo p {
	font-size: 40px;
	line-height: 1.3;
	letter-spacing: .05em;
	margin-bottom: 20px;
	-webkit-transition: font-size .2s;
	transition: font-size .2s;
}

#site_logo p u {
	text-decoration: none;
	padding: 0 6px;
	background: -webkit-linear-gradient(transparent 50%, #e85647 50%);
	background: linear-gradient(transparent 50%, #e85647 50%);
}

#site_logo > span {
	font-size: 18px;
}

#bg-login {
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#66000000,endColorstr=#66000000); 
	background: rgba(0,0,0,0.4);
	padding: 40px 0;
	margin-bottom: 40px;
	min-width: 980px;
}

#bg-login:not(:target) {
	filter: none;
}

.main_txt {
	text-align: center;
	font-size: 20px;
	margin-bottom: 14px;
	line-height: 1.5;
	-webkit-transition: font-size .2s;
	transition: font-size .2s;
}

.sub_txt {
	text-align: center;
	font-size: 16px;
	line-height: 1.5;
	margin-bottom: 35px;
	-webkit-transition: font-size .2s;
	transition: font-size .2s;
}

.inputbox {
	width: 280px;
	margin: 0 auto;
	position: relative;
}

.input_pass {
	position: relative;
	width: 280px;
	overflow: hidden;
}

.inputbox input[type="password"] {
	appearance:none;
	-webkit-appearance:none;
	border: none;
	outline: none;
	padding: 10px 20px 11px;
	font-size: 18px;
	display: inline-block;
	width: 280px;
	box-sizing: border-box;
	vertical-align: middle;
	background: rgba(255,255,255,0.8);
	display: block;
	-webkit-transition: all .3s;
	transition: all .3s;
	border: 3px solid transparent;
	height: 50px;
	border-radius: 0px;
}

.inputbox input[type="password"]:focus  {
	border: 3px solid #e85647;
}

.inputbox input[type="submit"] {
	border-radius: 0px;
	position: absolute;
	right: 3px;
	top: 3px;
	display: block;
	background-color: #222;
	appearance:none;
	-webkit-appearance:none;
	border: none;
	outline: none;
	color: #fff;
	width: 44px;
	height: 44px;
	vertical-align: middle;
	-webkit-transform: scale(1);
	transform: scale(1);
	-webkit-transition: background-color .2s,transform .2s;
	transition: background-color .2s,transform .2s;
	text-indent: -9999px;
	background-image: url("../img/pc/dwc/arrow_next_10x14.svg");
	background-repeat: no-repeat;
	background-size: 10px 14px;
	background-position: center center;
}

.inputbox input[type="submit"].focus {
	background-color: #e85647;
	-webkit-transform: scale(0.864);
	transform: scale(0.864);
	background-image: url("../img/pc/dwc/arrow_next_10x14.svg");
	background-repeat: no-repeat;
	background-size: 10px 14px;
	background-position: center center;
}

.txt_pass {
	text-align: center;
	font-size: 16px;
	margin-bottom: 40px;
	line-height: 1.5;
}

.txt_pass .small {
	font-size: 14px;
}

.input_remember {
	margin-top: 20px;
}

.input_remember label {
	margin-left: 5px;
}

.txt_qrcode {
	text-align: center;
	font-size: 0;
	margin-bottom: 80px;
}

.txt_qrcode .qr {
	background: #fff;
	padding: 8px;
	display: inline-block;
	vertical-align: middle;
}

.txt_qrcode p {
	font-size: 14px;
	display: inline-block;
	vertical-align: middle;
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000,endColorstr=#99000000); 
	background: rgba(0,0,0,0.6);
	padding: 16px 20px 16px 40px;
}

.txt_qrcode p:not(:target) {
	filter: none;
}

.txt_qrcode p .icn {
	vertical-align: middle;
	margin-right: 12px;
}

.error-message {
	font-size: 14px;
	margin-top: 20px;
	text-align: center;
	font-weight: 700;
}

.error-message:before {
	content: '';
	display: inline-block;
	width: 4px;
	height: 18px;
	background: url("../img/pc/dwc/use_exclamation.svg") no-repeat;
	background-size: 4px 18px;
	margin: 0 20px;
	vertical-align: middle;
}

.error-message:after {
	content: '';
	display: inline-block;
	width: 4px;
	height: 18px;
	background: url("../img/pc/dwc/use_exclamation.svg") no-repeat;
	background-size: 4px 18px;
	margin: 0 20px;
	vertical-align: middle;
}

.bnr_list{
	margin: 0 auto 40px;
	padding: 0;
	text-align: center;
}

.bnr {
	display: table;
	table-layout: fixed;
	margin: 0 auto;
}

.bnr li {
	display: table-cell;
	padding: 0 6px 0 5px;
	box-sizing: border-box;
}


.bnr.og {
	margin-bottom: 30px;
}

.bnr li img {
	width: 100%;
	height: auto;
}

.bnr li:first-child {
	margin-left: 0;
}

.bnr li:last-child {
	margin-bottom: 40px;
}

.bnr a{
	padding: 0;
	-webkit-transition: all 0.3s;
	transition: all 0.3s;
	position: relative;
	display: block;
}

.bnr a:hover {
	filter: alpha(opacity=100);
	-khtml-opacity: 1;
	-moz-opacity: 1;
	opacity: 1;
}

.bnr a img{
	vertical-align: middle;
}

.bnr a .img_border{
	position: absolute;
	box-sizing: border-box;
	top:0;
	left: 0;
	width: 100%;
	height: 100%;
	border-color: #c4a551;
	border-style: solid;
	border-width: 0;
	-webkit-transition: border-width 0.1s linear 0s;
	transition: border-width 0.1s linear 0s;
}

.bnr a:hover .img_border{
	border-width: 4px;
	-webkit-transition: border-width 0.2s linear 0s;
	transition: border-width 0.2s linear 0s;
}

.btn_use {
	display: block;
	position: relative;
	text-align: center;
	letter-spacing: .1em;
	width: 400px;
	background-color: #e85647;
	margin: 0 auto;
	-webkit-transition: background-color .5s;
	transition: background-color .5s;
	overflow: hidden;
}
.btn_use:hover {
	color: #e85647;
	background-color: #fff;
}
.btn_use button{
	display: block;
	color: #fff;
	font-size: 16px;
	font-weight: 700;
	width: 100%;
	background-color: transparent;
	padding: 22px 0;
	border: none;
	cursor: pointer;
}
.btn_use:hover button{
	color: #e85647;
}
.btn_use .arrow {
	position: absolute;
	top: 50%;
	right: 20px;
	width: 10px;
	height: 14px;
	margin-top: -7px;
	opacity: 1;
}
.btn_use:hover .arrow {
	animation: arrow .5s ;
}
.cls-1 {
	fill: #fff;
	fill-rule: evenodd;
}
.btn_use:hover .cls-1 {
	fill: #e85647;
}
@keyframes arrow {
	30% {
		right: 20px;
		opacity: 0;
	}
	50% {
		right: 40px;
		opacity: 0;
	}
	100% {
		right: 20px;
		opacity: 1;
	}
}

.copy {
	min-width: 980px;
}

@media screen and (max-width: 640px) {
	.container {
	min-width: 100%;
}
	#bg-login {
		min-width: 100%;
	}

	#site_logo {
		padding-top: 60px;
		margin-bottom: 40px;
	}

	#site_logo p {
		font-size: 32px;
		margin-bottom: 10px;
	}

	#site_logo span {
		font-size: 10px;
	}

	#site_logo > span {
		font-size: 14px;
	}

	.input_pass {
		width: 100%;
	}

	.inputbox input[type="password"] {
		width: 100%;
	}

	.bnr_list {
		width: 100%;
		margin: 0 auto 0;
	}

	.bnr li {
		float: left;
		margin-left: 0px;
		margin-bottom: 5px;
		padding: 0;
	}

	.bnr.og {
		margin-bottom: 5px;
	}

	.bnr.og li:last-child {
		margin-bottom: 0px;
	}

	.bnr li.pc_only {
		display: none;
	}

	.bnr li:last-child {
		margin-bottom: 15px;
	}

	.bnr li a {
		position: relative;
	}

	.bnr li a:after {
		content: '';
		width: 34px;
		height: 38px;
		position: absolute;
		top: 50%;
		right: 2px;
		margin-top: -19px;
		background: url("../img/sp/default/icon_arrow_link_shadow.png") no-repeat center right;
		background-size: 34px 38px;
	}
	.bnr li.no_arrow a:after {
		display: none;
	}

	.bnr li.color a:after {
		width: 9px;
		height: 13px;
		right: 15px;
		margin-top: -5px;
		background: url("../img/sp/default/icon_arrow_link_color.png") no-repeat center right;
		background-size: 9px 13px;
	}

	.main_txt {
		font-size: 18px;
	}

	.sub_txt {
		font-size: 14px;
		margin-bottom: 20px;
	}

	.inputbox {
		width: 100%;
		margin: 0 auto
	}

	.txt_pass {
		margin-bottom: 40px;
		font-size: 14px;
	}

	.txt_pass .small {
		font-size: 12px;
	}

	.error-message {
		position: relative;
		padding: 0 30px;
		font-size:12px;
	}

	.error-message:before {
		content: '';
		display: block;
		margin: 0px;
		position: absolute;
		top: 0;
		left: 50%;
		margin-left: -110px;
	}

	.error-message:after {
		content: '';
		display: block;
		margin: 0px;
		position: absolute;
		top: 0;
		right: 50%;
		margin-right: -110px;
	}

	.btn_use {
		width: 100%;
		background-size: 9px 12px;
	}
	.btn_use button{
		font-size: 14px;
		padding: 16px 0;
	}
	.btn_use .arrow {
		right: 10px;
		width: 9px;
		height: 12px;
		margin-top: -6px;
	}
	@keyframes arrow {
		30% {
			right: 10px;
			opacity: 0;
		}
		50% {
			right: 20px;
			opacity: 0;
		}
		100% {
			right: 10px;
			opacity: 1;
		}
	}

	.copy {
		min-width: 100%;
		padding-bottom: 20px;
		margin-bottom: 0;
	}

}