/* Minification failed. Returning unminified contents.
(202,46): run-time error CSS1036: Expected expression, found ';'
(387,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(388,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(391,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(392,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(397,23): run-time error CSS1039: Token not allowed after unary operator: '-top'
(398,28): run-time error CSS1039: Token not allowed after unary operator: '-top'
(401,20): run-time error CSS1039: Token not allowed after unary operator: '-top'
(409,28): run-time error CSS1039: Token not allowed after unary operator: '-top'
(412,28): run-time error CSS1039: Token not allowed after unary operator: '-top'
(415,38): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(418,26): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(421,30): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(426,30): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(431,26): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(434,28): run-time error CSS1039: Token not allowed after unary operator: '-top'
(437,28): run-time error CSS1039: Token not allowed after unary operator: '-top'
(440,20): run-time error CSS1039: Token not allowed after unary operator: '-top'
(443,20): run-time error CSS1039: Token not allowed after unary operator: '-top'
(446,20): run-time error CSS1039: Token not allowed after unary operator: '-top'
(451,20): run-time error CSS1039: Token not allowed after unary operator: '-top'
(454,20): run-time error CSS1039: Token not allowed after unary operator: '-top'
(460,28): run-time error CSS1039: Token not allowed after unary operator: '-top'
(463,23): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(466,26): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(471,23): run-time error CSS1039: Token not allowed after unary operator: '-top'
(474,20): run-time error CSS1039: Token not allowed after unary operator: '-top'
(477,20): run-time error CSS1039: Token not allowed after unary operator: '-top'
(480,23): run-time error CSS1039: Token not allowed after unary operator: '-top'
(483,37): run-time error CSS1039: Token not allowed after unary operator: '-top'
(486,28): run-time error CSS1039: Token not allowed after unary operator: '-top'
(493,28): run-time error CSS1039: Token not allowed after unary operator: '-top'
(508,31): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(512,28): run-time error CSS1039: Token not allowed after unary operator: '-top'
(518,23): run-time error CSS1039: Token not allowed after unary operator: '-top'
(519,28): run-time error CSS1039: Token not allowed after unary operator: '-top'
(522,20): run-time error CSS1039: Token not allowed after unary operator: '-top'
(525,20): run-time error CSS1039: Token not allowed after unary operator: '-top'
(532,20): run-time error CSS1039: Token not allowed after unary operator: '-top'
(540,27): run-time error CSS1039: Token not allowed after unary operator: '-top'
(543,20): run-time error CSS1039: Token not allowed after unary operator: '-top'
(551,20): run-time error CSS1039: Token not allowed after unary operator: '-top'
(554,38): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(566,38): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(571,38): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(575,38): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(578,30): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(581,37): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(584,37): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(587,30): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(591,30): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(596,38): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(602,30): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(607,30): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(610,37): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(613,30): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(619,38): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
(622,37): run-time error CSS1039: Token not allowed after unary operator: '-bottom'
 */
@charset "UTF-8";

.icon.menu {display:inline-block; width:20px; height:17px; background-position:0 -25px; background-image:url('/static/images/common/layout_sprite.png');}
.noTouchmove .company {height:100vh; overflow:auto; -webkit-overflow-scrolling:touch;}
.company::-webkit-scrollbar {display:none;}

.company > .layout {position:fixed; left:0; top:0; z-index:10; width:100%; height:291px; box-sizing:border-box; overflow:hidden;}
.company > .layout .btn {position:absolute; top:3px; padding:10px;}
.company > .layout .btnPrev {left:8px; top:7px;}
.company > .layout .btnMenu {left:8px; top:7px;}
.company > .layout .btnSnb {display:none; right:8px; top:4px;}
.company > .layout .btn .icon {vertical-align:top;}
.company > .layout .btn .menu {width:23px; height:18px; background-position:-205px -50px;}
/* #492 변경*/
.company > .layout .controller span {display:inline-block; position:absolute; bottom:15px;}
.company > .layout .controller span:after {content:''; display:inline-block; position:absolute; top:0; width:62px; height:7px; background-image: url('/static/images/common/icon_sprite.png'); background-repeat:no-repeat; background-size: 360px auto;}
.company > .layout .controller .prev {left:15px;}
.company > .layout .controller .prev:after {left:0; background-position:-150px -35px;}
.company > .layout .controller .next {right:15px;}
.company > .layout .controller .next:after {right:0; background-position:-150px -25px;}
.company > .layout .controller span a {display:inline-block; min-width:62px; padding-top:11px; font-size:12px; color:rgba(255,255,255,.8); text-align:center;}


.company .section {padding-top:291px; padding-bottom:60px;}
.company .header {position:fixed; top:0; right:0; left:0; z-index:4; overflow:hidden; height:291px; padding-top:0; padding-bottom:45px;}
.company .header .slick-slider,
.company .header .slick-list,
.company .header .slick-track {height:100%; padding-bottom:45px; box-sizing:content-box;}
.company .header .slider {overflow:visible;}
.company .header .slick-slider {}
.company .layout .slick-disabled {display:none !important;}
.company .header .image {background-repeat:no-repeat; background-position:50% 50%; background-size:cover;}
.company .header [data-body-id="intro"] .image {background-image:url('/static/images/common/company_head_bg_01.jpg');}
.company .header [data-body-id="history"] .image {background-image:url('/static/images/common/company_head_bg_02.jpg');}
.company .header [data-body-id="vision"] .image {background-image:url('/static/images/common/company_head_bg_03.jpg');}
.company .header [data-body-id="motto"] .image {background-image:url('/static/images/common/company_head_bg_04.jpg');}
.company .header [data-body-id="social"] .image {background-image:url('/static/images/common/company_head_bg_05.jpg');}
.company .header [data-body-id="rightpeople"] .image {background-image:url('/static/images/common/company_head_bg_06.jpg');}
.company .header [data-body-id="marketing"] .image {background-image:url('/static/images/common/company_head_bg_07.jpg');}
.company .header [data-body-id="seminar"] .image {background-image:url('/static/images/common/company_head_bg_08.jpg');}
.company .header [data-body-id="brand"] .image {background-image:url('/static/images/common/company_head_bg_09.jpg');}
/**/
.company .header .slider .content {position:absolute; left:0; right:0; top:0; z-index:1; text-align:center; -webkit-transform:translateY(118px); transform:translateY(118px);}
.company .header .slider .content .logo {display:inline-block; position:absolute; left:50%; top:-65px; width:51px; height:44px; margin-left:-25px; background-image: url('/static/images/common/logo_white_102x87.png'); background-repeat:no-repeat; background-size: 51px auto;}
.company .header .slider .content h1,
.company .header .slider .content h2 {position:relative; z-index:1; opacity:1; padding-bottom:10px;}
.company .header .slider .content h1 {font-size:30px; color:#fff; line-height:1.2;}
.company .header .slider .content h2 {margin-top:9px; font-size:18px; color:#fff; font-weight:bold;}
.company .header .slider .content h1:after {content:''; display:inline-block; position:absolute; left:50%; bottom:0; width:26px; margin-left:-13px; border-top:1px solid #fff;}
.company .header .clone {color:#fff; font-size:13px; opacity:0; transform:translateY(100%);}
.company .header .clone br {display:none;}
.company .header .image {position:absolute; top:0; bottom:0; left:0; width:100%;}
.company .header .image img {position:absolute; top:0; left:50%; width:auto; height:100%; -webkit-transform:translateX(-50%); transform:translateX(-50%);}
.company .header .tab {position:absolute; top: 100%; left:0; z-index:5; width:100%;}

/*::-webkit-scrollbar {
    height: 3px;
}
::-webkit-scrollbar-thumb {
    border-radius: 0;
    background: #c4c7cc;
    height: 1px;
}*/

.company .body h2.hide + .content {margin-top:30px;}

/* #492 추가
.company .header .controller span {display:inline-block;position:absolute; bottom:8px; z-index:5; width:100%;}
.company .header .controller span:after {content:''; display:inline-block; position:absolute; top:0; width:62px; height:7px; background-image: url('/static/images/common/icon_sprite.png'); background-repeat:no-repeat; background-size: 360px auto;}
.company .header .controller .prev {left:15px;}
.company .header .controller .prev:after {left:0; background-position:-150px -35px;}
.company .header .controller .next {right:15px;text-align:right}
.company .header .controller .next:after {right:0; background-position:-150px -25px;}
.company .header .controller span a {display:inline-block; top:0; min-width:62px; padding-top:11px; font-size:12px; color:rgba(255,255,255,.8); text-align:center;}
 */
/*
*/
.transition .company .header,
.transition .company .layout,
.transition .company .header .content,
.transition .company .header .content h1,
.transition .company .header .content h2,
.transition .company .header .content .logo,
.transition .company .header .content .clone {
	-webkit-transition:height 0.2s, opacity 0.2s, -webkit-transform 0.2s;
	transition:height 0.2s, opacity 0.2s, transform 0.2s;
}

.company.app .layout .btnPrev {top:42px;}
.company.app .layout .btnSnb {top:38px;}
.company.app .layout nav span {bottom:15px;}
.company.app .header {padding-top:291px;}
.company.app .header .slider > div {top:53px;}

.company .video {position: relative;}
/*.company .video iframe {pointer-events: none;}*/
/*.company .video-wrap:after {content:''; position:absolute; top:0; bottom:43px; left:0; display:block; width:100%;}
.company .video-wrap.play:after {display:none;}*/

.company #content {position:relative;}
.company .tab.dark {display:none;}
.company .slick-active .tab.dark {display:table;}
.company .slick-active .tab.dark.scroll {display:block;}
.company .tab.dark span.active a {color:#64d0f4; border-bottom:3px solid #64d0f4;}
.company .verticalLine {position:relative; padding-left:19px;}
.company .verticalLine:after {content:''; position:absolute; left:0; top:2px; width:4px; height:28px; background-color:#333;}

.company .marketing,
.company .socialShare,
.company .motto,
.company .vision,
.company .history {padding-top:336px;}

/* 개요 */
.company .section.intro .header {}
.company .section.intro .content > p,
.company .section.intro .content .video {margin-top:28px;}

.company .tabContent {margin-top:30px;}
.history .tabContent p {margin-top:5px;}
.history .tabContent .record .list {overflow:hidden;}
.history .tabContent .record .list li {position:relative;}
.history .tabContent .record .list li .month {position:absolute; left:0; top:0; padding-top:8px; line-height:1.3; font-size:12px; font-weight:bold;}
.history .tabContent .record .list li .month:after {content:''; display:inline-block; position:absolute; left:24px; top:12px; z-index:1; width:6px; height:6px; border-radius:50%; background-color:#707780;}
.history .tabContent .record .list li.etc .month:after {content:none;}
.history .tabContent .record .list li .content {position:relative; padding-left:40px; line-height:1.4; font-size:12px; color:#333;}
.history .tabContent .record .list li .content:after {content:''; display:inline-block; position:absolute; left:26px; top:18px; height:100%; border-left:1px solid #c9c9c9;}
.history .tabContent .record .list li .content li {padding-top:8px;}
.history .tabContent .record .list.primary {margin:15px 0 25px;}
.history .tabContent .record .list.primary li .month {font-size:14px;}
.history .tabContent .record .list.primary li .month:after {background-color:#00b6f0;}
.history .tabContent .record .list.primary li .content {font-size:14px;}
.history .tabContent .record .list.primary li .content:after {border-left:1px solid #b2e9fa;}
.history .tabContent .record .list.primary li:last-child .content:after {display:none;}
/*.history .tabContent .record .list li:first-child .month {padding-top:0;}
.history .tabContent .record .list li:first-child .content li:first-child {padding-top:0;}
.history .tabContent .record .list.primary li:last-child .content:after {content:none;}*/

.company .section.vision {font-size:14px;}
.company .section.vision hr {margin:30px 0;}
.company .section.vision .content:nth-of-type(1) {padding-top:0;}
.company .section.vision .content p {margin-top:20px;}
.company .section.vision .content .color1 {color:#d15555;}
.company .section.vision .content .color2 {color:#3b73d9;}
.company .section.vision .content .color3 {color:#538a13;}
.company .section.vision hr {margin:30px 0;}

.company .motto .tabContent {margin-top:30px;}
.company .motto .tabContent hr {margin:30px 0;}
.company .motto .tabContent .content {margin-top:30px;}
.company .motto .tabContent .content small {display:block; margin-top:2px; font-size:15px;}
.company .motto .tabContent .content > p {margin-top:20px;}
.company .motto .tabContent .video {position:relative; margin-top:7px;}
.company .motto .verticalLine:after {height:80px; top:5px;}

.company .socialShare {font-size:14px;}
.company .socialShare .verticalLine:after {height:93%; top:5px;}
.company .socialShare .green {color:#78b17d;}
.company .socialShare .violet {color:#7a5f94;}
.company .socialShare .tab {margin-bottom:30px;}
.company .socialShare .tabContent hr {margin:30px 0;}
.company .socialShare .tabContent .content {margin-top:30px;}
.company .socialShare .tabContent .content small {display:block; margin-top:3px; font-size:15px;}
.company .socialShare .tabContent .content .dash {margin-top:10px;}
.company .socialShare .tabContent .content .dash li {margin-top:5px;}
.company .socialShare .tabContent .content .dash li:first-child {margin-top:0;}
.company .socialShare .tabContent.growth .image {display:inline-block; width:229px; height:219px;}
.company .socialShare .tabContent figure {margin:13px 0 15px;}
.company .socialShare .tabContent figure p {margin-top:4px; font-size:9px;}
.company .socialShare .tabContent .gallery {margin-top:15px; padding:15px;}
.company .socialShare .tabContent .gallery .body small {margin-top:0; font-size:12px; color:#7f8792;}
.company .socialShare .tabContent .slider {min-height:150px;}
.company .socialShare .tabContent .slider .listSlide {position:static;}
.company .socialShare .tabContent .slider .listSlide .item .image {overflow:hidden; text-align:center; vertical-align:middle;}
.company .socialShare .tabContent .slider .listSlide .item .image img {display:inline-block;}
.company .socialShare .tabContent .slider .listSlide .item .caption {margin-top:10px; }
.company .socialShare .tabContent .slider .controls {top:0; padding-top:21%;}
.company .socialShare .tabContent.contribution .content > p {margin-top:5px;}
.company .socialShare .tabContent.contribution .video {margin-top:16px;}


.company .tabContent .slider .listSlide {display:none; position:static;}
.company .tabContent .slider .listSlide.slick-slider {display:block;} 

.company .recruit hr {margin:30px 0;}
.company .recruit .content {margin-top:20px;}
.company .recruit .content .body,
.company .recruit .content p {margin-top:5px;}
.company .recruit .content .dash {line-height:1.8;}
.company .recruit .iconList {}
.company .recruit .iconList li {margin-top:20px;}
.company .recruit .iconList li .head {position:relative; margin-bottom:15px; padding-left:72px; line-height:1.2;}
.company .recruit .iconList li .head:after {content:''; display:inline-block; position:absolute; left:0;  background-image:url('/static/images/common/recruit_icons.png'); background-repeat:no-repeat; background-size:360px auto;}
.company .recruit .iconList li .head.icon01:after {width:48px; height:52px; top:0; background-position:0 0;}
.company .recruit .iconList li .head.icon02:after {width:45px; height:48px; top:0; background-position:-50px 0;}
.company .recruit .iconList li .head.icon03:after {width:52px; height:44px; top:3px; background-position:-100px 0;}
.company .recruit .iconList li .head.icon04:after {width:46px; height:38px; top:6px; left:5px; background-position:-155px 0;}
.company .recruit .iconList li p {margin-top:5px;}

.company .marketing .guide {margin:15px 0; padding:20px 5px; text-align:center;}
.company .marketing .guide h3 {margin-bottom:5px;}
.company .marketing .ratings .plans {padding:;}
.company .marketing .ratings .plans .rank {position:relative; min-height:80px;}
.company .marketing .ratings .plans .rank:before {content:''; display:inline-block; position:absolute; left:40px; top:0; height:130%; border-left:1px solid #c9c9c9;}
.company .marketing .ratings .plans .rank + .rank {margin-top:15px;}
.company .marketing .ratings .plans .rank:last-child:before {content:none;}
.company .marketing .ratings .plans .rank:after {content:''; display:block; clear:both;}
.company .marketing .ratings .plans .rank .head {width:80px; height:80px; padding:28px 0 0; position:absolute; left:0; top:0; line-height:1.4; font-size:14px; color:#333; text-align:center; background-color:#fff; border-radius:50%; box-sizing:border-box;}
.company .marketing .ratings .plans .rank .head strong {display:block;}
.company .marketing .ratings .plans .rank .content {position:relative; float:right; width:70%; min-height:87px; margin-top:2px; padding:0 20px 15px; background-color:#fff; border:1px solid #e2e2e2; border-radius:2px; box-sizing:border-box;}
.company .marketing .ratings .plans .rank .content p {margin-top:13px; font-size:13px; color:#333;}
.company .marketing .ratings .plans .rank .content:before,
.company .marketing .ratings .plans .rank .content:after {content:''; display:inline-block; position:absolute; top:30px; border-top:6px solid transparent; border-bottom:6px solid transparent; border-left:0;}
.company .marketing .ratings .plans .rank .content:before {left:-10px; border-right:10px solid #e2e2e2;}
.company .marketing .ratings .plans .rank .content:after {left:-8px; border-right:10px solid #fff;}
.company .marketing .ratings .plans .rank.color1 .head {border:3px solid #c6edfb;}
.company .marketing .ratings .plans .rank.color2 .head {border:3px solid #96def6;}
.company .marketing .ratings .plans .rank.color3 .head {border:3px solid #6ed4f5;}
.company .marketing .ratings .plans .rank.color4 .head {border:3px solid #59d0f6;}
.company .marketing .ratings .plans .rank.color5 .head {border:3px solid #00b6f0;}

.company .marketing .benefit {}
.company .marketing .benefit section + section {margin-top:20px;}
.company .marketing .benefit section .bullet {margin-top:5px;}
.company .marketing .benefit .table tbody td{text-align:center;}
.company .marketing .benefit .board .list li .content {padding:15px; font-size:13px; color:#333;}
.company .marketing .benefit .board .list li .content .box.primary {margin-top:15px; padding:12px 14px; font-size:12px;}
.company .marketing .promotion section {margin-top:25px;}
.company .marketing .promotion .table {margin-top:5px;}
.company .marketing .promotion .table tbody th, 
.company .marketing .promotion .table tbody td {padding:10px;}
.company .marketing .promotion .box.default {margin-top:15px; padding:15px;}
.company .marketing .promotion .box.default .dash li {margin-top:4px; font-size:13px; color:#333;}

.company .seminars .body {padding-top:30px;}
.company .seminars .body .summary {margin-top:15px;}
.company .seminars .body section {margin:25px 0 30px;}
.company .seminars .body section .text17 {margin-bottom:10px;}
.company .seminars .body section .box.primary {margin:12px 0; padding:10px; font-size:13px;}
.company .seminars .body section .bullet {margin-bottom:5px;}
.company .seminars .body section .color1 {color:#59b2c2;}
.company .seminars .body section .color2 {color:#f9993b;}
.company .seminars .body section .color3 {color:#5bc28d;}
.company .seminars .body section .color4 {color:#8781bd;}

.company .brand .body {position:relative;}
.company .brand .body section {margin:10px 0 30px;}
.company .brand .body section ul li {position:relative; margin-top:5px; padding-left:9px; font-size:12px; color:#333;}
.company .brand .body section ul li:after {content:''; display:block; width:3px; height:3px; position:absolute; left:0; top:7px; background-color:#707780;}
.company .brand .body section .image{margin-top:15px;}
.company .brand .marks {position:absolute; right:15px; top:5px; font-size:11px;}
.company .brand .marks > span {position:relative; padding-left:10px; margin-left:3px;}
.company .brand .marks span:first-child:after {content:none;}
.company .brand .marks span:after {content:''; display:inline-block; position:absolute; left:0; top:4px; height:9px; border-left:1px solid #e2e2e2;}
.company .brand .mark {display:inline-block; width:8px; height:8px; border-radius:50%; font:0/0 a; box-sizing:border-box; vertical-align:top; -webkit-transform:translateY(50%); transform:translateY(50%);}
.company .brand .mark.orange {background-color:#f9993b;}
.company .brand .mark.green {background-color:#a1b404;}
.company .brand .mark.violet {background-color:#8958fe;}

.company .brand .consTit{padding:10px;font-size:14px}
.company .brand .body section dl{margin-top:16px;line-height:20px;color:#333;}
.company .brand .body section dl dt{float:left;display:inline-block;margin-top:2px;font:0/0 a;text-align:center;width:28px;height:26px;background-image:url('/kr/m/static/images/common/icon_brand.png');background-repeat:no-repeat; background-size:250px auto; pointer-events:none;}
.company .brand .body section dl dd{margin-left:34px;font-size:14px}
.company .brand .body section dl dd p:first-child{font-weight:bold;font-size:16px}
.company .brand .body section dl dt.health{background-position:0 0;}
.company .brand .body section dl dt.skincare{background-position:-30px 0;}
.company .brand .body section dl dt.makeup{background-position:-60px 0;}
.company .brand .body section dl dt.hair{background-position:-90px 0;}
.company .brand .body section dl dt.living{background-position:-120px 0;}
.company .brand .body section dl dt.food{background-position:-150px 0;}
.company .brand .body section dl dt.fashion{background-position:-180px 0;}

.company .slider .controls button {-webkit-transform:translateZ(0); transform:translateZ(0);}
@charset "UTF-8";

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

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

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

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

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

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

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

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

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

    .products .list > li > div {padding-left:100px;height:126px;}
    .products .list .info .thumb{left:5px;top:10px;}
    .products .list .info .thumb.resize{width:90px; height:90px}
    .products .list .info .fix{padding:13px 5px 0 0;}
    .products .list .info .reconts {margin-top: 11px;}
    .products .list .info .price strong {font-size: 15px;}
    .products .info .price dd {font-size: 12px;}
    .products .row.quantity {padding-right:55px;}
    .products .list .info .disable{left:7px;top:22px;width:85px;height:85px}
    .products .list .info .new {left:55px;}
    .products .card .info .disable {top:15px;}

    .favorite .products .list .info .thumb {top:7px;}
    .favorite .products .list .info .disable {left: 45px; top: 15px;}
    
    .favorite .products .list .disable,
    .cart .products .list .disable {left: 45px;}

    .list.options .info .fix {padding: 0;}
}



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

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

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

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

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

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




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

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

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

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

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

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

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

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

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

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

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

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

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

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


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

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



/* Slider */
.slick-slider
{
    position: relative;

    display: block;

    -moz-box-sizing: border-box;
         box-sizing: border-box;

    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;

    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
        touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}

.slick-list
{
    position: relative;

    display: block;
    overflow: hidden;

    margin: 0;
    padding: 0;
}
.slick-list:focus
{
    outline: none;
}
.slick-list.dragging
{
    cursor: pointer;
    cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list
{
    -webkit-transform: translate3d(0, 0, 0);
       -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
         -o-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
}

.slick-track
{
    position: relative;
    top: 0;
    left: 0;

    display: block;
}
.slick-track:before,
.slick-track:after
{
    display: table;

    content: '';
}
.slick-track:after
{
    clear: both;
}
.slick-loading .slick-track
{
    visibility: hidden;
}

.slick-slide
{
    display: none;
    float: left;

    height: 100%;
    min-height: 1px;
}
[dir='rtl'] .slick-slide
{
    float: right;
}
.slick-slide img
{
    display: block;
}
.slick-slide.slick-loading img
{
    display: none;
}
.slick-slide.dragging img
{
    pointer-events: none;
}
.slick-initialized .slick-slide
{
    display: block;
}
.slick-loading .slick-slide
{
    visibility: hidden;
}
.slick-vertical .slick-slide
{
    display: block;

    height: auto;

    border: 1px solid transparent;
}