* {
	margin:0;
	padding:0;
}
*:focus {
	outline: none;
}

html, body {height:100%;}

body {
	background-color: #fff;
	font-family: arial,helvetica;
	font-size: 14px;
	color: #000;
}
img {
	border:none;
}
p, h1, h2, h3, h4, h5 {
	margin: 0px;
	padding: 0px;
}
a:link, a:visited, a:active {
	color: #216fab; text-decoration: underline;
}
a:hover {
	color: #216fab; text-decoration: underline;
}
div.clear {clear: both;}

input {margin:0;padding:0;width:100%;border:1px solid #999;padding:4px;font-family:arial,helvetica;font-size:14px;}
textarea {width:100%;border:1px solid #999;padding:4px;font-family:arial,helvetica;font-size:14px;}

button, input[type=button], input[type=submit] {
	background-color:#216fab;border:1px solid #222222;padding:5px 20px;font-size:15px;font-weight:bold;color:#fff;cursor:pointer;
}

/* overlay */
#overlay_popup .cnt {
	width: 400px;
	/*height:400px;*/
	/*overflow: auto;*/
	padding: 10px 10px;
	border: 1px solid #999;
	background-color: #fff;
}
#overlay_popup .bclose {
	float: right;
	margin: 10px 0px 0px 0px;
	padding: 4px 10px;
	border: 1px solid #222222;
	background-color: #216fab;
}
#overlay_popup .bclose a {
	text-decoration: none;
	font-weight: bold;
	color:#fff;
}


#m_page {
	position: absolute;
	left: 50%;
	top: 50%;
	margin-left: -225px;
	margin-top: -90px;
	width: 440px;
	height: 180px;
}

#m_head {
}
#m_head .logo {
	display: none;
	text-align: center;
}
#m_head .logo img {
	max-width: 280px;
}
#h_slogan {
	display: none;
}

#m_center {
}
#m_center .bgrnd {
}

#m_bottom {
}
#m_bottom .bgrnd {
}


#m_content {
}
#m_content .bgrnd {
	display: none;
}
#m_content .box {
}
#m_content div.box {
	padding: 30px 0;
}


/* --- Login --- */
#o_login {
}
#o_login .err {
	text-align:center;
	padding:0px 0px 15px 0px;
	font-size:14px;
	font-weight:bold;
	color:#c00;
}
#o_login .f_left {
	float:left;
	width:344px;
	height:90px;
}
#o_login .f_right {
	float:right;
	width:90px;
	height:90px;
}

#o_login .f_ico {
	float:left;
	width:40px;
	height:40px;
	background-image: url(../img/opener_login/form_bgrnd_01.png);
	background-repeat: no-repeat;
}
#o_login .f_tf {
	width:282px;
	border:none;
	background:none;
	margin:0px 8px;
	padding:8px 0px;
	font-size:20px;
	color:#333;
	text-align:left;
}
#o_login .f_nl {
	clear:both;
	width:340px;
	height:10px;
}

#o_login .f_ico_email {
	background-position: 0px -160px;
}
#o_login .f_ico_key {
	background-position: 0px -210px;
}
#o_login .f_tf_bgrnd {
	float:left;
	width:300px;
	height:40px;
	background-image: url(../img/opener_login/form_bgrnd_01.png);
	background-repeat:no-repeat;
	background-position: -80px -160px;
}
#o_login .f_tf_but {
	margin-top:0px;
	margin-left:0px;
	width:90px;
	height:90px;
	border:none;
	background-image: url(../img/opener_login/form_bgrnd_01.png);
	background-repeat:no-repeat;
	background-position: -390px -160px;
	cursor:pointer;
}
#o_login .f_tf_but div {
	display: none;
}



@media only screen and (min-width: 960px) and (max-width: 1280px) {
	#m_page {
		margin-left: -300px;
		margin-top: -155px;
		width: 600px;
		height: 310px;
	}
	
	#m_head .logo img {
		max-width: 310px;
	}

	#o_login .err {
		padding:0px 0px 15px 0px;
		font-size:20px;
		font-weight:bold;
		color:#c00;
	}
	#o_login .f_left {
		width:440px;
		height:90px;
	}
	#o_login .f_right {
		width:140px;
		height:140px;
	}
	
	#o_login .f_ico {
		width:60px;
		height:60px;
	}
	#o_login .f_tf {
		width:360px;
		margin:0px 8px;
		padding:12px 0px;
		font-size:28px;
	
	}
	#o_login .f_nl {
		width:340px;
		height: 20px;
	}
	
	#o_login .f_ico_email {
		background-position: 0px 0px;
	}
	#o_login .f_ico_key {
		background-position: 0px -79px;
	}
	#o_login .f_tf_bgrnd {
		width:380px;
		height:60px;
		background-position: -60px 0px;
	}
	#o_login .f_tf_but {
		width:140px;
		height:140px;
		background-position: -460px 0px;
	}
}


@media only screen and (min-width: 767px) and (max-width: 959px) {
	#m_page {
		margin-left: -300px;
		margin-top: -155px;
		width: 600px;
		height: 310px;
	}
	
	#m_head .logo img {
		max-width: 310px;
	}

	#o_login .err {
		padding:0px 0px 15px 0px;
		font-size:20px;
		font-weight:bold;
		color:#c00;
	}
	#o_login .f_left {
		width:440px;
		height:90px;
	}
	#o_login .f_right {
		width:140px;
		height:140px;
	}
	
	#o_login .f_ico {
		width:60px;
		height:60px;
	}
	#o_login .f_tf {
		width:360px;
		margin:0px 8px;
		padding:12px 0px;
		font-size:28px;
	
	}
	#o_login .f_nl {
		width:340px;
		height: 20px;
	}
	
	#o_login .f_ico_email {
		background-position: 0px 0px;
	}
	#o_login .f_ico_key {
		background-position: 0px -79px;
	}
	#o_login .f_tf_bgrnd {
		width:380px;
		height:60px;
		background-position: -60px 0px;
	}
	#o_login .f_tf_but {
		width:140px;
		height:140px;
		background-position: -460px 0px;
	}
}

@media only screen and (min-width: 480px) and (max-width: 767px) {
}

@media only screen and (max-width: 479px) {
	#m_page {
		margin-left: -140px;
		margin-top: -155;
		width: 280px;
		height: 310px;
	}
	
	#m_head .logo img {
		max-width: 240px;
	}

	#o_login .f_left {
		width:280px;
		height:90px;
	}
	#o_login .f_right {
		float: left;
		width:90px;
		height:90px;
		margin-top: 20px;
		margin-left: 95px;
	}
	
	#o_login .f_ico {
		width:40px;
		height:40px;
	}
	#o_login .f_tf {
		width:220px;
		margin:0px 8px;
		padding:8px 0px;
		font-size:20px;
	
	}
	#o_login .f_nl {
		width:280px;
		height: 10px;
	}
	
	#o_login .f_ico_email {
		background-position: 0px -160px;
	}
	#o_login .f_ico_key {
		background-position: 0px -210px;
	}
	#o_login .f_tf_bgrnd {
		width:240px;
		height:40px;
		background-position: -140px -160px;
	}
	#o_login .f_tf_but {
		width:90px;
		height:90px;
		background-position: -390px -160px;
	}
}
