html{overflow-x: hidden; background: #f7f7fb;}
.wrap{
    height: 100%;
    /* background: url(../images/a_bg.png) no-repeat center center; */
}

/* 공통 */
.btn{border:1px solid #888; background-color: #888; box-sizing: border-box; line-height: 56px; border-radius: 29px; font-size: 18px; color:#fff; font-weight: bold; min-width: 160px; padding:0 20px;}
.btn:hover{background-color: #838383;}
.btn.red{background-color: #EF3B24; border-color: #EF3B24;}
.btn.red:hover{background-color: #ec361e;}
.btn.s{height: 30px; line-height: 28px; padding: 0 11px; font-size: 12px; border-radius: 8px; min-width: auto;}
.btn.outline{border: 1px solid #E3E7F9; background: #fff; color: #222;}
.btn.outline:hover{background: #f1f1f1;}
.txt-red{color:#EF3B24}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {-webkit-appearance: none; margin: 0;}
input[type=number] {-moz-appearance:textfield;}

/* 서브페이지 */
.wrap.sub{background: url(../images/common/img_sub_bg.png) repeat-x center top; padding-bottom: 100px; height: auto;}
.logo{position: absolute; left: 30px; top: 16px; width:134px; height: 20px; background: url(../images/common/img_logo.png) no-repeat;}
.logo > h1{overflow: hidden; height: 1px; width: 1px; opacity: 0; z-index: -1;}
.form{width:960px; margin: 0 auto;}
.form__tit{padding: 112px 0 60px; color: #fff; text-align: center;}
.form__tit > span{font-weight: bold; font-size: 18px; line-height: 26px;}
.form__tit > h2{font-weight: bold; font-size: 46px; margin: 6px 0 16px 0;}
.form__tit > p{font-weight: 400; font-size: 15px; line-height: 1.4;}
.form__box{background-color: #fff; border-radius: 20px;padding: 50px 80px; box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.05);}
.form__box-desc{background-color: #FAFAFA; padding: 52px 20px 16px; border-radius: 6px; position: relative; display: flex; gap: 60px; justify-content: space-between;}
.form__box-desc > p{font-size: 18px; font-weight: bold; position: absolute; top: 16px;}
.form__box-desc > ul{flex: 1;}
.form__box-desc > ul > li{position: relative;padding-left: 15px; font-size: 13px; line-height: 20px;}
.form__box-desc > ul > li + li{margin-top: 4px;}
.form__box-desc > ul > li:before{content: ''; display: block; width: 5px; height: 1px; background-color: #222; position: absolute; left:0; top: 9px;}
/* .form__box-desc > ul:nth-child(2){margin-right: ;} */
.form__box-tbl{margin-top: 30px; border-top: 2px solid #222; border-bottom: 1px solid #E4E4E4 ; padding: 30px 0;}
.form__box-tbl-row{display: flex; justify-content:space-between; align-items:center;}
.form__box-tbl-row + .form__box-tbl-row{margin-top: 20px;}
.form__box-tbl-label{width:190px}
.form__box-tbl-label > span{font-size: 15px; font-weight: bold;}
.form__box-tbl-ipt{flex: 1; display: flex; align-items: center; gap: 16px;}
.form__box-tbl-ipt > input[type="number"],
.form__box-tbl-ipt > input[type="password"],
.form__box-tbl-ipt > input[type="text"]{flex: 1; border:1px solid #E4E4E4; border-radius: 4px; height: 44px; box-sizing: border-box; padding-left: 10px; }
.ipt-line{display: block; width: 8px; height: 2px; background: #e4e4e4;}
.form__box-btn{margin-top: 30px; display: flex; justify-content: center; gap: 20px;}
.form__box-btn > *:only-child{width: 200px;}
.form__box-tbl-complete{height: 320px; display: flex; justify-content: center; align-items: center; flex-direction: column; gap: 20px; font-size: 18px; font-weight: bold; text-align: center; line-height: 26px;;}
.form__box-tbl-complete:before{content: ''; display: block; margin: 0 auto; width: 58px; height: 58px; background: url(../images/common/ico_check.png) no-repeat; }
.form__box-tbl-complete.coution:before{background: url(../images/common/ico_coution.png);}
input[type="radio"].input_radio{display: none;}
input[type="radio"].input_radio + label{position: relative; padding-left: 26px; display: inline-block; height: 20px; line-height: 20px; font-size: 15px; cursor: pointer;}
input[type="radio"].input_radio + label:before{content: ''; position: absolute; left: 0; top: 0; display: inline-block; width: 20px; height: 20px; border-radius: 100%; border:1px solid #e4e4e4;}
input[type="radio"].input_radio:checked + label{color: #EF3B24;}
input[type="radio"].input_radio:checked + label:after{content: ''; position: absolute; left:5px; top:5px; width: 10px; height: 10px; border-radius: 100%; background: #EF3B24;}
.form__box-bigCheck{display: flex; justify-content: space-between; gap:30px; border-top: 2px solid #222; border-bottom: 1px dashed #e4e4e4; padding: 30px 0; margin-top: 30px;}
.form__box-bigCheck > div{flex: 1;}
.form__box-bigCheck input[type="radio"]{display: none;}
.form__box-bigCheck input[type="radio"] + label{position: relative; font-size: 18px; font-weight: bold; color: #888; cursor: pointer; padding: 46px 0; text-align: center; border: 1px solid #e4e4e4; background: #f9f9f9; border-radius: 20px; display: block;}
.form__box-bigCheck input[type="radio"] + label:before{content: ''; display: block; margin: 0 auto 10px; width: 41px; height: 40px; background: url(../images/contents/ico_checkBig_1.png) no-repeat 0 0;}
.form__box-bigCheck > div:nth-child(2) input[type="radio"] + label:before{background-image: url(../images/contents/ico_checkBig_2.png)}
.form__box-bigCheck input[type="radio"]:checked + label{color: #EF3B24; border:2px solid #EF3B24; padding: 45px 0; background: #fff;}
.form__box-bigCheck input[type="radio"]:checked + label:before{background-position: 0 bottom;}
.form__box-tit{display: flex; justify-content: space-between; align-items: center; margin-bottom: 11px;}
* + .form__box-tit{margin-top: 30px;}
.form__box-tit-txt{font-size: 18px; font-weight: bold;}
.form__box-grid{}
.form__box-grid table{border-collapse:collapse; width: 100%;}
.form__box-grid-head{border: 1px solid #E4E4E4; border-width: 1px 0;}
.form__box-grid-head th{height: 48px; background: #F7F9FB; vertical-align: middle; font-size: 14px; font-weight: bold;}
.form__box-grid-head tr th:last-child{padding-right: 6px;}
.form__box-grid-body{overflow-y: auto; max-height: 150px; border-bottom: 1px solid #E4E4E4;}
.form__box-grid-body::-webkit-scrollbar-thumb {background: #D9D9D9;}
.form__box-grid-body td{height: 50px; border-bottom: 1px solid #E4E4E4; vertical-align: middle; text-align: center; font-size: 14px; color: #555; border-left:1px solid #E4E4E4}
.form__box-grid-body tr td:first-child{border-left: 0;}
.form__box-grid-body tr:last-child td{border-bottom: 0;}

.form__box-grid input[type="checkbox"]{display: none;}
.form__box-grid input[type="checkbox"] + label{position: relative; display: inline-block; width: 20px; height: 20px; box-sizing: border-box; border: 1px solid #E3E7F9; border-radius: 3px; position: relative; cursor: pointer;}
.form__box-grid input[type="checkbox"]:checked + label{background: url(../images/contents/ico_checkbox.png) no-repeat center center;}
.form__box-grid input[type="checkbox"] + label:before{content: ''; display: block; position: absolute;}
.no-contents{display: flex; justify-content: center; align-items: center; height: 149px; font-size: 14px; color: #555;}
p.txt-red + .popup__box-help{margin-top: 30px;}






/* 팝업 */
.popup{position: fixed; top: 0; bottom: 0; left: 0; right: 0;}
.popup.type-bg{background: url(../images/contents/bg_alert.png) no-repeat center center; background-size: cover;}
.popup__box{background: #fff; border-radius: 60px; padding: 60px 20px; width: 678px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);box-shadow: 0px 30px 80px 0px rgba(0, 0, 0, 0.70);}
.popup__box.wide{padding: 60px; width: 758px;}
.popup__box-tit{text-align: center; margin-bottom: 30px;}
.popup__box-tit > strong{font-size: 30px; font-weight: bold;}
.popup__box-tit > strong:before{content: ''; display: block; margin: 0 auto 20px; width: 59px; height: 58px; background: url(../images/common/ico_alert.png) no-repeat;}
.popup__box-tit.ico-check > strong:before{background-image: url(../images/common/ico_alert1.png)}
.popup__box-tit.ico-plug > strong:before{background-image: url(../images/common/ico_plug.png)}
.popup__box-tit-desc{color: #888; font-size: 14px; line-height: 20px; margin-top: 16px; font-weight: 400;}
.popup__box-tit + .popup__box-btn{margin-top: -30px;}
.popup__box-btn{padding-top:40px; display: flex; justify-content: center; gap: 20px;}
.popup__box-help{padding: 16px 20px; background: #fafafa;;}
.popup__box-help > strong{font-size: 18px; font-weight: bold; display: block; margin-bottom: 10px; line-height: 26px;}
.popup__box-help > ul > li{position: relative;padding-left: 15px; font-size: 13px; line-height: 20px;}
.popup__box-help > ul > li + li{margin-top: 4px;}
.popup__box-help > ul > li:before{content: ''; display: block; width: 5px; height: 1px; background-color: #222; position: absolute; left:0; top: 9px;}
.popup__box-check{padding: 16px 20px; background: #fafafa;;}
.popup__box-check > ul > li{position: relative;padding-left: 15px; font-size: 13px; line-height: 20px;}
.popup__box-check > ul > li + li{margin-top: 4px;}
.popup__box-input{width: 485px; margin: 0 auto; display: flex; align-items: center; border: 1px solid #E4E4E4; position: relative; border-radius: 6px; overflow: hidden;}
.popup__box-input + .popup__box-input{margin-top: 10px;}
.popup__box-input > label{width: 117px; height: 42px; line-height: 42px; font-size: 14px; color: #888; background: #FAFAFA; border-right: 1px solid #E4E4E4; text-align: center;}
.popup__box-input > input[type="password"],
.popup__box-input > input[type="text"]{flex: 1;height: 42px; border: 0; font-size: 14px; padding: 0 20px;}
.popup__box-input-btn{display: flex; justify-content: space-between; gap: 13px;}
.popup__box-input-btn .popup__box-input{width: auto; flex: 1;}
.popup__box-input-btn > button{width: 140px;}
.btn_red{border: 1px solid #ef3b24; border-radius: 6px; font-size: 14px; font-weight: bold; color: #ef3b24;}
.popup__box-input-time{position: absolute; right: 14px; top: 50%; transform: translateY(-50%); font-size: 13px; color:#ef3b24; }
.popup__box-help + .popup__box-input-btn{margin-top: 30px;}
.popup__box-down{display: grid; grid-template-columns: 1fr 1fr; gap: 20px; width: 464px; margin: 0 auto;}
.popup__box-down > a{flex: 1; border: 1px solid #e4e4e4; background:  #f9f9f9; display: flex; flex-direction: column; justify-content: center; align-items: center; height: 140px; border-radius: 20px; font-size: 15px; font-weight: bold; color: #888;}
[class ^= "popup__box-down-ico"]{display: block; margin: 0 auto 10px; width: 40px; height: 40px; background: no-repeat center center;}
.popup__box-down-ico-1{background-image:url(../images/contents/ico_down_01.png) ;}
.popup__box-down-ico-2{background-image:url(../images/contents/ico_down_02.png) ;}
.popup__box-down-ico-3{background-image:url(../images/contents/ico_down_03.png) ;}
.popup__box-down-ico-4{background-image:url(../images/contents/ico_down_04.png) ;}

.bg-gray{background: #FAFAFF;}
.bg-gray1{background: #FAFAFF;}
.visual{position: absolute; top: 0; left:0; right:calc(50% + 203px); height: 100%; }
.visual__obj{width:996px; height:779px; position: absolute;top: 50%;right: 0;transform: translate(708px, -50%); display: block; }
.visual__obj > span{display: block; position: absolute;   transition: all .6s ; width:10px; height: 10px;}
.visual__obj > span:before{content:''; display: block; width:100%; height:100%; background: url(../images/contents/img_a_obj_1.png) no-repeat center center; background-size: 100% auto;}
.visual__obj > span:nth-child(1){ z-index: 2; top: -81px; left: -131px; animation:ani_1 3s infinite ease-in-out; transform: translate(870px, 390px); }
.visual__obj > span:nth-child(1):before{background-image: url(../images/contents/img_a_obj_1.png); }
.visual__obj.v_1 > span:nth-child(1):before{animation:ani_2 5s infinite ease-in-out;}
.visual__obj > span:nth-child(2){top: 276px; left: -189px; animation:ani_1 3.6s infinite ease-in-out; transform: translate(720px, 60px); transition-delay: .2s;}
.visual__obj > span:nth-child(2):before{background-image: url(../images/contents/img_a_obj_2.png);}
.visual__obj > span:nth-child(3){top: 288px; left: -50px; animation:ani_1 3.3s infinite ease-in-out; transform: translate(570px, 20px); transition-delay: .4s;}
.visual__obj > span:nth-child(3):before{background-image: url(../images/contents/img_a_obj_3.png);}
.visual__obj > span:nth-child(4){top: 558px; left: -173px; animation:ani_1 2s infinite ease-in-out; transform: translate(700px, -260px); transition-delay: .3s;}
.visual__obj > span:nth-child(4):before{background-image: url(../images/contents/img_a_obj_4.png);}
.visual__obj > span:nth-child(5){top: 281px; left: -246px; animation:ani_1 3.5s infinite ease-in-out; transform: translate(760px, 20px); transition-delay: .2s;}
.visual__obj > span:nth-child(5):before{background-image: url(../images/contents/img_a_obj_5.png);}
.visual__obj > span:nth-child(6){top: 378px; left: -316px; animation:ani_1 3.2s infinite ease-in-out; transform: translate(820px, -40px); transition-delay: .3s;}
.visual__obj > span:nth-child(6):before{background-image: url(../images/contents/img_a_obj_6.png);}
.visual__obj > span:nth-child(7){top: 232px; left: -319px; animation:ani_1 4s infinite ease-in-out; transform: translate(810px, 80px); transition-delay: .4s;}
.visual__obj > span:nth-child(7):before{background-image: url(../images/contents/img_a_obj_7.png);}
.visual__obj.start > span{transform: translate(0px, 0px)}
.visual__obj.start > span:nth-child(1){width:884px; height:929px;}
.visual__obj.start > span:nth-child(2){width: 393px; height: 393px;}
.visual__obj.start > span:nth-child(3){width: 48px; height: 47px;}
.visual__obj.start > span:nth-child(4){width: 148px; height:147px;}
.visual__obj.start > span:nth-child(5){width: 86px; height: 86px;}
.visual__obj.start > span:nth-child(6){width: 26px; height: 27px;}
.visual__obj.start > span:nth-child(7){width: 32px; height: 32px;}
.visual_txt{position: absolute; left: 30px; bottom: 30px; right: 30px; color: #B3B3C6; font-size: 12px; line-height: 16px;}

.login{position: absolute;top: 0;left: calc(50% - 203px); right:0;height: 100%; background:rgba(255,255,255,.8); /*url(../images/img_a_login.png) no-repeat center center;*/ backdrop-filter: blur(7px);box-shadow: 0px 4px 50px 0px rgba(97, 119, 151, 0.20);}
.login__box{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 410px;}
.login__box-logo{display: block; width: 121px; height: 18px; background: url(../images/contents/img_login_logo.png) no-repeat center center; background-size: 100% auto;}
.login__box-tit{font-size: 50px; margin: 30px 0 40px;}
.login__box-tit > strong{font-weight: bold;}
.login__box-form{margin-bottom: 40px;}
.login__box-ipt{border: 1px solid #E3E7F9; border-radius: 6px; display: flex; align-items: center; background: #fff;}
.login__box-ipt + .login__box-ipt{margin: 10px 0 20px;}
.login__box-ipt > label{width:40px; padding-left: 56px; font-size: 18px; position: relative;}
.login__box-ipt > label:before{content: ''; display: block; height: 24px; width: 24px; background: url(../images/contents/ico_login_01.png) no-repeat center center; position: absolute; left: 20px; top: 50%; transform: translateY(-50%); background-size: 100% auto;}
.login__box-ipt:nth-child(2) > label:before{background-image: url(../images/contents/ico_login_02.png);}
.login__box-ipt > input[type="text"],
.login__box-ipt > input[type="password"]{flex: 1; padding:0 20px 0 0; height: 64px; border: 0; font-size: 18px;}
.login__box-ipt > input::placeholder{color: #222;}
.login__box-form input[type="checkbox"]{display: none;}
.login__box-form input[type="checkbox"] + label{font-size: 16px; line-height: 30px; cursor: pointer; user-select: none; }
.login__box-form input[type="checkbox"] + label:before{content: ''; display: inline-block; width: 30px; height:
30px; background: url(../images/contents/ico_login_check.png) no-repeat 0 0; vertical-align: middle; margin-right: 10px;}
.login__box-form input[type="checkbox"]:checked + label{}
.login__box-form input[type="checkbox"]:checked + label:before{background-position: 0 bottom;}
.login__box-btn{height: 73px; background: #ef3b24; color: #fff; border:0; width: 100%; border-radius: 8px; color: #fff; font-size: 28px; font-weight: bold;}
.login__box-btn:disabled{background: #888;;}
.login__box-etc{border-top: 1px dashed #E3E7F9; margin-top: 40px; padding-top: 40px; display: flex; justify-content: center; gap: 30px;}
.login__box-etc > a{text-align: center;}
.login__box-etc > a > span{display: block; width: 68px; height: 68px; background: no-repeat 0 0; margin: 0 auto 10px; background-size: 100% auto;}
.login__box-etc > a .mo{display: none;}
.login__box-etc > a:hover{color: #ef3b24;}
.login__box-etc .ico_re{background-image: url(../images/contents/ico_login_re.png)}
.login__box-etc .ico_down{background-image: url(../images/contents/ico_login_down.png)}
.login__statu{position: absolute; top: 20px; right: 45px; height: 28px; padding: 0 16px; line-height: 28px; font-size: 12px; font-weight: normal; color: #888; background: #fff; border-radius: 14px;}
[class ^= "login__statu-"]{display: inline-block; margin-left: 4px;}
[class ^= "login__statu-"]:after{content: ''; display: inline-block; width: 10px; height: 10px; background: #00BA34; border-radius: 100%; vertical-align: middle; margin: -2px 0 0 4px;}
.login__statu-green{color: #00BA34;}
.login__statu-red{color: #ef3b24;}
.login__statu-red:after{background: #ef3b24;}

@media (max-width:1512px) {
    .visual__obj{transform: translate(640px, -50%) scale(0.68);}
    .login__box-tit{font-size: 38px; margin: 20px 0 26px;}
    .login__box{width: 320px;}
    .login__box-ipt > input[type="text"],
    .login__box-ipt > input[type="password"]{font-size: 15px; height: 58px;}
    .login__box-ipt > label{padding-left: 50px;}
    .login__box-ipt > label:before{width: 20px; height: 20px; background-size: 100% auto;}
    .login__box-form input[type="checkbox"] + label:before{width: 20px; height: 20px; background-size: 100% auto; margin-top: -2px;}
    .login__box-form input[type="checkbox"] + label{line-height: 20px; font-size: 14px;}
    .login__box-btn{height: 62px; font-size: 22px;}
    .login__box-etc > a{font-size: 14px;}
    .login__box-etc > a > span{width: 56px; height: 56px; background-size: 100% auto;}
    .login__box-etc > a .mo{display: block;}
}

@keyframes ani_1 {
    0%{margin-top: 0;}
    50%{margin-top: 20px;}
    100%{margin-top: 0;}
}
@keyframes ani_2 {
    0%{margin-left: 0;}
    50%{margin-left: 20px;}
    100%{margin-left: 0;}
}



.login1{width: 100%; position: absolute; top:0; background: #fff;}
.login1__back{position: absolute;top: 0;left: 50%;transform: translateX(-50%); margin-left: -140px;}
.login1__back svg{position: absolute; top: 0; left: 0;}
.login1__back1{position: absolute; top: 428px; left: 0; width: 220px; height: 290px; overflow: hidden;}
.login1__chac{position: absolute; width: 650px; height: 650px; top: 0;left: 50%; margin: 399px 0 0 -509px; transition: margin 2s;}
.login1__chac.start{margin: 129px 0 0 -509px;}
.login1__chac.ani{animation:chac_1 3s infinite ease-in-out;}
@keyframes chac_1 {
    0%{top: 0;}
    50%{top: -10px;}
    100%{top: 0;}
}
.login1 .section{}
.login1 .section > .inner{width: 1512px; margin: 0 auto; position: relative;}
.login1__logo{width: 144px; height: 23px; background: url(../images/contents/img_login_logo1.png) no-repeat; background-size: 100% auto; position: absolute; left:0; top: 33px;}
.login1__statu{position: absolute; top: 36px; right: 0; font-size: 12px; font-weight: normal; }
[class ^= "login1__statu-"]{display: inline-block; margin-left: 4px;}
[class ^= "login1__statu-"]:after{content: ''; display: inline-block; width: 10px; height: 10px; background: #00BA34; border-radius: 100%; vertical-align: middle; margin: -2px 0 0 4px;}
.login1__statu-green{color: #00BA34;}
.login1__statu-red{color: #ef3b24;}
.login1__statu-red:after{background: #ef3b24;}
.login1__wallpaper{position:absolute;top:32px;right:123px}
.login1__wallpaper button{color:#fff;padding:4px 34px 4px 16px;font-size:12px;font-weight:normal;line-height:16px;border-radius:15px;cursor:pointer;border:none;background:#ed3823 url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.375 1H2.875C1.83947 1 1 1.83946 1 2.87499V9.12501C1 10.1605 1.83947 11 2.875 11H9.125C10.1605 11 11 10.1605 11 9.12501V6.62497M7.87469 1.00015L11 1M11 1V3.81256M11 1L5.68704 6.31232' stroke='white' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A") 108px center no-repeat}
.login1__copy{position: absolute; top: 224px; font-size: 55px; font-weight: normal; letter-spacing: -2.2px; line-height: 1.25;}
.login1__copy > strong{font-weight: bold;}
.login1__box{width: 570px; position: absolute; right: 0; top: 141px; padding: 60px 80px; background: #fff; border-radius: 20px; box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.05);border: 1px solid #E3E7F9;}
.login1__box-tit{font-size: 40px; margin: 0 0 40px;}
.login1__box-tit > strong{font-weight: bold;}
.login1__box-form{margin-bottom: 40px;}
.login1__box-ipt{border-radius: 6px; display: flex; align-items: center; background: #F7F9FF;}
.login1__box-ipt + .login1__box-ipt{margin: 10px 0 20px;}
.login1__box-ipt > input[type="text"],
.login1__box-ipt > input[type="password"]{flex: 1; padding:0 20px; height: 64px; border: 0; font-size: 18px; background: transparent;}
.login1__box-ipt > input::placeholder{color: #222;}
.login1__box-form input[type="checkbox"]{display: none;}
.login1__box-form input[type="checkbox"] + label{font-size: 16px; line-height: 30px; cursor: pointer; user-select: none; }
.login1__box-form input[type="checkbox"] + label:before{content: ''; display: inline-block; width: 30px; height:
30px; background: url(../images/contents/ico_login_check1.png) no-repeat 0 0; vertical-align: middle; margin-right: 10px;}
.login1__box-form input[type="checkbox"]:checked + label{}
.login1__box-form input[type="checkbox"]:checked + label:before{background-position: 0 bottom;}
.login1__box-btn{height: 73px; background: #ef3b24; color: #fff; border:0; width: 100%; border-radius: 8px; color: #fff; font-size: 28px; font-weight: bold;}
.login1__box-btn:disabled{background: #888;}

.section.middle{border-top: 1px solid #E3E7F9; border-bottom: 1px solid #E3E7F9;background: #FFF;box-shadow: 20px 4px 16px 0px rgba(0, 0, 0, 0.10);margin-top: 688px; position: relative; z-index: 2;}
.section.middle > .inner{height: 240px; display: flex; align-items: center;}
.login1__helpLink{width: 858px; border-right: 1px solid #E3E7F9; display: flex; align-items: center; gap: 40px; height: 100%;}
.login1__helpLink > a{display: block; width: 370px; position: relative; padding-left: 110px;}
.login1__helpLink > a::before{content: ''; display: block; width: 90px; height: 90px; position: absolute; top: 0; left: 0;  background: url(../images/contents/img_login1_guide.png) no-repeat center center; background-size: auto 100%;}
.login1__helpLink > a > span{font-size: 24px; font-weight: bold; display: block; margin:4px 0 10px;}
.login1__helpLink > a > span > strong{color: #ef3b24;}
.login1__helpLink > a > p{padding-left: 12px; position: relative; font-size: 16px;}
.login1__helpLink > a > p:before{content:''; width: 5px; height: 1px; background: #888; position: absolute; left: 0; top: 9px;}
.login1__helpLink > a > p + p{margin-top: 4px;;}

.login1__utilLink{flex: 1; display: flex; padding-left: 95px; gap: 60px;}
.login1__utilLink > a{text-align: center; font-size: 16px;}
.login1__utilLink > a > span{display: block; width: 84px; height: 84px; background: url(../images/contents/img_login1_util_01.png) no-repeat; margin-bottom: 10px; background-size: 100% auto;} 
.login1__utilLink > a:hover{color: #ef3b24;}
.login1__utilLink > a .ico_down{background-image: url(../images/contents/img_login1_util_02.png)}
.login1__utilLink > a .ico_file{background-image: url(../images/contents/img_login1_util_03.png)}
.login1__utilLink > a .ico_man{background-image: url(../images/contents/img_login1_util_04.png)}

.section.footer{background-color: #FAFAFF; position: relative; z-index: 2;}
.section.footer > .inner{display: flex; align-items: center; gap: 44px; height: 140px;}
.footer__desk{font-size: 20px; font-weight: bold; color: #888;}
.footer__desk > span{}
.footer__terms{font-size: 12px; color: #888; line-height: 16px; font-weight: normal;}

/* 20250424 접속 환경 추가 */
.login__box-env {display:flex;align-items: center;margin-top:-7px;padding-top:24px;}
.login__box-env > .env {font-size:12px;font-weight:600;line-height:14px;letter-spacing:0.005px;padding:9px 16px;color:#ef3b24;background:#fef0ee;border-radius:20px;}
.login1__box-tit.flex-center {display:flex;align-items:center;white-space:nowrap;}
.login1__box-tit.flex-center .login__box-env {margin:0 0 0 16px;padding:0;white-space:normal;text-align:center;}

@media (max-width:1512px) {
    .login1 .section > .inner{width: 1000px;}
    .login1__copy{font-size: 42px; letter-spacing: -1.68px; line-height: 1.2;}
    .login1__box{width: 386px; padding: 50px 56px; top: 126px;}
    .login1__box-tit{font-size: 32px; margin: 0 0 26px;}
    .login1__box-ipt > input[type="text"], .login1__box-ipt > input[type="password"]{height: 58px;}
    .login1__box-ipt + .login1__box-ipt{margin-bottom: 13px;}
    .login1__box-form input[type="checkbox"] + label:before{width: 20px; height: 20px; background-image: url(../images/contents/ico_login_check2.png); vertical-align: middle; margin-top: -2px;}
    .login1__box-form input[type="checkbox"] + label{line-height: 20px;;}
    .login1__box-form{margin-bottom: 26px;}
    .login1__box-btn{height: 62px;}
    .section.middle{margin-top:569px;}
    .login1__chac{transform: scale(.7); margin: 277px 0 0 -401px;}
    .login1__chac.start{margin: 69px 0 0 -401px;}
    .login1__logo{top: 28px;}
    .login1__statu{top: 30px;}
    .login1__wallpaper{top: 26px;}
    .login1__back{transform: translateX(-50%) scale(.65); margin-left: -100px;}
    .login1__back1{transform: scale(.7); top: 324px; left: -33px;}
    .login1__helpLink > a::before{width: 55px; height: 86px; background-size: auto 100%;}
    .login1__helpLink > a{padding-left: 75px;}
    .login1__helpLink > a > span{font-size: 22px;}
    .login1__helpLink > a > p{font-size: 14px;}
    .login1__helpLink > a > p + p{margin-top: 3px;}
    .login1__helpLink > a:first-child{width: 340px;}
    .login1__helpLink{width: 594px;}
    .login1__helpLink{gap: 0;}
    .login1__utilLink{padding-left: 32px; gap: 50px;}
    .login1__utilLink > a{font-size: 14px;}
    .login1__utilLink > a > span{width: 56px; height: 55px; background-size: 100% auto;}
    .footer__desk{width: 136px;}
    .footer__desk > span{font-size: 20px;}
    .footer__desk > span:first-child{font-size: 18px;}
    .section.middle > .inner{height: 200px;}
    .section.footer > .inner{height: 130px;}
    
      /* 20250424 접속 환경 추가 */
    .login__box-env {padding-top:16px;}
    .login1__box-tit.flex-center .login__box-env {margin-left:6px;padding:0;}
    .login1__box-tit.flex-center .login__box-env .env {padding:4px 8px;}
}

/* **************************************
	Reset
************************************** */
* {margin:0;padding:0;box-sizing:border-box;border:0;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:rgba(0,0,0,0);font-family:'NotoSansKR', 'Roboto', sans-serif;}
.skipnav a,article,aside,details,figcaption,figure,footer,header,hgroup,nav,section {display:block;}
html {background:transparent;color:#222;font-size:100%;-webkit-text-size-adjust:none;-ms-text-size-adjust:none;-webkit-overflow-scrolling:auto;}
body {background-color:#fff;color:#222;font-size:100%;line-height:1.4;letter-spacing:-.04em;}
article,aside,audio,blockquote,body,canvas,code,dd,details,div,dl,dt,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,input,legend,li,mark,menu,nav,ol,p,pre,section,summary,td,textarea,th,time,ul,video {margin:0;padding:0}
img {max-width:100%;border:0;vertical-align:middle}
input,button,select,textarea {margin:0;-webkit-border-radius:0;border-radius:0;font-size:.875rem;line-height:1.4;letter-spacing:-.04em;vertical-align:middle;-webkit-appearance:none;appearance:none;border:none;outline:0;}
input,select {width: 100%; }
table {border-spacing:0;border-collapse:collapse;}
fieldset {border:0;}
address,caption,cite,code,dfn,th,var{font-weight:400;font-style:normal;}
em{font-weight:700;font-style:normal;}
strong{font-style:normal;}
ol,ul{list-style:none;}
caption,th{text-align:center;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:400;}
caption,hr,legend{width:0;height:0;overflow:hidden;font-size:1px;line-height:0;text-indent:-9999em;}
a,a:active,a:focus,a:hover,a:link,a:visited{color:inherit;text-decoration:none;cursor:pointer;}

@font-face {
    font-family: 'NotoSansKR';
    font-style: normal;
    font-weight: 400;
    src: local('NotoSansKR-Regular'),
			url('../fonts/NotoSansKR-Regular.woff2') format('woff2'),
			url('../fonts/NotoSansKR-Regular.woff') format('woff');
	}
	@font-face {
		font-family: 'NotoSansKR';
		font-style: normal;
		font-weight: 500;
		src: local('NotoSansKR-Medium'),
				url('../fonts/NotoSansKR-Medium.woff2') format('woff2'),
				url('../fonts/NotoSansKR-Medium.woff') format('woff');
	}

	@font-face {
		font-family: 'Roboto';
		font-style: normal;
		font-weight: 400;
		src: local('Roboto-Regular'),
				url('../fonts/Roboto-Regular.woff2') format('woff2'),
				url('../fonts/Roboto-Regular.woff') format('woff');
	}

input {
	/* font-size: 16rem; */
    outline:none;
}
label, input, button, select, img {vertical-align:middle;font-size:1em}

*, :after, :before {
  -webkit-box-sizing:border-box;
  -moz-box-sizing:border-box;
  box-sizing:border-box;
}
button{cursor:pointer; outline: none;}
.blind {position: absolute;	width: 1px;	font-size: 0; line-height: 0; overflow: hidden;	clip: rect(0 0 0 0); }
* {margin:0;padding:0;box-sizing:border-box;border:0;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:rgba(0,0,0,0);font-family:'NotoSansKR',"Malgun Gothic","Dotum",sans-serif}

/* ******************************************************
	제휴TM시스템 Login
****************************************************** */
#MeritzTmLogin{min-height: 650px;}
#wrap.MeritzTmLogin {background: #fff url("../images/contents/tm_bg.png") 50% 50% no-repeat; background-size: cover; height: 100vh;}
#wrap.MeritzTmLogin .container{display: block; width: 100%; height: calc(100% - 30%); }
#wrap.MeritzTmLogin .container .container__inner .login__form{width: 364px; position: absolute; top: 60%; left: 50%; transform: translate(-50% ,-50%);}
#wrap.MeritzTmLogin .container .container__inner .login__form h2{font-size: 35px; line-height: 35px; color: #4e4e4e; text-align: center; padding-bottom:27px; font-family:'Roboto'}
#wrap.MeritzTmLogin .container .container__inner .login__form .login__input input{background-color: #f6f6f6; height: 47px; line-height: 47px; border-radius: 23px; padding: 0 20px; margin-bottom: 10px;letter-spacing: 3px}
#wrap.MeritzTmLogin .container .container__inner .login__form .login__input input::placeholder{color:#d3d3d3; font-size:15px; letter-spacing: 0;}
#wrap.MeritzTmLogin .container .container__inner .login__form .login__input input[type=password]{letter-spacing: 5px;}
#wrap.MeritzTmLogin .container .container__inner .login__form .login__check {padding: 0 17px; margin-bottom: 8px; font-size: 13px; color: #4e4e4e;}
#wrap.MeritzTmLogin .container .container__inner .login__form .login__check input{position: absolute; left: 0; top: 0; z-index: -99; border: 0; }
#wrap.MeritzTmLogin .container .container__inner .login__form .login__check .login__check_icon::before{content: ""; display: inline-block; width: 18px; height: 17px; background: url(../images/contents/task_login.png) 0 -1098px no-repeat; vertical-align: top; margin-top: 1px; padding-right: 5px;}
#wrap.MeritzTmLogin .container .container__inner .login__form .login__check input:checked + .login__check_icon::before{background-position: 0 -1116px;}
#wrap.MeritzTmLogin .container .container__inner .login__form .login__btn{width: 100%; background-color: #f03e3b ;color: #fff; font-size:15px;  height: 47px; border-radius: 23px; display: flex; justify-content: center; align-items: center; cursor: pointer;}
#wrap.MeritzTmLogin .container .container__inner .login__form .login__box-env {display:flex;justify-content:center;align-items: center;margin:-27px 0 0;padding:16px 0 32px;}
#wrap.MeritzTmLogin .container .container__inner .login__form .login__box-env > .env {font-size:12px;font-weight:600;line-height:14px;letter-spacing:-0.423px;padding:9px 16px;color:#ef3b24;background:#fef0ee;border-radius:20px;}

#wrap.MeritzTmLogin>div.footer {position: fixed; bottom: 0; background: #f3f3f3; border-top: 1px solid #eaeaea; height: 19%; width: 100%; display: flex; justify-content: center; align-items: center; padding: 0;}
#wrap.MeritzTmLogin>div.footer .footer__btn>a{width: 173px; height: 98px; background-color: #fff; color: #4e4e4e; font-size: 15px; border: none; text-align: center;}
#wrap.MeritzTmLogin>div.footer .footer__btn>a + a{margin-left: 17px;}

/* header */
#wrap .header .header__inner{position:relative;display: flex; justify-content: space-between; padding: 40px 70px;}
#wrap .header .header__inner .header__logo::before{content:""; display: block; background: url(../images/contents/task_login.png) 0 -1063px no-repeat; width: 185px; height:30px;}
#wrap.MeritzTmLogin .header .header__inner .header__logo::before{content:""; display: block; background: url(../images/contents/meritz_logo.png) 0 -0 no-repeat; width: 182px; height:27px}


.MeritzLogin .container .container__inner .login__form{background-color: #fff; box-shadow: 0px 0px 15px -5px #424141; width: 565px; margin: -28px auto 0; border-radius: 8px; padding:35px 100px 54px;}
.MeritzLogin .container .container__inner .login__form h2{font-size: 35px; line-height: 35px; color: #4e4e4e; text-align: center; padding-bottom:27px; font-family:'Roboto'}
.MeritzLogin .container .container__inner .login__form .login__input input{background-color: #f6f6f6; height: 47px; line-height: 47px; border-radius: 23px; padding: 0 20px; margin-bottom: 10px;letter-spacing: 3px}
.MeritzLogin .container .container__inner .login__form .login__input input::placeholder{color:#d3d3d3; font-size:15px; letter-spacing: 0;}
.MeritzLogin .container .container__inner .login__form .login__input input[type=password]{letter-spacing: 5px;}
.MeritzLogin .container .container__inner .login__form .login__check {padding: 0 17px; margin-bottom: 8px; font-size: 13px; color: #4e4e4e;}
.MeritzLogin .container .container__inner .login__form .login__check input{position: absolute; left: 0; top: 0; z-index: -99; border: 0; }
.MeritzLogin .container .container__inner .login__form .login__check .login__check_icon::before{content: ""; display: inline-block; width: 18px; height: 17px; background: url(../images/contents/task_login.png) 0 -1098px no-repeat; vertical-align: top; margin-top: 1px; padding-right: 5px;}
.MeritzLogin .container .container__inner .login__form .login__check input:checked + .login__check_icon::before{background-position: 0 -1116px;}
.MeritzLogin .container .container__inner .login__form .login__btn{width: 100%; background-color: #ef4b5a ;color: #fff; font-size:15px;  height: 47px; border-radius: 23px; display: flex; justify-content: center; align-items: center; cursor: pointer;}
.MeritzLogin.green .container .container__inner .login__form .login__btn{background-color: #98cb83;}
.MeritzLogin.yellow .container .container__inner .login__form .login__btn{background-color: #d7a979;}
.MeritzLogin.pink .container .container__inner .login__form .login__btn{background-color: #e39da7;}
.MeritzLogin.blue .container .container__inner .login__form .login__btn{background-color: #5ba4d2;}
.MeritzLogin.purple .container .container__inner .login__form .login__btn{background-color: #6760c4;}


/* footer */
.footer {padding-top: 20px;}
.footer .footer__inner {padding: 0 70px;}
.footer .footer__inner .footer__btn{font-size: 0; display: flex; justify-content: center; align-items: center;}
.footer .footer__inner .footer__btn a{display: inline-flex; justify-content: center; align-items: center;  width: 133px; height: 35px; background-color: #fff; color: #e39da7; border: 1px solid #e8b3bb; border-radius: 20px; font-size: 15px; letter-spacing: -1px;}
.MeritzLogin.green .footer .footer__inner .footer__btn a{border:1px solid #98cb83; color:#98cb83;}
.MeritzLogin.yellow .footer .footer__inner .footer__btn a{border:1px solid #d7a979; color: #d7a979;}
.MeritzLogin.pink .footer .footer__inner .footer__btn a{border:1px solid #e8b3bb; color:#e39da7;}
.MeritzLogin.blue .footer .footer__inner .footer__btn a{border:1px solid #5ba4d2; color:#5ba4d2;}
.MeritzLogin.purple .footer .footer__inner .footer__btn a{border:1px solid #6760c4; color:#6760c4;}
.MeritzLogin .footer .footer__inner .footer__btn a:first-of-type{margin-right: 25px;}
.MeritzLogin .footer .footer__inner .footer__copyright{margin-top:10px; color:#b3bac4; font-size:12px; line-height:18px; padding: 0 115px;}
.MeritzLogin .footer .footer__inner .footer__copyright p:last-child{color: #7d838c; text-align: center; text-transform: uppercase;}