@charset "utf-8";
/* font */
@font-face {
   font-family: 'Pretendard-Regular';
   font-style: normal;
   font-weight: 300;
   src: url('/plugin/INSPINIA/fonts/Pretendard-Regular');
   src: url('/plugin/INSPINIA/fonts/Pretendard-Regular.woff') format('woff');
}

@font-face {
   font-family: 'Pretendard-Medium';
   font-style: normal;
   font-weight: 300;
   src: url('/plugin/INSPINIA/fonts/Pretendard-Medium');
   src: url('/plugin/INSPINIA/fonts/Pretendard-Medium.woff') format('woff');
}

@font-face {
   font-family: 'Pretendard-Bold';
   font-style: normal;
   font-weight: 300;
   src: url('/plugin/INSPINIA/fonts/Pretendard-Bold');
   src: url('/plugin/INSPINIA/fonts/Pretendard-Bold.woff') format('woff');
}

html {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    font-size: 15px;
    letter-spacing: -0.5px;
    font-weight: 400;
    color: #171725;
}
* {
    box-sizing: border-box;
    outline: 0;
}

body {
   font-family: 'Pretendard-Regular', 'Pretendard-Medium', 'Pretendard-Bold';
   background-color: #191554;
}

/* 기본 css 제거 */
select {border:0; -webkit-appearance:none; -moz-appearance:none; appearance:none; box-sizing: border-box; background:transparent; padding: 18px 26px 18px 56px; border-radius: 100px; width: 100%; cursor: pointer;}

/* Login */
.login_area {width: calc(100% / 3);display: flex;flex-direction: column;align-items: center;margin: 0 auto;padding: 79px 0;justify-content: center;}
.span_area {text-align: center;}
.main_ttl {font-family: Pretendard-Bold; font-size: 40px; font-weight: bold; text-align: center; color: #000;}
.sub_ttl {width: fit-content;margin: 0 auto;margin-top: 50px;margin-bottom: 20px;font-size: 32px;color: red;font-weight: bold; /* 라인의 간격 조정이 가능하다.*/box-shadow: inset 0 -11px 0 rgba(0,0,0, 0.2);}
.item {width: 100%;min-width: 400px;margin: 40px 0;padding: 0 0 58px 0;border-radius: 40px;background-color: #fff;}
.item > div {width: 65%; margin: 0 auto;}
.input_area input {border:0; background:transparent; padding-inline: 0px; padding-block: 0px; padding: 18px 26px 18px 56px; border-radius: 100px; width: 100%;}
.input_area img {position: absolute; transform: translate(20px, 12px);}
.input_area .ico_eye {content: url('/images/login/new/ico_eye_24.svg'); cursor: pointer; transform: translate(-44px, 12px);}
.input_area .ico_eye.slash {content: url('/images/login/new/eye-slash.svg'); transform: translate(-44px, 12px);}
.select_wrap {border-radius: 100px; border: solid 1px #ddd; background:url('/images/login/new/ico_arrow_24.svg') no-repeat right 13px center; margin-top: 40px;}
.input_wrap {border-radius: 100px; border: solid 1px #ddd; background-color: #f7f7f7; margin-top: 20px;}
.btn {width: 100%; padding: 18px 26px; border-radius: 100px; background-color: #646464; border: 0; font-size: 20px; font-weight: bold; color: #f7f7f7; margin-top: 40px; cursor: pointer;}
.chk_wrap {margin-top: 24px !important; color: #999;}


@media all and (max-width: 1200px) {
	.login_area {width: 100%;padding: 30px 10px;height: 100vh;}
	.item {min-width: 0px; padding: 0 0 30px;}
	.main_ttl {font-size: 30px;}
	.sub_ttl {margin-top: 30px; font-size: 20px;}

	.item > div {width: 85%;}

	.chk_wrap {display: none;}
}