@charset "UTF-8";

:root {
    /*--main : #e97e12;*/
    --main : #119DD4;
    --light-gray : #ececec;
    --white-alpha-40 : rgba(255, 255, 255, 0.40);
    --white-alpha-25 : rgba(255, 255, 255, 0.25);
    --backdrop-filter-blur : blur(5px);
}

/* 21-09-09 dababy 배경화면 */
body {
    /*background: url(../images/bg_v2_empire-state-building.jpg);*/
    background: url(../images/background_2.jpg);
    background-position: 50% 10%;
    background-repeat: no-repeat;
    background-size: auto;
    height:100vh;
}

body videp {

}

/* 페이지 콘텐츠 영역 UI */
.page_wrap {
    height: 100%;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}

h1 {border-bottom:3px solid #2d2e33;}
/* 21-09-09 dababy */
/* 로그인 페이지 폼 UI */
.title_section {
    margin-bottom: 30px;
}

#title_font {
    font-size: 24px;
    font-weight: bold;
    color: #444;
    margin-bottom: 10px;
}

#content_font {
    font-size: 16px;
    color: #111;
}

/*
h2 {width:500px!important;height:200px;display:block;font-size:13.5pt;color:#959699;text-align:center;line-height:18em;background:url(../images/bg_location.gif) center top no-repeat;background-size: 288px 152px;margin:120px auto 20px;border:0;}
*/
/*h2 {width:500px!important;height:200px;display:block;font-size:13.5pt;color:#959699;text-align:center;line-height:18em;background-size: 288px 152px;margin:120px auto 20px;border:0;}*/
h3 {width:700px!important;height:200px;display:block;font-size:13.5pt;color:#959699;text-align:center;line-height:3em;margin:100px auto 20px;border:0;}
hr {width:480px;margin:20px auto;height:0;border:0;border-top:1px solid #151619;border-bottom:1px solid #2b2f39;background:none;}

#header {background:#FFFFFF;}
#wrap {width:100%;height:100%;}

/* 21-09-09 dababy */
.login_form_wrap {
    width: 420px;
    height: 450px;
    padding: 10px;
    background: rgba(255,255,255,0.9);

    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;

    position: relative;
    border-radius: 5px;

    right: -150px;

    background-color : var(--white-alpha-25);
    border : 1px solid var(--white-alpha-40);
    backdrop-filter: var(--backdrop-filter-blur);
    border-radius: 10px;
}

div.login_area {
    width:300px;
    margin:0 auto;
}

div.login_area fieldset {
    border: none;
    position:relative;
}

/* 21-09-09 dababy */
div.login_area input {
    width:313px;
    height:40px;
    background-color:#ececec;
    border:1px solid lightgrey;
    padding-left:5px;
    color:#45474d;
    font-size:10.5pt;
    margin: 0 0 10px 0 ;
}

/* 21-09-09 dababy*/
.login_form_wrap button {
    width:310px;
    height:40px;

    border:0;
    /*color:#fff;*/
    font-size:12pt;
    margin-top:10px;
}

/* color set */
.main {
    background-color: var(--main);
}

.light-gray {
    background-color: var(--light-gray);
}

.gray {
    background-color: #ececec;
    color: #999 !important;
}

/* 21-09-09 dababy */
.ID {
    /*position:absolute;*/
    top:0;
    left:0;
}

.PW {
    /*position:absolute;*/
    top:55px;
    left:0;
}
.join_find {margin:0 auto;width:410px;text-align:center;color:#fff;font-size:9.75pt;}
.find {color:#7b7b7b;margin-right:10px;}
.join {color:#fff;margin-left:10px;}

/* 21-09-09 dababy */
.logo {
    width:300px;
    height:auto;
    margin-bottom: 10px;
}

#logo_content_font {
    color: white;
    font-size: 16px;
    font-weight: bold;
}

.error_box_v2 {
    /*     position: absolute; */
    top: 32px;
    left: -15px;
    z-index: 16;
    width: 300px;
    height: 20px;
    /*     background: #595959; */
    font-size: 12px;
    font-weight: bold;
    /*color: #959699;*/
    color: #1a1d23;
}

.error_box_v2 strong {
    font-family: Arial,Helvetica,sans-serif;
    /*color: #FF6A00;*/
    color: red;
}

.guest_area{
    display: table;
    margin-left: auto;
    margin-right: auto;
    padding-left: 22px;
    padding-left: 22px;
}


/* updated 21-10-12 */
legend {
    display: none;
}