/* Minification failed. Returning unminified contents.
(118,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(119,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(122,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(123,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(128,23): run-time error CSS1039: Token not allowed after unary operator: '-top'
(129,28): run-time error CSS1039: Token not allowed after unary operator: '-top'
(132,20): run-time error CSS1039: Token not allowed after unary operator: '-top'
(140,28): run-time error CSS1039: Token not allowed after unary operator: '-top'
(143,28): run-time error CSS1039: Token not allowed after unary operator: '-top'
(146,38): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(149,26): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(152,30): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(157,30): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(162,26): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(165,28): run-time error CSS1039: Token not allowed after unary operator: '-top'
(168,28): run-time error CSS1039: Token not allowed after unary operator: '-top'
(171,20): run-time error CSS1039: Token not allowed after unary operator: '-top'
(174,20): run-time error CSS1039: Token not allowed after unary operator: '-top'
(177,20): run-time error CSS1039: Token not allowed after unary operator: '-top'
(182,20): run-time error CSS1039: Token not allowed after unary operator: '-top'
(185,20): run-time error CSS1039: Token not allowed after unary operator: '-top'
(191,28): run-time error CSS1039: Token not allowed after unary operator: '-top'
(194,23): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(197,26): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(202,23): run-time error CSS1039: Token not allowed after unary operator: '-top'
(205,20): run-time error CSS1039: Token not allowed after unary operator: '-top'
(208,20): run-time error CSS1039: Token not allowed after unary operator: '-top'
(211,23): run-time error CSS1039: Token not allowed after unary operator: '-top'
(214,37): run-time error CSS1039: Token not allowed after unary operator: '-top'
(217,28): run-time error CSS1039: Token not allowed after unary operator: '-top'
(224,28): run-time error CSS1039: Token not allowed after unary operator: '-top'
(239,31): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(243,28): run-time error CSS1039: Token not allowed after unary operator: '-top'
(249,23): run-time error CSS1039: Token not allowed after unary operator: '-top'
(250,28): run-time error CSS1039: Token not allowed after unary operator: '-top'
(253,20): run-time error CSS1039: Token not allowed after unary operator: '-top'
(256,20): run-time error CSS1039: Token not allowed after unary operator: '-top'
(263,20): run-time error CSS1039: Token not allowed after unary operator: '-top'
(271,27): run-time error CSS1039: Token not allowed after unary operator: '-top'
(274,20): run-time error CSS1039: Token not allowed after unary operator: '-top'
(282,20): run-time error CSS1039: Token not allowed after unary operator: '-top'
(285,38): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(297,38): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(302,38): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(306,38): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(309,30): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(312,37): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(315,37): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(318,30): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(322,30): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(327,38): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(333,30): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(338,30): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(341,37): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(344,30): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(350,38): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(353,37): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(364,52): run-time error CSS1039: Token not allowed after unary operator: '-top'
(365,53): run-time error CSS1039: Token not allowed after unary operator: '-top'
 */
@charset "UTF-8";

@media screen and (min-width:481px) {
	.shopMain .category li {min-width:11%;}
	.tab.my span {width:25%;}
}

/* Only iPhone 4,5 */
@media screen and (max-width:320px) {
	#gnb .paymentApps > li {padding-left:17px;}
	#gnb .footer div {padding-top:3px;}

	.dialog.mobileNav .body .guide {padding-top:9px;}
	.orderHistory .products .controls .select {width:100px;}
	
	.table .btn.md {padding:0 5px;}

    .row.btns.nth-3 .col {width: auto;}
    .row.btns.nth-3 .btn {white-space: nowrap;}

	.lowerSalesList .board .content .item:first-child {width:65%;}
	.lowerSalesList .board .content .item:last-child {min-width:35%;}

	.topBanner .center {padding-right:20px;}
	.topBanner p {font-size:14px;}
	.topBanner .topBannerBtn {margin-left:0;}

	.shopMain.mobile .products .list .info .thumb {width:100px; height:100px;}
	.shopMain.mobile .products .list > li > div {padding-left:120px;}
	.shopMain.mobile .products .card .info .fix {height:152px;}

	.dialog.toCenter.navigation .layout {top:5%; bottom:5%;}

    .buy .delivery .controls {white-space: normal;}
	.buy .table .row.cell2 .col:last-child {width:50%;}
	.buy .table .row.cell2 .col .btn {padding:0 10px;}
	.buy .payment .btns li.item5 .btn {padding:6px 3px 0; vertical-align:middle; line-height:1.2;}
	.buyDone .row.sides .itemCount .sub {max-width:100px;}
	.paymentDone .row.sides .itemCount .sub {max-width:100px;}
	
	.registerGate {padding-bottom:0;}
	.registerGate .join {position:static; padding-top:20px;}
	.registerGate .fixBottom {position:static;}
	.registerGate .fixBottom .fixContent {position:static;}

	.banner.colors a {height:auto; padding-bottom:8px;}
	.banner.colors a strong {display:block;}

    .products .list > li > div {padding-left:100px;}
    .products .list .info .thumb{left:5px;}
    .products .list .info .thumb.resize{width:90px; height:90px}
    .products .list .info .fix{padding-top: 13px; padding-right: 5px; }
    .products .list .info .option {margin-bottom: 0;}
    .products .row.quantity {padding-right:55px;}
    .products .list .info .disable{left:7px;width:85px;height:85px}
    .products .list .info .new {left:55px;}
    .products .list .right {font-size: 12px; letter-spacing:-1px;}

    .favorite .products .list .disable,
    .cart .products .list .disable {left: 45px;}

    .products .list.sm > li > .head, .products .list .head .code {font-size: 12px;}

    .list.options .info .disable { width: 55px; height: 55px; left: 7px;}
    .list.options .info .disable .icon.soldOut01.sm {margin: 0; background-size: 240px auto; width: 45px; height: 30px;}

    .company .socialShare .tabContent.contribution .hotline .title {font-size: 15px;}
    .company .socialShare .tabContent.contribution .hotline .number {font-size: 16px;}

}



/* 가로모드 (iPhone4 기준이상) */
@media screen and (min-width:480px) {
	.dialog.mobileNav .body nav span {/*width:25%;*/}
	.dialog.mobileNav .body nav span a {height:50px; padding-top:16px; font-size:13px;}
	.dialog.mobileNav .body nav span a:after {top:20px;}
    .dialog.mobileNav .body nav span.twoLine a{padding-top:16px !important}
	.dialog.mobileNav .body .guide {height:66px; padding-top:12px;}

	.dialog.toCenter.navigation .layout {top:5%; bottom:5%;}

	.dialog.cart .body {max-height:200px; overflow-y:auto; overflow-x:hidden;}
}

/* Only iPhone4,5 가로모드 */
@media screen and (min-width:480px) and (max-width: 568px) {
	.dialog.cart .body .info {height:57px; padding-left:15px;}
	.dialog.cart .body .info:after {content:''; display:block; clear:both;}
	.dialog.cart .body .info .thumb {display:none;}
	.dialog.cart .body .info .name {display:inline-block; float:left; width:49%;}
	.dialog.cart .body .info .select {float:right; width:49%;}
}

/* Only iPhone4 가로모드 */
@media screen and (min-width:480px) and (max-width: 481px) {
	.dialog.cart .body {max-height:120px;}
}
/* Only iPhone5 가로모드 */
@media screen and (min-width:568px) and (max-width: 569px) {
	.dialog.cart .body {max-height:100px;}
}

/* note 5 */
@media (-webkit-device-pixel-ratio: 3.5) and (min-width: 412px) {	
	.video .dropDown .btn .icon.arrowBottom {margin-top:-5px;}
	.lifeWrite .btn.md  {line-height:35px;}
	.lowerSalesList .headLine button .icon {margin-top:-5px;}
}
@media (orientation: landscape) {
	.ticketPreview .body .fixBottom {position:static; margin-top:20px;}
	.ticketPreview .body .fixContent {position:static;}
}


.ios {
    --top: 20pt;
    --bottom: 0px;
}
.ios.notch {
    --top: 33pt;
    --bottom: 35pt;
}

/* layout */
.ios #header {
    height: calc(var(--top) + 50px);
    padding-top: calc(var(--top) + 12px);
}
.ios #header .btn{
    top: calc(var(--top) + 5px);
}

/*.notch #header {
    height: calc(var(--top) + 50px);
}*/

.ios #body {
    padding-top: calc(var(--top) + 50px);
}
.ios #body.helpdeskMain {
    padding-top: calc(var(--top) + 70px);
}
.notch #body.cart {
    padding-bottom: calc(60px - var(--bottom) + 140px);
}
.notch #body.seminarInfo {
    padding-bottom: var(--bottom);
}
.notch .fixBottom.happyCenter .fixContent {
    height: calc(60px - var(--bottom) + 55px);
}

/* slide-popup */
.notch .slidePopup .slider .indicator.expand{
    bottom: calc(60px - var(--bottom) + 65px);
}

/* gnb */
.notch #gnb {
    padding-bottom: var(--bottom);
}
.ios #gnb .info{
    padding-top: calc(var(--top) + 52px);
}
.ios #gnb .info.nonmember {
    padding-top: calc(var(--top) + 35px);
}
.ios #gnb .info .local {
    top: calc(var(--top) + 11px);
}
.ios #gnb .info .setup a{
    top: calc(var(--top) + 15px);
}
.ios .menuClose {
    top: calc(var(--top) + 17px);
}

/* main */
.ios .gateMain #header .btnMenu {
    top: calc(var(--top) + 6px);
}
.ios .gateMain #header .btns {
    top: calc(var(--top) + 8px);
}
.notch .gateMain #footer .fixContent {
    bottom: 0;
}
.ios .gateMain #body {
    padding-top: calc(var(--top) + 50px);
}
.notch .gateMain #body #footer {
    bottom: calc(var(--bottom) + 18px);
}
.notch .gateMain #nav a {
    padding-bottom: var(--bottom);
}

/* company */
.ios .company > .layout {
    height: calc(var(--top) + 45px);
}
.ios .company > .layout .btnMenu {
    top: calc(var(--top) + 7px);
}
.ios .company > .layout .btnSnb {
    top: calc(var(--top) + 4px);
}
.ios .company .header {
    padding-top: var(--top);
}
.ios .company .header .content{
    transform: translateY(calc(var(--top) + 118px));
}
.ios .company .section{
    padding-top: calc(var(--top) + 291px);
}
.ios .company .marketing,
.ios .company .socialShare,
.ios .company .motto,
.ios .company .vision,
.ios .company .history{
    padding-top: calc(var(--top) + 336px);
}

/* dialog */
.notch .dialog.tutorial .layout {
    padding: 0;
    height: 100%;
}
.notch .dialog.tutorial .layout .body {
    display: flex;
    align-items: center;
    justify-content: center;
}

.notch .dialog.promotions .body {
    padding-bottom: calc(var(--bottom));
}

.ios .dialog.page .layout {
    padding-top: calc(var(--top) + 50px);
}
.ios .dialog.page.noHeader .layout {
    padding-top: 0;
}
.ios .dialog.page .layout header {
    height: calc(var(--top) + 50px);
    padding-top: calc(var(--top) + 9px);
}
.ios .dialog.page .dialogClose {
    top: calc(var(--top) + 16px);
}
.ios .treeLevel.dialog.page .dialogClose {
    top: calc(var(--top) + 8px);
    right: 9px;
}
.ios .treeLevel.dialog.page .dialogClose:after {
    top: 7px;
}
.ios .dialog .dialogPrev {
    top: calc(var(--top) + 16px);
}

.ios .dialog.search #header {
    height: 50px;
    padding-top: 12px;
}
.ios .dialog.search .layout {
    margin-top: calc(var(--top) + 50px);
}
.ios .dialog.search .layout + .dim {
    top: calc(var(--top) + 50px);
    bottom: 0;
}
.ios .dialog.search #body {
    padding-top: 50px;
}

.ios .dialog.mobileGuide.mobileQa .tab {
    top: calc(var(--top) + 50px);
}
.notch .dialog.findProduct .body {
    padding-bottom: calc(60px - var(--bottom));
}
.notch .dialog.findProduct .search {
    position: relative;
}
.notch .dialog.findProduct .search input[type='search']{
    padding-right: 30px;
}
.notch .dialog.findProduct .search .btnDelete{
    right: 0;
}
.notch .snsShare .layout{
    padding-bottom: calc(60px - var(--bottom));
}

/* shop */
.notch #snb {
    padding-bottom: calc(60px - var(--bottom));
}
.notch #footer .fixContent {
    /* bottom: calc(60px - var(--bottom)); */
    padding-bottom: calc(60px - var(--bottom) + 101px);
}
.notch .notice.fixBottom {
    bottom: calc(60px - var(--bottom) + 171px);
}
.notch .products .list {
    margin-bottom: calc(60px - var(--bottom));
}
.notch .shopMain .btnMore {
    margin-bottom: calc(60px - var(--bottom) + 20px);
}
.notch .fixBottomBtn {
    bottom: calc(60px - var(--bottom) + 65px);
}
.notch .buy ~ .fixBottomBtn,
.notch .product ~ .fixBottomBtn {
    bottom: calc(60px - var(--bottom) + 75px);
}
.notch .row.btns .col,
/*.ios .row.btns.floating,*/
.notch .noticeDetail .row.btns.margin.floating.box {
    padding-bottom: calc(60px - var(--bottom));
}
.notch .row.btns .col:first-child:last-child {
    padding-bottom: 0;
}
.notch .row.btns.floating {
    height: calc(60px - var(--bottom) + 70px);
}
.notch .favorite .row.btns.floating {
    height: 70px;
    padding-bottom: 0;
    bottom: calc(60px - var(--bottom) + 60px);
}
.notch .buy .agreement {
    margin-bottom: calc(60px - var(--bottom));
}
.notch .buy .row.btns.btnScroll {
    height: calc(60px - var(--bottom) + 70px);
}


/* myoffice */
.notch .planList .plans {
    padding-bottom: calc(60px - var(--bottom));
}
.notch .lowerSalesList .guide{
    margin-bottom: calc(60px - var(--bottom));
}

/* paynowBiz */
.notch .paymentMethod.dialog .layout .body ul li:last-child {
    padding-bottom: 15px;
}



/*리뉴얼 랜딩 페이지*/
.notch .renewal-landing #renewalLang{top:calc(var(--top) + 15px) !important}
.notch .renewal-landing #container{padding-top:var(--top)}