@charset "utf-8";


/* RESET */
* {box-sizing:border-box;margin:0;padding:0;border:0;outline:0;font-style:normal;overscroll-behavior:contain;}
:focus {outline:0;}
html {width:100%;height:100%;-webkit-text-size-adjust:none;}
body {width:100%;height:100%;font-family:'Malgun Gothic',sans-serif;font-size:14px;line-height:1.4;color:#121212;font-weight:normal;}
h1, h2, h3, h4, h5, h6 {font-family:'Malgun Gothic',sans-serif;}
i, em, address {font-style:normal;}
input, select, textarea, button, label {display:inline-block;vertical-align:middle;outline:none;-webkit-appearance:none;font-family:inherit;font-size:100%;}
input::-webkit-inner-spin-button {display:none;}
input::-webkit-clear-button {display:none;}
input::-webkit-calendar-picker-indicator {background:transparent;cursor:pointer;}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {-webkit-text-fill-color:#020c1a;transition:background-color 5000s ease-in-out 0s;}
input::-ms-clear {display:none;}
input:-internal-autofill-selected {background-color:inherit !important;}
textarea {resize:none;}
fieldset, img, iframe {border:none;}
img {vertical-align:top;outline:none;}
a {color:inherit;text-decoration:none;}
menu, li {list-style:none;}
button {display:flex;padding:0;margin:0;border:0;background:none;cursor:pointer;vertical-align:middle;font-family:inherit;line-height:1em;justify-content:center;align-items:center;}
caption {width:0;height:0;overflow:hidden;font-size:0;line-height:0;visibility:hidden;}
hr {display:none;}
table {width:100%;border-spacing:0;border-collapse:collapse;}
th, td {text-align:left;}
mark {background:none;}
::-webkit-input-placeholder {font-size:14px;color:#b0b0b0;text-transform:none;}
:-moz-placeholder {font-size:14px;color:#b0b0b0;text-transform:none;opacity:1;filter:alpha(opacity=100);}
::-moz-placeholder {font-size:14px;color:#b0b0b0;text-transform:none;opacity:1;filter:alpha(opacity=100);}
:-ms-input-placeholder {font-size:14px;color:#b0b0b0;text-transform:none;}


/* ----- common object ----- */
button.goback {height:100%;color:#fff;font-size:17px;opacity:0.6;}
button.goback::before {display:inline-block;width:25px;height:20px;margin-right:10px;background:url(/web/images/common/ico_arrow_left.svg) no-repeat center center / 100%;transform:rotate(180deg);content:'';}

/* ----- layout ----- */
header {display:flex;height:70px;justify-content:center;align-items:center;padding:0 15px;}
header .logo {overflow:hidden;width:200px;height:18px;background:url(/web/images/common/logo_hanssem.png) no-repeat 0 0;background-size:200px auto;text-indent:-1000000px;opacity:0.3;}
section.contents {padding:0 25px 30px;}

/* main */
.main {min-height:100%;background:#e9e9e9;}

/* app hub */
.apphub {width:100%;height:100%;background:#232f3e;}
.apphub header {display:block;height:50px;}
.apphub header .head-cont {display:flex;align-items:center;height:50px;}
.apphub section.contents {overflow:auto;width:100%;height:calc(100% - 50px);background:#ececec;border-radius:25px 25px 0 0;color:#121212;}


/* ----- contents ----- */
/* applist */
ul.applist {display:flex;flex-direction:column;row-gap:6px;}
ul.applist > li > a {display:flex;align-items:center;column-gap:20px;position:relative;box-sizing:border-box;padding:7px 15px 7px 15px;background:#fff;border-radius:10px;box-shadow:2px 2px 0 rgb(0 0 0 / 12%);}
ul.applist > li > a .app-ico {display:block;width:40px;height:40px;}
ul.applist > li > a .app-ico img {width:100%;height:100%;min-width:40px;min-height:40px;object-fit:cover;filter:drop-shadow(3px 3px 2px #c9c9c9);}
ul.applist > li > a .app-name {font-size:17px;line-height:1.4;color:#121212;letter-spacing:-1px;}

/* app hub contents */
.app-ico-showcase {position:relative;height:135px;margin-bottom:50px;background:url(/web/images/common/app_showcase.png) no-repeat 50% bottom;}
.app-ico-showcase .ico-img {display:block;overflow:hidden;position:absolute;top:40px;left:50%;width:114px;height:114px;border-radius:100%;background:#fff;transform:translateX(-50%);box-shadow:0 2px 1px 1px rgb(0 0 0 / 14%);}
.app-ico-showcase .ico-img img {position:absolute;top:0;left:0;width:100%;height:100%;border-radius:100%;object-fit:cover;}

/* application information */
.appinfo {text-align:center;}
.appinfo h1 {display:inline-block;padding-bottom:10px;border-bottom:1px solid;font-size:23px;letter-spacing:-1px;}
.appinfo p {padding:10px;font-size:13px;letter-spacing:-0.5px;text-align:center;}

.manual-download {display:flex;flex-direction:column;align-items:center;row-gap:3px;margin:20px 0 30px 0;}
.manual-download button {display:flex;flex-wrap:nowrap;justify-content:center;align-items:center;column-gap:8px;width:100%;padding:8px 20px;background:#fff;border:1px dashed #191919;border-radius:10px;font-size:15px;line-height:1.2;font-weight:600;}
.manual-download button::before {content:'';flex: 0 0 20px;display:inline-block;width:20px;height:20px;background:url(/web/images/common/ico_download.png) no-repeat center center / 80%;}

.app-download {display:flex;flex-wrap:wrap;gap:25px;margin:20px 0 30px 0;justify-content:center;}
.app-download button {display:flex;width:140px;height:135px;background:#eee;border-radius:20px;flex-direction:column;justify-content:center;box-shadow:5px 7px 7px 3px rgb(0 0 0 / 29%),-2px 1px 6px 8px #fff;}
.app-download button .btndev {background:#ff0000;}
.app-download button .btnqa {background:#0864ff;}
.app-download button.android::before {display:inline-block;width:70px;height:70px;padding-top:58px;background:url(/web/images/common/ico_os_android.png) no-repeat center 10px / 55%;opacity:0.6;font-size:20px;font-weight:600;box-sizing:border-box;content:'Android';}
.app-download button.ios::before {display:inline-block;width:70px;height:70px;padding-top:58px;background:url(/web/images/common/ico_os_ios.png) no-repeat center 10px / 50%;opacity:0.6;font-size:20px;font-weight:600;box-sizing:border-box;content:'iOS';}
.app-download button span {display:inline-block;width:80%;height:25px;margin-top:20px;background:#191919;border-radius:30px;font-size:13px;line-height:25px;color:#fff;}

.app-download {display:flex;flex-wrap:wrap;gap:25px;margin:20px 0 30px 0;justify-content:center;}
.app-download a {display:flex;width:140px;height:135px;background:#eee;border-radius:20px;flex-direction:column;justify-content:center;box-shadow:5px 7px 7px 3px rgb(0 0 0 / 29%),-2px 1px 6px 8px #fff;text-decoration:none;}
.app-download a .btndev {background:#ff0000;}
.app-download a .btnqa {background:#0864ff;}
.app-download a.android::before {display:inline-block;width:70px;height:70px;padding-top:58px;background:url(/web/images/common/ico_os_android.png) no-repeat center 10px / 55%;opacity:0.6;font-size:20px;font-weight:600;box-sizing:border-box;content:'Android';}
.app-download a.ios::before {display:inline-block;width:70px;height:70px;padding-top:58px;background:url(/web/images/common/ico_os_ios.png) no-repeat center 10px / 50%;opacity:0.6;font-size:20px;font-weight:600;box-sizing:border-box;content:'iOS';}
.app-download a span {display:inline-block;width:80%;height:25px;margin-top:20px;background:#191919;border-radius:30px;font-size:13px;line-height:25px;color:#fff;}

.apphub section.manager {position:fixed;z-index:1;bottom:0;width:100%;height:50px;background:#bfbfbf;}
.apphub section.manager > div {display:flex;height:100%;justify-content:center;align-items:center;font-size:17px;font-weight:600;letter-spacing:-1px;}
.apphub section.manager span {display:flex;font-size:18px;align-items:center;}
.apphub section.manager span::before {display:inline-block;width:25px;height:25px;margin:0 12px 0 15px;background:url(/web/images/common/ico_phone.svg) no-repeat center center / 100%;content:'';}
.apphub section.manager .callnum {font-weight:600;cursor:pointer;}
.apphub section.manager .callnum::after {content:'';display:inline-block;width:25px;height:25px;margin:0 0 0 5px;background:url(/web/images/common/ico_arrow_down.svg) no-repeat center center / 40%;transform:rotate(180deg);}
.apphub section.manager .numlist {position:fixed;bottom:-500px;width:100%;height:200px;padding-top:40px;background:#bfbfbf;}
.apphub section.manager .numlist li {display:flex;padding:7px 0;align-items:center;}
.apphub section.manager .numlist button {position:absolute;top:0;width:100%;height:40px;margin:0 0 0 5px;font-size:17px;font-weight:600;letter-spacing:-1px;}
.apphub section.manager .numlist button::after {content:'';display:inline-block;width:25px;height:25px;margin:0 0 0 5px;background:url(/web/images/common/ico_arrow_down.svg) no-repeat center center / 40%;}