/* 1% = 11.7px  inner : 10.34px */
/* height: 2390px   1% = 24px  */
main { }
main header { position: relative; height: 8vh; }
/* 221124 사용자 전환기능 추가 : 이부분 삭제 */
/* 공급자 헤더 
main header#ggj h1 { display: block; width:47vw; height: 2.5vh; text-indent: -9999px; background: url('../images/main/logo_ggj.png') no-repeat center; background-size: contain; position: absolute; top: 3vh; left:6%; }*/
/* 운전자 헤더 
main header#wjj h1 { display: block; width:47vw; height: 2.5vh; text-indent: -9999px; background: url('../images/main/logo_wjj.png') no-repeat center; background-size: contain; position: absolute; top: 3vh; left:6%; }*/
/* 운송사업자 헤더 
main header#wssuj h1 { display: block; width:50vw; height: 2.5vh; text-indent: -9999px; background: url('../images/main/logo_wssuj.png') no-repeat center; background-size: contain; position: absolute; top: 3vh; left:6%; }*/

/* main header h1 { display: block; width:47vw; height: 2.5vh; text-indent: -9999px; background: url('../images/main/logo.png') no-repeat center; margin: 0 auto; background-size: contain; } */
/* //221124 사용자 전환기능 추가 : 이부분 삭제 */

/* 221124 사용자 전환기능 추가 */
header h1{ display: flex; width:70vw; height: 2.5vh; position: absolute; top: 3vh; left: 6%; margin: 0 auto; align-items: center; }
header h1 img.logo { width: auto; max-width: 155px; margin-right: 5px; }
header h1 span { display: flex; height: 22px; line-height: 2.5vh; border-radius: 15px; margin-top: 1px; padding: 0 3px 0 7px; font-size: .85em; background: #0060aa; color: #fff; align-items: center; } 
header h1 span em { display: inline-flex; } /* 221216_메인수정 */
header h1 span button#user_change{ position: relative; text-indent: 0; background-color: #fff; width: 18px; height: 18px; border-radius: 18px; margin-left: 5px; }
header h1 span button#user_change img { width: 95%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
header button{ display: inline-block; position: absolute; text-indent: -9999px; }
header button.menu{ background: url('../images/ico_menu.png') no-repeat center; width: 5.9%; height:2.54vh; background-size: cover; border: 0; right: 6%; top: 2.9vh; }
/* 230403 알람버튼 추가 */
header button.alarm_on{ background: url('../images/noti_on.png') no-repeat center; width: 5.9%; height:3.0vh; background-size: cover; border: 0; right: 15%; top: 2.9vh; }
/*header button.alarm_on{ background: url('../images/notification_on.png') no-repeat center; width: 5.9%; height:2.9vh; background-size: cover; border: 0; right: 15%; top: 2.9vh; }*/
header button.alarm_off{ background: url('../images/noti_off.png') no-repeat center; width: 5.9%; height:3.0vh; background-size: cover; border: 0; right: 15%; top: 2.9vh; }
/*header button.alarm_off{ background: url('../images/notification_off.png') no-repeat center; width: 5.9%; height:2.9vh; background-size: cover; border: 0; right: 15%; top: 2.9vh; }*/

.tabs_radio.select_usermode { width: 100%;}
.tabs_radio.select_usermode:after { content:''; display: block; clear:both; }
.tabs_radio.select_usermode li { width: 49%; display: inline-block; border: 0; height: fit-content; }
.tabs_radio.select_usermode li:nth-child(1), .tabs_radio.select_usermode li:nth-child(2) { margin-bottom:20px; }
.tabs_radio.select_usermode li label { background: none; height: auto; }
.tabs_radio.select_usermode li label .icon { width: 100px; height: 100px; border-radius: 100px; background: #f8f8f8; margin: auto; border: 1px solid #f8f8f8; }
.tabs_radio.select_usermode li label em { font-size: 1.1em; }

.tabs_radio.select_usermode li [type="radio"]:checked ~ label { background: none; color:#333; }
.tabs_radio.select_usermode li [type="radio"]:checked ~ label .icon { background-color: #fff; border:1px solid #dedede }
.tabs_radio.select_usermode li [type="radio"]:checked ~ label em { font-weight: bold; }

.tabs_radio.select_usermode li [type="radio"] ~ label .icon { background-repeat: no-repeat; }
.tabs_radio.select_usermode li.ggj [type="radio"] ~ label .icon { background-image: url('../images/main/ico_user_ggj.png'); background-size: 70%; background-position: 17px 25px; }
.tabs_radio.select_usermode li.gmj [type="radio"] ~ label .icon { background-image: url('../images/main/ico_user_gmj.png'); background-size: 70%; background-position: 17px 25px; }
.tabs_radio.select_usermode li.wssuj [type="radio"] ~ label .icon { background-image: url('../images/main/ico_user_wssuj.png'); background-size: 70%; background-position: 13px 22px; }
.tabs_radio.select_usermode li.wjj [type="radio"] ~ label .icon { background-image: url('../images/main/ico_user_wjj.png'); background-size: 45%; background-position: center 18px; }

.tabs_radio.select_usermode li [type="radio"]:disabled ~ label em{ color:#999; }
.tabs_radio.select_usermode li.ggj [type="radio"]:disabled ~ label .icon { background-image: url('../images/main/ico_user_ggj_d.png'); background-size: 70%;}
.tabs_radio.select_usermode li.gmj [type="radio"]:disabled ~ label .icon { background-image: url('../images/main/ico_user_gmj_d.png'); background-size: 70%;}
.tabs_radio.select_usermode li.wssuj [type="radio"]:disabled ~ label .icon { background-image: url('../images/main/ico_user_wssuj_d.png'); background-size: 70%;}
.tabs_radio.select_usermode li.wjj [type="radio"]:disabled ~ label .icon { background-image: url('../images/main/ico_user_wjj_d.png'); background-size: 50%;}
/* //221124 사용자 전환기능 추가 */

main .contents { margin-top: 1vh; }
main .contents .module { padding-bottom: 0; }
main .contents .module article { width:31.43%; float:left; margin:0 2.8% 1.5vh 0; height: 15.5vh; border-radius: 10px; /*padding:4.2vh 3.4vh 0;*/}/* 221216_메인수정 */
main .contents .module article:nth-child(6), main .contents .module article:nth-child(7) { margin-bottom: 0; }
main .contents .module article .txt{ margin: 20px 0 0 20px; }/* 221216_메인수정 */
main .contents .module article .txt h3{ display: inline-block; font-size: 1em; font-weight: 600; line-height: 1.1em; } /* 221216_메인수정 */
main .contents .module article .txt h3, main .contents .module article .txt p { color:#fff; letter-spacing: -.03em; }
main .contents .module article .txt p{ margin-top: 0.8vh; font-size: .95em; line-height: 1.15em; }

main .contents .module article.module_col1 { background: url(../images/main/ico_go.png) no-repeat !important; background-position: 90% 11vh !important; background-size: 25% !important; }/* 221216_메인수정 : .module_col1 추가 */

main .contents .md6ea article:nth-child(1) { background: url(../images/main/ico_order.png) no-repeat #00adef !important; background-position: 94% 6vh !important; background-size: 30% !important; }
main .contents .md6ea article:nth-child(2) { background-color:#0060aa !important }
main .contents .md6ea article:nth-child(3) { background-position: 90% 16vh !important; background-color:#0060aa !important; }
main .contents .md6ea article:nth-child(5) { background-position: 90% 16vh !important; background-color:#00adef !important; }
main .contents .md6ea article:nth-child(6) {  background-color:#00adef !important; }
main .contents .md6ea article:nth-child(7) { background: url(../images/main/ico_graph.png) no-repeat #0060aa !important; background-position: 93% 7.5vh !important; background-size: 24% !important; }

/* 모듈 4칸 */
main .contents .md4ea article:nth-child(1), main .contents .md4ea article:nth-child(5) { width: 100%; }
main .contents .md4ea article:nth-child(1), main .contents .md4ea article:nth-child(5) { width: 100%; }
/* 221216_메인수정 */
/* main .contents .md4ea article:nth-child(1) { background: url(../images/main/ico_order.png) no-repeat #00adef !important; background-position: 93% 3.8vh !important; background-size: 24% !important;}  221216_메인수정 */
main .contents .md4ea article:nth-child(2) { background-color:#0060aa !important; }
main .contents .md4ea article:nth-child(4) { background-color:#00adef !important }
/* main .contents .md4ea article:nth-child(5) { background: url(../images/main/ico_graph.png) no-repeat #0060aa !important; background-position: 93% 5.5vh !important; background-size: 20% !important;} 221216_메인수정 */
/* //221216_메인수정 */
main .contents .md4ea article:nth-child(1),
main .contents .md4ea article:nth-child(5) { position: relative;}
main .contents .md4ea article:nth-child(5) { margin-bottom: 0;}
main .contents .md4ea.wssuj article:nth-child(5){ background: url(../images/main/ico_graph.png) no-repeat #00adef !important; background-position: 93% 7.5vh !important; background-size: 20% !important; }
main .contents .md4ea.wjj article:nth-child(5){ background: url(../images/main/ico_recovery.png) no-repeat #00adef !important; background-position: 95% 5vh !important; background-size: 25% !important; }

/* 221216_메인수정 : 모듈 5칸 추가 */
main .contents .md5ea article:nth-child(1), main .contents .md5ea article:nth-child(5) { width: 100%; }
main .contents .md5ea article:nth-child(1), main .contents .md5ea article:nth-child(5) { width: 100%; }
main .contents .md5ea article:nth-child(1), main .contents .md5ea article:nth-child(3) { background-color:#00adef !important; }
main .contents .md5ea article:nth-child(2), main .contents .md5ea article:nth-child(4), main .contents .md5ea article:nth-child(5) { background-color:#0060aa !important; }
main .contents .md5ea article:nth-child(1),
main .contents .md5ea article:nth-child(5) { position: relative; }
main .contents .md5ea article:nth-child(5) { margin-bottom: 0; }
/* //221216_메인수정 : 모듈 5칸 추가 */

/* 221216_메인수정 : 모듈 2칸 추가 */
main .contents .md2ea article.module_w100 { display: block; width: 100%; }
main .contents .md2ea article:nth-child(1) { background-color: #00adef; }
main .contents .md2ea article:nth-child(1),
main .contents .md2ea article:nth-child(3) { margin-bottom: 0; }
main .contents .md2ea article:nth-child(2) { height: 19.8vh; margin-top: 15px; background: url(../images/main/bg_md2ea.png) no-repeat center; background-size: 92%;  }
/* //221216_메인수정 : 모듈 2칸 추가 */

main .contents .module article.module_right { margin-right: 0; float: right; }
main .contents .module article.module_middle { height:20vh; background-position: 87% 15vh !important;  } /* 221216_메인수정 */
main .contents .module article.module_col2 { width: 65.76%; }
main .contents .module article.module_col1 .txt { width:80%; }
main .contents .module article.blue1 { background: #00adef; }
main .contents .module article.blue2 { background: #0060aa; }
main .contents .module article.center { position:relative; }
/* main .contents .module article.center img { position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width: 70%; display: block; margin: auto; max-width: 85px; } 221216_메인수정 */


main .contents .btn_circle { padding-bottom: 0; margin: 4vh 0; } /* 221216_메인수정 */
main .contents .btn_circle:after { content:''; display: block; clear: both; }

main .contents ul.btn_circle li { width: 50%; float:left; }
main .contents ul.btn_circle li .btn { position:relative; margin: 0 auto; width: 16vh; height: 16vh; border-radius: 100%; background:#e7e7e9; } /* width:35.78%; height: 15.48vh; min-width: 130px; min-height: 130px; */
main .contents ul.btn_circle li .btn > div { position: absolute; top: 50%; transform: translateY(-50%); }
main .contents ul.btn_circle li .btn > div span { display:block; text-align: center; margin: 5px auto 0; font-size: 1em; line-height: 1.2em; color:#333 }
main .contents ul.btn_circle li .btn > div img{ display:block; margin: 0 auto; width: 42%; }

/* 221216_메인수정 */
/* main .contents article:nth-child(1) { background: url(../images/main/ico_order.png) no-repeat #00adef !important; background-position: 84% 2.5vh !important; background-size: 32% !important; } */
main .contents article.module_w100 .txt h3 { font-size: 1.5em; } 
main .contents article.module_w100 .txt:after { content:''; display: inline-block; width:22px; height: 22px; background:url(../images/main/ico_go.png) no-repeat; background-size: cover; margin-left: 5px; 
    position: absolute; top: 50%; transform: translateY(-40%); }
main .contents article.module_w100 .txt {position: relative }
/* 공급자 */
main .contents .ggj article:nth-child(1) { background: url(../images/main/ico_order.png) no-repeat #00adef !important; background-position: 84% 2.5vh !important; background-size: 32% !important; }
main .contents .ggj article:nth-child(5) { background: url(../images/main/ico_indoinsu.png) no-repeat #0060aa !important; background-position: 91% 3.8vh !important; background-size: 40% !important; }
main .contents .ggj.module article.center { position: relative; width: 37%; margin: 0; overflow: hidden; z-index: 9;} /* 20221220 jgm 바꿈 */
main .contents .ggj.module article.center img { position: absolute; max-width: 280px; left: -10%; bottom: 10px; display: block; margin: auto; }
main .contents .ggj.module article:nth-child(2) { margin: 0 0 1.5vh 0; position: relative; z-index: 99; }
main .contents .ggj.module article:nth-child(4) { position: relative; z-index: 99; }
/* 구매자 */
main .contents .gmj article:nth-child(1) { background: url(../images/main/ico_order.png) no-repeat #00adef !important; background-position: 84% 2.5vh !important; background-size: 32% !important; }
main .contents .gmj article:nth-child(3) { position: relative; background-image: none !important; }
main .contents .gmj article:nth-child(3) div.bgimg{ position: absolute; left: -9%; bottom: 10px; display: block; /*background: url(../images/main/ico_wsjs.png) no-repeat !important;*/ height: fit-content;
    width: 100%; background-size: 100% !important; }
main .contents .gmj article:nth-child(3) div.bgimg img { width:100%; display: block; }
main .contents .gmj article:nth-child(5) { background: url(../images/main/ico_indoinsu.png) no-repeat #0060aa !important; background-position: 91% 3.8vh !important; background-size: 40% !important; }
/* 운송사업자 */
main .contents .wssuj article:nth-child(1) { background: url(../images/main/ico_assign.png) no-repeat #00adef !important; background-position: 90% 4.5vh !important; background-size: 30% !important; }
main .contents .wssuj article:nth-child(3) { background: url(../images/main/ico_ssgws.png) no-repeat #0060aa !important; background-position: 114% 6vh !important; background-size: 52% !important; }
/* 운전자 */
main .contents .wjj article:nth-child(1) { background: url(../images/main/ico_indoinsu.png) no-repeat #00adef !important; background-position: 91% 3.8vh !important; background-size: 40% !important; }
main .contents .wjj article:nth-child(3) { background: url(../images/main/ico_ssgws.png) no-repeat #0060aa !important; background-position: 114% 6vh !important; background-size: 52% !important; }

main .contents .module article.module_col1 .txt { margin: 20px 0 0 15px; }
main .contents .module article.module_col1 .txt h3 { font-size: 1.3em; line-height: 1.2em; }
/* //221216_메인수정 */


/* 2212_전체수정 : 바텀시트 */
.btmsheet { position: absolute; background: #f8f8f8; width: 100%; height: 10.2vh; bottom: 0; }
.btmsheet ul { display: flex;  }
.btmsheet ul li { flex: 1; padding-top: 6vh; display: block; text-align: center;  }
.btmsheet ul li.home { flex: 1.3; position: relative; }
.btmsheet ul li.home img { position: absolute; width: 65%; top: -3vh; left: 50%; transform: translateX(-50%); border: 6px solid #f8f8f8; border-radius: 100% } /* 홈버튼 깨지는거 top:-2.5vh를 -3vh로 수정 230116*/
.btmsheet ul li span{ font-size: .8em; }
.btmsheet ul li:nth-child(1) { background: url(../images/main/btm_menu01.png) no-repeat center 2.3vh; background-size: 32%; }
.btmsheet ul li:nth-child(2) { background: url(../images/main/btm_menu02.png) no-repeat center 2.2vh; background-size: 36%; }
.btmsheet ul li:nth-child(4) { background: url(../images/main/btm_menu03.png) no-repeat 59% 1.8vh; background-size: 40%; }
.btmsheet ul li:nth-child(5) { background: url(../images/main/btm_menu04.png) no-repeat center 2.3vh; background-size: 34%; }
/* //2212_전체수정 : 바텀시트 */

/* 로그인 */
/* 221216_로그인페이지 재작업(v1)
#wrap.login .login_visual{ height: 57vh; background: url(../images/main/login_visual.jpg) no-repeat center bottom; background-size: cover; border-top: 5px solid #00adef; z-index: 1; }
#wrap.login .login_visual .logo{ display: block; width: 62%; height: 4vh; text-indent: -9999px; background: url(../images/main/login_logo.png) no-repeat; background-size: contain;
    position: absolute; top: 14.5vh; left: 10%; }
#wrap.login .formbox { width:80%; height: 33vh; background: #fff; border-radius: 30px 0 0 0; position: absolute;border-radius: 40px 0 0 0; top:51vh; z-index: 2; }
#wrap.login .formbox.inner { padding: 6vh 10% 0; }

#wrap.login .formbox #id-pw > div {  }

#wrap.login .formbox #id-pw > div label, #wrap.login .formbox #id-pw > div input { display: block; width: 93%; padding-left: 3%; }
#wrap.login .formbox #id-pw > div input[type=text], #wrap.login .formbox #id-pw > div input[type=password] { height: 6vh; background: #eee; font-size: 1em; padding: 0 10px; border: none; border-radius: 15px; }
221125 로그인페이지 - 아이디찾기/자동로그인 폼 수정 :  .find-save >> .find-auto / #saveid >> #find-auto
#wrap.login .formbox .find-auto { position:absolute; bottom: 3.5vh; width:80%; }
#wrap.login .formbox .find-auto form#find-auto .find_idpw,
#wrap.login .formbox .find-auto form#find-auto .checks { display: inline-block; }
#wrap.login .formbox .find-auto form#find-auto .checks { float: right; }
//221125 로그인페이지 - 아이디찾기/자동로그인 폼 수정
#wrap.login button#btn_login { position: absolute; bottom: 0; height: 10vh; background: #0060aa; width: 100%; color: #fff; font-size: 1.2em; } */
#wrap.login button#btn_login { position: absolute; bottom: 0; height: 10vh; background: #0060aa; width: 100%; color: #fff; font-size: 1.2em; }
#wrap.login button#btn_mode_select { position: absolute; bottom: 0; height: 10vh; background: #00adef; width: 100%; color: #fff; font-size: 1.2em; }

/* 221216_로그인페이지 재작업(v2) */
#wrap.login { background-color:#d9e9f5 }
#wrap.login .logo_txt { padding: 23vh 10% 0 10%; }
#wrap.login .logo_txt .logo{ display: block; width: 62%; height: 4vh; text-indent: -9999px; background: url(../images/main/login_logo.png) no-repeat; background-size: contain;
     left: 10%; }
#wrap.login .logo_txt p { margin-top: 10px;  }
#wrap.login .formbox { width:80%; height: 37vh; border-radius: 30px 0 0 0; position: absolute;border-radius: 40px 0 0 0; top:47vh; z-index: 2; }
#wrap.login .formbox.inner { padding: 6vh 10% 0; }

#wrap.login .formbox #id-pw > div label, #wrap.login .formbox #id-pw > div input { display: block; width: 93%; padding-left: 3%; }
#wrap.login .formbox #id-pw > div input[type=text], #wrap.login .formbox #id-pw > div input[type=password] { height: 6vh; background: #fff; font-size: 1em; padding: 0 10px; border: none; border-radius: 15px; }
#wrap.login .formbox .find_idpw { display: inline-block; position: absolute; bottom: 9vh; left: 50%; transform: translateX(-50%); border-bottom: 1px solid #222; padding-bottom: 7px; }

#wrap.login button#btn_login { position: absolute; bottom: 0; height: 10vh; background: #0060aa; width: 100%; color: #fff; font-size: 1.2em; }

 
.popup .tabs_radio.select_loginmode { width: 100%;}
.popup .tabs_radio.select_loginmode:after { content:''; display: block; clear:both; }
.popup .tabs_radio.select_loginmode li { width: 49%; display: inline-block; border: 0; height: fit-content; }
.popup .tabs_radio.select_loginmode li.tab { float: none; }
.popup .tabs_radio.select_loginmode li:nth-child(1), .tabs_radio.select_loginmode li:nth-child(2) { margin-bottom:20px; }
.popup .tabs_radio.select_loginmode li label { background: none; height: auto; }
.popup .tabs_radio.select_loginmode li label .icon { width: 100px; height: 100px; border-radius: 100px; background: #f8f8f8; margin: auto; border: 1px solid #f8f8f8; }
.popup .tabs_radio.select_loginmode li label em { font-size: 1.1em; }

.popup .tabs_radio.select_loginmode li [type="radio"]:checked ~ label { background: none; color:#333; }
.popup .tabs_radio.select_loginmode li [type="radio"]:checked ~ label .icon { background-color: #fff; border:1px solid #dedede }
.popup .tabs_radio.select_loginmode li [type="radio"]:checked ~ label em { font-weight: bold; }

.popup .tabs_radio.select_loginmode li [type="radio"] ~ label .icon { background-repeat: no-repeat; }
.popup .tabs_radio.select_loginmode li.pattern [type="radio"] ~ label .icon { background-image: url('../images/main/ico_login_pattern.png'); background-size: 50%; background-position: 28px 28px; }
.popup .tabs_radio.select_loginmode li.number [type="radio"] ~ label .icon { background-image: url('../images/main/ico_login_number.png'); background-size: 45%; background-position: 26px 22px; }
.popup .tabs_radio.select_loginmode li.idpw [type="radio"] ~ label .icon { background-image: url('../images/main/ico_login_idpw.png'); background-size: 55%; background-position: 22px 30px; }
/* 221216_로그인페이지 재작업(v2) */

/* 221201 아이디, 비밀번호 찾기 */
#wrap.find-idpw .tabarea ul.tabs { margin-bottom: 0; }
#wrap.find-idpw .tabarea ul.tabs li { height: 8vh; line-height: 8vh; margin-right: 0; }
#wrap.find-idpw .tabarea ul.tabs li a { color: #555 !important; background: #f0f2f4; font-size: 1.2em; }
#wrap.find-idpw .tabarea ul.tabs li.on { background: none; }
#wrap.find-idpw .tabarea ul.tabs li.on a { color: #333 !important; background: #fff; font-size: 1.2em; font-weight: bold; position: relative; }
#wrap.find-idpw .tabarea ul.tabs li.on a:before { content:''; display: block; width:100%; position: absolute; top:0; height: 6px; background: #00adef; }
#wrap.find-idpw .tabarea .tab_container { padding-top: 6vh; }

#wrap.find-idpw .formbox { width: 100%; height: 33vh; background: #fff; border-radius: 30px 0 0 0; position: relative; border-radius: 40px 0 0 0; }
#wrap.find-idpw .formbox ul.notice { margin-bottom: 7vh; }
#wrap.find-idpw .formbox ul.notice li { font-size: 1em; color:#555; display: flex; align-items: center; position: relative; padding-bottom: 10px; }
#wrap.find-idpw .formbox ul.notice li:before { content:''; display: inline-block; width: 5px; height: 5px; border-radius: 5px; background: #00adef; line-height: 1em; 
    position: absolute; top: 6px; }
#wrap.find-idpw .formbox ul.notice li {  }
#wrap.find-idpw .formbox ul.notice li span { display: inline-block; padding-left: 10px; line-height: 1.3em; }
#wrap.find-idpw .formbox.inner { padding: 0; }
#wrap.find-idpw .formbox #findid > div label, #wrap.login .formbox #id-pw > div input { display: block; width: 93%; padding-left: 3%; }
#wrap.find-idpw .formbox #findid > div input[type=text], #wrap.login .formbox #findpw > div input[type=text] { width: 94%; height: 6vh; background: #eee; font-size: 1em; padding: 0 10px; border: none; border-radius: 15px; }
#wrap.find-idpw .formbox #findid .opt_id input#opt_id { border: 1px solid #ddd; background: #fff; font-weight: bold;  }
#wrap.find-idpw .formbox #findid .opt_id input#opt_id::placeholder { color:#333; }
#wrap.find-idpw .formbox .find-auto { position:absolute; bottom: 3.5vh; width:80%; }
#wrap.find-idpw .formbox .find-auto form#find-auto .find_idpw,
#wrap.find-idpw .formbox .find-auto form#find-auto .checks { display: inline-block; float: right; }
/* //221201 아이디, 비밀번호 찾기 */

#wrap.find-idpw .tab_container  {  }
#wrap.find-idpw .tab_container .login_btnarea { position: absolute; bottom: 0; height: 10vh; width: 100%; color: #fff; display: flex; }
#wrap.find-idpw .tab_container .login_btnarea button { font-size: 1.2em; margin-right: 0; height: auto; border-radius: 0;   }


/* 스플래시 화면 */
#wrap.splash { background: #0060aa; width: 100%; height: 100vh; position: relative; }
#wrap.splash h1 { position: absolute; width: 60%; height: 7vh; top: 45vh; right: 5%; text-indent: -9999px; background: url(../images/main/logo_splash.png) no-repeat; background-size: contain; }
#wrap.splash span { display: block; width: 100%; position:absolute; bottom: 2vh; text-align:center; font-size: .4em; color:#fff; }


/* 반응형 - iphoneSE */
@media all and (min-height: 660px) and (max-height: 680px) {
    main .contents { margin-top: 0 }
    /* 221216_메인수정
    main .contents .module article { height: 15vh; }
    main .contents .module article.module_middle { height: 22vh; }
    main .contents .module article .txt h3{ font-size: 1.1em; font-weight: 600; line-height: 1.1em; }
    main .contents .module article .txt p{ margin-top: 1vh; font-size: .85em; line-height: 1.15em;}
    main .contents .module article { background: url(../images/main/ico_go.png) no-repeat !important; background-position: 90% 9.5vh !important; background-size: 25% !important; }
    
    main .contents .md6ea article:nth-child(1) { background: url(../images/main/ico_order.png) no-repeat #00adef !important; background-position: 90% 5vh !important;
        background-size: 25% !important; }
    main .contents .md6ea article:nth-child(7) { background: url(../images/main/ico_graph.png) no-repeat #0060aa !important; background-position: 93% 6vh !important;
        background-size: 22% !important; }
    main .contents .md4ea article:nth-child(1) { background: url(../images/main/ico_order.png) no-repeat #00adef !important; background-position: 93% 3.5vh !important;
         background-size: 19% !important; }
    main .contents .wjj.md4ea article:nth-child(5) { background: url(../images/main/ico_recovery.png) no-repeat #0060aa !important; background-position: 91% 4.8vh !important;
        background-size: 17% !important; }
    main .contents .md4ea article:nth-child(5) { background: url(../images/main/ico_graph.png) no-repeat #0060aa !important; background-position: 91% 4.8vh !important;
        background-size: 17% !important; } */
    /* 221216_메인수정 */
    main .contents .module article.module_middle { height: 20vh; background-position: 87% 13.5vh !important; }
    main .contents .module article.module_col1 .txt h3 { font-size: 1.3em; line-height: 1.2em; }
    main .contents .md2ea article:nth-child(2) { height: 19.2vh; margin-top: 15px; background: url(../images/main/bg_md2ea.png) no-repeat center; background-size: 88%; }
    main .contents .ggj.module article.center { position: relative; width: 37.1%; margin: 0; overflow: hidden; z-index: 9; }
    main .contents .ggj.module article.center img { position: absolute; max-width: 230px; left: -10%; bottom: 10px; display: block; margin: auto; }
    main .contents .ggj article:nth-child(1) { background: url(../images/main/ico_order.png) no-repeat #00adef; background-position: 90% 2.5vh !important; background-size: 26% !important; }
    main .contents .ggj article:nth-child(5) { background: url(../images/main/ico_indoinsu.png) no-repeat #0060aa !important; background-position: 94% 3.8vh !important; background-size: 32% !important; }
    main .contents .gmj article:nth-child(1) { background: url(../images/main/ico_order.png) no-repeat #00adef !important; background-position: 90% 2.5vh !important; background-size: 26% !important; }
    main .contents .gmj article:nth-child(5) { background: url(../images/main/ico_indoinsu.png) no-repeat #0060aa !important; background-position: 94% 3.8vh !important; background-size: 32% !important; }
    main .contents .wssuj article:nth-child(1) { background: url(../images/main/ico_assign.png) no-repeat #00adef !important; background-position: 88% 3.5vh !important; background-size: 28% !important; }
    main .contents .wssuj article:nth-child(3) { background: url(../images/main/ico_ssgws.png) no-repeat #0060aa !important; background-position: 114% 5.5vh !important; background-size: 49% !important; }
    main .contents .wjj article:nth-child(1) { background: url(../images/main/ico_indoinsu.png) no-repeat #00adef !important; background-position: 94% 3.8vh !important; background-size: 32% !important; }
    main .contents .wjj article:nth-child(3) { background: url(../images/main/ico_ssgws.png) no-repeat #0060aa !important; background-position: 114% 5.5vh !important; background-size: 49% !important; }
    /* //221216_메인수정 */

    main .contents ul.btn_circle li .btn { width: 17vh; height: 17vh; }
    main .contents ul.btn_circle li .btn > div span { font-size: .85em; }
    
    .btmsheet ul li { padding-top: 6.8vh; }
    .btmsheet ul li.home img { top: -4.5vh; }

    .menu_slide .menuarea ul.dpt1 li > a { line-height: 8vh; }
    /* 230403 알람 로그 슬라이더 추가 */
    .alarm_slide .menuarea ul.dpt1 li > a { line-height: 8vh; }

    /* 221216_로그인페이지 재작업 */    
    #wrap.login .formbox { width: 80%; height: 41vh; border-radius: 30px 0 0 0; position: absolute; border-radius: 40px 0 0 0; top: 43vh; z-index: 2; }
}

/* 가로 반응형 */
@media all and (min-width: 320px) and (max-width: 375px) {/* 221124 사용자 전환기능 추가 - max-width 값 변경 */
    /* 221216_메인수정 */
    /* main .contents .module article .txt h3 { font-size: 1.1em; font-weight: 600; line-height: 1.1em; }
    main .contents .module article .txt p { margin-top: 0.8vh; font-size: .85em; line-height: 1.15em; } */
    main .contents article.module_w100 .txt h3 { font-size: 1.4em; }
    main .contents .module article.module_middle { height: 20vh; background-position: 87% 13.5vh !important; }
    main .contents .module article.module_col1 .txt h3 { font-size: 1.2em; line-height: 1.2em; }
    main .contents .md2ea article:nth-child(2) { height: 19.2vh; margin-top: 15px; background: url(../images/main/bg_md2ea.png) no-repeat center; background-size: 88%; }
    main .contents .ggj.module article.center { position: relative; width: 37.1%; margin: 0; overflow: hidden; z-index: 9; }
    main .contents .ggj.module article.center img { position: absolute; max-width: 230px; left: -10%; bottom: 10px; display: block; margin: auto; }
    main .contents .ggj article:nth-child(1) { background: url(../images/main/ico_order.png) no-repeat #00adef; background-position: 90% 2.5vh !important; background-size: 30% !important; }
    main .contents .ggj article:nth-child(5) { background: url(../images/main/ico_indoinsu.png) no-repeat #0060aa !important; background-position: 94% 3.8vh !important; background-size: 37% !important; }
    main .contents .gmj article:nth-child(1) { background: url(../images/main/ico_order.png) no-repeat #00adef !important; background-position: 90% 2.5vh !important; background-size: 30% !important; }
    main .contents .gmj article:nth-child(5) { background: url(../images/main/ico_indoinsu.png) no-repeat #0060aa !important; background-position: 94% 3.8vh !important; background-size: 37% !important; }
    main .contents .wssuj article:nth-child(1) { background: url(../images/main/ico_assign.png) no-repeat #00adef !important; background-position: 90% 4.5vh !important; background-size: 28% !important; }
    main .contents .wssuj article:nth-child(3) { background: url(../images/main/ico_ssgws.png) no-repeat #0060aa !important; background-position: 114% 6.5vh !important; background-size: 49% !important; }
    main .contents .wjj article:nth-child(1) { background: url(../images/main/ico_indoinsu.png) no-repeat #00adef !important; background-position: 94% 3.8vh !important; background-size: 37% !important; }
    main .contents .wjj article:nth-child(3) { background: url(../images/main/ico_ssgws.png) no-repeat #0060aa !important; background-position: 114% 6.5vh !important; background-size: 49% !important;}
    /* //221216_메인수정 */

    /* 221124 사용자 전환기능 추가 */
    header h1{ display: flex; width:70vw; height: 2.5vh; position: absolute; top: 3vh; left: 6%; margin: 0 auto; align-items: center; }
    header h1 img.logo { width: auto;  margin-right: 5px; max-width: 140px;}
    header h1 span { display: flex; height: 20px; line-height: 20px; border-radius: 15px; margin-top: 1px; padding: 0 2px 0 7px; font-size: .85em; background: #0060aa; color: #fff;
        align-items: center; } 
    header h1 span em { display: inline-flex; }/*  */
    header.wssuj h1 img.logo { max-width: 125px; }
    header.wssuj h1 span{ min-width: 68px; padding: 0 2px 0 7px; }
    header.wssuj h1 span em { font-size: 0.8em; }
    header h1 span button#user_change{ position: relative; text-indent: 0; background-color: #fff; width: 16px; height: 16px; border-radius: 18px; margin-left: 5px; }
    header h1 span button#user_change img { width: 95%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
    header button{ display: inline-block; position: absolute; text-indent: -9999px; }
    header button.menu{ background: url('../images/ico_menu.png') no-repeat center; width: 5.9%; height:2.54vh; background-size: cover; border: 0; right: 6%; top: 2.9vh; }

    .tabs_radio.select_usermode { width: 100%;}
    .tabs_radio.select_usermode:after { content:''; display: block; clear:both; }
    .tabs_radio.select_usermode li { width: 49%; display: inline-block; border: 0; height: fit-content; }
    .tabs_radio.select_usermode li:nth-child(1), .tabs_radio.select_usermode li:nth-child(2) { margin-bottom:20px; }
    .tabs_radio.select_usermode li label { background: none; height: auto; }
    .tabs_radio.select_usermode li label .icon { width: 100px; height: 100px; border-radius: 100px; background: #f8f8f8; margin: auto; border: 1px solid #f8f8f8; }
    .tabs_radio.select_usermode li label em { font-size: 1.1em; }

    .tabs_radio.select_usermode li [type="radio"]:checked ~ label { background: none; color:#333; }
    .tabs_radio.select_usermode li [type="radio"]:checked ~ label .icon { background-color: #fff; border:1px solid #dedede }
    .tabs_radio.select_usermode li [type="radio"]:checked ~ label em { font-weight: bold; }
    .tabs_radio.select_usermode li [type="radio"] ~ label .icon { background-repeat: no-repeat; }
    .tabs_radio.select_usermode li.ggj [type="radio"] ~ label .icon { background-image: url('../images/main/ico_user_ggj.png'); background-size: 70%; background-position: 17px 25px; }
    .tabs_radio.select_usermode li.gmj [type="radio"] ~ label .icon { background-image: url('../images/main/ico_user_gmj.png'); background-size: 70%; background-position: 17px 25px; }
    .tabs_radio.select_usermode li.wssuj [type="radio"] ~ label .icon { background-image: url('../images/main/ico_user_wssuj.png'); background-size: 70%; background-position: 13px 22px; }
    .tabs_radio.select_usermode li.wjj [type="radio"] ~ label .icon { background-image: url('../images/main/ico_user_wjj.png'); background-size: 45%; background-position: center 18px; }

    .tabs_radio.select_usermode li [type="radio"]:disabled ~ label em{ color:#999; }
    .tabs_radio.select_usermode li.ggj [type="radio"]:disabled ~ label .icon { background-image: url('../images/main/ico_user_ggj_d.png'); background-size: 70%;}
    .tabs_radio.select_usermode li.gmj [type="radio"]:disabled ~ label .icon { background-image: url('../images/main/ico_user_gmj_d.png'); background-size: 70%;}
    .tabs_radio.select_usermode li.wssuj [type="radio"]:disabled ~ label .icon { background-image: url('../images/main/ico_user_wssuj_d.png'); background-size: 70%;}
    .tabs_radio.select_usermode li.wjj [type="radio"]:disabled ~ label .icon { background-image: url('../images/main/ico_user_wjj_d.png'); background-size: 50%;}
    /* //221124 사용자 전환기능 추가 */
}

/* 가로 반응형 - Galaxy Fold */
@media all and (min-width: 280px) and (max-width: 319px) { 
    #wrap.login .formbox .find-auto a.find_idpw{ flex: 1.7; line-height: 1.3em; }
    #wrap.login .formbox .find-auto form#saveid { flex: 1.3; }
    #wrap.login .formbox .find-auto form#saveid .checks li label { line-height: 1.3em; }

    /* 221124 사용자 전환기능 추가 */
    header h1{ display: flex; width:70vw; height: 2.5vh; position: absolute; top: 3vh; left: 6%; margin: 0 auto; align-items: center; }
    header h1 img.logo { width: auto;  margin-right: 5px; max-width: 125px;}
    header h1 span { display: flex; height: 20px; line-height: 20px; border-radius: 15px; margin-top: 1px; padding: 0 2px 0 7px; font-size: .85em; background: #0060aa; color: #fff;
        align-items: center; } 
    header h1 span em { display: inline-flex; margin-top: -2px; }
    header.wssuj h1 img.logo { max-width: 125px; }
    header.wssuj h1 span{ min-width: 68px; }
    header.wssuj h1 span em { font-size: 0.8em; }
    header.wssuj h1 span { padding: 0 0 0 7px}
    header h1 span button#user_change{ position: relative; text-indent: 0; background-color: #fff; width: 16px; height: 16px; border-radius: 18px; margin-left: 5px; }
    header h1 span button#user_change img { width: 95%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
    header button{ display: inline-block; position: absolute; text-indent: -9999px; }
    header button.menu{ background: url('../images/ico_menu.png') no-repeat center; width: 5.9%; height:2.54vh; background-size: cover; border: 0; right: 6%; top: 2.9vh; }

    .tabs_radio.select_usermode { width: 100%;}
    .tabs_radio.select_usermode:after { content:''; display: block; clear:both; }
    .tabs_radio.select_usermode li { width: 49%; display: inline-block; border: 0; height: fit-content; }
    .tabs_radio.select_usermode li:nth-child(1), .tabs_radio.select_usermode li:nth-child(2) { margin-bottom:20px; }
    .tabs_radio.select_usermode li label { background: none; height: auto; }
    .tabs_radio.select_usermode li label .icon { width: 100px; height: 100px; border-radius: 100px; background: #f8f8f8; margin: auto; border: 1px solid #f8f8f8; }
    .tabs_radio.select_usermode li label em { font-size: 1.1em; }

    .tabs_radio.select_usermode li [type="radio"]:checked ~ label { background: none; color:#333; }
    .tabs_radio.select_usermode li [type="radio"]:checked ~ label .icon { background-color: #fff; border:1px solid #dedede }
    .tabs_radio.select_usermode li [type="radio"]:checked ~ label em { font-weight: bold; }

    .tabs_radio.select_usermode li [type="radio"] ~ label .icon { background-repeat: no-repeat; }
    .tabs_radio.select_usermode li.ggj [type="radio"] ~ label .icon { background-image: url('../images/main/ico_user_ggj.png'); background-size: 70%; background-position: 17px 25px; }
    .tabs_radio.select_usermode li.gmj [type="radio"] ~ label .icon { background-image: url('../images/main/ico_user_gmj.png'); background-size: 70%; background-position: 17px 25px; }
    .tabs_radio.select_usermode li.wssuj [type="radio"] ~ label .icon { background-image: url('../images/main/ico_user_wssuj.png'); background-size: 70%; background-position: 13px 22px; }
    .tabs_radio.select_usermode li.wjj [type="radio"] ~ label .icon { background-image: url('../images/main/ico_user_wjj.png'); background-size: 45%; background-position: center 18px; }

    .tabs_radio.select_usermode li [type="radio"]:disabled ~ label em{ color:#999; }
    .tabs_radio.select_usermode li.ggj [type="radio"]:disabled ~ label .icon { background-image: url('../images/main/ico_user_ggj_d.png'); background-size: 70%;}
    .tabs_radio.select_usermode li.gmj [type="radio"]:disabled ~ label .icon { background-image: url('../images/main/ico_user_gmj_d.png'); background-size: 70%;}
    .tabs_radio.select_usermode li.wssuj [type="radio"]:disabled ~ label .icon { background-image: url('../images/main/ico_user_wssuj_d.png'); background-size: 70%;}
    .tabs_radio.select_usermode li.wjj [type="radio"]:disabled ~ label .icon { background-image: url('../images/main/ico_user_wjj_d.png'); background-size: 50%;}
    /* //221124 사용자 전환기능 추가 */

    /* 221216_메인수정 
    main .contents .md6ea article:nth-child(1) { background: url(../images/main/ico_order.png) no-repeat #00adef !important; background-position: 95% 7vh !important;
    background-size: 28% !important;}
    main .contents .module article .txt h3 { font-size: 1em; font-weight: 600; line-height: 1.1em; }
    main .contents .module article .txt p { margin-top: 0.8vh; font-size: .8em; line-height: 1.15em; }
    main .contents ul.btn_circle li .btn > div span { display: block; text-align: center; margin: 5px auto 0; font-size: .8em; line-height: 1.2em; color: #333; } */
    /* 221216_메인수정 */
    main .contents .module article.module_middle { height: 20vh; background-position: 87% 13.5vh !important; }
    main .contents .module article .txt { margin: 17px 0 0 17px; }
    main .contents .module article.module_col1 .txt h3 { font-size: 1.3em; line-height: 1.2em; }
    main .contents .md2ea article:nth-child(2) { height: 19.2vh; margin-top: 15px; background: url(../images/main/bg_md2ea.png) no-repeat center; background-size: 88%; }
    main .contents .ggj.module article.center { position: relative; width: 37.1%; margin: 0; overflow: hidden; z-index: 9; }
    main .contents .ggj.module article.center img { position: absolute; max-width: 230px; left: -10%; bottom: 10px; display: block; margin: auto; }
    main .contents .ggj article:nth-child(1) { background: url(../images/main/ico_order.png) no-repeat #00adef; background-position: 92% 5.5vh !important; background-size: 27% !important; }
    main .contents .ggj article:nth-child(5) { background: url(../images/main/ico_indoinsu.png) no-repeat #0060aa !important; background-position: 94% 6.5vh !important; background-size: 32% !important; }
    main .contents .gmj article:nth-child(1) { background: url(../images/main/ico_order.png) no-repeat #00adef !important; background-position: 90% 4.5vh !important; background-size: 30% !important; }
    main .contents .gmj article:nth-child(5) { background: url(../images/main/ico_indoinsu.png) no-repeat #0060aa !important; background-position: 94% 6.5vh !important; background-size: 32% !important; }
    main .contents .wssuj article:nth-child(1) { background: url(../images/main/ico_assign.png) no-repeat #00adef !important; background-position: 88% 5.5vh !important; background-size: 28% !important; }
    main .contents .wssuj article:nth-child(3) { background: url(../images/main/ico_ssgws.png) no-repeat #0060aa !important; background-position: 114% 7.5vh !important; background-size: 49% !important; }
    main .contents .wjj article:nth-child(1) { background: url(../images/main/ico_indoinsu.png) no-repeat #00adef !important; background-position: 94% 6.5vh !important; background-size: 32% !important; }
    main .contents .wjj article:nth-child(3) { background: url(../images/main/ico_ssgws.png) no-repeat #0060aa !important; background-position: 114% 7.5vh !important; background-size: 49% !important; }
    /* //221216_메인수정 */

    /* 221216_로그인페이지 재작업 */
    #wrap.login .logo_txt { padding: 23vh 10% 0; }
    #wrap.login .logo_txt .logo { display: block; width: 80%; height: 4vh; text-indent: -9999px; background: url(../images/main/login_logo.png) no-repeat; background-size: contain; left: 10%; }
    /* //221216_로그인페이지 재작업 */
}