@charset "utf-8";
/* 홈 */
#ebric_mobile_wrap #header_wrap { height: 50px; }
#ebric_mobile_wrap #main-content-wrap { padding-top: 330px; padding-bottom: 50px; }
#ebric_mobile_wrap #main-content-wrap .main-view-wrap { position: absolute; padding-bottom: 60px; left: 0; width: 100%; height: 320px; top: 95px; }
#ebric_mobile_wrap #main-content-wrap .main-view-wrap .main-banner-list { height: 200px; position: relative; }
#ebric_mobile_wrap #main-content-wrap .main-view-wrap .main-banner-list ul .main-banner { height: 200px; padding: 45px 10px; text-align: center; color: #fff; }
#ebric_mobile_wrap #main-content-wrap .main-view-wrap .main-banner-list ul .main-banner h2 { font-size: 2.3rem; font-weight: 800; color: #fff; margin-bottom: 5px; text-shadow: 0 0 1px 1px rgba(0,0,0,0.1); letter-spacing: -1px; }
#ebric_mobile_wrap #main-content-wrap .main-view-wrap .main-banner-list>ul>.main-banner p { font-size: 1.4rem; font-weight: 400; letter-spacing: -0.5px; text-shadow: 0 0 1px 1px rgba(0,0,0,0.1); }
#ebric_mobile_wrap #main-content-wrap .main-view-wrap .main-banner-list>ul>.main-banner .go-btn { font-size: 1rem; color: #fff; display: inline-block; background: #363e4e; padding: 0 20px; text-align: center; height: 30px; line-height: 30px; letter-spacing: -0.5px; font-weight: 400; margin-top: 15px; transition: background .2s ease; position: relative; border-radius: 15px; overflow: hidden; }
#ebric_mobile_wrap #main-content-wrap .main-view-wrap .main-banner-list>ul>.main-banner .go-btn:hover { background: #2F3749; }

#ebric_mobile_wrap #main-content-wrap .main-view-wrap .main-banner-list .main-banner-navi { position: absolute; z-index: 2; width: 100%; text-align: center; height: 15px; bottom: 25px; }
#ebric_mobile_wrap #main-content-wrap .main-view-wrap .main-banner-list .main-banner-navi li { display: inline-block; height: 8px; width: 8px; background: transparent; border-radius: 50%; border: 1px solid rgba(255,255,255,0.5); margin: 0 1px; transition: background .25s ease; }
#ebric_mobile_wrap #main-content-wrap .main-view-wrap .main-banner-list .main-banner-navi li.on { background: #fff; }

/* 퀵메뉴 */
#main-content-wrap .quick-menu-wrap { height:120px; position: absolute; left: 0; width: 100%; top: 200px; overflow: hidden; }
#main-content-wrap .quick-menu-wrap .quick-menu { height: 100%; width: 100%; margin: 0 auto; border-bottom: 1px solid #F1F1F1; }
#main-content-wrap .quick-menu-wrap .quick-menu ul { height: 100%; }
#main-content-wrap .quick-menu-wrap .quick-menu ul li { height: 50%; width: 33.3333%; float: left; text-align: center; }
#main-content-wrap .quick-menu-wrap .quick-menu ul li a { width: 100%; height: 100%; display: block; font-size: 1rem; letter-spacing: -0.5px; font-weight: 500;  padding-top: 35px; transition: background .2s ease, border-color 0.2s ease, color .2s ease; position: relative; background: #fff; white-space: nowrap; }
#main-content-wrap .quick-menu-wrap .quick-menu ul li a:after { position: absolute; content: ''; z-index: 2; transition: background .2s ease;  }
#main-content-wrap .quick-menu-wrap .quick-menu ul li.order a:after { background: url(../../img/home/quick_menu_ico_order.png); background-size: 20px 16px; width: 20px; height: 16px; top: 13px; left: 50%; margin-left: -12px; }
#main-content-wrap .quick-menu-wrap .quick-menu ul li.inquiry a:after { background: url(../../img/home/quick_menu_ico_inquiry.png); background-size: 14px 19px; width: 14px; height: 19px; top: 11px; left: 50%; margin-left: -7px; }
#main-content-wrap .quick-menu-wrap .quick-menu ul li.check a:after { background: url(../../img/home/quick_menu_ico_check.png); background-size: 22px 14px; width: 22px; height: 14px; top: 14px; left: 50%; margin-left: -11px; }
#main-content-wrap .quick-menu-wrap .quick-menu ul li.notice a:after { background: url(../../img/home/quick_menu_ico_notice.png); background-size: 17px 15px; width: 17px; height: 15px; top: 13px; left: 50%; margin-left: -9px; }
#main-content-wrap .quick-menu-wrap .quick-menu ul li.service a:after { background: url(../../img/home/quick_menu_ico_service.png); background-size: 18px 17px; width: 18px; height: 17px; top: 12px; left: 50%; margin-left: -9px; }
#main-content-wrap .quick-menu-wrap .quick-menu ul li.partner a:after { background: url(../../img/home/quick_menu_ico_notice.png); background-size: 17px 15px; width: 17px; height: 15px; top: 13px; left: 50%; margin-left: -9px; }
#main-content-wrap .quick-menu-wrap .quick-menu ul li.partner a:after { background: url(../../img/home/quick_menu_ico_partner.png); background-size: 17px 15px; width: 17px; height: 15px; top: 13px; left: 50%; margin-left: -9px; }

/* 추천 상품 */
#main-content-wrap .recommend-list-wrap .recommend-list { width: 100%; margin: 0 auto; }
#main-content-wrap .recommend-list-wrap .recommend-list .box-wrap { height: auto; overflow: hidden; }
#main-content-wrap .recommend-list-wrap .recommend-list .box-wrap .product-box { width: 100%; margin-bottom: 10px; }
#main-content-wrap .recommend-list-wrap .recommend-list .box-wrap .product-box a { display: block; height: 100%; overflow: hidden; }
#main-content-wrap .recommend-list-wrap .recommend-list .box-wrap .product-box a .img-area { width: 120px; float: left; }
#main-content-wrap .recommend-list-wrap .recommend-list .box-wrap .product-box a .img-area .img-box { width: 120px; height: 120px; }
#main-content-wrap .recommend-list-wrap .recommend-list .box-wrap .product-box a .img-area .product-name { text-align: left; display: block; font-size: 1.4rem; font-weight: 700; color: #2f6ed5; margin-top: 10px; width: 100%; word-break: break-all; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 2; max-height: 40px; -webkit-box-orient: vertical; display: -webkit-box; line-height: 17px; }
#main-content-wrap .recommend-list-wrap .recommend-list .box-wrap .product-box:hover a .img-area .product-name { text-decoration: underline; }
#main-content-wrap .recommend-list-wrap .recommend-list .box-wrap .product-box a .txt-area { border: 1px solid #eee; width: calc( 100% - 130px ); float: right; height: 100%; padding: 10px; }
#main-content-wrap .recommend-list-wrap .recommend-list .box-wrap .product-box a .txt-area .property { display: block; margin-bottom: 5px; }
#main-content-wrap .recommend-list-wrap .recommend-list .box-wrap .product-box a .txt-area .property:last-of-type { margin-bottom: 0; }
#main-content-wrap .recommend-list-wrap .recommend-list .box-wrap .product-box a .txt-area .property .key { display: block; font-size: 1.1rem; color: #bbbbbb; font-weight: 500; }
#main-content-wrap .recommend-list-wrap .recommend-list .box-wrap .product-box a .txt-area .property .value { display: block; font-size: 1.3rem; font-weight: 700; }

@media all and ( min-width: 760px )
{
	#main-content-wrap .recommend-list-wrap .recommend-list .box-wrap .product-box { float: left; width: 49%; margin-right: 2%; }
	#main-content-wrap .recommend-list-wrap .recommend-list .box-wrap .product-box:nth-child(2n) { margin-right: 0; }
	
}

/* 베스트 */
#main-content-wrap .best-list-wrap .best-list { width: 100%; margin: 0 auto; }
#main-content-wrap .best-list-wrap .best-list .box-wrap { height: auto; overflow: hidden; }
#main-content-wrap .best-list-wrap .best-list .box-wrap .product-box,
#main-content-wrap .promotion-list-wrap .promotion-list .box-wrap .product-box { width: 49%; margin-right: 2%; margin-bottom: 10px; }
#main-content-wrap .best-list-wrap .best-list .box-wrap .product-box:nth-child(2n),
#main-content-wrap .promotion-list-wrap .promotion-list .box-wrap .product-box:nth-child(2n) { margin-right: 0; }
#main-content-wrap .best-list-wrap .best-list .box-wrap .product-box a { height: 50%; position: relative; }
#main-content-wrap .best-list-wrap .best-list .box-wrap .product-box a:after { position: absolute; width: 90%; background: #eee; height: 1px; content: ''; bottom: 0; left: 5%; }
#main-content-wrap .best-list-wrap .best-list .box-wrap .product-box a:last-child:after { display: none; }
#main-content-wrap .best-list-wrap .best-list .box-wrap .product-box a .img-area .product-name { display: block; font-size: 1.5rem; font-weight: 700; color: #2f6ed5; margin-top: 10px; margin-bottom: 5px; width: 100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
#main-content-wrap .best-list-wrap .best-list .box-wrap .product-box a .img-area .img-box,
#main-content-wrap .promotion-list-wrap .promotion-list .box-wrap .product-box a .img-area .img-box { height: 100px; }
#main-content-wrap .best-list-wrap .best-list .box-wrap .product-box a:hover .img-area .product-name { text-decoration: underline; }
#main-content-wrap .best-list-wrap .best-list .box-wrap .product-box a .txt-area .linear-formula { border: 1px solid #ccc; display: inline-block; padding: 0 10px; border-radius: 10px; }
#main-content-wrap .best-list-wrap .best-list .box-wrap .product-box a .txt-area .linear-formula .value { font-size: 1.1rem; font-weight: 500; }
#main-content-wrap .best-list-wrap .best-list .box-wrap .product-box a .txt-area .property { margin-top: 5px; font-size: 1.2rem; color: #666; }
#main-content-wrap .best-list-wrap .best-list .box-wrap .product-box a .txt-area .property .key { margin-right: 15px; position: relative; }
#main-content-wrap .best-list-wrap .best-list .box-wrap .product-box a .txt-area .property .key:after { width: 1px; height: 9px; background: #ddd; position: absolute; content: ''; top: 5px; right: -8px; }

/* 프로모션 */
#main-content-wrap .promotion-list-wrap .promotion-list .box-wrap { height: auto; }
#main-content-wrap .promotion-list-wrap .promotion-list .box-wrap .product-box a .txt-area .product-name { font-size: 1.5rem; font-weight: 700; margin-top: 3px; margin-bottom: 5px; width: 100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; display: block; }
#main-content-wrap .promotion-list-wrap .promotion-list .box-wrap .product-box a .txt-area .linear-formula { border: 1px solid #ccc; display: inline-block; padding: 0 10px; border-radius: 10px; }
#main-content-wrap .promotion-list-wrap .promotion-list .box-wrap .product-box a .txt-area .linear-formula .value { font-size: 1.1rem; font-weight: 500; }

#main-content-wrap .promotion-list-wrap .promotion-list .box-wrap .product-box a .txt-area .promotion-content { height: auto; margin-top: 10px; overflow: hidden; }
#main-content-wrap .promotion-list-wrap .promotion-list .box-wrap .product-box a .txt-area .promotion-content .price { margin-right: 5px; display: block; overflow: hidden; }
#main-content-wrap .promotion-list-wrap .promotion-list .box-wrap .product-box a .txt-area .promotion-content .price .post { color: #666; text-decoration: line-through; float: left; margin-top: 3px; margin-right: 4px; letter-spacing: -0.5px; }
#main-content-wrap .promotion-list-wrap .promotion-list .box-wrap .product-box a .txt-area .promotion-content .price p.current { float: left; font-size: 1.5rem; font-weight: 900; color: #2f6ed5; letter-spacing: -0.5px; }
#main-content-wrap .promotion-list-wrap .promotion-list .box-wrap .product-box a .txt-area .promotion-content .price p.current .unit { font-size: 1.3rem; font-weight: 500; color: #666; margin-left: 2px; }

#main-content-wrap .promotion-list-wrap .promotion-list .box-wrap .product-box a .txt-area .promotion-content .label { height: 20px; border-radius: 3px; font-size: 1rem; font-weight: 500; width: 55px; line-height: 20px; color: #fff; text-align: center; margin: 6px 0 3px; }
#main-content-wrap .promotion-list-wrap .promotion-list .box-wrap .product-box a .txt-area .promotion-content .label.og-bg { background: #f36523; }
#main-content-wrap .promotion-list-wrap .promotion-list .box-wrap .product-box a .txt-area .promotion-content .label.bl-bg { background: #2f6ed5; }

@media all and ( min-width: 760px )
{
	#main-content-wrap .best-list-wrap .best-list .box-wrap .product-box,
	#main-content-wrap .promotion-list-wrap .promotion-list .box-wrap .product-box { width: 32%; }
	#main-content-wrap .best-list-wrap .best-list .box-wrap .product-box:nth-child(2n),
	#main-content-wrap .promotion-list-wrap .promotion-list .box-wrap .product-box:nth-child(2n) { margin-right: 2%; }
	#main-content-wrap .best-list-wrap .best-list .box-wrap .product-box:nth-child(3n),
	#main-content-wrap .promotion-list-wrap .promotion-list .box-wrap .product-box:nth-child(3n) { margin-right: 0; }
}