@CHARSET "euc-kr";
@import url('default.css');
@import url('common.css');
@import url('layout.css');

/* main */
#mainVisualArea {position:relative; width:100%; overflow:hidden; }
#mainVisualArea .swiper-slide img {width:100%;} 
#mainVisualArea .main-pagination {position:absolute; right:13px; top:16px; z-index:10;}

.mainBtnArea a { display: block; width: 100%; text-align: center; color: #fff; background: #000; padding: 30px 16px;}
.mainBtnArea a img { width: 85%; }
.mainBannerArea { margin-top: 100px; }
.mainBannerArea a {display:block; margin: 0 auto 50px; }
.mainBannerArea a img {width:100%;}

.mainSection {position:relative; text-align:center;}
.mainSection strong {position:relative; display:block; height:37px; background:#000; text-align:center; font-size:16px; color:#fff; line-height:37px; background:#000;}
.mainSection strong img {position:absolute; left:0; top:0; right:0; bottom:0; margin:auto;}
.mainSection .btnSectionMore {display:inline-block; position:absolute; right:3px; top:0; height:37px; width:37px;}
.mainSection .btnSectionMore img {position:absolute; left:0; top:0; right:0; bottom:0; margin:auto;}
.mainNews {position:relative; height:37px; padding:0 60px 0 80px;}
.mainNews strong {display:block; position:absolute; left:15px; top:50%; margin-top:-9px; line-height:18px;}
.mainNews strong:after {content:"|"; display:inline-block; margin-left:5px;}
.mainNews a.txt {display:inline-block; line-height:37px; font-size:11px;} 
.mainNews .btnSectionMore {display:inline-block; position:absolute; right:3px; top:0; height:37px; width:37px;}
.mainNews .btnSectionMore img {position:absolute; left:0; top:0; right:0; bottom:0; margin:auto;}


/*  */
.noticeList {}
.noticeList li {border-bottom:1px solid #efefef;}
.noticeList li a {position:relative; display:table; padding:10px 0 10px 90px; width:100%; min-height:80px;}
.noticeList li .icon {position:absolute; left:15px; top:50%; margin-top:-23px; width:45px; height:45px; border-radius:100%; background:#323337; font-size:12px; color:#fff; line-height:45px; text-align:center;}
.noticeList li .cont {display:table-cell; vertical-align:middle;}
.noticeList li .cont p {padding-bottom:7px; font-size:12px; color:#333; line-height:16px;}
.noticeList li .cont span {color:#666; font-size:12px;}


/* what's new */
.whatNewWrap {}
.whatNewWrap .selectArea {padding:15px 0 20px;}
.whatNewWrap .selectArea select {height:30px; padding:0 5px; border:1px solid #d6d6d6; background:#fff; color:#666; font-size:11px;}
.whatNewWrap .newContArea {position:relative;}
.whatNewWrap .newContArea .btnExpansion {position:absolute; top:-13px; right:-5px;}
.whatNewWrap .newCont table,
.whatNewWrap .newCont div,
.whatNewWrap .newCont p	{width:100% !important; text-align:center;}
.whatNewWrap .newCont img	{width:100%;}
.whatNewWrap .newCont a[name] {display:none;}
#layerExpansion {position:absolute; left:0; top:0; width:100%; z-index:50000; background:rgba(0,0,0,.8)}


/* online stamp */
.onlineStampCare {padding-top:15px;}


/* event */
#eventListArea {padding-top:15px;} 
	.eventList li {margin-top:15px;}
	.eventList li img {width:100%;}
	.eventList li .dateArea {padding:9px 0 9px 0; /* border:1px solid #ddd; border-top:none; */ color:#666; line-height:12px; font-size:11px;}
	.eventList li .dateArea strong {display:inline-block; width:76px; margin-right:8px; border-right:1px solid #999; color:#000; font-weight:bold; text-align:center; font-size:11px; lnie-height:12px;}
	.eventList li.noImg	{padding:30px 0; text-align:center;}
	.eventList li.noImg img {width:auto;}
	
/* product */
.productIndexList {padding-top:30px; *zoom:1; display: flex; justify-content: flex-start; flex-wrap: wrap; margin: 0 auto; width: calc(100vw - 20px); }
.productIndexList:after {content:""; display:block; clear:both;}
.productIndexList li { margin-right: 3.5vw; width:30%; margin-bottom:5%; padding:0 5px; }
/* .productIndexList li:first-child {margin-right:0;}  */
.productIndexList li:nth-child(3n) {margin-right:0;}

.productList {}
.productList ul	 {}
.productList ul li	{border-bottom:1px solid #efefef;}
.productList ul li > div	{display:table; position:relative; min-height:100px; padding:12px 20px 12px 115px;}
.productList ul li .thumb	{position:absolute; left:10px; top:50%; width:76px; height:88px; margin-top:-44px; }
.productList ul li a {display:table-cell; vertical-align:middle;}
.productList ul li a strong {display:inline-block; font-size:12px; color:#333; line-height:16px;}
.productList ul li a p {padding-top:5px; color:#666; font-size:12px; line-height:16px;}

.pdtDetail {padding:15px 6px 0;}
.pdtDetail .bigThum	 {position:relative;text-align:center;padding:20px 0; border:1px solid #d6d6d6;}
.pdtDetail .titArea {padding:13px 20px 0 6px;}
.pdtDetail .titArea strong.tit {color:#333; font-size:17px; line-height:20px;}
.pdtDetail .titArea p.cont {padding-top:5px; color:#666; font-size:14px; line-height:16px; letter-spacing:-1px;}
.pdtDetail .sns {padding-top:10px; text-align:right;}
.pdtDetail .tabTypeA { display: flex; justify-content: center; }
.pdtDetail .tabTypeA li {width:33.3%;}
.pdtDetail .tabTypeA li:first-child {width:33.4%;}
.pdtDetail .article	{clear:both;padding:15px 6px 0;text-align:left;line-height:1.5em;}
.pdtDetail .article:after	{ content:""; display:block; clear:both; }
.pdtDetail .section	{padding:0 0 5px;color:#888;line-height:1.4em !important;}
.pdtDetail .section p	{color:#888 !important; line-height:1.4em !important;}
.pdtDetail .section strong.tit	{display:block; padding:10px 0;}
.pdtDetail .section ul.featureArea	{width:320px;}
.pdtDetail .section ul.featureArea:after	{content:""; display:block; clear:both;}
.pdtDetail .section ul.featureArea li	{float:left;width:68px;margin-right:47px;}
.pdtDetail .section ul.featureArea li span.thum	{display:block;width:66px;height:64px;padding:3px 1px 2px;background:url('/mobile_app_201703/images/product/bg_product.gif') no-repeat 0 0;}
.pdtDetail .section ul.featureArea li span	{display:block;font-weight:bold;font-size:12px;color:#08aaf2;text-align:center;}
.pdtDetail .section ul.featureArea li img	{display:block;width:66px;height:63px;}
.pdtDetail .btnMore {padding-top:15px; text-align:center;}
.herbList	{width:100%;overflow:hidden}
	.herbList li	{position:relative; display:inline-block; padding:0 0 20px; width:33.3%; vertical-align:top; overflow:hidden}
	.herbList dt	{padding-top:7px;font-size:12px;line-height:1.4em;font-weight:bold;color:#08aaf2;text-align:center;}
	.herbList dt a	{color:#08aaf2;}
	.herbList dd	{display:none}
	.herbList dd.thumb	{ display:block; width:68px;height:68px;padding:3px;border:1px solid #efefef; margin:0 auto;}
 
.reviewList {margin-top:25px; border-top:1px solid #5e6066;}
.reviewList li {position:relative; padding:15px 0 0 0; border-bottom:1px solid #efefef;}
.reviewList li strong.tit {display:block; padding-bottom:6px; font-size:14px; line-height:18px;}
.reviewList li .star {display:inline-block; line-height:15px; font-size:12px; vertical-align:middle;}
.reviewList li .date {display:inline-block; line-height:15px; font-size:12px; vertical-align:middle; color:#8d8d8d;}
.reviewList li .userid {display:block; padding-bottom:10px; font-size:12px; color:#3bafeb; line-height:15px;}
.reviewList li .btnArea {position:absolute; right:0; top:42px; padding:0;}
.reviewList li .cont {display:none; padding:10px 15px; background:#f6f6f6; color:#666666; line-height:17px; font-size:12px; border-top:1px solid #efefef;}

.reviewWrite {}
.reviewWrite .section {padding:10px 6px 15px 6px; border-bottom:1px solid #efefef;}
.reviewWrite .section strong.tit {display:block; padidng:5px 0 3px 0; font-size:12px; color:#333; font-weight:bold;}
.reviewWrite .section .divi {padding-top:5px; *zoom:1;}
.reviewWrite .section .divi:after {content:""; display:block; clear:both;}
.reviewWrite .section select {width:100%; height:30px; padding:0 10px; border:1px solid #d6d6d6; font-size:11px; color:#666;}
.reviewWrite .section input[type=text] {width:100%;  height:30px; padding:0 10px; border:1px solid #d6d6d6; line-height:28px; font-size:11px; color:#666;}
.reviewWrite .section textarea {width:100%; height:200px; padding:6px 10px; border:1px solid #d6d6d6; line-height:16px; font-size:11px; color:#666;}
.reviewWrite .infoTxtList {padding:10px 0; border-bottom:1px solid #efefef;}

.storeWrap .searchFrom {padding-top:15px;} 
.storeWrap .searchFrom .divi {padding-top:5px; *zoom:1;}
.storeWrap .searchFrom .divi:after {content:""; display:block; clear:both;}
.storeWrap .searchFrom select {width:100%; height:30px; padding:0 10px; border:1px solid #d6d6d6; font-size:11px; color:#666;}
.storeWrap .searchFrom input[type=text] {width:100%;  height:30px; padding:0 10px; border:1px solid #d6d6d6; line-height:28px; font-size:11px; color:#666;}

.storeList {margin-top:40px; border-top:1px solid #5e6066;}
.storeList:after	{content:"";display:block;clear:both;}
.storeList li	{position:relative; padding:12px 55px 12px 10px;border-bottom:1px solid #e3e3e3;}
.storeList li .title	{float:left;padding-top:3px;color:#08aaf2;font-weight:bold;}
.storeList li .btn	{position:absolute; right:10px; top:50%; margin-top:-18px;}
.storeList li .addr	{clear:both;padding:7px 0 5px;font-size:11px;line-height:16px;}
.storeList li .tel	{overflow:hidden;}
.storeList li .tel a	{float:left;padding-left:17px; font-size:11px; line-height:16px;background:url('/mobile_app/images/icon/ico_tel.png') no-repeat 0 2px; background-size:11px auto;}
.storeList li.none	{text-align:center;}


.storeDetail .storeInfo	{padding:15px 5px; border-bottom:1px solid #efefef;}
.storeDetail .storeInfo .title	{padding-top:3px;color:#08aaf2;font-weight:bold;}
.storeDetail .storeInfo .addr	{clear:both;padding:7px 0 5px;font-size:11px;line-height:16px;}
.storeDetail .storeInfo .tel	{overflow:hidden;}
.storeDetail .storeInfo .tel a	{float:left;padding-left:17px; font-size:11px; line-height:16px;background:url('/mobile_app/images/icon/ico_tel.png') no-repeat 0 2px; background-size:11px auto;}

.storeDetail .mapArea 	{position:relative; margin-top:15px; border:1px solid #e3e3e4;}
.storeDetail .map_canvas	{position:absolute;left:0;top:0;width:100%;height:100%;}

/* my */
.myArea {min-height:250px; background:#dff6ff; text-align:center;}
.myArea .loginBefore {padding-top:115px; background:url(/mobile_app/images/icon/ico_my.png) no-repeat 50% 50px; background-size:41px auto;}
.myArea .loginBefore strong {color:#3bafeb; font-size:14px; border-bottom:1px solid #3bafeb; font-weight:bold;}
.myArea .loginBefore p.txt {color:#666666; font-size:11px; padding:5px 0;}
.myArea  .loginAfter {padding-top:40px;}
.myArea  .loginAfter strong {color:#3bafeb; font-size:14px; border-bottom:1px solid #3bafeb; font-weight:bold;}
.myArea  .loginAfter p.txt {padding-top:20px; color:#666666; font-size:11px;}
.myArea  .loginAfter a {margin-top:10px;}

/* login */
.loginArea {}
.loginArea .txt {padding-top:20px; text-align:center; color:#666; font-size:12px; line-height:17px;}
.loginArea #loginForm {padding-top:20px;}
.loginArea #loginForm ul {padding-bottom:10px;}
.loginArea #loginForm ul li {position:relative; margin-bottom:5px; padding-left:82px;}
.loginArea #loginForm ul li span {display:inline-block; position:absolute; left:0; top:0; color:#333; font-size:15px; line-height:30px;}
.loginArea #loginForm ul li input[type=text],
.loginArea #loginForm ul li input[type=password] {width:100%; height:30px; padding:0 10px; border:1px solid #d6d6d6; line-height:28px;}
#loginForm .btnLogin {width:100%; background:#3bafeb;}
.loginArea .btnArea {*zoom:1;}
.loginArea .btnArea:after {content:""; display:block; clear:both;}
.loginArea .btnArea a {float:left; width:32%; margin-left:2%;}
.loginArea .btnArea a:first-child {margin-left:0;}
.loginArea .infoTxtList {margin-top:15px; padding-top:10px; border-top:1px solid #efefef}

/* onlineStamp */
.onlineStrampApply {}
.onlineStrampApply .infoTxtList {padding:10px 0; border-bottom:1px solid #efefef;}
.onlineStrampApply .txtArea {padding-top:35px;}
.onlineStrampApply .txtArea strong {display:block; padding-bottom:10px;}
.onlineStrampApply .txtArea p {font-size:12px; line-height:18px; color:#666;}
.onlineStrampApply .txtArea p span {display:block; font-size:11px;}
.onlineStrampApply .txtArea p.subTxt {padding-bottom:5px;}
.onlineStrampApply .txtArea p.info {position:relative; padding-left:12px;}
.onlineStrampApply .txtArea p.info:before {content:"��"; position:absolute; left:0; top:0;}
.onlineStrampApply .txtArea .infoTxtList {margin-top:15px; background:#f6f6f6; border-top:1px solid #efefef; border-bottom:1px solid #efefef;}

.stampListArea	{}
	.stampListArea .infoTxt {padding:25px 5px 10px; font-size:11px; letter-spacing:-1px;}

.onlineStampCare {padidng-top:25px;}	
.onlineStampCare > ul {}
.onlineStampCare > ul > li {padding:2px 0px 2px 10px; background:url(/mobile_app/images/blt/blt2.png) no-repeat 0px 8px; background-size:3px auto; font-size:12px; color:#666; letter-spacing:-1px; line-height:18px;}
.onlineStampCare > ul > li b {color:#000;}
.onlineStampCare > ul > li > ul {padding-top:5px;}
.onlineStampCare > ul > li > ul > li {position:relative; padding:1px 0px 1px 15px; font-size:11px; color:#666; letter-spacing:-1px; line-height:18px; letter-spacing:-1px;}
.onlineStampCare > ul > li > ul > li:before {content:"��"; position:absolute; left:0; top:1px;}
.onlineStampCare > ul > li > ul.blt2 > li {position:relative; padding:1px 0px 1px 15px; font-size:11px; color:#000; letter-spacing:-1px; line-height:18px; letter-spacing:-1px; font-weight:bold;}
.onlineStampCare > ul > li > ul.blt2 > li:before {content:"��"; position:absolute; left:0; top:1px;}
.onlineStampCare > ul > li > ul > li span {}
.onlineStampCare .snsInfoTxt {padding:25px 10px 0;}
.onlineStampCare .snsInfoTxt strong {display:block; font-size:11px; color:#000; font-weight:bold; line-height:18px;}
.onlineStampCare .snsInfoTxt p {font-size:11px; line-height:18px;}
.onlineStampCare .btn_apply2 {display:block; width:300px; margin:0 auto 10px;}

.onlineStampCare{padding:10px; background:#bedced;}
.onlineStampBottle {margin:0 -10px -45px -10px; padding-bottom:20px; background:#bedced;}
.onlineStampBottle .btnArea {padding:20px 10px; *zoom:1;}
.onlineStampBottle .btnArea:after {content:""; display:block; clear:both;}
.onlineStampBottle .btnArea a {display:inline-block; width:320px; margin:0 auto;}
.onlineStampBottle .infoTxt {position:relative; padding:25px 0 5px 0; font-size:12px; color:#333; text-align:center;}
/* .onlineStampBottle .infoTxt:before {content:"��"; position:absolute; left:0; top:25px;} */
.onlineStampBottle .bottleArea {width:320px; margin:0 auto;}
.onlineStampBottle .bottleArea .b_header {position:relative; width:320px; height:40px; margin:0 auto; background:url(/mobile_app/images/stamp/online//bottle_top.png) no-repeat 0 0; background-size:320px auto;}
.onlineStampBottle .bottleArea .b_header p {width:240px; padding-top:4px; padding-left:20px; margin:0 auto; box-sizing:border-box; color:#fff; font-size:13px; font-weight:bold; line-height:20px;}
.onlineStampBottle .bottleArea .b_header p.num {padding-top:7px;}
.onlineStampBottle .bottleArea .b_header p b {color:#fcff9d;}
.onlineStampBottle .bottleArea .b_header a.btnGift {position:absolute; right:10px; top:-35px;}
.onlineStampBottle .bottleArea .b_header span {display:inline-block; height:18px; padding:0 10px; margin-top:-2px; background:#fff; border-radius:5px; line-height:18px; color:#333; vertical-align:middle;}
.onlineStampBottle .bottleArea .b_middle {width:320px; height:58px; padding-top:15px; background:url(/mobile_app/images/stamp/online//bottle_middle.gif) no-repeat 0 0; background-size:320px auto;}
.onlineStampBottle .slidePaging {text-align:center;}
.onlineStampBottle .slidePaging a {display:inline-block; width:80px; height:28px; line-height:26px; text-align:center; background:#fff; color:#b3b3b3; border:1px solid #b3b3b3; border-radius:14px;}
.onlineStampBottle .slidePaging a.on {background:#000; border:1px solid #000; color:#fff;}
.onlineStampBottle .bottleArea .b_body {width:320px; height:508px; margin:0 auto; background:url(/mobile_app/images/stamp/online//bottle_bottom.png) no-repeat 50% 0; background-size:320px auto; overflow:hidden;}
.onlineStampBottle .bottleArea .bodyCont {width:276px; margin:0 auto;} 
.onlineStampBottle .bottleArea .b_body ul {width:276px !important; margin:0 auto; margin-top:8px; *zoom:1; text-align:center;}
.onlineStampBottle .bottleArea .b_body ul:after {content:""; display:block; clear:both;}
.onlineStampBottle .bottleArea .b_body ul li {float:left; width:90px; height:96px; margin:1px; text-align:center; background:#b3ecfa;}
.onlineStampBottle .bottleArea .b_body ul li:nth-child(1) {margin-left:48px;}
.onlineStampBottle .bottleArea .b_body ul li:nth-child(6) {margin-top:34px;}
.onlineStampBottle .bottleArea .b_body ul li:nth-child(7) {margin-top:34px;}
.onlineStampBottle .bottleArea .b_body ul li:nth-child(8) {margin-top:34px;}
.onlineStampBottle .bottleArea .b_body ul li:nth-child(9) {margin-left:48px;}
.onlineStampBottle .bottleArea .b_body ul li p {padding:5px 0 0; font-size:10px; color:#000;}
.onlineStampBottle .bottleArea .b_body ul li img {vertical-align:bottom}	
.onlineStampBottle .bottleArea .b_body ul li .gift_com {padding:2px 0; font-size:10px; color:#fff; background:#488fa4;}
.onlineStampBottle .bottleArea .b_body ul li .gift_app a {display:block; font-size:10px; color:#fff; line-height:20px; background:#c451af;}

.apply_txt {position:relative; margin:0 -10px;}
.apply_txt a {display:block; width:30.8%; position:absolute; top:8.6%; right:3.5%;}
.apply_txt2 {margin-top:20px;}

.stampCare {padding-top:23px;}
.stampRelative {position:relative;}
.stampCare .btn_qna {display:block; width:18%; position:absolute; top:17%; left:74%;}
.stampCare .btn_qna img {width:100%;}



 
.popTypeA {padding:0px 15px 0;}
.popTypeA h1 {padding:10px 0; font-size:17px; font-weight:500; color:#000; text-align:center; border-bottom:2px solid #323337;}

.popGiftForm {} 
.popGiftForm .header {}
.popGiftForm .header strong {display:block; padding:12px 0 5px; font-size:13px; color:#000; font-weight:bold;}
.popGiftForm .contBox {padding:4px 12px; background:#efefef;}
.popGiftForm .contBox p {padding:4px 0; font-size:13px; color:#000;}
.popGiftForm .contBox p input,
.popGiftForm .contBox p label {vertical-align:middle;}

.popStampDetail {padding-bottom:45px;}

.popGiftPro .giftContTypeA {}
.popGiftPro .giftContTypeB {}
.popGiftPro .giftContTypeB ul {}
.popGiftPro .giftContTypeB ul li {position:relative; border-bottom:1px dashed #9a9899; padding-bottom:1px;}
.popGiftPro .giftContTypeB ul li input {position:absolute; top:50%; left:0; margin-top:-6px; width:12px; height:12px; vertical-align:middle;}
.popGiftPro .giftContTypeB ul li label {vertical-align:top;}
.popGiftPro .giftSelec {margin-top:5px; width:100%; height:30px; font-weight:bold; color:#000;}

.popGiftPro2 {padding-bottom:45px;}
.popGiftPro .deliveryState {padding-top:20px;}
.popGiftPro .deliveryState .tit {display:block; padding-bottom:5px; color:#000; font-size:13px; font-weight:bold;}
.popGiftPro .deliveryState .ds_cont {position:relative; margin-bottom:8px; padding-left:45px; line-height:33px; font-size:13px; color:#000; font-weight:bold; background:#efefef url(/mobile_app_201703/images/stamp/online/icon.gif) no-repeat 12px 50%; background-size:auto 13px;}
.popGiftPro .deliveryState .ds_cont a {position:absolute; right:7px; top:4px;}
.popGiftPro .deliveryState p {font-size:11px; color:#11px; line-height:15px;}



/* �������� */
.pollArea {}
	.pollTopTxt {padding:20px 0;  font-size:12px; color:#666; text-align:center; line-height:17px; letter-spacing:-1px;}
	.pollTopTxt b {color:#323337;}
.pollArea ol {padding-top:5px; padding-bottom:25px; border-top:1px solid #efefef; border-bottom:1px solid #efefef;}
.pollArea ol li {}
.pollArea ol li p { padding:10px 0 5px 0;font-size:12px; font-weight:bold; color:#333333; letter-spacing:-1px; line-height:17px;}
.pollArea .btnArea {padding-top:20px;}	

.pollEndArea .formArea {padding:10px 10px 15px; border-top:1px solid #efefef; background:#f6f6f6;}
.pollEndArea .formArea strong {display:block; padding-bottom:8px; font-size:12px; color:#333; line-height:15px;}
.pollEndArea .formArea div {position:relative; text-align:left;}
.pollEndArea .formArea div input {width:30%;}
.pollEndArea .infoTxt {position:relative; padding:8px 0 13px 16px; border-bottom:1px solid #efefef; font-size:10px; line-height:15px; letter-spacing:-1px; color:#7d7d7d;}
.pollEndArea .infoTxt:before {content:"*"; position:absolute; left:10px; top:8px;}