@charset "utf-8";

/*
css name : component
use : align,display,layout,header,footer,lnb,aside
*/

/* ==================================================
	웹 폰트
================================================== */
@font-face {font-family:nsq;font-weight:100;font-style:normal;src:url(../font/NanumSquareL.eot);src:local(※),url(../font/NanumSquareL.woff) format('woff'); font-display: swap;}
@font-face {font-family:nsq;font-weight:400;font-style:normal;src:url(../font/NanumSquareR.eot);src:local(※),url(../font/NanumSquareR.woff) format('woff'); font-display: swap;}
@font-face {font-family:nsq;font-weight:700;font-style:normal;src:url(../font/NanumSquareB.eot);src:local(※),url(../font/NanumSquareB.woff) format('woff'); font-display: swap;}
@font-face {font-family:nsq;font-weight:900;font-style:normal;src:url(../font/NanumSquareEB.eot);src:local(※),url(../font/NanumSquareEB.woff) format('woff'); font-display: swap;}


/* ==================================================
	RESET
================================================== */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, xmp,
a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small,
strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form,
label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details,
embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time,
mark, audio, video {margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block;}
ol, ul {list-style:none;}
table {border-collapse:collapse;border-spacing:0;}
th,td {vertical-align:middle;box-sizing:border-box;}
a:link, a:visited, a:hover, a:active {color:inherit;text-decoration:none;outline:none;}
b,strong {font-weight:700;}
input, textarea, select, button {margin:0;padding:0;font:inherit;}
button {border:0;background:none;outline:none;vertical-align:baseline;cursor:pointer;}
button > span {position:relative;vertical-align:baseline;}
button::-moz-focus-inner, input::-moz-focus-inner {padding:0;border:0;}
button[disabled], input[disabled] {cursor:default;}
textarea {overflow:auto;}
textarea, input {resize:none;}
legend {visibility:hidden; font-size:0;}
audio:not([controls]) {display:none;height:0;}
svg:not(:root){overflow:hidden;}
input[type="text"]::-ms-clear,
input[type="password"]::-ms-clear{display:none;}
input[type="button"],
input[type="reset"],
input[type="submit"]{border-radius:0;-webkit-appearance:button;appearance:button;cursor:pointer;}
button,
textarea,
input[type="text"],
input[type="password"],
input[type="email"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="search"],
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {border-radius:0;-webkit-border-radius:0;appearance:none;-webkit-appearance:none;}
select {border-radius:0;-webkit-border-radius:0;}
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button{margin:0;-webkit-appearance:none;}
img {max-width:100%; max-height:100%;}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    transition: background-color 5000s ease-in-out 0s;
}


/* ==================================================
	공통레이아웃
================================================== */
html,
body {min-width:320px;width:100%;height:100%;background-color:#fff;color:#2D2D2D;font-family:nsq,sans-serif;font-weight:400;-webkit-text-size-adjust:none;}
html {font-size:62.5%;}
body {position:relative;font-size:1.2rem;line-height:1.4;}

/* ==================================================
	align
================================================== */
.ta-l {text-align:left !important;}
.ta-c {text-align:center !important;}
.ta-r {text-align:right !important;}

.va-t {vertical-align:top !important;}
.va-m {vertical-align:middle !important;}
.va-b {vertical-align:bottom !important;}
.va-bl {vertical-align:baseline !important;}

.trans-xy {top:50%; left:50%; transform:translate(-50%,-50%); -webkit-transform:translateX(-50%,-50%);}
.trans-x {left:50%; transform:translateX(-50%); -webkit-transform:translateX(-50%); }
.trans-y {top:50%; transform:translateY(-50%); -webkit-transform:translateY(-50%); }


/* ==================================================
	hide & float & clear
================================================== */
.hide {display:none !important;}
.pull-left, .fl-l {float:left;}
.pull-right, .fl-r {float:right;}
.clear:after {display:block; clear:both; content:"";}
.ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.v-hidden {visibility:hidden; overflow:hidden;position:absolute;left:-1000%;top:auto;width:1px;height:1px;}
caption.v-hidden {position:relative;}


/* ==================================================
	transition
================================================== */
.transition-normal {transition:all .3s;-webkit-transition:all .3s;}
.transition-slow {transition:all 1s;-webkit-transition:all 1s;}


/* ==================================================
	skip
================================================== */
a.skip{display:block;position:absolute;top:-1px;z-index:999;width:0;height:0;overflow:hidden;text-align:center}
a.skip:active,a.skip:focus{z-index:999;width:100%;height:auto;padding:5px;background:#FFF}


/* ==================================================
	margin, padding
================================================== */
.no-margin {margin:0 !important;}
.no-padding {padding:0px !important;}

.mt-5 { margin-top:5px !important; }
.mt-10 { margin-top:10px !important; }
.mt-20 { margin-top:20px !important; }
.mt-30 { margin-top:30px !important; }
.mt-40 { margin-top:40px !important; }
.mt-50 { margin-top:50px !important; }
.mt-60 { margin-top:60px !important; }
.mt-70 { margin-top:70px !important; }
.mt-80 { margin-top:80px !important; }
.mt-90 { margin-top:90px !important; }
.mt-100 { margin-top:100px !important; }

.mb-5 { margin-bottom:5px !important; }
.mb-10 { margin-bottom:10px !important; }
.mb-20 { margin-bottom:20px !important; }
.mb-30 { margin-bottom:30px !important; }
.mb-40 { margin-bottom:40px !important; }
.mb-50 { margin-bottom:50px !important; }
.mb-60 { margin-bottom:60px !important; }
.mb-70 { margin-bottom:70px !important; }
.mb-80 { margin-bottom:80px !important; }
.mb-90 { margin-bottom:90px !important; }
.mb-100 { margin-bottom:100px !important; }

.ml-5 { margin-left:5px !important; }
.ml-10 { margin-left:10px !important; }

/* ==================================================
	Font
================================================== */
.fz-10 {font-size:1.0rem;}
.fz-11 {font-size:1.1rem;}
.fz-12 {font-size:1.2rem;}
.fz-13 {font-size:1.3rem;}
.fz-14 {font-size:1.4rem;}
.fz-15 {font-size:1.5rem;}
.fz-16 {font-size:1.6rem;}
.fz-17 {font-size:1.7rem;}
.fz-18 {font-size:1.8rem;}
.fz-20 {font-size:2.0rem;}
.fz-22 {font-size:2.2rem;}
.fz-24 {font-size:2.4rem;}

.fw-100 { font-weight:100}
.fw-700 { font-weight:700}
.fw-900 { font-weight:900}

.fc-red { color: #f37421; }
.fc-gray { color:#858585; }
.fc-lightgray { color:#aaa; }
.fc-blue { color:#009DD1; }

/* ==================================================
	width
================================================== */
.w20-per {width:20%;}
.w25-per {width:25%;}
.w33-per {width:33.33%;}
.w50-per {width:50%;}
.w66-per {width:66.66%;}
.w75-per {width:75%;}
.w100-per {width:100% !important;}

/* ==================================================
	ETC
================================================== */

.option-box {display:inline-block;}
.option-box label {display:inline-block;height:16px;margin-right:12px;color:#555;line-height:20px;cursor:pointer;background-repeat:no-repeat;}
.option-box.type2 label { margin-right: 15px; }
.option-box.chk-alone label {display:inline-block;height:20px; width: 20px; margin-right:0; cursor:pointer;background-repeat:no-repeat;}
.option-box label:last-child {margin:0;}
.option-box [type="radio"],
.option-box [type="checkbox"] {width:1px; height:1px; overflow:hidden; position:absolute; left:-10000%;}
.option-box [type="checkbox"] + label {background-image:url(../img/btn/btn_checkboxes.png);}
.option-box [type="radio"]:disabled + label {cursor:default;}
.option-box.dir-flow label {padding-left:22px;}
.option-box.dir-flow.chk-alone label {padding-left:0;}
.option-box.dir-flow.radio-label-bold label { font-weight: 800; color: #222; }
.option-box.dir-flow [type="radio"] + label,
.option-box.dir-flow [type="checkbox"] + label {background-position:0 0;}
.option-box.dir-flow [type="radio"]:checked + label,
.option-box.dir-flow [type="checkbox"]:checked + label {background-position:0 -16px;}
.option-box.dir-flow [type="radio"]:disabled + label,
.option-box.dir-flow [type="checkbox"]:disabled + label {background-position:0 -32px;}
.option-box.dir-reverse label {padding-right:30px;}
.option-box.dir-reverse [type="radio"] + label,
.option-box.dir-reverse [type="checkbox"] + label {background-position:100% 0;}
.option-box.dir-reverse [type="radio"]:checked + label,
.option-box.dir-reverse [type="checkbox"]:checked + label {background-position:100% -16px;}
.option-box.dir-reverse [type="radio"]:disabled + label,
.option-box.dir-reverse [type="checkbox"]:disabled + label {background-position:100% -32px;}

.bg-gray { background-color:#F7F7F7; }

/* ==================================================
	icons
================================================== */
.icon-check { width:15px; height:10px; background:url(../img/icon/icon_check.png) no-repeat center; }
.icon-fileclip { width:27px; height:26px; background:url(../img/icon/icon_fileclip.png) no-repeat center; }

[class^="icon-"] {display:inline-block;background-size:contain;background-repeat:no-repeat;vertical-align:middle;font-size:0;}
.icon-back {width:12px;height:20.5px;background-image:url(../img/icon/icon_back_top.png);}
.icon-sch {width:16px;height:16px;background-image:url(../img/icon/icon_search.png);}
.icon-menu {width:16px;height:16px;background-image:url(../img/icon/icon_menu.png);}
.icon-lnb-home {width:20px;height:18px;background-image:url(../img/icon/icon_home.png);}
.icon-lnb-bell {width:16px;height:16px;background-image:url(../img/icon/icon_bell.png);}
.icon-lnb-setting {width:16px;height:16px;background-image:url(../img/icon/icon_setting.png);}
.icon-lnb-logout {width:14px;height:16px;background-image:url(../img/icon/icon_logout.png);}
.icon-login-kakao {width:24px;height:22px;background-image:url(../img/icon/icon_login_kakao.png);}
.icon-login-naver {width:22px;height:20px;background-image:url(../img/icon/icon_login_naver.png);}
.icon-login-fb {width:11px;height:24px;background-image:url(../img/icon/icon_login_fb.png);}
.icon-login-google {width:31px;height:20px;background-image:url(../img/icon/icon_login_google.png);}
.icon-camera {width:21px;height:21px;background-image:url(../img/icon/icon_camera.png);}
.icon-my-calendar {width:22px;height:22px;background-image:url(../img/icon/icon_calendar_b.png);}
.icon-my-member {width:22px;height:22px;background-image:url(../img/icon/icon_member_b-1.png);}
.icon-my-bell {width:22px;height:22px;background-image:url(../img/icon/icon_bell_b.png);}
.active .icon-my-calendar {background-image:url(../img/icon/icon_calendar_a.png);}
.active .icon-my-member {background-image:url(../img/icon/icon_member_a.png);}
.active .icon-my-bell {background-image:url(../img/icon/icon_bell_a.png);}
.icon-call {width:20px;height:20px;background-image:url(../img/icon/icon_call_alpha-1.png);}
.icon-call-cancel {width:20px;height:20px;background-image:url(../img/icon/icon_call_cancel-1.png);}
.icon-register {width:17px;height:20px;background-image:url(../img/icon/icon_register_footer_a.png);}
.icon-member {width:21px;height:21px;background-image:url(../img/icon/icon_member_b.png);}
.icon-memberout {width:22px;height:27px;background-image:url(../img/icon/icon_memberout.png);}
.icon-ticket {width:27px;height:17px;background-image:url(../img/icon/icon_ticket_a.png);}
.icon-whistle {width:24px;height:14px;background-image:url(../img/icon/icon_whistle_a.png);}
.active .icon-ticket {background-image:url(../img/icon/icon_ticket_b.png);}
.active .icon-whistle {background-image:url(../img/icon/icon_whistle_b.png);}
.icon-sch-clear {width:15px;height:15px;background-image:url(../img/icon/icon_btn_close_1.png);}
.icon-alarm {width:19px;height:19px;background-image:url(../img/icon/icon_bell_fill.png);}
.icon-card {width:20px;height:14px;background-image:url(../img/icon/icon_card.png);}
.icon-toolbar-back {width:25px;height:24px;background-image:url(../img/icon/icon_back_footer.png);}
.icon-toolbar-top {width:24px;height:24px;background-image:url(../img/icon/icon_top_footer.png);}
.icon-toolbar-calendar {width:19px;height:19px;background-image:url(../img/icon/icon_calendar_footer.png);}
.icon-toolbar-home {width:22px;height:21px;background-image:url(../img/icon/icon_home_footer.png);}
.icon-toolbar-member {width:24px;height:18px;background-image:url(../img/icon/icon_members_footer.png);}
.icon-toolbar-reg {width:17px;height:20px;background-image:url(../img/icon/icon_register_footer.png);}
.icon-toolbar-receipt {width:19px;height:20px;background-image:url(../img/icon/icon_receipt_footer.png);}
.icon-eye {width:20px;height:17px;background-image:url(../img/icon/icon_pw_hidden.png);}
.active .icon-eye {height:11px;background-image:url(../img/icon/icon_pw_visuable.png);}
/* ==================================================
	web 소개 - 공통
================================================== */

.web-container .btn-basic { display:inline-block; text-align:center; box-sizing:border-box; font-weight:700;}

.web-container .btn-basic.is-small { min-width:60px; height:32px; line-height:32px; font-size:15px; border-radius:3px; padding:0 12px;}
.web-container .btn-basic.is-medium { width:180px; height:47px; line-height:47px; font-size:18px; border-radius:5px; }
.web-container .btn-basic.is-big { width:220px; height:55px; height:55px; line-height:55px; font-size:20px; border-radius:5px; }

.web-container .btn-basic.black { background-color:#2d2d2d; color:#fff; }
.web-container .btn-basic.orange { background-color:#ff872b; color:#fff; }
.web-container .btn-basic.gray { background-color:#dddddd; color:#fff; }

.web-container .btn-basic.black a { color:#fff; }
.web-container .btn-basic.outline { border:1px solid #bfbfbf; color:#2d2d2d; }
.web-container .btn-basic[type="disabled"] { background-color:#ddd; color:#fff; }
.web-container .btn-basic.bd-none { border-radius:0 !important; }

.bpopup-wrap { display:none; }

/* ================================================================================================================ */
/* ================================================================================================================ */
/* ============================================= 기존 component 추가 ================================================ */
/* ================================================================================================================ */
/* ================================================================================================================ */

/* ==================================================
	button
================================================== */
[class^="btn-"] {vertical-align:top;}

/* ==================================================
	input
================================================== */
/* input */
[type="search"],
[type="number"],
[type="tel"],
[type="date"],
[type="text"],
[type="password"] {height:40px;padding:0 10px;border:1px solid #EDEDED;border-width:0 0 1px;color:#2D2D2D;font-size:1.8rem;font-weight:100;box-sizing:border-box;outline:0;}
textarea {overflow:auto;resize:none;padding:8px;border:1px solid #EDEDED;font-size:1.8rem;font-weight:100;box-sizing:border-box;outline:0;}

[type="text"]:disabled,
[type="password"]:disabled {background:#f6f6f6;}

textarea:focus,
[type="number"]:focus,
[type="tel"]:focus,
[type="search"]:focus,
[type="date"]:focus,
[type="text"]:focus,
[type="password"]:focus {border-color:#4FCDE0;color:#4FCDE0;}

input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {color:#C4C4C4;font-size:1.2rem;}

.input_wrp input {width:100%;}

/* select */
select {height:40px;padding:0 15px 0 10px;border:1px solid #EDEDED;border-width:0 0 1px;color:#2D2D2D;font-size:1.8rem;border-radius:0;background:#fff url(../img/icon/icon_arrow_down.png) 100% 50% no-repeat;background-size:10px;-webkit-appearance:none;appearance:none;outline:0;}
select.rtl {direction:rtl;}

/* option */
.option-box {display:inline-block; font-size:0; vertical-align:middle;}
.option-box label {display:inline-block;}
.option-box label + label {margin-left:5px;}
.option-box label span {display:inline-block;color:#2D2D2D;font-size:1.4rem;line-height:24px;vertical-align:middle;}
.option-box [type="radio"],
.option-box [type="checkbox"] {width:24px;height:24px;background:none;border-radius:50%;border:1px solid #2D2D2D;-webkit-appearance:none;outline:0;vertical-align:middle;}
.option-box [type="radio"]:checked,
.option-box [type="checkbox"]:checked {border-width:8px;border-color:#4FCDE0;}
.option-box [type="radio"]:checked + span,
.option-box [type="checkbox"]:checked + span {color:#4FCDE0;}
.option-box [type="radio"]:disabled,
.option-box [type="checkbox"]:disabled {border-color:#e1e1e1; background:#f6f6f6;}

/* option + 정방향 */
.option-box.dir-flow span {margin-left:6px;}
.option-box.dir-flow label + label {margin-left:34px;}

/* option + 역방향 */
.option-box.dir-reverse span {margin-right:6px;}
.option-box.dir-reverse label + label {margin-left:34px;}

/* option + 단독 */
.option-box.is-alone span {visibility:hidden; font-size:0;}

/* file name preview */
.filebox {position:relative;}
.filebox.no-photo .upload-display {display:none !important;}
.filebox input[type="file"] {position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip:rect(0,0,0,0); border: 0;}
.filebox label {cursor: pointer;}
.filebox .upload-nm { display: inline-block; height:35px; width:240px; padding:0 12px; background-color: #fff; border: 1px solid #cbcbcb; -webkit-appearance: none; -moz-appearance: none; appearance: none; box-sizing:border-box;}
.filebox.no-photo {display:inline-block;max-width:100%;padding-left:100px;padding-right:32px;box-sizing:border-box;}
.filebox.no-photo label {position:absolute;top:0;left:0;width:85px;}
.filebox.no-photo .upload-nm {width:auto;max-width:100%;padding:0;border:0;}
.filebox.no-photo .btn-close {display:none;position:absolute;top:2px;right:0;}
.filebox.no-photo .upload-display ~ .btn-close {display:block;}

/* imaged preview */
.filebox.preview-image {display:inline-block;font-size:0;}
.filebox .photoBox {position:relative; display:inline-block; width:94px; height:94px;border-radius:50%; background:#fff url(../img/icon/icon_photo_below.png) no-repeat;background-size:100%; cursor:pointer; box-sizing:border-box; text-align:center;}
.filebox .photoBox span {display:block; content:""; position:absolute;right:0;bottom:0;z-index:10;}
.filebox .photoBox .icon-photo-line {width:16px;height:13px;background-position:100%;opacity:.3;}
.filebox .photoBox + .del {display:none; position:absolute; top:0; right:0; width:9px; height:9px; background:rgba(0,0,0,.8) url(../img/icon/btn_delete_w.png) 50% no-repeat; cursor:pointer}
.filebox .photoBox.after {position:absolute; top:0; left:0; background:none;}
.filebox .photoBox.after span {font-size:0;opacity:0;}
.filebox .photoBox.after + .del {display:block; padding:5px;}
.filebox .upload-thumb-wrap {overflow:hidden;position:relative;display:block;width:94px;height:94px;border:2px solid #EDEDED;border-radius:50%;box-sizing:border-box;}
.filebox .upload-display img {display:block; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%);width:90px;height:90px;box-sizing:border-box;}


/* ================================================================================================================ */
/* ================================================================================================================ */
/* ========================================= web/mobile intro 추가 ================================================= */
/* ================================================================================================================ */
/* ================================================================================================================ */

.policy-wrap .inner-wrap { padding:0 15px;}
.policy-wrap .caption { font-size:1.2rem; font-weight:900; }
.policy-wrap textarea { width:100%; font-size:1.2rem; line-height:1.8rem; color:#858585; text-align:left; }

.check-with-text label { font-size:1.4rem; line-height:1.4; }
.radio-with-text { position:relative; display:block; }
.radio-with-text label span { font-size:1.6rem; font-weight:400;}
.radio-with-text input[type="radio"] { position:absolute; top:0; left:0; }

.privacy-policy-detail { padding:0 15px; }
.privacy-policy-detail p { line-height:1.5;}

/* ================================================
  소개페이지 - 웹
=================================================== */
#intro-web .header { position:fixed; top:0; left:0; width:100%; z-index:100; height:70px; }
#intro-web .inner-wrap { width:1780px; margin:0 auto; position:relative;box-sizing:border-box; }
#intro-web .header h1 { padding-top:26px; }
#intro-web .header .logo { position:absolute; top:0; left:0; width:160px; }
#intro-web .header nav { text-align:center; }
#intro-web .header nav ul { display:inline-block; }
#intro-web .header nav ul li { float:left; font-size:1.5rem; line-height:70px; margin:0 25px;}
#intro-web .header nav ul li a { display:inline-block; position:relative; font-weight:900; transform:skew(-0.03deg) }
#intro-web .header nav ul li.active a { line-height:1;position:relative; }
#intro-web .header nav ul li.active a:after { content:""; display:inline-block; height:4px; width:120%; background-color:#ff872b; position:absolute; bottom:0; left:50%; transform:translate(-50%,0); z-index:-1;}
#intro-web .header.light nav ul li a { color:#fff; }
#intro-web .header .sign { position:absolute; top:0; right:0; padding-top:28px; }
#intro-web .header .sign a,
#intro-web .header .sign span { display:inline-block; font-size:1.3rem; font-family:'Montserrat', sans-serif; font-weight:700; }
#intro-web .header.light .sign a,
#intro-web .header.light .sign span { color:#fff; }
#intro-web .header.light .sign span.divider { margin:0 7px;}
#intro-web .header .logo-img.white { display:none; }
#intro-web .header.light .logo-img { display:none; }
#intro-web .header.light .logo-img.white { display:block; }

#intro-web .footer { position:fixed; bottom:0; left:0; width:100%; z-index:100; height:50px; background-color:#e0e0e0; }
#intro-web .footer .inner { width:1200px; margin:0 auto;}
#intro-web .footer p { font-size:13px; line-height:50px; }
#intro-web .footer span { display:inline-block; font-size:13px; line-height:50px; vertical-align:middle; }
#intro-web .footer .logo { height:20px; vertical-align:middle; margin-right:20px; }

#intro-web .side-icons { position:fixed; top:50%; left:70px; transform:translate(0, -50%); z-index:100;}
#intro-web .side-icons .icon-list li { margin-bottom:26px; padding:7px 13px 7px 8px; border-radius:5px;  }
#intro-web .side-icons .icon-list li img { width:24px; cursor:pointer; vertical-align:middle; }
#intro-web .side-icons .icon-list li .txt { display:none; font-size:1.3rem; vertical-align:middle; color:#fff; margin-left:10px;}
#intro-web .side-icons .icon-list li:hover .dark { display:none; }
#intro-web .side-icons .icon-list li:hover .light { display:block; }
#intro-web .side-icons .icon-list li:hover { background-color:#FF872B;}
#intro-web .side-icons .icon-list li:hover .txt { display:inline-block; }
#intro-web .side-icons .light { display:none; }
#intro-web .side-icons.light .dark { display:none; }
#intro-web .side-icons.light .light { display:block; }

#intro-web .text-area .tit { font-size:50px; line-height:1.3; margin-bottom:20px; font-weight:900;}
#intro-web .text-area .sub-tit { font-size:25px; margin-bottom:80px; font-weight:700; }
#intro-web .text-area .txt { font-size:17px; color:#858585; margin-bottom:30px; line-height:1.5;}
#intro-web .text-area .txt.type02 { font-size:14px; }

#section0 { background:url(../img/common/about_bg.jpg) no-repeat center; background-size:cover; position:relative; }
#section0 .text-area { display:inline-block; text-align:left; margin-right:310px; position:relative;}
#section0 .text-area .tit { font-size:5rem; color:#fff; margin-bottom:55px; font-weight:100; }
#section0 .text-area .tit .fc-blue { color:#00e4ff; font-weight:900; }
#section0 .text-area .sub-tit { font-size:3rem; font-weight:bold; color:#fff; margin-bottom:25px; }
#section0 .text-area .txt { font-size:1.8rem; line-height:27px; color:#fff; margin-bottom:80px; font-weight:100; }
#section0 .btn-download { display:inline-block; position:relative; }
#section0 .btn-download a { display:inline-block; width:160px; font-size:1.6rem; color:#fff; border-bottom:3px solid #fff; line-height:1.8; background:url(../img/icon/icon_arrow_down_1.png) no-repeat right; background-size:15px; position:relative; z-index:10; font-weight:700; }
#section0 .btn-download img { position:relative; top:60px; right:70px; width:120px;}
#section0 .img-scroll { position:absolute; bottom:70px; left:50%; transform:translate(-50%,0); text-align:center; }
#section0 .img-scroll p { color:#fff; font-size:10px; text-align:center; font-family:'Montserrat', sans-serif; margin-top:4px; font-weight:400;}

#section1 .intro-slider-wrap { padding-left:40%; }
#section1 .intro-slider-wrap .inner { position:relative; }
#section1 .intro-slider-wrap .frame { width:332px; position:absolute; top:-59px; left:-36px; z-index:10;}
#section1 .intro-slider .img-wrap { width:262px; padding:0 5px; box-sizing:border-box; }
#section1 .intro-slider .resv-img { width:100%;}
#section1 .text-area { width:450px; position:absolute; top:-15px; left:-450px; text-align:left;}
#section1 .text-area .sld-nav li { margin-bottom:10px; position:relative; }
#section1 .text-area .sld-nav li span { cursor:pointer; font-size:15px; position:relative; z-index:1; }
#section1 .text-area .sld-nav li.active span { font-weight:900; transform: skew(-0.03deg); }
#section1 .text-area .sld-nav li.active:after { content:""; display:block; height:7px; background-color:#00e4ff; position:absolute; bottom:0; left:0; width:100%; }
#section1 .pager .current { font-family:'Montserrat', sans-serif; font-size:25px; font-weight:900; color:#ff872b; vertical-align:middle;  }
#section1 .pager .divider { font-size:13px; margin:0 10px; color:#777; vertical-align:middle; }
#section1 .pager .total { font-family:'Montserrat', sans-serif; font-size:15px; color:#666; vertical-align:middle; }

#section1 .sld-paging { position:relative; }
#section1 .sld-paging .sld-prev { position:absolute; top:10px; left:-40px;}
#section1 .sld-paging .sld-next { position:absolute; top:10px; right:-40px;}
#section1 .sld-paging .sld-prev img,
#section1 .sld-paging .sld-next img { width:10px; cursor:pointer; opacity:.4; }
#section1 .sld-paging .sld-prev img:hover,
#section1 .sld-paging .sld-next img:hover { opacity:1; }
#section1 .descriptions li { display:none; }
#section1 .descriptions li.active { display:block; }

#section2 { height:100vh; position:relative; }
#section2 .content { width:1400px; display:inline-block; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%)}
#section2 .content .resv-img { width: 800px; }
#section2 .text-area { width:460px; padding-top:140px; padding-left:50px;}
#section2 .deco1 { position:absolute; bottom:0; right:0;}
#section2 .deco2 { position:absolute; top:0; left:0;}

#section3 { height:100vh; background:url(../img/common/bg_section03.png) no-repeat 0 500px; background-size:contain;}
#section3 .content { text-align:center; }
#section3 .tabs { display:inline-block; }
#section3 .tabs li { float:left; margin:0 25px; font-size:18px; }
#section3 .tabs li span { cursor:pointer; }
#section3 .tabs li.active span { font-weight:900; transform: skew(-0.03deg); }

#section3 .frame-device { position:relative; text-align:center; }
#section3 .frame-device .inner { width:760px; height:355px;display:inline-block; position:relative; }
#section3 .frame-device .frame.type01 { position:absolute; top:0; left:0; width:610px; height:355px; z-index:1}
#section3 .frame-device .notebook-frame { width:610px; position:absolute; top:0; left:0; z-index:2; }
#section3 .frame-device .notebook-content { width:439px; position:absolute; top:50px; left:85px; }
#section3 .frame-device .frame.type02 { position:absolute; bottom:-26px; right:102px; width:171px; height:300px; z-index:5; }
#section3 .frame-device .phone01-frame { width:200px; position:absolute;top:0; left:0; z-index:2; }
#section3 .frame-device .phone01-content { width:111px; position:absolute; top:30px; left:30px; }
#section3 .frame-device .frame.type03 { position:absolute; bottom:4px; right:9px; width:141px; height:247px; z-index:3; }
#section3 .frame-device .phone02-frame { width:200px; position:absolute;top:0; left:0; z-index:2; }
#section3 .frame-device .phone02-content { width:90px; position:absolute; top:27px; left:26px; }
#section3 .tabs li { position:relative; }
#section3 .tabs li span { position:relative; z-index:2; }
#section3 .tabs li.active:after { content:""; display:inline-block; width:50px; height:42px; background:url(../img/common/syncpos_tab_on.png) no-repeat center; position:absolute; top:-8px; left:50%; transform:translate(-50%,0); }
#section3 .descriptions li { display:none; }
#section3 .descriptions li.active { display:block; }

#section4 .content { width:1200px; margin:0 auto;}
#section4 .card-list li { float:left; width:16.66%; box-sizing:border-box; padding:40px 25px; border:1px solid #e0e0e0; border-left:0;  }
#section4 .card-list li:first-child { border-left:1px solid #e0e0e0; }
#section4 .card-list .num { font-size:20px; font-weight:bold; color:#d9d9d9; margin-right:10px; }
#section4 .card-list .tit { font-size:20px; font-weight:bold; }
#section4 .card-list .txt { font-size:12px; line-height:16px; color:#858585; }
#section4 .card-list .icon-apply-process { width: 130px; }
#section4 .buttons { text-align:center; }
#section4 .buttons button { margin:0 10px; }

#section5 .content { width:800px; margin:0 auto; text-align:center; }
#section5 .text-area .tit { font-size:45px; margin-bottom:30px; }
#section5 .buttons { display:inline-block; width:730px; /* background:url(../img/common/bg_download.png) no-repeat 160px 126px; background-size:55%; */ }
#section5 .btn-down-android { float:left; width:350px; }
#section5 .btn-down-ios { float:right; width:350px; }

.web-container article .top.page-tit { margin-top:130px;}
.eng { font-family: 'Montserrat' , sans-serif !important;}
.web-container input[type="text"] { font-size:18px; color:#2d2d2d; padding:0; }
.web-container input[type="text"]::placeholder { font-size:18px; }
.web-container input:-ms-input-placeholder { color:#ccc }

.web-container .form-wrap.tb { display:table; margin:0 auto; }
.web-container .form-wrap.tb .inner { display:table-cell; vertical-align: middle; height:100vh; }
.web-container .form-wrap .top { text-align:center; }
.web-container .form-wrap .top .tit { font-size:35px; font-weight:900; }
.web-container .form-wrap .top .sub { font-size:15px; color:#838383; font-weight:400;}

.form-wrap .form { width:1130px; padding:60px; background-color:#fff; box-shadow:0 0 15px rgba(0,0,0,0.2); box-sizing:border-box; margin-bottom:100px; }
.form-wrap.login .logo-wrap { width:260px; margin-top:30px; margin-right:70px; }
.form-wrap.login .logo { width:200px; }
.form-wrap.login .links { display:inline-block; }
.form-wrap.login .links li { display:inline-block; vertical-align:top; text-align:center; font-size:14px; line-height:1; }
.form-wrap.login .links li:nth-child(2) { padding:0 11px; border-left:1px solid #e0e0e0; border-right:1px solid #e0e0e0; margin:0 10px; }
.form-wrap.login input[type="text"] { width:400px; }
.form-wrap input[type="password"].bd-none { background-color:#fff; border-bottom:0; width:300px; font-family:'맑은 고딕', sans-serif; padding-left:0; }

.form-wrap .row { margin-bottom:40px;}
.form-wrap .form .sec-tit { font-size:25px; font-weight:900;}
.form-wrap .label { display:inline-block; width:120px; font-size:15px; font-weight:900; line-height:40px; vertical-align:top; transform:skew(-0.001deg); }
.form-wrap .label .essential { color:#f37421; margin-left:5px; }
.form-wrap .label.top { display:block; width:100%; font-size:12px; font-weight:700; text-align:left; line-height:1.2;}
.form-wrap input[type="text"] { width:340px; font-weight:400; border-bottom:1px solid #aaa;}
.form-wrap input[type="id"]:focus,
.form-wrap input[type="password"]:focus,
.form-wrap input[type="text"]:focus { color:#009dd1; border-color:#009dd1;}
.form-wrap .form .half { float:left; }
.form-wrap .form .half:first-child { margin-right:90px; }
.form-wrap .inp-full-width { width:910px; }
.form-wrap .form .half.full { margin-right:0; position:relative; }
.form-wrap .form .half .col1 { float:left; width:120px; }
.form-wrap .form .half .col2 { float:left; width:340px; }
.form-wrap .form .half .col2.full { width:890px; }
.form-wrap .form .half .col2.full .counter-wrap { position:absolute; bottom:10px; right:10px; font-size:13px; }
.form-wrap .form .half .col2.full .counter { width:30px; text-align:right; border:0; color:#2d2d2d; }
.form-wrap .inp-with-btn { position:relative; display:inline-block; }
.form-wrap .inp-with-btn .floating { position:absolute; top:4px; right:0;}
.form-wrap .time-count { color:#ccc; margin-right:10px; line-height:32px; font-weight:700; font-size:15px;}
.form-wrap .floating.certification { line-height:32px; }
.form-wrap .floating.certification span { margin-left:6px; font-size:15px; font-weight:700; }
.form-wrap .col1 .tag { position:relative; }
.form-wrap .col1 .tag:after { content:""; display:inline-block; width:23px; height:19px; background:url(../img/common/syncpos_tab_on.png) no-repeat center; position:absolute; top:10px; left:-10px; z-index:0; background-size:23px; }
.form-wrap .col1 .tag span { position: absolute; top:0; left:0; z-index:1; }
.form-wrap .col2 .text { line-height:40px; font-size:18px;}
.form-wrap .text-with-btn { position:relative; display:inline-block; }
.form-wrap .text-with-btn button.outline { position:absolute; top:4px; right:-80px; }

.form-wrap .find-wrap .fc-blue { color:#009dd1; }
.form-wrap .find-wrap { display:inline-block; width:400px; }
.form-wrap .find-wrap input { width:100%; }
.form-wrap .find-wrap button.btn-basic.is-big { width:100%; border-radius:0;}
.form-wrap .find-wrap .inp-with-btn { width:400px;}
.form-wrap .find-wrap .inp-with-btn .msg { position:absolute; top:46px; left:0; font-size:12px; }
.form-wrap textarea { font-size:16px; border:1px solid #aaa;}
.form-wrap textarea:focus { color:#222;  }

.form-wrap .reception-complete { text-align:center; padding:80px 0; }
.form-wrap .reception-complete img { width:160px; }
.form-wrap .reception-complete .txt01 { font-size:28px; margin:60px 0 20px; }
.form-wrap .reception-complete .txt02 { font-size:18px; line-height:30px; }

.web-container { background-color:#f5f5f5;}
.web-container .option-box { position:relative; }
.web-container .option-box label span { line-height:18px; }
.web-container .option-box [type="radio"] { width:18px; height:18px; background:none; border:1px solid #2D2D2D;-webkit-appearance:none;outline:0;vertical-align:middle; left:0; border-radius:50%; cursor:pointer; }
.web-container .option-box [type="checkbox"] {width:18px; height:18px; background:none; border:1px solid #2D2D2D;-webkit-appearance:none;outline:0;vertical-align:middle; left:0; border-radius:0; cursor:pointer; background-color:#fff;}
.web-container .option-box [type="radio"]:checked  {border-width:5px;border-color:#009dd1;}
.web-container .option-box [type="checkbox"]:checked {border-width:5px;border-color:#f37421;}
.web-container .option-box [type="radio"]:checked + span,
.web-container .option-box [type="checkbox"]:checked + span { color:#2d2d2d; }
.web-container .option-box [type="radio"]:disabled,
.web-container .option-box [type="checkbox"]:disabled {border-color:#e1e1e1; background:#f6f6f6;}
.option-box.service-type label { line-height:40px; }
.option-box.service-type .txt1 { font-size:18px; }
.option-box.service-type .txt2 { font-size:12px; color:#4a4a4a; margin-left:10px; }
.option-box.service-type input { top:10px; }
.btn-two { text-align:center; }
.btn-two button { margin:0 10px; }

.web-container .filebox.no-photo { width:100%; }
.web-container .filebox.no-photo { padding:0; }
.web-container .filebox.no-photo .upload-nm { width:460px; font-size:18px; height:40px; border-bottom:1px solid #aaa; }
.web-container .filebox.no-photo .upload-nm::placeholder { font-size:18px;}
.filebox.no-photo label { left:auto; right:0; }
.business-register .comment { font-size:13px; }
.business-register strong { color:#009dd1; }

#step-signup { position:fixed; top:50%; right:70px; transform:translate(0,-50%);}
#step-signup li { text-align:right; font-size:15px; font-weight:900; position:relative; padding-right:30px; margin-bottom:35px; color:#f5f5f5; transform:skew(-0.001deg);}
#step-signup li.active { color:#2d2d2d; }
#step-signup li:after { display:inline-block; content:""; width:20px; height:20px; border-radius:50%; background-color:#ccc; position:absolute; top:0; right:0; border:6px solid #f5f5f5; box-sizing:border-box; }
#step-signup li.active:after { border-color:#2d2d2d; background-color:#fff;}
#step-signup .dots { position:absolute; top:30px; right:9px; }
#step-signup .dots span { display:block; width:2px; height:2px; border-radius:50%; background-color:#ccc; margin-bottom:5px; }

.web-container .dash-divider { height:1px; border-bottom:1px dashed #ddd; margin:70px 0;}

.bpopup-wrap { padding:60px 80px; background-color:#fff; box-shadow:0 0 10px rgba(0,0,0,0.2);}
.bpopup-wrap h2 { font-size:22px; font-weight:900; text-align:center; margin-bottom:50px; }

.input-login-wrap { position:relative; width:400px; height:40px; }
.input-id, .input-pw { width:400px; height:40px; appearance:none;  border:0; font-size:18px; font-weight:400; font-family:'맑은 고딕', sans-serif; line-height:40px; outline-width:0; padding:0;  border-bottom:1px solid #ddd; position:absolute; top:0; left:0; z-index:2; background-color:transparent; }
.input-login-wrap .ph { position:absolute; top:10px; left:0; z-index:1; font-size:18px; color:#ccc; }
.input-login-wrap .msg { font-size:12px; color:#009DD1; position:absolute; top:46px; left:0;  }

.bpopup-wrap.change-password .label { display:block; }
.bpopup-wrap.change-password .nm { display:inline-block; width:130px; font-size:15px; line-height:40px;}

@media (max-width:1780px) {
	#intro-web .header .logo { left:20px; }
	#intro-web .header .sign { right:20px; }
  #intro-web .inner-wrap { width:100%; padding:0 26px; }
	#intro-web .side-icons { left:10px; }
	#section0 .text-area { margin-right:220px; }
	#step-signup { right:10px;}
}

/* ================================================
  소개페이지 - 모바일
=================================================== */
#intro-mobile img { vertical-align:top; }
#intro-mobile .fc-blue { color:#009DD1; }
#intro-mobile .inner-wrap { padding:0 20px;}

#intro-mobile header { position:fixed; top:0; left:0; width:100%; height:50px; z-index:10; background-color:#fff; }
#intro-mobile header .hb-menu { padding:14px 10px; position:absolute; top:0; right:10px; }
#intro-mobile header .hb-menu img { width:24px; }
#intro-mobile .main-header .logo { width:135px; position:absolute; top:18px; left:20px; }
#intro-mobile .main-wrap .sec1 { height:100vh; background:url(../img/common/bg_main_sec01.jpg) no-repeat center; background-size:cover; }
#intro-mobile .btn-basic.is-medium { line-height:40px; font-size:1.4rem; padding:0 15px; font-weight:700; }
#intro-mobile .btn-basic.black { background-color:#2d2d2d; color:#fff;  }
#intro-mobile .btn-basic.orange { background-color:#FF872B; color:#fff;  }
#intro-mobile .btn-basic.round { border-radius:5px; }

#intro-mobile .text-wrap { text-align:center; }
#intro-mobile .text-wrap .tit { font-size:3rem; font-weight:900; line-height:4.3rem;}
#intro-mobile .text-wrap .tit .fw-l { font-weight:100; }
#intro-mobile .text-wrap .sub-tit { font-size:1.5rem; font-weight:700;}
#intro-mobile .text-wrap .desc { font-size:1.4rem; line-height:2.2rem; color:#858585;}

#intro-mobile .sec1 .text-wrap { position:absolute; top:60%; right:20px; transform:translate(0,-50%); text-align:right; }
#intro-mobile .sec1 .tit { font-size:3.5rem; color:#fff; font-weight:400; margin-bottom:3.5rem; }
#intro-mobile .sec1 .tit strong { font-weight:900; }
#intro-mobile .sec1 .sub-tit { font-size:2rem; color:#fff; font-weight:900; margin-bottom:1.8rem;}
#intro-mobile .sec1 .desc { font-size:1.2rem; color:#fff; margin-bottom:7rem; }
#intro-mobile .sec1 .btn-mylesson-download { width:196px; }

#intro-mobile .sld-wrap { position:relative; text-align:center; padding-bottom:140px; }
#intro-mobile .sld-wrap .btn-prev { position:absolute; top:50%; left:10px; transform:translate(0,-50%); padding:10px;}
#intro-mobile .sld-wrap .btn-next { position:absolute; top:50%; right:10px; transform:translate(0,-50%); padding:10px;}
#intro-mobile .sld-wrap .btn-prev img ,
#intro-mobile .sld-wrap .btn-next img { width:15px; }
#intro-mobile .sld-wrap .tit { font-size:1.8rem; font-weight:900; margin-bottom:8px; }
#intro-mobile .sld-wrap .desc { font-size:1.2rem; color:#858585; line-height:1.8rem; }

#intro-mobile .sec2 { padding-top:100px; background-color:#F7F7F7}
#intro-mobile .sec2 .sld-wrap .btn-prev,
#intro-mobile .sec2 .sld-wrap .btn-next { top:35%; }

.sld-main-function .sld-img { width:80%; display:inline-block; }
.sld-syncpos .sld-img { width:100%; display:inline-block; }

#intro-mobile .sec3 { padding-top:80px; position:relative;}
#intro-mobile .sec3 .bg1 { position:absolute; top:0; left:0; width:212px; z-index:-1;}
#intro-mobile .sec3 .bg2 { width:100%; }

#intro-mobile .sec4 { padding-top:100px; background-color:#f7f7f7; }
#intro-mobile .sec4 .sld-wrap .btn-prev,
#intro-mobile .sec4 .sld-wrap .btn-next { top:26%;}

#intro-mobile .sec5 { padding-top:86px; }
#intro-mobile .sec6 { padding-top:80px; padding-bottom:208px; background-color:#F7F7F7; }
#intro-mobile .sec6 .desc { font-size:1.2rem; line-height:1.8rem; color:#858585; }

#intro-mobile footer { padding:30px 0; background-color:#F7F7F7; border-top:1px solid #e0e0e0; }
#intro-mobile footer .logo { width:34%;}
#intro-mobile footer .info { font-size:1.2rem; line-height:1.8rem; color:#aaa;}

.step-register li { width:50%; float:left; box-sizing:border-box; padding:20px 16px; border-right:1px solid #E7E7E7; border-bottom:1px solid #e7e7e7;}
.step-register li:nth-child(1),
.step-register li:nth-child(2) { border-top:1px solid #e7e7e7;}
.step-register li:nth-child(odd) { border-left:1px solid #e7e7e7;}
.step-register h3 { font-size:1.6rem; }
.step-register h3 .num { color:#D9D9D9; font-weight:900; margin-right:10px;}
.step-register .desc { font-size:1rem; line-height:1.5rem; color:#858585;}
.step-register .step-icon { width:50%; }

.side-drawer { position:fixed; top:0; right:0; z-index:200; width:70%; height:100vh; transition:all .3s ease; margin-right:-70%; background-color:#fff;}
.dim { position:fixed; top:0; left:0; width:100%; height:100vh; background-color:rgba(0,0,0,0.7); z-index:-1; opacity:0; }
.side-drawer.active { margin-right:0; transition:all .3s ease; }
.dim.active { opacity:1; z-index:100; transition:all .3s ease; }
.side-drawer .top { padding:16px 20px 14px; position:relative; border-bottom:1px solid #f0f0f0; }
.side-drawer .top .user-img { display:inline-block; width:40px; height:40px; border-radius:50%; background:url(../img/common/user_pf.png) no-repeat center; vertical-align: middle; margin-right:15px; background-size:cover; }
.side-drawer .top .user-nm { display:inline-block; vertical-align: middle; font-size:1.1rem; }
.side-drawer .top .user-nm strong { font-size:1.5rem; font-weight:900;  }
.side-drawer .top .msg { font-size:1.1rem; display:inline-block; vertical-align:middle; }
.side-drawer .top .btn-mypage { display:inline-block; padding:12px; position:absolute;top:8px; right:5px; }
.side-drawer .top .btn-mypage img { width:24px; }
.side-drawer .summary { padding:20px; background-color:#F7F7F7; }
.side-drawer .summary .label { font-size:1rem; }
.side-drawer .summary .text { font-size:1.2rem; }
.side-drawer nav li { border-bottom:1px solid #F0F0F0; }
.side-drawer nav li a { display:block; padding:0 20px; font-size:1.3rem; line-height:4.4rem; }
.side-drawer .btn-foot { width:100%; height:50px; line-height:50px; text-align:center; background-color:#2D2D2D; position:absolute; bottom:0; right:0; font-size:1.4rem; font-weight:700; }

#intro-mobile header .btn-back { position:absolute; top:0; left:0; padding:13px 16px; }
#intro-mobile header .btn-back img { width:24px; }
#intro-mobile header .page-nm { text-align:center; font-size:1.5rem; font-weight:900; line-height:50px;}
#intro-mobile .inp-wrp { position:relative; }
#intro-mobile .inp-wrp label { display:inline-block; font-weight:900; position:relative; font-size:1rem; }
#intro-mobile .inp-wrp label .essential { width:4px; height:4px; border-radius:50%; background-color:#FF872B;  position:absolute; top:1px; right:-6px;}
#intro-mobile .inp-wrp .msg { font-size:1.3rem; color:#009DD1; margin-top:5px; }
#intro-mobile .option-box label { font-size:1.3rem; padding-left:25px; }
#intro-mobile .btm-fixed { /* position:fixed; left:0; bottom:0; */  width:100%; z-index:10;  }
#intro-mobile .btm-fixed button { width:100%; font-size:1.4rem; text-align:center; line-height:5.4rem; font-weight:700; }
#intro-mobile .btm-fixed button.black { background-color: #2D2D2D; color:#fff;}
#intro-mobile .btm-fixed button.orange { background-color: #FF872B; color:#fff;}
#intro-mobile .btm-fixed button.gray { background-color: #e7e7e7; color:#2d2d2d;}
#intro-mobile .btm-fixed .half:nth-child(1) { width:50%; float:left;}
#intro-mobile .btm-fixed .half:nth-child(2) { width:50%; float:right;}
#intro-mobile .option-box [type="checkbox"] + label { background-image:url(../img/btn/btn_checkboxes_mobile.png); line-height:1.8rem; }
#intro-mobile .inp-wrp input { width:100%; padding:0; font-size:1.6rem;}
#intro-mobile .inp-wrp input::placeholder { font-size:1.6rem; }
#intro-mobile .inp-wrp input:focus { color:#009DD1; border-bottom:1px solid #009DD1;  }
#intro-mobile .inp-wrp .btn-text { position:absolute; bottom:10px; right:0; font-weight:900; }
#intro-mobile .inp-wrp .icon-check { position:absolute; bottom:10px; right:0; }
#intro-mobile .inp-wrp .icon-fileclip { width:21px; height:20px; position:absolute; bottom:10px; right:0; }
#intro-mobile .inp-wrp .zipcode { position:absolute; top:24px; right:0; height:20px; font-weight:900; }
#intro-mobile .info-wrap { background-color:#F7F7F7; padding:30px 0;}
#intro-mobile .info-wrap label { width:20%; float:left; line-height:4rem; font-size:1rem; font-weight:900;}
#intro-mobile .info-wrap .col { width:80%; float:left; position:relative; }
#intro-mobile .info-wrap .col .txt { font-size:1.6rem; line-height:4rem;}
#intro-mobile .info-wrap .col input { width:100%; padding:0; font-size:1.6rem;}
#intro-mobile .textarea-wrap { position:relative; }
#intro-mobile .counter-wrap { position:absolute; top:-25px; right:0;font-size:1rem; }
#intro-mobile .counter-wrap input { width:40px; display:inline-block; text-align:right; font-size:1rem; }

/* slick dots */
#intro-mobile .sld-wrap .slick-dots li { margin:0 4px;}
#intro-mobile .sld-wrap .slick-dots li button { width:10px; height:10px; }
#intro-mobile .sld-wrap .slick-dots li button:before { background-color:#e0e0e0; border:0;}
#intro-mobile .sld-wrap .slick-dots li.slick-active button:before { background-color:#FF872B;  }

.login-wrap { padding-top:218px; }
.login-wrap .logo { width:84px; }
.login-wrap .caption { font-size:1.3rem; color:#858585; line-height:2.1rem; }
.login-wrap [type="id"],
.login-wrap [type="password"] { height: 40px; padding: 0 10px; border: 1px solid #EDEDED; border-width: 0 0 1px; color: #2D2D2D; font-size: 1.8rem; font-weight: 100; box-sizing: border-box; outline: 0;}
[type="password"] { font-family:'맑은 고딕' }

.login-wrap .find-account li { display:inline-block; padding:0 10px; border-left:1px solid #E0E0E0; line-height:1.3rem; }
.login-wrap .find-account li:first-child { border-left:0; }
.login-wrap .find-account li a { display:inline-block; font-size:1.3rem;  }

.join-wrap { padding:80px 0; }
.join-wrap ul { text-align:center; margin-bottom:24px; }
.join-wrap li { display:inline-block; width:20px; height:20px; border-radius:50%; box-sizing:border-box;  border:1px solid #858585; color:#858585; text-align:center; line-height:2rem; font-size:1rem; margin:0 10px; position:relative; vertical-align: top; background-color:#fff; }
.join-wrap li.active { background-color:#2d2d2d; color:#fff; border-color:#2d2d2d;}
.join-wrap li:after { content:""; display:block; width:20px; height:1px; background-color:#858585; position:absolute; top:9px; right:20px;}
.join-wrap li:first-child:after { display:none; }
.join-wrap .sec-tit { font-size:1.6rem; font-weight:900;}
.join-wrap .reception-complete { text-align:center; }
.join-wrap .reception-complete img { width:124px; }
.join-wrap .reception-complete .txt01 { font-size:2.4rem; margin:30px 0; }
.join-wrap .reception-complete .txt02 { font-size:1.5rem; }

.tb-info table { table-layout: fixed; width:100%;}
.tb-info tbody tr th { text-align:left; font-size:1rem; font-weight:900; line-height:5rem; }
.tb-info tbody tr td { text-align:left; font-size:1.6rem; line-height:1.6; }
.tb-info tbody tr td.url { font-size:1.4rem; }
.tb-info tbody tr.point th { position:relative; height:50px;}
.tb-info tbody tr.point th span { position:absolute; top:0; left:0; z-index:2; line-height:5rem; }
.tb-info tbody tr.point th:after { content:""; display:inline-block; width:17px; height:14px; background:url(../img/common/syncpos_tab_on.png) no-repeat center; background-size:17px; position:absolute; top:18px; left:-6px; z-index:1; }
.tb-info tbody tr.multi-line th { position:relative; }
.tb-info tbody tr.multi-line th span { position:absolute; top:0; left:0; display:inline-block; line-height:5rem; }
.tb-info tbody tr.multi-line td { padding-top:12px; }
.tb-info.bg-gray input { background-color:transparent;}


.mypage-wrap .top { position:relative; }
.mypage-wrap .top .tit { font-size:2.5rem; }
.mypage-wrap .top .caption { font-size:1.2rem; color:#858585; }
.mypage-wrap .top button { padding:0 12px; font-size:1rem; line-height:2.4rem; color:#fff; background-color:#009DD1; position:absolute; top:38px; right:0; font-weight:700; }
.mypage-wrap .top button:after { content:""; display:inline-block; border:10px solid transparent; border-right:10px solid #fff; position:absolute; bottom:-10px; right:0;}

.fab { padding:14px; border-radius:50%; background-color:#009DD1; box-shadow:0 0 10px rgba(0,0,0,0.2); position:fixed; bottom:70px; right:20px; z-index:110; }
.fab .btn-plus { width:22px; transition:all .2s ease;}
.fab .btn-plus.active { transform:rotate(45deg); transition:all .2s ease;}

.fab .menu { position:absolute; bottom:50px; right:0; width:300px; padding-right:6px; overflow:hidden; height:0; transition:all .2s ease;}
.fab .menu.active { height:270px; transition:all .2s ease; }
.fab .menu li { text-align:right; margin-bottom:16px; }
.fab .menu li a { display:inline-block; }
.fab .menu li span { display:inline-block; vertical-align: middle; margin-right:20px; color:#fff; font-size:1.6rem; margin-top:6px;}
.fab .menu li img { width:38px; vertical-align: middle; }

.accept-terms .form {  width:1200px; padding:0; }
.accept-terms .form .description { width:100%; padding:30px 70px; vertical-align:top; font-size:13px; line-height:25px; height:360px; overflow-y:auto; box-sizing:border-box;}
#intro-mobile .policy-wrap .description { width:100%; padding:20px; vertical-align:top; font-size:1.2rem;; line-height:1.8rem; height:200px; overflow-y:auto; box-sizing:border-box; color:#858585; border:1px solid #ededed;}

#intro-mobile .option-box [type="radio"] { width: 18px; height: 18px; background: none; border: 1px solid #2D2D2D; -webkit-appearance: none; outline: 0; vertical-align: middle; left: 0; border-radius: 50%; cursor: pointer; top:3px;}
#intro-mobile .option-box [type="radio"]:checked { border-width: 5px; border-color: #009DD1; }
#intro-mobile .option-box label span { font-weight:400; font-size:1.6rem; }

.btn-top { display:none; width:65px; position:fixed; right:14px; bottom:30px; z-index:10;}

@media (max-width:700px){
  .error-page { background-color:#fff; }
  .error-page .inner { width:100% !important; }
  .error-page .inner .form { padding:0 }
  .error-page .inner .form img { width:100% !important;}
  .error-page .form-wrap .form { width:100%; background-color:#fff; box-shadow:none;}
  .error-page .btn-two { margin-top:40px !important; padding:0 15px;}
  .error-page .btn-two button { width:100% !important; margin:0; margin-bottom:15px; }
}

@media (max-width:360px) {
  .step-register h3 { height:44px; }
  .step-register .step-icon { width:53px; }
  #intro-mobile .btn-basic.is-medium { font-size:1.3rem; }
}