@charset "UTF-8";
/* bourbon framework */
/*
@import 'vendors/bourbon/_jquery.mobile-1.4.2.min';
*/
.width-1 { width: 1%; }

.width-2 { width: 2%; }

.width-3 { width: 3%; }

.width-4 { width: 4%; }

.width-5 { width: 5%; }

.width-6 { width: 6%; }

.width-7 { width: 7%; }

.width-8 { width: 8%; }

.width-9 { width: 9%; }

.width-10 { width: 10%; }

.width-11 { width: 11%; }

.width-12 { width: 12%; }

.width-13 { width: 13%; }

.width-14 { width: 14%; }

.width-15 { width: 15%; }

.width-16 { width: 16%; }

.width-17 { width: 17%; }

.width-18 { width: 18%; }

.width-19 { width: 19%; }

.width-20 { width: 20%; }

.width-21 { width: 21%; }

.width-22 { width: 22%; }

.width-23 { width: 23%; }

.width-24 { width: 24%; }

.width-25 { width: 25%; }

.width-26 { width: 26%; }

.width-27 { width: 27%; }

.width-28 { width: 28%; }

.width-29 { width: 29%; }

.width-30 { width: 30%; }

.width-31 { width: 31%; }

.width-32 { width: 32%; }

.width-33 { width: 33%; }

.width-34 { width: 34%; }

.width-35 { width: 35%; }

.width-36 { width: 36%; }

.width-37 { width: 37%; }

.width-38 { width: 38%; }

.width-39 { width: 39%; }

.width-40 { width: 40%; }

.width-41 { width: 41%; }

.width-42 { width: 42%; }

.width-43 { width: 43%; }

.width-44 { width: 44%; }

.width-45 { width: 45%; }

.width-46 { width: 46%; }

.width-47 { width: 47%; }

.width-48 { width: 48%; }

.width-49 { width: 49%; }

.width-50 { width: 50%; }

.width-51 { width: 51%; }

.width-52 { width: 52%; }

.width-53 { width: 53%; }

.width-54 { width: 54%; }

.width-55 { width: 55%; }

.width-56 { width: 56%; }

.width-57 { width: 57%; }

.width-58 { width: 58%; }

.width-59 { width: 59%; }

.width-60 { width: 60%; }

.width-61 { width: 61%; }

.width-62 { width: 62%; }

.width-63 { width: 63%; }

.width-64 { width: 64%; }

.width-65 { width: 65%; }

.width-66 { width: 66%; }

.width-67 { width: 67%; }

.width-68 { width: 68%; }

.width-69 { width: 69%; }

.width-70 { width: 70%; }

.width-71 { width: 71%; }

.width-72 { width: 72%; }

.width-73 { width: 73%; }

.width-74 { width: 74%; }

.width-75 { width: 75%; }

.width-76 { width: 76%; }

.width-77 { width: 77%; }

.width-78 { width: 78%; }

.width-79 { width: 79%; }

.width-80 { width: 80%; }

.width-81 { width: 81%; }

.width-82 { width: 82%; }

.width-83 { width: 83%; }

.width-84 { width: 84%; }

.width-85 { width: 85%; }

.width-86 { width: 86%; }

.width-87 { width: 87%; }

.width-88 { width: 88%; }

.width-89 { width: 89%; }

.width-90 { width: 90%; }

.width-91 { width: 91%; }

.width-92 { width: 92%; }

.width-93 { width: 93%; }

.width-94 { width: 94%; }

.width-95 { width: 95%; }

.width-96 { width: 96%; }

.width-97 { width: 97%; }

.width-98 { width: 98%; }

.width-99 { width: 99%; }

.width-100 { width: 100%; }

@font-face { font-family: 'Noto Sans KR'; font-style: normal; font-weight: 100; src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff2) format("woff2"), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff) format("woff"), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.otf) format("opentype"); }
@font-face { font-family: 'Noto Sans KR'; font-style: normal; font-weight: 300; src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff2) format("woff2"), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff) format("woff"), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.otf) format("opentype"); }
@font-face { font-family: 'Noto Sans KR'; font-style: normal; font-weight: 400; src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff2) format("woff2"), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff) format("woff"), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.otf) format("opentype"); }
@font-face { font-family: 'Noto Sans KR'; font-style: normal; font-weight: 500; src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff2) format("woff2"), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff) format("woff"), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.otf) format("opentype"); }
@font-face { font-family: 'Noto Sans KR'; font-style: normal; font-weight: 700; src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff2) format("woff2"), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff) format("woff"), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.otf) format("opentype"); }
@font-face { font-family: 'Noto Sans KR'; font-style: normal; font-weight: 900; src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.woff2) format("woff2"), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.woff) format("woff"), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.otf) format("opentype"); }
@font-face { font-family: 'din'; font-style: normal; font-weight: 500; src: url(/asset/fonts/DINRegular.eot); src: url(/asset/fonts/DINRegular.eot?#iefix) format("embedded-opentype"), url(/asset/fonts/DINRegular.woff) format("woff"), url(/asset/fonts/DINRegular.ttf) format("truetype"); }
html { color: #2b323f; background: #FFF; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; text-size-adjust: none; }
html *, html *::before, html *::after { -webkit-box-sizing: inherit; -moz-box-sizing: inherit; box-sizing: inherit; }

html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, menu, nav, section, time, mark, audio, video, details, summary, input, button { margin: 0; padding: 0; }

table { border-collapse: collapse; border-spacing: 0; }

fieldset, img { border: 0; }

address, caption, cite, code, dfn, em, th, var, strong { font-style: normal; }

strong { font-weight: 600; }

ol, ul, li { list-style: none; }

caption, th { text-align: left; }

h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: 300; }

q:before, q:after { content: ''; }

abbr, acronym { border: 0; font-variant: normal; }

sup { vertical-align: text-top; }

sub { vertical-align: text-bottom; }

input, textarea, select { font-family: inherit; font-size: inherit; font-weight: inherit; -webkit-appearance: none; -webkit-border-radius: 0; }

input, textarea, select { *font-size: 100%; }

legend { color: #000; }

img { display: inline-block; }

button { outline: 0; border: none; cursor: pointer; background: none; padding: 0; margin: 0; }

img { max-width: 100%; }

section, article, aside, footer, header, nav { display: block; }

.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0; }

.center { text-align: center !important; }

.left { text-align: left !important; }

.right { text-align: right !important; }

.fl { float: left; }

.fr { float: right; }

.block { display: block !important; }

.inline { display: inline-block !important; }

html { width: 100%; position: relative; word-break: keep-all; }

body, input, textarea, select, button { font-size: 12px; font-weight: 400; color: #333; line-height: 1.4; padding: 0; margin: 0; font-family: "Noto Sans KR","Segoe UI","Helvetica Neue","Arial", sans-serif; border: none; outline: none; font-size-adjust: none; -webkit-text-size-adjust: 100%; -moz-text-size-adjust: 100%; -ms-text-size-adjust: 100%; letter-spacing: -1px; }

a { text-decoration: none; color: #898989; }

img { width: 100%; }

.photo { margin: 0 auto; overflow: hidden; display: inline-block; position: relative; }
.photo:before { content: ""; display: block; position: absolute; top: -1px; left: -1px; right: -1px; bottom: -1px; background: no-repeat; background-size: 100% !important; }
.photo img { width: 100%; height: 100%; }
.profile-info .photo { width: 82px; height: 82px; }
.profile-info .photo:before { background-image: url("/asset/images/layout/profile-photo.png"); }
.photo.ms:before { background-image: url("/asset/images/common/photo-box2.png") !important; }
.info-item .photo, .family-list li .photo { width: 55px; height: 55px; border-radius: 27px; }
.info-item.user .photo, .family-list li.user .photo { width: 70px; height: 70px; border-radius: 35px; }
.info-item.master .photo, .family-list li.master .photo { width: 70px; height: 70px; border-radius: 35px; border: none; }
.info-item.master .photo:before, .family-list li.master .photo:before { background-image: url("/asset/images/common/photo-box2.png"); }

.t-btn { display: inline-block; text-align: center; overflow: hidden; padding: 0; margin: 0; border: none; vertical-align: top; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; /* font metrics */ --fm-emSquare: 1; --fm-capitalHeight: 0.68; --fm-descender: 0.54; --fm-ascender: 1.1; --fm-linegap: 0; /* compute needed values */ --lineheightNormal: (var(--fm-ascender) + var(--fm-descender) + var(--fm-linegap)); --distanceBottom: (var(--fm-descender)); --distanceTop: (var(--fm-ascender) - var(--fm-capitalHeight)); --contentArea: (var(--lineheightNormal) * var(--computedFontSize)); --valign: ((var(--distanceBottom) - var(--distanceTop)) * var(--computedFontSize)); --computedFontSize: (var(--capital-height) / var(--fm-capitalHeight)); --computedLineheight: ((var(--line-height) * var(--capital-height)) - var(--valign)); }
.t-btn.ty1, .t-btn.ty8 { font-size: 10px; border-radius: 2em; height: 18px; min-width: 56px; color: #333; border: 1px solid #ddd; background: #fff; --capital-height: 18; --line-height: 1; line-height: calc(var(--computedLineheight) * 1px); }
.btn-row-logout .t-btn.ty1, .fix-btns .t-btn.ty1, .btn-row-logout .t-btn.ty8, .fix-btns .t-btn.ty8 { font-size: 17px; height: 35px; --capital-height: 35; --line-height: 1; line-height: calc(var(--computedLineheight) * 1px); }
.btn-row-logout .t-btn.ty1, .btn-row-logout .t-btn.ty8 { display: block; }
.fix-btns.col2 .t-btn.ty1, .fix-btns.col2 .t-btn.ty8 { min-width: 145px; }
.fix-btns .t-btn.ty1, .fix-btns .t-btn.ty8 { padding: 0 24px; font-weight: 500; min-width: 170px; }
.fix-btns .t-btn.ty1 + .t-btn, .fix-btns .t-btn.ty8 + .t-btn { margin-left: 5px; }
.fix-btns .t-btn.ty1:disabled, .fix-btns .t-btn.ty8:disabled { color: #ccc; }
.fix-btns .t-btn.ty1:active, .fix-btns .t-btn.ty8:active { color: #fff; background: #0e86b6; border-color: #006f9b; }
.fix-btns .t-btn.ty1 { color: #0e86b6; }
.fix-btns .t-btn.ty8 { color: #333; }
.t-btn.ty2, .t-btn.ty3, .t-btn.ty4, .t-btn.ty5 { font-size: 12.67px; border: 1px solid; height: 27px; border-radius: 20px; padding: 0 18px; --capital-height: 27; --line-height: 1.1; line-height: calc(var(--computedLineheight) * 1px); }
.t-btn.ty2 { border-color: #ffffff; color: #fff; padding: 0 24px; background: transparent; }
.t-btn.ty2:active { background: #fff; color: #333; }
.disable .t-btn.ty2, .edit .t-btn.ty2 { border-color: #94a4aa; color: #333; }
.disable .t-btn.ty2:active, .edit .t-btn.ty2:active { background: #0e86b6; border-color: #0e86b6; color: #fff; }
.t-btn.ty3 { border-color: #dbdbdb; color: #333; background: #fff; }
.t-btn.ty4 { border-color: #94a4aa; color: #333; background: #fff; }
.t-btn.ty4:active { border-color: #0e86b6; color: #fff; background: #0e86b6; }
.t-btn.ty5 { border-color: #f64242 !important; color: #f64242 !important; background: #fff; }
.t-btn.ty6, .t-btn.ty7 { background: #fff; border-radius: 20px; font-size: 12.67px; text-align: center; }
.t-btn.ty6 { border: 1px solid #bbb; color: #333; height: 30px; --capital-height: 30; --line-height: 1; line-height: calc(var(--computedLineheight) * 1px); }
.t-btn.ty7 { border: 1px solid #f64242; color: #f64242; height: 22px; --capital-height: 22; --line-height: 1; line-height: calc(var(--computedLineheight) * 1px); }
.t-btn.ty7:disabled { border-color: #bbb !important; }

.i-btn { display: inline-block; overflow: hidden; white-space: nowrap; text-indent: -1000px; border: none; }
.i-btn.sch { width: 45px; height: 30px; border-radius: 0 15px 15px 0; background: #0e86b6 url("/asset/images/ico/search.png") 48% 50% no-repeat; background-size: 20px; }
.i-btn.plus { width: 70px; height: 70px; background: transparent url("/asset/images/ico/bt-plus.png"); background-size: 70px auto; }
.i-btn.plus:active { background-position: 0 -100px; }
.i-btn.voice { width: 14px; height: 18px; background: url("/asset/images/ico/voice.png"); background-size: cover; }

.ico { display: inline-block; text-indent: -1000px; overflow: hidden; white-space: nowrap; background-repeat: no-repeat !important; background-size: 100% !important; }
.ico.m-home { width: 26px; height: 13px; background: url("/asset/images/ico/layout-menu-home-off.png"); }
.active .ico.m-home { background-image: url("/asset/images/ico/layout-menu-home.png"); }
.ico.m-all { width: 20px; height: 20px; background: url("/asset/images/ico/layout-menu-all.png"); }
.ico.tm { width: 14px; height: 14px; background: url("/asset/images/ico/toggle-menu.png"); background-size: 34px auto !important; }
.ico.tm.pw { background-position: 0 0; }
.ico.tm.family { background-position: 0 -20px; }
.ico.tm.control { background-position: 0 -40px; }
.ico.tm.alarm { background-position: 0 -60px; }
.ico.tm.reset { background-position: 0 -80px; }
.ico.tm.version { background-position: 0 -100px; }
.ico.tm.voice { background-position: 0 -120px; }
.ico.tm.terms { background-position: 0 -160px; }
.act > * > .ico.tm { background-position-x: -20px; }
.ico.t-close { width: 10px; height: 10px; background: url("/asset/images/ico/toggle-men-close.png"); }
.ico.p-close { width: 15px; height: 15px; background: url("/asset/images/ico/close.png"); }
.ico.close { width: 15px; height: 15px; background: url("/asset/images/ico/close2.png"); }
.ico.refresh { width: 20px; height: 20px; background: url("/asset/images/ico/refresh.png"); }
.ico.go { width: 20px; height: 20px; background: url("/asset/images/ico/go.png"); }
.ico.order { width: 13px; height: 13px; background: url("/asset/images/ico/control.png"); }
.ico.del { width: 14px; height: 18px; background: url("/asset/images/ico/del.png"); }
.ico.s-pos { width: 40px; height: 40px; background: url("/asset/images/ico/smart-position.png"); }
.ico.s-air { width: 40px; height: 40px; background: url("/asset/images/ico/smart-air.png"); }
.ico.s-tem { width: 40px; height: 40px; background: url("/asset/images/ico/smart-tem.png"); }
.ico.s-time { width: 40px; height: 40px; background: url("/asset/images/ico/smart-time.png"); }
.ico.card-h-ty1 { width: 12px; height: 18px; background: url("/asset/images/ico/card-h-pos.png"); }
.ico.card-h-ty2 { width: 15px; height: 18px; background: url("/asset/images/ico/card-h-home.png"); }
.ico.card-h-ty3 { width: 16px; height: 18px; background: url("/asset/images/ico/card-h-sm.png"); }
.ico.camera { width: 28px; height: 28px; background: url("/asset/images/ico/camera.png"); }
.ico.delete { width: 16px; height: 16px; background: url("/asset/images/ico/delete.png"); background-position: 0 -20px; background-size: 16px auto !important; }
.ico.delete.ty2 { background-position: 0 0; }
:disabled .ico.delete { background-position: 0 0; }
.ico.blet { width: 10px; height: 10px; background: url("/asset/images/ico/bt-blet.png"); background-size: 10px auto !important; }
button:active .ico.blet { background-position: 0 -10px; }
.disable .ico.blet, .edit .ico.blet { background-position: 0 -10px; }
.disable button:active .ico.blet, .edit button:active .ico.blet { background-position: 0 0; }
.ico.mic { width: 20px; height: 20px; background: url("/asset/images/ico/mic.png"); }
.ico.help { width: 20px; height: 20px; background: url("/asset/images/ico/help.png"); }
.ico.t-info { width: 20px; height: 20px; background: url("/asset/images/ico/smart-top-info.png"); background-size: 80px auto !important; }
.ico.t-info.i1 { background-position: 0 0; }
.ico.t-info.i2 { background-position: 0 -20px; }
.ico.t-info.i3 { background-position: 0 -40px; }
.ico.t-info.i4 { background-position: 0 -60px; }
.ico.t-info.i5 { background-position: 0 -80px; }
.disable .ico.t-info { background-position-x: -20px; }
.edit .ico.t-info { background-position-x: -40px; }
.edit .ico.t-info.i1 { background-position-x: -60px; }
.ico.t-mode { width: 70px; height: 70px; background: url("/asset/images/ico/time-ico-w.png"); background-size: 280px auto !important; }
.ico.t-mode.t1 { background-position-x: 0px; background-position-y: 0; }
.ico.t-mode.t2 { background-position-x: -70px; background-position-y: 0; }
.ico.t-mode.t3 { background-position-x: -140px; background-position-y: 0; }
.ico.t-mode.t4 { background-position-x: -210px; background-position-y: 0; }
.ico.t-mode.t5 { background-position-x: 0px; background-position-y: -70px; }
.ico.t-mode.t6 { background-position-x: -70px; background-position-y: -70px; }
.ico.t-mode.t7 { background-position-x: -140px; background-position-y: -70px; }
.ico.t-mode.t8 { background-position-x: -210px; background-position-y: -70px; }
.ico.t-mode.t9 { background-position-x: 0px; background-position-y: -140px; }
.ico.t-mode.t10 { background-position-x: -70px; background-position-y: -140px; }
.ico.t-mode.t11 { background-position-x: -140px; background-position-y: -140px; }
.ico.t-mode.t12 { background-position-x: -210px; background-position-y: -140px; }
.ico.t-mode.t13 { background-position-x: 0px; background-position-y: -210px; }
.ico.t-mode.t14 { background-position-x: -70px; background-position-y: -210px; }
.ico.t-mode.t15 { background-position-x: -140px; background-position-y: -210px; }
.ico.t-mode.t16 { background-position-x: -210px; background-position-y: -210px; }
.ico.t-mode.t17 { background-position-x: 0px; background-position-y: -280px; }
.ico.t-mode.t18 { background-position-x: -70px; background-position-y: -280px; }
.ico.t-mode.t19 { background-position-x: -140px; background-position-y: -280px; }
.ico.t-mode.t20 { background-position-x: -210px; background-position-y: -280px; }
.ico.t-mode.t21 { background-position-x: 0px; background-position-y: -350px; }
.ico.t-mode.t22 { background-position-x: -70px; background-position-y: -350px; }
.ico.t-mode.t23 { background-position-x: -140px; background-position-y: -350px; }
.ico.t-mode.t24 { background-position-x: -210px; background-position-y: -350px; }
.chk-list .ico.t-mode { width: 64px; height: 64px; background: url("/asset/images/ico/time-ico-w.png"); background-size: 256px auto !important; }
.chk-list .ico.t-mode.t1 { background-position-x: 0px; background-position-y: 0; }
.chk-list .ico.t-mode.t2 { background-position-x: -64px; background-position-y: 0; }
.chk-list .ico.t-mode.t3 { background-position-x: -128px; background-position-y: 0; }
.chk-list .ico.t-mode.t4 { background-position-x: -192px; background-position-y: 0; }
.chk-list .ico.t-mode.t5 { background-position-x: 0px; background-position-y: -64px; }
.chk-list .ico.t-mode.t6 { background-position-x: -64px; background-position-y: -64px; }
.chk-list .ico.t-mode.t7 { background-position-x: -128px; background-position-y: -64px; }
.chk-list .ico.t-mode.t8 { background-position-x: -192px; background-position-y: -64px; }
.chk-list .ico.t-mode.t9 { background-position-x: 0px; background-position-y: -128px; }
.chk-list .ico.t-mode.t10 { background-position-x: -64px; background-position-y: -128px; }
.chk-list .ico.t-mode.t11 { background-position-x: -128px; background-position-y: -128px; }
.chk-list .ico.t-mode.t12 { background-position-x: -192px; background-position-y: -128px; }
.chk-list .ico.t-mode.t13 { background-position-x: 0px; background-position-y: -192px; }
.chk-list .ico.t-mode.t14 { background-position-x: -64px; background-position-y: -192px; }
.chk-list .ico.t-mode.t15 { background-position-x: -128px; background-position-y: -192px; }
.chk-list .ico.t-mode.t16 { background-position-x: -192px; background-position-y: -192px; }
.chk-list .ico.t-mode.t17 { background-position-x: 0px; background-position-y: -256px; }
.chk-list .ico.t-mode.t18 { background-position-x: -64px; background-position-y: -256px; }
.chk-list .ico.t-mode.t19 { background-position-x: -128px; background-position-y: -256px; }
.chk-list .ico.t-mode.t20 { background-position-x: -192px; background-position-y: -256px; }
.chk-list .ico.t-mode.t21 { background-position-x: 0px; background-position-y: -320px; }
.chk-list .ico.t-mode.t22 { background-position-x: -64px; background-position-y: -320px; }
.chk-list .ico.t-mode.t23 { background-position-x: -128px; background-position-y: -320px; }
.chk-list .ico.t-mode.t24 { background-position-x: -192px; background-position-y: -320px; }
.mode-detail .ico.t-mode, .small .chk-list .ico.t-mode { width: 48px; height: 48px; background: url("/asset/images/ico/time-ico-w.png"); background-size: 192px auto !important; }
.mode-detail .ico.t-mode.t1, .small .chk-list .ico.t-mode.t1 { background-position-x: 0px; background-position-y: 0; }
.mode-detail .ico.t-mode.t2, .small .chk-list .ico.t-mode.t2 { background-position-x: -48px; background-position-y: 0; }
.mode-detail .ico.t-mode.t3, .small .chk-list .ico.t-mode.t3 { background-position-x: -96px; background-position-y: 0; }
.mode-detail .ico.t-mode.t4, .small .chk-list .ico.t-mode.t4 { background-position-x: -144px; background-position-y: 0; }
.mode-detail .ico.t-mode.t5, .small .chk-list .ico.t-mode.t5 { background-position-x: 0px; background-position-y: -48px; }
.mode-detail .ico.t-mode.t6, .small .chk-list .ico.t-mode.t6 { background-position-x: -48px; background-position-y: -48px; }
.mode-detail .ico.t-mode.t7, .small .chk-list .ico.t-mode.t7 { background-position-x: -96px; background-position-y: -48px; }
.mode-detail .ico.t-mode.t8, .small .chk-list .ico.t-mode.t8 { background-position-x: -144px; background-position-y: -48px; }
.mode-detail .ico.t-mode.t9, .small .chk-list .ico.t-mode.t9 { background-position-x: 0px; background-position-y: -96px; }
.mode-detail .ico.t-mode.t10, .small .chk-list .ico.t-mode.t10 { background-position-x: -48px; background-position-y: -96px; }
.mode-detail .ico.t-mode.t11, .small .chk-list .ico.t-mode.t11 { background-position-x: -96px; background-position-y: -96px; }
.mode-detail .ico.t-mode.t12, .small .chk-list .ico.t-mode.t12 { background-position-x: -144px; background-position-y: -96px; }
.mode-detail .ico.t-mode.t13, .small .chk-list .ico.t-mode.t13 { background-position-x: 0px; background-position-y: -144px; }
.mode-detail .ico.t-mode.t14, .small .chk-list .ico.t-mode.t14 { background-position-x: -48px; background-position-y: -144px; }
.mode-detail .ico.t-mode.t15, .small .chk-list .ico.t-mode.t15 { background-position-x: -96px; background-position-y: -144px; }
.mode-detail .ico.t-mode.t16, .small .chk-list .ico.t-mode.t16 { background-position-x: -144px; background-position-y: -144px; }
.mode-detail .ico.t-mode.t17, .small .chk-list .ico.t-mode.t17 { background-position-x: 0px; background-position-y: -192px; }
.mode-detail .ico.t-mode.t18, .small .chk-list .ico.t-mode.t18 { background-position-x: -48px; background-position-y: -192px; }
.mode-detail .ico.t-mode.t19, .small .chk-list .ico.t-mode.t19 { background-position-x: -96px; background-position-y: -192px; }
.mode-detail .ico.t-mode.t20, .small .chk-list .ico.t-mode.t20 { background-position-x: -144px; background-position-y: -192px; }
.mode-detail .ico.t-mode.t21, .small .chk-list .ico.t-mode.t21 { background-position-x: 0px; background-position-y: -240px; }
.mode-detail .ico.t-mode.t22, .small .chk-list .ico.t-mode.t22 { background-position-x: -48px; background-position-y: -240px; }
.mode-detail .ico.t-mode.t23, .small .chk-list .ico.t-mode.t23 { background-position-x: -96px; background-position-y: -240px; }
.mode-detail .ico.t-mode.t24, .small .chk-list .ico.t-mode.t24 { background-position-x: -144px; background-position-y: -240px; }
.edit .mode-detail .ico.t-mode { width: 48px; height: 48px; background: url("/asset/images/ico/time-ico-u.png"); background-size: 192px auto !important; }
.edit .mode-detail .ico.t-mode.t1 { background-position-x: 0px; background-position-y: 0; }
.edit .mode-detail .ico.t-mode.t2 { background-position-x: -48px; background-position-y: 0; }
.edit .mode-detail .ico.t-mode.t3 { background-position-x: -96px; background-position-y: 0; }
.edit .mode-detail .ico.t-mode.t4 { background-position-x: -144px; background-position-y: 0; }
.edit .mode-detail .ico.t-mode.t5 { background-position-x: 0px; background-position-y: -48px; }
.edit .mode-detail .ico.t-mode.t6 { background-position-x: -48px; background-position-y: -48px; }
.edit .mode-detail .ico.t-mode.t7 { background-position-x: -96px; background-position-y: -48px; }
.edit .mode-detail .ico.t-mode.t8 { background-position-x: -144px; background-position-y: -48px; }
.edit .mode-detail .ico.t-mode.t9 { background-position-x: 0px; background-position-y: -96px; }
.edit .mode-detail .ico.t-mode.t10 { background-position-x: -48px; background-position-y: -96px; }
.edit .mode-detail .ico.t-mode.t11 { background-position-x: -96px; background-position-y: -96px; }
.edit .mode-detail .ico.t-mode.t12 { background-position-x: -144px; background-position-y: -96px; }
.edit .mode-detail .ico.t-mode.t13 { background-position-x: 0px; background-position-y: -144px; }
.edit .mode-detail .ico.t-mode.t14 { background-position-x: -48px; background-position-y: -144px; }
.edit .mode-detail .ico.t-mode.t15 { background-position-x: -96px; background-position-y: -144px; }
.edit .mode-detail .ico.t-mode.t16 { background-position-x: -144px; background-position-y: -144px; }
.edit .mode-detail .ico.t-mode.t17 { background-position-x: 0px; background-position-y: -192px; }
.edit .mode-detail .ico.t-mode.t18 { background-position-x: -48px; background-position-y: -192px; }
.edit .mode-detail .ico.t-mode.t19 { background-position-x: -96px; background-position-y: -192px; }
.edit .mode-detail .ico.t-mode.t20 { background-position-x: -144px; background-position-y: -192px; }
.edit .mode-detail .ico.t-mode.t21 { background-position-x: 0px; background-position-y: -240px; }
.edit .mode-detail .ico.t-mode.t22 { background-position-x: -48px; background-position-y: -240px; }
.edit .mode-detail .ico.t-mode.t23 { background-position-x: -96px; background-position-y: -240px; }
.edit .mode-detail .ico.t-mode.t24 { background-position-x: -144px; background-position-y: -240px; }
.disable .ico.t-mode { width: 48px; height: 48px; background: url("/asset/images/ico/time-ico-g.png"); background-size: 192px auto !important; }
.disable .ico.t-mode.t1 { background-position-x: 0px; background-position-y: 0; }
.disable .ico.t-mode.t2 { background-position-x: -48px; background-position-y: 0; }
.disable .ico.t-mode.t3 { background-position-x: -96px; background-position-y: 0; }
.disable .ico.t-mode.t4 { background-position-x: -144px; background-position-y: 0; }
.disable .ico.t-mode.t5 { background-position-x: 0px; background-position-y: -48px; }
.disable .ico.t-mode.t6 { background-position-x: -48px; background-position-y: -48px; }
.disable .ico.t-mode.t7 { background-position-x: -96px; background-position-y: -48px; }
.disable .ico.t-mode.t8 { background-position-x: -144px; background-position-y: -48px; }
.disable .ico.t-mode.t9 { background-position-x: 0px; background-position-y: -96px; }
.disable .ico.t-mode.t10 { background-position-x: -48px; background-position-y: -96px; }
.disable .ico.t-mode.t11 { background-position-x: -96px; background-position-y: -96px; }
.disable .ico.t-mode.t12 { background-position-x: -144px; background-position-y: -96px; }
.disable .ico.t-mode.t13 { background-position-x: 0px; background-position-y: -144px; }
.disable .ico.t-mode.t14 { background-position-x: -48px; background-position-y: -144px; }
.disable .ico.t-mode.t15 { background-position-x: -96px; background-position-y: -144px; }
.disable .ico.t-mode.t16 { background-position-x: -144px; background-position-y: -144px; }
.disable .ico.t-mode.t17 { background-position-x: 0px; background-position-y: -192px; }
.disable .ico.t-mode.t18 { background-position-x: -48px; background-position-y: -192px; }
.disable .ico.t-mode.t19 { background-position-x: -96px; background-position-y: -192px; }
.disable .ico.t-mode.t20 { background-position-x: -144px; background-position-y: -192px; }
.disable .ico.t-mode.t21 { background-position-x: 0px; background-position-y: -240px; }
.disable .ico.t-mode.t22 { background-position-x: -48px; background-position-y: -240px; }
.disable .ico.t-mode.t23 { background-position-x: -96px; background-position-y: -240px; }
.disable .ico.t-mode.t24 { background-position-x: -144px; background-position-y: -240px; }
.sel-list .ico.t-mode { width: 48px; height: 48px; background: url("/asset/images/ico/time-ico-b.png"); background-size: 192px auto !important; }
.sel-list .ico.t-mode.t1 { background-position-x: 0px; background-position-y: 0; }
.sel-list .ico.t-mode.t2 { background-position-x: -48px; background-position-y: 0; }
.sel-list .ico.t-mode.t3 { background-position-x: -96px; background-position-y: 0; }
.sel-list .ico.t-mode.t4 { background-position-x: -144px; background-position-y: 0; }
.sel-list .ico.t-mode.t5 { background-position-x: 0px; background-position-y: -48px; }
.sel-list .ico.t-mode.t6 { background-position-x: -48px; background-position-y: -48px; }
.sel-list .ico.t-mode.t7 { background-position-x: -96px; background-position-y: -48px; }
.sel-list .ico.t-mode.t8 { background-position-x: -144px; background-position-y: -48px; }
.sel-list .ico.t-mode.t9 { background-position-x: 0px; background-position-y: -96px; }
.sel-list .ico.t-mode.t10 { background-position-x: -48px; background-position-y: -96px; }
.sel-list .ico.t-mode.t11 { background-position-x: -96px; background-position-y: -96px; }
.sel-list .ico.t-mode.t12 { background-position-x: -144px; background-position-y: -96px; }
.sel-list .ico.t-mode.t13 { background-position-x: 0px; background-position-y: -144px; }
.sel-list .ico.t-mode.t14 { background-position-x: -48px; background-position-y: -144px; }
.sel-list .ico.t-mode.t15 { background-position-x: -96px; background-position-y: -144px; }
.sel-list .ico.t-mode.t16 { background-position-x: -144px; background-position-y: -144px; }
.sel-list .ico.t-mode.t17 { background-position-x: 0px; background-position-y: -192px; }
.sel-list .ico.t-mode.t18 { background-position-x: -48px; background-position-y: -192px; }
.sel-list .ico.t-mode.t19 { background-position-x: -96px; background-position-y: -192px; }
.sel-list .ico.t-mode.t20 { background-position-x: -144px; background-position-y: -192px; }
.sel-list .ico.t-mode.t21 { background-position-x: 0px; background-position-y: -240px; }
.sel-list .ico.t-mode.t22 { background-position-x: -48px; background-position-y: -240px; }
.sel-list .ico.t-mode.t23 { background-position-x: -96px; background-position-y: -240px; }
.sel-list .ico.t-mode.t24 { background-position-x: -144px; background-position-y: -240px; }
.ico.end { width: 20px; height: 20px; background: url("/asset/images/ico/end.png"); }

button { cursor: pointer; }

input, textarea { outline: none; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; }

textarea { -webkit-appearance: none; -webkit-border-radius: 0; border-radius: 0; resize: none; }

select::-ms-expand { display: none; }

select { border-radius: 0; text-align: left; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; }

iframe[name=google_conversion_frame] { display: none; }

input { color: #222; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; }

input[type=number], input[type=email], input[type=tel], input[type=text], input[type=file], input[type=password] { -webkit-appearance: none; -webkit-border-radius: 0; border-radius: 0; }

input[type=number]::-webkit-outer-spin-button, input[type=number]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

input[type=checkbox], input[type=radio] { margin: 0; padding: 0; }

input[type=file] { border: 0; }

textarea:focus, select:focus, input:focus { outline: none !important; }

input[type=radio], input[type=checkbox] { outline: none !important; }

input[type="checkbox"], input[type="radio"] { -moz-opacity: 0; -khtml-opacity: 0; -webkit-opacity: 0; opacity: 0; -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0); filter: alpha(opacity=0); }

.chk-group input, .slideCheck input, .cus-chk input, .tog-chk input, .thick-chk input, .avatar-chk input { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 5; }

.thick-chk span { display: inline-block; width: 26px; height: 26px; position: relative; }
.thick-chk span label { display: block; font-size: 14px; width: 100%; height: 100%; padding-right: 1px; text-align: center; line-height: 25px; border-radius: 14px; border: 1px solid; }
.thick-chk span:nth-child(1) label { border-color: #aec6e6; color: #aec6e6; }
.thick-chk span:nth-child(2) label { border-color: #97d4dd; color: #97d4dd; }
.thick-chk span:nth-child(3) label { border-color: #b6ddcd; color: #b6ddcd; }
.thick-chk span input:checked + label { color: #fff; }
.thick-chk span:nth-child(1) input[type="radio"]:checked + label { border-color: #1169e0; background: #1169e0; }
.thick-chk span:nth-child(2) input[type="radio"]:checked + label { border-color: #11b1c9; background: #11b1c9; }
.thick-chk span:nth-child(3) input[type="radio"]:checked + label { border-color: #1fc581; background: #1fc581; }
.thick-chk span input[type="radio"]:disabled + label { border-color: #ccc; background: #fff; color: #ccc; }
.thick-chk span input[type="radio"]:checked:disabled + label { border-color: #ccc; background: #ccc; color: #fff; }

span.chk-group { display: inline-block; }

.chk-group { overflow: hidden; padding-left: 1px; position: relative; line-height: 40px; }
.chk-group em { margin-left: 5px; vertical-align: middle; }
.chk-group .chk { position: relative; float: left; height: 40px; margin-left: -1px; }
.chk-group .chk label { height: 40px; line-height: 38px; display: block; text-align: center; color: #dfdfdf; border: 1px solid #dfdfdf; font-size: 18px; position: relative; font-weight: normal; }
.chk-group .chk span { display: block; font-size: 10.67px; margin: 0; }
.chk-group .chk input[type="checkbox"]:checked + label, .chk-group .chk input[type="radio"]:checked + label { border-color: #0e86b6; color: #0e86b6; background: #e9f1f5; z-index: 2; }
.chk-group .chk input[type="checkbox"]:disabled + label, .chk-group .chk input[type="radio"]:disabled + label { border-color: #dfdfdf; color: #dfdfdf; background: #fff; }
.days .chk-group { display: block; }
.days .chk-group .chk { width: 14.5%; max-width: 48px; }
.temperature .chk-group, .air .chk-group { top: -5px; }
.temperature .chk-group .chk, .air .chk-group .chk { width: 45px; }
.temperature .chk-group .chk label, .air .chk-group .chk label { font-size: 16px; }
.air .chk-group { top: -5px; line-height: 51px; }
.air .chk-group .chk { width: 72px; height: 51px; }
.air .chk-group .chk label { line-height: 1.2; height: 51px; padding-top: 10px; }

.slideCheck { display: inline-block; width: 38px; height: 22px; position: relative; }
.slideCheck label { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.slideCheck label:before { content: ""; height: 100%; position: absolute; top: 0; left: 0; right: 0; border-radius: 11px; background: #ccc; transition: all 0.4s ease; }
.slideCheck label:after { content: ""; position: absolute; left: 0; width: 20px; height: 20px; top: 1px; margin: 0; border: 1px solid #a2a2a2; border-radius: 11px; background: #fff; z-index: 2; transition: all 0.4s ease; box-shadow: 2px 2px rgba(0, 0, 0, 0.1); }
.slideCheck input[type="checkbox"]:checked + label:before { background: #0e86b6; }
.slideCheck input[type="checkbox"]:checked + label:after { left: 100%; margin-left: -21px; box-shadow: none; border-color: #0c759f; }
.slideCheck input[type="checkbox"]:disabled + label:before { background: #ccc; }
.slideCheck input[type="checkbox"]:disabled + label:after { border-color: #a2a2a2; left: 0; margin-left: 0; }
.time-box .slideCheck input[type="checkbox"]:checked + label:before { background: transparent; border: 1px solid #fff; }
.time-box .slideCheck input[type="checkbox"]:checked + label:after { top: 2px; margin-left: -20px; width: 18px; height: 18px; border-color: transparent; }
.chk-setting-box .slideCheck, .room-setting li .slideCheck, .allim-sec dt .slideCheck, .allim-sec dd .slideCheck, .control-sec li .slideCheck, .control-sec .tit .slideCheck, .smart-sec .slideCheck, .fun-setting .slideCheck { margin-top: 1px; }
.login-sec .slideCheck { width: 50px; }
.login-sec .slideCheck label { height: inherit; padding-top: 24px; }
.login-sec .slideCheck label:before { height: 8px; top: 7px; left: 2px; right: 2px; }
.login-sec .slideCheck label span { color: #fff; }
.login-sec .slideCheck label span.on { display: none; }
.login-sec .slideCheck label span.off { display: block; }
.login-sec .slideCheck input[type="checkbox"]:checked + label span.on { display: block; }
.login-sec .slideCheck input[type="checkbox"]:checked + label span.off { display: none; }
.dash-switch .slideCheck { width: 150px; height: 35px; }
.dash-switch .slideCheck label { position: relative; display: inline-block; text-align: center; color: #05729e; font-size: 17px; height: 35px; line-height: 32px; border: 1px solid #05729e; border-radius: 40px; background: #fff; }
.dash-switch .slideCheck label span.on { display: none; }
.dash-switch .slideCheck label span.off { display: block; }
.dash-switch .slideCheck label:after { display: none; }
.dash-switch .slideCheck label:before { width: 5px; height: 16px; background: #c5dae2; position: absolute; top: 50%; left: 18px; margin-top: -8px; }
.dash-switch .slideCheck input[type="checkbox"]:checked + label { border-color: #05729e; background: #0e86b6; color: #fff; }
.dash-switch .slideCheck input[type="checkbox"]:checked + label span.on { display: block; }
.dash-switch .slideCheck input[type="checkbox"]:checked + label span.off { display: none; }
.dash-switch .slideCheck input[type="checkbox"]:checked + label:before { background: #fff; box-shadow: 0 0 7px #fff; }

.cus-chk { display: inline-block; position: relative; line-height: 30px; }
.cus-chk label span { position: relative; top: -5px; font-size: 14px; margin-left: 8px; }
.cus-chk label:before, .cus-chk label:after { content: ""; display: inline-block; }
.cus-chk label:before { width: 20px; height: 20px; border: 1px solid #ddd; border-radius: 12px; margin: 6px 5px 0 0; }
.cus-chk input:checked + label:after { position: absolute; top: 0; left: 0; margin: 10px 0 0 4px; width: 12px; height: 12px; border-radius: 12px; overflow: hidden; background: #0e86b6; }
.cus-chk input:disabled + label:after { display: none; }
.room-setting .cus-chk input[type="radio"]:checked + label:before, .room-setting .cus-chk input[type="checkbox"]:checked + label:before { background: #0e86b6 url("/asset/images/common/check.png") 0 0 no-repeat; background-size: 20px; border-color: #0e86b6; }
.room-setting .cus-chk input[type="radio"]:checked + label:after, .room-setting .cus-chk input[type="checkbox"]:checked + label:after { display: none; }
.layer-pop .box .cus-chk label:before { margin-top: 0; vertical-align: middle; position: relative; top: -1px; }
.layer-pop .box .cus-chk label:after { display: none; }
.layer-pop .box .cus-chk input:checked + label:before { background: #0e86b6 url("/asset/images/common/check.png") 0 0 no-repeat; background-size: 20px; border-color: #0e86b6; }
.voice-sec .cus-chk { line-height: 1.4; font-size: 14px; }
.voice-sec .cus-chk * { vertical-align: top; }
.voice-sec .cus-chk label { vertical-align: top; }
.voice-sec .cus-chk label:before { margin-top: 0; width: 16px; height: 16px; border-radius: 2px; border: 1px solid #333; position: relative; top: 1px; }
.voice-sec .cus-chk label:after { display: none; }
.voice-sec .cus-chk input[type="radio"]:checked + label:before, .voice-sec .cus-chk input[type="checkbox"]:checked + label:before { background: #0e86b6 url("/asset/images/common/check2.gif") 0 0 no-repeat; background-size: 100%; }
.login-sec .cus-chk label:before { width: 24px; height: 24px; border-radius: 12px; border: 1px solid #e4e2ea; position: relative; top: 5px; margin: 0 5px 0 0; }
.login-sec .cus-chk label:after { display: none; }
.login-sec .cus-chk input[type="radio"]:checked + label:before, .login-sec .cus-chk input[type="checkbox"]:checked + label:before { background: #fff url("/asset/images/common/check3.png") 0 0 no-repeat; background-size: 100%; }
.cus-chk.all label { padding-left: 22px; position: relative; display: inline-block; line-height: 1.2; }
.cus-chk.all label:before { width: 18px; height: 18px; border-radius: 0; position: absolute; top: 0; left: 0; margin: 0; border: none; background: url("/asset/images/common/check4.png") 0 0 no-repeat; background-size: 18px auto; }
.cus-chk.all label:after { display: none; }
.cus-chk.all label em:nth-child(1) { display: none; }
.cus-chk.all label em:nth-child(2) { display: block; }
.cus-chk.all input:checked + label:before { background-position: 0 100%; }
.cus-chk.all input:checked + label em:nth-child(1) { display: block; }
.cus-chk.all input:checked + label em:nth-child(2) { display: none; }

.tog-chk { display: inline-block; width: 60px; height: 30px; position: relative; }
.tog-chk label { display: block; width: 100%; height: 100%; line-height: 29px; border: 1px solid #ddd; border-radius: 15px; padding-left: 20px; }
.tog-chk label em:nth-child(1) { display: none; }
.tog-chk label em:nth-child(2) { display: block; }
.tog-chk label:before, .tog-chk label:after { content: ""; position: absolute; top: 8px; left: 9px; display: inline-block; width: 6px; height: 16px; background: url("/asset/images/common/tog-chk.png") 0 0 no-repeat; background-size: 16px; }
.tog-chk label:after { height: 6px; background-position: -10px 0; }
.tog-chk input[type="checkbox"]:checked + label em:nth-child(1) { display: block; }
.tog-chk input[type="checkbox"]:checked + label em:nth-child(2) { display: none; }
.tog-chk input[type="checkbox"]:checked + label:after { top: 19px; height: 6px; background-position: -10px -11px; }
.tog-chk input[type="checkbox"]:disabled + label em { color: #ccc; }
.tog-chk input[type="checkbox"]:disabled + label em:nth-child(1) { display: block; }
.tog-chk input[type="checkbox"]:disabled + label em:nth-child(2) { display: none; }
.tog-chk input[type="checkbox"]:disabled + label:after { display: none; }

.avatar-chk { position: relative; display: inline-block; }
.avatar-chk label { display: block; width: 134px; height: 134px; border-radius: 67px; border: 1px solid #d4dee2; overflow: hidden; }
.avatar-chk label span { display: block; width: 134px; height: 134px; margin: -1px; }
.avatar-chk input:checked + label { border: 3px solid #0e86b6; }
.avatar-chk input:checked + label span { margin: -3px; }

.range-row > .irs { padding-top: 0; }

.irs { position: relative; padding-top: 37px; display: block; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
.irs.js-irs-0 { padding-top: 0; }

.irs-line { position: relative; display: block; overflow: hidden; outline: none !important; background: #ddd; height: 10px; border-radius: 5px; }

.irs-bar, .irs-slider, .irs-min, .irs-max, .irs-from, .irs-to, .irs-single { position: absolute; top: 0; display: block; }

.irs-bar { position: absolute; display: block; top: 37px; left: 0; width: 0; height: 10px; background: #ccc; }

.irs-slider { cursor: default; z-index: 1; top: 25px; }

.irs-slider.type_last { z-index: 2; }

.irs-min { left: 0; cursor: default; }

.irs-max { right: 0; cursor: default; }

.irs-from, .irs-to, .irs-single { top: 0; left: 0; cursor: default; white-space: nowrap; color: #ccc; font-size: 12.71px; }

.irs-disabled { opacity: 0.4; }

.irs-hidden-input { position: absolute !important; display: block !important; top: 0 !important; left: 0 !important; width: 0 !important; height: 0 !important; font-size: 0 !important; line-height: 0 !important; padding: 0 !important; margin: 0 !important; outline: none !important; z-index: -9999 !important; background: none !important; }

.irs-min, .irs-max { color: #ccc; font-size: 12.71px; text-shadow: none; top: 0; }

.irs-from, .irs-to { color: #ccc; font-size: 12.71px; text-shadow: none; }

.irs-slider { display: inline-block; width: 34px; height: 34px; background-size: 100% !important; }
.irs-slider.to { background: url("/asset/images/common/sprite-to.png"); }
.irs-slider.from { background: url("/asset/images/common/sprite-from.png"); }

/*!
 * Cropper v3.1.1
 * https://github.com/fengyuanchen/cropper
 *
 * Copyright (c) 2014-2017 Chen Fengyuan
 * Released under the MIT license
 *
 * Date: 2017-10-11T13:34:16.708Z
 */
.cropper-container { direction: ltr; font-size: 0; line-height: 0; width: 100% !important; height: 100% !important; position: relative; -ms-touch-action: none; touch-action: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }

.cropper-container img { display: block; height: 100%; image-orientation: 0deg; max-height: none !important; max-width: none !important; min-height: 0 !important; min-width: 0 !important; width: 100%; }

.cropper-wrap-box, .cropper-canvas, .cropper-drag-box, .cropper-crop-box, .cropper-modal { bottom: 0; left: 0; position: absolute; right: 0; top: 0; width: 100%; height: 100%; }

.cropper-wrap-box, .cropper-canvas { overflow: hidden; }

.cropper-drag-box { background-color: #fff; opacity: 0; }

.cropper-modal { background-color: #000; opacity: .5; }

.cropper-view-box { display: block; height: 100%; outline: 1px solid #39f; overflow: hidden; width: 100%; }

.cropper-center:before, .cropper-center:after { background-color: #eee; content: ' '; display: block; position: absolute; }

.cropper-center:before { height: 1px; left: -3px; top: 0; width: 7px; }

.cropper-center:after { height: 7px; left: 0; top: -3px; width: 1px; }

.cropper-face, .cropper-line, .cropper-point { display: block; height: 100%; opacity: .1; position: absolute; width: 100%; }

.cropper-face { background-color: #fff; left: 0; top: 0; }

.cropper-line { background-color: #39f; }

.cropper-line.line-e { cursor: e-resize; right: -3px; top: 0; width: 5px; }

.cropper-line.line-n { cursor: n-resize; height: 5px; left: 0; top: -3px; }

.cropper-line.line-w { cursor: w-resize; left: -3px; top: 0; width: 5px; }

.cropper-line.line-s { bottom: -3px; cursor: s-resize; height: 5px; left: 0; }

.cropper-invisible { opacity: 0; }

.cropper-hide { display: block; height: 0; position: absolute; width: 0; }

.cropper-hidden { display: none !important; }

.cropper-move { cursor: move; }

.cropper-crop { cursor: crosshair; }

.cropper-disabled .cropper-drag-box, .cropper-disabled .cropper-face, .cropper-disabled .cropper-line, .cropper-disabled .cropper-point { cursor: not-allowed; }

html, body { height: 100%; position: relative; overflow: hidden; }

.ui-loader { display: none; }

@keyframes item-1_move { 0%, 100% { transform: translate(0, 0); }
  25% { transform: translate(0, 30px); }
  50% { transform: translate(30px, 30px); }
  75% { transform: translate(30px, 0); } }
@keyframes item-2_move { 0%, 100% { transform: translate(0, 0); }
  25% { transform: translate(-30px, 0); }
  50% { transform: translate(-30px, 30px); }
  75% { transform: translate(0, 30px); } }
@keyframes item-3_move { 0%, 100% { transform: translate(0, 0); }
  25% { transform: translate(0, -30px); }
  50% { transform: translate(-30px, -30px); }
  75% { transform: translate(-30px, 0); } }
@keyframes item-4_move { 0%, 100% { transform: translate(0, 0); }
  25% { transform: translate(30px, 0); }
  50% { transform: translate(30px, -30px); }
  75% { transform: translate(0, -30px); } }
.page-loading { background: rgba(0, 0, 0, 0.8); position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 1000; }
.page-loading > div { position: absolute; width: 60px; height: 60px; top: 0; bottom: 0; left: 0; right: 0; margin: auto; }
.page-loading .item { width: 30px; height: 30px; position: absolute; border-radius: 15px; }
.page-loading .item-1 { background-color: #2ba4f0; top: 0; left: 0; z-index: 1; animation: item-1_move 1.8s cubic-bezier(0.6, 0.01, 0.4, 1) infinite; }
.page-loading .item-2 { background-color: #17c274; top: 0; right: 0; animation: item-2_move 1.8s cubic-bezier(0.6, 0.01, 0.4, 1) infinite; }
.page-loading .item-3 { background-color: #f2a81a; bottom: 0; right: 0; z-index: 1; animation: item-3_move 1.8s cubic-bezier(0.6, 0.01, 0.4, 1) infinite; }
.page-loading .item-4 { background-color: #db3f64; bottom: 0; left: 0; animation: item-4_move 1.8s cubic-bezier(0.6, 0.01, 0.4, 1) infinite; }

#main-wrap { height: 100%; background: url("/asset/images/layout/bg-content.png"); background-size: 10px; position: relative; z-index: 2; }
#main-wrap .main-content-wrap, #main-wrap .main-content { height: 100% !important; }
#main-wrap .main-content-wrap, #main-wrap .main-content, #main-wrap .bx-wrapper, #main-wrap .bx-viewport { min-width: 100%; }
#main-wrap .main-content-wrap { padding-top: 105px; }
#main-wrap .main-content-wrap > .bx-wrapper { height: 100% !important; }
#main-wrap .main-content-wrap > .bx-wrapper > .bx-viewport { height: 100% !important; }
#main-wrap .page { height: 100%; overflow-y: scroll; padding: 10px; }
#main-wrap #page3 { padding: 0; }

@keyframes aniDataContent { from { left: 100%; }
  to { left: 0%; } }
@keyframes aniDataContentR { from { left: -100%; }
  to { left: 0; } }
#sub-page-sec { position: absolute; top: 0; width: 100%; height: 100%; background: #fff; z-index: 2; left: 100%; }
#sub-page-sec.is-view { left: 0; transition: left .4s ease; }
#sub-page-sec.is-hide { left: 100%; transition: left .4s ease; }
#sub-page-sec .data-content { position: relative; animation-name: aniDataContent; animation-duration: .4s; }
#sub-page-sec.back .data-content { animation-name: aniDataContentR; animation-duration: .4s; }

#error-wrap { height: 100%; }
#error-wrap .fix-btns { background: #fff; margin-top: 32px; text-align: center; }
#error-wrap .error-sec { height: 100%; display: table; width: 100%; }
#error-wrap .error-sec article { display: table-cell; vertical-align: middle; text-align: center; }
#error-wrap .error-sec p { padding-top: 110px; color: #999; line-height: 1.3; font-size: 21px; text-align: center; background: 50% 0 no-repeat; background-size: 70px; }
#error-wrap .error-sec p.ty1 { background-image: url("/asset/images/common/error-ty1.png"); }
#error-wrap .error-sec p.ty2 { background-image: url("/asset/images/common/error-ty2.png"); }
#error-wrap .error-sec p span { font-size: 16px; display: block; margin-top: 6px; }
#error-wrap .error-sec .t-btn { color: #000; background: #fff; border-color: #dcdcdc; }

/* sub */
.sub-contents-wrap { height: 100%; padding: 57px 0 0; position: relative; }
.sub-contents-wrap .data-content { height: 100%; overflow: hidden; overflow-y: scroll; }
.sub-contents-wrap .fix-top, .sub-contents-wrap .fix-btns { position: absolute; left: 0; width: 100%; background: #fff; min-height: 58px; border: 0 solid #dbdbdb; z-index: 2; }
.sub-contents-wrap .fix-top { top: 0; padding: 16px 20px; border-bottom-width: 1px; }
.sub-contents-wrap .fix-top a { display: inline-block; font-size: 17.33px; color: #000; padding: 0 24px; position: relative; font-weight: 600; }
.sub-contents-wrap .fix-top a.bt-history-back:before { content: ""; display: inline-block; position: absolute; top: 50%; margin-top: -8px; left: 0; width: 10px; height: 17px; background: url("/asset/images/ico/his-back.png") no-repeat; background-size: 100%; }
.sub-contents-wrap .fix-btns { bottom: 0; border-top-width: 1px; padding: 11px 0; text-align: center; }
.sub-contents-wrap .fix-btns p { font-size: 12.67px; color: #96a4a9; margin-bottom: 16px; }
.sub-contents-wrap .no-line { border-top: none; }
.sub-contents-wrap.is-bt { padding-bottom: 57px; }
.sub-contents-wrap.is-chk { padding-bottom: 116px; }
.sub-contents-wrap.is-chk .fix-btns { padding-top: 20px; }
.sub-contents-wrap .help, .sub-contents-wrap .mic { position: absolute; top: 50%; right: 16px; margin-top: -10px; }
.sub-contents-wrap.indoor-ctr-wrap.is-bt .fix-btns { border-top-width: 0; }
.sub-contents-wrap.indoor-ctr-wrap.is-bt .fix-btns .t-btn { color: #333; }
.sub-contents-wrap.indoor-ctr-wrap.is-bt .fix-btns .t-btn:active { color: #fff; }
.sub-contents-wrap.indoor-ctr-wrap.is-bt .fix-btns .t-btn:disabled { color: #bbb; }

.splash { display: table; width: 100%; height: 100%; background: url("/asset/images/common/bg.jpg") 0 0 no-repeat; background-size: 100% auto; }
.splash div { display: table-cell; vertical-align: middle; }
.splash div:before { content: ''; display: block; width: 120px; height: 100px; margin: 0 auto 20px; background: url("/asset/images/layout/logo-login.png") no-repeat; background-size: 100%; }

.login-wrap { background: url("/asset/images/common/bg.jpg") 0 0 no-repeat; background-size: 100% auto; height: 100%; position: relative; }
.login-wrap .ico.end { position: absolute; top: 20px; right: 20px; z-index: 100; }
.login-wrap .data-content { display: table; width: 100%; height: 100%; }
.login-wrap .login-sec { display: table-cell; vertical-align: middle; }
.login-wrap .login-sec:before { content: ''; display: block; width: 141px; height: 100px; margin: 0 auto 20px; background: url("/asset/images/layout/logo-login.png") no-repeat; background-size: 100%; }
.login-wrap p { font-size: 25px; color: #000; text-align: center; }

.w-list { padding: 0 20px; margin-top: 36px; }
.w-list li { font-size: 14px; }
.w-list input { font-size: 14px; width: 100%; height: 41px; line-height: 41px; padding: 0 15px; color: #000; background: #fff; border: 1px solid #e4e2ea; }
.w-list input::-webkit-input-placeholder { color: #b4c1c7; }
.w-list input::-moz-placeholder { color: #b4c1c7; }
.w-list input:-moz-placeholder { color: #b4c1c7; }
.w-list input:-ms-input-placeholder { color: #b4c1c7; }
.w-list .row + .row { margin-top: -1px; }
.w-list .col { padding-left: 65px; position: relative; }
.w-list .col .label { position: absolute; left: 0; top: 50%; margin-top: -10px; color: #fff; }
.w-list .col-group { display: table; width: 100%; table-layout: fixed; }
.w-list .col-group span { display: table-cell; }
.w-list .col-group .gap { width: 16px; }
.w-list .col-group p { padding-right: 20px; position: relative; }
.w-list .col-group i { position: absolute; top: 50%; right: 0; font-size: 16.67px; font-style: normal; margin-top: -11px; }
.w-list .btn-row { margin-top: 14px; }
.w-list .btn-row button { font-size: 14px; width: 100%; height: 45px; line-height: 45px; text-align: center; color: #fff; border: 1px solid; }
.w-list .btn-row .bt-ty1 { background: #0082a1; border-color: #007692; color: #fff; }
.w-list .chk-row { text-align: center; margin-top: 11px; padding-bottom: 10px; }
.w-list .chk-row * { color: #000; font-size: 16px; }
.w-list .chk-row a { margin-left: 52px; }
.w-list .chk-row a:before { content: ""; width: 3px; height: 3px; display: inline-block; background: #000; margin-right: 10px; position: relative; top: -4px; }
.w-list .is-hidden { visibility: hidden; }

/*loading-rotation*/
.cf:before, .cf:after { content: " "; display: table; }
.cf:after { clear: both; }

.loading-rotation { margin: 15px; width: 30px; height: 30px; border: 1px #fff solid; border-radius: 50%; -webkit-animation: rotation 1s ease-in-out infinite; -moz-animation: rotation 1s ease-in-out infinite; animation: rotation 1s ease-in-out infinite; }
.loading-rotation:after { width: 5px; height: 5px; background-color: white; border-radius: 100%; position: absolute; content: ""; }

@-webkit-keyframes rotation { 0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); } }
@-moz-keyframes rotation { 0% { -moz-transform: rotate(0deg); }
  100% { -moz-transform: rotate(360deg); } }
@keyframes rotation { 0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); } }
body.menu-is-open { overflow: hidden; }

header { position: fixed; left: 0; top: 0; width: 100%; border-bottom: 1px solid #dbdbdb; background: #fff; z-index: 999; }

.fix-top-header { position: relative; }
.fix-top-header h1 { font-size: 17.33px; text-align: center; padding: 15px 0 17px; }
.fix-top-header .all-btn { display: inline-block; position: absolute; top: 50%; margin-top: -10px; left: 20px; }
.fix-top-header .help, .fix-top-header .mic { position: absolute; top: 50%; right: 16px; margin-top: -10px; }

/*.toggle-all-menu .t-btn.ty1 { height: 22px; line-height: 20px; }*/
.toggle-all-menu .outer { height: 100%; background: #fff; overflow: hidden; display: none; width: 268px; position: fixed; left: -268px; top: 0; bottom: 0; height: 100%; z-index: 1001; }
.toggle-all-menu .outer.is-open { display: block; left: 0; }
.toggle-all-menu .bg { position: fixed; left: 0; top: 0; bottom: 0; width: 100%; height: 100%; display: none; z-index: 1000; background: #000; opacity: 0.6; }
.toggle-all-menu .inner { position: relative; overflow-y: auto; height: 100%; padding-bottom: 78px; }
.toggle-all-menu .all-menu-close { position: absolute; top: 8px; right: 12px; z-index: 1001; }
.toggle-all-menu .btn-row-logout { padding: 24px; position: absolute; bottom: 0; left: 0; right: 0; background: #fff; }
.toggle-all-menu .btn-row-logout .t-btn { display: block; font-size: 12px; }
.toggle-all-menu .profile-info { border-bottom: 1px solid #ddd; padding: 29px 22px; text-align: left; margin-bottom: 8px; overflow: hidden; min-height: 82px; }
.toggle-all-menu .profile-info .name { font-size: 20px; color: #0e86b6; margin-top: 4px; }
.toggle-all-menu .profile-info .m-num { font-size: 12px; color: #999; margin: -1px 0 8px; }
.toggle-all-menu .profile-info .photo { width: 82px; height: 82px; float: left; overflow: hidden; position: relative; margin-right: 20px; }
.toggle-all-menu .profile-info .photo:before { content: ""; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: url("/asset/images/layout/profile-photo.png") no-repeat; background-size: 100%; }
.toggle-all-menu ul * { vertical-align: middle; }
.toggle-all-menu ul li { position: relative; margin-bottom: 7px; }
.toggle-all-menu ul li .menu-step { display: block; font-size: 14.67px; padding: 9px 16px 9px 24px; color: #333; }
.toggle-all-menu ul li .ico { margin-right: 10px; }
.toggle-all-menu ul li .t-btn { position: absolute; top: 50%; margin-top: -10px; right: 16px; }
.toggle-all-menu ul li .ver-info { position: absolute; top: 50%; margin-top: -11px; right: 24px; font-size: 12px; }
.toggle-all-menu ul li .ver-info:before { content: ""; display: inline-block; position: relative; top: 4px; width: 17px; height: 17px; margin-right: 3px; background: url("/asset/images/ico/version.png") 0 50% no-repeat; background-size: 100%; }
.toggle-all-menu ul li.act a { background: #ddd; color: #0e86b6; }

.basic-menu { border-top: 1px solid #dbdbdb; padding: 0 10px; }
.basic-menu ul { overflow: hidden; }
.basic-menu li { float: left; width: 25%; font-size: 12.67px; text-align: center; }
.basic-menu .m-home { position: relative; top: 2px; }
.basic-menu a { display: block; padding: 14px 0 16px; position: relative; transition: all .5s ease; height: 47px; }
.basic-menu a:before, .basic-menu a:after { content: ''; display: block; position: absolute; bottom: 0; height: 3px; }
.basic-menu a:before { left: 0; width: 0; transition: width 0s ease, background .5s ease; }
.basic-menu a:after { right: 0; width: 0; background: #0e86b6; transition: width .5s ease; }
.basic-menu a.active { color: #0e86b6; font-weight: 600; }
.basic-menu a.active:before { width: 100%; background: #0e86b6; transition: width .5s ease; }
.basic-menu a.active:after { width: 100%; background: transparent; transition: all 0s ease; }
.basic-menu .reverse a:before { right: 0; left: inherit; width: 0; transition: width 0s ease; }
.basic-menu .reverse a:after { left: 0; right: inherit; width: 0; background: #0e86b6; transition: width .5s ease; }
.basic-menu .reverse a.active:before { width: 100%; background: #0e86b6; transition: width .5s ease; }
.basic-menu .reverse a.active:after { width: 100%; background: transparent; transition: width 0s ease; }

.wrap { background: #fff; }

@keyframes wave { 0% { transform: scale(0.8); opacity: 1; transform-origin: center; }
  100% { transform: scale(1.8); opacity: 0; transform-origin: center; } }
.pop-photo-crop { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 100; background: #fff; display: none; }
.pop-photo-crop section { height: 100%; position: relative; }
.pop-photo-crop .p-head, .pop-photo-crop .p-footer { background: #000; color: #fff; position: absolute; left: 0; right: 0; z-index: 101; }
.pop-photo-crop .p-head { color: #959595; font-size: 12.85px; top: 0; text-align: center; padding: 3px 0 5px; }
.pop-photo-crop .p-footer { bottom: 0; padding: 17px 15px 19px; }
.pop-photo-crop .p-footer button { font-size: 14px; color: #fff; float: right; background: transparent; }
.pop-photo-crop .p-footer button:first-child { float: left; }
.pop-photo-crop .p-body { height: 100%; }

.pop-voice { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 100; background: #fff; display: none; }
.pop-voice .p-head { position: absolute; left: 0; width: 100%; background: #fff; min-height: 56px; border-bottom: 1px solid #dbdbdb; z-index: 2; padding: 16px 20px; }
.pop-voice .p-head .head-in-box { position: relative; }
.pop-voice .p-head h1 { font-size: 17.33px; color: #000; font-weight: 500; text-align: center; }
.pop-voice .p-head .p-close { position: absolute; top: 50%; right: 0; margin-top: -7.5px; }
.pop-voice .p-body { height: 100%; padding-top: 58px; }
.pop-voice .out { display: table; width: 100%; height: 100%; }
.pop-voice .in { display: table-cell; vertical-align: middle; text-align: center; padding-bottom: 70px; }
.pop-voice .voice { height: 185px; }
.pop-voice .mic { position: relative; display: inline-block; width: 138px; height: 153px; text-align: center; background: url("/asset/images/common/mic.png") 50% no-repeat; background-size: 138px 153px; }
.pop-voice .mic:after { content: ""; position: relative; display: inline-block; width: 138px; height: 153px; background: 50%  no-repeat; background-size: 138px 153px; z-index: 3; }
.pop-voice p { position: relative; z-index: 2; color: #999; font-size: 21.33px; margin-top: 0; }
.pop-voice .ex-txt { font-size: 16px; margin-top: 2px; }
.pop-voice .btn-row { margin-top: 35px; }
.pop-voice .t-btn.ty1 { height: 35px; line-height: 35px; font-size: 17px; min-width: 170px; }
.pop-voice .re .mic:after { background-image: url("/asset/images/common/mic-re.png"); }
.pop-voice .ok p, .pop-voice .ing p { font-size: 28px; color: #333; font-weight: 500; margin-top: -2px; }
.pop-voice .ing .mic:before { content: ""; position: absolute; top: 50%; left: 50%; margin: -155px 0 0 -155px; display: block; width: 310px; height: 310px; background-size: 310px; z-index: 1; background-image: url("/asset/images/common/mic-bg-ing.png"); backface-visibility: hidden; opacity: 0; animation: wave 2s infinite ease-out; }
.pop-voice .ing .mic:after { background-image: url("/asset/images/common/mic-ing.png"); }
.pop-voice .ok .mic:after { background-image: url("/asset/images/common/mic-ok.png"); }
.pop-voice .waiting .mic:after { background-image: url("/asset/images/common/mic-ing.png"); }
.pop-voice .err .mic { background-image: url("/asset/images/common/error-ty2.png"); background-size: 70px; }

.pop-set { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 100; background: rgba(0, 0, 0, 0.8); display: none; }
.pop-set .out { display: table; width: 100%; height: 100%; }
.pop-set .in { display: table-cell; vertical-align: middle; text-align: center; }
.pop-set p { color: #fff; text-align: center; padding-top: 134px; font-size: 19px; background: url("/asset/images/common/pop-set.png") 50% 0 no-repeat; background-size: 110px; }
body.overlay:after { content: ""; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 900; background: #000; opacity: .5; }

.alert-pop { position: fixed; z-index: 901; width: 88%; max-width: 320px; left: 50%; top: 50%; background-color: #fff; display: none; }
.alert-pop .in { padding: 32px 0 0; }
.alert-pop h1 { font-size: 17.37px; text-align: center; font-weight: bold; color: #333; }
.alert-pop .msg { font-size: 14.03px; text-align: center; margin-top: 15px; color: #666; }
.alert-pop .btn-row { margin-top: 30px; text-align: center; border-top: 1px solid #ddd; }
.alert-pop .btn-row a { float: left; font-size: 17px; font-weight: bold; width: 100%; display: block; height: 51px; line-height: 51px; color: #006993; }
.alert-pop .btn-row a:hover { background: #006993; color: #fff; }
.alert-pop .btn-row.col2 a { width: 50%; }
.alert-pop .btn-row.col2 a + a { border-left: 1px solid #ddd; }

.pop-parking { position: fixed; top: 50%; left: 0; width: 100%; z-index: 100; display: none; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); }
.pop-parking:before { content: ''; position: fixed; top: 0; left: 0; width: 100%; height: 57px; background: transparent; }
.pop-parking .out { background: #fff; width: 85%; margin: 15px auto 0; position: relative; padding: 0; border: 1px solid #065a7b; box-shadow: 0 0 5px rgba(0, 0, 0, 0.3); padding: 20px 0 0; }
.pop-parking .p-head { position: relative; }
.pop-parking h1 { font-size: 15px; color: #0e86b6; text-align: center; font-weight: bold; }
.pop-parking h2 { font-size: 13px; color: #333; text-align: center; margin: 2px 0 17px; }
.pop-parking .close { position: absolute; top: 50%; margin-top: -7px; right: 0; }
.pop-parking .p-body { padding: 16px 30px; line-height: 1.2; margin: 0 24px; border-top: 1px solid #ddd; text-align: center; }
.pop-parking .row { color: #000; font-size: 15px; overflow: hidden; max-width: 180px; margin: 0 auto; }
.pop-parking .row + .row { margin-top: 18px; }
.pop-parking .row em, .pop-parking .row span { display: inline-block; vertical-align: top; }
.pop-parking .row em { margin-left: 30px; color: #0e86b6; font-weight: bold; }
.pop-parking .row em:before { content: ''; width: 9px; height: 13px; display: inline-block; margin-right: 8px; position: relative; top: 1px; background: url("/asset/images/ico/ico-parking.png") no-repeat; background-size: 100%; }
.pop-parking .p-foot { border-top: 1px solid #ddd; }
.pop-parking .p-foot button { width: 100%; height: 50px; line-height: 50px; font-size: 17px; background: #fff; }

.pop-allam { position: fixed; top: 57px; bottom: 0; left: 0; width: 100%; height: 100%; z-index: 100; background: rgba(0, 0, 0, 0.8); display: none; }
.pop-allam:before { content: ''; position: fixed; top: 0; left: 0; width: 100%; height: 57px; background: transparent; }
.pop-allam .out { background: #545450; border-radius: 7px; width: 90%; margin: 15px auto 0; position: relative; padding: 0 14px 14px; }
.pop-allam .p-head { position: relative; }
.pop-allam h1 { font-size: 18px; color: #fff; text-align: center; border-bottom: 1px solid #fff; padding: 10px 0; }
.pop-allam .close { position: absolute; top: 50%; margin-top: -7px; right: 0; }
.pop-allam .p-body { font-size: 15px; color: #fff; text-align: center; padding-top: 16px; line-height: 2; min-height: 144px; }

.pop-certify { position: fixed; top: 0; bottom: 0; left: 0; width: 100%; height: 100%; z-index: 100; background: rgba(0, 0, 0, 0.8); display: none; }
.pop-certify:before { content: ''; position: fixed; top: 0; left: 0; width: 100%; height: 57px; background: transparent; }
.pop-certify .out { background: #545450; border-radius: 7px; width: 90%; margin: 70px auto 0; position: relative; padding: 0 14px 20px; }
.pop-certify .p-head { position: relative; }
.pop-certify h1 { font-size: 18px; color: #fff; text-align: center; padding: 10px 0 0; }
.pop-certify .close { position: absolute; top: 50%; margin-top: -7px; right: 0; }
.pop-certify .w-list { padding: 0 10px; margin-top: 15px; }

.pop-alert { position: fixed; top: 50%; left: 0; width: 100%; z-index: 100; display: none; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); }
.pop-alert:before { content: ''; position: fixed; top: 0; left: 0; width: 100%; height: 57px; background: transparent; }
.pop-alert .out { background: #fff; width: 75%; margin: 15px auto 0; position: relative; border: 1px solid rgba(14, 134, 182, 0.5); box-shadow: 0 0 5px rgba(0, 0, 0, 0.3); padding: 20px 0 0; }
.pop-alert .p-head { position: relative; }
.pop-alert h1 { font-size: 15px; color: #0e86b6; text-align: center; font-weight: bold; }
.pop-alert .close { position: absolute; top: 50%; margin-top: -7px; right: 0; }
.pop-alert .p-body { padding: 12px 10px 19px; line-height: 1.4; text-align: center; }
.pop-alert .txt { font-size: 13px; color: #333; }
.pop-alert .input-row { margin-top: 12px; }
.pop-alert .input-row input { width: 100%; border: 1px solid #ddd; color: #333; height: 30px; line-height: 30px; text-align: left; padding: 0 0 0 12px; background: #f6f6f6; }
.pop-alert .p-foot { border-top: 1px solid #ddd; display: table; width: 100%; height: 50px; table-layout: fixed; }
.pop-alert .p-foot a, .pop-alert .p-foot span { display: table-cell; vertical-align: middle; height: 100%; text-align: center; line-height: 1.2; font-size: 14.67px; color: #333; background: #fff; border-left: 1px solid #ddd; }
.pop-alert .p-foot a:first-child, .pop-alert .p-foot span:first-child { border-left-width: 0; }
.pop-alert .p-foot button { width: 100%; height: 50px; font-size: 15px; background: #fff; line-height: 1.2; }

.layer-pop { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 100; display: none; }
.layer-pop .outer { display: table; width: 100%; height: 100%; }
.layer-pop .inner { display: table-cell; vertical-align: middle; height: 100%; }
.layer-pop .box { display: block; border: 1px solid #065a7b; box-shadow: 0 0 5px rgba(0, 0, 0, 0.3); background: #fff; }
.layer-pop .btn-row { display: block; border-top: 1px solid #ddd; margin: 0 -12px; }
.layer-pop .btn-row a, .layer-pop .btn-row button { display: block; width: 100%; height: 50px; line-height: 50px; text-align: center; font-size: 16px; color: #333; -webkit-transition: all 0.25s ease-in-out; -moz-transition: all 0.25s ease-in-out; transition: all 0.25s ease-in-out; }
.layer-pop .btn-row a:active, .layer-pop .btn-row a.act, .layer-pop .btn-row button:active, .layer-pop .btn-row button.act { background: #289fcf; color: #fff; }

.pop-terms h1 { font-size: 15px; color: #289fcf; padding: 20px 0 16px; text-align: center; font-weight: bold; }
.pop-terms .box { margin: 0 20px; padding: 0 12px; overflow: hidden; }
.pop-terms .accept-terms { text-align: center; border-top: 1px solid #ddd; padding: 4px 0 3px; }
.pop-terms .terms-rows { border: solid #ddd; border-width: 1px 0; margin: -1px 0; padding: 0 0 15px; white-space: pre-line; max-height: 360px; overflow-y: scroll; line-height: 1.5; }

.page { position: relative; }
.page .top-txt { position: relative; font-size: 12.66px; padding: 5px 0 6px; }
.page .top-txt h2 { font-weight: 500; }
.page .top-txt .t-btn { position: absolute; right: 0; top: 50%; margin-top: -13px; }
.page .top-txt .page-num em { color: #0e86b6; font-weight: 500; }
.page .smart-main-sec { height: 100%; overflow-y: scroll; padding: 10px; }
.page .btn-add-row { position: absolute; right: 5px; bottom: 5px; z-index: 10; }

.card-box { color: #fff; margin-top: 10px; padding: 9px 0 0; position: relative; background-repeat: no-repeat !important; background-size: 100% auto !important; }
.card-box:first-child { margin-top: 0; }
.card-box.w-ty1 { background: #369bdb url("/asset/images/main/weather-bg1.jpg"); }
.card-box.w-ty2 { background: #6999ba url("/asset/images/main/weather-bg2.jpg"); }
.card-box.w-ty3 { background: #a388ad url("/asset/images/main/weather-bg3.jpg"); }
.card-box.w-ty4 { background: #51739e url("/asset/images/main/weather-bg4.jpg"); }
.card-box.d-ty1 { background: #2c99bd url("/asset/images/main/dust-bg1.jpg"); }
.card-box.d-ty2 { background: #35a0c0 url("/asset/images/main/dust-bg2.jpg"); }
.card-box.d-ty3 { background: #447bac url("/asset/images/main/dust-bg3.jpg"); }
.card-box.d-ty4 { background: #596aad url("/asset/images/main/dust-bg4.jpg"); }
.card-box.t-ty1 { background: #155c8a url("/asset/images/main/time-bg1.jpg"); }
.card-box.t-ty2 { background: #5aa19d url("/asset/images/main/time-bg2.jpg"); }
.card-box.t-ty3 { background: #bbca81 url("/asset/images/main/time-bg3.jpg"); }
.card-box.t-ty4 { background: #e29c8a url("/asset/images/main/time-bg4.jpg"); }
.card-box.t-ty5 { background: #7788d7 url("/asset/images/main/time-bg5.jpg"); }
.card-box h3 { font-size: 12.67px; margin: 0 13px; text-align: left; }
.card-box h3 * { vertical-align: top; }
.card-box h3 strong { margin-right: 5px; }
.card-box h3 .ico { position: relative; }
.card-box h3 .ico.card-h-ty1 { margin-right: 12px; top: 1px; }
.card-box h3 .ico.card-h-ty2 { margin-right: 8px; }
.card-box h3 .ico.card-h-ty3 { margin-right: 10px; }
.card-box .bt-refresh, .card-box .bt-go { display: inline-block; position: absolute; top: 8px; right: 12px; background: transparent; }
.card-box .top-info { text-align: left; }
.card-box .top-info p { font-size: 19px; font-weight: 100; line-height: 1.2; }
.card-box .act-chk { position: absolute; top: 13px; right: 14px; }
.card-box .act-chk .t-btn { height: 21px; padding: 0 10px !important; font-size: 10.67px; min-width: inherit !important; margin: 0 2px !important; --capital-height: 21; --line-height: 1; line-height: calc(var(--computedLineheight) * 1px); }
.card-box .act-chk .t-btn .ico { vertical-align: top; position: relative; top: 1px; }
.card-box.weather .weather-img { text-align: left; margin: -1px 0 1px; overflow: hidden; padding: 15px 0; }
.card-box.weather .weather-img img { width: 123px; height: 121px; float: left; }
.card-box.weather .weather-img p { text-align: left; margin: 0; display: table-cell; height: 121px; vertical-align: middle; }
@media (max-width: 355px) { .card-box.weather .weather-img { margin-left: -10px; }
  .card-box.weather .weather-img img { margin-right: -10px; }
  .card-box.weather .weather-img p { font-size: 18px; } }
.card-box.dust .top-info { text-align: center; margin-bottom: 15px; height: 137px; }
.card-box.dust .top-info p { text-align: center; margin-bottom: 13px; }
.card-box.dust .weather-table { margin-top: -19px; }
.card-box.dust.d-ty1 .weather-table { margin-top: 0; }
.card-box .weather-table li, .card-box .weather-table .label { border: 1px solid white; border: 1px solid rgba(255, 255, 255, 0.2); -webkit-background-clip: padding-box; /* for Safari */ background-clip: padding-box; /* for IE9+, Firefox 4+, Opera, Chrome */ }
.card-box .weather-table ul { overflow: hidden; }
.card-box .weather-table ul.col3 li { width: 33.3333%; }
.card-box .weather-table ul.col4 li { width: 25%; }
.card-box .weather-table li { float: left; text-align: center; color: #fff; border-width: 1px 0 0 1px; }
.card-box .weather-table li:first-child { border-left-width: 0; }
.card-box .weather-table .label { font-size: 12px; border-width: 0 0 1px 0; padding: 8px 0; }
.card-box .weather-table .row { font-size: 14px; height: 41px; padding: 4px 0 1px; line-height: 32px; }
.card-box .weather-table .row * { vertical-align: top; }
.card-box .weather-table .num { font-family: "din"; font-size: 23.33px; }
.card-box .weather-table .txt { font-size: 16px; display: block; }
.card-box .weather-table .humidity-unit { font-size: 8.67px; vertical-align: super; position: relative; top: -2px; margin-left: 2px; }
.card-box.time-box { margin-top: 10px; padding-bottom: 15px; }
.card-box.time-box h3 { margin: 0 11px; }
.card-box.time-box .top-info { text-align: center; }
.card-box.time-box .top-info p { text-align: center; margin: 50px 0 12px; height: 52px; }
.card-box.time-box .top-info p > span { line-height: 1.4; display: block; font-size: 10.67px; margin-top: 5px; }
.card-box.time-box.small .top-info p { margin: 28px 0 0; height: inherit; }
.card-box.time-box.small .top-info.detail p { margin: 14px 0; }
.card-box.disable, .card-box.edit { background: #fff; border: 1px solid #94a4aa; color: #94a4aa; padding: 15px !important; }
.card-box.disable .top-mode-info, .card-box.edit .top-mode-info { border-bottom-color: #dfe4e5; }
.card-box.edit { color: #333; }
.card-box .top-mode-info { text-align: left; padding: 0 10px 10px; border-bottom: 1px solid rgba(255, 255, 255, 0.5); }
.card-box .top-mode-info h3 { font-size: 20px; margin: -4px; font-weight: 500; margin-bottom: 6px; }
.card-box .top-mode-info h3 a { display: inline-block; position: relative; top: 5px; margin-left: 5px; }
.card-box .top-mode-info p { font-size: 14px; }
.card-box .top-mode-info p .ico { position: relative; top: 5px; margin-right: 10px; }
.card-box .top-mode-info p.off { opacity: 0.3; }
.card-box .top-mode-info .btn-row { margin-left: -10px !important; }
.card-box .top-mode-info .btn-row, .card-box .mode-detail .btn-row { text-align: left !important; margin: 10px 0 7px; }
.card-box .top-mode-info .btn-row .t-btn, .card-box .mode-detail .btn-row .t-btn { margin: 0; min-width: inherit; padding: 0 10px; }
.card-box .top-mode-info .btn-row .t-btn .ico, .card-box .mode-detail .btn-row .t-btn .ico { position: relative; top: 0; margin: 0 0 0 10px; }
.card-box .mode-setting-txt { text-align: center; }
.card-box .mode-setting-txt p { font-size: 18.68px; font-weight: 100; margin-top: 31px; padding-bottom: 80px; background: url("/asset/images/main/mode-setting.png") 50% 100% no-repeat; background-size: 70px; }
.card-box .mode-setting-txt span { font-size: 12.67px; display: block; margin-top: 8px; font-weight: 100; }
.card-box .mode-setting-txt .btn-row { margin-top: 23px; }
.card-box .mode-setting-txt .btn-row .t-btn { padding: 0; min-width: 82px; margin: 0 2px; }
.card-box .chk-list { text-align: center; margin: -2px; }
.card-box .chk-list span { display: inline-block; margin: 0 4px; }
.card-box .chk-list em { display: block; font-size: 10px; margin-top: -10px; }
.small .card-box .chk-list { margin-top: -4px; }
.small .card-box .chk-list span { margin-top: 8px; }
.small .card-box .chk-list em { margin-top: -5px; }
.smart-main-sec .card-box, .smart-edit-sec .card-box { padding: 16px; }
.smart-main-sec .card-box .mode-setting-txt p, .smart-edit-sec .card-box .mode-setting-txt p { margin-top: 9px; }
.smart-main-sec .card-box .btn-row, .smart-edit-sec .card-box .btn-row { text-align: center; overflow: hidden; }
.smart-main-sec .card-box .bt-edit, .smart-edit-sec .card-box .bt-edit { min-width: 50px !important; }
.smart-main-sec .card-box .t-btn, .smart-edit-sec .card-box .t-btn { padding: 0; min-width: 90px; margin: 0 2px; vertical-align: top; }

.info-step { text-align: center; line-height: 0; margin: 17px 0 1px; }
.info-step p { white-space: nowrap; display: inline-block; color: #fff; vertical-align: top; min-width: 36px; height: 36px; border-radius: 20px; margin: 0 3px; border: 1px solid #fff; opacity: 0.2 !important; }
.info-step p:before { content: ""; height: 34px; width: 1px; display: inline-block; vertical-align: middle; margin-left: -1px; }
.info-step p * { font-size: 12.67px; line-height: 1.1; vertical-align: middle; display: inline-block; }
.info-step p em { margin-left: 10px; display: none; }
.info-step p:nth-child(1) { background: #2ba4f0; }
.info-step p:nth-child(2) { background: #17c274; }
.info-step p:nth-child(3) { background: #f2a81a; }
.info-step p:nth-child(4) { background: #db3f64; }
.d-ty2 .info-step, .d-ty3 .info-step, .d-ty4 .info-step { margin-top: 36px; }
.d-ty1 .info-step p:nth-child(1), .d-ty2 .info-step p:nth-child(2), .d-ty3 .info-step p:nth-child(3), .d-ty4 .info-step p:nth-child(4) { padding: 0 15px; opacity: 1 !important; }
.d-ty1 .info-step p:nth-child(1) em, .d-ty2 .info-step p:nth-child(2) em, .d-ty3 .info-step p:nth-child(3) em, .d-ty4 .info-step p:nth-child(4) em { display: inline-block; }

/* ?ㅻ쭏??耳??*/
.mode-detail { text-align: center; margin: 22px 0 13px; }
.mode-detail .item { display: table; position: relative; text-align: left; font-size: 12.67px; margin-bottom: 9px; }
.mode-detail .item > div { display: table-cell; vertical-align: middle; padding-right: 10px; }
.mode-detail strong { font-size: 15px; }
.mode-detail p { position: relative; top: -1px; }
.mode-detail em { font-family: "din"; color: #fbe300; margin-left: 6px; letter-spacing: 0; font-weight: bold; position: relative; top: -1px; }
.mode-detail span { display: block; color: #c0d4e1; position: relative; top: -3px; }
.disable .mode-detail * { color: #94a4aa; }
.smart-edit-sec .mode-detail .item:last-child { margin-bottom: 0; }
.edit .mode-detail * { color: #333; }
.edit .mode-detail em { color: #aaa; }
.edit .mode-detail em.on { color: #0e86b6; }

.smart-edit-sec .btn-add-row { position: fixed; right: 5px; bottom: 5px; }

/* ?ㅻ궡?쒖뼱 */
.controls-list { overflow: hidden; position: relative; }
.controls-list h3 { font-size: 15px; padding: 4px 0 13px; font-weight: 500; }
.controls-list .act-chk { position: absolute; top: 7px; right: 2px; }
.controls-list ul { background: #307f9f url("/asset/images/main/controls-bg.jpg") no-repeat; background-size: 100% auto; overflow: hidden; margin: 0 -1px -1px 0; }
.controls-list li { float: left; width: 33.33%; text-align: center; position: relative; }
.controls-list a { display: block; border: 1px solid #5e97ae; margin: -1px 0 0 -1px; padding: 8px 0 18px; }
.controls-list span { display: block; font-size: 11.33px; color: #fff; margin-top: -4px; padding-right: 2px; }
.controls-list em { color: #fff; font-size: 10px; position: absolute; top: 50%; left: 50%; display: block; width: 15px; height: 15px; text-align: center; border-radius: 10px; padding-right: 2px; background: #e70033; margin: -36px 0 0 18px; /* font metrics */ --fm-emSquare: 1; --fm-capitalHeight: 0.68; --fm-descender: 0.54; --fm-ascender: 1.1; --fm-linegap: 0; /* compute needed values */ --lineheightNormal: (var(--fm-ascender) + var(--fm-descender) + var(--fm-linegap)); --distanceBottom: (var(--fm-descender)); --distanceTop: (var(--fm-ascender) - var(--fm-capitalHeight)); --contentArea: (var(--lineheightNormal) * var(--computedFontSize)); --valign: ((var(--distanceBottom) - var(--distanceTop)) * var(--computedFontSize)); --computedFontSize: (var(--capital-height) / var(--fm-capitalHeight)); --computedLineheight: ((var(--line-height) * var(--capital-height)) - var(--valign)); --capital-height: 15; --line-height: 1.2; line-height: calc(var(--computedLineheight) * 1px); }
.controls-list .is-error:after, .controls-list .is-new:after, .controls-list .is-on:after { content: ''; position: absolute; top: 50%; left: 50%; margin: -36px 0 0 18px; display: inline-block; width: 15px; height: 15px; }
.controls-list .is-error:after { width: 17px; background: url("/asset/images/ico/is-error.png"); background-size: cover; }
.controls-list .is-new:after { background: url("/asset/images/ico/is-new.png"); background-size: cover; }
.controls-list .is-on:after { background: url("/asset/images/ico/is-on.png"); background-size: cover; }

/* ?ㅻ쭏?몄젣???щ씪?대뱶 */
.time-mode-slide { position: relative; }
.time-mode-slide .bx-pager { position: absolute; bottom: 13px; left: 0; right: 0; text-align: center; }
.time-mode-slide .bx-pager .bx-pager-item { display: inline-block; width: 7px; height: 7px; margin: 0 3px; }
.time-mode-slide .bx-pager a { display: block; width: 100%; height: 100%; text-indent: -100px; overflow: hidden; border: 1px solid #fff; border-radius: 10px; }
.time-mode-slide .bx-pager a.active { background: #fff; }
.time-mode-slide .bx-wrapper .card-box.time-box { padding-bottom: 45px; }

.warning .ico { position: relative; text-indent: 0; font-size: 0; }
.warning .ico:before { content: '-'; position: absolute; bottom: 2px; right: 2px; width: 16px; height: 16px; background: url("/asset/images/common/warning.png"); background-size: 100%; }

.search { border-bottom: 1px solid #dbdbdb; padding: 14px; }
.search .in { position: relative; }
.search .i-btn { position: absolute; top: 0; right: 0; }
.search input { width: 100%; font-size: 14px; height: 30px; line-height: 30px; border: 1px solid; padding: 0 13px; }
.search input::-webkit-input-placeholder { color: #b4c1c7; }
.search input::-moz-placeholder { color: #b4c1c7; }
.search input:-moz-placeholder { color: #b4c1c7; }
.search input:-ms-input-placeholder { color: #b4c1c7; }

.output-family-list li { position: relative; border-bottom: 1px solid #f4f4f4; }
.output-family-list li input { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.output-family-list li em { color: #006993; }
.output-family-list li label { display: block; font-size: 16px; padding: 11px 26px 13px; font-weight: 500; }
.output-family-list li label span { margin-left: 8px; color: #888; }
.output-family-list li input:checked + label { background: #ddd; }

.family-sec .search .in { padding-right: 44px; }
.family-sec .search input { border-radius: 15px 0 0 15px; border-color: #0e86b6; }
.family-sec .charge { font-size: 12.66px; color: #0e86b6; }
.family-sec .charge:before { content: ""; display: inline-block; width: 17px; height: 17px; border-radius: 9px; position: relative; top: 3px; margin-right: 5px; background: #0e86b6 url("/asset/images/ico/master.png") 50% no-repeat; background-size: 100% !important; }
.family-sec .setting .charge:before { border: 1px solid #ddd; width: 18px; height: 18px; background: #fff url("/asset/images/ico/master2.png") 50% no-repeat; }

.info-item, .family-list li { padding: 18px 22px; position: relative; border-bottom: 1px solid #f4f4f4; }
.info-item::after, .family-list li::after { content: ''; display: block; clear: both; }
.info-item .photo, .family-list li .photo { float: left; margin-right: 8px; }
.info-item .name, .family-list li .name { font-size: 20px; font-weight: 500; margin-top: 3px; }
.info-item .txt, .family-list li .txt { font-size: 12.66px; color: #888; }
.info-item .setting, .family-list li .setting { position: absolute; top: 50%; right: 17px; margin-top: -9px; }
.info-item .setting *, .family-list li .setting * { vertical-align: top; }
.info-item .setting .charge:before, .family-list li .setting .charge:before { top: 0; }
.info-item.user .name, .family-list li.user .name { margin-top: 10px; }
.info-item.master .name, .family-list li.master .name { margin-top: 19px; }
.info-item.master .name .charge, .family-list li.master .name .charge { font-size: 10.99px; margin-right: 6px; position: relative; top: -2px; }
.info-item.master .name .charge:before, .family-list li.master .name .charge:before { top: 4px; margin-right: 3px; }

.family-list li { border-bottom-width: 0; padding-top: 8px; padding-bottom: 8px; }
.family-list li .name { font-size: 16px; margin-top: 6px; }

.chk-setting-box, .room-setting li, .allim-sec dt, .allim-sec dd, .control-sec li, .control-sec .tit { font-size: 16px; padding: 16px 0; position: relative; }
.chk-setting-box .label, .room-setting li .label, .allim-sec dt .label, .allim-sec dd .label, .control-sec li .label, .control-sec .tit .label { font-weight: 500; padding-left: 10px; }
.chk-setting-box .row, .room-setting li .row, .allim-sec dt .row, .allim-sec dd .row, .control-sec li .row, .control-sec .tit .row { position: absolute; top: 50%; margin-top: -11px; right: 0; }

.room-setting { margin: 4px 16px 0; }

.allim-sec dt .label, .allim-sec .tit .label, .control-sec dt .label, .control-sec .tit .label { padding-left: 0; }
.allim-sec dt .label:before, .allim-sec .tit .label:before, .control-sec dt .label:before, .control-sec .tit .label:before { content: "\2022"; font-size: 12px; margin-right: 6px; position: relative; top: -3px; }
.allim-sec dt .note, .allim-sec .tit .note, .control-sec dt .note, .control-sec .tit .note { font-size: 12.67px; color: #0e86b6; padding-left: 10px; }

.time-inputs { font-size: 16px; padding: 2px 0 20px; }
.time-inputs .ui-input-text { display: inline-block; }
.time-inputs * { vertical-align: top; }
.time-inputs > div { margin: 5px 0 24px; }
.time-inputs .cus-chk { top: -5px; }
.time-inputs .cus-chk + input { margin-left: 0 !important; }
.time-inputs input[type="text"], .time-inputs input[type="time"] { margin: 0 5px; position: relative; top: -4px; border: 1px solid #ddd; width: 90px !important; height: 31px; font-size: 13px; line-height: 31px; text-align: center; }
.time-inputs input[type="text"]:disabled, .time-inputs input[type="time"]:disabled { color: #ccc; background: #fff; }
.time-inputs input:first-child { margin-left: 0; }

.allim-sec .part-setting { margin: 4px 16px 12px; }
.allim-sec .part-setting dt { border-bottom: 1px solid #f4f4f4; padding-bottom: 22px; }
.allim-sec .time-setting { border-bottom: 1px solid #ddd; padding: 9px 16px 0; }
.allim-sec.disable dt .note { color: #888; }
.allim-sec.disable dd, .allim-sec.disable dd .label { color: #ccc; }
.allim-sec.disable .part-setting .label { color: #ccc; }

.control-sec { overflow: hidden; }
.control-sec li, .control-sec .tit { padding: 20px 16px 22px; }
.control-sec li .note, .control-sec .tit .note { color: #888; }
.control-sec .dt { padding-bottom: 24px; }
.control-sec li { background: #fff; border: solid #f4f4f4; border-width: 1px 0; margin-top: -1px; }
.control-sec li .label { font-size: 15px; }
.control-sec li .row { margin-right: 16px; }
.control-sec li .slideCheck { margin-right: 10px; }
.control-sec li .order { position: relative; top: -5px; }
.control-sec .ui-sortable-helper { border: 2px solid #2d97b1; -webkit-box-shadow: 0px 12px 10px -4px rgba(0, 0, 0, 0.3); -moz-box-shadow: 0px 12px 10px -4px rgba(0, 0, 0, 0.3); box-shadow: 0px 12px 10px -4px rgba(0, 0, 0, 0.3); }

.event-sec { background: #fff; }
.event-sec dl { border: 1px solid #ddd; margin-top: -1px; padding: 12px 24px 10px; }
.event-sec dl:first-child { margin-top: 0; }
.event-sec dl dt { position: relative; padding-left: 9px; margin-left: -9px; font-size: 12.67px; color: #84969d; font-weight: 500; margin-bottom: 10px; }
.event-sec dl dt:before { content: "\2022"; position: absolute; left: 0; top: 0; }
.event-sec dl dd { font-size: 14px; margin-bottom: 14px; }
.event-sec dl dd .time { font-size: 12.67px; display: block; color: #888; }
.event-sec dl.on { border: 2px solid #0e86b6; position: relative; z-index: 2; }
.event-sec dl.on dt { color: #0e86b6; }

.set-tab { overflow: hidden; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2); text-align: center; position: relative; z-index: 2; }
.set-tab:before { content: ""; display: inline-block; width: 14px; height: 40px; position: absolute; left: 50%; top: 0; background-size: cover !important; z-index: 2; }
.set-tab span { float: left; width: 50%; color: #96a4a9; font-size: 14px; height: 40px; border: solid #ddd; border-width: 1px 0; /* font metrics */ --fm-emSquare: 1; --fm-capitalHeight: 0.68; --fm-descender: 0.54; --fm-ascender: 1.1; --fm-linegap: 0; /* compute needed values */ --lineheightNormal: (var(--fm-ascender) + var(--fm-descender) + var(--fm-linegap)); --distanceBottom: (var(--fm-descender)); --distanceTop: (var(--fm-ascender) - var(--fm-capitalHeight)); --contentArea: (var(--lineheightNormal) * var(--computedFontSize)); --valign: ((var(--distanceBottom) - var(--distanceTop)) * var(--computedFontSize)); --computedFontSize: (var(--capital-height) / var(--fm-capitalHeight)); --computedLineheight: ((var(--line-height) * var(--capital-height)) - var(--valign)); --capital-height: 40; --line-height: 1.1; line-height: calc(var(--computedLineheight) * 1px); }
.set-tab em { display: inline-block; margin-right: 6px; width: 22px; height: 22px; padding-right: 1px; font-family: "din"; font-size: 15.33px; border: 1px solid #96a4a9; border-radius: 11px; vertical-align: middle; /* font metrics */ --fm-emSquare: 1; --fm-capitalHeight: 0.68; --fm-descender: 0.54; --fm-ascender: 1.1; --fm-linegap: 0; /* compute needed values */ --lineheightNormal: (var(--fm-ascender) + var(--fm-descender) + var(--fm-linegap)); --distanceBottom: (var(--fm-descender)); --distanceTop: (var(--fm-ascender) - var(--fm-capitalHeight)); --contentArea: (var(--lineheightNormal) * var(--computedFontSize)); --valign: ((var(--distanceBottom) - var(--distanceTop)) * var(--computedFontSize)); --computedFontSize: (var(--capital-height) / var(--fm-capitalHeight)); --computedLineheight: ((var(--line-height) * var(--capital-height)) - var(--valign)); --capital-height: 22; --line-height: 1.2; line-height: calc(var(--computedLineheight) * 1px); }
.set-tab.step1 span:nth-child(1) { color: #fff; background: #2d97b1; border-color: #2d97b1; }
.set-tab.step1 span:nth-child(1) em { border: 2px solid #fff; }
.set-tab.step1:before { background: url("/asset/images/common/set-tab-step1.png") 0 0 no-repeat; }
.set-tab.step2 em { border-width: 2px; line-height: 18px; }
.set-tab.step2 span:nth-child(1) { color: #388da2; background: #075970; border-color: #075970; z-index: 2; }
.set-tab.step2 span:nth-child(1) em { border-color: #388da2; }
.set-tab.step2 span:nth-child(2) { color: #fff; background: #2d97b1; border-color: #2d97b1; }
.set-tab.step2 span:nth-child(2) em { border-color: #fff; }
.set-tab.step2:before { background: url("/asset/images/common/set-tab-step2.png") 0 0 no-repeat; }

.smart-sec .search { border-bottom: none; }
.smart-sec .search .in { height: 32px; line-height: 32px; }
.smart-sec .search input { border-color: #ddd; background: #f6f6f6; }
.smart-sec .search p { font-size: 16px; color: #2d97b1; padding: 0 6px; }
.smart-sec .sel-list { height: 50px; line-height: 50px; margin-top: 4px; }
.smart-sec .sel-list .ico { position: absolute; top: 50%; left: 24px; margin-top: -20px; }
.smart-sec .sel-list .ico.t-mode { margin-top: -24px; }
.smart-sec .sel-list li { border-bottom: 1px solid #ddd; font-size: 15px; position: relative; }
.smart-sec .sel-list li.ok:after { content: ""; position: absolute; top: 50%; right: 16px; margin-top: -10px; width: 20px; height: 20px; background: url("/asset/images/ico/setting-ok.png") 0 0 no-repeat; background-size: 20px; }
.smart-sec .sel-list a { display: block; padding: 8px 16px 7px 80px; color: #333; font-weight: bold; position: relative; }
.smart-sec .sel-list .row { padding: 8px 16px 7px 80px; }
.smart-sec .sel-list .row a { display: inline-block; padding: 0; position: static; }
.smart-sec .sel-list .row .slideCheck { float: right; margin-top: 14px; }

.fun-setting { margin: 6px 0 9px; }
.fun-setting .time-inputs { margin: 18px 0 0 10px; padding: 0; }
.fun-setting ul { padding: 0 16px; border-top: 1px solid #ddd; }
.fun-setting ul:first-child { border-top: none; }
.fun-setting li { position: relative; padding: 8px 0; font-size: 16px; height: 55px; }
.fun-setting li.arrow-row { height: auto; padding: 19px 0 20px; }
.fun-setting li.top-row { padding: 18px 0; height: auto; }
.fun-setting li.all-row { border-bottom: 1px solid #ddd; padding: 8px 0 26px; margin-bottom: 4px; height: auto; position: relative; }
.fun-setting li.all-row .title { position: relative; top: 4px; }
.fun-setting li.all-row .note { position: absolute; top: 33px; left: 0; }
.fun-setting li.all-row .tip { top: 33px; padding-left: 9px; }
.fun-setting li.all-row .tip + .title { top: -4px; }
.fun-setting .title { font-size: 16px; font-weight: 500; display: block; margin-top: 8px; }
.fun-setting .title:before { content: "\2022"; font-size: 12px; margin-right: 6px; position: relative; top: -3px; }
.fun-setting .label { font-weight: 500; display: inline-block; width: 75px; margin-top: 8px; }
.fun-setting .note { font-size: 12.67px; color: #888; padding-left: 9px; }
.fun-setting .note span:nth-child(1) { color: #0e86b6 !important; display: block; }
.fun-setting .note span:nth-child(2) { color: #888 !important; display: none; }
.fun-setting .tip { font-size: 12.67px; color: #888; position: absolute; top: 29px; left: 0; }
.fun-setting .tip + .label { margin-top: 0; }
.fun-setting .thick-chk { position: absolute; top: 50%; left: 75px; margin-top: -13px; }
.fun-setting .ab-chk { position: absolute; top: 50%; right: 0; margin-top: -15px; height: 30px; }
.fun-setting .ab-chk * { vertical-align: top; }
.fun-setting .ab-chk .slideCheck { margin-top: 4px; }
.fun-setting .top-row .title { margin-top: 0; }
.fun-setting .top-row .ab-chk { top: 16px; margin-top: 0; }
.fun-setting input[type="text"] { border: 1px solid #ddd; text-align: center; font-size: 24px; height: 30px; line-height: 30px; width: 45px; margin-right: 5px; }
.fun-setting input[type="text"]:disabled { color: #ccc; background: #fff; }
.fun-setting.disable *, .fun-setting .disable * { color: #ccc; }
.fun-setting.disable .title, .fun-setting.disable .label, .fun-setting .disable .title, .fun-setting .disable .label { font-weight: normal; }
.fun-setting.disable .top-row .title, .fun-setting .disable .top-row .title { color: #333; font-weight: 500; }
.fun-setting.disable .note span:nth-child(1), .fun-setting .disable .note span:nth-child(1) { display: none; }
.fun-setting.disable .note span:nth-child(2), .fun-setting .disable .note span:nth-child(2) { display: block; }
.fun-setting .tb li { display: table; table-layout: fixed; width: 100%; height: 55px; }
.fun-setting .tb li.all-row { padding: 0; height: 65px; }
.fun-setting .tb li.all-row .title { position: static; margin-top: 0; }
.fun-setting .tb li.on .tip { display: none; }
.fun-setting .tb .label, .fun-setting .tb .ad-chk { display: table-cell; position: static; vertical-align: middle; }
.fun-setting .tb .label { text-align: left; }
.fun-setting .tb .tip { position: static; }

.smart-if-set { position: relative; }
.smart-if-set .tit, .smart-if-set .label { font-weight: 500; display: block; }
.smart-if-set .tit:before, .smart-if-set .label:before { content: "\2022"; font-size: 12px; margin-right: 6px; position: relative; top: -3px; }
.smart-if-set .tit { font-size: 16px; border-bottom: 1px solid #ddd; padding: 24px 16px 23px; }
.smart-if-set .label { font-size: 13px; color: #84969d; padding: 18px 16px 12px; }
.smart-if-set .top-check { position: absolute; top: 23px; right: 16px; }
.smart-if-set dl { margin-top: -1px; }
.smart-if-set dt { border-top: 1px solid #ddd; }
.smart-if-set dd { padding: 0 16px; }
.smart-if-set dd.days { margin-bottom: 11px; }
.smart-if-set ul { border-top: 1px solid #ddd; padding: 0 16px; margin-top: -1px; }
.smart-if-set li { font-size: 16px; line-height: 30px; }
.smart-if-set li * { vertical-align: top; }
.smart-if-set li:first-child { border-top: none !important; }
.smart-if-set li input[type="text"] { border: 1px solid #ddd; text-align: center; font-size: 24px; height: 30px; line-height: 30px; }
.smart-if-set li input[type="text"]:disabled { color: #ccc; background: #fff; }
.smart-if-set .day-group { margin-bottom: 10px; }
.smart-if-set .time-inputs { padding-bottom: 19px; }
.smart-if-set .row { text-align: right; padding: 16px 0; overflow: hidden; }
.smart-if-set .row em { float: left; font-size: 16px; color: #333; margin-left: 9px; font-weight: 500; }
.smart-if-set .row .slideCheck { float: right; }
.smart-if-set .temperature li { padding: 24px 0; border-top: 1px solid #ddd; }
.smart-if-set .temperature li input[type="text"] { font-size: 13px; margin: 0 3px; width: 48px; }
.smart-if-set .air li { font-size: 14px; font-weight: 500; padding: 29px 0 6px; }
.smart-if-set .air .chk-group { margin-top: 15px; }
.smart-if-set .air .range-row { margin-top: -4px; }
.smart-if-set .position { padding-top: 11px; padding-bottom: 11px; }
.smart-if-set .position li { padding: 12px 0; }
.smart-if-set .position li input[type="text"] { font-size: 13px; margin: 0 2px 0 5px; width: 48px; }

.version-sec { display: table; width: 100%; height: 100%; }
.version-sec > div { display: table-cell; vertical-align: middle; text-align: center; }
.version-sec p { color: #888; font-size: 12.67px; line-height: 1.8; padding-top: 80px; background: url("/asset/images/common/version-new.png") 50% 0 no-repeat; background-size: 110px 55px; }
.version-sec em { color: #333; }
.version-sec span { color: #0e86b6; display: block; }
.version-sec .t-btn { font-size: 17px; margin-top: 35px; height: 35px; line-height: 33px; }

.account-sec dd { padding: 13px 16px 16px; border-top: 1px solid rgba(221, 221, 221, 0.5); }
.account-sec input[type="text"], .account-sec input[type="tel"], .account-sec input[type="email"], .account-sec input[type="password"] { font-size: 14px; color: #333; width: 100%; height: 31px; line-height: 31px; border: 1px solid #ddd; padding: 0 10px; background: #f6f6f6; }
.account-sec input[type="text"]::-webkit-input-placeholder, .account-sec input[type="tel"]::-webkit-input-placeholder, .account-sec input[type="email"]::-webkit-input-placeholder, .account-sec input[type="password"]::-webkit-input-placeholder { color: #bbb; }
.account-sec input[type="text"]::-moz-placeholder, .account-sec input[type="tel"]::-moz-placeholder, .account-sec input[type="email"]::-moz-placeholder, .account-sec input[type="password"]::-moz-placeholder { color: #bbb; }
.account-sec input[type="text"]:-moz-placeholder, .account-sec input[type="tel"]:-moz-placeholder, .account-sec input[type="email"]:-moz-placeholder, .account-sec input[type="password"]:-moz-placeholder { color: #bbb; }
.account-sec input[type="text"]:-ms-input-placeholder, .account-sec input[type="tel"]:-ms-input-placeholder, .account-sec input[type="email"]:-ms-input-placeholder, .account-sec input[type="password"]:-ms-input-placeholder { color: #bbb; }
.account-sec input[type="text"]:disabled, .account-sec input[type="tel"]:disabled, .account-sec input[type="email"]:disabled, .account-sec input[type="password"]:disabled { color: #999; border-color: #d3d3d3; background: #dfdfdf; }
.account-sec .t-btn { font-size: 10.67px; line-height: 20px; height: 21px; padding: 0 10px; position: relative; top: -2px; margin-left: 8px; }
.account-sec .photo { position: relative; margin: 20px auto; width: 84px; height: 84px; display: block; }
.account-sec .photo span { display: block; width: 100%; height: 100%; border-radius: 42px; overflow: hidden; background-color: #ece9e9; }
.account-sec .photo:after { content: ""; display: block; overflow: hidden; position: absolute; top: 0; left: 0; z-index: 2; width: 84px; height: 84px; background: url("/asset/images/common/photo-box3.png") no-repeat; background-size: cover; }
.account-sec .photo button { position: absolute; top: 50%; left: 50%; z-index: 3; margin: 13px 0 0 13px; }
.account-sec .label { font-size: 13px; color: #84969d; }
.account-sec .label:before { content: "\2022"; font-size: 12px; margin-right: 6px; position: relative; top: -2px; }
.account-sec .row { margin-top: 14px; line-height: 31px; font-size: 14px; }
.account-sec .row p { padding: 0 10px; }
.account-sec .row + .row { margin-top: 12px; }

.voice-sec .t-btn { font-size: 10.67px; height: 21px; line-height: 20px; padding: 0 10px; vertical-align: top; margin-left: 2px; }
.voice-sec .t-btn .ico { position: relative; top: 1px; }
.voice-sec dt, .voice-sec dd { padding: 15px 16px 12px; position: relative; }
.voice-sec dt em, .voice-sec dd em { color: #0e86b6; }
.voice-sec dt { font-size: 14px; border-bottom: 1px solid rgba(221, 221, 221, 0.5); }
.voice-sec dd p { font-size: 16px; }
.voice-sec dd em { display: block; font-size: 12.67px; padding-left: 6px; }
.voice-sec dd .btn-group { display: none; }
.voice-sec dd.sel { background: #f1f1f1; }
.voice-sec .edit-sel { display: none; }
.voice-sec .btn-group { position: absolute; top: 50%; right: 16px; margin-top: -10px; }
.voice-sec .edit .edit-sel { display: block; }
.voice-sec .edit .total { display: none; }
.voice-sec .edit dd .btn-group { display: block; }

.smart-edit-sec { padding: 10px; background: url("/asset/images/layout/bg-content.png"); background-size: 10px; }
.smart-edit-sec .card-box.time-box:first-child { margin-top: 0; }

.avatar { background-size: cover !important; }
.avatar.photo { border: 1px solid #ddd; }
.avatar.photo.ms { border: none; }
.avatar.m-ty1 { background-image: url("/asset/images/avatar/avatar-m1.jpg") !important; }
.avatar.m-ty2 { background-image: url("/asset/images/avatar/avatar-m2.jpg") !important; }
.avatar.m-ty3 { background-image: url("/asset/images/avatar/avatar-m3.jpg") !important; }
.avatar.m-ty4 { background-image: url("/asset/images/avatar/avatar-m4.jpg") !important; }
.avatar.w-ty1 { background-image: url("/asset/images/avatar/avatar-w1.jpg") !important; }
.avatar.w-ty2 { background-image: url("/asset/images/avatar/avatar-w2.jpg") !important; }
.avatar.w-ty3 { background-image: url("/asset/images/avatar/avatar-w3.jpg") !important; }
.avatar.w-ty4 { background-image: url("/asset/images/avatar/avatar-w4.jpg") !important; }

.avatar-sel { padding: 16px 10px; }
.avatar-sel ul { overflow: hidden; }
.avatar-sel li { float: left; width: 50%; text-align: center; padding: 16px 0; }

.help-sec dl { border: 1px solid #ddd; border-width: 1px 0; }
.help-sec dl + dl { margin-top: -1px; }
.help-sec dt { position: relative; font-size: 15px; padding: 25px 42px 23px 27px; font-weight: 500; }
.help-sec dt:after { content: ''; position: absolute; top: 50%; right: 27px; margin-top: -4px; display: inline-block; width: 15px; height: 8px; background: url("/asset/images/ico/help-blet1.png") no-repeat; background-size: cover; }
.help-sec dd { background: #f8f8f8; color: #333; font-size: 13px; overflow: hidden; height: 0; }
.help-sec dl.hide dd { display: none; }
.help-sec dl.act dt:after { -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); }
.help-sec dl.act dd { display: block; height: inherit; padding: 24px 0 0; visibility: visible; }
.help-sec p { margin: 0 27px; }
.help-sec .txt2 { color: #0b85b5; font-size: 15px; font-weight: 500; margin-top: 24px; }
.help-sec .txt3 { margin-top: 9px; }
.help-sec .txt4 { background: #d6d7e5; border-radius: 3px; margin-top: 21px; padding: 9px 0 11px 50px; position: relative; }
.help-sec .txt4 span { display: inline-block; font-size: 12px; font-weight: 300; border-radius: 30px; text-align: center; color: #fff; position: absolute; top: 50%; left: 11px; margin-top: -15px; width: 30px; height: 30px; line-height: 30px; background: #5f6289; }
.help-sec .txt4 em { font-size: 14px; color: #5f6289; font-weight: 600; }
.help-sec .txt5 { margin-top: 12px; font-size: 12px; }
.help-sec .slider { margin-top: 18px; line-height: 0; position: relative; }
.help-sec .bx-controls a { display: block; overflow: hidden; text-align: left; text-indent: -1000px; }
.help-sec .bx-pager { position: absolute; left: 50%; bottom: 13px; display: inline-block; padding: 5px 9px; background: rgba(0, 0, 0, 0.2); border-radius: 20px; overflow: hidden; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%); }
.help-sec .bx-pager-item { float: left; margin: 0 3px; }
.help-sec .bx-pager-item a { width: 7px; height: 7px; border: 1px solid #7d7d7d; border-radius: 10px; }
.help-sec .bx-pager-item a.active { border-color: #fff; background: #fff; }
.help-sec .bx-controls-direction a { position: absolute; top: 50%; margin-top: -8px; width: 9px; height: 17px; background: url("/asset/images/ico/help-blet2.png") no-repeat; background-size: cover; }
.help-sec .bx-controls-direction a.bx-prev { left: 13px; -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); }
.help-sec .bx-controls-direction a.bx-next { right: 13px; }

.indoor-ctr-sec { height: 100%; position: relative; }
.indoor-ctr-sec > div { height: 100%; padding: 21px; }
.indoor-ctr-sec .inner { height: 100%; color: #fff; }
.indoor-ctr-sec.is-tab > div { padding-top: 67px; }
.indoor-ctr-sec.is-bt > div { padding-bottom: 76px; }
.indoor-ctr-sec .room-tab { position: absolute; top: 12px; left: 0; right: 0; width: 100%; text-align: center; border-bottom: 1px solid #dbdbdb; }
.indoor-ctr-sec .room-tab ul { position: relative; overflow-x: scroll; white-space: nowrap; padding: 0 10px; }
.indoor-ctr-sec .room-tab li { display: inline-block; min-width: 65px; }
.indoor-ctr-sec .room-tab a { display: block; font-size: 15px; padding: 2px 0 9px; color: #000000; opacity: 0.5; border-bottom: 3px solid transparent; }
.indoor-ctr-sec .room-tab a.act { color: #0e86b6; border-color: #0e86b6; opacity: 1; }

.crt-btn { min-width: 171px; overflow: hidden; font-size: 17px; height: 35px; line-height: 32px; color: #333; border: 1px solid #dcdcdc; border-radius: 40px; background: #fff 50% 50% no-repeat; background-size: 16px; vertical-align: top; }
.crt-btn.pause, .crt-btn.play, .crt-btn.up, .crt-btn.down { min-width: 60px; text-indent: -1000px; white-space: nowrap; }
.crt-btn:active { color: #fff; background-color: #0e86b6; border-color: #05729e; }
.crt-btn:disabled { color: #bbb; }
.crt-btn.pause { background-image: url("/asset/images/ctr/pause.png"); }
.crt-btn.pause:active { background-image: url("/asset/images/ctr/pause-act.png"); }
.crt-btn.pause:disabled { background-image: url("/asset/images/ctr/pause-dis.png"); }
.crt-btn.play { background-image: url("/asset/images/ctr/play.png"); }
.crt-btn.play:active { background-image: url("/asset/images/ctr/play-act.png"); }
.crt-btn.play:disabled { background-image: url("/asset/images/ctr/play-dis.png"); }
.crt-btn.up, .crt-btn.down { min-width: 83px; }
.crt-btn.up { background-image: url("/asset/images/ctr/up.png"); }
.crt-btn.up:active { background-image: url("/asset/images/ctr/up-act.png"); }
.crt-btn.up:disabled { background-image: url("/asset/images/ctr/up-dis.png"); }
.crt-btn.down { background-image: url("/asset/images/ctr/down.png"); }
.crt-btn.down:active { background-image: url("/asset/images/ctr/down-act.png"); }
.crt-btn.down:disabled { background-image: url("/asset/images/ctr/down-dis.png"); }

.crt-state { display: inline-block; width: 262px; height: 262px; background: transparent no-repeat; background-size: 100% !important; transition: all 0.4s ease; }
.crt-state.valve { background-image: url("/asset/images/ctr/gas_off.png"); }
.crt-state.valve.on { background-image: url("/asset/images/ctr/gas_on.png"); }
.crt-state.porch { background-image: url("/asset/images/ctr/porch_off.png"); }
.crt-state.porch.on { background-image: url("/asset/images/ctr/porch_on.png"); }
.crt-state.curtain { background-image: url("/asset/images/ctr/curtain_off.png"); }
.crt-state.curtain.on { background-image: url("/asset/images/ctr/curtain_on.png"); }
.crt-state.curtain { background-image: url("/asset/images/ctr/curtain_off.png"); }
.crt-state.curtain.on { background-image: url("/asset/images/ctr/curtain_on.png"); }
.crt-state.power { background-image: url("/asset/images/ctr/power_off.png"); }
.crt-state.power.on { background-image: url("/asset/images/ctr/power_on.png"); }
.crt-state.light { background-image: url("/asset/images/ctr/light_off.png"); }
.crt-state.light.on { background-image: url("/asset/images/ctr/light_on.png"); }
.crt-state.wind { background-image: url("/asset/images/ctr/wind_off.png"); }
.crt-state.wind.on { background-image: url("/asset/images/ctr/wind_on.png"); }

.ctr-curtain .inner, .ctr-gas .inner, .ctr-porch .inner, .ctr-power .inner, .ctr-light .inner, .ctr-wind .inner { display: table; width: 100%; }
.ctr-curtain .dash, .ctr-gas .dash, .ctr-porch .dash, .ctr-power .dash, .ctr-light .dash, .ctr-wind .dash { display: table-cell; padding-bottom: 20px; vertical-align: middle; text-align: center; }
.ctr-curtain .dash-switch, .ctr-gas .dash-switch, .ctr-porch .dash-switch, .ctr-power .dash-switch, .ctr-light .dash-switch, .ctr-wind .dash-switch { display: block; }
.ctr-curtain .b-btn, .ctr-gas .b-btn, .ctr-porch .b-btn, .ctr-power .b-btn, .ctr-light .b-btn, .ctr-wind .b-btn { margin-left: 5px; }

.ctr-heating, .ctr-air { padding-left: 0 !important; padding-right: 0 !important; }
.ctr-heating .inside, .ctr-heating .state, .ctr-air .inside, .ctr-air .state { text-align: center; display: table; width: 100%; }
.ctr-heating .inside > div, .ctr-heating .state > div, .ctr-air .inside > div, .ctr-air .state > div { display: table-cell; vertical-align: middle; line-height: 1; }
.ctr-heating .inside .dt, .ctr-heating .state .dt, .ctr-air .inside .dt, .ctr-air .state .dt { font-size: 20px; color: #94a4aa; margin-bottom: 3px; }
.ctr-heating .inside .dd, .ctr-heating .state .dd, .ctr-air .inside .dd, .ctr-air .state .dd { font-size: 80px; color: #333; line-height: 1; }
.ctr-heating .inside > div, .ctr-air .inside > div { border-bottom: 1px solid #dfe4e5; padding: 14px 0 24px; }

.ctr-heating .state > div { padding: 33px 0 23px; }
.ctr-heating .state .dd { color: #0e86b6; }
.ctr-heating .btn-group { margin-top: 5px; }
.ctr-heating .btn-group .crt-btn { margin: 10px 2px 0; min-width: 252px; }
.ctr-heating .btn-group .crt-btn.up, .ctr-heating .btn-group .crt-btn.down, .ctr-heating .btn-group .crt-btn.out { min-width: 80px; }

.ctr-air .dash-switch { text-align: center; }
.ctr-air .dash-switch ul { padding: 0 10px; margin-bottom: 23px; }
.ctr-air .dash-switch li { overflow: hidden; padding: 16px 5px 17px; border-bottom: 1px solid #dfe4e5; text-align: left; }
.ctr-air .dash-switch li * { vertical-align: top; }
.ctr-air .dash-switch li span, .ctr-air .dash-switch li strong { display: inline-block; position: relative; line-height: 1; text-align: left; }
.ctr-air .dash-switch li span { color: #84969d; font-size: 13px; top: 11px; }
.ctr-air .dash-switch li span:before { content: "\2022"; font-size: 12px; margin-right: 6px; position: relative; top: -1px; }
.ctr-air .dash-switch li strong { float: right; font-size: 20px; color: #0e86b6; font-weight: 500; top: 8px; min-width: 40px; text-align: center; }
.ctr-air .dash-switch li strong.num { font-size: 30px; font-weight: 400; top: 2px; }
.ctr-air .dash-switch li .btn-group { float: right; margin-left: 15px; }
.ctr-air .dash-switch li .crt-btn { margin: 0 2px; min-width: 83px; }
.ctr-air .dash-switch .hope-row .crt-btn { min-width: 53px; }

.ctr-power .state-box, .ctr-light .state-box { position: relative; }
.ctr-power .state-box em, .ctr-light .state-box em { font-size: 14px; color: #333; position: absolute; top: 30px; left: 0; width: 100%; text-align: center; }
.ctr-power .state-box em strong, .ctr-light .state-box em strong { color: #0e86b6; }
.ctr-power .dash-switch .slideCheck, .ctr-light .dash-switch .slideCheck { width: 117px; }
.ctr-power .dash-switch ul, .ctr-light .dash-switch ul { overflow: hidden; margin: -18px 15px 0; }
.ctr-power .dash-switch li, .ctr-light .dash-switch li { float: left; width: 50%; margin-top: 18px; }
.ctr-power .dash-switch p, .ctr-light .dash-switch p { font-size: 14px; color: #84969d; margin-bottom: 3px; }
.ctr-power .dash-switch ul + ul, .ctr-light .dash-switch ul + ul { border-top: 1px solid rgba(255, 255, 255, 0.16); margin-top: 10px; padding-top: 18px; }

.ctr-wind .btn-group { margin-top: 20px; }
.ctr-wind .btn-group button { display: inline-block; font-size: 21px; width: 40px; height: 40px; line-height: 38px; border: 1px solid; border-radius: 40px; background: #fff; }
.ctr-wind .btn-group button.on { color: #fff !important; }
.ctr-wind .btn-group button + button { margin-left: 15px; }
.ctr-wind .btn-group button.wind1 { color: #aec6e6; border-color: #aec6e6; }
.ctr-wind .btn-group button.wind1.on { background: #1169e0; }
.ctr-wind .btn-group button.wind2 { color: #97d4dd; border-color: #97d4dd; }
.ctr-wind .btn-group button.wind2.on { background: #11b1c9; }
.ctr-wind .btn-group button.wind3 { color: #b6ddcd; border-color: #b6ddcd; }
.ctr-wind .btn-group button.wind3.on { background: #1fc581; }

.ctr-pw input[type="text"], .ctr-pw input[type="tel"], .ctr-pw input[type="email"], .ctr-pw input[type="password"] { font-size: 14px; color: #333; width: 100%; height: 31px; line-height: 31px; border: 1px solid #ddd; padding: 0 10px; background: #f6f6f6; }
.ctr-pw input[type="text"]::-webkit-input-placeholder, .ctr-pw input[type="tel"]::-webkit-input-placeholder, .ctr-pw input[type="email"]::-webkit-input-placeholder, .ctr-pw input[type="password"]::-webkit-input-placeholder { color: #bbb; }
.ctr-pw input[type="text"]::-moz-placeholder, .ctr-pw input[type="tel"]::-moz-placeholder, .ctr-pw input[type="email"]::-moz-placeholder, .ctr-pw input[type="password"]::-moz-placeholder { color: #bbb; }
.ctr-pw input[type="text"]:-moz-placeholder, .ctr-pw input[type="tel"]:-moz-placeholder, .ctr-pw input[type="email"]:-moz-placeholder, .ctr-pw input[type="password"]:-moz-placeholder { color: #bbb; }
.ctr-pw input[type="text"]:-ms-input-placeholder, .ctr-pw input[type="tel"]:-ms-input-placeholder, .ctr-pw input[type="email"]:-ms-input-placeholder, .ctr-pw input[type="password"]:-ms-input-placeholder { color: #bbb; }
.ctr-pw input[type="text"]:disabled, .ctr-pw input[type="tel"]:disabled, .ctr-pw input[type="email"]:disabled, .ctr-pw input[type="password"]:disabled { color: #999; border-color: #d3d3d3; background: #dfdfdf; }
.ctr-pw dt, .ctr-pw dd { padding: 14px 16px 0; }
.ctr-pw dd + dt { border-top: 1px solid #dddddd; margin-top: 17px; }
.ctr-pw dt { color: #84969d; font-size: 13px; }
.ctr-pw dt:before { content: "\2022"; font-size: 12px; margin-right: 6px; position: relative; top: -1px; }

.ctr-estate, .ctr-porch, .ctr-entrance { height: 100%; position: relative; }
.ctr-estate > ul, .ctr-porch > ul, .ctr-entrance > ul { height: 100%; overflow-y: auto; }
.ctr-estate > ul li, .ctr-porch > ul li, .ctr-entrance > ul li { padding: 13px 16px; font-size: 16px; position: relative; border: solid #f4f4f4; border-width: 1px 0; margin: -1px 0; }

.ctr-estate { padding-top: 59px; }
.ctr-estate .search { position: absolute; top: 0; left: 0; width: 100%; }
.ctr-estate .search .in { padding-right: 44px; }
.ctr-estate .search input { border-radius: 15px 0 0 15px; border-color: #0e86b6; }
.ctr-estate > ul li { padding-right: 70px; }
.ctr-estate > ul button { position: absolute; top: 50%; right: 16px; font-size: 10.67px; color: #333; width: 40px; height: 22px; line-height: 20px; margin-top: -11px; border: 1px solid #94a4aa; border-radius: 12px; background: #fff; }

.ctr-porch > ul li { padding-right: 42px; }
.ctr-porch > ul .i-btn { position: absolute; right: 16px; top: 50%; margin-top: -9px; }

.ctr-entrance { padding-top: 50px; }
.ctr-entrance .ctr-top { border-bottom: 1px solid #dbdbdb; position: absolute; top: 0; left: 0; width: 100%; height: 50px; padding: 0 16px; }
.ctr-entrance .ctr-top .in { position: relative; padding: 10px 0; }
.ctr-entrance .ctr-top p { font-size: 14px; line-height: 30px; }
.ctr-entrance .ctr-top p em { color: #0e86b6; }
.ctr-entrance .t-btn { position: absolute; right: 0; top: 50%; }
.ctr-entrance .t-btn.ty6 { width: 58px; margin-top: -15px; }
.ctr-entrance .t-btn.ty7 { width: 32px; margin-top: -11px; }
.ctr-entrance .t-btn .ico { position: relative; top: 2px; }
.ctr-entrance > ul input { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.ctr-entrance > ul label { display: block; font-size: 16px; padding: 13px 16px; font-weight: 500; margin: -13px -16px; }
.ctr-entrance > ul input:checked + label { background: #ddd; }
.ctr-entrance > ul .t-btn { right: 16px; }

/* list??*/
.list-ctr-sec { padding: 10px; background: url("/asset/images/layout/bg-content.png"); background-size: 10px; }

.new-ico:after, .ctr-tb-list .notice .new .type:after, .ctr-tb-list .fee .new span:after, .ctr-tb-list .delivery .days:after { content: 'N'; display: inline-block; width: 17px; height: 17px; font-size: 0; overflow: hidden; text-indent: -100px; background: url("/asset/images/ico/new.png") no-repeat; background-size: 100%; vertical-align: top; }

.ctr-tb-list { position: relative; }
.ctr-tb-list.is-top { padding-top: 40px; }
.ctr-tb-list ul { border: 1px solid #ddd; background: #fff; }
.ctr-tb-list li { border: solid #ddd; border-width: 1px 0; margin: -1px 0; padding: 12px 20px 13px; overflow: hidden; position: relative; }
.ctr-tb-list .day-cur-num { position: absolute; top: 2px; width: 100%; padding: 0; }
.ctr-tb-list .day-cur-num div { position: relative; }
.ctr-tb-list .day-cur-num p { font-size: 14px; text-align: center; padding-top: 4px; }
.ctr-tb-list .day-cur-num button { position: absolute; top: 0; width: 45px; height: 27px; border-radius: 14px; text-indent: -1000px; overflow: hidden; border: 1px solid #dbdbdb; background: #fff 50% no-repeat; background-size: 8px auto; }
.ctr-tb-list .day-cur-num button.prev { background-image: url("/asset/images/control/bt-prev-off.png"); left: 0; }
.ctr-tb-list .day-cur-num button.next { background-image: url("/asset/images/control/bt-next-off.png"); right: 0; }
.ctr-tb-list .day-cur-num button:active { background-color: #0e86b6; }
.ctr-tb-list .day-cur-num button:active.prev { background-image: url("/asset/images/control/bt-prev.png"); }
.ctr-tb-list .day-cur-num button:active.next { background-image: url("/asset/images/control/bt-next.png"); }
.ctr-tb-list .notice .type { display: inline-block; position: relative; padding-left: 9px; margin-left: -9px; font-size: 12.67px; color: #84969d; font-weight: 500; margin-bottom: 10px; }
.ctr-tb-list .notice .type:before { content: "\2022"; position: absolute; left: 0; top: 0; }
.ctr-tb-list .notice p { font-size: 14px; color: #333; }
.ctr-tb-list .notice .days { font-size: 12.67px; display: block; color: #888; margin-top: -1px; }
.ctr-tb-list .notice .new .type { color: #0e86b6; }
.ctr-tb-list .notice .new .type:after { position: relative; top: 1px; margin-left: 7px; }
.ctr-tb-list .fee li { padding: 15px 0; }
.ctr-tb-list .fee span, .ctr-tb-list .fee em { float: left; width: 50%; text-align: center; font-size: 14px; }
.ctr-tb-list .fee .new span:after { position: absolute; left: 27px; top: 50%; margin-top: -9px; }
.ctr-tb-list .fee .list-head { padding: 4px 0; }
.ctr-tb-list .fee .list-head span, .ctr-tb-list .fee .list-head em { font-size: 12.67px; color: #84969d; font-weight: 600; position: relative; }
.ctr-tb-list .fee .list-head span + span:before, .ctr-tb-list .fee .list-head span + em:before, .ctr-tb-list .fee .list-head em + span:before, .ctr-tb-list .fee .list-head em + em:before { content: ''; position: absolute; left: 0; top: 50%; margin-top: -7px; display: block; width: 1px; height: 14px; background: #ddd; }
.ctr-tb-list .visitant { height: 100%; overflow-y: auto; }
.ctr-tb-list .visitant li { position: relative; padding: 25px 0 24px 122px; }
.ctr-tb-list .visitant .thum { position: absolute; top: 50%; left: 17px; margin-top: -35px; display: inline-block; width: 88px; height: 70px; border: 1px solid #ddd; overflow: hidden; background: url("/asset/images/ico/photo-bg.gif") no-repeat; background-size: cover; }
.ctr-tb-list .visitant .thum img { width: 100%; height: 100%; }
.ctr-tb-list .visitant .days { font-size: 14px; color: #333; }
.ctr-tb-list .visitant .time { font-size: 12.67px; color: #888; margin-top: 1px; }
.ctr-tb-list .delivery li { display: table; width: 100%; padding: 12px 16px 13px; }
.ctr-tb-list .delivery li > div { display: table-cell; width: 33.3%; font-size: 14px; vertical-align: middle; }
.ctr-tb-list .delivery .tx1 { text-align: left; }
.ctr-tb-list .delivery .tx2 { text-align: center; }
.ctr-tb-list .delivery .tx3 { text-align: right; }
.ctr-tb-list .delivery .days { display: inline-block; position: relative; }
.ctr-tb-list .delivery .days:after { position: relative; top: 1px; margin-left: 7px; }
.ctr-tb-list .delivery em { display: block; color: #888; font-size: 12.67px; margin-top: -3px; }

.ctr-tb-view { height: 100%; padding-top: 60px; }
.ctr-tb-view .b-head { padding: 10px 26px; border-bottom: 1px solid #ddd; height: 60px; position: absolute; top: 0; left: 0; width: 100%; }
.ctr-tb-view .b-head p { font-size: 17.33px; color: #333; }
.ctr-tb-view .b-head .days { font-size: 12.67px; display: block; color: #888; margin-top: -2px; }
.ctr-tb-view .b-body { height: 100%; position: relative; overflow-y: auto; font-size: 14px; padding: 18px 26px; line-height: 1.6; }
.ctr-tb-view .b-body img { max-width: 100%; }

.fee-detail dt { font-size: 17.33px; color: #0e86b6; }
.fee-detail dd { font-size: 14px; color: #333; margin-top: 4px; }

.ctr-address-send { padding: 16px; }
.ctr-address-send input { font-size: 14px; color: #333; border: 1px solid #ddd; height: 30px; line-height: 30px; padding: 0 10px; background: #f6f6f6; width: 100%; }
.ctr-address-send input::-webkit-input-placeholder { color: #aaa; }
.ctr-address-send input::-moz-placeholder { color: #aaa; }
.ctr-address-send input:-moz-placeholder { color: #aaa; }
.ctr-address-send input:-ms-input-placeholder { color: #aaa; }
.ctr-address-send .address-pos { font-size: 15px; color: #333; text-align: center; margin: 35px 0 13px; }
.ctr-address-send .address-pos em:before { content: ''; display: inline-block; width: 18px; height: 27px; position: relative; top: 7px; margin-right: 5px; background: url("/asset/images/ico/address.png") no-repeat; background-size: cover; }
.ctr-address-send .map-box { border: 1px solid #ddd; height: 320px; }

/*# sourceMappingURL=common.css.map */



div.chk-group{
	overflow: visible;
}
.fun-setting .label {
	width: 50%;
}
ul li div.chk-group.trueweb {
	display: inline-block;
	float: right;
}

.chk-group .chk label {
	padding: 0px 10px;
}

.chk-group .chk span.ccc {
	display: inline-block;
	border: none;
	height: 40px;
	padding-right0: 5px;
	padding-left: 5px;
	font-size: 16px;
}
.chk-group .chk input[type='text'] {
	background-color: inherit;
	color: inherit;
	border: none;
    height: 40px;
    line-height: 38px;
    display: block;
    text-align: center;
    padding-right: 6px;
    margin-right: 0;
    font-size: 18px;
    position: relative;
    font-weight: normal;
    width: 35px;
    z-index: 10px;
}



.zone-act-list {
	position: absolute;
	top: 5px;
	right: -8px;
}

.zone-act-list div.ui-input-text {
	display: inline-block;
}


