@charset "UTF-8";

html,body {
	min-width:350px;
	height:100%;
	overflow:auto;
}

.locale_wrap {
	z-index:10;
	margin-bottom:26px;
	text-align:right;
}

.locale_wrap select {
	color:#FFF;
	width:100px;
	height:auto;
	border-radius:3px;
	background-color:#bfc8e5;
	border-color:#bfc8e5;
	padding:2px 3px;
}

.locale_wrap.newly {
	position:absolute;
	top:-31px;
	width:311px;
}

.locale_wrap.newly select {
	color:#70778c;
	height:24px;
	text-align-last:center;
	font-size:13px;
	border-radius:0;
	background-color:unset;
	border-color:#dedede;
}

.login_wrapper {
	display:table;
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:linear-gradient(tobottom,#fff0%,#F2F4FA100%);
}

.login_wrapper.newly {
	top:150px;
}

.login_wrapper.newly .t_b_position {
	position:absolute;
	left:-559px;
	top:515px;
	margin:0 auto;
}

.login_wrapper.newly .footer {
	color:#a9abb6;
	font-size:12px;
	-webkit-user-select:none;
	-moz-user-select:none;
	-ms-user-select:none;
	user-select:none;
}

.login_box_container {
	position:relative;
	display:table-cell;
	vertical-align:middle;
	font-family:'Malgun Gothic';
	padding:10px;
}

.login_box_container .login_box {
	position:relative;
	width:340px;
	padding-top:10px;
	padding-bottom:50px;
	margin:auto;
}

.login_box_container .logo {
	color:#444;
	position:relative;
	text-align:center;
	padding-bottom:33px;
	background-size:contain;
	background-position:center;
	background-repeat:no-repeat;
	font-size:24px;
	text-shadow:2px 2px 0 #ececec;
}

.login_box_container .logo img {
	height:33px;
	vertical-align:top;
}

.login_box_container .form {
	border:1px solid #b5c0e1;
	border-radius:5px;
	margin-bottom:19px;
	background:linear-gradient(tobottom,#fff0%,#FCFDFE100%);
	padding:35px 20px 25px;
}

.login_box_container .form .cr_icon_24_.id {
	background-position:-240px -314px;
}

.login_box_container .form .cr_icon_24_.pw {
	background-position:-312px -242px;
}

.login_box_container .form .cr_icon_24_.otp {
	background-position:-336px -242px;
}

.login_box_container .form .ipt_wrap {
	position:relative;
	margin-bottom:10px;
	padding:0 15px 0 52px;
}

.login_box_container .form input {
	color:#b5c0e1;
	display:block;
	border-radius:4px;
	height:auto;
	width:100%;
	line-height:1;
	font-size:14px;
	font-weight:700;
	background-color:#fff;
	border-color:#b5c0e1;
	padding:10px 15px;
}

.login_box_container .form input:focus {
	color:#5270d0;
	background-color:#ffffdb;
}

.login_box_container .form input[type=text]::-ms-clear {
	display:none;
}

.login_box_container .form .sep {
	height:1px;
	background-color:#e4e9f8;
	margin:25px 15px 13px;
}

.login_box_container .form .chk {
	position:relative;
	display:inline-block;
	cursor:pointer;
	color:#b5c0e1;
	font-size:15px;
	padding-left:29px;
	margin-left:14px;
	margin-bottom:23px;
	height:24px;
	line-height:23px;
	-webkit-user-select:none;
	-moz-user-select:none;
	-ms-user-select:none;
	user-select:none;
}

.login_box_container .form .chk.off i {
	background-position:-360px -242px;
}

.login_box_container .form .chk.on i {
	background-position:-384px -242px;
}

.login_box_container .form .chk.focus {
	color:#333;
}

.login_box_container .form .chk i {
	position:absolute;
	top:0;
	left:0;
}

.login_box_container .form .chk input {
	opacity:0;
}

.login_box_container .form .additional {
	padding-top:10px;
	text-align:center;
}

.login_box_container .form .additional a {
	color:#333;
	font-size:12px;
	margin:0 7px;
}

.login_box_container .form .captcha-wrap {
	table-layout:fixed;
	border-collapse:collapse;
	border-spacing:0;
	margin-left:53px;
	margin-bottom:10px;
}

.login_box_container .form .captcha-wrap #captcha img {
	min-width:150px;
	min-height:51px;
}

.login_box_container .form .captcha-wrap td {
	line-height:1;
}

.login_box_container .form .captcha-wrap td.b {
	padding-left:10px;
}

.login_box_container .form .captcha-wrap td.b a {
	color:#333;
	text-decoration:none;
}

.login_box_container .form .captcha-wrap td.b img {
	vertical-align:text-bottom;
}

.login_box_container button {
	width:100%;
	border-radius:5px;
	font-size:18px;
	height:45px;
}

.login_box_container .login-btn {
	font-weight:700;
	background-color:#6081f0;
	border:1px solid #5279cf;
	border-radius:7px;
}

.login_box_container .login-btn:focus,.login_box_container .login-btn:active,.login_box_container .login-btn:hover {
	background-color:#3f67ed;
	border:1px solid #3764c6;
}

.login_box_container .otp-btn {
	color:#5876db;
	font-weight:700;
	height:56px;
	margin-top:1px;
	margin-right:17px;
	margin-bottom:18px;
	padding-right:22px;
	background-color:#40455e;
	border-color:#40455e;
}

.login_box_container .otp-btn:focus,.login_box_container .otp-btn:active,.login_box_container .otp-btn:hover {
	background-color:#323549;
	border:1px solid #323549;
}

.login_box_container .otp-btn i {
	width:40px;
	height:40px;
	margin-top:0;
	margin-right:16px;
	display:inline-block;
	vertical-align:top;
	background-color:transparent;
	background-image:url(/resources/img/icons.png);
	background-repeat:no-repeat;
	background-position:-288px -192px;
}

.login_box_container .otp-btn span {
	margin-top:10px;
	display:inline-block;
	vertical-align:top;
}

.login_box_container .btn-link {
	margin-top:5px;
}

.login_box_container .footer {
	color:#a9abb6;
	font-size:12px;
	text-align:center;
	-webkit-user-select:none;
	-moz-user-select:none;
	-ms-user-select:none;
	user-select:none;
	width:120%;
	margin:0 -10%;
}

.login_box_container.newly {
	width:872px;
	height:502px;
	border:1px solid #b5c0e1;
	display:block;
	margin:0 auto;
	padding:0;
}

.login_box_container.newly .login_bg_wrap {
	width:560px;
	height:500px;
	background:url(https://mail.stop.or.kr/resources/img/login_img.png) no-repeat 0 0;
	position:absolute;
}

.login_box_container.newly .login_box {
	width:310px;
	position:absolute;
	right:0;
	padding-top:0;
	padding-bottom:0;
}

.login_box_container.newly .logo {
	font-size:35px;
	color:#3b3f4e;
	text-align:start;
	padding:50px 20px 46px 34px;
}

.login_box_container.newly .form {
	border:unset;
	margin-bottom:0;
	padding:0 20px 8px;
}

.login_box_container.newly .otp-btn {
	border-radius:0;
	margin-top:0;
}

.login_box_container.join .login_box {
	width:380px;
}

.login_box_container.join .form .cr_icon_24_.id {
	background-position:-144px -716px;
}

.login_box_container.join .form .cr_icon_24_.pw {
	background-position:-168px -716px;
}

.login_box_container.join .form .cr_icon_24_.rePw {
	background-position:-191px -716px;
}

.login_box_container.join .form .siteInfo.url {
	position:absolute;
	top:10px;
	right:30px;
	font-size:14px;
	line-height:18px;
	color:#8e8e8e;
	opacity:1;
}

.login_box_container.join .form .errorMsg {
	color:red;
	display:block;
	margin:5px 0 10px;
}

.login_box_container.join .form .errorMsg.green {
	color:green;
}

.otp_dialog .login_box_container {
	width:400px;
	display:block;
	padding:0;
	margin: 0 auto;
}

.otp_dialog .login_box_container h4 {
	position:relative;
	font-size:16px;
	height:39px;
	padding-bottom:10px;
	border-bottom:4px solid #ECECEC;
	margin:0 0 15px;
}

.otp_dialog .login_box_container h4 .tab {
	display:inline-block;
	height:39px;
	bottom:-4px;
	margin-right:10px;
	border-bottom:4px solid #ECECEC;
	color:#a8a8a8;
}

.otp_dialog .login_box_container h4 .tab.active {
	color:#333;
	border-bottom:4px solid #3e8ef7;
}

.otp_dialog .login_box_container .text {
	letter-spacing:-.7px;
	font-size: 14px;
	line-height: 1.42857143;
}

.otp_dialog .login_box_container .img_wrap {
	text-align:center;
}

.otp_dialog .login_box_container .img_wrap img {
	max-width:300px;
	min-width:300px;
	min-height:300px;
	background-color:#CCC;
}

.otp_dialog .login_box_container .desc {
	color:#757575;
}

.otp_dialog .login_box_container .desc #time-limit {
	color:#FC2307;
	font-weight:700;
	margin-left:5px;
}

.otp_dialog .login_box_container a {
	margin-left:10px;
}

.password_wrapper .login_box_container {
	display:block;
	margin-top:50px;
}

.login_box_container .title {
	position:relative;
	font-size:18px;
	text-align:left;
	padding-bottom:33px;
}

.login_box_container .desc {
	line-height:1.7;
	margin-bottom:20px;
}

.cr_icon,.cr_treeNodeIcon,i[class*="cr_icon_"] {
	display:inline-block;
	width:16px;
	height:16px;
	overflow:hidden;
	background-color:transparent;
	background-image:url(/resources/img/icons.png);
	background-repeat:no-repeat;
	filter:none;
}

i[class*="cr_icon_24_"] {
	width:24px;
	height:24px;
}

.cr_hidden,.x-hidden {
	display:none!important;
	visibility:hidden!important;
}

label {
	cursor:pointer;
	outline:none;
}

input[type="text"],input[type="password"] {
	border:1px solid #CCC;
	height:22px;
	line-height:22px;
	padding:0 4px;
}

button,input {
	overflow:visible;
}

button,input,optgroup,select,textarea {
	font-family:inherit;
	font-size:100%;
	line-height:1.15;
	vertical-align:middle;
	margin:0;
}

*,::after,::before {
	box-sizing:border-box;
}

[type="checkbox"],[type="radio"] {
	box-sizing:border-box;
	padding:0;
}

button.btn-primary {
	color:#fff;
}

.login_box_container .form .cr_icon_24_,.login_box_container.join .form .cr_icon_24_ {
	position:absolute;
	left:14px;
	top:8px;
}

.login_box_container.join .form .cr_icon_24_.userName,.login_box_container.join .form .cr_icon_24_.otp {
	background-position:-240px -716px;
}