/* Minification failed. Returning unminified contents. (1933,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1934,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1937,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1938,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1943,23): run-time error CSS1039: Token not allowed after unary operator: '-top' (1944,28): run-time error CSS1039: Token not allowed after unary operator: '-top' (1947,20): run-time error CSS1039: Token not allowed after unary operator: '-top' (1955,28): run-time error CSS1039: Token not allowed after unary operator: '-top' (1958,28): run-time error CSS1039: Token not allowed after unary operator: '-top' (1961,38): run-time error CSS1039: Token not allowed after unary operator: '-bottom' (1964,26): run-time error CSS1039: Token not allowed after unary operator: '-bottom' (1967,30): run-time error CSS1039: Token not allowed after unary operator: '-bottom' (1972,30): run-time error CSS1039: Token not allowed after unary operator: '-bottom' (1977,26): run-time error CSS1039: Token not allowed after unary operator: '-bottom' (1980,28): run-time error CSS1039: Token not allowed after unary operator: '-top' (1983,28): run-time error CSS1039: Token not allowed after unary operator: '-top' (1986,20): run-time error CSS1039: Token not allowed after unary operator: '-top' (1989,20): run-time error CSS1039: Token not allowed after unary operator: '-top' (1992,20): run-time error CSS1039: Token not allowed after unary operator: '-top' (1997,20): run-time error CSS1039: Token not allowed after unary operator: '-top' (2000,20): run-time error CSS1039: Token not allowed after unary operator: '-top' (2006,28): run-time error CSS1039: Token not allowed after unary operator: '-top' (2009,23): run-time error CSS1039: Token not allowed after unary operator: '-bottom' (2012,26): run-time error CSS1039: Token not allowed after unary operator: '-bottom' (2017,23): run-time error CSS1039: Token not allowed after unary operator: '-top' (2020,20): run-time error CSS1039: Token not allowed after unary operator: '-top' (2023,20): run-time error CSS1039: Token not allowed after unary operator: '-top' (2026,23): run-time error CSS1039: Token not allowed after unary operator: '-top' (2029,37): run-time error CSS1039: Token not allowed after unary operator: '-top' (2032,28): run-time error CSS1039: Token not allowed after unary operator: '-top' (2039,28): run-time error CSS1039: Token not allowed after unary operator: '-top' (2054,31): run-time error CSS1039: Token not allowed after unary operator: '-bottom' (2058,28): run-time error CSS1039: Token not allowed after unary operator: '-top' (2064,23): run-time error CSS1039: Token not allowed after unary operator: '-top' (2065,28): run-time error CSS1039: Token not allowed after unary operator: '-top' (2068,20): run-time error CSS1039: Token not allowed after unary operator: '-top' (2071,20): run-time error CSS1039: Token not allowed after unary operator: '-top' (2078,20): run-time error CSS1039: Token not allowed after unary operator: '-top' (2086,27): run-time error CSS1039: Token not allowed after unary operator: '-top' (2089,20): run-time error CSS1039: Token not allowed after unary operator: '-top' (2097,20): run-time error CSS1039: Token not allowed after unary operator: '-top' (2100,38): run-time error CSS1039: Token not allowed after unary operator: '-bottom' (2112,38): run-time error CSS1039: Token not allowed after unary operator: '-bottom' (2117,38): run-time error CSS1039: Token not allowed after unary operator: '-bottom' (2121,38): run-time error CSS1039: Token not allowed after unary operator: '-bottom' (2124,30): run-time error CSS1039: Token not allowed after unary operator: '-bottom' (2127,37): run-time error CSS1039: Token not allowed after unary operator: '-bottom' (2130,37): run-time error CSS1039: Token not allowed after unary operator: '-bottom' (2133,30): run-time error CSS1039: Token not allowed after unary operator: '-bottom' (2137,30): run-time error CSS1039: Token not allowed after unary operator: '-bottom' (2142,38): run-time error CSS1039: Token not allowed after unary operator: '-bottom' (2148,30): run-time error CSS1039: Token not allowed after unary operator: '-bottom' (2153,30): run-time error CSS1039: Token not allowed after unary operator: '-bottom' (2156,37): run-time error CSS1039: Token not allowed after unary operator: '-bottom' (2159,30): run-time error CSS1039: Token not allowed after unary operator: '-bottom' (2165,38): run-time error CSS1039: Token not allowed after unary operator: '-bottom' (2168,37): run-time error CSS1039: Token not allowed after unary operator: '-bottom' */ @charset "UTF-8"; /*reset*/ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {margin:0; padding:0; border:0; font:inherit; vertical-align:baseline; font-weight:normal;} address,em {font-style:normal; font-weight:normal;} strong{font-weight:bold} input,button,select {font-family:sans-serif; vertical-align:middle; margin:0; padding:0;} article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block;} hr{width:100%; height:1px; margin:0; border:0; clear:both; background-color:#e2e2e2;} html {font-size:100%; font-family:sans-serif; font-size:15px; -webkit-text-size-adjust:100%;} body {line-height:1.5; color:#666;} ol, ul, li {list-style:none;} table {border-collapse:collapse; border-spacing:0; font-size:15px;} button, html input[type='button'], input[type='reset'], input[type='submit'] {-webkit-appearance:button; cursor:pointer; outline:none;} button{margin:0; padding:0; border:0; background-color:transparent;} button:-moz-focus-inner, input:-moz-focus-inner {border:0; padding:0;} input[type='number']:-webkit-inner-spin-button, input[type='number']:-webkit-outer-spin-button {height:auto;} input.search, input[type='search'] { -webkit-appearance:none; -moz-box-sizing:content-box; -webkit-box-sizing:content-box; box-sizing:content-box; -webkit-border-radius:2px; border-radius:2px; } input[type='date']:-webkit-user-select-button, input[type='date'] { -webkit-appearance:none; -webkit-writing-mode:none; -webkit-rtl-ordering:none; -webkit-user-select:none; } input.search:-webkit-search-cancel-button, input.search:-webkit-search-decoration, input[type='search']:-webkit-search-cancel-button, input[type='search']:-webkit-search-decoration {-webkit-appearance:none;} input[type='file']::-webkit-file-upload-button {cursor:pointer;} a{text-decoration:none; color:#666;} a:hover {} a[href^='tel'] {color:inherit; font:inherit;} button, a:focus {outline:none;} button.press, a.press, button:active, a:active {opacity:.6;} button:disabled:active, a.disabled:active, .btn.disabled:active {opacity:1;} .radio, .checkbox { display:inline-block; position:relative; width: 25px; height: 25px; /*margin-right:5px;*/ border: 1px solid #cacaca; background-color:#fff; border-radius:2px; vertical-align:middle; box-sizing:border-box; } .radio{ width:22px; height:22px; border-radius: 10px; } input[type='radio'], input[type='checkbox'] { position:absolute; left:0; right:0; top:0; bottom:0; z-index:10; opacity:0; width:22px; height:22px; letter-spacing: 0; border:none; background:none; vertical-align:middle; -webkit-appearance: none; -ms-appearance: none; } input[type='radio'] { border-radius: 100%; } input[type='radio'] + span, input[type='checkbox'] + span { opacity:0; } input[type='radio']:checked + span, input[type='checkbox']:checked + span { opacity:1; position:absolute; left:0; top:0; } input[type='radio']:checked + span { width:10px; height:10px; margin:5px 0 0 5px; border-radius:100%; background-color:#00b6f0; } input[type='checkbox']:checked + span { width:16px; height:11px; margin:6px 0 0 4px; background-position:-50px 0; background-repeat: no-repeat; background-size: 360px auto; background-image: url('/static/images/common/icon_sprite.png'); } input[type='date'], input[type='text'], input[type='number'], input.search, input[type='search'], input[type='password'], input[type='tel'], input[type='email']{ width:100%; height:40px; padding:0 10px; font-family:sans-serif; font-size:14px; color:#333; border:1px solid #bfc2c6; background-color:#fff; border-radius:2px; outline:none; box-sizing:border-box; -webkit-appearance:none; } input[type="date"] {padding-right:0;} input[readonly='readonly']:not([data-role='date']) {background-color:#f6f6f8; border:1px solid #e1e1e1; color:#666;} button::-webkit-inner-spin-button, input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; } select:disabled, input.search:disabled, input[type='date']:disabled, input[type='search']:disabled, input[type='password']:disabled, input[type='tel']:disabled, input[type='email']:disabled, input[type='text']:disabled {background-color:#f6f6f8; border:1px solid #e1e1e1; color:#ccc;} input::-webkit-input-placeholder {color:#ccc; line-height:1.4; padding-left:4px;} textarea::-webkit-input-placeholder {color:#ccc;} select{ width:100%; height:40px; padding-left:10px; padding-right:10px; font-size:14px; color:#666; border:1px solid #c6c6c6; border-radius:2px; background-color:#fff; -webkit-appearance:none; -ms-appearance:none; appearance:none; box-sizing:border-box; } select:disabled {background-color:#f6f6f8; border:1px solid #e1e1e1; color:#ccc;} select:disabled::after {border-color:#ccc;} select::-ms-expand{ display: none; } span.select {display:inline-block;} .select {position:relative;} .select:after { content:''; display:inline-block; position:absolute; right:8px; top:50%; border-left:4px solid transparent; border-right:4px solid transparent; border-bottom:none; border-top:6px solid #88929e; margin-top:-3px; pointer-events: none; } .select.disabled:after { border-top-color:#ccc; } select:required:invalid {color:#999;} .select[data-value]:before {content:attr(data-value); font-size:14px; line-height:38px; text-align:center; position:absolute; top:0; right:0; bottom:0; left:0; padding-right:20px; padding-left: 5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; border-radius:2px; border:1px solid #c6c6c6; background-color:#fff; pointer-events:none;} .select[data-value] select {opacity: 0;} textarea{width:100%; padding:10px; border:1px solid #bfc2c6; box-sizing:border-box; border-radius:2px; resize:none; font-family:sans-serif; font-size:14px; color:#666; -webkit-appearance: none; -webkit-box-shadow:none; box-shadow:none; background-image:none;} label{font-size:14px; vertical-align:middle;} :selection {background-color:#ff7900; color:#fff;} .hide,legend,caption{position:absolute !important; left:-9999px !important; right:auto !important; width:0; height:0; overflow:hidden; text-indent:-9999px; font:0/0 a;} caption {display:none;} img {width:100%; vertical-align:middle;} fieldset {min-width:0;} @-moz-document url-prefix() { fieldset {display: table-cell;} } [lang='ko'], [lang='en'] { font-family: sans-serif; } [lang='zh'] { font-family: 'Microsoft YaHei', 'Microsoft JhengHei', sans-serif; } [lang='zh-CN'] { font-family: 'Microsoft YaHei', sans-serif; } [lang='zh-TW'] { font-family: 'Noto Sans TC', 'Microsoft JhengHei', sans-serif; } [lang='ja'] { font-family: "メイリオ", Meiryo, "Osaka", Arial, sans-serif; } /* 국가 추가시 웹폰트 추가 필요 */ [lang='th'] { font-family: 'CSChatThaiUI', sans-serif; } [lang='kh'] { font-family: 'Hanuman', Arial, Helvetica, sans-serif; } @charset "UTF-8"; /* Module */ /* section */ .block {display:block;} .noScroll, .noScroll #container {overflow:hidden;} body.white {background-color:#fff;} #body.pb70 {padding-bottom:70px;} .margin {padding:0 15px;} .margin.sides {margin-top:15px; margin-bottom:15px;} .margin > .row.btns.margin {padding:0;} .accelerator { -webkit-backface-visibility: hidden; backface-visibility: hidden ; -webkit-transform: translateZ(0deg) ; transform: translateZ(0deg) ; } .borderNo{border:none !important} .pt10{padding-top:10px} .pb10{padding-bottom:10px} .marginTB{margin:10px 0 10px} .selStyle{margin:20px 0 10px;float:right;width:50%; } /* Loading */ .loading {position:fixed; left:0; top:0; z-index:-1;} .loading.active {z-index:260; width:100%; height:100%;} .loading.active .progress {display:inline-block; position:fixed; width:24px; height:24px; left:50%; top:50%; margin:-4px 0 0 -4px; background-image:url('/static/images/common/loading.gif'); background-repeat:no-repeat; background-position:0 0; background-size:24px auto;} .loading.active .dim {background-color:transparent; position:fixed; left:0; top:0; right:0; bottom:0; z-index:1; pointer-events:none;} /* Section Align Center */ .verticalCenter {min-height:300px; display:-webkit-box; display:-webkit-flex; display:flex; -webkit-box-pack: center; -moz-box-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-align-content: center; align-content: center; -webkit-box-align: center; -moz-box-align: center; -webkit-align-items: center; align-items: center; } .verticalCenter .alignItem { -webkit-box-flex: 0; -moz-box-flex: 0; -webkit-flex: 0 1 auto; flex: 0 1 auto; } .password .verticalCenter {min-height:500px;} /* Font */ .titleBar {background-color:#f1f2f4;} .titleBar:after {content:''; display:block; clear:both;} .title {color:#333;} .title.sect {font-size:18px; color:#333; font-weight:bold;} .titleBar .titleSect {float:left;} .titleHead {font-size:21px; color:#000;} .text01 {font-size:16px; color:#333;} .text02 {font-size:12px; color:#666;} .text03 {font-size:12px; color:#f9993b;} /* Text Color */ .dark {color:#333;} .primary {color:#00b6f0;} a[href*='tel:'] {color:inherit;} .em {color:#f9993b;} .warning {font-size:14px; color:#f9993b;} .asterisk {color:#f9993b;} .primary02{color:red} .soft {color: #999;} .underline {text-decoration: underline;} /* Text Size */ .text11 {font-size:11px;} .text12 {font-size:12px;} .text13 {font-size:13px;} .text14 {font-size:14px;} .text15 {font-size:15px;} .text16 {font-size:16px;} .text17 {font-size:17px;} .text19 {font-size:19px; line-height:1.4;} .text20 {font-size:20px; line-height:1.4;} .text23 {font-size:23px; line-height:1.3;} .text25 {font-size:25px; line-height:1.2;} .text29 {font-size:29px; line-height:1.2;} /* Text Style */ .title.sub {margin-bottom:3px; font-size:16px; color:#333; font-weight:bold;} .bold {font-weight:bold;} .bullet {position:relative; padding-left:9px; font-size:12px; color:#666;} .bullet:after {content:''; display:block; width:3px; height:3px; position:absolute; left:0; top:7px; background-color:#707780;} li.bullet {line-height:1.4;} li.bullet + .bullet {margin-top:4px;} .table .bullet {display:inline-block; margin-top:7px; line-height:1.4;} .acenter {text-align:center;} .alenter {text-align:left;} .aright {text-align:right;} ol.decimal {margin-left:17px;} ol.decimal, ol.decimal li {padding:auto; list-style:inherit; list-style-type:decimal;} ol.decimal-counter {margin-left:0; counter-reset: decimal-counter;} ol.decimal-counter li {position: relative; list-style-type: none; padding-left: 20px;} ol.decimal-counter li:before {position: absolute; left: 0; top: 0; counter-increment: decimal-counter; content: "(" counter(decimal-counter) ")";} ol.roman {margin-left:17px;} ol.roman, ol.roman li {list-style:inherit; list-style-type:lower-roman;} ol.alphabet {margin-left:17px;} ol.alphabet, ol.alphabet li {list-style:inherit; list-style-type:lower-alpha;} ul.dash {} ul.dash li {padding-left:13px; text-indent:-11px; list-style: none;} ul.dash li:before {content:'-'; margin-right:5px;} .indStar{padding-left:12px; text-indent:-10px} .indChum{padding-left:15px; text-indent:-15px} .mt5{margin-top:5px !important;} .mt10{margin-top:10px !important;} .mt30{margin-top:30px !important;} .mb10{margin-bottom:10px !important;} .mb15{margin-bottom:15px !important;} /* Box */ .box.primary {background-color:#f3f9fb; color:#333;} .box.gray {background-color:#e8e8e9;} .box.dark {background-color:#707780; border-radius:2px; color:#fff;} .box.dark .primary {color:#2dcdff;} .box.center {text-align:center;} .box.default {border:1px solid #e2e2e2; border-radius:2px;} .fakeInput {display:inline-block;} .fakeInput input[type='text'] {border:none; width:auto; height:auto; padding:0; font-size:14px;} .inlineInput input[type='text'] {width:auto;} /* topButton */ .btnTop {display:inline-block; position:fixed; right:10px; bottom:70px; width:50px; height:50px; font:0/0 a; background-image:url('/static/images/common/button_top.png'); background-position:0 0; background-size:50px auto; background-repeat:no-repeat;} .product ~ .btnTop {bottom:80px;} .company .btnTop {bottom:10px;} .favorite ~ .btnTop, .cart ~ .btnTop {bottom:140px;} /* topButton */ .btnScroll {position:fixed; right:0; bottom:0; width:100%; height:70px; margin-top:10px; border-top:1px solid #eaebed; background-color:#fff} /* bottom Button */ .fixBottomBtn {position: fixed; right: 10px; bottom: 70px; z-index: 10;} .fixBottomBtn .btnTop {position: static; vertical-align: top; margin-top: 5px;} .btnChat {display: block; width:50px; height:50px;font:0/0 a; background-image:url('/static/images/common/button_talk.png'); background-position:0 0; background-size:50px auto; background-repeat:no-repeat;} .company .fixBottomBtn { bottom: 10px; } /* Button */ .floating {position:fixed; z-index:350; width:100%; background-color:#fff;} .row.btns.floating {left:0; right:0; bottom:0;} .row.btns.floating.box {padding-top:15px;border-top: 1px solid #e2e2e2;} .btn {display:inline-block; position:relative; vertical-align:middle; text-align:center; box-sizing:border-box;} .btn.block {width:100%;} .btn.default {color:#666; background-color:#fff; border:1px solid #c6c6c6; border-radius:2px;} .btn.primary {color:#fff; background-color:#00b6f0; border-radius:2px;} .btn.current {color:#00b6f0; background-color:#fff; border:1px solid #00b6f0; border-radius:2px;} .btn.inverse {color:#fff; background-color:#707780; border-radius:2px;} .btn.etc01 {color:#666; background-color:#f6f6f8; border:1px solid #c9c9c9; border-radius:2px;} .btn.etc02 {color:#fff; background-color:#7fdaf7; border-radius:2px;} .btn.etc03 {color:#fff; background-color:#7d7d7d; border:1px solid #7d7d7d; border-radius:2px;} .btn.secondary {color: #fff; background-color: #64d0f3; } a.disabled {pointer-events:none; cursor:default;} .btn.default.disabled, .btn.default:disabled, .btn.default:disabled.press, .btn.default.disabled.press, .btn.current.disabled, .btn.current:disabled, .btn.inverse.disabled, .btn.inverse:disabled, .btn.etc01.disabled, .btn.etc01:disabled, .btn.etc02.disabled, .btn.etc02:disabled {background-color:#fafafb; border:1px solid #e2e2e2; color:#b2b2b2;} .btn.primary.disabled, .btn.primary:disabled {background-color:#7fdaf7;} .btn.xs {padding:0 5px; font-size:12px;} .btn.sm {height:30px; padding:0 15px; line-height:30px; font-size:13px;} .btn.md {height:40px; padding:0 15px; line-height:40px; font-size:14px;} .btn.lg {height:50px; padding:0 15px; line-height:50px; font-size:19px; font-weight:bold;} .btnMore {display:block; height:40px; margin-bottom:20px; line-height:40px; font-size:14px; text-align:center; color:#666; border:1px solid #c6c6c6; border-radius:2px; background-color:#fff;} .btnMore:after {content:''; display:inline-block; margin-left:7px; padding-bottom:2px; border-left:4px solid transparent; border-right:4px solid transparent; border-bottom:0; border-top:5px solid #adadad;} .board .btnMore {} /* icon */ .icon {display:inline-block; font:0/0 a; text-align:center; background-image:url('/static/images/common/pictogram_sprite.png'); background-repeat:no-repeat; background-size:360px auto; pointer-events:none;} .icon.arrowRight {width:5px; height:9px; background-image: url('/static/images/common/icon_sprite.png'); background-position:-195px 0;} .icon.arrowRight2 {width:5px; height:9px; background-image: url('/static/images/common/icon_sprite.png'); background-position:-115px 0;} .icon.arrowRight3 {width:5px; height:9px; background-image: url('/static/images/common/icon_sprite.png'); background-position:-125px 0;} .icon.arrowBottom {width:8px; height:5px; background-image: url('/static/images/common/icon_sprite.png'); background-position:-150px 0;} .icon.arrowBottom2 {width:8px; height:5px; background-image: url('/static/images/common/icon_sprite.png'); background-position:-150px -10px;} .icon.arrowBottom3 {width:8px; height:5px; background-image: url('/static/images/common/icon_sprite.png'); background-position:-150px -20px;} .icon.basket {width:13px; height:15px; background-position:-250px 0;} .icon.big {width:30px; height:30px; background-position:0 -75px; vertical-align:top;margin-top:9px} .icon.bookmark {width:18px; height:18px; background-position:0 -50px;} .icon.bookmark.active {background-position:-25px -50px;} .icon.bookmark.white {width:18px; height:18px; background-position:-50px -50px;} .icon.bookmark.white.active {background-position:-75px -50px;} .icon.camera {width:15px; height:13px; background-position:-340px 0;} .icon.cart {width:23px; height:20px; padding:0; background-position:0 0; vertical-align:inherit;} .icon.cart2 {width:27px; height:22px; background-position:-150px 0; vertical-align:sub;} .icon.calendar {width:18px; height:19px; background-position:-125px 0;} .icon.couple.sm {width:15px; height:15px; background-position:-280px -25px;} .icon.close {background-image: url('/static/images/common/icon_sprite.png'); background-repeat:no-repeat; background-size: 360px auto;} .icon.close2 {width:17px; height:17px; background-position:-125px -25px; background-image: url('/static/images/common/icon_sprite.png'); background-repeat:no-repeat; background-size: 360px auto;} .icon.close.sm {width:8px; height:8px; background-position:-245px 0;} .icon.close.md {width:11px; height:11px; background-position:-215px -25px;} .icon.delivery {width:20px; height:12px; background-position:-300px 0;} .icon.delete {width:17px; height:17px; vertical-align:top; background-position:-290px -25px; background-image: url('/static/images/common/icon_sprite.png');} .icon.delete:after {content:''; display:inline-block;} .icon.edit {width:12px; height:13px; background-position:-325px 0;} .icon.tile {width:18px; height:18px; padding:0; background-position:-75px 0;} .icon.list {width:18px; height:18px; background-position:-25px 0;} .icon.like {width:21px; height:18px; background-position:-200px 0; vertical-align:text-top;} .btn.active .icon.like {background-position:-275px 0;} .icon.treeMore {width:23px; height:9px; background-position:-150px -25px;} .icon.lower1 {width:7px; height:8px; background-position:-225px -25px;} .icon.lower2 {width:7px; height:8px; background-position:-225px -35px;} .icon.tel {width:20px; height:20px; background-position:-200px -25px;} .icon.tel2 {width:20px; height:20px; background-position:-175px -25px;} .icon.tel3 {width:15px; height:15px; background-position:-260px -25px;} .icon.tl {width:20px; height:20px; background-position:-235px -25px;} .icon.tip {width:25px; height:25px; background-position:-240px -25px; background-image: url('/static/images/common/icon_sprite.png');} .icon.share {width:21px; height:20px; background-position:-225px 0; vertical-align:text-top;} .icon.search {width:20px; height:21px; background-position:-25px -25px; background-image: url('/static/images/common/layout_sprite.png'); } .icon.search2 {width:20px; height:21px; background-position:-50px -25px; background-image: url('/static/images/common/layout_sprite.png'); } .icon.soldOut {background-image: url('/static/images/common/icon_soldout.png'); background-repeat:no-repeat; background-size: 360px auto;} .icon.soldOut.sm {width:44px; height:30px; margin-top:29px; background-position:0 0;} .icon.soldOut.md {width:59px; height:41px; background-position:-50px 0;} .icon.soldOut.lg {width:84px; height:62px; background-position:-125px 0;} .icon.soldOut01 {background-image: url('/static/images/common/icon_soldout01.png'); background-repeat:no-repeat; background-size: 360px auto;} .icon.soldOut01.sm {width:64px; height:40px; margin-top:29px; background-position:0 0;} .icon.soldOut01.md {width:83px; height:52px; background-position:-72px 0;} .icon.soldOut01.lg {width:101px; height:63px; background-position:-171px 0;} .icon.sellOut01 {background-image: url('/static/images/common/icon_soldout01.png'); background-repeat:no-repeat; background-size: 360px auto;} .icon.sellOut01.sm {width:64px; height:40px; margin-top:29px; background-position:0 0;} .icon.sellOut01.md {width:83px; height:52px; background-position:-72px 0;} .icon.sellOut01.lg {width:101px; height:63px; background-position:-171px 0;} .icon.star {width:11px; height:11px; background-position:-325px -25px; background-image: url('/static/images/common/icon_sprite.png');} .icon.new {width:40px; height:40px; background-image: url('/static/images/common/icon_new.png'); background-position:-25px 0; background-repeat:no-repeat; background-size: 360px auto;} .icon.new.lg {width:60px; height:60px; background-position:-75px 0;} .icon.new.sm {width:16px; height:16px; background-position:0 0;} .icon.file {content:''; width:16px; height:16px; background-position:-50px 0; background-repeat:no-repeat; background-size: 360px auto; background-image: url('/static/images/common/icon_sprite.png');} .icon.file.sm { background-position:-50px -25px;} .icon.prev2 {background-image:url('/static/images/common/layout_sprite.png'); width:20px; height:16px; background-position:-75px 0;} .icon.prev3 {width:9px; height:17px; background-position:-210px 0; background-image:url('/static/images/common/layout_sprite.png');} .icon.refresh {width:20px; height:21px; background-image: url('/static/images/common/icon_sprite.png');background-position: -290px 0;background-repeat: no-repeat;background-size: 360px auto;} .icon.ellipsis {width:5px; height:23px; background-position:-200px 0; background-image:url('/static/images/common/layout_sprite.png');} .btn.active .icon.list {background-position:-50px 0;} .btn.active .icon.tile {background-position:-100px 0;} .icon.check {width:16px; height:12px; background-image: url('/static/images/common/icon_sprite.png'); background-position:-75px 0;} .btn.active .icon.check {background-position:-50px 0;} .icon.plus {width: 10px;height: 10px;background-image: url('/static/images/common/icon_sprite.png');background-position: -100px 0;background-repeat: no-repeat;background-size: 360px auto;} .icon.plus2 {width:12px; height:12px; background-image:url('/static/images/common/icon_sprite.png'); background-position:0 0; background-repeat:no-repeat; background-size:360px auto;} .icon.lowerLeft {width:20px; height:20px; background-image:url('/static/images/common/icon_sprite.png'); background-repeat:no-repeat; background-size:360px auto; background-position:-315px 0; vertical-align:text-top;} .icon.lowerRight {width:20px; height:20px; background-image:url('/static/images/common/icon_sprite.png'); background-repeat:no-repeat; background-size:360px auto; background-position:-335px 0; vertical-align:text-top;} .icon.lowerLeft.small {width:17px; height:17px;} .icon.lowerRight.small {width:17px; height:17px;} .icon.lowerLeftLg {width:21px; height:21px; background-image:url('/static/images/common/icon_sprite.png'); background-repeat:no-repeat; background-size:360px auto; background-position:0 -25px; vertical-align:text-top;} .icon.lowerRightLg {width:21px; height:21px; background-image:url('/static/images/common/icon_sprite.png'); background-repeat:no-repeat; background-size:360px auto; background-position:-25px -25px; vertical-align:text-top;} .icon.remove {width:15px; height:15px;background-image: url('/static/images/common/icon_sprite.png');background-position: -25px 0;background-repeat: no-repeat;background-size: 360px auto;} .icon.sns {width:37px; height:36px; background-image:url('/static/images/common/icon_sns.png');} .icon.sns.kakao {background-position:0 0;} .icon.sns.band {background-position:-50px 0;} .icon.sns.fb {background-position:-100px 0;} .icon.sns.tw {background-position:-150px 0;} .icon.sns.url {background-position:-200px 0;} .icon.sns.whatsapp {background-position:-250px 0;} .icon.sns.line {background-position:-300px 0;} .icon.treeguide{ width:42.5px; height:23px; background-image:url('/static/images/common/tree_icon_guide.gif'); background-size:42.5px 23px;} .icon.sm.sns {width: 17px; height: 17px; vertical-align: sub; background-size: 100% auto; background-position: 0 0;} .icon.sm.sns.fb {background-image: url('/static/images/common/icon_facebook.png')} .icon.sm.sns.band {background-image: url('/static/images/common/icon_band.png')} .icon.large {background-image: url('/static/images/common/icon_large.png');} .icon.large.bookMark {width:50px; height:48px; background-position:-225px 0;} .icon.large.cart {width:57px; height:46px; background-position:-75px 0;} .icon.large.certification {width:107px; height:96px; background-position:-200px -390px;} .icon.large.fail {width:99px; height:99px; background-position:-100px -390px;} .icon.large.like {width:60px; height:51px; background-position:0 0;} .icon.large.pw {width:73px; height:99px; background-position:0 -175px;} .icon.large.reserve {width:99px; height:99px; background-position:-200px -75px;} .icon.large.search {width:88px; height:95px; background-position:0 -75px;} .icon.large.success {width:99px; height:99px; background-position:-100px -175px;} .icon.large.waiting {width:99px; height:99px; background-position:0 -390px;} .icon.large.pinch {width:54px; height:52px; background-position:0 -500px;} .icon.payment {background-image:url('/static/images/common/payment_logo.png'); vertical-align:middle;} .icon.payment.uplus {width:24px; height:21px; background-position:0 0;} .icon.payment.inipay {width:26px; height:26px; background-position:-25px 0;} .icon.payment.kpay {width:29px; height:33px; background-position:-60px 0;} .icon.payment.paynow {width:53px; height:16px; background-position:-90px 0;} .icon.payment.paynowBiz {width:77px; height:19px; background-position:-145px 0;} .icon.card { background-image: url('/static/images/common/payment_card.png'); height: 10px; vertical-align: middle; background-size: 360px auto; } .icon.card.visa { width: 22px; background-position: 0 0;} .icon.card.master { width: 16px; background-position: -25px 0;} .icon.card.american{ width: 10px; background-position: -50px 0;} .icon.card.jcb { width: 14px; background-position: -75px 0;} .icon.card.bancnet { width: 33px; background-position: -100px 0;} .icon.card.payon { width: 32px; background-position: -150px 0;} .icon.official {width: 15px; height: 15px; vertical-align: middle; margin-top: -2px; background-size: 100% auto;} .icon.official.instagram {background-image:url('/Static/images/common/icon_instagram.png');} .icon.official.facebook {background-image:url('/Static/images/common/icon_facebook.png');} .icon.social {width: 20px; height: 20px; vertical-align: middle; margin-top: -2px; background-size: 157.5px auto; background-image:url('/Static/images/common/icon_social.png');} .icon.social.instagram {background-position: 0 0; } .icon.social.facebook {background-position: -27.5px 0; } .icon.social.band {background-position: -55px 0;} .icon.social.atomymobile {background-position: -82.5px 0;} .icon.social.atomyticket {background-position: -110px 0;} .icon.social.atomychannel {background-position: -137.5px 0;} /* stateFlag */ .stateFlag{ display:inline-block; width:18px; height:18px; background-image:url('/Static/images/common/stateFlag.png'); background-repeat:no-repeat; background-size:18px auto; } .stateFlag.state-KR{ background-position:0 0px;} .stateFlag.state-JP{ background-position:0 -20px;} .stateFlag.state-TW{ background-position:0 -40px;} .stateFlag.state-SG{ background-position:0 -60px;} .stateFlag.state-KH{ background-position:0 -80px;} .stateFlag.state-PH{ background-position:0 -100px;} .stateFlag.state-MY{ background-position:0 -120px;} .stateFlag.state-TH{ background-position:0 -140px;} .stateFlag.state-US{ background-position:0 -160px;} .stateFlag.state-CA{ background-position:0 -180px;} .stateFlag.state-MX{ background-position:0 -200px;} .stateFlag.state-AU{ background-position:0 -220px;} .stateFlag.state-ID{ background-position:0 -240px;} .stateFlag.state-RU{ background-position:0 -260px;} .stateFlag.state-VN{ background-position:0 -280px;} /* topBanner */ .topBannerOn #header {top:50px;} .topBannerOn #body {padding-top:100px;} .topBannerOn .topBanner {display:block;} .topBanner {display:none; position:fixed; left:0; top:0; right:0; z-index:100; height:50px; text-align:center; background-color:#f3f9fb; box-sizing:border-box;} .topBanner .center {position:relative; display:inline-block; padding-top:10px; padding-right:28px;} .topBanner p {display:inline-block; line-height:30px; font-size:15px; color:#333;} .topBanner p strong {color:#00b6f0;} .topBanner .topBannerBtn {position:relative; height:30px; margin-left:25px; padding:1px 28px 0 18px; font-size:13px; color:#00b6f0; vertical-align:top; border:1px solid #00b6f0; border-radius:20px; box-sizing:border-box;} .topBanner .topBannerBtn:after {content:''; display:inline-block; position:absolute; right:18px; top:10px; width:5px; height:8px; background-position:-115px 0; background-image:url('/static/images/common/icon_sprite.png'); background-repeat:no-repeat; background-size:360px auto;} .topBanner .topBannerClose {position:absolute; right:0; top:19px; width:11px; height:11px; font:0/0 a; background-position:-310px -25px; background-image:url('/static/images/common/icon_sprite.png'); background-repeat:no-repeat; background-size:360px auto;} /* Input Search */ input[type='search'] {padding-right:69px; border:1px solid #00b6f0;} input[type='search']::-webkit-search-decoration, input[type='search']::-webkit-search-cancel-button, input[type='search']::-webkit-search-results-button, input[type='search']::-webkit-search-results-decoration {display:none;} .btnDelete {position:absolute; top:0; right:40px; bottom:0; width:29px; height:40px;} /* Video */ .video video {width:100%;} .video .dropDown {height:40px; margin-top:3px; overflow:hidden; box-sizing:border-box; /*-webkit-transition:height .2s ease-in; transition:height .2s ease-in;*/} .video .dropDown.active {height:195px;} .video .dropDown .btn .icon.arrowBottom {margin-top:3px; font:0/0 a; vertical-align:baseline; -webkit-transition: -webkit-transform .2s ease-in; transition:transform .2s ease-in; -webkit-transform: rotate(0deg) translateY(-48%); transform: rotate(0deg) translateY(-48%);} .video .dropDown.active .btn .icon.arrowBottom {-webkit-transform: rotate(-180deg) translateY(50%); transform: rotate(-180deg) translateY(50%);} .video .dropDown .caption {height:145px; overflow:auto; margin-top:10px; padding:12px 15px; font-size:12px; border:1px solid #e2e2e2; border-radius:2px; box-sizing:border-box;} .video .dropDown .caption p {margin-top:5px;} .video .dropDown .caption p:first-child {margin-top:0;} /* row col */ .row.btns {display:table; width:100%; box-sizing:border-box;} .row.btns.margin {padding:0 15px; margin:15px 0;} .row.btns.margin:last-of-type {padding-bottom:15px; margin-bottom:0;} .row.btns .col {display:table-cell; float:none;} .row.btns .col .btn {width:100%;} .row.btns .col .btn.text-overflow {font-size: 13px; line-height: 1.2;} .row.btns .col .btn.lg.text-overflow {font-size: 100%; line-height: 1.2;} .row.btns .col:first-child:last-child {width:100%;} .row.btns .col:last-child:nth-child(2) {width:50%;} .row.btns .col:first-child:nth-last-child(2) {width:50%;} .row.btns.margin .col:last-child:nth-child(2) {padding-left:3px;} .row.btns.margin .col:first-child:nth-last-child(2) {padding-right:3px;} .row.calendar {position:relative;} .row.calendar .icon.calendar {position:absolute; right:12px; top:10px; pointer-events:none;} .email .row {position:relative; display:table; width:100%;} .email .row .at {position:absolute; right:10px; top:8px; color:#999;} .email .row .col {display:table-cell;} .email .row .col:first-child:last-child {width:100%;} .email .row .col:last-child:nth-child(2) {width:50%;} .email .row .col:first-child:nth-last-child(2) {width:50%; padding-right:5px;} .email .row input[type='text'] {padding-right:25px;} .row.search {position:relative;} .row.search .btnSearch {position:absolute; right:0; top:0; width:40px; height:40px;} .row.search .btnSearch .icon.search2 {vertical-align:middle;} .row.addImg { display: -moz-box; display: -moz-flex; -moz-box-pack: justify; -moz-justify-content: space-between; -moz-align-content: stretch; -moz-box-align: stretch; -moz-align-items: stretch; display: -webkit-box; display: -webkit-flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -webkit-align-content: stretch; -webkit-box-align: stretch; -webkit-align-items: stretch; display: flex; justify-content: space-between; align-content: stretch; align-items: stretch; box-sizing:border-box; } .row.addImg .col {position:relative; overflow:hidden; width:32%; box-sizing:border-box; -moz-box-flex: 0; -moz-flex: 0 1 auto; -webkit-box-flex: 0; -webkit-flex: 0 1 auto; flex: 0 1 auto; } .row.addImg .col .image {display:block; padding-bottom:100%; position:relative; overflow:hidden; width:100%; height:0; font:0/0 a; box-sizing:border-box;} .row.addImg .col .image img {object-fit:cover; width:100%; height:100%; position:absolute; left:0; top:0; right:0; bottom:0;} .row.addImg .col input {position:absolute; left:0; top:0; right:0; bottom:0; opacity:0;} .row.addImg .col label {display:inline-block; position:absolute; left:0; top:0; right:0; bottom:0; opacity:0; font:0/0 a;} .row.addImg .col.file {} .row.addImg .col.file:before {content:''; display:inline-block; width:35px; height:30px; position:absolute; left:50%; top:50%; z-index:1; margin:-15px 0 0 -17px; pointer-events:none; background-image:url('/static/images/common/pictogram_sprite.png'); background-position:-325px -15px; background-repeat:no-repeat; background-size:360px auto;} .row.addImg .col.file .image {background-color:#c9c9c9;} .row.addImg .col.file .radioLabel {display:none;} .row.addImg .col.file.imageOn .radioLabel {display:block; z-index:2;} .row.addImg .col.file.imageOn .fileLabel {position:absolute; left:inherit; bottom:inherit; right:15px; top:15px; z-index:3; display: inline-block; opacity:1; width: 15px; height: 13px; font: 0/0 a; text-align: center; background-image: url('/static/images/common/pictogram_sprite.png'); background-color:transparent; background-repeat: no-repeat; background-size: 360px auto; background-position: -340px 0; } .row.addImg .col.file.imageOn input[type='file'] {border:1px solid red; z-index:3; left:inherit; bottom:inherit; width:35px; height:35px;} .row.addImg .col.active:after{content:''; display:block; position:absolute; left:0; top:0; right:0; bottom:0; z-index:2; border:2px solid #00b6f0; pointer-events:none;} /*.row.addImg .col.file .icon.camera {display:none; position:absolute; right:15px; top:15px; z-index:3;} .row.addImg .col.file.active .icon.camera {display:inline-block;}*/ .row.addImg .col.file.imageOn:before {left:inherit; right:7px; top:7px; width:30px; height:30px; margin:0; border-radius:50%; background-color:rgba(0,0,0,.5); background-image:none;} /*.row.addImg .col.active label {border:2px solid #00b6f0;}*/ .date {display:block; position:relative;} .date .btn {position:absolute; right:10px; top:10px;} /* 필터셋 */ .filterSet {margin-bottom:20px; padding:5px 15px 15px; background-color:#fff; -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.1); box-shadow: 0 1px 1px rgba(0,0,0,.1);} .filterSet .bullet {margin-top:4px;} .filterSet .row.btns .col {width:20%; padding-left:5px;} .filterSet .row.btns .col:first-child {padding-left:0;} .filterSet .row.btns .col.more {position:relative; overflow:hidden;} .filterSet .row.btns .col.more select {opacity:0; position:absolute; left:0; top:0; right:0; bottom:0;} .filterSet .row.btns .col .btn {padding:0;overflow:hidden;} .filterSet .row.btns .col .btn.default.press, .filterSet .row.btns .col .btn.default:active, .filterSet .row.btns .col .btn.active {color:#00b6f0; border:1px solid #00b6f0; opacity:1;} .filterSet .row.btns .col .btn.default:disabled:active, .filterSet .row.btns .col .btn.default:disabled.active, .filterSet .row.btns .col .btn.default.disabled.press {border:1px solid #e2e2e2; color:#b2b2b2;} .filterSet .row.btns .col .btn .icon.search {vertical-align: text-top; margin-top:-2px;} .filterSet .row.btns:nth-child(2) {margin-top:5px;} .filterSet .row.period {display:table; table-layout:fixed; position:relative; width:100%; margin-top:5px; box-sizing:border-box;} .filterSet .row.period .col {position:relative; display:table-cell; width:48%;} .filterSet .row.period .col.dash {width:6%; text-align:center; vertical-align:middle;} .filterSet .row.period .col input[type='date']{/*padding-right:30px;*/ font-size:14px; color:#333;} .filterSet .row.period .col .icon.calendar {position:absolute; right:10px; top:10px; pointer-events:none;} .filterSet .row.period >.btn {position:absolute; right:0; top:0; width:80px;} .filterSet .row.cell2 {display:table; width:100%; margin-top:5px;} .filterSet .row.cell2 .col {display:table-cell; width:65%; padding-left:5px;} .filterSet .row.cell2 .col:first-child {width:35%; padding-left:0;} .filterSet .row.cell2 .col input[placeholder] {font-size:12px;} /* #482 추가 */ .filterSet .row.cell3 {display:table; table-layout:fixed; position:relative; width:100%; margin-top:5px; box-sizing:border-box;} .filterSet .row.cell3 .col {position:relative; display:table-cell; padding-left:5px;} .filterSet .row.cell3 .col:first-child {width:27%; padding-left:0;} .filterSet .row.cell3 .col:nth-child(2) {width:51%;} .filterSet .row.cell3 .col:last-child {width:23%;} .filterSet .row.cell3 .col:last-child .btn.md{width:100%;padding:0 4px;} .filterSet .row.cell3 .col:last-child .icon.search{vertical-align: sub;} .filterSet .row.btns {margin-top:10px;} /* Tab */ .tab {display:table; position:relative; table-layout:fixed; width:100%; text-align:center; white-space:nowrap; background-color:#fff; box-shadow:inset 0 -1px 0 .5px #e1e1e6;} .tab span {display:table-cell; width:33.3333%; padding-bottom:1px;} .tab span a {display:block; position:relative; height:45px; line-height:45px; color:#010101; background-color:#fff; box-sizing:border-box;} .tab span.active a {color:#06a6e2; line-height:44px; } .tab span.active a:after {content:''; display:block; position:absolute; left:0; right:0; bottom:-1px; z-index:1; border-bottom:2px solid #07a7e3;} /* #612 */ .org.tab span.active a {color:#f9993b; line-height:44px; } .org.tab span.active a:after {content:''; display:block; position:absolute; left:0; right:0; bottom:-1px; z-index:1; border-bottom:2px solid #f9993b;} #header .tab.hide {display:none;} #header .tab { right:0; left:0;margin-top: 10px; z-index:110;} .tab.dark {background-color:#4b5969;} .tab.dark:after {content:none;} .tab.dark span a {color:#c4c7cc; font-size:15px; background-color:#4b5969; border-bottom:1px solid #4b5969;} .tab.dark span.active a {color:#00b6f0; border-bottom:3px solid #00b6f0;} .tab.dark span.active a:after {content:none;} .tab.type2 {box-sizing:border-box; background-color:transparent; box-shadow:none;} .tab.type2:after {display:none;} .tab.type2 span a {height:40px; line-height:40px; color:#707780; border:1px solid #707780;} .tab.type2 span:first-child a {border-radius:2px 0 0 2px;} .tab.type2 span:last-child a {border-radius:0 2px 2px 0;} .tab.type2 span.active a {background-color:#707780; color:#fff;} .tab.type2 span.active a:after {content:none;} .tab.type3 {display:table; height:45px; box-shadow:none;} .tab.type3 span {display:table-cell;} .tab.type3 span a {height:45px; line-height:45px; color:#666; border-bottom:1px solid #c6c6c6; border-left:1px solid #c6c6c6; background-color:#f6f6f8;} .tab.type3 span a:after {content:none;} .tab.type3 span.active a {font-size:14px; color:#fff; background-color:#707780; border-bottom:1px solid #707780;} .tab.type3 span:first-child, .tab.type3 span.active + span a {border-left:none;} .tabContent {display:none;} .tabContent.active {display:block;} .tab.scroll {display:block; white-space:nowrap; overflow-x:scroll; overflow-y:hidden; font-size:0;} .tab.scroll:after {content:''; display:block; clear:both;} .tab.scroll span {display:inline-block; } .tab.scroll span a {padding:0 15px; font-size:14px;} /* Table */ .table {width:100%;} .table {font-size:14px; border-top:1px solid #707780;} .table thead th {height:45px; padding:5px; font-size:14px; color:#333; text-align:center; background-color:#f6f6f8; box-sizing:border-box; vertical-align:middle;} .table tbody th, .table tbody td { text-align:left; border-bottom:1px solid #e2e2e2; background-color:#fff; vertical-align:middle;} .table tbody th {height:45px; padding:0 10px; color:#010101; background-color:transparent;} .table tbody td {padding:10px; color:#333; background-color:transparent;} .table.view {border-bottom:1px solid #e2e2e2;} .table.view thead th {} .table.view tbody th {background-color:#f6f6f8;} .table.view tbody th, .table.view tbody td {vertical-align:middle;} .table.border th, .table.border td {border-left:1px solid #e2e2e2;} .table.border thead tr th:first-child, .table.border tbody tr th:first-child, .table.border tbody tr td:first-child {border-left:none;} .table .noLine th, .table .noLine td {border-bottom:none; padding-bottom:0;} .table .noLine + tr th, .table .noLine + tr td {padding-top:5px;} .table.inLine thead th, .table.inLine tbody th, .table.inLine tbody td {border-left:1px solid #e2e2e2;} .table.inLine thead th:first-child, .table.inLine tbody th:first-child, .table.inLine tbody td:first-child {border-left:none;} .table.border.primary th, .table.border.primary td {border:1px solid #e2e2e2;} .table.border.primary th {background-color:#f3f9fb;font-weight:bold} .table.border.primary td {text-align:center;background-color:white} .table.border.primary thead tr th:first-child, .table.border.primary tbody tr th:first-child, .table.border.primary tbody tr td:first-child {border-left:1px solid #e2e2e2;} .table .row.cell2 {display:table; width:100%;} .table .row.cell2 .col {display:table-cell; width:50%; padding-left:5px;} .table .row.cell2 .col:first-child {padding-left:0;} .table .row.cell4 {display:table; width:100%;} .table .row.cell4 .col {display:table-cell; width:25%; padding-left:5px;} .table .row.cell4 .col:first-child {padding-left:0;} .table .row.cell4 .col input {padding:0 4px; text-align:center;} .table .row.cell4 .col input[type='password'] {font-family:Verdana; letter-spacing:2px;} .table .row + .row {margin-top:5px;} .table .row.each {position:relative; padding-right:95px; min-height:40px;} .table .row.each .col:first-child {} .table .row.each .col:last-child {position:absolute; right:0; top:0;} .table .row.each .col .btn {width:90px; padding:0 5px;} .table .row.sides:after {content:''; display:block; clear:both;} .table .row.sides .left {float:left;} .table .row.sides .right {float:right;} .table .row.sides.btns .right .btn {width:90px;} .table .row.zipcode {display:table; width:100%; table-layout:fixed;} .table .row.zipcode .col {display:table-cell; padding-left:5px;} .table .row.zipcode .col:first-child {width:78px; padding-left:0;} .table .row.phonetic {display:table; width:100%; table-layout:fixed;} .table .row.phonetic .col {display:table-cell; padding-left:5px;} .table .row.phonetic .col:first-child {width:40px; padding-left:0;} .table .row.prepend {display: flex; align-items: center;} .table .row.prepend .prependItem {padding: 0 5px;} .table .row.prepend .prependItem:first-child {padding-left: 0;} .table .row.prepend .col {flex: 1 1 auto;} .table.limpid {border-top:none; border-bottom:1px solid #eaebec;} .table.limpid tbody th, .table.limpid tbody td {height:30px; text-align:left; border:none; background-color:#fff; box-sizing:border-box;} .table.infos {border:none;line-height:1.2;} .table.infos tbody th, .table.infos tbody td {height:22px; text-align:left; border:none; background-color:#fff; box-sizing:border-box;padding:0;color:#333;} .table.infos tbody th{font-size:13px;} .table td .countBox {display: inline-block; padding: 0 5px; border: 1px solid #999; } /* Board */ .board {} .board .list {/* padding:0 15px; 여백은 margin 클래스로 주기 review쪽 깨짐 */} .board .list > li {margin-bottom:6px; background-color:#fff; border:1px solid #e2e2e2;} .board .list > li .head {height:45px; padding:9px 13px 0; background-color:#f3f9fb; font-size:14px; box-sizing:border-box;} .board .list > li .content {padding:11px 13px; background-color:#fff;} .board .list > li .head.hghauto{height:auto;min-height:42px;overflow:hidden;padding-bottom:3px} .board .list > li .head.hghauto .title span{float:left;box-sizing:border-box;} .board .list > li .head.hghauto .title span:first-child{font-weight:bold} .board .list.white > li {} .board .list.white > li .head {background-color:#fff; border-bottom:1px solid #e2e2e2;} .board .list.white > li .content {} .board .list2 {border-top:1px solid #707780; } .board .list2 > li {padding:15px 0; border-bottom:1px solid #e2e2e2;} .board .list3 {} .board .list3 > li {padding:15px 0; border-top:1px solid #eaebec;} .board .list3 > li:first-child {border-top:none;} .board .list4 {border-top:1px solid #e2e2e2;} .board .list4 > li {border-bottom:1px solid #e2e2e2;} .reviews .board .list > li .head {position:relative; padding-right:100px;} .reviews .board .list > li .head .name {font-size:14px; color:#333;} .reviews .board .list > li .head time {position:absolute; right:15px; top:12px; font-size:13px; color:#999;} .reviews .board .list > li .content {font-size:13px; color:#666;} .reviews .board .list > li .content h2 {font-size:14px; color:#333;} .seminarInfo .board {margin-top:15px;} .seminarInfo .board .list {font-size:13px; background-color:#fff; border:1px solid #e2e2e2; border-radius:2px;} .seminarInfo .board .list + .list {margin-top:6px;} .seminarInfo .board .list .head {position:relative; padding:12px 15px; border-bottom:1px solid #e2e2e2;} .seminarInfo .board .list .content {padding:15px; color:#333;} .seminarInfo .board .list .footer {border-top:1px solid #e2e2e2;} .seminarInfo .board .list .footer .btn {font-size:13px; color:#666;} .board.agreement .list2 p {font-size:14px; color:#333;} .board.agreement .list2 small {display:block; margin:5px 0; font-size:12px; color:#666; line-height:1.5;} .board.agreement .list2 label {display:inline-block; font-size:14px; color:#333; vertical-align:top; -webkit-transform:translateY(6px); transform:translateY(6px);} .board.agreement .list2 > li {position:relative; min-height:46px; padding:7px 0 7px 30px; box-sizing:border-box;} .board.agreement .list2 li .checkbox {position:absolute; left:0; top:10px;} .board.agreement .checkAll {padding:13px 0 15px; color:#333; border-top:1px solid #707781;} .board.agreement .checkAll div {position:relative; margin:16px 0 0;} .board.agreement .checkAll div label {color:#333;} .board.agreement .checkAll div .checkbox {top:0;} .board.detail {} .board.detail header {padding:15px;} .board.detail header .info {} .board.detail header .title {display:inline;} .board.detail header .icons {display:inline-block; height:16px; vertical-align:sub;} .board.detail header .icons:after {content:''; display:block; clear:both;} .board.detail header .icons .icon {float:left; margin-left:3px; vertical-align:text-bottom;} .board.detail header .icons .icon:first-child {margin-left:0;} .board.detail header .title {font-size:14px; color:#333;} .board.detail .content {padding:15px; font-size:13px; color:#666; border-top:1px solid #e2e2e2; border-bottom:1px solid #e2e2e2;} .board.detail .content .image {margin:15px 0;} .board.detail .content .file {} .board.detail .content .file dl {position:relative; margin:15px 0 10px; padding:13px 15px 10px 75px; font-size:12px; border:1px solid #e2e2e2;} .board.detail .content .file dl dt {position:absolute; left:15px; top:13px; color:#333;} .board.detail .content .file dl dt:after {content:''; display:inline-block; position:absolute; right:-10px; top:1px; height:13px; border-left:1px solid #e2e2e2;} .board.detail .content .file dl dd {color:#666; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;} /* Form */ .row.tel {display:table; width:100%;} .row.tel .col {display:table-cell; width:33%;} .row.tel .col {display:table-cell; padding-left:5px;} .row.tel .col:first-of-type {width:28%; padding-left:0;} /* Panel Box */ .panel {background-color:#fff; border:1px solid #e1e1e6;} .panel header, .panel .content {padding:13px 14px;} .panel .title {font-weight:bold; font-size:15px; color:#333;} /* noData */ .noData {position:relative; text-align:center;} .noData:after {content:''; display:block; position:absolute; left:50%; top:0; background-image: url('/static/images/common/icon_large.png'); background-repeat:no-repeat; background-size:360px auto;} .noData.search {text-align:center; margin:90px 0; padding-top:110px; font-size:17px;} .noData.search:after {width:88px; height:95px; margin-left:-44px; background-position:0 -75px;} .noData.search .text1 {font-size:17px; color:#666; margin-bottom:10px;} .noData.search .text2 {font-size:13px; color:#666;} .noData.search .icon {margin-bottom:5px;} .noData.product {padding-top:118px; margin-top:90px; margin-bottom:40px;} .noData.product:after {width:99px; height:99px; margin-left:-50px; background-position:-100px -175px;} .noData.orders {padding-top:115px;} .noData.orders:after {width:87px; height:94px; margin-left:-43px; background-position:-100px -75px;} .noData.delivery {padding-top:90px;} .noData.delivery:after {width:126px; height:79px; margin-left:-70px; background-position:-200px -175px;} .noData.reviews {padding-top:110px;} .noData.reviews:after {width:90px; height:90px; margin-left:-45px; background-position:0 -290px;} .noData.cart {padding-top:110px; margin-top:150px;} .noData.cart:after {width:106px; height:89px; margin-left:-53px; background-position:-100px -290px;} .noData.favorite {padding-top:110px; margin-top:170px;} .noData.favorite:after {width:112px; height:93px; margin-left:-56px; background-position:-210px -290px;} .noData.bubble {padding-top:60px; margin-top:150px;} .noData.bubble:after {width:65px; height:50px; margin-left:-33px; background-position:-150px 0;} .noData .icon.large.reserve {margin-bottom:10px;} .noData.buyHistory {padding-top:120px;} .noData.buyHistory:after {width:99px; height:99px; margin-left:-50px; background-position:0 -390px;} /* Banner */ .banner.colors a {display:block; position:relative; height:40px; padding:9px 14px 0; color:#fff; font-size:12px; border-radius:2px; box-sizing:border-box;} .banner.colors a + a {margin-top:6px;} .banner.colors a:after {content:''; display:inline-block; position:absolute; right:15px; top:50%; width:5px; height:8px; margin-top:-4px; background-image: url('/static/images/common/icon_sprite.png'); background-position:-195px -10px; background-repeat:no-repeat; background-size: 360px auto;} .banner.colors a strong {font-size:16px;} .banner.colors a.darkgray {background-color:#707780;} .banner.colors a.gray {background-color:#8e96a1;} .banner.colors a.white {background-color:#fff; color:#666; border:1px solid #e2e2e2;} /* Slider */ .slider {position:relative; overflow:hidden;} .slick-slide {position:relative;} .slider .listSlide {position:absolute; left:0; top:0; right:0; bottom:0;} .slider .listSlide .item a {display:block; background-color:#ccc;} .slider .listSlide .item a.press, .slider .listSlide .item a:active {opacity:1;} .slider .slideInfo {position:absolute; right:0; bottom:9px; height:27px;} .slider .slideInfo .paging {display:inline-block; -webkit-transform:translateY(50%); transform:translateY(50%); line-height:1; margin-right:18px; padding-top:1px; font-size:13px; color:#333; vertical-align:top; box-sizing:border-box;} .slider .slideInfo .paging span {vertical-align:top;} .slider .slideInfo .paging em {font-weight:bold; vertical-align:baseline;} .slider .slideInfo .btnViewAll {position:relative; height:27px; padding:0; vertical-align:top; font-size:12px; color:#fff; text-align:left; background-color:rgba(51,51,51,.6); box-sizing:border-box;} .slider .slideInfo .btnViewAll span {display:inline-block; margin-right:28px; position:relative; left:0;} .slider .slideInfo .btnViewAll:before {content:''; display:inline-block; position:absolute; left:-14px; top:0; width:14px; height:27px; background-color:rgba(51,51,51,.6); border-radius:14px 0 0 14px; overflow:hidden; box-sizing:border-box; font:0/0 a;} .slider .slideInfo .btnViewAll:after {content:''; display:block; position:absolute; right:10px; top:50%; width:12px; height:12px; margin-top:-6px; background-image:url('/static/images/common/icon_sprite.png'); background-position:0 0; background-repeat:no-repeat; background-size:360px auto;} .slider .indicator {position:absolute; left:0; right:0; bottom:0; height:0; text-align:center; pointer-events:none;} .slider .indicator li {position:relative; bottom:20px; display:inline-block; height:10px; margin-left:7px;} .slider .indicator li:first-child {margin-left:0;} .slider .indicator li button {font:0/0 a; width:10px; height:10px; vertical-align:top; background-color:#fff; border:2px solid #c0c0c0; border-radius:50%;} .slider .indicator li.slick-active button {background-color:#969696; border:none;} .slider .indicator.expand {} .slider .indicator.expand li {width:10px; height:10px; font:0/0 a; border-radius:50%; background-color:#7fdaf7; border:none; overflow:hidden; color:#00b6f0; vertical-align:middle; -webkit-transition:all .1s ease-in; transition:all .1s ease-in;} .slider .indicator.expand li.active {width:auto; height:23px; line-height:23px; padding:0 13px; font-family:sans-serif; border-radius:20px; font-size:13px; color:#fff; background-color:#00b6f0;} .slider .location {position:absolute; right:15px; bottom:15px;} .slider .location .slick-dots li {display:inline-block; width:10px; height:10px; border-radius:50%; box-sizing:border-box;} .slider .location .slick-dots li + li {margin-left:5px;} .slider .location .slick-dots li button {display:block; width:100%; height:100%; font:0/0 a; border:1px solid #fff; border-radius:50%;box-sizing:border-box;} .slider .location .slick-dots li.slick-active button {background-color:#fff;} .slider .controls {position:absolute; left:0; top:50%; right:0;} .slider .controls:after {content:''; display:block; clear:both;} .slider .controls .btn {width:20px; height:30px; padding:0; background-color:rgba(0,0,0,.4);} .slider .controls .btn .icon {width:6px; height:10px; margin-top:-2px; vertical-align:middle; background-image:url('/static/images/common/icon_sprite.png'); background-position:-225px 0;} .slider .controls .btn:first-child {float:left;} .slider .controls .btn:first-child .icon {-webkit-transform: rotate(180deg); transform: rotate(180deg);} .slider .controls .btn:last-child {float:right;} .slider .controls .btn:last-child .icon {margin-right:-1px;} .slider .controls button {width:20px; height:30px; padding:0; font:0/0 a; background-color:rgba(0,0,0,.4);} .slider .controls button:after {content:''; display:inline-block; width:6px; height:10px; vertical-align:middle; background-image:url('/static/images/common/icon_sprite.png'); background-position:-225px 0; background-repeat:no-repeat; background-size:360px auto; pointer-events:none;} .slider .controls .slick-prev {float:left;} .slider .controls .slick-prev:after {-webkit-transform: rotate(180deg); transform: rotate(180deg);} .slider .controls .slick-next {float:right;} .slider .controls .slick-next:after {margin-right:-1px;} /* 세미나일정표, 나의 일정 */ .schedule {position:relative;} .schedule .controls {position:fixed; left:0; top:50px; right:0; z-index:1; height:50px; margin-bottom:15px; padding-top:11px; text-align:center; background-color:#fff; box-sizing:border-box; -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.1); box-shadow: 0 1px 1px rgba(0,0,0,.1);} .schedule .controls time {font-size:19px; color:#333;} .schedule .controls nav {} .schedule .controls nav a {display:inline-block; position:absolute; width:30px; height:30px; left:50%; top:0; z-index:1; padding:19px 10px 0; font:0/0 a;} .schedule .controls nav a.prev {margin-left:-120px;} .schedule .controls nav a.next {margin-left:70px; } .schedule .controls nav a:after {content:''; display:inline-block; width:7px; height:13px; background-image:url('/static/images/common/icon_sprite.png'); background-position:-265px 0; background-repeat:no-repeat; background-size:360px auto;} .schedule .controls nav a.prev:after {background-position:-255px 0;} /* #612 controlsNo */ .schedule .controlsNo {position:relative;left:0;right:0; z-index:1; height:50px; margin-bottom:15px; padding-top:11px; text-align:center; background-color:#fff; box-sizing:border-box; -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.1); box-shadow: 0 1px 1px rgba(0,0,0,.1);} .schedule .controlsNo button{position:absolute;top:-2px;} .schedule .controlsNo button.calendarM{left:15px;} .schedule .controlsNo button.calendarD{left:48px;} .schedule .controlsNo button.calendarE{right:15px;} .schedule .controlsNo time {font-size:19px; color:#333;} .schedule .controlsNo nav {} .schedule .controlsNo nav a {display:inline-block; position:absolute; width:30px; height:30px; left:50%; top:0; z-index:1; padding:19px 10px 0; font:0/0 a;} .schedule .controlsNo nav a.prev {margin-left:-100px;} .schedule .controlsNo nav a.next {margin-left:50px; } .schedule .controlsNo nav a:after {content:''; display:inline-block; width:7px; height:13px; background-image:url('/static/images/common/icon_sprite.png'); background-position:-265px 0; background-repeat:no-repeat; background-size:360px auto;} .schedule .controlsNo nav a.prev:after {background-position:-255px 0;} /* #612 table */ .schedule .calendarT{text-align:right;margin-bottom:7px;font-size:13px} .schedule .table{width:100%;font-size:14px; border:2px solid #707780;} .schedule .table thead th {height:25px; padding:5px; font-size:14px; color:#fff;text-align:center; background-color:#707780;border-left:1px solid #eaebec; box-sizing:border-box; vertical-align:middle;} .schedule .table thead th:nth-child(1){color:#fc8272;border-left:none;} .schedule .table tbody td {height:45px;padding:0 4px 3px;color:#707780;text-align:left;border-left:1px solid #707780;border-bottom:1px solid #707780; background-color:#fff;box-sizing:border-box;} .schedule .table tbody td:nth-child(1){border-left:none;color:#fc8272} .schedule .table tbody td div.contents{/*display:inline-block;*/min-height:0 !important; overflow:hidden; height:22px;box-sizing:border-box;} .schedule .table tbody td div.contents span{float:left;display:inline-block;} .schedule .table tbody td div.contents span:nth-child(1){font-size:13px;} .schedule .table tbody td div.contents span.dateD{width:19px;height:19px;margin-top:2px;text-align:center;color:#fff;font-weight:bold;background-color:#707780;border-radius:19px;} .schedule .table tbody td div.contents span.dateY{float:right;font:0/0 a;margin-top:6px;} .schedule .table tbody td div.benefitHS{clear:both;overflow:hidden;min-height:18px;padding-top:2px} .schedule .table tbody td div.benefitHS span{float:left;display:block;font:0/0 a;} .schedule .table tbody td div.benefitHS span.benefitH{} .schedule .table tbody td div.benefitHS span.benefitS{float:right;} .schedule .table tbody td.selectDays{display:inline-block; width:100%; border:2px solid #ff9900;/*height:auto*/} .schedule .table tbody td.selectDays .contents{margin-top:-2px;width:104%;margin-left:-1px;} .schedule .table tbody td.selectDays .benefitHS{width:105%;margin-left:-1px;} /*.schedule .table tbody td.selectDays .benefitS{margin-right:-1px;}*/ /*.schedule .table tbody td.selectDays .contents span:nth-child(1){font-size:12px;}*/ /*.schedule .table tbody td.selectDays .contents span.dateD{margin-left:-1px;} .schedule .table tbody td.selectDays .contents span.dateY{margin-right:-1px}*/ .schedule .table tbody td.selectDay{padding:0;} .schedule .table tbody td.selectDay p{padding:10px 0 10px 15px; border-bottom:1px solid #eaebec} .schedule .table tbody td.selectDay p span:first-child{color:#00b6f0;font-weight:bold;} .schedule .table tbody td.selectDay p span:last-child{padding-left:20px;color:#333;} .schedule .table tbody td.selectDay ul{padding:0 15px} .schedule .table tbody td.selectDay ul li{padding:10px 0;border-bottom:1px solid #eaebec;color:#333;} .schedule .table tbody td.selectDay ul li:last-child{border-bottom:none;} .schedule .table tbody td.selectDay ul li a{display:block} .schedule .table tbody td.selectDay ul li a > p{font:0/0 a;float:right;margin-top:7px;border:0;padding:0;} .schedule .table tbody td.selectDay ul li a > p:after{content:'';display:inline-block;width:7px;height:9px;background-position:-193px 0;background-image:url('/static/images/common/icon_sprite.png');background-repeat:no-repeat; background-size:360px auto;} .schedule .calendarF{overflow:hidden;height:45px;text-align:right; margin-right:0;} .schedule .calendarF span{display:inline-block;margin:10px 55px 0 7px;vertical-align:middle;} .schedule .calendarF span em{display:inline-block;margin-left:10px;width:60px;font-size:12px;text-align:right;margin-top:9px} .schedule .calendarF span:first-child em{width:50px;margin-top:3px} .schedule .calendarF span:nth-child(2){margin-left:9px} /* #900 seminars table */ .schedule .tableSemin{width:100%;border:2px solid #707780;} .schedule .tableSemin thead th {height:25px; padding:5px; font-size:14px; color:#fff;text-align:center; background-color:#707780;border-left:1px solid #eaebec; box-sizing:border-box; vertical-align:middle;} .schedule .tableSemin thead th:nth-child(1){color:#fc8272;border-left:none;} .schedule .tableSemin tbody td {padding:0 4px;height:45px;font-size:13px;color:#707780;text-align:left;border-left:1px solid #707780;border-bottom:1px solid #707780; background-color:#fff;box-sizing:border-box;} .schedule .tableSemin tbody td:nth-child(1){border-left:none;color:#fc8272} .schedule .tableSemin tbody td.contSeminSuc{background-color:#f9d9d6;position:relative;} .schedule .tableSemin tbody td.contSeminOne{background-color:#cfebf7;position:relative;} .schedule .tableSemin tbody td.contSeminLoc{background-color:#c0e2c9;position:relative;} .schedule .tableSemin tbody td div{position:absolute;bottom:0;right:0;z-index:1} .schedule .tableSemin tbody td div > span{display:block;position:absolute;bottom:-31px;right:3px;font-size:15px;font-weight:bold;} .schedule .tableSemin tbody .seminSuc{border-left: 30px solid #f9d9d6;border-bottom: 30px solid #fdf0ef ;} .schedule .tableSemin tbody .seminSuc span{color:#b85e64;} .schedule .tableSemin tbody .seminOne{border-left: 30px solid #cfebf7;border-bottom: 30px solid #ecf7fc ;} .schedule .tableSemin tbody .seminOne span{color:#0d7dad;} .schedule .tableSemin tbody .seminLoc{border-left: 30px solid #c0e2c9;border-bottom: 30px solid #e6f3e9 ;} .schedule .tableSemin tbody .seminLoc span{color:#52825e;} .schedule .tableSemin tbody .dateD{display:inline-block;position:absolute;z-index:2;width:19px;height:19px;margin-top:2px;text-align:center;color:#fff;font-weight:bold;background-color:#707780;border-radius:19px;} .schedule .tableSemin tbody .selectDays{border:2px solid #545454;} .schedule .seminTop{overflow:hidden;height:30px;text-align:right; margin-right:0;} .schedule .seminTop span{display:inline-block;margin:0 55px 0 7px;vertical-align:middle;} .schedule .seminTop span em{display:inline-block;margin-left:10px;width:50px;font-size:12px;text-align:right;margin-top:9px;color:#333;} .schedule .seminTop span:last-child em{width:60px;} .schedule .board {/*padding-top:65px;*/} .schedule .board .list {padding-bottom:9px;} .schedule .board .list li.highlight {border:1px solid #00b6f0;} .schedule .board .list li .head {font-size:15px; color:#333;} .schedule .board .list li .head:after {content:''; display:block; clear:both;} .schedule .board .list li .head i {float:right; font-size:13px; color:#999;} .schedule .board .list li .head .red {color:#e02d2d;} .schedule .board .list li .content {padding-bottom:5px;} .schedule .board .list li .content p {display:inline-block; height:23px; margin-bottom:6px; font-size:13px; box-sizing:border-box;} .schedule .board .list li .content p button {height:23px; line-height:25px; vertical-align:middle; padding:0 10px; border-radius:18px; font-size:13px; color:#fff; box-sizing:border-box;} .schedule .board .list li .content .local button {background-color:#59c28d;} .schedule .board .list li .content .oneday button {background-color:#59b2c2;} .schedule .board .list li .content .success button {background-color:#f9993b;} /* Dialog */ .dialog.toCenter {text-align:center;} .dialog.toCenter .dim {z-index:400;} .dialog.toCenter .layout {position:fixed; left:0; right:0; z-index:450; top:30%; padding:20px; background-color:transparent;} .dialog.toCenter .layout header {background-color:#fff;} .dialog.toCenter .layout .body {background-color:#fff;} .dialog .dialogClose {position:absolute; right:15px; top:-33px; width:17px; height:17px; font:0/0 a; background-image:url('/static/images/common/layout_sprite.png'); background-position:-150px -25px; background-repeat:no-repeat; background-size:360px auto;} .dialog .dialogPrev {position:absolute; left:15px; top:16px; width:20px; height:17px; font:0/0 a; background-image:url('/static/images/common/layout_sprite.png'); background-position:-100px 0; background-repeat:no-repeat; background-size:360px auto;} .dialog.toTop.active .dim {-webkit-pointer-events:auto;pointer-events:auto;} .dialog.toBottom.active .dim {-webkit-pointer-events:auto;pointer-events:auto;} .dialog .btnTop {z-index:300; bottom:10px;} /* Dialog Page : 페이지팝업*/ .dialog.page .layout {overflow:hidden; width:100%; height:100%; box-sizing:border-box; padding-top:50px; box-sizing:border-box;} .dialog.page .layout header {position:fixed; left:0; top:0; right:0; height:50px; text-align:center; padding:9px; background-color:#fff; border-bottom:1px solid #c6c6c6; box-sizing:border-box;} .dialog.page .layout header h1 {font-size:20px; color:#333; font-weight:bold;} .dialog.page .layout header.blue {background-color:#00b6f0; border-bottom:none;} .dialog.page .layout header.blue h1 {color:#fff;} .dialog.page .layout header.blue ~ .dialogClose {background-position:-150px -25px;} .dialog.page .layout header.blue ~ .dialogPrev {background-position:-75px -25px;} .dialog.page .layout header.skyblue {background-color:#64d0f3; border-bottom:none;} .dialog.page .layout header.skyblue h1 {color:#fff;} .dialog.page .layout header.skyblue ~ .dialogClose {background-position:-150px -25px;} .dialog.page .layout header.skyblue ~ .dialogPrev {background-position:-75px -25px;} /*.orange 추가*/ .dialog.page .layout header.orange {background-color:#ff9900; border-bottom:none;} .dialog.page .layout header.orange h1 {color:#fff;} .dialog.page .layout header.orange ~ .dialogClose {background-position:-150px -25px;} .dialog.page .layout header.orange ~ .dialogPrev {background-position:-75px -25px;} .dialog.page .layout .body {overflow-x:hidden; overflow-y:auto; height:100%; box-sizing:border-box; -webkit-overflow-scrolling:touch;} .dialog.page .layout .body.margin.sides {margin:0; padding:15px;} .dialog.page .dialogClose {right:15px; top:16px;background-position:-125px -25px;} /* Dialog Transparent (투명 페이지팝업) */ .dialog.transparent .layout {position:relative; width:100%; height:100%; padding-top:50px; color:#fff; background-color:transparent;box-sizing:border-box;} .dialog.transparent .layout header {position:absolute; left:0; top:0; width:100%; height:50px; padding:11px 0 0 15px; text-align:left; border-bottom:none; background-color:transparent; box-sizing:border-box;} .dialog.transparent .layout header h1 {color:#fff; font-size:20px; font-weight:normal;} .dialog.transparent .dialogClose {} .dialog.transparent #btnClose, .dialog.transparent .dialogClose {top:10px; width:30px; height:30px; background:none;} .dialog.transparent .dialogClose:after {content:''; display:inline-block; position:absolute; left:7px; top:7px; width:17px; height:17px; font:0/0 a; background-image:url('/static/images/common/layout_sprite.png'); background-position:-150px -25px; background-repeat:no-repeat; background-size:360px auto;} .dialog.transparent .layout .body {height:100%; background-color:transparent; overflow-y:auto; box-sizing:border-box;} /* 헤더없는 팝업, 페이지 */ .dialog.noHeader .layout {padding-top:0; padding-bottom:40px;} #body.noHeader {padding-top:0; padding-bottom:40px;} .noHeader .footer {position:fixed; left:0; right:0; bottom:0; background-color:#fff; border-top:1px solid #e2e2e2;} .noHeader .footer .row.btns .col {border-left:1px solid #e2e2e2;} .noHeader .footer .row.btns .col:first-child {border-left:none;} /* 사라지는 팝업 */ .toast {display:block; width:100%; height:100%;} .toast .layout {position:fixed; left:50%; top:50%; margin:-85px 0 0 -85px; width:170px; height:170px; overflow:hidden; color:#fff; text-align:center;vertical-align:middle;white-space:nowrap;background-color:rgba(0,0,0,.7);box-sizing:border-box;border-radius:50%;} .toast .layout:after {content:'';display:inline-block;height:100%;vertical-align:middle;} .toast .layout .body {display:inline-block; font-size:14px;} .toast .layout .body .text {margin-top:70px; line-height:1.3;} .toast .layout .body small {display:block; font-size:11px; letter-spacing:-0.5px; margin-top:3px;} .toast .layout .body .toastCart {margin-top:-70px;} .toast .layout .body .toastFavorit {margin-top:-70px;} .toast .layout .body .toastBookmark {margin-top:-70px;} .toast .layout .body .toastPinch {margin-top:-90px;} .toast .icon.large {margin:38px 0 7px;} .toast .icon.large.cart {margin-top:30px;} /* 페이지 하단에 붙는 아이템들 */ .fixBottom {position:absolute; left:0; right:0; bottom:0;} .fixBottom .fixContent {position:absolute; left:0; right:0; bottom:0; height:40px; overflow:hidden; box-sizing:border-box;} /* 고객행복센터 푸터 */ .fixBottom.happyCenter .fixContent {height:55px; padding-top:15px; border-top:1px solid #e2e2e2; font-size:14px; text-align:center; background-color:#f1f2f4; box-sizing:border-box;} .fixBottom.happyCenter .fixContent span {color:#333; font-size:14px;} .fixBottom.happyCenter .fixContent span strong {font-size:16px;} .fixBottom.happyCenter .fixContent small {position:relative; padding-left:6px; margin-left:8px; font-size:12px; color:#999;} .fixBottom.happyCenter .fixContent small:after {content:''; display:inline-block; position:absolute; left:0; top:3px; height:11px; border-left:1px solid #c9c9c9;} /* */ .guide.account {padding:50px 45px 30px; text-align:center;} .guide.account .icon {margin-bottom:10px;} .guide.account .text01 {margin-bottom:5px; font-size:17px; color:#333;} .guide.account .text02 {font-size:13px; color:#333;} /* 기간선택 다이어로그 */ .dialog.period ul li button {width:100%; height:40px; border-top:1px solid #e2e2e2;} /* 지도 다이어로그 */ .dialog.map .nmap_infowindow_content {width:330px; left:-165px;} .dialog.map .place {line-height:1.5; background-color:#fff; border:1px solid #e2e2e2; border-radius:2px; overflow:hidden;} .dialog.map .place .head {position:relative; height:45px; padding:13px 15px 0; background-color:#f3f9fb; box-sizing:border-box;} .dialog.map .place .head .title {font-size:15px; font-weight:bold;} .dialog.map .place .head button {position:absolute; right:15px; top:15px;} .dialog.map .place .content {padding:15px; font-size:14px; box-sizing:border-box;} .dialog.map .place .content .bulletList {margin-top:10px;} /* 우편번호 검색 팝업 */ .dialog.address .tab.type2 {padding:15px 35px 0; margin-bottom:15px; box-sizing:border-box;} .dialog.address .box.primary {padding:15px; text-align:center; margin-top:15px} .dialog.address .table {margin:15px 0;} .dialog.address .table.view {margin-top:25px;} .dialog.address .table.view tbody tr td:first-child {text-align:center;} .dialog.address .noData {margin:50px 0 40px;} .dialog.address .street {margin:25px 0 5px 0;} .dialog.address .street:after {content:''; display:block; clear:both;} .dialog.address .street .col {box-sizing:border-box; float:left; width:50%; margin-bottom:5px;} .dialog.address .street .col:nth-of-type(2):before {left:7px;} .dialog.address .street .col:nth-child(2n) {padding-left:5px;} .dialog.address .text01 strong {letter-spacing:-1px;} .dialog.address .box.primary .text03{margin-top:10px} /* 은행 검색 팝업 */ .dialog.bank .box.primary {padding:15px; text-align:center; margin-top:15px} .dialog.bank .table {margin:15px 0;} .dialog.bank .table.view {margin-top:25px;} .dialog.bank .table.view tbody tr td:first-child {text-align:center;} .dialog.bank .noData {margin:50px 0 40px;} /* 후원인 회원번호 확인 */ .dialog.sponsor section {position:relative; margin-top:20px; padding:240px 15px 15px;} .dialog.sponsor .leader {position:absolute; left:50%; top:0; width:190px; height:190px; margin-left:-95px; border-radius:50%; background-color:#64d0f3; box-sizing:border-box; text-align:center;} .dialog.sponsor .leader:after {content:''; display:inline-block; position:absolute; left:50%; bottom:-25px; height:25px; border-left:1px solid #e1e1e6;} .dialog.sponsor .leader dl {position:absolute; left:15px; top:15px; width:160px; height:160px; padding-top:45px; border-radius:50%; background-color:#fff; box-sizing:border-box; text-align:center;} .dialog.sponsor .leader dl dt {padding-bottom:10px; font-size:23px; color:#000;} .dialog.sponsor .leader dl dd {padding-top:12px; font-size:15px; color:#000; font-weight:bold;} .dialog.sponsor .leader dl:after {content:''; display:inline-block; position:absolute; left:50%; top:88px; width:112px; margin-left:-56px; border-top:1px solid #f1f2f4;} .dialog.sponsor .position {position:relative; border:1px solid #707780; border-radius:2px;} .dialog.sponsor .position:before {content:''; display:inline-block; position:absolute; left:50%; top:-27px; width:166px; height:25px; margin-left:-83px; border:1px solid #e1e1e6; border-bottom:1px solid #707780; border-radius:15px 15px 0 0; background-color:#fff;} .dialog.sponsor .position:after {content:''; display:block; clear:both;} .dialog.sponsor .position dl {float:left; width:50%; padding:15px 0; box-sizing:border-box; text-align:center;} .dialog.sponsor .position dl:first-child {position:relative;} .dialog.sponsor .position dl:first-child:after {content:''; display:inline-block; position:absolute; right:0; top:10px; bottom:10px; border-right:1px solid #e1e1e6;} .dialog.sponsor .position dl dt {font-size:14px;} .dialog.sponsor .position dl dd {padding:0 5px; font-size:13px; color:#333; word-wrap:break-word; word-break:break-all;} .dialog.sponsor .position dl dd em {font-size:21px; color:#333; } .dialog.sponsor .position dl dd button {width:100%; font-size:17px; color:#333;} /* 통신상품 다이어로그 */ .dialog.mobileNav .body nav {border-top:1px solid #eaebec;} .dialog.mobileNav .body nav:after {content:''; display:block; clear:both;} .dialog.mobileNav .body nav span {display:block; float:left; width:50%; box-sizing:border-box;} .dialog.mobileNav .body nav span.row {width:100%;} .dialog.mobileNav .body nav span a {display:block; position:relative; height:60px; padding:19px 25px 0 20px; font-size:15px; color:#333; border-bottom:1px solid #eaebec; border-left:1px solid #eaebec; box-sizing:border-box;} .dialog.mobileNav .body nav span a:after {content:''; display:inline-block; position:absolute; right:15px; top:25px; width:5px; height:9px; background-image: url('/static/images/common/icon_sprite.png'); background-position:-195px 0; background-repeat:no-repeat; background-size: 360px auto;} .dialog.mobileNav .body .guide {height:75px; padding-top:18px; color:#666; font-size:12px; text-align:center; box-sizing:border-box;} .dialog.mobileNav .body .guide div {color:#333; font-size:14px;} .dialog.mobileNav .body .guide div span {position:relative; display:inline-block; padding-left:10px; margin-left:3px;} .dialog.mobileNav .body .guide div span:first-child {padding-left:5px; margin-left:0;} .dialog.mobileNav .body .guide div span:after {content:''; display:block; position:absolute; left:0; top:5px; height:11px; border-left:1px solid #c9c9c9;} .dialog.mobileNav .body .guide div span:first-child:after {content:none;} .dialog.mobileNav .body .guide div span small {font-size:11px;} .dialog.mobileGuide .body .guide {margin:15px 0;} .dialog.mobileGuide .body section {margin:15px 0;} .dialog.mobileGuide.fax .body .guide {padding:10px; font-size:13px;} .dialog.mobileGuide.mobileQa .tab {position:fixed; left:0; right:0; top:50px; z-index:1; table-layout:auto;} .dialog.mobileGuide.mobileQa .tab span {width:33.3333%;} .dialog.mobileGuide.mobileQa .tab span:last-child a {padding-right:15px;} .dialog.mobileGuide.mobileQa .tabContent {margin-top:0; padding:46px 15px 0; overflow:hidden;} .dialog.mobileGuide.consent .image {position:relative;} .dialog.mobileGuide.consent .image a {display:block; position:absolute; left:0; right:0; top:52%; padding-top:8%;} /* 상품상세 다이어로그 */ .layerTelEdit .body {padding:15px; color:#333;} .layerTelEdit .name {margin-bottom:5px; font-size:17px; color:#333;} .layerTelEdit .body .row {display:table; width:100%; table-layout:fixed;} .layerTelEdit .body .row .col {display:table-cell; width:25%; padding-left:5px;} .layerTelEdit .body .row .col:nth-of-type(1) {padding-left:0;} .layerTelEdit .body .row .col:last-child {width:auto;} .dialog.cart .layout {padding-bottom:70px; background-color:#fff; border-top:1px solid #eaebec;} .dialog.cart .body {position:relative;} .dialog.cart .body .info {height:106px; padding:15px 15px 0 164px; box-sizing:border-box;} .dialog.cart .body .info .thumb {display:inline-block; position:absolute; left:35px; top:8px; width:100px; height:100px;} .dialog.cart .body .info .name {display:block; height:40px; margin-bottom:10px; color:#333; font-size:15px;-webkit-line-clamp:2; -webkit-box-orient:vertical; display:-webkit-box; text-overflow:ellipsis; overflow:hidden;} .dialog.cart .total {margin:11px 0; padding:0 15px;} .dialog.cart .total .price {height:35px; padding:5px 0 0 10px; margin-top:2px; color:#333; background-color:#f3f9fb; box-sizing:border-box;} .dialog.cart .total dl {min-height:35px; padding:9px 10px 0; margin-top:2px; box-sizing:border-box;} .dialog.cart .total dl:after {content:''; display:block; clear:both;} .dialog.cart .total dl dt {float:left; width:30px; margin-right:14px; font-size:14px;} .dialog.cart .total dl dd {float:left; font-size:13px;} .dialog.cart .total dl dd.sum {float:right;} .dialog.cart .total dl dd.sum span {vertical-align:bottom;} .dialog.cart .total dl dd.sum strong {font-size:15px; line-height:1.2;} .dialog.cart .total dl dd.sum .equals {margin-right:18px; vertical-align:top;} .dialog.cart .total dl dd.notice {float: none; clear: both; width: 100%; padding-bottom: 5px; text-align: right; color: #898989; font-size: 10px;} .dialog.cart .total dl dd .mark {margin:0 10px;} /* 검색 다이어로그 160516 */ .dialog.search .layout{background-color:#f1f2f4;margin-top:50px} .dialog.search .body {position:relative;} .snsShare.dialog {} .snsShare.dialog .layout {width:100%; position:fixed; left:0; right:0; bottom:0; box-sizing:border-box;} .snsShare.dialog .layout .body ul {border-top:1px solid #eaebec;} .snsShare.dialog .layout .body ul:after {content:''; display:block; clear:both;} .snsShare.dialog .layout .body ul li {float:left; width:50%; box-sizing:border-box;} .snsShare.dialog .layout .body ul li a {display:block; height:60px; padding:12px 0 0 15px; border-bottom:1px solid #eaebec; border-right:1px solid #eaebec; box-sizing:border-box;} .snsShare.dialog .layout .body ul li:nth-child(2n) a {border-right:none;} .snsShare.dialog .layout .body ul li:last-child {border-bottom:none;} .snsShare.dialog .layout .body ul li a .icon {margin-right:10px; vertical-align:middle;} .snsShare.dialog .layout .body ul li.shareUrl {width:100%; padding:15px; border-top:1px solid #eaebec; margin-top: -1px;} .snsShare.dialog .layout .body ul li.shareUrl a {display:block; height:40px; margin-bottom:10px; padding:10px 10px 0; color:#00b6f0; font-size:13px; text-align:center; border:1px solid #e1e1e1; border-radius:2px; background-color:#f6f6f8;} .snsShare.dialog .layout .body ul li.shareUrl a span {display:inline-block; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; max-width:100%;} .snsShare.dialog .layout .body ul li.shareUrl p {color:#666; font-size:12px; text-align:center;} .snsShare.dialog .layout .body ul li .row {display:table; table-layout:fixed; width:100%;} .snsShare.dialog .layout .body ul li .row .col {display:table-cell; vertical-align:top;} .snsShare.dialog .layout .body ul li .row .col:last-child {width:80px; text-align:right;} .snsShare.dialog .layout .body ul li .row .col .btn {width:75px; padding:0 5px;} .snsShare.dialog .layout .body .snsTit {width:100%;padding:15px;text-align:center;font-size:18px;color:#303030;font-weight:bold; box-sizing: border-box;} /* 계보도 다이어로그 */ .treeSetting.dialog.page .layout header {height:50px; background-color:#707780; border-bottom:1px solid #8d9299;} .treeSetting.dialog.page .layout header h1 {color:#fff;} .treeSetting.dialog .dialogClose {background-position:-175px -25px;} /* 하위회원 관리*/ .dialog.lowerMember .tab.type3 {display:block; margin-bottom:15px;} .dialog.lowerMember .tab.type3:after {content:''; display:block; clear:both;} .dialog.lowerMember .tab.type3 span {display:inline-block; float:left; width:33.3333%;} /* 계보도 max 다이얼로그 */ .dialog.treerestrict{ z-index:400} .dialog.treerestrict .body{ padding:15px; text-align:center; } .dialog.treerestrict .body .icon{ vertical-align:middle;} .lower {padding-bottom:20px;} .lower .controls .bar {position:relative; height:40px; margin:10px 0;} .lower .controls .bar .text {padding-top:10px; color:#333;} .lower .controls .bar .select {position:absolute; right:0; top:0; width:165px;} .lower .list {margin-bottom:10px; border-top:1px solid #e2e2e2;} .lower .list li {position:relative; padding:10px 15px; border-bottom:1px solid #e2e2e2; font-size:14px; color:#333;} .lower .list li .added {display:inline-block; vertical-align:text-bottom;} .lower .list li .added span {display:none; float:left; width:20px; height:20px; font-size:12px; text-align:center; vertical-align:text-top; border-radius:2px; box-sizing:border-box;} .lower .list li .added span.couple {background-color:transparent; color:#999; border:1px solid #999;} .lower .list li .added span + span {margin-left:5px;} .lower .list li .added.couple .couple, .lower .list li .added.tel .icon.tel, .lower .list li .added.tl .icon.tl {display:inline-block;} .lower .list li .name {font-size:17px; color:#000;} .lower .list li .icon.lower1 {margin-right:3px;} .lower .list li .depth {font-size:13px; color:#999;} .lower .list li .data {margin-top:6px;} .lower .list li .data:after {content:''; display:block; clear:both;} .lower .list li .data span {float:left; position:relative; padding-left:6px; margin-left:5px;} .lower .list li .data span:after {content:''; position:absolute; left:0; top:4px; display:inline-block; height:10px; border-left:1px solid #e2e2e2;} .lower .list li .data span:first-child {padding-left:0; margin-left:0;} .lower .list li .data span:first-child:after {content:none;} .lower .list li .btnBookmark {position:absolute; right:15px; top:17px; width:18px; height:17px; margin-right:4px;} .lower .list li .btnBookmark .icon.bookmark {vertical-align:top;} .lower .list li.disable {color:#ccc;} .lower .list li.disable .name {color:#ccc;} .dialog.treeLevel .layout {padding-top:85px; padding-bottom:40px;} .dialog.treeLevel .layout header {height:85px; padding-top:36px; padding-left:0; text-align:center;} .dialog.treeLevel .dialogClose:before {top:24px;} .dialog.treeLevel .dialogClose:after {top:30px;} .dialog.page.toTop.treeLevel.active .dim {opacity:.9;} .dialog.treeLevel .body ul li .btn {width:100%; height:50px; font-size:15px; color:#fff;} .dialog.treeLevel .body ul li.active .btn, .dialog.treeLevel .body ul li .btn.press, .dialog.treeLevel .body ul li .btn:active {font-size:20px; color:#00b6f0; opacity:1;} .dialog.receipt .body nav {border-top:1px solid #eaebec;} .dialog.receipt .body nav:after {content:''; display:block; clear:both;} .dialog.receipt .body nav span {display:block; float:left; width:50%; box-sizing:border-box;} .dialog.receipt .body nav span.row {width:100%;} .dialog.receipt .body nav span .btn {display:block; width:100%; height:60px; padding:19px 25px 0 20px; font-size:15px; text-align:left; color:#333; border-bottom:1px solid #eaebec; border-left:1px solid #eaebec;} .dialog.receipt .body nav span button.btn {padding-top:0;} .dialog.receipt .body nav span .btn:after {content:''; display:inline-block; position:absolute; right:15px; top:25px; width:5px; height:9px; background-image: url('/static/images/common/icon_sprite.png'); background-position:-195px 0; background-repeat:no-repeat; background-size: 360px auto;} /* 세미나 일정표 */ .dialog.seminar .body {padding:15px;} .dialog.seminar .body .box {margin-bottom:15px; padding:15px;} .dialog.seminar .body .box h2 {font-size:17px; color:#333;} .dialog.seminar .body .box span {position:relative; padding-left:5px; margin-left:5px; font-size:13px; color:#666;} .dialog.seminar .body .box span:first-child {padding-left:0; margin-left:0;} .dialog.seminar .body .box span:after {content:''; display:inline-block; position:absolute; left:0; top:4px; height:10px; border-left:1px solid #c9c9c9;} .dialog.seminar .body .box span:first-child:after {content:none;} .dialog.seminar .body .item {margin-top:17px; font-size:13px;} .dialog.seminar .body .item h3 {font-weight:bold; font-size:14px; color:#333;} /* 배송지변경, 결제변경 */ .dialog.paymentChange .body .box.primary {margin-bottom:15px; padding:15px 0;} .dialog.paymentChange .body fieldset + fieldset {margin-top:15px;} .dialog.paymentChange .body .btns {margin-top:10px;} .dialog.paymentChange .table {border-top:none;} .paymentChange .row.bar {height:47px; border-top:1px solid #707780; border-bottom:1px solid #707780; box-sizing:border-box;} .paymentChange .row.bar:after {content:''; display:block; clear:both;} .paymentChange .row.bar .numbering {float:left; line-height:47px; font-size:14px; color:#000; font-weight:bold;} .paymentChange .row.bar .btn {float:right; margin-top:7px;} /* 국내 거주 외국인 인증 */ .foreignAccredit {} .foreignAccredit .box.guide {padding:15px;} .foreignAccredit .box.guide h2 {margin-bottom:5px;} .foreignAccredit .box.guide .image {margin-bottom:10px;} .foreignAccredit .box.guide hr {margin:15px 0;} .foreignAccredit .box.guide .dash li {font-size:13px; color:#333;} .foreignAccredit .box.guide .dash li small {font-size:12px; color:#666;} .foreignAccredit .fileSet {margin-top:15px; margin-bottom:20px; border-top:1px solid #707780;} .foreignAccredit .fileSet .file {padding:0; border-bottom:1px solid #e2e2e2;} .foreignAccredit .fileSet .bullet {margin-top:10px;} .fileSet .file {margin-top:1px;} .fileSet .file .head {position:relative; min-height:50px; padding:15px 0 14px; padding-right:98px; box-sizing:border-box;} .fileSet .file .head .label {font-size:14px; color:#333;} .fileSet .file .btn.etc01 {position:absolute; right:0; top:10px; padding:0 5px;} .fileSet .file .preview {position:relative; height:55px; padding:19px 25px 5px 60px; background-color:#f6f6f8; box-sizing:border-box;} .fileSet .file .preview .thumb {display:inline-block; position:absolute; left:10px; top:5px; width:45px; height:45px; border:1px solid #e2e2e2; box-sizing:border-box;} .fileSet .file .preview .name {display:inline-block; font-size:13px; color:#333; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%;} .fileSet .file .preview .btnDelete {position:absolute; right:0; top:0; width:30px; height:100%;} .fileSet .file .preview .btnDelete .icon {vertical-align:middle;} .fileSet .file .preview .thumb img {height:100%;} .fileSet.type1 .file {margin-top:1px;} .fileSet.type1 .file .head {position:relative; min-height:0; padding: 0; box-sizing:border-box;} .fileSet.type1 .file .preview {margin-top: 10px;} .foreignAccredit .progress {margin-top:110px; padding-left:15px; padding-right:15px; font-size:12px; text-align:center;} .foreignAccredit .progress .text17 {margin-bottom:5px;} .foreignAccredit .progress .icon {margin-bottom:10px;} .foreignAccredit .progress .row.btns {margin-top:15px;} .foreignAccredit.noHeader .progress {margin-top:65px;} .foreignAccredit.noHeader .guide {margin:25px 0 15px ;} /* 쇼핑몰 메인 전체팝업 */ .slidePopup .slider, .slidePopup .slider .slick-slider, .slidePopup .slider .slick-list, .slidePopup .slider .slick-slider .slick-track, .slidePopup .slider .slick-initialized .slick-slide {height:100%;} .slidePopup .slick-slide {padding-top:0; overflow:auto; text-align: center;} .slidePopup .slick-slide.item:after {content: ''; display: inline-block; height: 100%; vertical-align: middle } .slidePopup .slick-slide.item a {display: inline-block; vertical-align: middle;} .slidePopup .slick-slide img {width:100%; position:static;} .slidePopup .slider .indicator.expand {height:23px; position:fixed; left:0; right:0; bottom:65px;} .slidePopup .slider .indicator li {bottom:0; max-width: 60%; text-overflow: ellipsis; white-space: nowrap;} .slidePopup .footer .row.btns .btn {padding:0 10px; font-size:15px; font-weight:normal; color:#333;} .slidePopup .footer .row.btns .btn.text-overflow {font-size: 13px; line-height: 1.2;} /* 쇼핑몰 메인 프로모션 팝업 */ .dialog.promotions .body {padding-bottom:15px;} .dialog.promotions .body ul {padding:0 15px;} .dialog.promotions .body ul li {position:relative; padding-top:55.6060%; margin-bottom:1px; overflow:hidden;} .dialog.promotions .body ul li a {display:block; position:absolute; left:0; top:0; right:0; bottom:0;} .dialog.promotions .body ul li a img {height:100%;} .dialog.promotions .dialogClose:before {content:''; display:inline-block; width:30px; height:30px; position:absolute; right:0; top:0; background-color:rgba(0,0,0,.6);} /* 세미나 좌석공유 팝업 */ .dialog.send .body {padding-top:20px; border-top:1px solid #eaebec;} .dialog.send .body input {margin-top:5px;} .dialog.send .body h2, .dialog.seats .body h2 {margin-bottom:5px; font-weight:bold;} .dialog.seats .body h2 time {font-weight:bold;} /* 애터미소개 메뉴 팝업 */ .dialog.toCenter.navigation .layout {top:13%;} .dialog.navigation .layout .body {height:100%; max-height:414px; overflow-y:auto; overflow-x:hidden;} .dialog.navigation .body ul li {position:relative;} .dialog.navigation .body ul li a {display:block; height:46px; font-size:14px; line-height:47px; color:#333; border-top:1px solid #e2e2e2; box-sizing:border-box;} .dialog.navigation .body ul li:first-child a {border-top:none;} .dialog.navigation .body ul li a.press, .dialog.navigation .body ul li a:active, .dialog.navigation .body ul li.active a {color:#00b6f0;} .dialog.navigation .body ul li.active:after {content:''; display:inline-block; position:absolute; right:15px; top:16px; width:16px; height:11px; background-image: url('/static/images/common/icon_sprite.png'); background-position:-50px 0; background-repeat: no-repeat; background-size: 360px auto;} /* 티켓정보 페이지 */ .ticket {padding-bottom:150px;} .ticket .info {padding:0 30px; text-align:center;} .ticket .info .summary {font-size:13px; color:#333;} .ticket .info .summary h1 {font-size:25px; line-height:1.3; margin-bottom:10px; color:#333; font-weight:bold;} .ticket .info .summary time {font-size:20px;} .ticket .info .seat {display:inline-block; width:300px; height:140px; margin:20px 0; background-image:url('/static/images/common/ticket_bg.png'); background-position:0 0; background-size:100%;} .ticket .info .seat time {float:right; margin:13px 13px 0 0; font-size:12px;} .ticket .info .seat .number {clear:both; padding-top:7px; font-size:51px; color:#333; font-weight:bold;} .ticket .info .box.dark {position:relative; width:100%; padding:10px 0; font-size:14px; text-align:center;} .ticket .info .box.dark span {white-space:nowrap; display:inline-block; position:relative; z-index:1; min-width:49%; padding:0 10px; background-color:#707780; box-sizing:border-box;} .ticket .info .box.dark:after {content:''; display:inline-block; position:absolute; left:50%; top:50%; height:12px; margin-top:-6px; border-right:1px solid #8d9299;} .ticket .fixBottom .fixContent {height:auto; margin:0 30px; padding:15px 0 30px; font-size:12px; border-top:1px solid #e2e2e2;} /* 티켓정보 다이어로그 */ .ticket.ticketPreview {} .ticket.ticketPreview .body {} .ticket.ticketPreview .flex { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-direction: normal; -moz-box-direction: normal; -webkit-box-orient: vertical; -moz-box-orient: vertical; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -moz-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-align-content: space-between; -ms-flex-line-pack: justify; align-content: space-between; -webkit-box-align: center; -moz-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .ticket.ticketPreview .info {margin-bottom:20px; padding:0 30px; text-align:center; -webkit-box-ordinal-group: 1; -moz-box-ordinal-group: 1; -webkit-order: 0; -ms-flex-order: 0; order: 0; -webkit-box-flex: 0; -moz-box-flex: 0; -webkit-flex: 0 1 auto; -ms-flex: 0 1 auto; flex: 0 1 auto; -webkit-align-self: auto; -ms-flex-item-align: auto; align-self: auto; } .ticket.ticketPreview .info .summary {font-size:13px; color:#333;} .ticket.ticketPreview .info .summary h1 {font-size:25px; line-height:1.3; margin-bottom:10px; color:#333; font-weight:bold;} .ticket.ticketPreview .info .summary time {font-size:20px;} .ticket.ticketPreview .info .seat {display:inline-block; width:100%; max-width:300px; height:140px; margin:20px 0; background-image:url('/static/images/common/ticket_bg.png'); background-position:0 0; background-size:100%; background-repeat:no-repeat;} .ticket.ticketPreview .info .seat time {float:right; margin:13px 13px 0 0; font-size:12px;} .ticket.ticketPreview .info .seat .number {clear:both; padding-top:7px; font-size:51px; color:#333; font-weight:bold;} .ticket.ticketPreview .info .box.dark {position:relative; width:100%; padding:10px 0; font-size:14px; text-align:center;} .ticket.ticketPreview .info .box.dark span {white-space:nowrap; display:inline-block; position:relative; z-index:1; min-width:49%; padding:0 10px; background-color:#707780; box-sizing:border-box;} .ticket.ticketPreview .info .box.dark:after {content:''; display:inline-block; position:absolute; left:50%; top:50%; height:12px; margin-top:-6px; border-right:1px solid #8d9299;} .ticket.ticketPreview .caption {margin:0 30px; padding:15px 0 30px; font-size:12px; background-color:#fff; border-top:1px solid #e2e2e2; -webkit-box-ordinal-group: 1; -moz-box-ordinal-group: 1; -webkit-order: 0; -ms-flex-order: 0; order: 0; -webkit-box-flex: 0; -moz-box-flex: 0; -webkit-flex: 0 1 auto; -ms-flex: 0 1 auto; flex: 0 1 auto; -webkit-align-self: auto; -ms-flex-item-align: auto; align-self: auto; } .findCenter .guide, .editCenter .guide, .findPickup .guide {padding:20px 25px; text-align:center;} .findCenter .table {margin:15px 0;} .findCenter .search .row.btns, .editCenter .search .row.btns, .findPickup .search .row.btns {margin-top:10px;} .findCenter .searchResult .table tbody th, .editCenter .searchResult .table tbody th {text-align:center;} .findCenter .table th a, .findCenter .table td a {color:#333;} .findCenter .guide .text12 {margin-top:3px;} .findCenter .search, .findPickup .search {margin-top:15px;} .findCenter .search p.search {position:relative; margin-top:0;} .findCenter .search p.search input[type='search'] {padding-right:29px; border-color:#bfc2c6;} .findCenter .search p.search .btnDelete {right:0;} .findCenter .noData.search {margin-top:70px;} /* 이용약관 */ .dialog.agreement .body {padding:20px 15px; font-size:13px; color:#666;} .dialog.agreement .body section {margin-top:22px;} .dialog.agreement .body section:first-child {margin-top:0;} .dialog.agreement .body section ol ol {padding-left:14px;} .dialog.agreement .body section .sections > li {margin-top:22px;} .dialog.agreement .body section .sections > li:first-child {margin-top:10px;} .dialog.agreement .body section .list > li {margin-top:10px;} .dialog.agreement .body section .table {margin:5px 0 10px; table-layout:fixed;} .dialog.agreement .footer {margin-top:13px; text-align:center; font-size:12px;} .dialog.agreement .footer h2 {margin-bottom:2px;font-size:14px; font-weight:bold;} .dialog.agreement .mb10 {margin-bottom:10px;} .dialog.agreement.terms .body {padding:0;} .dialog.agreement.terms .tab span {width:auto;} .dialog.agreement.terms .tabContent {padding:20px 15px;} .dialog.agreement.terms .tabContent h2 {font-size:16px; color:#333; font-weight:bold;} .dialog.agreement.terms .tabContent .select{margin-top:22px;} /* 결제안내 */ .dialog.payInformation .body {padding-bottom:20px;} .dialog.payInformation .body hr {margin:7px 0 9px;} .dialog.payInformation .body section {margin-top:20px;} .dialog.payInformation .body section .title {font-size:16px; color:#333;} .dialog.payInformation .body section ul li {margin-top:10px;} /* 튜토리얼 다이어로그 */ .dialog.tutorial {z-index:400;} .dialog.page.toTop.tutorial .layout {z-index:400;} .dialog.tutorial.active .dim {z-index:390;} .dialog.tutorial .body p {padding:0 26px;} .dialog.tutorial .layout {padding-top:100px;} .dialog.tutorial .dialogClose {top:35px;} .dialog.tutorial .dialogClose:before {content:none;} .dialog.tutorial .dialogClose:after {background-position:-175px -25px;} .dialog.page.toTop.tutorial.active .dim {opacity:.85;} /* 에러페이지 */ .error {position:relative; padding:184px 30px 0; text-align:center;} .error p + p {margin-top:10px;} .error:after {content:''; display:inline-block; position:absolute; left:50%; top:70px; width:99px; height:99px; margin-left:-49px; background-image:url('/static/images/common/icon_error.png'); background-position:0 0; background-size:99px auto;} .error .row.btns {margin-top:30px; padding:0 10px;} .unauthorized .verticalCenter {min-height:350px;} /* 비밀번호 팁 다이어로그 */ .dialog.passwordTip .body {padding:15px; text-align:left;} .dialog.passwordTip .body .title {font-size:15px; color:#000; font-weight:bold;} .dialog.passwordTip .body hr {margin:12px 0 14px;} .dialog.passwordTip .dialogClose {right:35px; top:34px; background-image:url('/static/images/common/icon_sprite.png'); background-position:-270px -25px;} /* 메인 수당 안내 다이어로그 */ .dialog.bonus .body {padding:15px; text-align:left;} .dialog.bonus .body .title {font-size:15px; color:#000; font-weight:bold;} .dialog.bonus .body hr {margin:12px 0 14px;} .dialog.bonus .body .box {padding: 10px;} .dialog.bonus .dialogClose {right:35px; top:36px; background-image:url('/static/images/common/icon_sprite.png'); background-position:-270px -25px;} /* 나의 회원증 보기 다이어로그 */ .dialog.userProfileCard .body {padding:15px; text-align:left;} .dialog.userProfileCard .body .card {border: 1px solid #ddd; padding: 15px; margin-top: 15px;} .dialog.userProfileCard .body .card:first-child {margin-top: 0;} .dialog.userProfileCard .body hr {margin: 15px 0;} .dialog.userProfileCard .body .logo {margin: -15px -15px 20px -15px;} .dialog.userProfileCard .body .profile {overflow: hidden;} .dialog.userProfileCard .body .profile .thumbnail {float: left; width: 30%;} .dialog.userProfileCard .body .profile .info {float: left; width: 70%; padding-left: 10px; box-sizing: border-box;} .dialog.userProfileCard .body .profile .signature {clear: both; text-align: right; margin-top: 15px; } .dialog.userProfileCard .dialogClose {} /* 공지사항 세미나 장소 팝업 */ .dialog.seminarCenter .body .content {padding:15px;} /* 승인잔액조회 */ .balance .section {margin-top:17px;} .balance .table {table-layout:fixed;} .balance .warning {margin-top:10px; text-align:center;} .balance .section .row.cell2 .select[data-value]:before {left:6px;} .balance .section .resultPanel {position:relative; padding-right:20px;} .balance .section .resultPanel span {display:inline-block; vertical-align:top;} .balance .section .resultPanel .text {position:absolute; right:0; top:10px;} .balance .section .bullet {margin-top:7px;} /* 카드승인취소 */ .cancelApproval .title.sub {margin-top:15px;} .cancelApproval .guide li {margin-top:8px;} .cancelApproval .row.cell2 .select[data-value]:before {left:6px;} /* 마이 오피스 */ .officeMain .controls {position:relative;} .officeMain .controls nav a {display:inline-block; position:absolute; width:30px; height:30px; top:27px; z-index:1; padding:19px 10px 0; font:0/0 a;} .officeMain .controls nav a.prev {left:-6px} .officeMain .controls nav a.next {right:-10px} .officeMain .controls nav a:after {content:''; display:inline-block; width:19px; height:37px; background-image:url('/static/images/common/icon_sprite.png'); background-position:-19px -74px; background-repeat:no-repeat; background-size:360px auto;} .officeMain .controls nav a.prev:after {background-position:0 -74px;} .officeMain .controls nav a.next.going:after {background-position:-57px -74px;} .officeMain .controls nav a.prev.going:after {background-position:-38px -74px;} /* #830 배송조회 보조송장 */ .bojoT{margin:10px 0 5px 3px; font-weight:bold;color:#333} .bojo{padding:5px;border:2px solid #8C8C8C;} .bojo a{display:inline-block;padding:0 5px;color:#333 !important;} /*#868 우편번호 추가 설명*/ .zipconts{margin-top:10px} .zipconts strong{font-size:13px} .zipconts .text02{padding-left:10px} .zipconts .con{padding-left:75px;font-size:12px} /* video CDN 변경으로 마크업 변경 */ .video-wrap {position: relative; background-color: #c9c9c9;} .video-wrap:before {content: ''; display: block; padding-bottom: 56.25%;} .video-wrap iframe {position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; border: 0;} /* 파일인풋 */ .filebox { position: relative; } .filebox input[type="file"] { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip:rect(0,0,0,0); border: 0; } .filebox label { display: inline-block; cursor: pointer; } /* named upload */ .filebox .upload-name { display: none; width: 100%; white-space: nowrap; text-overflow: ellipsis; margin-top: 10px; background: transparent; border: 0; -webkit-appearance: none; overflow: hidden; } .filebox .upload-name.in { display: block; } .filebox .preview {position:relative; display: flex; align-items: center; min-height: 55px; padding:4px 25px 5px 60px; background-color:#f6f6f8; box-sizing:border-box;} .filebox .preview .thumb {display:inline-block; position:absolute; left:5px; top:5px; width:45px; height:45px; border:1px solid #e2e2e2; box-sizing:border-box;} .filebox .preview .name {display:inline-block; font-size:13px; color:#333; max-width:100%; word-break:break-word; } .filebox .preview .btnDelete {position:absolute; right:0; top:0; width:30px; height:100%;} .filebox .preview .btnDelete .icon {vertical-align:middle;} .filebox .preview .thumb img {height:100%;} @charset "UTF-8"; @media screen and (min-width:481px) { .shopMain .category li {min-width:11%;} .tab.my span {width:25%;} } /* Only iPhone 4,5 */ @media screen and (max-width:320px) { #gnb .paymentApps > li {padding-left:17px;} #gnb .footer div {padding-top:3px;} .dialog.mobileNav .body .guide {padding-top:9px;} .orderHistory .products .controls .select {width:100px;} .table .btn.md {padding:0 5px;} .lowerSalesList .board .content .item:first-child {width:65%;} .lowerSalesList .board .content .item:last-child {min-width:35%;} .topBanner .center {padding-right:20px;} .topBanner p {font-size:14px;} .topBanner .topBannerBtn {margin-left:0;} .shopMain.mobile .products .list .info .thumb {width:100px; height:100px;} .shopMain.mobile .products .list > li > div {padding-left:120px;} .shopMain.mobile .products .card .info .fix {height:152px;} .dialog.toCenter.navigation .layout {top:5%; bottom:5%;} .buy .table .row.cell2 .col:last-child {width:50%;} .buy .table .row.cell2 .col .btn {padding:0 10px;} .buy .payment .btns li.item5 .btn {padding:6px 3px 0; vertical-align:middle; line-height:1.2;} .buyDone .row.sides .itemCount .sub {max-width:100px;} .paymentDone .row.sides .itemCount .sub {max-width:100px;} .registerGate {padding-bottom:0;} .registerGate .join {position:static; padding-top:20px;} .registerGate .fixBottom {position:static;} .registerGate .fixBottom .fixContent {position:static;} .banner.colors a {height:auto; padding-bottom:8px;} .banner.colors a strong {display:block;} .products .list > li > div {padding-left:100px;height:126px;} .products .list .info .thumb{left:5px;top:10px;} .products .list .info .thumb.resize{width:90px; height:90px} .products .list .info .fix{padding:13px 5px 0 0;} .products .list .info .reconts {margin-top: 11px;} .products .list .info .price strong {font-size: 15px;} .products .info .price dd {font-size: 12px;} .products .row.quantity {padding-right:55px;} .products .list .info .disable{left:7px;top:22px;width:85px;height:85px} .products .list .info .new {left:55px;} .products .card .info .disable {top:15px;} .favorite .products .list .info .thumb {top:7px;} .favorite .products .list .info .disable {left: 45px; top: 15px;} .favorite .products .list .disable, .cart .products .list .disable {left: 45px;} .list.options .info .fix {padding: 0;} } /* 가로모드 (iPhone4 기준이상) */ @media screen and (min-width:480px) { .dialog.mobileNav .body nav span {width:25%;} .dialog.mobileNav .body nav span a {height:50px; padding-top:16px; font-size:13px;} .dialog.mobileNav .body nav span a:after {top:20px;} .dialog.mobileNav .body .guide {height:66px; padding-top:12px;} .dialog.toCenter.navigation .layout {top:5%; bottom:5%;} .dialog.cart .body {max-height:200px; overflow-y:auto; overflow-x:hidden;} } /* Only iPhone4,5 가로모드 */ @media screen and (min-width:480px) and (max-width: 568px) { .dialog.cart .body .info {height:57px; padding-left:15px;} .dialog.cart .body .info:after {content:''; display:block; clear:both;} .dialog.cart .body .info .thumb {display:none;} .dialog.cart .body .info .name {display:inline-block; float:left; width:49%;} .dialog.cart .body .info .select {float:right; width:49%;} } /* Only iPhone4 가로모드 */ @media screen and (min-width:480px) and (max-width: 481px) { .dialog.cart .body {max-height:120px;} } /* Only iPhone5 가로모드 */ @media screen and (min-width:568px) and (max-width: 569px) { .dialog.cart .body {max-height:100px;} } /* note 5 */ @media (-webkit-device-pixel-ratio: 3.5) and (min-width: 412px) { .gateMain #body .slider {padding-top:90%;} .video .dropDown .btn .icon.arrowBottom {margin-top:-5px;} .lifeWrite .btn.md {line-height:35px;} .lowerSalesList .headLine button .icon {margin-top:-5px;} } @media (orientation: landscape) { .ticketPreview .body .fixBottom {position:static; margin-top:20px;} .ticketPreview .body .fixContent {position:static;} } .ios { --top: 20pt; --bottom: 0px; } .ios.notch { --top: 33pt; --bottom: 35pt; } /* layout */ .ios #header { height: calc(var(--top) + 50px); padding-top: calc(var(--top) + 12px); } .ios #header .btn{ top: calc(var(--top) + 5px); } /*.notch #header { height: calc(var(--top) + 50px); }*/ .ios #body { padding-top: calc(var(--top) + 50px); } .ios #body.helpdeskMain { padding-top: calc(var(--top) + 70px); } .notch #body.cart { padding-bottom: calc(60px - var(--bottom) + 140px); } .notch #body.seminarInfo { padding-bottom: var(--bottom); } .notch .fixBottom.happyCenter .fixContent { height: calc(60px - var(--bottom) + 55px); } /* slide-popup */ .notch .slidePopup .slider .indicator.expand{ bottom: calc(60px - var(--bottom) + 65px); } /* gnb */ .notch #gnb { padding-bottom: var(--bottom); } .ios #gnb .info{ padding-top: calc(var(--top) + 52px); } .ios #gnb .info.nonmember { padding-top: calc(var(--top) + 22px); } .ios #gnb .info .local { top: calc(var(--top) + 11px); } .ios #gnb .info .setup a{ top: calc(var(--top) + 15px); } .ios .menuClose { top: calc(var(--top) + 17px); } /* main */ .ios .gateMain #header .btnMenu { top: calc(var(--top) + 6px); } .ios .gateMain #header .btns { top: calc(var(--top) + 8px); } .notch .gateMain #footer .fixContent { bottom: 0; } .ios .gateMain #body { padding-top: calc(var(--top) + 50px); } .notch .gateMain #body #footer { bottom: calc(var(--bottom) + 18px); } .notch .gateMain #nav a { padding-bottom: var(--bottom); } /* company */ .ios .company > .layout { height: calc(var(--top) + 45px); } .ios .company > .layout .btnMenu { top: calc(var(--top) + 7px); } .ios .company > .layout .btnSnb { top: calc(var(--top) + 4px); } .ios .company .header { padding-top: var(--top); } .ios .company .header .content{ transform: translateY(calc(var(--top) + 118px)); } .ios .company .section{ padding-top: calc(var(--top) + 291px); } .ios .company .marketing, .ios .company .socialShare, .ios .company .motto, .ios .company .vision, .ios .company .history{ padding-top: calc(var(--top) + 336px); } /* dialog */ .notch .dialog.tutorial .layout { padding: 0; height: 100%; } .notch .dialog.tutorial .layout .body { display: flex; align-items: center; justify-content: center; } .notch .dialog.promotions .body { padding-bottom: calc(var(--bottom)); } .ios .dialog.page .layout { padding-top: calc(var(--top) + 50px); } .ios .dialog.page.noHeader .layout { padding-top: 0; } .ios .dialog.page .layout header { height: calc(var(--top) + 50px); padding-top: calc(var(--top) + 9px); } .ios .dialog.page .dialogClose { top: calc(var(--top) + 16px); } .ios .treeLevel.dialog.page .dialogClose { top: calc(var(--top) + 8px); right: 9px; } .ios .treeLevel.dialog.page .dialogClose:after { top: 7px; } .ios .dialog .dialogPrev { top: calc(var(--top) + 16px); } .ios .dialog.search #header { height: 50px; padding-top: 12px; } .ios .dialog.search .layout { margin-top: calc(var(--top) + 50px); } .ios .dialog.search .layout + .dim { top: calc(var(--top) + 50px); bottom: 0; } .ios .dialog.search #body { padding-top: 50px; } .ios .dialog.mobileGuide.mobileQa .tab { top: calc(var(--top) + 50px); } .notch .dialog.findProduct .body { padding-bottom: calc(60px - var(--bottom)); } .notch .dialog.findProduct .search { position: relative; } .notch .dialog.findProduct .search input[type='search']{ padding-right: 30px; } .notch .dialog.findProduct .search .btnDelete{ right: 0; } .notch .snsShare .layout{ padding-bottom: calc(60px - var(--bottom)); } /* shop */ .notch #snb { padding-bottom: calc(60px - var(--bottom)); } .notch #footer .fixContent { /* bottom: calc(60px - var(--bottom)); */ padding-bottom: calc(60px - var(--bottom) + 101px); } .notch .notice.fixBottom { bottom: calc(60px - var(--bottom) + 171px); } .notch .products .list { margin-bottom: calc(60px - var(--bottom)); } .notch .shopMain .btnMore { margin-bottom: calc(60px - var(--bottom) + 20px); } .notch .fixBottomBtn { bottom: calc(60px - var(--bottom) + 65px); } .notch .buy ~ .fixBottomBtn, .notch .product ~ .fixBottomBtn { bottom: calc(60px - var(--bottom) + 75px); } .notch .row.btns .col, /*.ios .row.btns.floating,*/ .notch .noticeDetail .row.btns.margin.floating.box { padding-bottom: calc(60px - var(--bottom)); } .notch .row.btns .col:first-child:last-child { padding-bottom: 0; } .notch .row.btns.floating { height: calc(60px - var(--bottom) + 70px); } .notch .favorite .row.btns.floating { height: 70px; padding-bottom: 0; bottom: calc(60px - var(--bottom) + 60px); } .notch .buy .agreement { margin-bottom: calc(60px - var(--bottom)); } .notch .buy .row.btns.btnScroll { height: calc(60px - var(--bottom) + 70px); } /* myoffice */ .notch .planList .plans { padding-bottom: calc(60px - var(--bottom)); } .notch .lowerSalesList .guide{ margin-bottom: calc(60px - var(--bottom)); } /* paynowBiz */ .notch .paymentMethod.dialog .layout .body ul li:last-child { padding-bottom: 15px; } @charset "UTF-8"; .office_us .gateMain #body .slider .item a { font-size: 22px; } .office_us .gateMain #body .slider .item a .content .summary { padding: 2.5px 25px 0; } .office_us .gateMain .row.info .notice { width: 55%; } .office_us .gateMain .row.info .happyCenter { width: 45%; /*text-align:center*/ } .office_us .company .header .slider .content h1 { font-size: 22px } .office_us .w100 { width: 100% !important } /*.office_tw .buy .delivery .controls.txthalf .col label{letter-spacing:-1px}*/ /*********************** gnb ***********************/ /*.office_tw #gnb .myPage li a:after {background-image:url('/static/us/en-us/images/common/icon_gnb.png');} .office_tw #gnb .myPage li.faq a:after {top:20px; width:26px; height:23px; margin-left:-10px; background-position:-239px 0;}*/ .office_us .fixBottom.happyCenter .fixContent { padding-top: 6px } .office_us .fixBottom.happyCenter .fixContent p { color: #333; font-size: 14px; } .office_us .fixBottom.happyCenter .fixContent span strong { font-size: 16px; } .office_us .fixBottom.happyCenter .fixContent small:after { border-left: 0; } .office_us .orders .price dt { width: 110px; } .office_us .orderDetail .products .list.sm .body .price dt { width: 110px; } .office_us .combination .icon { display: inline-block; text-align: center; background-image: url('/static/us/en-us/images/common/layout_sprite01.png'); background-repeat: no-repeat; background-size: 360px auto; pointer-events: none; } .office_us .company .motto .verticalLine:after { height: 60px; top: 5px; } .office_us .company .header .slider .content h2 { margin-top: 27px; } .office_us .company .tab.dark.markets span a { padding-top: 8px; padding-bottom: 10px; line-height: 15px; font-size: 12px; height: 40px; } .office_us .company .tab.dark.markets span.active a { padding-bottom: 10px; line-height: 15px; height: 40px; } .office_us .company .tab.dark.markets span:nth-child(1) a { margin-top: 10px; } .office_us .company .tab.dark.markets span:nth-child(2) a { position: absolute; top: 0; height: 50px; width: 33.3%; } .office_us .company .marketing .ratings .plans .rank.color3 .head { padding: 18px 0 0; } .office_us .company .marketing .ratings .plans .rank.color5 .head { padding: 13px 0 0; } .office_us #gnb .myPage li.faq a:after { top: 20px; width: 24px; height: 20px; margin-left: -13px; background-position: -236px 0; } .office_us .company .marketing .ratings .plans .rank.color5 div.head strong { font-size: 12px; } /*********************** 쇼핑몰 메인 ***********************/ /*.office_us .shopMain .category li a:after { background-image: url('/static/us/en-us/images/common/shop_category_icon.png'); background-size: 400px auto; } .office_us .shopMain .category li.fashion a:after { width: 32px; height: 25px; top: 16px; margin-left: -16px; background-position: -320px 0; } .office_us .shopMain .category li.toSet a:after { width: 21px; height: 31px; top: 14px; margin-left: -10px; background-position: -368px 0; }*/ /*.office_us .products .list > li > div.beValu{height:150px}*/ .office_us .products .list.sm > li > div, .office_us .products .list > li > div, .office_us .cart .products .list > li > div, .office_us .favorite .products .list > li > div { min-height: 123px; height: auto; padding-bottom: 10px; } .office_us .products .list .info .reconts { width: 40% } /*.office_us .products .card .info .fix { height: 155px; }*/ .office_us .products .soon, .office_us .product .soon { display: block; font-size: 14px; color: #ff9900; text-transform: uppercase; } .office_us .products .list.sm.expand .head { min-height: 0; } .office_us .products .list.expand .footer { padding: 0; } .office_us .product .tab span a { width: 100%; height: 37px; font-size: 14px; line-height: 150%; } .office_us .product .tab span.active a { height: 37px } .office_us .product .tab span:nth-child(1) a { margin-top: 13px; height: 37px; } .office_us .product .tab span:nth-child(3) a { position: absolute; top: 3px; height: 47px; width: 33.3% } .office_us .product .starRating { margin-bottom: 16px } /* .shop > #header */ .office_us .tab.productNavTap span a { width: 100%; height: 37px; font-size: 14px; line-height: 150%; } .office_us .tab.productNavTap span.active a { height: 37px } .office_us .tab.productNavTap span:nth-child(1) a { margin-top: 13px; height: 37px; } .office_us .tab.productNavTap span:nth-child(3) a { position: absolute; top: 3px; height: 47px; width: 33.3% } .office_us .products .list.expand .footer.row .col .btn.md { line-height: normal; } .office_us .review .starRating dl dt { min-width: 100px; text-align: center; } .office_us .review .starRating dl dd.result { margin-left: 15px; } /* 쇼핑몰 결제 */ .office_us .accordion section table .email .checkbox { float: left } .office_us .accordion section table .email label { display: inline-block; float: left; width: 82%; padding-left: 3px } /*.office_tw #gnb .info .data dl dt {background-image: url('/static/us/en-us/images/common/layout_sprite.png');} .office_tw .rankDetail .plans .rank .head{padding: 28px 0 0;}*/ /* sold out */ .office_us .icon.soldOut01 { background-image: url('/static/us/en-us/images/common/soldout.png'); background-repeat: no-repeat; background-size: 360px auto; } .office_us .products .list .info .disable .icon.soldOut01 { background-image: url('/static/us/en-us/images/common/soldout.png'); background-repeat: no-repeat; background-size: 360px auto; } .office_us .icon.icon-soldout { background-repeat: no-repeat; background-size: 360px auto; } .office_us .icon.soldOutE { background-image: url('/static/us/en-us/images/common/soldout_east.png'); } .office_us .icon.soldOutW { background-image: url('/static/us/en-us/images/common/soldout_wa.png'); } .office_us .icon.soldOutC { background-image: url('/static/us/en-us/images/common/soldout_ca.png'); } .office_us .icon.soldOutG { background-image: url('/static/us/en-us/images/common/soldout_ga.png'); } .office_us .icon.soldOutWE { background-image: url('/static/us/en-us/images/common/soldout_eastwa.png'); } .office_us .icon.soldOutWC { background-image: url('/static/us/en-us/images/common/soldout_waca.png'); } .office_us .icon.soldOutWG { background-image: url('/static/us/en-us/images/common/soldout_waga.png'); } .office_us .icon.soldOutEC { background-image: url('/static/us/en-us/images/common/soldout_eastca.png'); } .office_us .icon.soldOutEG { background-image: url('/static/us/en-us/images/common/soldout_eastga.png'); } .office_us .icon.soldOutCG { background-image: url('/static/us/en-us/images/common/soldout_caga.png'); } .office_us .icon.soldOutWEC { background-image: url('/static/us/en-us/images/common/soldout_waeastca.png'); } .office_us .icon.soldOutWEG { background-image: url('/static/us/en-us/images/common/soldout_waeastga.png'); } .office_us .icon.soldOutECG { background-image: url('/static/us/en-us/images/common/soldout_eastcaga.png'); } .office_us .icon.soldOutWCG { background-image: url('/static/us/en-us/images/common/soldout_wacaga.png'); } /* east > nj 로 변경 : 개발측에서 넣어주는 클래스는 동일하기때문에 기존 유지하고 이미지만 변경 */ .office_us .icon.soldOutE { background-image: url('/static/us/en-us/images/common/soldout_nj.png'); } .office_us .icon.soldOutWE { background-image: url('/static/us/en-us/images/common/soldout_wanj.png'); } .office_us .icon.soldOutEC { background-image: url('/static/us/en-us/images/common/soldout_njca.png'); } .office_us .icon.soldOutEG { background-image: url('/static/us/en-us/images/common/soldout_njga.png'); } .office_us .icon.soldOutWEC { background-image: url('/static/us/en-us/images/common/soldout_wanjca.png'); } .office_us .icon.soldOutWEG { background-image: url('/static/us/en-us/images/common/soldout_wanjga.png'); } .office_us .icon.soldOutECG { background-image: url('/static/us/en-us/images/common/soldout_njcaga.png'); } .office_us .icon.icon-soldout.sm { width: 64px; height: 40px; margin-top: 29px; background-position: 0 0; } .office_us .icon.icon-soldout.md { width: 83px; height: 52px; background-position: -72px 0; } .office_us .icon.icon-soldout.lg { width: 101px; height: 63px; background-position: -171px 0; } .office_us .products .list .info .disable .icon.icon-soldout.md { width: 64px; height: 40px; margin-top: 30px; background-position: 0 0; } .office_us .product .detail .disable .icon.icon-soldout { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .office_us .products .info .disable .icon.icon-soldout.md { margin-top: 43px; } .office_us .table.infos tbody tr:last-child th { vertical-align: top; } /*.office_us .icon.soldOutE.sm, .office_us .icon.soldOutW.sm, .office_us .icon.soldOutC.sm, .office_us .icon.soldOutG.sm, .office_us .icon.soldOutWE.sm, .office_us .icon.soldOutWC.sm, .office_us .icon.soldOutWG.sm, .office_us .icon.soldOutEC.sm, .office_us .icon.soldOutEG.sm, .office_us .icon.soldOutCG.sm, .office_us .icon.soldOutWEC.sm, .office_us .icon.soldOutWEG.sm, .office_us .icon.soldOutECG.sm, .office_us .icon.soldOutWCG.sm {width:64px; height:40px; margin-top:29px; background-position:0 0;} .office_us .icon.soldOutE.md, .office_us .icon.soldOutW.md, .office_us .icon.soldOutC.md, .office_us .icon.soldOutG.md, .office_us .icon.soldOutWE.md, .office_us .icon.soldOutWC.md, .office_us .icon.soldOutWG.md, .office_us .icon.soldOutEC.md, .office_us .icon.soldOutEG.md, .office_us .icon.soldOutCG.md, .office_us .icon.soldOutWEC.md, .office_us .icon.soldOutWEG.md, .office_us .icon.soldOutECG.md, .office_us .icon.soldOutWCG.md {width:83px; height:52px; background-position:-72px 0;} .office_us .icon.soldOutE.lg, .office_us .icon.soldOutW.lg, .office_us .icon.soldOutC.lg, .office_us .icon.soldOutG.lg, .office_us .icon.soldOutWE.lg, .office_us .icon.soldOutWC.lg, .office_us .icon.soldOutWG.lg, .office_us .icon.soldOutEC.lg, .office_us .icon.soldOutEG.lg, .office_us .icon.soldOutCG.lg, .office_us .icon.soldOutWEC.lg, .office_us .icon.soldOutWEG.lg, .office_us .icon.soldOutECG.lg, .office_us .icon.soldOutWCG.lg {width:101px; height:63px; background-position:-171px 0;} .office_us .products .list .info .disable .icon.soldOutE.md, .office_us .products .list .info .disable .icon.soldOutW.md, .office_us .products .list .info .disable .icon.soldOutC.md, .office_us .products .list .info .disable .icon.soldOutG.md, .office_us .products .list .info .disable .icon.soldOutWE.md, .office_us .products .list .info .disable .icon.soldOutWC.md, .office_us .products .list .info .disable .icon.soldOutWG.md, .office_us .products .list .info .disable .icon.soldOutEC.md, .office_us .products .list .info .disable .icon.soldOutEG.md, .office_us .products .list .info .disable .icon.soldOutCG.md, .office_us .products .list .info .disable .icon.soldOutWEC.md, .office_us .products .list .info .disable .icon.soldOutWEG.md, .office_us .products .list .info .disable .icon.soldOutECG.md, .office_us .products .list .info .disable .icon.soldOutWCG.md {width:64px; height:40px; margin-top:30px; background-position:0 0;} .office_us .product .detail .disable .icon.soldOutE, .office_us .product .detail .disable .icon.soldOutW, .office_us .product .detail .disable .icon.soldOutC, .office_us .product .detail .disable .icon.soldOutG, .office_us .product .detail .disable .icon.soldOutWE, .office_us .product .detail .disable .icon.soldOutWC, .office_us .product .detail .disable .icon.soldOutWG, .office_us .product .detail .disable .icon.soldOutEC, .office_us .product .detail .disable .icon.soldOutEG, .office_us .product .detail .disable .icon.soldOutCG, .office_us .product .detail .disable .icon.soldOutWEC, .office_us .product .detail .disable .icon.soldOutWEG, .office_us .product .detail .disable .icon.soldOutECG, .office_us .product .detail .disable .icon.soldOutWCG {position:absolute; left:50%; top:50%; -webkit-transform:translate(-50%, -50%); transform:translate(-50%, -50%);} .office_us .products .info .disable .icon.soldOutE.md, .office_us .products .info .disable .icon.soldOutW.md, .office_us .products .info .disable .icon.soldOutC.md, .office_us .products .info .disable .icon.soldOutG.md, .office_us .products .info .disable .icon.soldOutWE.md, .office_us .products .info .disable .icon.soldOutWC.md, .office_us .products .info .disable .icon.soldOutWG.md, .office_us .products .info .disable .icon.soldOutEC.md, .office_us .products .info .disable .icon.soldOutEG.md, .office_us .products .info .disable .icon.soldOutCG.md, .office_us .products .info .disable .icon.soldOutWEC.md, .office_us .products .info .disable .icon.soldOutWEG.md, .office_us .products .info .disable .icon.soldOutECG.md, .office_us .products .info .disable .icon.soldOutWCG.md {margin-top:43px;}*/ .office_us .editCenter .box.primary { padding: 12px 15px; } .office_us .editCenter .table { margin-top: 15px; } .office_us #snb span a { line-height: 18px; } .office_us #snb span.benefit a, .office_us #snb span.lowerSales a { line-height: 9px; top: -5px; } .office_us .shopMain .notice .fixContent { padding-left: 120px; padding-right: 38px; } .office_us .shopMain .notice h3 { width: 98px; } /*New Products none*/ .office_us .shopMain .bar { height: auto } .office_us .shopMain.categoryProduct .bar { height: 90px } /*결제*/ .office_us .buy .delivery .tab { width: 100%; } .office_us .tabContent p { line-height: 120% } .office_us .payInformationbank, .office_us .payInformationcash { padding-top: 10px; font-size: 14px; line-height: 120% } .office_us .payInformation ul li em { color: #f9993b } .office_us .buyDone .row.btns .btn.lg { font-size: 15px } /*********************** Office ***********************/ .office_us .icon.lowerLeft { width: 20px; height: 20px; background-image: url('/static/us/en-us/images/common/icon_sprite.png'); background-repeat: no-repeat; background-size: 360px auto; background-position: -315px 0; vertical-align: text-top; } .office_us .icon.lowerRight { width: 20px; height: 20px; background-image: url('/static/us/en-us/images/common/icon_sprite.png'); background-repeat: no-repeat; background-size: 360px auto; background-position: -335px 0; vertical-align: text-top; } .office_us .icon.lowerLeftLg { width: 21px; height: 21px; background-image: url('/static/us/en-us/images/common/icon_sprite.png'); background-repeat: no-repeat; background-size: 360px auto; background-position: 0 -25px; vertical-align: text-top; } .office_us .icon.lowerRightLg { width: 21px; height: 21px; background-image: url('/static/us/en-us/images/common/icon_sprite.png'); background-repeat: no-repeat; background-size: 360px auto; background-position: -25px -25px; vertical-align: text-top; } .office_us .schedule .calendarF { overflow: hidden; width: 100%; height: 100px; margin: 5px 0 30px } .office_us .schedule .calendarF ul li { text-align: right; font-size: 12px; line-height: 180%; } .office_us .schedule .calendarF ul li:nth-child(1) { margin-right: 65px } .office_us .schedule .calendarF ul li:nth-child(2) { margin-right: 18px } .office_us .schedule .calendarF span { margin: 0 10px 0 7px; } .office_us .schedule .calendarF:after { content: ''; display: block; clear: both; } .office_us .planList .guide .text p strong { font-size: 21px } .office_us .planList .guide .btns a { width: 240px } .office_us .lifeWrite .write .support section .head strong { display: block; padding-bottom: 4px; margin-bottom: 3px; border-bottom: 1px solid rgba(255,255,255,.3); } .office_us .lifeWrite .write .support .soul strong, .office_us .lifeWrite .write .support .sprit strong { margin-top: 5px } .office_us .lifeWrite .write .support .environment .head { padding: 7px 0 0 3px; line-height: 100% } .office_us .lifeWrite .write .support .environment strong { margin-top: 6px; word-break: break-all; margin-bottom: 1px !important } .office_us .lifeWrite .write .support .environment span { letter-spacing: -.5px } .office_us .lifeWrite .write .support section ul { width: 75%; padding: 7px 5px 15px } .office_us .lifeWrite .write .support section ul li .checkbox { float: left } .office_us .lifeWrite .write .support section ul li label { display: inline-block; float: left; width: 74%; padding-left: 3px } .office_us .rankWrite .guide { padding-top: 8px } .office_us .schedule .seminTop span { margin: 0 105px 0 7px; } .office_us .schedule .seminTop span em { margin-left: 15px; width: 100px; } .office_us .registerGate .join .slogun { width: 280px } .office_us .unregister .box.gray { padding: 15px } .office_us .password .advice ul > li { white-space: normal } .office_us .helpdeskMain .box.default .box.primary p span:after { height: 14px } .office_us .tab.scroll span { display: inline-table; } .office_us .rankDetail .plans .rank .head { padding-top: 28px } .office_us .rankDetail .plans .rank.sales .head, .office_us .rankDetail .plans .rank.sharon .head { padding-top: 21px } .office_us .lower .controls .bar .select { width: 195px; } .office_us .tab.type3 span a { font-size: 13px } /*********************** 회원가입 ***********************/ .office_us .registerGate .join .btns .btn { /*height:80px;*/ padding: 10px 15px; line-height: 20px; font-size: 14px; } .office_us .register .process ul { } .office_us .register .process ul li { display: inline-flex; align-items: center; padding-top: 0 !important; font-size: 12px; word-break: break-word; line-height: 12px } .office_us .register .process ul li span { display: inline-block; max-width: 78%; } .office_us .register .process ul li span:before { top: 50% !important; transform: translateY(-50%); } .office_us .register .process ul li.step1 span:before { left: -5px; } .office_us .register .process ul li.step2 span:before { left: -10px } .office_us .register .process ul li.step3 span:before { left: -14px; } /*.register .process ul {height:44px; overflow:hidden;} .register .process ul li {float:left; position:relative; width:35%; height:44px; padding-top:12px; text-align:center; font-size:14px; color:#333; background-color:#f6f6f8; border-bottom:1px solid #c6c6c6; box-sizing:border-box;} .register .process ul li.step1 {padding-left:14px} .register .process ul li.step2 {padding-left:17px} .register .process ul li.step3 {padding-left:21px}*/ .office_us .register .table tbody th { white-space: normal; } /*********************** 사라지는 팝업 ***********************/ .office_us .toast .layout .body .toastCart { margin-top: -70px; } .office_us .toast .layout .body .toastPinch { margin-top: -70px; } @media screen and (max-width:375px) { /*.office_us .products .list > li > div.beValu{ height:155px}*/ .office_us .products .list .info .reconts.nomember { width: 100% } .office_us .products .list .info .reconts.nomember + .row { margin-top: 5px; } } @media screen and (max-width:360px) { .office_us .product .products .card .info .fix { min-height: auto; } .office_us .products .card .info .fix { min-height: 180px; } } /* Only iPhone 4,5 */ @media screen and (max-width:320px) { /*.office_us .products .list > li > div.beValu{ height:155px}*/ .office_us .products .list .info .reconts.nomember { width: 100% } .office_us .products .list .info .reconts.nomember + .row { margin-top: 5px; } /*.office_us .products .card .info .fix{ height:155px;}*/ .office_us .products .card .info .fix { min-height: 180px; } .office_us .favorite .products .list .info .thumb { top: 50%; } .office_us .product .row.btns.floating .col .btn { font-size: 15px; } .office_us .product .row.btns.floating .icon.cart2 { display: none; } } /* Nexus 5X ~ */ @media screen and (min-width:412px) { } /* 가로모드 (iPhone4 기준이상) */ @media screen and (min-width:480px) { .office_us #snb span.benefit a, .office_us #snb span.lowerSales a { line-height: 18px; top: 0; } } /*********************** 로그인 ***********************/ .office_us .signIn .help .row.btns .col .btn.sm { font-size: 10px; } .office_us .signIn .login .box-input { display: block; padding: 3px 0 } /* 상품 섬네일 위치 수정 */ .office_us .products .list .info .thumb { top: 50%; transform: translateY(-50%); } .office_us .cart .products .list .info { position: relative; } .office_us .company > .layout { height: 45px; } .office_us .company .header { padding-bottom: 0; overflow: visible; } .office_us .company .header .content { pointer-events: none; } .office_us .company .header [data-body-id="intro"] .image { background-image: url('/static/images/common/company_head_bg_01.jpg'); } .office_us .company .header [data-body-id="history"] .image { background-image: url('/static/images/common/company_head_bg_02.jpg'); } .office_us .company .header [data-body-id="vision"] .image { background-image: url('/static/images/common/company_head_bg_03.jpg'); } .office_us .company .header [data-body-id="motto"] .image { background-image: url('/static/images/common/company_head_bg_04.jpg'); } .office_us .company .header [data-body-id="social"] .image { background-image: url('/static/images/common/company_head_bg_05.jpg'); } .office_us .company .header [data-body-id="socialShare"] .image { background-image: url('/static/images/common/company_head_bg_06.jpg'); } .office_us .company .header [data-body-id="marketing"] .image { background-image: url('/static/images/common/company_head_bg_07.jpg'); } .office_us .company .header [data-body-id="seminars"] .image { background-image: url('/static/images/common/company_head_bg_08.jpg'); } .office_us .company .header [data-body-id="brand"] .image { background-image: url('/static/images/common/company_head_bg_09.jpg'); } .office_us .company .controller span { display: inline-block; position: absolute; top: inherit; bottom: 10px; z-index: 1; } .office_us .company .controller span:after { content: ''; display: inline-block; position: absolute; top: 0; width: 62px; height: 7px; background-image: url('/kr/m/static/images/common/icon_sprite.png'); background-repeat: no-repeat; background-size: 360px auto; } .office_us .company .controller .prev { left: 15px; } .office_us .company .controller .prev:after { left: 0; background-position: -150px -35px; } .office_us .company .controller .next { right: 15px; } .office_us .company .controller .next:after { right: 0; background-position: -150px -25px; } .office_us .company .controller span a { display: inline-block; min-width: 62px; padding-top: 11px; font-size: 12px; color: rgba(255,255,255,.8); text-align: center; } .office_us .company .header .content { position: absolute; left: 0; right: 0; top: 0; z-index: 1; text-align: center; -webkit-transform: translateY(118px); transform: translateY(118px); } .office_us .company .header .content .logo { display: inline-block; position: absolute; left: 50%; top: -65px; width: 51px; height: 44px; margin-left: -25px; background-image: url('/static/images/common/logo_white_102x87.png'); background-repeat: no-repeat; background-size: 51px auto; } .office_us .company .header .content h1, .office_us .company .header .content h2 { position: relative; z-index: 1; opacity: 1; padding-bottom: 10px; } .office_us .company .header .content h1 { font-size: 30px; color: #fff; line-height: 1.2; } .office_us .company .header .content h2 { margin-top: 9px; font-size: 18px; color: #fff; font-weight: bold; } .office_us .company .header .content h1:after { content: ''; display: inline-block; position: absolute; left: 50%; bottom: 0; width: 26px; margin-left: -13px; border-top: 1px solid #fff; } .office_us .company .header .content h1 { font-size: 22px } .office_us .company [data-body-id="marketing"] .tab.dark span, .office_us .company [data-body-id="vision"] .tab.dark span { vertical-align: top } .office_us .company [data-body-id="marketing"] .tab.dark span a, .office_us .company [data-body-id="vision"] .tab.dark span a { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-align-content: center; align-content: center; -webkit-box-align: center; -webkit-align-items: center; align-items: center; font-size: 12px; height: 50px; line-height: 1.4; text-align: center; } .office_us .company [data-body-id="marketing"] .tab.dark span.active a { } .office_us .company .socialShare { padding-top: 291px; } .office_us .company .section.vision .content p { margin-bottom: 10px; } .fade { transition: opacity 0.25s ease-out; z-index: 5 !important; } .fade-enter { opacity: 1; } .fade-leave { opacity: 0; }