{{! stache!/unidocu-ui/view/main2018}}
<style>
    #main-2018 .DESTINATION_ALIAS-wrapper {position: fixed;top: 5px;right: 5px;}
    #main-2018 #DESTINATION_ALIAS {padding: 0 10px;}
    #main-2018 .theme-names-wrapper {position: fixed;top: 40px;right: 5px; display: none; }

    #main-2018 #change-password-with-email-validation {
        float: right;
        cursor: pointer;
        line-height: 34px;
        color: #666666;
    }

    #main-2018 #change-password-with-email-validation:hover {
        text-decoration: underline;
    }

    .id-wrapper, .pw-wrapper { margin-top: 27px;}

    input.login-input {
        font-size: 14px;
        border: 0 solid #bbb;
        border-bottom-width: 1px;
        width: 330px;
    }
    .login-area .unicon {color: #000; }
    .login-area .unicon:before {font-size: 30px; position: relative; top: 4px;}
    .login-box {padding-top: 20vh;}
    .login-box-in {position: relative;width: 330px;height: 350px;margin: 60px auto;padding: 40px 40px 40px 40px;
        background-color: #fff;box-shadow: 0 10px 10px rgba(85,85,85,.05), 0 30px 20px rgba(85,85,85,.05), 0 50px 40px rgba(85,85,85,.1) !important;
    }

    .login-box .login-title {padding-bottom: 5px;}

    .login-box .login-title h2 {
        font-size: 18pt; color: #191919;
    }
    .login-box .login-title p {margin-top: 10px;font-size: 14px;color: #555;}
    #login-button {transition: all .2s ease-in;color: #fff;font-size: 16px;background: #424868;margin-top: 35px; margin-bottom: 10px; width: 100%;line-height: 40px;}
    #formLogin { margin-top: 11px; }
    #logo {
        width: 250px;
        height: 56px;
        margin-bottom: 35px;
        background: url(/webjars/vendorCustom/sment/images/sm_logo.png) no-repeat;
    }
</style>

<div id="main-2018">
    <div class="wrap pes">
        <div class="login-box">
            <div class="login-logo" style="">
            </div>
            <div class="login-box-in">
                <div id="formLogin" class="form-inline">
                    <div id ="logo"></div>
                    <div class="login-title">
                        <h2>E-Accounting</h2>
                    </div>
                    <div class="login-area">
                        <div class="id-wrapper">
                            <!--                            <i class="unicon ico-uni-user02"></i>-->
                            <!--suppress HtmlFormInputWithoutLabel -->
                            <input name="ID" id="ID" type="text" class="login-input" placeholder="{{{아이디를 입력해주세요}}}">
                        </div>
                        <div class="pw-wrapper">
                            <!--                            <i class="unicon ico-uni-lock"></i>-->
                            <!--suppress HtmlFormInputWithoutLabel -->
                            <input name="PW" id="PW" type="password" class="login-input" placeholder="{{{비밀번호를 입력해주세요}}}">
                        </div>
                    </div>
                    <button id="login-button" class="btn-l btn-555-bg">{{{로그인}}}</button>
                    <div class="login-box-middle">
                        <label class="check-input-wrapper">
                            <input type="checkbox" id="keep-id" name="checkbox"><i></i><span >{{{아이디 저장}}}</span>
                        </label>
                        <span id="change-password-with-email-validation" style="display:none;">{{{비밀번호 재설정}}}</span>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="input-box input-box DESTINATION_ALIAS-wrapper">
        <select name="DESTINATION_ALIAS" id="DESTINATION_ALIAS" title="destination alias"></select>
    </div>
    <div class="input-box theme-names-wrapper">
        <!--suppress HtmlFormInputWithoutLabel -->
        <select id="theme-names"></select>
    </div>
</div>