﻿@charset "utf-8";


/* 로그인index /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
.login_page {width:100vw; height:100vh; display:flex; justify-content:center; align-items:center; padding:48px 36px; background:#f2f3f8;}
.login_panel_box {width:100%; max-width:600px; padding:56px 52px; border-radius:60px; background:var(--white); box-shadow:0 24px 60px -24px rgba(20,37,61,0.35), 0 6px 16px -6px rgba(20,37,61,0.14);}
.login_panel_box fieldset {display:flex; flex-direction:column; gap:20px;}

.form_head {display:flex; flex-direction:column; gap:8px;}
.form_head dt {font-size:20px; font-weight:bold; color:var(--black);}
.form_head dd {font-size:15px; color:var(--fontcolor3);}

.form_user_btns {display:flex; flex-direction:column; align-items:baseline; gap:8px 20px; padding:10px 12px; border-radius:4px; background:#f5f5f5;}
.form_user_btns p {font-size:14px;}
.form_user_btns div {display:flex; flex-wrap:wrap; align-items:center; gap:4px;}

.form_field {display:flex; flex-direction:column; gap:16px;}
.form_field .field {display:flex; flex-direction:column; gap:8px;}
.form_field .field label {font-size:14px; font-weight:500; color:var(--fontcolor2); margin:0;}
.form_field .field div {position:relative;}
.form_field .field div::before {position:absolute; left:20px; top:50%; transform:translateY(-50%); font-family:"Font Awesome 7 Free"; font-weight:900; font-size:14px; color:var(--fontcolor5); pointer-events:none;}
.form_field .field .field_id::before {content:"\f007";}
.form_field .field .field_pwd::before {content:"\f084";}
.form_field .field select {height:50px; font-size:15px; padding:0 12px; background-position:right 8px center;}
.form_field .field input {height:54px; font-size:15px; padding:0 12px 0 48px;}
.form_field .login_btn {
	width:100%; height:55px; display:flex; justify-content:center; align-items:center; font-size:18px; font-weight:500;
	color:var(--white); text-align:center; padding:10px 16px; border-radius:4px; background:var(--darkblue);
}
.form_util {display:flex; justify-content:center; align-items:center; gap:20px; text-align:center;}
.form_util button, .form_util a {position:relative; font-size:15px; color:var(--fontcolor3);}
.form_util button ~ button::before,
.form_util a ~ a::before {content:""; display:block; position:absolute; left:-10px; top:7px; width:1px; height:10px; background:var(--fontcolor5);}

