/* Minification failed. Returning unminified contents. (3049,1): run-time error CSS1019: Unexpected token, found '@import' (3049,9): run-time error CSS1019: Unexpected token, found 'url(http://static.atomy.com/fonts.googleapis.com/earlyaccess/notosanstc.css)' */ @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[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} .relative{position:relative !important;} .radio, .checkbox{ display:inline-block; position:relative; width:25px; height:25px; 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('http://static.atomy.com/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} .select100: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.disabled:before{background-color:#f6f6f8;border-color:#e1e1e1;} .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} [lang='tr-TR']{font-family:Arial, sans-serif} @charset "UTF-8"; html, body, #container{height:100%} body{background-color:#f1f2f4} #container{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent} #layout{position:relative;z-index:1;min-height:100%;box-sizing:border-box} /* gnb */ #gnb{position:fixed;left:0;top:0;bottom:0;z-index:200;width:300px;overflow-y:auto;overflow-x:hidden;background-color:#f5f5f5;box-sizing:border-box} #gnb .info{min-height:130px;padding:52px 15px 10px;color:#fff;box-sizing:border-box;background-image:url('http://static.atomy.com/static/images/common/gnb_top_bg.jpg');background-repeat:no-repeat;background-size:cover} #gnb .info:after{content:'';display:block;clear:both} #gnb .info .local{position:absolute;left:15px;top:11px} #gnb .info .local a{position:relative;display:inline-block;padding-left:9px;margin-left:3px;font-size:14px;color:#fff;vertical-align:middle;line-height:1.5} #gnb .info .local a:first-child{padding-left:0;margin-left:0} #gnb .info .local a:after{content:'';display:block;position:absolute;left:0;top:4px;height:13px;border-left:1px solid rgba(255,255,255,.4)} #gnb .info .local a:first-child:after{content:none} #gnb .info .setup a{display:inline-block;position:absolute;right:15px;top:15px;width:19px;height:20px;font:0/0 a;background-image:url('http://static.atomy.com/static/images/common/layout_sprite.png');background-position:-125px 0;background-repeat:no-repeat;background-size:360px auto} #gnb .info .data:after{content:'';display:block;clear:both} #gnb .info .data .name{display:block;margin-bottom:4px;font-size:23px} #gnb .info .data .name small{font-size:13px;color:rgba(255,255,255,.8);white-space:nowrap} #gnb .info .data dl{float:left;margin-right:8px;margin-bottom:2px} #gnb .info .data dl:after{content:'';display:block;clear:both} #gnb .info .data dl dt{float:left;width:21px;height:21px;margin-right:5px;margin-top:2px;font:0/0 a;background-image:url('http://static.atomy.com/static/images/common/layout_sprite.png');background-position:-150px -75px;background-repeat:no-repeat;background-size:360px auto} #gnb .info .data dl:nth-of-type(1) dt{background-position:-150px -50px} #gnb .info .data dl dd{float:left;font-size:11px} #gnb .info .data dl dd em{font-size:16px} #gnb .info.nonmember{padding-top:40px;text-align:center} #gnb .info.nonmember .text1{font-size:14px} #gnb .info.nonmember .text2{font-size:18px} #gnb .info.nonmember .btns{margin-top:8px} #gnb .info.nonmember .btns .btn{width:90px;height:30px;line-height:28px;color:#fff;border:1px solid #fff;border-radius:20px} #gnb .myPage{background-color:#fff} #gnb .myPage:after{content:'';display:block;clear:both} #gnb .myPage li{float:left;width:25%;box-sizing:border-box;border-bottom:1px solid #e2e2e2;border-right:1px solid #e2e2e2} #gnb .myPage li:nth-child(4n+4){border-right:none} #gnb .myPage li a{display:block;position:relative;height:75px;padding-top:43px;font-size:12px;color:#333;text-align:center;line-height:12px;box-sizing:border-box} #gnb .myPage li a:after{content:'';display:inline-block;position:absolute;left:50%;background-image:url('http://static.atomy.com/static/images/common/icon_gnb.png');background-repeat:no-repeat;background-size:360px auto} #gnb .myPage li.tree a:after{top:16px;width:23px;height:23px;margin-left:-11px;background-position:0 0} #gnb .myPage li.low a:after{top:17px;width:26px;height:21px;margin-left:-12px;background-position:-25px 0} #gnb .myPage li.benefit a:after{top:17px;width:23px;height:21px;margin-left:-10px;background-position:-55px 0} #gnb .myPage li.cart a:after{top:18px;width:23px;height:20px;margin-left:-12px;background-position:-80px 0} #gnb .myPage li.order a:after{top:15px;width:20px;height:22px;margin-left:-10px;background-position:-105px 0} #gnb .myPage li.delivery a:after{top:18px;width:31px;height:19px;margin-left:-17px;background-position:-125px 0} #gnb .myPage li.balance a:after{top:19px;width:25px;height:22px;margin-left:-12px;background-position:-160px 0} #gnb .myPage li.number a:after{top:19px;width:20px;height:21px;margin-left:-10px;background-position:-185px 0} #gnb .myPage li.notice a:after{top:20px;width:24px;height:20px;margin-left:-13px;background-position:-210px 0} #gnb .myPage li.paynowBiz a{font:0/0 a;} #gnb .myPage li.paynowBiz a:after{top:10px;width:55px;height:55px;margin-left:-29px;background-position:0 -30px} #gnb .navigation{background-color:#f5f5f5} #gnb .navigation a{display:block} #gnb .depth1 > li{position:relative} #gnb .depth1 > li:after{content:'';display:inline-block;position:absolute;right:15px;top:25px;width:10px;height:6px;background-image:url('http://static.atomy.com/static/images/common/icon_sprite.png');background-repeat:no-repeat;background-position:-160px -10px;background-size:360px auto;-webkit-transition:-webkit-transform .2s ease-in;transition:transform .2s ease-in;} #gnb .depth1 > li.home:after{-webkit-transform:rotate(270deg);transform:rotate(270deg)} #gnb .depth1 > li.active:after{background-position:-160px 0;-webkit-transform:rotate(180deg);transform:rotate(180deg)} #gnb .depth1 > li.active + li{border-top:1px solid #e2e2e2} #gnb .depth1 > li > .btn{display:block;width:100%;height:50px;line-height:50px;padding:0 5px 0 15px;text-align:left;font-size:16px;color:#000;border-bottom:1px solid #e2e2e2;background-color:#fff;box-sizing:border-box} #gnb .depth1 > li > .btn:active, #gnb .depth1 > li.active > .btn{color:#00b6f0;font-weight:bold} #gnb .depth1 > li:last-child ul{border-bottom:1px solid #e2e2e2} #gnb .depth2{display:none} #gnb .depth2 > li{padding:0 15px} #gnb .depth2 > li:first-child > .btn{border-top:none} #gnb .depth2 > li > .btn{display:block;position:relative;width:100%;height:45px;padding:12px 25px 12px 10px;text-align:left;color:#333;font-size:14px;border-top:1px solid #e2e2e2;box-sizing:border-box} #gnb .depth2 > li > .btn:after{content:'';display:inline-block;position:absolute;right:10px;top:18px;width:5px;height:9px;background-image:url('http://static.atomy.com/static/images/common/icon_sprite.png');background-repeat:no-repeat;background-position:-195px 0;background-size:360px auto} #gnb .depth2 > li > .low:before{content:'';display:inline-block;position:absolute;right:12px;top:17px;height:11px;border-left:1px solid #adadad;-webkit-transition:all .2s ease-in;transition:all .2s ease-in;border-radius:2px} #gnb .depth2 > li > .low:after{right:7px;top:22px;width:11px;border-top:1px solid #adadad;background:none;-webkit-transition:-webkit-transform .2s ease-in;transition:transform .2s ease-in;-webkit-transform-origin:50% 0;transform-origin:50% 0} #gnb .depth2 > li.active > .low{font-weight:bold} #gnb .depth2 > li.active > .low:before{opacity:0;-webkit-transform:rotate(180deg);transform:rotate(180deg)} #gnb .depth2 > li.active > .low:after{-webkit-transform:rotate(180deg);transform:rotate(180deg)} #gnb .depth3{display:none;padding-bottom:10px;padding-left:15px} #gnb .depth3 > li{position:relative} #gnb .depth3 > li:after, #gnb .depth3 > li:before{content:'';display:inline-block;position:absolute;left:13px} #gnb .depth3 > li:after{top:15px;height:5px;width:1px;background-color:#aeaeae} #gnb .depth3 > li:before{top:20px;width:6px;height:1px;background-color:#aeaeae} #gnb .depth3 > li a{display:block;padding:8px 10px 8px 25px;text-align:left;color:#666;font-size:13px} #gnb .paymentApps{display:none;padding-bottom:20px} #gnb .paymentApps:after{content:'';display:block;clear:both} #gnb .paymentApps > li{float:left;padding-left:25px} #gnb .paymentApps > li:first-child{padding-left:20px} #gnb .paymentApps > li a{display:inline-block;width:55px;height:55px;font:0/0 a;vertical-align:top;background-image:url('http://static.atomy.com/static/images/common/payment_apps.png');background-size:360px auto;background-repeat:no-repeat} #gnb .paymentApps .paynowBiz a{background-position:0 0} #gnb .paymentApps .kpay a{background-position:-60px 0} #gnb .paymentApps .paynow a{background-position:-120px 0} #gnb .depth1 > li.active .depth2, #gnb .depth2 > li.active .depth3, #gnb .depth2 > li.active .paymentApps{display:block} #gnb .navigation .content .quick ul li{float:left;width:20%;text-align:center;box-sizing:border-box} #gnb .navigation .content .quick ul li a{display:block;height:50px;padding:5px;color:#666;border-bottom:1px solid rgba(0,0,0,.1);box-sizing:border-box} #gnb .footer{position:relative;height:110px;padding-top:15px;padding-left:15px} #gnb .footer .onair a{display:block;position:absolute;left:15px;bottom:15px;width:70px;height:70px;font:0/0 a;background-image:url('http://static.atomy.com/static/images/common/atomy_onair.png');background-repeat:no-repeat;background-position:0 0;background-size:70px auto;} #gnb .footer div{overflow:hidden;padding-top:13px} #gnb .footer div a{position:relative;display:inline-block;padding-left:9px;margin-left:-9px;margin-right:12px;font-size:14px;color:#666;white-space:nowrap} #gnb .footer div a:after{content:'';display:block;position:absolute;left:0;top:5px;height:10px;border-left:1px solid #c4c4c4} #gnb .footer .copy{font-size:13px;font-weight:bold} #gnb .footer a img{vertical-align:sub} #gnb .footer div a.linkOfficial:last-child{padding-left:0} #gnb .footer div a.linkOfficial:last-child:after{content:none} #gnb .footer .social-link{padding:10px 0} #gnb .footer .social-link a{margin:0 2.5px 0 0;padding:0} #gnb .footer .social-link a:after{content:none} #gnb .footer .sns-icon{display:block;} #gnb .footer .sns-icon a{position:relative;top:-6px;display:inline-block;margin:0;padding:0;width:21px;height:20px;font:0/0 a;background-image:url('http://static.atomy.com/static/images/common/icon_social.png');background-repeat:no-repeat;background-position:0 50%;background-size:auto 20px;} #gnb .footer .sns-icon a.facebook-icon{background-position:-27px 50%} #gnb .footer .sns-icon a.instagram-icon{background-position:0 50%} #gnb .footer .sns-icon a.band-icon{background-position:-55px 50%} #gnb .footer .sns-icon a.youtube-icon{background-position:-165px 50%} #gnb .btnGlobalSites{border-bottom:1px solid #e2e2e2;background-color:#fff} #gnb .btnGlobalSites h3{display:block;width:100%;height:50px;line-height:50px;padding:0 5px 0 15px;text-align:left;font-size:16px;color:#000;background-color:#fff;box-sizing:border-box} #gnb .btnGlobalSites ul{display:flex;justify-content:space-around;padding:0 15px} #gnb .btnGlobalSites li{text-align:center} #gnb .btnGlobalSites li span{display:block;font-size:11px;color:#989898} #gnb .btnGlobalSites .globalBizLink{margin:10px 15px 15px;} #gnb .btnGlobalSites .globalBizLink a{display:flex;align-items:center;justify-content:center;padding:8px 5px;background:#efefef} #gnb .btnGlobalSites .globalBizLink span{font-size:11px;color:#313131} #gnb .btnGlobalSites .globalBizLink strong{margin:0 5px 0 8px} /* Container */ /*.orange 추가*/ #header{position:fixed;left:0;top:0;right:0;height:50px;padding-top:12px;text-align:center;background-color:#00b6f0;z-index:100;box-sizing:border-box} #header.orange{background-color:#ff9900} #header.skyblue{background-color:#64d0f3} #header.white{background-color:#fff} #header.blue{background-color:#00b6f0} #header:after{content:'';display:block;clear:both} #header .logo{display:block;font-size:19px;color:#fff;font-weight:bold;box-sizing:border-box;} /* #1924 스페셜 로고, OPERATION-1924 */ #header.splogo .logo {position:relative;display:inline-block} #header .logo.ny span {position:absolute;display:block;width:100px;height:41.5px;font-size:0px;background:url(http://static.atomy.com/static/images/common/NewYear22_logo.png) no-repeat;background-size:100% auto;top:-25px;left:-50px;z-index:-1} #header.splogo .logo.ny strong {background:url(http://static.atomy.com/static/images/common/NewYear22_logo_sub.png) no-repeat 0 40%;background-size:58px auto;padding-left:62px;padding-top:5px;padding-bottom:5px;} #snow {position: absolute;top: -83px;width: 330px;height: 132px;overflow: hidden;left: -166px;zoom: .3;} /* 눈내리는 효과 */ .snowflake { position: absolute; display: block; position: absolute; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; -webkit-transform: translateZ(0); -moz-transform: translateZ(0); -ms-transform: translateZ(0); -o-transform: translateZ(0); transform: translateZ(0); -webkit-user-select: none; -moz-user-select: none; user-select: none; background-image: -webkit-radial-gradient( center, circle farthest-corner, rgba(255, 255, 255, 1) 40%, rgba(255, 255, 255, 0) 100% ); background-image: -moz-radial-gradient( center, circle farthest-corner, rgba(255, 255, 255, 1) 40%, rgba(255, 255, 255, 0) 100% ); background-image: radial-gradient( center, circle farthest-corner, rgba(255, 255, 255, 1) 40%, rgba(255, 255, 255, 0) 100% ); } #dialog header .btn, #header .btn{display:inline-block;position:absolute;z-index:110;width:auto;padding:10px;font:0/0 a} #header.popup{background-color:#fff;border-bottom:1px solid #c6c6c6} #header.popup .logo{color:#333} #header.popup.orange{background-color:#ff9900;border-bottom:none} #header.popup.skyblue{background-color:#64d0f3;border-bottom:none} #header.popup.blue{background-color:#00b6f0;border-bottom:none} #header.popup.orange .logo, #header.popup.skyblue .logo, #header.popup.blue .logo{color:#fff} #header.popup.orange .icon.close, #header.popup.skyblue .icon.close, #header.popup.blue .icon.close{background-position:-150px -25px} #header .count{display:inline-block;position:absolute;right:2px;top:3px;width:17px;height:17px;text-align:center;border-radius:50%;background-color:#f9a04f;color:#fff;font-size:11px;font-family:Arial, sans-serif;font-weight:bold;line-height:1;box-sizing:border-box; display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-box-align:center;-webkit-align-items:center;align-items:center; } #dialog .icon, #header .icon{display:inline-block;background-image:url('http://static.atomy.com/static/images/common/layout_sprite.png')} .btnMenu{left:5px;top:7px} .btnHome{left:5px;top:5px} .btnPrev{left:5px;top:7px} .btnClose{right:5px;top:5px} .btnSearch{right:50px;top:5px} .btnShop{right:5px;top:5px} .btnOffice{right:5px;top:5px} .btnCart{right:5px;top:5px} .btnFavorite{right:5px;top:5px} .btnShop{right:5px;top:2px} .btnAdd{right:5px;top:2px} .btnTreeSetting{left:5px;top:5px} .btnTreeColorGuide{left:48px;top:5px} .btnShare{right:5px;top:5px} .combination .icon{display:inline-block;text-align:center;background-image:url('http://static.atomy.com/static/images/common/layout_sprite01.png');background-repeat:no-repeat;background-size:360px auto;pointer-events:none} .combination .icon.btnMonth{width:23px;height:24px;background-position:-175px -85px} .combination .icon.btnDay{width:23px;height:24px;background-position:-205px -85px} .combination .icon.btnMonths{width:23px;height:24px;background-position:-175px -115px} .combination .icon.btnDays{width:23px;height:24px;background-position:-205px -115px} .combination .icon.btnEdit{width:27px;height:28px;background-position:-235px -85px} .combination .icon.dateY{width:6px;height:6px;background-position:-235px -70px} .combination .icon.benefitS{width:18px;height:18px;background-position:-235px -120px} .combination .icon.benefitH{width:18px;height:18px;background-position:-260px -120px} .combination .icon.semSuc{width:18px;height:18px;background-position:-275px -85px} .combination .icon.semOne{width:18px;height:18px;background-position:-300px -85px} .combination .icon.semLoc{width:18px;height:18px;background-position:-325px -85px} /*.orange 추가*/ #header.orange .icon{display:inline-block;background-image:url('http://static.atomy.com/static/images/common/layout_sprite01.png')} #header.orange .icon.shop{width:26px;height:29px;background-position:-260px -25px} #header .icon.menu{width:20px;height:17px;background-position:0 -25px} #header .icon.menu2{width:24px;height:18px;background-position:-225px 0} #header .icon.home{width:22px;height:21px;background-position:0 0} #header .icon.prev{ width:20px;height:16px;background-position:-75px -25px} #dialog .icon.close, #header .icon.close{width:17px;height:17px;background-position:-125px -25px} #header .icon.search{width:20px;height:21px;background-position:-25px -25px} #header .icon.office{width:28px;height:29px;background-position:-230px -25px} #header .icon.shop{width:26px;height:29px;background-position:-260px -25px} #header .icon.cart{width:28px;height:22px;background-position:-200px -25px} #header .icon.favorite{width:25px;height:21px;background-position:-100px -25px} #header .icon.treeSetting{width:24px;height:22px;background-position:-150px 0} #header .icon.treeColorGuide{width:24px;height:24px;background-position:-303px 0} #header .icon.plus{width:26px;height:26px;background-position:-175px -50px} #header .icon.share2{width:22px;height:23px;background-position:-275px 0} #header.searchSlide .icon.close{width:17px;height:17px;background-position:-150px -25px} #header.searchSlide .row.search .inputSearch input{height:35px;padding-right:39px;border:none} #header .header-title{float:left;padding-top:13px} #header .row.search{display:block;position:relative;margin-top:-4px;padding:0 15px 0 50px} #header .row.search .inputSearch{display:block} #header .row.search .inputSearch input{height:35px;padding-right:69px;border:none} #header .row.search .inputSearch input::-webkit-search-decoration, #header .row.search .inputSearch input::-webkit-search-cancel-button, #header .row.search .inputSearch input::-webkit-search-results-button, #header .row.search .inputSearch input::-webkit-search-results-decoration{display:none} #header .row.search .btnSearch{top:0;right:20px;width:30px;height:35px;padding:0} #header .row.search .btnSearch .icon.search{background-position:-50px -25px} #header .row.search .btnDelete{top:0;right:50px;width:29px;height:35px;padding:0} #header .row.search .icon.delete{width:17px;height:17px;border-radius:50%;background-color:#dcdcdc;background-image:none} #header .row.search .icon.delete:after{content:'';display:inline-block;width:6.5px;height:6.5px;margin-top:5.25px;background-size:360px auto;background-image:url('http://static.atomy.com/static/images/common/icon_sprite.png');background-position:-230px -25px} /* 검색 150615 */ #header.searchSlide .row.search{display:block;position:relative;margin-top:-4px;padding:0 50px 0 15px} #header.searchSlide .row.search .btnSearch{right:55px} #header.searchSlide .row.search .btnDelete{right:85px} .office #header{background-color:#64d0f3} .tree #header{background-color:#fff} .tree #header .btnLevel{position:relative;display:inline-block;padding-right:20px;font-weight:bold;font-size:20px;color:#333} .tree #header .btnLevel:after{content:'';display:inline-block;position:absolute;right:0;top:13px;border-left:4px solid transparent;border-right:4px solid transparent;border-bottom:0;border-top:5px solid #333;pointer-events:none} section.gate #header{padding:0 20px;height:60px} section.gate #header .logo{float:left;padding-top:10px} section.gate #header .logo a{display:block;width:51px;height:43px;overflow:hidden} section.gate #header .navMember{float:right} section.gate #header .groupBtn{float:right;padding-top:12px} section.gate #header .btn{display:inline-block;position:relative;padding-top:19px;vertical-align:middle} section.gate #header .btn + .btn{margin-left:15px} section.gate #header .btn:after{content:'';display:inline-block;position:absolute;left:50%;right:0;top:0;background-image:url('http://static.atomy.com/static/images/common/layout_sprite.png');background-repeat:no-repeat;background-size:360px auto} section.gate #header .btnLogin:after{width:17px;height:17px;margin-left:-8px;background-position:-25px 0} section.gate #header .btnJoin:after{width:15px;height:18px;margin-left:-8px;background-position:-50px 0} section.gate #header .btn span{color:#000;font-size:11px} .office #header, section.shop #header{text-align:center} #body{min-height:100%;padding-top:50px;box-sizing:border-box} #body.popup{background-color:#fff} #body.snbOn{padding-bottom:71px} #body.footerOn{padding-bottom:121px} #body.snbOn.footerOn{padding-bottom:181px} .container #body{padding-bottom:40px} #body .contents{min-height:100%} /* Footer */ .snbOn #footer{bottom:60px} #footer .fixContent{height:111px;padding-top:15px;color:#666;text-align:center;box-sizing:border-box;background-color:#e4e5e7;box-sizing:border-box} #footer nav{font-size:0} #footer nav a{position:relative;margin-left:10px;padding-left:10px;font-size:12px} #footer nav a:after{content:'';display:inline-block;position:absolute;left:0;top:2px;height:10px;border-left:1px solid #c9c9c9} #footer nav a:first-child{padding-left:0;margin-left:0} #footer nav a:first-child:after{content:none} #footer address{margin-top:7px;font-size:0} #footer address div span{position:relative;margin-left:5px;padding-left:5px;font-size:11px} #footer address div span:after{content:'';display:inline-block;position:absolute;left:0;top:1px;height:10px;border-left:1px solid #c9c9c9} #footer address div span:first-child{padding-left:0;margin-left:0} #footer address div span:first-child:after{content:none} #footer .copy{font-size:10px;margin-top:8px} #footer .copy span{font-family:verdana, Arial;color:#666!important} /* Gate Main */ .gateMain #header{height:50px;background-color:#fff;box-sizing:border-box} .gateMain #header .btnMenu{left:8px;top:6px} .gateMain #header .btns{position:absolute;right:16px;top:8px} .gateMain #header .btns span{position:relative;display:inline-block;margin-left:10px} .gateMain #header .btns span:after{content:'';display:inline-block;position:absolute;left:50%;top:0;background-image:url('http://static.atomy.com/static/images/common/layout_sprite.png');background-size:360px auto;background-repeat:no-repeat;} .gateMain #header .btns .login:after{width:16px;height:17px;margin-top:1px;margin-left:-8px;background-position:-25px 0} .gateMain #header .btns .logout:after{width:19px;height:17px;margin-left:-8px;margin-top:1px;background-position:-250px 0} .gateMain #header .btns .join:after{width:21px;height:19px;margin-left:-9px;background-position:-50px 0} .gateMain #header .btns span a{display:block;padding-top:22px;font-size:10px;color:#000;position:relative;z-index:1} .gateMain .preload{position:absolute;left:0;top:0;right:0;bottom:0} .gateMain .preload .item{height:100%} .gateMain .preload .item a{display:block;width:100%;height:100%} .gateMain .preload .verticalCenter{height:100%;min-height:inherit} .gateMain #body{padding:50px 0 55px} .gateMain #body .slider{padding-top:80.55555555555556%;overflow:hidden} .gateMain #body .slider .listSlide, .gateMain #body .slider .slick-list, .gateMain #body .slider .slick-track{height:100%} .gateMain #body .slider .slick-slide{padding-top:0} .gateMain #body .slider .item{text-align:center} .gateMain #body .slider .item a{height:100%;color:#fff;font-size:22px;background-repeat:no-repeat;background-size:cover;box-sizing:border-box} .gateMain #body .slider .item a.press, .gateMain #body .slider .item a:active{opacity:1} .gateMain #body .slider .item a .summary{opacity:1;-webkit-transition:opacity .2s;transition:opacity .2s} .gateMain #body .slider .item a:active .summary{opacity:.6} .gateMain #body .slider .item a .verticalCenter{height:100%;min-height:inherit} .gateMain #body .slider .item a .content{box-sizing:border-box} .gateMain #body .slider .item a .content .text{position:relative;padding-top:75px;padding-left:10px;padding-right:10px;line-height:1.3} .gateMain #body .slider .item a .content .text:after{content:'';display:inline-block;position:absolute;left:50%;top:0;width:65px;height:54px;margin-left:-33px;background-image:url('http://static.atomy.com/static/images/common/logo_white_129x108.png');background-size:65px auto;background-repeat:no-repeat} .gateMain #body .slider .item a .content .summary{display:inline-block;height:32px;margin-top:14px;font-size:14px;padding:4.5px 25px 0;border:2px solid #fff;border-radius:20px;box-sizing:border-box} .gateMain #body .slider .item.overview a{background-image:url('http://static.atomy.com/static/images/common/company.jpg')} .gateMain #body .slider .item.socialShare a{background-image:url('http://static.atomy.com/static/images/common/company_head_bg_05.jpg')} .gateMain #body .slider .item.seminars a{background-image:url('http://static.atomy.com/static/images/common/company_head_bg_08.jpg')} .gateMain #body .slider .item.vision a{background-image:url('http://static.atomy.com/static/images/common/company_head_bg_03.jpg')} .gateMain #body .slider .item.years a{background-image:url('http://static.atomy.com/static/images/common/years.png')} .gateMain #body .slider .item.years a .content .text:after{content:none} .gateMain #body .slider .indicator{text-align:right;padding-right:15px} .gateMain #body .slider .indicator li{bottom:0} .gateMain #body .slider .indicator li button{font:0/0 a;position:relative;bottom:25px;width:10px;height:10px;margin-left:3px;vertical-align:top;background-color:transparent;border:2px solid #fff;border-radius:50%;box-sizing:border-box} .gateMain #body .slider .indicator li.slick-active button, .gateMain #body .slider .indicator li.active button{background-color:#fff;border:none} .gateMain #nav{position:fixed;left:0;bottom:0;right:0} .gateMain #nav:after{content:'';display:block;clear:both} .gateMain #nav a{display:block;position:relative;float:left;width:50%;height:55px;padding:18px 0 0 20px;font-size:17px;color:#fff;background-color:#64d0f3;font-weight:bold;box-sizing:border-box} .gateMain #nav a:first-child{background-color:#00b6f0} .gateMain #nav a:after{content:'';display:inline-block;position:absolute;right:15px;top:22px;width:8px;height:13px;background-image:url('http://static.atomy.com/static/images/common/icon_sprite.png');background-position:-205px 0;background-size:360px auto;background-repeat:no-repeat} .gateMain .quick{display:table;width:100%;border-bottom:1px solid #e2e2e2} .gateMain .quick span{display:table-cell;width:33.3333%;text-align:center;box-sizing:border-box;vertical-align:top} .gateMain .quick span:first-child a{ border-left:none} .gateMain .quick span a{display:table;position:relative;width:100%;height:115px;padding-top:78px;font-size:14px;color:#333;border-left:1px solid #e2e2e2;background-color:#fff;box-sizing:border-box} .gateMain .quick span a:after{content:'';display:inline-block;position:absolute;left:50%;top:19px;background-image:url('http://static.atomy.com/static/images/common/icon_gate_main.png');background-size:360px auto;background-repeat:no-repeat;pointer-events:none} .gateMain .quick .marketing a:after{width:39px;height:49px;margin-left:-20px;background-position:0 0} .gateMain .quick .seminar a:after{width:39px;height:50px;margin-left:-20px;background-position:-50px 0} .gateMain .quick .onair a:after{width:53px;height:51px;margin-left:-26.5px;background-position:-100px 0} .gateMain .quick span a .title{ display:table-cell;height:37px;padding:0 2px;font-weight:400;line-height:1.1;vertical-align:middle;} .gateMain .row.info{display:table;width:100%;table-layout:fixed;background-color:#f1f2f4} .gateMain .row.info h2{margin-bottom:4px;font-size:13px;color:#333} .gateMain .row.info h2 a{display:block;font-size:13px;color:#333} .gateMain .row.info section{display:table-cell;box-sizing:border-box} .gateMain .row.info .notice{width:66%;padding:20px} .gateMain .row.info .notice .content li{height:20px;white-space:nowrap} .gateMain .row.info .notice .content li a{display:inline-block;max-width:100%;height:20px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12px;color:#666;} .gateMain .row.info .notice .content li.new{position:relative;padding-right:20px} .gateMain .row.info .notice .content li.new:after{content:'';display:inline-block;width:16px;height:16px;margin-top:3px;vertical-align:top;background-image:url('http://static.atomy.com/static/images/common/icon_new.png');background-repeat:no-repeat;background-size:360px auto;background-position:0 0} .gateMain .row.info .happyCenter{width:34%;padding:20px 0} .gateMain .row.info .happyCenter .tel{font-size:20px;color:#00b6f0;line-height:1.2} .gateMain .row.info .happyCenter .mail{font-size:12px;color:#00b6f0;line-height:1.2} .gateMain .row.info .happyCenter .fax{font-size:14px;color:#00b6f0;line-height:1.2} .gateMain .row.info .happyCenter .ChatSupport a{display:block} .gateMain .row.info .happyCenter .ChatSupport span{display:block;line-height:38px;font-size:13px;color:#333;background:url('http://static.atomy.com/static/images/common/button_talk.png') no-repeat 0 50%;background-size:37px auto;padding-left:45px} .gateMain .row.info .happyCenter .infobox{padding-right:15px} .gateMain .row.info .happyCenter .infobox .info{font-size:12px;color:#666;line-height:1.5} .gateMain .row.info .happyCenter .infobox .infoB{font-size:12px;color:#666;font-weight:bold;line-height:1.5} .gateMain .row.info .happyCenter .infobox .infoB2{font-size:12px;color:#666;font-weight:bold;line-height:1.5;margin-top:7px} /* Shop,Office */ .shop #footer .fixFoot{position:absolute;background-color:#e4e5e7} .shop .snbOn #footer .fixFoot{bottom:61px;height:45px;text-align:center;box-sizing:border-box} /* 임시 */ /* Tab Bar (SNB) */ #snb{position:fixed;left:0;bottom:0;right:0;z-index:100;display:table;width:100%;background-color:#fff;border-top:1px solid #e1e1e6} #snb span{display:table-cell;width:20%;text-align:center} #snb span a{position:relative;display:block;height:60px;padding-top:38px;font-size:10px;box-sizing:border-box} #snb span a:active, #snb span.active a{color:#06a7e2} #snb span a:after{content:'';display:block;position:absolute;left:50%;top:14px;background-image:url('http://static.atomy.com/static/images/common/layout_sprite.png');background-size:360px auto;background-repeat:no-repeat} #snb.officeSnb span a:active, #snb.officeSnb span.active a{color:#64d0f3} #snb.officeSnb span a:after{background-image:url('http://static.atomy.com/static/images/common/layout_sprite01.png')} #snb .home a:after{width:22px;height:22px;margin-left:-11px;background-position:0 -50px} #snb .order a:after{width:20px;height:21px;margin-left:-10px;background-position:-25px -50px} #snb .shiping a:after{width:32px;height:20px;margin-left:-16px;background-position:-50px -50px} #snb .balance a:after{width:25px;height:22px;margin-left:-12px;background-position:-85px -50px} #snb .cart a:after{width:23px;height:20px;margin-left:-12px;background-position:-125px -50px} #snb .cart .count{line-height:1;position:absolute;left:50%;top:50%;z-index:1;min-width:17px;width:auto;height:17px;padding:0 2px;text-align:center;border-radius:50%;background-color:#f9a04f;color:#fff;font-size:11px;font-family:Arial, sans-serif;font-weight:bold;box-sizing:border-box;margin:-26px 0 0 4px; display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-box-align:center;-webkit-align-items:center;align-items:center; } #snb .tree a:after{width:23px;height:21px;margin-left:-11px;background-position:-25px -100px} #snb .benefit a:after{width:23px;height:21px;margin-left:-11px;background-position:-50px -100px} #snb .lowerSales a:after{width:26px;height:22px;margin-left:-12.5px;background-position:-75px -100px} #snb .mySchedule a:after{width:20px;height:21.5px;margin-left:-10px;background-position:-125px -100px} #snb .record a:after{width:23px;height:21px;margin-left:-12px;background-position:-50px -150px} #snb .notice a:after{width:24px;height:19px;margin-left:-12px;background-position:-75px -150px} #snb .home a:active:after, #snb .home.active a:after{background-position:0 -75px} #snb .order a:active:after, #snb .order.active a:after{background-position:-25px -75px} #snb .shiping a:active:after, #snb .shiping.active a:after{background-position:-50px -75px} #snb .balance a:active:after, #snb .balance.active a:after{background-position:-85px -75px} #snb .cart a:active:after, #snb .cart.active a:after{background-position:-125px -75px} #snb .tree a:active:after, #snb .tree.active a:after{background-position:-25px -125px} #snb .benefit a:active:after, #snb .benefit.active a:after{background-position:-50px -125px} #snb .lowerSales a:active:after, #snb .lowerSales.active a:after{background-position:-75px -125px} #snb .mySchedule a:active:after, #snb .mySchedule.active a:after{background-position:-125px -125px} #snb .record a:active:after, #snb .record.active a:after{background-position:-50px -175px} #snb .notice a:active:after, #snb .notice.active a:after{background-position:-75px -175px} /* gnb */ .nav_lang_en_us #gnb .myPage li.notice a{letter-spacing:-1px} .nav_lang_en_us #gnb .myPage li.low a, .nav_lang_en_us #gnb .myPage li.benefit a, .nav_lang_en_us #gnb .myPage li.delivery a{line-height:12px;padding-top:43px} .nav_lang_en_us #gnb .myPage li.cart a{line-height:12px;} .nav_lang_en_us #snb span a{line-height:18px} .nav_lang_en_us #snb span.benefit a, .nav_lang_en_us #snb span.lowerSales a{line-height:9px;top:-5px} /* 가로모드 (iPhone4 기준이상) */ @media screen and (min-width:480px){ .nav_lang_en_us #gnb .myPage li.notice a{letter-spacing:0 !important} .nav_lang_en_us #gnb .myPage li.low a, .nav_lang_en_us #gnb .myPage li.benefit a, .nav_lang_en_us #gnb .myPage li.delivery a, .nav_lang_en_us #gnb .myPage li.cart a{line-height:45px !important;padding-top:35px !important} } /* Nexus 5X ~ */ @media screen and (min-width:412px){ /*.nav_lang_en_us #gnb .myPage li.delivery a{line-height:45px !important;padding-top:35px !important} .nav_lang_en_us #gnb .myPage li.cart a{line-height:45px !important;padding-top:35px !important}*/ } .nav_lang_es_mx #gnb .info.nonmember .btns .btn{min-width:90px;width:auto;padding:0 10px;} /*간편가입 버튼 공통 CSS*/ #btnCreateURL, #copyURL {line-height:1.1em} @charset "UTF-8"; /* section */ .block{display:block} .noScroll, .noScroll #container{overflow:hidden} body.white{background-color:#fff} #body.pb70{padding-bottom:70px} .margin{padding:0 15px} .margin2{margin-top:15px;padding:0 15px} .margin.sides{margin-top:15px;margin-bottom:15px} .marginTB{margin:10px 0 10px} .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} .selStyle{margin:20px 0 10px;float:right;width:50%;} .flexBetweenTop{display:flex;align-items:flex-start;justify-content:space-between} .flexBetweenCenter{display:flex;align-items:center;justify-content:space-between} .flex-1{flex:1} .vtTop{vertical-align:top !important} .fleft{float:left} .fright{float:right} .w75p{width:72%} .w25p{width:24%;overflow:hidden;padding-top:10px;} .w100p{width:100%} .clear {clear:both} .wordbk{word-break:break-all} .wordbw{word-break:break-word} .bdl{border-left:1px solid #e2e2e2 !important} .bdb0{border-bottom:0 !important} .tblFix{table-layout:fixed !important} /* 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('http://static.atomy.com/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} .img img{width:auto;max-width:100%} /* 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} .title.line{border-bottom:1px solid #707780} .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} .lineH120p{line-height:120%} .lineH13 {line-height:1.3} /* 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} .bullet.primary02{color:red} .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 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} .pt0{padding-top:0px !important} .pt10{padding-top:10px !important} .pb10{padding-bottom:10px !important} .pb70{padding-bottom:70px !important} .pb80{padding-bottom:80px !important} .pb100{padding-bottom:100px !important} .pl10{padding-left:10px !important} .pr10{padding-right:10px !important} .pd0{padding:0 !important} .pl0{padding-left:0 !important} .pr0{padding-right:0 !important} .ptb5{padding-top:5px;padding-bottom:5px} .p5{padding:5px} .p10{padding:10px} .p15{padding:15px} .mt5{margin-top:5px !important} .mt6{margin-top:6px !important} .mt10{margin-top:10px !important} .mt15{margin-top:15px !important} .mt20{margin-top:20px !important} .mt30{margin-top:30px !important} .mt100{margin-top:100px !important} .mb5{margin-bottom:5px !important} .mb10{margin-bottom:10px !important} .mb15{margin-bottom:15px !important} .mb20{margin-bottom:20px !important} .mb30{margin-bottom:30px !important} .mb70{margin-bottom:70px !important} .ml5{margin-left:5px !important} .ml10{margin-left:10px !important} .ml20{margin-left:20px !important} .ml45{margin-left:45px !important} .mr10{margin-right:10px !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} /* Input */ .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} .checkboxWrap{display:flex;flex-wrap:wrap} .checkboxWrap .checkboxItem{flex:0 1 33.33%;margin-bottom:5px} /* topButton */ .btnTop{display:inline-block;position:fixed;right:10px;bottom:70px;width:50px;height:50px;font:0/0 a;background-image:url('http://static.atomy.com/static/images/common/button_top.png');background-position:0 0;background-size:50px auto;background-repeat:no-repeat;z-index:1} .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 */ /*OP-16177 챗봇*/ .cart ~ .fixBottomBtn, .favorite ~ .fixBottomBtn {bottom: 140px} .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('http://static.atomy.com/static/images/common/button_talk.png');background-position:0 0;background-size:50px auto;background-repeat:no-repeat} .company .fixBottomBtn{bottom:10px} /*visual studio bottom 마크 삭제*/ #bl-root{display:none} /* 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%} .textRedBoldImp {color: #ff0000!important;font-weight:bold} /*OP-6601*/ .btnRedImp {background-color: #ff0000!important} /*OP-6601*/ .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;border:0;} .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.etc04{color:#fff;background-color:#7fdaf7;border-radius:2px} .btn.secondary{color:#fff;background-color:#64d0f3;} .btn.third{color:#fff;background-color:#336699} .btn.pd0{padding:0 !important} .btncopy{background:#858585 !important;color:white !important} 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;color:#fff;} .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.mdPd10{height:40px;padding:0 10px;line-height:40px;font-size:14px} .btn.md100{width:100%;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} .btn.lg02{height:50px;line-height:50px;font-size:18px;font-weight:bold;letter-spacing: -0.01em;} .btn.mx{padding:0 15px;line-height:40px;font-size:14px} .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} /* icon */ .icon{display:inline-block;font:0/0 a;text-align:center;background-image:url('http://static.atomy.com/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('http://static.atomy.com/static/images/common/icon_sprite.png');background-position:-195px 0} .icon.arrowRight2{width:5px;height:9px;background-image:url('http://static.atomy.com/static/images/common/icon_sprite.png');background-position:-115px 0} .icon.arrowRight3{width:5px;height:9px;background-image:url('http://static.atomy.com/static/images/common/icon_sprite.png');background-position:-125px 0} .icon.arrowBottom{width:8px;height:5px;background-image:url('http://static.atomy.com/static/images/common/icon_sprite.png');background-position:-150px 0} .icon.arrowBottom2{width:8px;height:5px;background-image:url('http://static.atomy.com/static/images/common/icon_sprite.png');background-position:-150px -10px} .icon.arrowBottom3{width:8px;height:5px;background-image:url('http://static.atomy.com/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('http://static.atomy.com/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('http://static.atomy.com/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('http://static.atomy.com/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('http://static.atomy.com/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('http://static.atomy.com/static/images/common/layout_sprite.png');} .icon.search2{width:20px;height:21px;background-position:-50px -25px;background-image:url('http://static.atomy.com/static/images/common/layout_sprite.png');} .icon.soldOut{background-image:url('http://static.atomy.com/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.comSoon{background-image:url('http://static.atomy.com/static/images/common/icon_comsoon01.png');background-repeat:no-repeat;background-size:360px auto} .icon.comSoon.sm{width:44px;height:30px;margin-top:29px;background-position:0 0} /* comming soon 추가 */ .icon.comSoon.md{width:83px;height:52px;background-position:-72px 0} /* comming soon 추가 */ .icon.comSoon.lg{width:117px;height:180px;background-position:-171px 111px;} /* comming soon 추가 */ .icon.soldOut01{background-image:url('http://static.atomy.com/static/images/common/icon_soldout01.png');background-repeat:no-repeat;background-size:360px auto} /*OP-7068*/ .icon.soldOut01.sm{width:64px;height:40px;margin-top:18px;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.soldOutTHH.sm{width:64px;height:40px;margin-top:29px;background-position:0 0} .icon.soldOutTHH.md{width:83px;height:52px;background-position:-72px 0} .icon.soldOutTHH.lg{width:101px;height:63px;background-position:-171px 0} .icon.soldOutTHC.sm{width:64px;height:40px;margin-top:29px;background-position:0 0} .icon.soldOutTHC.md{width:83px;height:52px;background-position:-72px 0} .icon.soldOutTHC.lg{width:101px;height:63px;background-position:-171px 0} .icon.soldOutTHH2.sm{width:64px;height:40px;margin-top:29px;background-position:0 0} .icon.soldOutTHH2.md{width:83px;height:52px;background-position:-72px 0} .icon.soldOutTHH2.lg{width:101px;height:63px;background-position:-171px 0} .icon.soldOutTHC2.sm{width:64px;height:40px;margin-top:29px;background-position:0 0} .icon.soldOutTHC2.md{width:83px;height:52px;background-position:-72px 0} .icon.soldOutTHC2.lg{width:101px;height:63px;background-position:-171px 0} .icon.sellOut01{background-image:url('http://static.atomy.com/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('http://static.atomy.com/static/images/common/icon_sprite.png')} .icon.new{width:40px;height:40px;background-image:url('http://static.atomy.com/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('http://static.atomy.com/static/images/common/icon_sprite.png')} .icon.file.sm{background-position:-50px -25px} .icon.prev2{background-image:url('http://static.atomy.com/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('http://static.atomy.com/static/images/common/layout_sprite.png')} .icon.refresh{width:20px;height:21px;background-image:url('http://static.atomy.com/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('http://static.atomy.com/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('http://static.atomy.com/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('http://static.atomy.com/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('http://static.atomy.com/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('http://static.atomy.com/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('http://static.atomy.com/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('http://static.atomy.com/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('http://static.atomy.com/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('http://static.atomy.com/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('http://static.atomy.com/static/images/common/icon_sns.png')} .icon.sns.kakao{background-position:0 0} .icon.sns.band{background-position:-45px 0} .icon.sns.fb{background-position:-90px 0} .icon.sns.tw{background-position:-134px 0} .icon.sns.url{background-position:-180px 0} .icon.sns.whatsapp{background-position:-225px 0} .icon.sns.line{background-position:-270px 0} .icon.sns.instagram{background-position:-44px -44px} .icon.treeguide{width:42.5px;height:23px;background-image:url('http://static.atomy.com/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('http://static.atomy.com/static/images/common/icon_facebook.png')} .icon.sm.sns.band{background-image:url('http://static.atomy.com/static/images/common/icon_band.png')} .icon.sm.sns.ig{background-image:url('http://static.atomy.com/static/images/common/icon_instagram.png')} .icon.sm.sns.whats {background-image: url('http://static.atomy.com/static/images/common/icon_whatsApp.png')} .icon.large{background-image:url('http://static.atomy.com/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('http://static.atomy.com/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('http://static.atomy.com/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.card.abamobilepay{width:32px;height:32px;background-image:url('http://static.atomy.com/static/images/common/aba-logo.png');background-size:25px auto;background-position:50% 2px} /*OP-4884*/ .icon.card.khqr{width:35px;height:32px;background-image:url('http://static.atomy.com/static/images/common/khqr_logo.png');background-size:35px auto;background-position:50% 7px} .icon.official{width:15px;height:15px;vertical-align:middle;margin-top:-2px;background-size:100% auto} .icon.official.instagram{background-image:url('http://static.atomy.com/Static/images/common/icon_instagram.png')} .icon.official.facebook{background-image:url('http://static.atomy.com/Static/images/common/icon_facebook.png')} .icon.social{width:20px;height:20px;vertical-align:middle;margin-top:-2px;background-size:200px auto;background-image:url('http://static.atomy.com/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} .icon.social.youtube{background-position:-165px 0} .icon.social.tiktok{background-image:url('http://static.atomy.com/Static/images/common/icon_tiktok.png');background-size:20px auto;background-position:0 0;} .icon.social.newfacebook{background-image:url('http://static.atomy.com/Static/images/common/fbook40.png');background-size:100% auto;background-position:0 0;} .icon.social.newinstagram{background-image:url('http://static.atomy.com/Static/images/common/istar40.png');background-size:100% auto;background-position:0 0;} .icon.dsas{width:41px;height:20px;vertical-align:middle;margin-top:-2px;background-size:100% auto;background-image:url('http://static.atomy.com/Static/images/common/icon_dsas.png')} .icon.question{width:23px;height:23px;background-position:-150px -50px;background-image:url('http://static.atomy.com/static/images/common/icon_sprite.png')} .icon.fam{width:44px;height:44px;background-image:url('http://static.atomy.com/Static/images/common/icon_family.png');background-size:360px auto} .icon.famCH{background-position:0 0} .icon.famTicket{background-position:-60px 0} .icon.famAZA{background-position:-120px 0} .icon.famAir{background-position:-180px 0} .icon.famATG {background-position: -240px 0;} .icon.logoAtomy{width:21px;height:11px;background-image:url('http://static.atomy.com/Static/images/common/logo_lnb_family.png');background-size:100% auto} .icon.noticeInfo{width:70px;height:70px;background-image:url('http://static.atomy.com/Static/images/common/icon_notice.png');background-size:100% auto} /* stateFlag */ .stateFlag{display:inline-block;width:18px;height:18px;background-image:url('http://static.atomy.com/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('http://static.atomy.com/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('http://static.atomy.com/static/images/common/icon_sprite.png');background-repeat:no-repeat;background-size:360px auto} /* Input Search */ input[type='search']{padding-right:35px;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.bottom{margin-bottom:50px} .row.btns.margin{padding:0 15px;margin:15px 0} .row.btns.margin5{margin-top:5px;margin-bottom:10px} .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: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('http://static.atomy.com/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('http://static.atomy.com/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.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} .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 .col30{position:relative;display:table-cell;width:30%} .filterSet .row.period .col.dash{width:6%;text-align:center;vertical-align:middle} .filterSet .row.period .col input[type='date']{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} .filterSetPadding{padding-left:4px} /* 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} .tab.type4{padding:17px 11.5px 15px;background-color:#f6f6f8;box-sizing:border-box} .tab.type4 span{width:auto;padding:0 4.5px} .tab.type4 span a{color:#666;background-color:#fff;border:1px solid #c6c6c6;border-radius:3px} .tab.type4 span.active a{color:#fff;background-color:#71777f;border-color:#71777f;} .tab.type4 span.active a:after{content:none} .tab.type4 span.disabled a, .tab.type4 span a:disabled{opacity:.5;pointer-events:none} /* multi line */ .tab.type5{white-space:normal;box-sizing:border-box;background-color:transparent;box-shadow:none} .tab.type5:after{display:none} .tab.type5 span{padding-bottom:0;vertical-align:middle;border:1px solid #707780} .tab.type5 span:first-child{border-radius:2px 0 0 2px} .tab.type5 span:last-child{border-radius:0 2px 2px 0} .tab.type5 span a{height:auto;padding:10px;line-height:1.5;color:#707780;font-size:13px} .tab.type5 span.active{background-color:#707780} .tab.type5 span.active a{background-color:transparent;color:#fff} .tab.type5 span.active a:after{content:none} .qna .tab.type5, .qnaWrite .tab.type5,.qnaList .tab.type5{padding:15px} .dialog.qna .tab.type5, .dialog.qna .qnaWrite .tab.type5, .dialog.qna .qnaList .tab.type5{padding:15px} .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 tbody th{background-color:#f6f6f8} .table.view tbody th, .table.view tbody td{vertical-align:middle;word-wrap:break-word;word-break:break-all} .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 .inrow th, .table .inrow td{vertical-align:top !important;padding-top:0 !important;} .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.cell3{display:table;width:100%} .table .row.cell3 .col{display:table-cell;width:32%;padding-left:2%} .table .row.cell3 .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: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;} .table-center tbody th, .table-center tbody td{text-align:center} /* Board */ .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;word-break:break-all} .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 > li .head.hghauto .jpru{word-spacing:-7px;letter-spacing:-6px} .board .list > li .head.hghauto .jpkg{word-spacing:-7px;letter-spacing:-4px} .board .list > li .head.hghauto .jpkz{letter-spacing:-0.01em} .board .list.white > li .head {background-color: #fff;border-bottom: 1px solid #e2e2e2} .board .list2{border-top:1px solid #707780;} .board .list2 > li{padding:15px 0;border-bottom:1px solid #e2e2e2} .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;overflow:hidden;white-space:nowrap;text-overflow:ellipsis} .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;word-break:break-all} .reviews .board .list > li .content h2{font-size:14px;color:#333} .seminarInfo .recommend{font-size:14px;color:#333} .seminarInfo .recommend .btn{position:relative;margin-top:10px;text-align:left} .seminarInfo .recommend .btn .arrowRight{position:absolute;right:15px;top:50%;background-position:-195px -10px;transform:translateY(-50%)} .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 header{padding:15px} .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 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('http://static.atomy.com/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('http://static.atomy.com/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('http://static.atomy.com/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 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('http://static.atomy.com/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('http://static.atomy.com/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 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('http://static.atomy.com/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 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('http://static.atomy.com/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{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.benefitS{float:right} .schedule .table tbody td.selectDays{display:inline-block;width:100%;border:2px solid #ff9900} .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.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('http://static.atomy.com/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 .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('http://static.atomy.com/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('http://static.atomy.com/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 h1.smTitle{font-size:15px;padding:5px 20px 0 0;} .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} /*OP-8949 change.center */ .office_kh .dialog.page .layout header h1{font-size:18px;} .office_kh .findCenter .table{word-break:break-all} .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 #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('http://static.atomy.com/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} .dialog.tooltip .body{padding:15px;text-align:left} .dialog.tooltip .body .title{font-size:15px;color:#000;font-weight:bold} .dialog.tooltip .body img{width:auto;max-width:100%} .dialog.tooltip .body hr{margin:12px 0 14px} .office_au .dialog.tooltip .body {max-height:70vh;overflow-y:scroll} /* 사라지는 팝업 */ .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.fixed{position:fixed} .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('http://static.atomy.com/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;overflow:hidden} .dialog.cart .body .info .thumb img {max-height:100%} .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 .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;width:25px;letter-spacing:-0.25px} .lower .list li .added span:not(:last-child){margin-right: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('http://static.atomy.com/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 .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;background:url('http://static.atomy.com/static/images/common/thumb_default_1.png') no-repeat;background-size:100% auto} .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('http://static.atomy.com/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('http://static.atomy.com/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 .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('http://static.atomy.com/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} .findCenter .search p.searchset{display:table;table-layout:fixed;position:relative;width:100%;box-sizing:border-box;margin-top:0} .findCenter .search span.selsize{width:35%} .findCenter .search .insize{width:63%;margin-left:5px} .findCenter .search .rPadding{padding-right:10px} /* 이용약관 */ .noDrag {-webkit-user-select:none !important;-moz-user-select:-moz-none !important;-ms-user-select:none !important;user-select:none !important;} .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:6px} .dialog.agreement .body section .list > li:first-child{margin-top:0} .dialog.agreement .body section .table{margin:5px 0 10px;table-layout:fixed} .dialog.agreement .body section .table .center{text-align:center;} .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('http://static.atomy.com/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('http://static.atomy.com/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('http://static.atomy.com/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.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('http://static.atomy.com/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} /* 파일인풋 */ .file .preview .name{word-break:break-all} .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%} .ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next{top:10px} /* #4632 */ .seminarInfo .tabContent .recommend{font-size:14px;color:#333} .seminarInfo .tabContent .recommend p{line-height:1.5} .seminarInfo .tabContent .recommend .btn{position:relative;margin-top:10px;text-align:left} .seminarInfo .tabContent .recommend .btn .arrowRight{position:absolute;right:15px;top:50%;background-position:-195px -10px;transform:translateY(-50%)} /* 테이블 가로 스크롤 */ .tableScroll{overflow-x:auto;overflow-y:hidden} .tableScroll table{width:738px} /* 1:1친절상담 */ .dialog.qnaLogin .body{padding:15px;text-align:left} .dialog.qnaLogin .body .title{font-size:15px;color:#000;font-weight:bold} .dialog.qnaLogin .body hr{margin:12px 0 14px} .dialog.qnaLogin .body .btn{min-width:75px;margin:0 5px} .dialog.qnaLogin.qnaTxtLong .body .btn{margin:0;font-size:12px;padding:0 10px;line-height:38px} .dialog.qnaLogin .dialogClose{right:35px;top:34px;background-image:url('http://static.atomy.com/static/images/common/icon_sprite.png');background-position:-270px -25px} .dialog.qna .box.primary.guide{padding:10px;margin-bottom:10px;font-size:13px;text-align:center} .dialog.qna .row.btns.margin{padding-left:0;padding-right:0} .dialog.qna .noData.bubble{margin:50px 0} .dialog.qna .tab, .dialog.qna .qnaWrite .tab, .dialog.qna .qnaList .tab{padding:15px 35px} .dialog.qna .tabContent{margin-top:0} .dialog.qna .row.tel .col.check:first-of-type{width:25px;padding-right:5px;} .dialog.qna .titSM{font-size:14px !important;padding-top:3px} .dialog.qna .qnaList .board .bullet{margin-bottom:5px} .dialog.qna .qnaList .board .list4{margin-top:10px} .dialog.qna .qnaList .board .list4 li{background-color:#fff} .dialog.qna .qnaList .board .list4 li .head{padding:14px 15px 11px} .dialog.qna .qnaList .board .list4 li .head .state{display:inline-block;height:17px;margin-right:3px;padding:1px 3px 0;border:1px solid #8d959f;font-size:11px;color:#8d959f;box-sizing:border-box} .dialog.qna .qnaList .board .list4 li .head .state.primary{border:1px solid #00b6f0;color:#00b6f0} .dialog.qna .qnaList .board .list4 li .head button{text-align:left} .dialog.qna .qnaList .board .list4 li .head button p{margin-top:6px;vertical-align:top;font-size:14px;color:#333;word-wrap:break-word;word-break:break-all} .dialog.qna .qnaList .board .list4 li .head button .title{line-height:1;vertical-align:top} .dialog.qna .qnaList .board .list4 li .head button .icon.new{vertical-align:top;-webkit-transform:translateY(-2px);transform:translateY(-2px)} .dialog.qna .qnaList .board .list4 li .head button time{font-size:12px;color:#999} .dialog.qna .qnaList .board .list4 li .content{display:none;position:relative;padding:0 15px 35px;border-top:1px solid #e2e2e2;font-size:13px;color:#666;background-color:#f1f2f4} .dialog.qna .qnaList .board .list4 li.active .content{display:block} .dialog.qna .qnaList .board .list4 li .content > div{position:relative;padding:15px 0 10px 28px} .dialog.qna .qnaList .board .list4 li .content > div:after{content:'';display:inline-block;position:absolute;left:0;top:14px;width:20px;height:20px;background-image:url('http://static.atomy.com/static/images/common/icon_sprite.png');background-repeat:no-repeat;background-size:360px auto} .dialog.qna .qnaList .board .list4 li .content .question{min-height:20px;padding-bottom:15px;word-wrap:break-word;word-break:break-all} .dialog.qna .qnaList .board .list4 li .content .question:after{background-position:-70px -25px} .dialog.qna .qnaList .board .list4 li .content .answer{padding-top:15px;border-top:1px solid #e2e2e2;word-wrap:break-word;word-break:break-all} .dialog.qna .qnaList .board .list4 li .content .answer:after{background-position:-95px -25px} .dialog.qna .qnaList .board .list4 li .content .image{margin-top:15px;border:1px solid #e2e2e2} .dialog.qna .qnaList .board .list4 li .content .zip, .dialog.qna .qnaList .board .list4 li .content .pdf{margin-top:15px} .dialog.qna .qnaList .board .list4 li .content button{position:absolute;right:15px;bottom:20px;font-size:13px;color:#7f8792} .dialog.qna .qnaList .board .list4 li .content button .icon{vertical-align:text-top} .dialog.qna .qnaWrite .box.primary{padding:15px;font-size:14px} .dialog.qna .qnaWrite .box.primary a{display:block} .dialog.qna .qnaWrite .write{margin-top:15px} .dialog.qna .qnaWrite .write textarea{height:250px;margin-top:10px} .dialog.qna .qnaWrite .write .fileControls{height:30px;margin-top:5px;margin-bottom:10px;padding-left:10px} .dialog.qna .qnaWrite .write .fileControls > span{vertical-align:sub} .dialog.qna .qnaWrite .write .fileControls .btnFile{margin-left:39px} .dialog.qna .qnaWrite .write .fileControls .btnFile label{font-size:13px;line-height:30px;display:block;height:30px;padding:0 15px} .dialog.qna .qnaWrite .write .bullet{margin-top:10px} .dialog.qna .qnaWrite .table{margin-top:10px;border-top:1px solid #e2e2e2} .dialog.qna .qnaWrite .list2 li{position:relative;display:flex;justify-content:space-between;align-items:center;padding:7px 0 7px 30px} .dialog.qna .qnaWrite .list2 li .checkbox{position:absolute;left:0;top:10px} .dialog.qna .qnaWrite .list2 li .btn{white-space:nowrap} .dialog.qna .qnaWrite .table.checkSendable tbody th {padding:10px;vertical-align:initial} .dialog.qna .qnaWrite .table.checkSendable tbody label{font-size:12px;vertical-align:top} /* 간편구매 상품검색 - NZ 처음 적용*/ .dialog.findProduct .row.btns .btn.primary .icon {margin: -3px 4px 0 0; vertical-align: middle;} .dialog.findProduct .searchResult .productId {position: relative; min-height: 30px; overflow: hidden;} .dialog.findProduct .searchResult .productId a {position: absolute; left: 0; top: 0; bottom: 0; right: 0; line-height: 30px; z-index: 1;} .dialog.findProduct .searchResult .productId .btn {float: right;} /* 회원가입 변경 - OP-1003 CA */ .txtRed{color:#e02d2d} .fs12{font-size:12px} .mt8{margin-top:8px} .marketingMessages02{padding:10px 0 15px;color:#333} /* Password LoginBox */ /*로그인*/ .pw_wrap {position: relative;} .login .pw_wrap {margin-bottom:10px;} .pw_wrap input[type='text'], .pw_wrap input[type='password']{margin-bottom:0 !important;padding-right:40px;} .pw_wrap .eye_btn{display:inline-block;position: absolute;right: 0;top: 0;bottom:0;width:40px;cursor:pointer;background:url(http://static.atomy.com/static/images/common/eye_icon.png) 50% 50% no-repeat;background-size:32px auto} .pw_wrap .eye_btn.active{background:url(http://static.atomy.com/static/images/common/hidden_eye_icon.png) 50% 50% no-repeat;background-size:32px auto} .pw_wrap .eye_btn span{display:none} /*정보수정*/ .password .entry .pw_wrap2 div.eye_btn {margin-bottom:0;} /*.pw_wrap2 .eye_btn{top: -4px}*/ /*임시*/ .pw_wrap_s input[type=password] {padding: 4px;} .office_ph .pw_wrap.pw_wrap_s .eye_btn{right: 2px;top: 6px;width:30px;height:28px;background-size:28px auto} .pw_wrap.pw_wrap_s .eye_btn{right: 2px;top: 6px;width:30px;height:28px;background-size:28px auto} .findPassword input[type="tel"]:disabled {background-color: #efefef;} .office_ph .row.pw_wrap.pw_wrap_s .eye_btn{right: 2px;top: 6px;width:30px;height:28px;background-size:28px auto} /* OP-8898 - RU 키르기회원 센터배송선택*/ .popCenterSelect {background-color: #f6f6f8 !important;} .selectInfoList li{padding:15px;margin-bottom:15px;background: #fff;margin-bottom:10px;} .selectInfoList table {border-top:1px solid #c9c9c9;} .selectInfoList th, .selectInfoList td{padding:0 10px;color:#333;vertical-align:middle;word-wrap:break-word;word-break:break-all;border-bottom:1px solid #e2e2e2;line-height:1.2;font-size:14px} .selectInfoList th{background-color:#f6f6f8;color:#010101;height:45px;word-break: break-word;} .selectInfoList .btnCenter{display:block;width:100%;border:1px solid #00b6f0 ;color:#00b6f0;margin-top:10px} /* 계보도 색상 안내 */ .dialog.treeColorGuide .body{padding:40px 15px;} .dialog.treeColorGuide .colorGuide{border-top:1px solid #707780;border-bottom:1px solid #707780;} .dialog.treeColorGuide .colorGuide ul{padding:0 10px;} .dialog.treeColorGuide .colorGuide li{position: relative;padding:15px 5px 15px 45px;font-size:14px;color:#333;border-top:1px solid #e2e2e2;} .dialog.treeColorGuide .colorGuide li:first-child{border-top: none;} .dialog.treeColorGuide .colorGuide .colorChip{position:absolute;left:10px;top:15px;display:inline-block;width:22px;height:20px;} .dialog.treeColorGuide .colorGuide .colorChip.green{background-color:#33B573;} .dialog.treeColorGuide .colorGuide .colorChip.blue{background-color:#4C86E6;} .dialog.treeColorGuide .colorGuide .colorChip.orange{background-color:#F38E28;} .dialog.treeColorGuide .colorGuide .colorChip.gray{background-color:#D9D9D9;} .dialog.treeColorGuide .colorGuide .colorChip.purple{background-color:#9E76F2;} /* OP-12038 합포 프로세스 추가 */ .buy .btnPackingGuide{line-height:1.1;white-space: normal} .buy .delivery .controls .row.packing .col:last-child{max-width:50%;display:inline-block} .buy .delivery .controls .col .btn {font-size:12px;padding:0 10px} .buy .refund > .box{padding:15px 0 10px} .dialog.packing .layout header h1{font-size:18px} .dialog.packing .box.primary{padding:15px;margin-top:15px} .dialog.packing .serchArea{margin-top:15px} .dialog.packing .serchArea > .row:first-child{display:flex} .dialog.packing .serchArea .col:first-child{width:100%} .dialog.packing .serchArea .col button{min-width:90px;margin-left:5px} .dialog.packing .packinglist{margin:15px 0 20px} .dialog.packing .packinglist li{padding:10px 15px;border: 1px solid #e2e2e2;margin-bottom:5px;font-size:13px;border-radius:2px} .dialog.packing .packinglist li .name{font-weight:bold;margin-bottom:5px} /* OP-19094 리뉴얼 랜딩 페이지 */ .renewal-landing{background-color:#fff;padding:0 15px;text-align:center} .renewal-landing *{letter-spacing:-0.03em;box-sizing:border-box} .renewal-landing #renewalLang{position:absolute;top:15px;right:15px;width:30%;max-width:200px;height:40px;min-width:110px} .renewal-landing #renewalLang[data-value]:before{text-align:left;padding-left:10px} .renewal-landing #renewalLang select{color:#333;width:100%} .renewal-landing .flex-box{display:flex;flex-direction:column;padding-top:100px;height:calc(100vh - 125px);justify-content:space-between;overflow-y:hidden;box-sizing:border-box} .renewal-landing .flex-box h1{width:100px;margin:0 auto} .renewal-landing .flex-box h2{font-size:40px;font-weight:bold;color:#333;line-height:1.2em} .renewal-landing .flex-box p{font-size:24px;color:#000;margin-top:10px;color:#333} .renewal-landing .flex-box .text-box{margin:10px 0 40px;word-break:break-word} .renewal-landing .flex-box > img{display:block; width:55%;margin:0 auto;max-width:368px} .renewal-landing .flex-box button, .renewal-landing .flex-box .col a{font-size:18px !important;line-height:1.2em;display:flex;justify-content:center;align-items:center} /* OP-19094 리뉴얼 랜딩 페이지 - 언어별 폰트 설정 */ .renewal-landing .flex-box.jp{-webkit-locale:"ja-JP";} .renewal-landing .flex-box.tw{font-family:'Noto Sans TC', 'Microsoft JhengHei', sans-serif} .renewal-landing .flex-box.zh{font-family:'Microsoft YaHei', 'Microsoft JhengHei', sans-serif} .renewal-landing .flex-box.th{font-family:'CSChatThaiUI', sans-serif} .renewal-landing .flex-box.kh{font-family:'Hanuman', Arial, Helvetica, sans-serif} .renewal-landing .flex-box.tr{font-family:Arial, sans-serif} /* OP-20472 오픈소스 라이선스 약관 추가 */ .dialog.agreement.terms #termsopen h3{font-weight:bold;} @media (min-height:1000px) { .renewal-landing .flex-box{padding-top:calc(15vh - 55px)} } @media (max-width:600px) { .renewal-landing .flex-box{padding-top:calc(17vh - 55px)} .renewal-landing .flex-box h2{font-size: 30px} .renewal-landing .flex-box p{font-size:18px} .renewal-landing .flex-box button, .renewal-landing .flex-box .col a{font-size:15px !important} } @media (max-width:400px) { .renewal-landing .flex-box h2{font-size:25px} .renewal-landing .flex-box p{font-size:15px} } @media (max-width:300px) { .renewal-landing .flex-box h2{font-size:22px} } @charset "UTF-8"; /* common */ .dialog .dim, #dim {background-color:#000; position:fixed; left:0; top:0; right:0; bottom:0; opacity:0; z-index:-1; pointer-events:none; -webkit-transition:opacity .3s ease-in .2s, z-index 0s ease .5s; transition: opacity .3s ease-in .2s, z-index 0s ease .5s; } .dialog.active .dim, #dim.active { z-index:150; opacity:.7; -webkit-transition:opacity .3s ease 0s, z-index 0s; transition:opacity .3s ease 0s, z-index 0s; -webkit-pointer-events:auto; pointer-events:auto; } /* Accordion : 트랜지션 추가 예정 */ .accordion .content .item {display:none;} .accordion .content.active .item {display:block;} /* Transition-nav */ #gnb { width:80%; will-change: transform; visibility:hidden; -webkit-transform: translate3d(-100%,0,0); transform: translate3d(-100%,0,0); -webkit-transition: -webkit-transform .5s ease, visibility 0s linear .5s; transition: transform .5s ease, visibility 0s linear .5s; } #container.active #gnb { visibility:visible; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); -webkit-transition: -webkit-transform .5s ease, visibility 0s linear 0s; transition:-webkit-transform .5s ease, visibility 0s linear 0s; } .menuClose { visibility:hidden; position:fixed; left:85%; top:17px; z-index:160; opacity:0; pointer-events:none; width:17px; height:17px; font:0/0 a; text-align:center; background-image:url('http://static.atomy.com/static/images/common/icon_sprite.png'); background-position:-125px 0; background-repeat:no-repeat; background-size:360px auto; -webkit-transform: translate3d(-100%,0,0); transform: translate3d(-100%,0,0); -webkit-transition: -webkit-transform .5s ease, visibility 0s linear .5s, opacity 0.3s; transition: transform .5s ease, visibility 0s linear .5s, opacity 0.3s; } #container.active .menuClose { visibility:visible; opacity:1; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); -webkit-transition: -webkit-transform .5s ease, visibility 0s linear 0s, opacity 0.3s; transition:-webkit-transform .5s ease, visibility 0s linear 0s, opacity 0.3s; } /* Dialog */ .clearfix:before, .clearfix:after { content: ''; display: table; } .clearfix:after { clear: both; } .dialog, .dim { display:block; width: 100%; height: 100%; top: 0; left: 0; } .toast, .dialog { z-index:250; position: fixed; pointer-events: none; /*-webkit-visibility: hidden; visibility: hidden; 이거 쓰면 딤 사라질때 띡 사라짐*/ } .dialog.active { /*-webkit-visibility: visible; visibility:visible;*/ } .dialog a, .dialog button { color: #74716D; text-decoration: none; outline: none; } .dialog a:hover, .dialog a:focus { outline: none; } .btnDialog { font-size:2rem; padding:1rem 2.5rem; color:#fff; background-color:cadetblue; } .btnDialog:active, .btnDialog:hover { background-color:darkcyan; } .dialog .layout { z-index:300; background-color:#fff; position:relative; pointer-events:auto; } .dialog.active .layout { opacity:1; } /* type1 : 아래에서 위로 서서히 */ .dialog.type1 .layout { } .dialog.type1.active .layout { -webkit-animation-duration: 0.3s; animation-duration: 0.3s; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; -webkit-animation-name:dia1-open; animation-name:dia1-open; } @-webkit-keyframes dia1-open { 0% { opacity: 0; -webkit-transform: translate3d(0, 50px, 0); } 100% { opacity: 1; -webkit-transform: translate3d(0, 0, 0); } } @keyframes dia1-open { 0% { opacity: 0; -webkit-transform: translate3d(0, 50px, 0); transform: translate3d(0, 50px, 0); } 100% { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @-webkit-keyframes diacon1 { 0% { opacity: 0; -webkit-transform: translate3d(0, 25px, 0); } 100% { opacity: 1; -webkit-transform: translate3d(0, 0, 0); } } @keyframes diacon1 { 0% { opacity: 0; -webkit-transform: translate3d(0, 25px, 0); transform: translate3d(0, 25px, 0); } 100% { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } /* type2 : 가운데에서 서서히 나타남 */ .dialog.type2.active .layout { -webkit-animation-duration: 0.5s; animation-duration: 0.5s; -webkit-animation-fill-mode: backwards; animation-fill-mode: backwards; } .dialog.type2.active .layout { -webkit-animation-name: dia2-open; animation-name: dia2-open; } @-webkit-keyframes dia2-open { 0% { opacity: 0; -webkit-transform: scale3d(1.1, 1.1, 1); } 100% { opacity: 1; -webkit-transform: scale3d(1, 1, 1); } } @keyframes dia2-open { 0% { opacity: 0; -webkit-transform: scale3d(1.1, 1.1, 1); transform: scale3d(1.1, 1.1, 1); } 100% { opacity: 1; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } /* Dialog toLeft : 오른쪽에서 나타남*/ .dialog.toLeft { } .dialog.toLeft .dim { opacity:0; -webkit-transition:opacity .5s ease-in .2s; transition: opacity .5s ease-in .2s; } .dialog.toLeft.active .dim { opacity:.7; visibility: visible; -webkit-transition:opacity .5s ease 0s; transition:opacity .5s ease 0s; } .dialog.toLeft .layout { opacity:1; z-index:250; pointer-events:none; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); -webkit-transition: -webkit-transform .5s ease; transition:transform .5s ease; } .dialog.toLeft.active .layout { pointer-events:auto; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } /* Dialog page.toTop : 아래에서 맨위까지*/ .dialog.page.toTop { pointer-events:none; } .dialog.page.toTop.active { pointer-events:auto; } .dialog.page.toTop .dim { opacity:0; -webkit-transition:opacity .5s ease-in .2s; transition: opacity .5s ease-in .2s; } .dialog.page.toTop.active .dim { opacity:.7; -webkit-transition:opacity .5s ease 0s; transition:opacity .5s ease 0s; } .dialog.page.toTop .layout { opacity:0; z-index:250; pointer-events:none; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); -webkit-transition: all .5s ease; transition:all .5s ease; } .dialog.page.toTop.active .layout { opacity:1; pointer-events:auto; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } /* Dialog toTop : 맨밑에 딱 붙음 */ .dialog.toTop.active { display:block; } .dialog.toTop .layout { position:fixed; left:0; bottom:0; width:100%; visibility:hidden; -webkit-transition: -webkit-transform .5s ease, visibility 0s linear 1s; transition:transform .5s ease, visibility 0s linear 1s; -webkit-transform: translateY(100%); transform: translateY(100%); } .dialog.toTop.active .layout { visibility:visible; -webkit-transition: -webkit-transform .4s ease, visibility 0s linear 0s; transition:transform .4s ease, visibility 0s linear 0s; -webkit-transform: translateY(0); transform: translateY(0); } .dialog.toTop .layout .dialogClose { display:none; } .dialog.toTop.active .layout .dialogClose { display:block; } .dialog.toTop .dim { opacity:0; -webkit-transition:opacity .2s ease .4s; transition: opacity .2s ease .4s; } .dialog.toTop.active .dim { opacity:.7; -webkit-transition: opacity .2s ease 0s; transition: opacity .2s ease 0s; -webkit-pointer-events:auto; pointer-events:auto; } /* Dialog toBottom : 맨위에서 아래로 */ .dialog.toBottom.active { display:block; } .dialog.toBottom .layout { opacity:0; z-index:250; pointer-events:none; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); -webkit-transition: all .5s ease; transition:all .5s ease; } .dialog.toBottom.active .layout { opacity:1; pointer-events:auto; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } /*.dialog.toBottom .layout .dialogClose { display:none; } .dialog.toBottom.active .layout .dialogClose { display:block; }*/ .dialog.toBottom .dim { opacity:0; -webkit-transition:opacity .2s ease .4s; transition: opacity .2s ease .4s; } .dialog.toBottom.active .dim { opacity:.7; -webkit-transition: opacity .2s ease 0s; transition: opacity .2s ease 0s; -webkit-pointer-events:auto; pointer-events:auto; } .dialog.page .layout {position:relative;} /* 일회용 Dialog : 나타났다 사라짐. 이건 딤없어야함*/ .toast .layout{ opacity:0; } .toast.active .layout { opacity:1; animation: animationFrames ease 2s; animation-iteration-count: 1; transform-origin: 50% 50%; animation-fill-mode:forwards; -webkit-animation: animationFrames ease 2s; -webkit-animation-iteration-count: 1; -webkit-transform-origin: 50% 50%; -webkit-animation-fill-mode:forwards; /*Chrome 16+, Safari 4+*/ -webkit-transition: -webkit-transform .5s ease-in-out; transition:transform .5s ease-in-out; } @keyframes animationFrames{ 0% { opacity:1; transform: translate3d(0,1500px,0) ; } 30% { opacity:1; transform: translate3d(0,-10px,0) ; } 60% { opacity:1; transform: translate3d(0,10px,0) ; } 100% { opacity:0; transform: translate3d(0,-100%,0) ; } } @-webkit-keyframes animationFrames { 0% { opacity:1; -webkit-transform: translate3d(0,1500px,0) ; } 30% { opacity:1; -webkit-transform: translate3d(0,-10px,0) ; } 60% { opacity:1; -webkit-transform: translate3d(0,10px,0) ; } 100% { opacity:0; -webkit-transform: translate3d(0,-100%,0) ; } } .toast.showAni .layout { opacity:1; animation: showAni ease 2s; animation-iteration-count: 1; transform-origin: 50% 50%; animation-fill-mode:forwards; -webkit-animation: showAni ease 2s; -webkit-animation-iteration-count: 1; -webkit-transform-origin: 50% 50%; -webkit-animation-fill-mode:forwards; /*Chrome 16+, Safari 4+*/ -webkit-transition: -webkit-transform .5s ease-in-out; transition:transform .5s ease-in-out; } @keyframes showAni{ 0% { opacity:1; transform: translate3d(0,1500px,0) ; } 30% { opacity:1; transform: translate3d(0,-10px,0) ; } 60% { opacity:1; -webkit-transform: translate3d(0,0,0) ; } } @-webkit-keyframes showAni { 0% { opacity:1; transform: translate3d(0,1500px,0) ; } 30% { opacity:1; transform: translate3d(0,-10px,0) ; } 60% { opacity:1; -webkit-transform: translate3d(0,0,0) ; } } .toast.hideAni .layout { opacity:1; animation: hideAni ease 2s; animation-iteration-count: 1; transform-origin: 50% 50%; animation-fill-mode:forwards; -webkit-animation: hideAni ease 2s; -webkit-animation-iteration-count: 1; -webkit-transform-origin: 50% 50%; -webkit-animation-fill-mode:forwards; /*Chrome 16+, Safari 4+*/ -webkit-transition: -webkit-transform .5s ease-in-out; transition:transform .5s ease-in-out; } @keyframes hideAni{ 0% { opacity:1; -webkit-transform: translate3d(0,0,0) ; } 30% { opacity:1; transform: translate3d(0,10px,0) ; } 100% { opacity:0; transform: translate3d(0,-100%,0) ; } } @-webkit-keyframes hideAni { 0% { opacity:1; -webkit-transform: translate3d(0,0,0) ; } 30% { opacity:1; transform: translate3d(0,10px,0) ; } 100% { opacity:0; transform: translate3d(0,-100%,0) ; } } .toast.active .layout { } .toast .layout .body { display:inline-block; width: 100%; } /* Dialog Center */ .dialog.toCenter {} .dialog.toCenter .dim {position:absolute; opacity:0; display:block;} .dialog.toCenter.active .dim {opacity:.7;} .dialog.toCenter .layout { visibility:hidden; -webkit-transform:translate3d(0,1000px,0); transform:translate3d(0,1000px,0); -webkit-transition: -webkit-transform .5s ease, visibility 0s linear .5s; transition:transform .5s ease, visibility 0s linear .5s; } .dialog.toCenter.active .layout { visibility:visible; -webkit-transform:translate3d(0,0,0); transform:translate3d(0,0,0); -webkit-transition:-webkit-transform .4s ease, visibility 0s linear 0s; transition:-webkit-transform .4s ease, visibility 0s linear 0s; } /* 즐겨찾기 아이콘 */ /* .bookmark.transition, .bookmark.transition i, .bookmark.transition i:after {display:inline-block; width:18px; height:18px; vertical-align:top; font:0/0 a; background-repeat:no-repeat; background-position:0 0; background-size:18px auto; pointer-events:none;} .bookmark.transition {background-image:url('http://static.atomy.com/static/images/common/star_blank_36x36.png'); } .bookmark.transition i {position:relative; background-image:url('http://static.atomy.com/static/images/common/star_active_36x36.png');} .bookmark.transition.active i {opacity:1;} .bookmark.transition i { opacity:0; -webkit-transition: all .5s ease; transition:all .5s ease; } .bookmark.transition.active i { opacity:1; -webkit-transition: all .5s ease; transition:all .5s ease; } .bookmark.transition i:after { opacity:0; position:absolute; left:0; top:0; right:0; bottom:0; background-image:url('http://static.atomy.com/static/images/common/star_active_36x36.png'); -webkit-transition: all .5s ease; transition:all .5s ease; -webkit-animation: bookmark 1s 1 ease; animation: bookmark 1s 1 ease; } .bookmark.transition.active i:after { content:''; opacity:1; position:absolute; left:0; top:0; -webkit-animation: bookmark 1s 1 ease; animation: bookmark 1s 1 ease; } @-webkit-keyframes bookmark { 0% { -webkit-transform:scale(0); transform:scale(0); opacity:0;} 50% { -webkit-transform:scale(1.4); transform:scale(1.4); opacity:1;} 100% { -webkit-transform:scale(0); transform:scale(0); opacity:0;} }*/ .autocomplete-suggestions{text-align:left;cursor:default;border:1px solid #ccc;border-top:0;background:#fff;box-shadow:-1px 1px 3px rgba(0,0,0,.1);position:absolute;display:none;z-index:9999;max-height:254px;overflow:hidden;overflow-y:auto;box-sizing:border-box} .autocomplete-suggestion{position:relative;padding:0 .6em;line-height:23px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:1.02em;color:#333} .autocomplete-suggestion b{font-weight:normal;color:#1f8dd6} .autocomplete-suggestion.selected{background:#f0f0f0} /*! jQuery UI - v1.11.4 - 2016-04-20 * http://jqueryui.com * Includes: core.css, datepicker.css, theme.css * To view and modify this theme, visit http://jqueryui.com/themeroller/?ffDefault=Arial%2CHelvetica%2Csans-serif&fsDefault=1em&fwDefault=normal&cornerRadius=3px&bgColorHeader=e9e9e9&bgTextureHeader=flat&borderColorHeader=dddddd&fcHeader=333333&iconColorHeader=444444&bgColorContent=ffffff&bgTextureContent=flat&borderColorContent=dddddd&fcContent=333333&iconColorContent=444444&bgColorDefault=f6f6f6&bgTextureDefault=flat&borderColorDefault=c5c5c5&fcDefault=454545&iconColorDefault=777777&bgColorHover=ededed&bgTextureHover=flat&borderColorHover=cccccc&fcHover=2b2b2b&iconColorHover=555555&bgColorActive=007fff&bgTextureActive=flat&borderColorActive=003eff&fcActive=ffffff&iconColorActive=ffffff&bgColorHighlight=fffa90&bgTextureHighlight=flat&borderColorHighlight=dad55e&fcHighlight=777620&iconColorHighlight=777620&bgColorError=fddfdf&bgTextureError=flat&borderColorError=f1a899&fcError=5f3f3f&iconColorError=cc0000&bgColorOverlay=aaaaaa&bgTextureOverlay=flat&bgImgOpacityOverlay=0&opacityOverlay=30&bgColorShadow=666666&bgTextureShadow=flat&bgImgOpacityShadow=0&opacityShadow=30&thicknessShadow=5px&offsetTopShadow=0px&offsetLeftShadow=0px&cornerRadiusShadow=8px * Copyright jQuery Foundation and other contributors; Licensed MIT */ .ui-helper-hidden{display:none}.ui-helper-hidden-accessible{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.ui-helper-reset{margin:0;padding:0;border:0;outline:0;line-height:1.3;text-decoration:none;font-size:100%;list-style:none}.ui-helper-clearfix:before,.ui-helper-clearfix:after{content:"";display:table;border-collapse:collapse}.ui-helper-clearfix:after{clear:both}.ui-helper-clearfix{min-height:0}.ui-helper-zfix{width:100%;height:100%;top:0;left:0;position:absolute;opacity:0;filter:Alpha(Opacity=0)}.ui-front{z-index:100}.ui-state-disabled{cursor:default!important}.ui-icon{display:block;text-indent:-99999px;overflow:hidden;background-repeat:no-repeat}.ui-widget-overlay{position:fixed;top:0;left:0;width:100%;height:100%}.ui-datepicker{width:17em;padding:.2em .2em 0;display:none}.ui-datepicker .ui-datepicker-header{position:relative;padding:.2em 0}.ui-datepicker .ui-datepicker-prev,.ui-datepicker .ui-datepicker-next{position:absolute;top:2px;width:1.8em;height:1.8em}.ui-datepicker .ui-datepicker-prev-hover,.ui-datepicker .ui-datepicker-next-hover{top:1px}.ui-datepicker .ui-datepicker-prev{left:2px}.ui-datepicker .ui-datepicker-next{right:2px}.ui-datepicker .ui-datepicker-prev-hover{left:1px}.ui-datepicker .ui-datepicker-next-hover{right:1px}.ui-datepicker .ui-datepicker-prev span,.ui-datepicker .ui-datepicker-next span{display:block;position:absolute;left:50%;margin-left:-8px;top:50%;margin-top:-8px}.ui-datepicker .ui-datepicker-title{margin:0 2.3em;line-height:1.8em;text-align:center}.ui-datepicker .ui-datepicker-title select{font-size:1em;margin:1px 0}.ui-datepicker select.ui-datepicker-month,.ui-datepicker select.ui-datepicker-year{width:45%}.ui-datepicker table{width:100%;font-size:.9em;border-collapse:collapse;margin:0 0 .4em}.ui-datepicker th{padding:.7em .3em;text-align:center;font-weight:bold;border:0}.ui-datepicker td{border:0;padding:1px}.ui-datepicker td span,.ui-datepicker td a{display:block;padding:.2em;text-align:right;text-decoration:none}.ui-datepicker .ui-datepicker-buttonpane{background-image:none;margin:.7em 0 0 0;padding:0 .2em;border-left:0;border-right:0;border-bottom:0}.ui-datepicker .ui-datepicker-buttonpane button{float:right;margin:.5em .2em .4em;cursor:pointer;padding:.2em .6em .3em .6em;width:auto;overflow:visible}.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current{float:left}.ui-datepicker.ui-datepicker-multi{width:auto}.ui-datepicker-multi .ui-datepicker-group{float:left}.ui-datepicker-multi .ui-datepicker-group table{width:95%;margin:0 auto .4em}.ui-datepicker-multi-2 .ui-datepicker-group{width:50%}.ui-datepicker-multi-3 .ui-datepicker-group{width:33.3%}.ui-datepicker-multi-4 .ui-datepicker-group{width:25%}.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header,.ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header{border-left-width:0}.ui-datepicker-multi .ui-datepicker-buttonpane{clear:left}.ui-datepicker-row-break{clear:both;width:100%;font-size:0}.ui-datepicker-rtl{direction:rtl}.ui-datepicker-rtl .ui-datepicker-prev{right:2px;left:auto}.ui-datepicker-rtl .ui-datepicker-next{left:2px;right:auto}.ui-datepicker-rtl .ui-datepicker-prev:hover{right:1px;left:auto}.ui-datepicker-rtl .ui-datepicker-next:hover{left:1px;right:auto}.ui-datepicker-rtl .ui-datepicker-buttonpane{clear:right}.ui-datepicker-rtl .ui-datepicker-buttonpane button{float:left}.ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current,.ui-datepicker-rtl .ui-datepicker-group{float:right}.ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header,.ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header{border-right-width:0;border-left-width:1px}.ui-widget{font-family:Arial,Helvetica,sans-serif;font-size:1em}.ui-widget .ui-widget{font-size:1em}.ui-widget input,.ui-widget select,.ui-widget textarea,.ui-widget button{font-family:Arial,Helvetica,sans-serif;font-size:1em}.ui-widget-content{border:1px solid #ddd;background:#fff;color:#333}.ui-widget-content a{color:#333}.ui-widget-header{border:1px solid #ddd;background:#e9e9e9;color:#333;font-weight:bold}.ui-widget-header a{color:#333}.ui-state-default,.ui-widget-content .ui-state-default,.ui-widget-header .ui-state-default{border:1px solid #c5c5c5;background:#f6f6f6;font-weight:normal;color:#454545}.ui-state-default a,.ui-state-default a:link,.ui-state-default a:visited{color:#454545;text-decoration:none}.ui-state-hover,.ui-widget-content .ui-state-hover,.ui-widget-header .ui-state-hover,.ui-state-focus,.ui-widget-content .ui-state-focus,.ui-widget-header .ui-state-focus{border:1px solid #ccc;background:#ededed;font-weight:normal;color:#2b2b2b}.ui-state-hover a,.ui-state-hover a:hover,.ui-state-hover a:link,.ui-state-hover a:visited,.ui-state-focus a,.ui-state-focus a:hover,.ui-state-focus a:link,.ui-state-focus a:visited{color:#2b2b2b;text-decoration:none}.ui-state-active,.ui-widget-content .ui-state-active,.ui-widget-header .ui-state-active{border:1px solid #003eff;background:#007fff;font-weight:normal;color:#fff}.ui-state-active a,.ui-state-active a:link,.ui-state-active a:visited{color:#fff;text-decoration:none}.ui-state-highlight,.ui-widget-content .ui-state-highlight,.ui-widget-header .ui-state-highlight{border:1px solid #dad55e;background:#fffa90;color:#777620}.ui-state-highlight a,.ui-widget-content .ui-state-highlight a,.ui-widget-header .ui-state-highlight a{color:#777620}.ui-state-error,.ui-widget-content .ui-state-error,.ui-widget-header .ui-state-error{border:1px solid #f1a899;background:#fddfdf;color:#5f3f3f}.ui-state-error a,.ui-widget-content .ui-state-error a,.ui-widget-header .ui-state-error a{color:#5f3f3f}.ui-state-error-text,.ui-widget-content .ui-state-error-text,.ui-widget-header .ui-state-error-text{color:#5f3f3f}.ui-priority-primary,.ui-widget-content .ui-priority-primary,.ui-widget-header .ui-priority-primary{font-weight:bold}.ui-priority-secondary,.ui-widget-content .ui-priority-secondary,.ui-widget-header .ui-priority-secondary{opacity:.7;filter:Alpha(Opacity=70);font-weight:normal}.ui-state-disabled,.ui-widget-content .ui-state-disabled,.ui-widget-header .ui-state-disabled{opacity:.35;filter:Alpha(Opacity=35);background-image:none}.ui-state-disabled .ui-icon{filter:Alpha(Opacity=35)}.ui-icon{width:16px;height:16px}.ui-icon,.ui-widget-content .ui-icon{background-image:url("http://static.atomy.com/static/scripts/libs/jquery/ui/images/ui-icons_444444_256x240.png")}.ui-widget-header .ui-icon{background-image:url("http://static.atomy.com/static/scripts/libs/jquery/ui/images/ui-icons_444444_256x240.png")}.ui-state-default .ui-icon{background-image:url("http://static.atomy.com/static/scripts/libs/jquery/ui/images/ui-icons_777777_256x240.png")}.ui-state-hover .ui-icon,.ui-state-focus .ui-icon{background-image:url("http://static.atomy.com/static/scripts/libs/jquery/ui/images/ui-icons_555555_256x240.png")}.ui-state-active .ui-icon{background-image:url("http://static.atomy.com/static/scripts/libs/jquery/ui/images/ui-icons_ffffff_256x240.png")}.ui-state-highlight .ui-icon{background-image:url("http://static.atomy.com/static/scripts/libs/jquery/ui/images/ui-icons_777620_256x240.png")}.ui-state-error .ui-icon,.ui-state-error-text .ui-icon{background-image:url("http://static.atomy.com/static/scripts/libs/jquery/ui/images/ui-icons_cc0000_256x240.png")}.ui-icon-blank{background-position:16px 16px}.ui-icon-carat-1-n{background-position:0 0}.ui-icon-carat-1-ne{background-position:-16px 0}.ui-icon-carat-1-e{background-position:-32px 0}.ui-icon-carat-1-se{background-position:-48px 0}.ui-icon-carat-1-s{background-position:-64px 0}.ui-icon-carat-1-sw{background-position:-80px 0}.ui-icon-carat-1-w{background-position:-96px 0}.ui-icon-carat-1-nw{background-position:-112px 0}.ui-icon-carat-2-n-s{background-position:-128px 0}.ui-icon-carat-2-e-w{background-position:-144px 0}.ui-icon-triangle-1-n{background-position:0 -16px}.ui-icon-triangle-1-ne{background-position:-16px -16px}.ui-icon-triangle-1-e{background-position:-32px -16px}.ui-icon-triangle-1-se{background-position:-48px -16px}.ui-icon-triangle-1-s{background-position:-64px -16px}.ui-icon-triangle-1-sw{background-position:-80px -16px}.ui-icon-triangle-1-w{background-position:-96px -16px}.ui-icon-triangle-1-nw{background-position:-112px -16px}.ui-icon-triangle-2-n-s{background-position:-128px -16px}.ui-icon-triangle-2-e-w{background-position:-144px -16px}.ui-icon-arrow-1-n{background-position:0 -32px}.ui-icon-arrow-1-ne{background-position:-16px -32px}.ui-icon-arrow-1-e{background-position:-32px -32px}.ui-icon-arrow-1-se{background-position:-48px -32px}.ui-icon-arrow-1-s{background-position:-64px -32px}.ui-icon-arrow-1-sw{background-position:-80px -32px}.ui-icon-arrow-1-w{background-position:-96px -32px}.ui-icon-arrow-1-nw{background-position:-112px -32px}.ui-icon-arrow-2-n-s{background-position:-128px -32px}.ui-icon-arrow-2-ne-sw{background-position:-144px -32px}.ui-icon-arrow-2-e-w{background-position:-160px -32px}.ui-icon-arrow-2-se-nw{background-position:-176px -32px}.ui-icon-arrowstop-1-n{background-position:-192px -32px}.ui-icon-arrowstop-1-e{background-position:-208px -32px}.ui-icon-arrowstop-1-s{background-position:-224px -32px}.ui-icon-arrowstop-1-w{background-position:-240px -32px}.ui-icon-arrowthick-1-n{background-position:0 -48px}.ui-icon-arrowthick-1-ne{background-position:-16px -48px}.ui-icon-arrowthick-1-e{background-position:-32px -48px}.ui-icon-arrowthick-1-se{background-position:-48px -48px}.ui-icon-arrowthick-1-s{background-position:-64px -48px}.ui-icon-arrowthick-1-sw{background-position:-80px -48px}.ui-icon-arrowthick-1-w{background-position:-96px -48px}.ui-icon-arrowthick-1-nw{background-position:-112px -48px}.ui-icon-arrowthick-2-n-s{background-position:-128px -48px}.ui-icon-arrowthick-2-ne-sw{background-position:-144px -48px}.ui-icon-arrowthick-2-e-w{background-position:-160px -48px}.ui-icon-arrowthick-2-se-nw{background-position:-176px -48px}.ui-icon-arrowthickstop-1-n{background-position:-192px -48px}.ui-icon-arrowthickstop-1-e{background-position:-208px -48px}.ui-icon-arrowthickstop-1-s{background-position:-224px -48px}.ui-icon-arrowthickstop-1-w{background-position:-240px -48px}.ui-icon-arrowreturnthick-1-w{background-position:0 -64px}.ui-icon-arrowreturnthick-1-n{background-position:-16px -64px}.ui-icon-arrowreturnthick-1-e{background-position:-32px -64px}.ui-icon-arrowreturnthick-1-s{background-position:-48px -64px}.ui-icon-arrowreturn-1-w{background-position:-64px -64px}.ui-icon-arrowreturn-1-n{background-position:-80px -64px}.ui-icon-arrowreturn-1-e{background-position:-96px -64px}.ui-icon-arrowreturn-1-s{background-position:-112px -64px}.ui-icon-arrowrefresh-1-w{background-position:-128px -64px}.ui-icon-arrowrefresh-1-n{background-position:-144px -64px}.ui-icon-arrowrefresh-1-e{background-position:-160px -64px}.ui-icon-arrowrefresh-1-s{background-position:-176px -64px}.ui-icon-arrow-4{background-position:0 -80px}.ui-icon-arrow-4-diag{background-position:-16px -80px}.ui-icon-extlink{background-position:-32px -80px}.ui-icon-newwin{background-position:-48px -80px}.ui-icon-refresh{background-position:-64px -80px}.ui-icon-shuffle{background-position:-80px -80px}.ui-icon-transfer-e-w{background-position:-96px -80px}.ui-icon-transferthick-e-w{background-position:-112px -80px}.ui-icon-folder-collapsed{background-position:0 -96px}.ui-icon-folder-open{background-position:-16px -96px}.ui-icon-document{background-position:-32px -96px}.ui-icon-document-b{background-position:-48px -96px}.ui-icon-note{background-position:-64px -96px}.ui-icon-mail-closed{background-position:-80px -96px}.ui-icon-mail-open{background-position:-96px -96px}.ui-icon-suitcase{background-position:-112px -96px}.ui-icon-comment{background-position:-128px -96px}.ui-icon-person{background-position:-144px -96px}.ui-icon-print{background-position:-160px -96px}.ui-icon-trash{background-position:-176px -96px}.ui-icon-locked{background-position:-192px -96px}.ui-icon-unlocked{background-position:-208px -96px}.ui-icon-bookmark{background-position:-224px -96px}.ui-icon-tag{background-position:-240px -96px}.ui-icon-home{background-position:0 -112px}.ui-icon-flag{background-position:-16px -112px}.ui-icon-calendar{background-position:-32px -112px}.ui-icon-cart{background-position:-48px -112px}.ui-icon-pencil{background-position:-64px -112px}.ui-icon-clock{background-position:-80px -112px}.ui-icon-disk{background-position:-96px -112px}.ui-icon-calculator{background-position:-112px -112px}.ui-icon-zoomin{background-position:-128px -112px}.ui-icon-zoomout{background-position:-144px -112px}.ui-icon-search{background-position:-160px -112px}.ui-icon-wrench{background-position:-176px -112px}.ui-icon-gear{background-position:-192px -112px}.ui-icon-heart{background-position:-208px -112px}.ui-icon-star{background-position:-224px -112px}.ui-icon-link{background-position:-240px -112px}.ui-icon-cancel{background-position:0 -128px}.ui-icon-plus{background-position:-16px -128px}.ui-icon-plusthick{background-position:-32px -128px}.ui-icon-minus{background-position:-48px -128px}.ui-icon-minusthick{background-position:-64px -128px}.ui-icon-close{background-position:-80px -128px}.ui-icon-closethick{background-position:-96px -128px}.ui-icon-key{background-position:-112px -128px}.ui-icon-lightbulb{background-position:-128px -128px}.ui-icon-scissors{background-position:-144px -128px}.ui-icon-clipboard{background-position:-160px -128px}.ui-icon-copy{background-position:-176px -128px}.ui-icon-contact{background-position:-192px -128px}.ui-icon-image{background-position:-208px -128px}.ui-icon-video{background-position:-224px -128px}.ui-icon-script{background-position:-240px -128px}.ui-icon-alert{background-position:0 -144px}.ui-icon-info{background-position:-16px -144px}.ui-icon-notice{background-position:-32px -144px}.ui-icon-help{background-position:-48px -144px}.ui-icon-check{background-position:-64px -144px}.ui-icon-bullet{background-position:-80px -144px}.ui-icon-radio-on{background-position:-96px -144px}.ui-icon-radio-off{background-position:-112px -144px}.ui-icon-pin-w{background-position:-128px -144px}.ui-icon-pin-s{background-position:-144px -144px}.ui-icon-play{background-position:0 -160px}.ui-icon-pause{background-position:-16px -160px}.ui-icon-seek-next{background-position:-32px -160px}.ui-icon-seek-prev{background-position:-48px -160px}.ui-icon-seek-end{background-position:-64px -160px}.ui-icon-seek-start{background-position:-80px -160px}.ui-icon-seek-first{background-position:-80px -160px}.ui-icon-stop{background-position:-96px -160px}.ui-icon-eject{background-position:-112px -160px}.ui-icon-volume-off{background-position:-128px -160px}.ui-icon-volume-on{background-position:-144px -160px}.ui-icon-power{background-position:0 -176px}.ui-icon-signal-diag{background-position:-16px -176px}.ui-icon-signal{background-position:-32px -176px}.ui-icon-battery-0{background-position:-48px -176px}.ui-icon-battery-1{background-position:-64px -176px}.ui-icon-battery-2{background-position:-80px -176px}.ui-icon-battery-3{background-position:-96px -176px}.ui-icon-circle-plus{background-position:0 -192px}.ui-icon-circle-minus{background-position:-16px -192px}.ui-icon-circle-close{background-position:-32px -192px}.ui-icon-circle-triangle-e{background-position:-48px -192px}.ui-icon-circle-triangle-s{background-position:-64px -192px}.ui-icon-circle-triangle-w{background-position:-80px -192px}.ui-icon-circle-triangle-n{background-position:-96px -192px}.ui-icon-circle-arrow-e{background-position:-112px -192px}.ui-icon-circle-arrow-s{background-position:-128px -192px}.ui-icon-circle-arrow-w{background-position:-144px -192px}.ui-icon-circle-arrow-n{background-position:-160px -192px}.ui-icon-circle-zoomin{background-position:-176px -192px}.ui-icon-circle-zoomout{background-position:-192px -192px}.ui-icon-circle-check{background-position:-208px -192px}.ui-icon-circlesmall-plus{background-position:0 -208px}.ui-icon-circlesmall-minus{background-position:-16px -208px}.ui-icon-circlesmall-close{background-position:-32px -208px}.ui-icon-squaresmall-plus{background-position:-48px -208px}.ui-icon-squaresmall-minus{background-position:-64px -208px}.ui-icon-squaresmall-close{background-position:-80px -208px}.ui-icon-grip-dotted-vertical{background-position:0 -224px}.ui-icon-grip-dotted-horizontal{background-position:-16px -224px}.ui-icon-grip-solid-vertical{background-position:-32px -224px}.ui-icon-grip-solid-horizontal{background-position:-48px -224px}.ui-icon-gripsmall-diagonal-se{background-position:-64px -224px}.ui-icon-grip-diagonal-se{background-position:-80px -224px}.ui-corner-all,.ui-corner-top,.ui-corner-left,.ui-corner-tl{border-top-left-radius:3px}.ui-corner-all,.ui-corner-top,.ui-corner-right,.ui-corner-tr{border-top-right-radius:3px}.ui-corner-all,.ui-corner-bottom,.ui-corner-left,.ui-corner-bl{border-bottom-left-radius:3px}.ui-corner-all,.ui-corner-bottom,.ui-corner-right,.ui-corner-br{border-bottom-right-radius:3px}.ui-widget-overlay{background:#aaa;opacity:.3;filter:Alpha(Opacity=30)}.ui-widget-shadow{margin:0 0 0 0;padding:5px;background:#666;opacity:.3;filter:Alpha(Opacity=30);border-radius:8px} @charset "UTF-8"; @import url(http://static.atomy.com/fonts.googleapis.com/earlyaccess/notosanstc.css); .office_jp .mt5{margin-top:5px} .office_jp .mt3{margin-top:3px} .office_jp .mt10{margin-top:10px} .office_jp .text12{font-size:12px !important} .office_jp .w100{width:100% !important} .office_jp .buy .delivery .controls.txthalf .col label{letter-spacing:-1px} .office_jp .combination .icon{display:inline-block;text-align:center;background-image:url('http://static.atomy.com/static/jp/ja-jp/images/common/layout_sprite01.png');background-repeat:no-repeat;background-size:360px auto;pointer-events:none} .office_jp .company .motto .verticalLine:after{height:60px;top:5px} .office_jp .contactUs .domestic .content .btn{top:9px} .office_jp .gateMain .row.info .notice{width:58%} .office_jp .gateMain .row.info .happyCenter{width:42%} .office_jp .gateMain .row.info .happyCenter h2{margin-bottom:0} .office_jp .registerGate .join .btns .btn{padding:10px 15px;line-height:20px;font-size:14px} .office_jp .register .table tbody th{white-space:normal} .office_jp .register .process ul li.step1 span{font-size:12px} .office_jp .tab.scroll span{width:auto} .office_jp #gnb .info .data dl dt{background-image:url('http://static.atomy.com/static/jp/ja-jp/images/common/layout_sprite.png')} .office_jp .contactUs .domestic .content address{padding-right:120px} /* layout */ .office_jp #gnb .local{right:30px} .office_jp #snb span a{line-height:1} .office_jp #body.shopMain,.office_jp #body.snbOn.footerOn{padding-bottom:236px} .office_jp #footer .fixContent{height:140px} .office_jp .shopMain .notice.fixBottom{bottom:200px} /* 사라지는 팝업 */ .office_jp .toast .layout .body .toastCart{margin-top:-60px} .office_jp .toast .layout .body .toastPinch{margin-top:-70px;font-size:12px} .office_jp .toast .icon.large.cart{margin-top:10px} .office_jp .toast .icon.large.pinch{margin-top:20px} .office_jp .rankDetail .plans .rank .head{padding:20px 0 0} .office_jp .icon.soldOut01{background-image:url('http://static.atomy.com/static/jp/ja-jp/images/common/icon_soldout01.png'); background-repeat:no-repeat;background-size:360px auto} .office_jp .products .list .info .disable .icon.soldOut01{background-image:url('http://static.atomy.com/static/jp/ja-jp/images/common/icon_soldout01.png'); background-repeat:no-repeat;background-size:360px auto} .office_jp .icon.sellOut01{background-image:url('http://static.atomy.com/static/jp/ja-jp/images/common/icon_sellout01.png'); background-repeat:no-repeat;background-size:360px auto} .office_jp .products .list .info .disable .icon.sellOut01{background-image:url('http://static.atomy.com/static/jp/ja-jp/images/common/icon_sellout01.png'); background-repeat:no-repeat;background-size:360px auto} .office_jp .icon.lowerLeft{width:20px;height:20px;background-image:url('http://static.atomy.com/static/jp/ja-jp/images/common/icon_sprite.png');background-repeat:no-repeat;background-size:360px auto;background-position:-315px 0;vertical-align:text-top} .office_jp .icon.lowerRight{width:20px;height:20px;background-image:url('http://static.atomy.com/static/jp/ja-jp/images/common/icon_sprite.png');background-repeat:no-repeat;background-size:360px auto;background-position:-335px 0;vertical-align:text-top} .office_jp .icon.lowerLeftLg{width:21px;height:21px;background-image:url('http://static.atomy.com/static/jp/ja-jp/images/common/icon_sprite.png');background-repeat:no-repeat;background-size:360px auto;background-position:0 -25px;vertical-align:text-top} .office_jp .icon.lowerRightLg{width:21px;height:21px;background-image:url('http://static.atomy.com/static/jp/ja-jp/images/common/icon_sprite.png');background-repeat:no-repeat;background-size:360px auto;background-position:-25px -25px;vertical-align:text-top} .office_jp .lower .list li .added span.couple{width:auto;padding:0 2px} .office_jp .lower .list li .icon.tl{width:30px;height:20px;background-image:url('http://static.atomy.com/static/jp/ja-jp/images/common/icon_tl.png');background-repeat:no-repeat;background-size:100% auto;background-position:0 0} /*OP-15074 schedule*/ .office_jp .schedule .calendarF{overflow:hidden;width:100%;height:100px;margin:5px 0 30px} .office_jp .schedule .calendarF i{margin:0 10px 0 0;} .office_jp .schedule .calendarF span em{display:inline-block;width:auto;margin-top:5px;margin:0; font-size:12px;text-align:right;white-space:nowrap} .office_jp .schedule .calendarF .icon{vertical-align:middle} .office_jp .schedule .calendarF ul{display:inline-block} .office_jp .schedule .calendarF ul li{text-align:left;font-size:12px;line-height:180%} .office_jp .schedule .calendarF span{margin:0} .office_jp .schedule .calendarF .dateY{width:18px;margin:0 5px} .office_jp .schedule .calendarF:after{content:'';display:block;clear:both} .office_jp .schedule .seminTop span{margin:0 110px 0 7px} .office_jp .schedule .seminTop span em{margin-left:15px;width:110px} .office_jp .schedule .seminTop span:last-child em{width:100px} /* 쇼핑몰 메인 */ .office_jp .shopMain .category li.fashion a:after{width:32px;height:25px;top:16px;margin-left:-16px;background-position:-320px 0} .office_jp .shopMain .category li.fashion.active a:after{background-position:-320px -40px} .office_jp .products .controls .productFilter .select[data-value]:before{left:0} .office_jp .products .info .price dd{white-space:nowrap} .office_jp .products .info .price dd strong{font-size:15px} .office_jp .product .products .card .info .fix{height:105px} .office_jp .products .card .info .disable{top:15px} .office_jp .tab.productNavTap span{vertical-align:top} .office_jp .tab.productNavTap span:nth-child(3) a{line-height:1.5} .office_jp .cart .row.btns.floating .btn{font-size:15px} .office_jp .snsShare.dialog .layout .body ul li .row .col .btn{font-size:12px} .office_jp .btn.text-overflow{line-height:1.2} .office_jp .dialog.cart .layout{padding-bottom:70px;background-color:#fff;border-top:1px solid #eaebec} .office_jp .dialog.cart .body{position:relative} .office_jp .dialog.cart .body .info{position:relative;display:table;width:100%;table-layout:fixed;height:106px;padding:15px 15px 0 15px;box-sizing:border-box} .office_jp .dialog.cart .body .info .label,.office_jp .dialog.cart .body .info .img{display:table-cell;width:150px;vertical-align:middle;text-align:center} .office_jp .dialog.cart .body .info .thumb{display:inline-block;width:100px;height:100px} .office_jp .dialog.cart .body .info .fix{display:table-cell;width:100%;vertical-align:middle} .office_jp .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} .office_jp .dialog.cart .body .info .select + .select{margin-top:10px} .office_jp .dialog.cart .selected{margin-top:11px;padding:0 15px} .office_jp .dialog.cart .selected .item{position:relative;padding:10px;color:#333;border-top:1px solid #c9c9c9;background-color:#f6f6f8;border-bottom:1px solid #c9c9c9} .office_jp .dialog.cart .selected .item .btnDelete{right:0;top:0;font:0/0 a} .office_jp .dialog.cart .selected .item .row{margin-top:10px} .office_jp .dialog.cart .selected .item .row:after{content:'';display:block;clear:both} .office_jp .dialog.cart .selected .item .col{float:right;width:50%;height:40px;text-align:right} .office_jp .dialog.cart .selected .item .col:first-child{float:left;text-align:left} .office_jp .dialog.cart .selected .item .price{line-height:40px} .office_jp .dialog.cart .total{margin:11px 0;padding:0 15px} .office_jp .dialog.cart .total .price{height:35px;padding:5px 0 0 10px;margin-top:2px;color:#333;background-color:#f3f9fb;box-sizing:border-box} .office_jp .dialog.cart .total dl{height:35px;padding:9px 10px 0;margin-top:2px;box-sizing:border-box} .office_jp .dialog.cart .total dl:after{content:'';display:block;clear:both} .office_jp .dialog.cart .total dl dt{float:left;width:30px;margin-right:14px;font-size:14px} .office_jp .dialog.cart .total dl dd{float:left;font-size:13px} .office_jp .dialog.cart .total dl dd.sum{float:right} .office_jp .dialog.cart .total dl dd.sum span{vertical-align:bottom} .office_jp .dialog.cart .total dl dd.sum strong{font-size:15px;line-height:1.2} .office_jp .dialog.cart .total dl dd.sum .equals{margin-right:18px;vertical-align:top} .office_jp .dialog.cart .total dl dd .mark{margin:0 10px} /* gnb */ .office_jp #gnb .myPage li a:after{background-image:url('http://static.atomy.com/static/jp/ja-jp/images/common/icon_gnb.png')} .office_jp #gnb .myPage li.faq a:after{top:20px;width:26px;height:23px;margin-left:-10px;background-position:-239px 0} .office_jp #gnb .myPage li a{letter-spacing:-1px} .office_jp #gnb .myPage li.low a,.office_jp #gnb .myPage li.delivery a{line-height:45px;padding-top:35px} .office_jp #gnb .myPage li.benefit a{line-height:12px;padding-top:43px} .office_jp #gnb .myPage li.cart a{line-height:12px;padding-top:44px} .office_jp .fixBottom.happyCenter .fixContent{padding-top:6px} .office_jp .fixBottom.happyCenter .fixContent p{color:#333;font-size:14px} .office_jp .fixBottom.happyCenter .fixContent span strong{font-size:16px} .office_jp .fixBottom.happyCenter .fixContent small:after{border-left:0} .office_jp #gnb .info .data .name {line-height: 1em;padding-top: 10px} /* 마이 오피스 */ .office_jp .officeMain .controls nav a{top:40px} .office_jp .officeMain .board .list.schedule .content .list3 > li{padding-left:75px} .office_jp .officeMain .board .list.schedule .content .circle{width:60px;height:60px;margin-top:-30px} .office_jp .planList .plans .controls .checkbox + label{font-size:13px} .office_jp .planList .guide .text p strong{font-size:19px;letter-spacing:-1px} .office_jp .planList .guide .btns a{width:250px} .office_jp .rankWrite .guide{font-size:12px} .office_jp .lifeWrite .guide{height:180px} /* Only iPhone 4,5 */ @media screen and (max-width:320px){ .office_jp #gnb .info .setup a{right:10px} .office_jp #gnb .local{margin-top:5px} .office_jp #gnb .local a{padding-left:5px;margin-left:3px;font-size:12px} .office_jp #gnb .myPage li.faq a{line-height:12px;padding-top:43px} .office_jp .tab.markets span:nth-child(1){width:10%} .office_jp .tab.markets span:nth-child(3){width:10%} .office_jp .products .list .info .reconts{margin-top:17px} .office_jp .products .info .price dd strong{font-size:13px} .office_jp .product .detail .row.btns .btn.md{font-size:12px} .office_jp .products .list.sm .right{top:91px} .office_jp .totalPrice .head{font-size:14px} .office_jp .favorite .controls label, .office_jp .cart .controls label, .office_jp .favorite .controls .btn, .office_jp .cart .controls .btn{font-size:12px} .office_jp .favorite .controls .btn, .office_jp .cart .controls .btn{padding:0 5px} .office_jp .cart .row.btns.floating .btn{font-size:12px} .office_jp .favorite .row.btns.floating .btn{font-size:15px} .office_jp .lifeWrite .write .support section .head span{font-size:10px} .office_jp .lifeWrite .write .support section ul{padding-left:10px;padding-right:10px} .office_jp .rankWrite .guide{height:150px} .office_jp .officeMain .box .body dl{width:50%} .office_jp .buy .delivery .tab{width:auto} .office_jp .buyDone #btnShopping{font-size:12px} .office_jp .buyDone .row.sides .itemCount .count .sub{max-width:100px} .office_jp .buyDone .products .list.sm .right{top:95px} } @media screen and (max-width:359px){ .office_jp .products .list .info .thumb.resize{width:90px;height:90px} .office_jp .search .products .list > li > div{padding-left:100px} .office_jp .search .products .list .info .reconts{font-size:12px;margin-top:11px} } .office_jp .signIn .login .box-input{display:block;padding:3px 0} .office_jp .company > .layout{height:45px} .office_jp .company .header{padding-bottom:0;overflow:visible} .office_jp .company .header .content{pointer-events:none} .office_jp .company .header [data-body-id="intro"] .image{background-image:url('http://static.atomy.com/static/images/common/company_head_bg_01.jpg')} .office_jp .company .header [data-body-id="history"] .image{background-image:url('http://static.atomy.com/static/images/common/company_head_bg_02.jpg')} .office_jp .company .header [data-body-id="vision"] .image{background-image:url('http://static.atomy.com/static/images/common/company_head_bg_03.jpg')} .office_jp .company .header [data-body-id="motto"] .image{background-image:url('http://static.atomy.com/static/images/common/company_head_bg_04.jpg')} .office_jp .company .header [data-body-id="social"] .image{background-image:url('http://static.atomy.com/static/images/common/company_head_bg_05.jpg')} .office_jp .company .header [data-body-id="socialShare"] .image{background-image:url('http://static.atomy.com/static/images/common/company_head_bg_05.jpg')} .office_jp .company .header [data-body-id="marketing"] .image{background-image:url('http://static.atomy.com/static/images/common/company_head_bg_07.jpg')} .office_jp .company .header [data-body-id="seminars"] .image{background-image:url('http://static.atomy.com/static/images/common/company_head_bg_08.jpg')} .office_jp .company .header [data-body-id="brand"] .image{background-image:url('http://static.atomy.com/static/images/common/company_head_bg_09.jpg')} .office_jp .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_jp .company .header .content .logo{display:inline-block;position:absolute;left:50%;top:-65px;width:51px;height:44px;margin-left:-25px;background-image:url('http://static.atomy.com/static/images/common/logo_white_102x87.png');background-repeat:no-repeat;background-size:51px auto} .office_jp .company .header .content h1,.office_jp .company .header .content h2{position:relative;z-index:1;opacity:1;padding-bottom:10px} .office_jp .company .header .content h1{font-size:30px;color:#fff;line-height:1.2} .office_jp .company .header .content h2{margin-top:9px;font-size:18px;color:#fff;font-weight:bold} .office_jp .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_jp .company .controller span{display:inline-block;position:absolute;top:inherit;bottom:10px;z-index:1} .office_jp .company .controller span:after{content:'';display:inline-block;position:absolute;top:0;width:62px;height:7px;background-image:url('http://static.atomy.com/kr/m/static/images/common/icon_sprite.png');background-repeat:no-repeat;background-size:360px auto} .office_jp .company .controller .prev{left:15px} .office_jp .company .controller .prev:after{left:0;background-position:-150px -35px} .office_jp .company .controller .next{right:15px} .office_jp .company .controller .next:after{right:0;background-position:-150px -25px} .office_jp .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_jp .company .tab.scroll.dark span{width:33.3333%} .office_jp .company [data-body-id="marketing"] .tab.dark span{vertical-align:top} .office_jp .company [data-body-id="marketing"] .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:45px;line-height:1.4;text-align:center;white-space:normal} .office_jp .company .socialShare{padding-top:291px} .office_jp .seminarInfo .onlineEdu .box.onair .body{padding-right:100px} .fade{transition:opacity 0.25s ease-out;z-index:5 !important} .fade-enter{opacity:1} .fade-leave{opacity:0} /* 상품 리스트 개선 */ .office_jp .products .fix-box{display:flex;flex-direction:column;justify-content:space-between;box-sizing:border-box} .office_jp .products .list .info .fix-box .name,.office_jp .products .list .info .fix-box .name a{height:auto} .office_jp .products .list .info .fix-box .option{margin:2px 0} /* 상품 목록 리스트형 */ .office_jp .shopMain .products .list > li > div{height:auto} /*OP-9244 상품 검색 버튼 위치*/ .office_jp .search .products .list > li > div{height:auto} .office_jp .products .row.quantity select {min-width: 46px;} .office_jp .shopMain .products .list .info .thumb{top:50%;transform:translateY(-50%)} .office_jp .products .list .info .fix-box .name, .office_jp .products .list .info .fix-box .name a{max-height:45px} .office_jp .products .list .info .fix-box{min-height:130px;padding:10px 10px 10px 0} .office_jp .products .list > li > div.beValu .fix-box{min-height:150px} .office_jp .products .list .info .fix-box .fix-bottom:after{content:'';display:block;clear:both} .office_jp .products .list .info .fix-box .price.nomember{margin-top:5px} .office_jp .products .list .info .fix-box .reconts, .office_jp .products .list .info .fix-box .fix-bottom .row{margin-top:0} .office_jp .products .card .info .fix-box .thumb a{padding:10px} .office_jp .products .card .info .fix-box .name, .office_jp .products .card .info .fix-box .name a{max-height:38px;margin:0 0 5px 0} .office_jp .products .card .info .fix-box{height:auto;min-height:145px} .office_jp .products .card .info .fix-box .row{position:relative;margin:5px 0 0;float:none} /*상품 옵션*/ .office_jp .list.options li .row.quantity .btn { top: 50%; transform: translateY(-50%); display:block} .office_jp .list.options .option .row.btns.soldOut.hide {display:none} .office_jp .list.options .option .row.btns.quantity.hide {display:none} /* 상품 상세 */ .office_jp .product .detail .info .name{margin-bottom:0} .office_jp .product .detail .info .tax{display:block;margin-bottom:5px;font-size:11px;color:#999} /* 장바구니, 찜한상품 */ .office_jp .favorite .products .list .info .fix-box{min-height:90px;padding:0} .office_jp .favorite .products .list .info .disable .icon.soldOut01.sm{margin-top:23px} .office_jp .cart .products .list .info .fix-box{min-height:110px;padding:0} .office_jp .cart .products .list .info .fix-box .fix-top{margin-bottom:10px} .office_jp .cart .products .list > li > div{height:auto;padding-bottom:10px} /* 주문 */ .office_jp .buy .products .list.sm > li > div{height:auto} .office_jp .buy .products .list .info .fix-box{min-height:120px} .office_jp .buy .products .list .info .fix-box .fix-top{margin-bottom:10px} .office_jp .buy .products .list.sm .right{top:inherit;bottom:10px} /*외국인 사업자 비자만료 팝업*/ .dialog.passwordTip .layout {top: 20%} .dialog.passwordTip .body {font-size: 13px;} .dialog.passwordTip .btnCloseTooltip.primary {display: block;margin: 20px auto 0;width: 150px} .red {color:red!important;} /* OP-4826 쇼핑몰 하단 버튼 글자 크기 수정*/ .office_jp .shop .row.btns.floating .btn.lg, .office_jp .buy .row.btns .btn.lg, .office_jp .paymentDone .row.btns .btn.lg , .office_jp .buyDone .row.btns .btn.lg {font-size: 15px;line-height: 1.2;} .office_jp .text_l {text-align:left;} .office_jp .findCenter .layout {padding-bottom:55px} .office_jp .favorite .products .list > li > div{height:126px;} @media screen and (max-width:430px) { .office_jp .shop .row.btns.floating .col:first-child .btn.lg .icon.cart2 {display: none;} } /* [OP-5668] */ .easyRegistSponsor { padding-top: 20px; padding-bottom: 20px; background-color: #fff} .easyRegistSponsor .search { vertical-align: middle} .easyRegistForm { padding-top: 20px; padding-bottom: 20px} .easyRegistForm .item { margin-bottom: 10px} .easyRegistForm .label { display: block; margin-bottom: 5px} .easyRegistAccordion .item { margin-top: 5px} .easyRegistAccordion .item:first-child { margin-top: 0} .easyRegistAccordion .head { color: #fff; position: relative; box-sizing: border-box; width: 100%; height: 40px; padding: 0 15px; border-radius: 2px; background-color: #707780bf} .easyRegistAccordion .head:after { content: ''; display: inline-block; position: absolute; right: 15px; top: 50%; width: 5px; height: 8px; margin-top: -4px; background-image: url('https://static.atomy.com/kr/m/static/images/common/icon_sprite.png'); background-position: -195px -10px; background-repeat: no-repeat; background-size: 360px auto} .easyRegistAccordion .body { display: none; padding: 20px} .easyRegistAccordion .sns .head:after { transform: rotate(90deg) } .easyRegistAccordion .sns.active .head:after { transform: rotate(-90deg) } .easyRegistAccordion .sns .body { justify-content: space-around } .easyRegistAccordion .sns a { text-align: center; display: block } .easyRegistAccordion .sns .icon { display: block; margin: 0 auto 10px } .easyRegistAccordion .active .body { display: flex } .searchSponsor { padding: 15px } .searchSponsor .guide { text-align: center; margin-bottom: 15px; padding: 30px } /* 간편회원가입 :후원인 검색 */ .dialog.sponsorSearch .body { background-color: #f1f2f4 } .dialog.sponsorSearch .guide { padding: 15px 15px 20px; background-color: #fff; -webkit-box-shadow: 0 2px 2px rgba(0,0,0,.1); -moz-box-shadow: 0 2px 2px rgba(0,0,0,.1); box-shadow: 0 2px 2px rgba(0,0,0,.1) } .dialog.sponsorSearch .guide .box { margin-bottom: 20px; padding: 15px; text-align: center } .dialog.sponsorSearch .row.each { position: relative; padding-right: 95px; min-height: 40px } .dialog.sponsorSearch .row.each .col:last-child { position: absolute; right: 0; top: 0 } .dialog.sponsorSearch .row.each .col .btn { width: 90px; padding: 0 5px } .dialog.sponsorSearch .result { padding: 25px 20px } .dialog.sponsorSearch .leader { position: relative; width: 190px; margin: 0 auto; padding-bottom: 25px; text-align: center } .dialog.sponsorSearch .leader:after { content: ''; display: inline-block; position: absolute; left: 50%; bottom: 0; height: 25px; border-left: 2px solid #d5d5d5 } .dialog.sponsorSearch .leader dl { width: 160px; margin: 0 auto; padding: 20px 0; background-color: #fefceb; border: 1.5px solid #06a7e2; box-sizing: border-box; text-align: center } .dialog.sponsorSearch .leader dl dt { padding-bottom: 10px; font-size: 16px; color: #333 } .dialog.sponsorSearch .leader dl dd { font-size: 14px; color: #333 } .dialog.sponsorSearch .position { position: relative; padding-top: 27px } .dialog.sponsorSearch .position:before { content: ''; display: inline-block; position: absolute; left: 50%; top: 0; width: 60%; height: 25px; margin-left: -30%; border: 2px solid #d5d5d5; border-bottom: none } .dialog.sponsorSearch .position:after { content: ''; display: block; clear: both } .dialog.sponsorSearch .position dl { position: relative; float: right; width: 40%; padding: 15px 0; box-sizing: border-box; text-align: center; border: 2px solid #d5d5d5; background-color: #fff } .dialog.sponsorSearch .position dl:after { content: ''; display: block; position: absolute; left: 50%; bottom: 100%; width: 0; height: 0; margin-left: -2px; border-style: solid; border-width: 9px 4.5px 0 4.5px; border-color: #d5d5d5 transparent transparent transparent } .dialog.sponsorSearch .position dl:first-child { float: left } .dialog.sponsorSearch .position dl:first-child:after { margin-left: -4.5px } .dialog.sponsorSearch .position dl dt { font-size: 14px } .dialog.sponsorSearch .position dl dd { padding: 0 5px; font-size: 13px; color: #333; word-wrap: break-word; word-break: break-all } .dialog.sponsorSearch .position dl dd em { font-size: 13px; color: #333 } .dialog.sponsorSearch .position dl dd button { width: 100%; font-size: 17px; color: #333 } /*OP-9298 쇼핑몰 메인 Comsoon*/ .office_jp .icon.comSoon{background-image:url('http://static.atomy.com/static/jp/ja-jp/images/common/comingSoon_MO.png'); background-repeat:no-repeat;background-size:360px auto} .office_jp .icon.comSoon.lg{width:103px;height:60px;background-position:-171px 0} .office_jp .products .list .info .disable .icon.comSoon {background-image:url('http://static.atomy.com/static/jp/ja-jp/images/common/comingSoon_MO.png'); background-repeat:no-repeat;background-size:360px auto} .office_jp .products .list .info .disable .icon.comSoon.md{background-position:4px 0} .office_jp .icon.comSoon01{background-image:url('http://static.atomy.com/static/jp/ja-jp/images/common/comingSoon_MO.png'); background-repeat:no-repeat;background-size:360px auto} .office_jp .products .fix-box.start {justify-content:start} /*OP-9298 쇼핑몰 장바구니 Comsoon */ .office_jp .products .icon.comSoon.sm {width:66px;height:38px;margin-top:26px;background-position:-2px -1px; margin-left:5px !important} .office_jp .cart .products .list li.disabled .body{min-height:130px;height:auto} /*OP-10386 회원가입*/ .office_jp .text02.bullet > .fs11 {font-size:11.5px;} /*OP-11653*/ .office_jp .areaPaymentFiserv .FiservBox {border-top: 1px solid #e2e2e2} .office_jp .areaPaymentFiserv .FiservBox .mt3{margin-top:3px} /*OP-11979*/ .office_jp .dialog.cart .selected .select select[name="productQuantity"]{padding-left:72px} /*OP-13089*/ .office_jp .schedule .table thead th:nth-child(1), .office_jp .schedule .table tbody td:nth-child(1) {color:#fc8272;} .office_jp .schedule .table thead th:nth-child(7), .office_jp .schedule .table tbody td:nth-child(7) {color:#73c8ff;} .office_jp .ui-datepicker-calendar th:nth-child(1), .office_jp .ui-datepicker-calendar td:nth-child(1) a {color:#ff5741;} .office_jp .ui-datepicker-calendar th:nth-child(7), .office_jp .ui-datepicker-calendar td:nth-child(7) a {color:#73c8ff;} .office_jp .schedule .tableSemin thead th:nth-child(7), .office_jp .schedule .tableSemin tbody td:nth-child(7) {color:#73c8ff;} .office_jp .qnaList .board .list4 li .head .state, .office_jp .dialog.qna .qnaList .board .list4 li .head .state {height:auto; vertical-align:middle} /*OP-17289*/ .accountEdit .businessno .fix {display:flex; align-items:center} .accountEdit .businessno .fixT{width:20px;text-align:left} .accountEdit .businessnoArea p {font-size: 11px;margin-top: 3px} .accountEdit .businessnoArea p > a {text-decoration:underline} /*OP-13389 LNB 문구 정렬*/ .office_jp #gnb .myPage li.notice a, .office_jp #gnb .myPage li.cart a, .office_jp #gnb .myPage li.benefit a {word-break: break-all} .office_jp #gnb .myPage li a {display: flex;justify-content: center;align-items: center; padding: 38px 5px 0;word-break: keep-all; line-height: 1.2;}