@charset "utf-8";

@font-face {font-family: 'Noto Sans KR';font-style: normal;font-weight: 300;src: url(/fonts/NotoSansKR-Light-ea4db2bb9f683df8998eaaaec10beeab.woff2) format('woff2'),url(/fonts/NotoSansKR-Light-1f7c8be8c0ca8d54868052ef23475cb2.woff) format('woff');}


@font-face {font-family: 'Noto Sans KR';font-style: normal;font-weight: 400;src: url(/fonts/NotoSansKR-Regular-9139661f6f91e4420a77e89d352452af.woff2) format('woff2'),url(/fonts/NotoSansKR-Regular-7c3141b340ddb3c1aea80d2bb11e9f12.woff) format('woff');}


@font-face {font-family: 'Noto Sans KR';font-style: normal;font-weight: 500;src: url(/fonts/NotoSansKR-Medium-2de688e285e7ba650eee5d0438c1d4a7.woff2) format('woff2'),url(/fonts/NotoSansKR-Medium-e63313c24774aee385441245d85fb80f.woff) format('woff');}


@font-face {font-family: 'Noto Sans KR';font-style: normal;font-weight: 700;src: url(/fonts/NotoSansKR-Bold-0ae2f9c5e5b82c0b15d3429dfe30f1eb.woff2) format('woff2'),url(/fonts/NotoSansKR-Bold-11ec013942ce7c5dfd5f1adf4a16d2ca.woff) format('woff');} 


/*** Font info ***
Light - 300
Regular - 400
Medium - 500
Bold - 700 */


/* 공통 */
* {box-sizing: border-box;}
html,body {
	position: relative;
	display: block;
	width: 100%; 
	height: 100%; 	
	font-family: Noto Sans KR,'Roboto', sans-serif;
	font-weight: 400;
	color: #333333;
	margin: 0; 
	padding: 0;
}
div, ul, li { -webkit-box-sizing: border-box; box-sizing: border-box;}
ul,ol,li,dl,dt,dd,h2,
h3,
table,tr,th,td,p,button,div{margin: 0; padding: 0;}
ul,ol,li {list-style: none;}
a {
	color: #333;
	text-decoration: none;
	-webkit-appearance: none;
}
input, textarea, button {
	font-family: Noto Sans KR,'Roboto', sans-serif;
	font-size: 13px;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
}


a.btn {	
	display: flex;
	justify-content: center;
	align-items: center;
	font-family: Noto Sans KR, sans-serif;
	font-size: 21px;
	text-align: center;
	width: 100%;
	height: 60px;
	border-radius: 5px;
	color: rgba(255, 255, 255, 0.8);
	background-color: #005FA4;
	transition: all 0.3s;
}
a.btn:hover {	
	color: rgba(255, 255, 255, 1);
	background-color: #045794;
	box-shadow: 3px 3px 6px rgba(42, 46, 50, 0.3);
}
a.btn2 {	
	display: flex;
	justify-content: center;
	align-items: center;
	font-family: Noto Sans KR, sans-serif;
	font-size: 16px;
	white-space: nowrap;
	word-break: keep-all;
	letter-spacing: -1px;
	text-align: center;
	width: 100%;
	height: 43px;
	border-radius: 3px;
	color: rgba(255, 255, 255, 0.8);
	background-color: #666f83;
}
a.btn2:hover {	
	color: rgba(255, 255, 255, 1);
	background-color: #666f83;
	border: 1px solid rgba(255, 255, 255, 0.3);
	box-shadow: 5px 5px 10px rgba(42, 115, 224, 0.3);
}


/* 내용 */
.wrap {
	display: flex;
	width: 100%;
	height: 100%;
    min-width: 360px;
	flex-direction: column;
	flex-wrap: nowrap;
}
.wrap .main {
	display: block;
    flex: 1;
}


.login_wrap {
	position: absolute;
    right:10%;
    z-index: 1;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width: 560px;/* 왼쪽 너비 */
	min-width: 360px;
	padding: 10px 60px 0px;
	margin:100px auto 0 auto;
}

.login_wrap .login_inner {
	position: relative;
	width: 100%;
    background: rgba(255, 255, 255, 0.8);
    border-radius: 10px;
    padding: 20px 25px 10px;
    box-sizing: border-box;
    box-shadow: 1px 3px 5px rgba(0, 0, 0, 0.1);
}
.login_wrap .login_inner > p {
	font-size: 14px;
    line-height: 18px;
    margin:5px 0 0;
    color: #333333;
}

h1.logo {
	font-size: 26px;
	font-weight: 700;
	color: #7F8084;
	background: url('/images/logo-5fab20de3ffa6531bb8bd3e98c8878e0.png') no-repeat left top;
	background-size: 180px;
	width: 100%;
	height: 60px;
	text-align: right;
    line-height: 2.3;
    padding-top: 0px;
	margin:0px 0 20px 0;
	position: relative;

}
h1.logo a {
	font-family: "Noto Sans KR";
	letter-spacing: -1px;
	color: #7F8084;
    margin-right: 15px;
}

/*
Toggle Radios v1.1
by Adam Culpepper | @adamculpepper
https://github.com/adamculpepper/toggle-radios
*/

/* Customizable styles */

/* Colors: Default (blue) */
.toggle-radio {background:#ffffff; border:1px solid #0595D5;margin-bottom: 10px;color: #0595D5;}
.toggle-radio > input:checked + label {background:#0595D5;color: #ffffff;}
.toggle-radio > input + label:not(:last-of-type) {border-right:1px solid #0595D5;}

/* Rounded corners */
.toggle-radio {border-radius:4px;}

/* //////////////////////////
CORE STYLES BELOW - NO TOUCHY
////////////////////////// */
.toggle-radio {display:inline-flex;width: 60%;}
.toggle-radio > input[type='radio'] {display:none;}
.toggle-radio > input[disabled] + label {opacity:0.50;}
.toggle-radio > input[disabled] + label:hover {cursor:not-allowed;}
.toggle-radio > input + label {display:inline-block; margin-bottom:0; padding:5px 10px 8px; float:left; cursor:pointer;width: 50%;text-align: center;}

/* Transitions */
.toggle-radio > input:checked + label {transition:background 300ms linear;}





.login_wrap .login_inner .input_box {
	width: 100%;
	display: block;
}
.login_wrap .login_inner > label {	
	display: inline-block;
	font-size: 17px;
	font-weight: 500;
	color: #333;
    width: auto;
    box-shadow: inset 0 -11px 0 #d0ebff;
    height: 28px;
    line-height: 28px;
    font-weight: 500;
    margin:5px 0;
}

.login_wrap .login_inner .rememberme {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin:0px 0 20px 0;
}
.login_wrap .login_inner .rememberme span {
	display: flex;
	align-items: center;
	width: 45%;
}
.login_wrap .login_inner > div > .rememberme span > label {
	font-size: 14px;
	color: rgba(0, 0, 0, 0.5);
	cursor: pointer;
	line-height: 1.2;
	padding-top: 10px;
	font-weight: 400 !important;
}

.login_wrap .login_inner input[type="text"]::placeholder,
.login_wrap .login_inner input[type="password"]::placeholder {font-size: 14px;color: #b2b2b8;font-weight: 400;}
.login_wrap .login_inner input[type="text"],
input[type='password'] {	
	width: 100%;
	height: 50px;
	font-family: Noto Sans KR, sans-serif;
	font-size: 14px;
	font-weight: 500;
	color: #333;
	border-radius: 5px;
	border: 1px solid #d4d4d4;
	padding: 4px 15px 4px 60px;
	margin-bottom: 10px;
	position: relative;
	z-index: 0;
}
.login_wrap .login_inner input[id="P_SAVE_LOGIN_ID"] {
	width: 17px;
	height: 17px;
	border-radius: 3px;
	border: 1px solid rgba(0, 0, 0, 0.17);
	cursor: pointer;
	margin-left: 0px;
}
.login_wrap .login_inner input[id="P_SAVE_LOGIN_ID"]:checked {
	border: none;
	background: #999999;
}
.login_wrap .login_inner input[id="P_SAVE_LOGIN_ID"]:checked::after {
	content:'✔';
	position: relative;
	top: -1px;
    display: block;
	font-size: 14px;
	text-align: center;
	color: rgba(255,255,255,1);

}
.login_wrap .login_inner input[type="text"] {	
	background:#ffffff;
}
.login_wrap .login_inner input[type="password"] {	
	background:#ffffff;
}
.login_wrap .login_inner .txtwidimg {position: relative;}
.login_wrap .login_inner .icon_id { 
	position: absolute;
	left:0;
	top: 0;
	content:'';
	background:transparent url('/images/icon_id-fa34d1444b22659dea0ff5e0213ee73e.png') no-repeat 20px 3px;
	display: inline-block; width: 60px;height: 50px;
	z-index:10;
}

.login_wrap .login_inner .icon_pw { 
	position: absolute;
	left:0;
	top: 0;
	content:'';
	background:transparent url('/images/icon_pw-8da4089bdc1ca7d32e9f16a089268602.png') no-repeat 20px 3px;
	display: inline-block; width: 60px;height: 50px;	z-index:100;
}



.login_wrap .login_inner input:-webkit-autofill,
.login_wrap .login_inner input:-webkit-autofill:focus,
.login_wrap .login_inner input:-webkit-autofill:focus,
.login_wrap .login_inner input:-webkit-autofill:active  {
    transition: background-color 0s 600000s, color 0s 600000s;
    -webkit-transition: background-color 9999s ease-out;
    -webkit-box-shadow: 0 0 0px 1000px transparent inset !important;
    -webkit-text-fill-color: #333 !important;
  }







.login_wrap .login_inner .rememberme .find {
	margin: 0px 0;
    text-align: right;
    display: flex;
    justify-content: flex-end;
    width: auto;
}

.login_wrap .login_inner .rememberme .find li {
	position: relative;
	display: inline-block;
	color: #ffffff;
	
	 padding: 0 8px 3px;
}

.login_wrap .login_inner .rememberme .find li:first-child:after {
    content: '';
    height: 10px;
    width: 1px;
    background-color: #fff;
    display: inline-block;
    opacity: 0.6;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translate(0, -50%);

}

.login_wrap .login_inner .rememberme .find li a {
	position: relative;
    color: #959595;
    font-size: 14px;
    font-weight: 400;
    font-family: "Noto Sans KR", sans-serif;
    line-height: 1.1;
	padding-top: 10px;
}
.lo-h2 {
    position: relative;
    width: 100%;
    height: auto;
    box-sizing: border-box;
    margin-bottom: 5px;
    padding-bottom:0px;
}
.lo-h2 h2 {
    font-family: 'Noto Sans KR';
    font-size: 24px;
    font-weight: 500;
    line-height: 25px;
    color: #333;
    display: inline-block;
    width: calc(100% - 55px);
}
.lo-h2 p {
    font-size: 14px;
    line-height: 18px;
    margin-top: 10px;
    color: #666666;
}

.lo-l-t-l {
    display: block;
    width: 100%;
    height: auto;
}
.lo-l-t-r {
    display: block;
    width: 100%;
}






.info {
	padding: 0px 0px;
	width: 100%;
    display: block;
    word-break: break-all;
    margin-left: 0px;
    vertical-align: middle;
    font-size: 0;
    line-height: 0
}
.info_copyright {
    margin-top: 20px;
    color: #959595;
    font-size: 13px;
    line-height: 15px;
    text-align:left;
}


/* 메인비쥬얼 */
#main_visual {
	flex-grow: 1;
	display: flex;
	justify-content: center;
	align-items: center;
	line-height: 60px;
	/*background: url('../images/bg.png') no-repeat center;
	background-size: cover;*/
	width: 100%;
}


#main_visual {position: relative;width:100%;top:0;bottom:0;height:100%;min-width: 360px;}
#main_visual .viewer_area {width:100%; height:100%;}
#main_visual .viewer_area .slick-arrow {position: absolute;bottom: 0;display: none !important;}
#main_visual .slick-list {width:100%; height:100%;}
#main_visual .slick-list .slick-track {width:100%; height:100%;}
#main_visual .slick-list .slick-slide {width:100%; height:100%;}
#main_visual .slick-list .slick-slide>div {overflow: hidden;width:100%;height:100%;}
#main_visual .images_fade {width:100%;height:100%;background-repeat:no-repeat;background-size: cover;background-position:center;}
#main_visual .images_fade .bgimg {position:absolute; left:0; top:0; bottom:0; width:100%;height:100%;background-repeat:repeat;background-size: cover;background-position:center;}
#main_visual .images_fade1 .bgimg {background-image:url(/images/login_visual01-222b2b46c6d3b80f398db43f03c90fd3.jpg);    background-position-y: -100px;}/* background 위치 */


/* 반응형 */



@media screen and (max-width: 1280px) {
    .login_wrap {
        right: 50%;
        transform:translateX(50%);
    }

}	


@media screen and (max-width: 480px) {
    .login_wrap {
        width: 412px;/* 왼쪽 너비 */
        padding: 10px 30px 0px;
    }
    h1.logo {
        background: url(/images/logo-5fab20de3ffa6531bb8bd3e98c8878e0.png) no-repeat center top;
        background-size: 190px;
        height: 110px;
        padding-top: 60px;
        text-align: center;
    }
    h1.logo a {
        margin-right: 0px;

    }


}