body { line-height:1.4; } /* basic layout */ #wrapper { width:100%; background:url('/image/web/main/wrapper_bg.gif') repeat-x; } #header { z-index:30; width:100%; min-width:1090px; height:212px; background:url('/image/web/main/header_bg.gif') #2f2f2f; } #header .header { z-index:30; width:1090px; margin:0 auto; } #footer { z-index:10; clear:both; width:100%; min-width:1090px; margin-top:20px;padding-bottom:20px; background:#444; } #footer .footer { z-index:10; width:1090px; margin:0 auto; } #contain.main { z-index:20; clear:both; width:100%; padding-bottom:20px; } #contain.sub { z-index:20; clear:both; width:1090px; margin:0 auto; margin-top:20px; } #contain.product { z-index:20; clear:both; width:1090px; margin:0 auto; margin-top:20px; } #contain.cart { z-index:20; clear:both; width:1090px; margin:0 auto; margin-top:20px; } /* header */ #header .header div { float:left; } #header .header .leftGnb { float:left; margin-top:10px; width:370px; color:#666; } #header .header .leftGnb li { } #header .header .leftGnb a { color:#666; } #header .header .leftGnb a:hover{ color:#ae8635; } #header .header .logo { width:350px; } #header .header .topGnb { position:relative; margin-top:10px; width:370px;text-align:right; color:#999; } #header .header .topGnb a { color:#999; } #header .header .topGnb ul { } #header .header .topGnb li { display:inline; } #header .header .topGnb li a:hover { color:#ae8635; } #header .header .topGnb p { margin:10px 0 0 0; } #header .header .topGnb p a { margin-left:3px; } #header .mainMenu { float:left; height:45px; z-index:1000; position:relative; } #header .mainMenu > ul { float:left; width:720px; height:45px; } #header .mainMenu > ul > li { float:left; width:120px; height:45px; } #header .mainMenu > ul > li > a { display:block; height:45px; background:url('/image/web/main/main_menu_bg.jpg') no-repeat; text-indent:-10000px;} #header .mainMenu li.menu1 a { background-position:0px 0px; } #header .mainMenu li.menu1 a:hover,#header .mainMenu li.menu1 a.sel,#header .mainMenu li.menu1 a.on { background-position:0px -45px; } #header .mainMenu li.menu2 a { background-position:-120px 0px; } #header .mainMenu li.menu2 a:hover,#header .mainMenu li.menu2 a.sel,#header .mainMenu li.menu2 a.on { background-position:-120px -45px; } #header .mainMenu li.menu3 a { background-position:-240px 0px; } #header .mainMenu li.menu3 a:hover,#header .mainMenu li.menu3 a.sel,#header .mainMenu li.menu3 a.on { background-position:-240px -45px; } #header .mainMenu li.menu4 a { background-position:-360px 0px; } #header .mainMenu li.menu4 a:hover,#header .mainMenu li.menu4 a.sel,#header .mainMenu li.menu4 a.on { background-position:-360px -45px; } #header .mainMenu li.menu5 a { background-position:-480px 0px; } #header .mainMenu li.menu5 a:hover,#header .mainMenu li.menu5 a.sel,#header .mainMenu li.menu5 a.on { background-position:-480px -45px; } #header .mainMenu li.menu6 a { background-position:-600px 0px; } #header .mainMenu li.menu6 a:hover,#header .mainMenu li.menu6 a.sel,#header .mainMenu li.menu6 a.on { background-position:-600px -45px; } #header .mainMenu li.menu7 a { background-position:-720px 0px; } #header .mainMenu li.menu7 a:hover,#header .mainMenu li.menu7 a.sel,#header .mainMenu li.menu7 a.on { background-position:-720px -45px; } #header .mainMenu .menu1 .subNav ul { width:1080px; background:#f5f5f5; } #header .mainMenu .menu1 .subNav li { width:100%; } #header .mainMenu .menu1 dl { float:left; width:119px; height:180px; padding-left:10px; border-right:1px dotted #999; } #header .mainMenu .menu1 dl.noLine { border-right:none; } #header .mainMenu .menu1 dt { padding:5px 0; color:#666; font-size:13px; } #header .mainMenu .menu1 dd a { color:#999; } #header .mainMenu .menu1 dd a:hover { color:#fab3cd; } #header .mainMenu .menu2 .subNav ul { width:1090px; padding:0; background:#f5f5f5; } #header .mainMenu .menu2 .subNav li { float:left; width:121px; height:210px; } #header .mainMenu .menu2 .subNav li a { display:block; width:121px; height:210px; background:url('/image/web/main/line_cate_bg.gif') no-repeat; text-indent:-10000px; } #header .mainMenu .menu2 .subNav li a.subNavLine01 { background-position:0 0; } #header .mainMenu .menu2 .subNav li a.subNavLine02 { background-position:-121px 0; } #header .mainMenu .menu2 .subNav li a.subNavLine03 { background-position:-242px 0; } #header .mainMenu .menu2 .subNav li a.subNavLine04 { background-position:-363px 0; } #header .mainMenu .menu2 .subNav li a.subNavLine05 { background-position:-484px 0; } #header .mainMenu .menu2 .subNav li a.subNavLine06 { background-position:-605px 0; } #header .mainMenu .menu2 .subNav li a.subNavLine07 { background-position:-726px 0; } #header .mainMenu .menu2 .subNav li a.subNavLine08 { background-position:-847px 0; } #header .mainMenu .menu2 .subNav li a.subNavLine09 { background-position:-968px 0; } #header .mainMenu .menu2 .subNav li a:hover.subNavLine01 { background-position:0 -210px; } #header .mainMenu .menu2 .subNav li a:hover.subNavLine02 { background-position:-121px -210px; } #header .mainMenu .menu2 .subNav li a:hover.subNavLine03 { background-position:-242px -210px; } #header .mainMenu .menu2 .subNav li a:hover.subNavLine04 { background-position:-363px -210px; } #header .mainMenu .menu2 .subNav li a:hover.subNavLine05 { background-position:-484px -210px; } #header .mainMenu .menu2 .subNav li a:hover.subNavLine06 { background-position:-605px -210px; } #header .mainMenu .menu2 .subNav li a:hover.subNavLine07 { background-position:-726px -210px; } #header .mainMenu .menu2 .subNav li a:hover.subNavLine08 { background-position:-847px -210px; } #header .mainMenu .menu2 .subNav li a:hover.subNavLine09 { background-position:-968px -210px; } #header .header .seachFoam { float:right; margin-top:6px; } #header .header .seachFoam input { width:200px; height:30px; } #header .header .seachFoam .seachTextForm input { height:20px; padding:5px; border:1px solid #ae8635; color:#ae8635; } #header .header .seachFoam .btnSearch input { margin-left:5px; width:28px; height:28px; } /*footer*/ .footer .logo { float:left; height:150px; padding:10px 10px 0 0; } .footer .cateFooter { float:left; font-weight:bold; } .footer .cateFooter ul { width:900px; } .footer .cateFooter li { float:left; padding:20px 10px; 10px 10px; } .footer .cateFooter li a { color:#ae8635; } .footer .cateFooter li a:hover { color:#fff; } .footer .cateFooter span { color:#f60; } .footer .info { float:left; width:900px; padding:10px; color:#999; } .footer .info span { font-weight:bold; } .footer .btn { float:left; padding:10px 0 40px 10px; color:#999; } .footer .btn a { color: #fff; } .footer .btn a:hover { color: #fc9; } /*main page*/ #contain.main #section { width:1090px; margin:0 auto; } #contain.main #section #productShow { position:relative; z-index:900; height:909px; } #contain.main #section .productShow { position:absolute;top:-180px; } #contain.main #section .productShow li { float:left; } #contain.main #section .productShow li a { display:block; width:363px; height:363px; } #contain.main #section .productShow li.dp1 { float:none; } #contain.main #section .productShow li.dp1 a { background:url('/image/web/main/product_01.jpg') no-repeat; } #contain.main #section .productShow li.dp2 a { background:url('/image/web/main/product_02.jpg') no-repeat; } #contain.main #section .productShow li.dp3 a { background:url('/image/web/main/product_03.jpg') no-repeat; } #contain.main #section .productShow li.dp4 a { width:364px; background:url('/image/web/main/product_04.jpg') no-repeat; } #contain.main #section .productShow li.dp5 a { background:url('/image/web/main/product_05.jpg') no-repeat; } #contain.main #section .productShow li.dp6 a { background:url('/image/web/main/product_06.jpg') no-repeat; } #contain.main #section .productShow li.dp7 a { width:364px; background:url('/image/web/main/product_07.jpg') no-repeat; } #contain.main #section .productShow li.dp8 a { background:url('/image/web/main/product_08.jpg') no-repeat; } #contain.main #section .productShow li.dp9 a { background:url('/image/web/main/product_09.jpg') no-repeat; } #contain.main #section .productShow li.dp10 a { width:364px; background:url('/image/web/main/product_10.jpg') no-repeat; } #contain.main #section .productShow li a:hover { background-position:0 -363px;} #contain.main #section .bannerEvent { clear:both; } #contain.main #section .bannerEvent li { float:left; margin:20px 0 30px 0;} #contain.main #section .bannerEvent li a { display:block; width:218px; height:280px; background:url('/image/web/main/bottom_banner_bg.jpg') no-repeat; } #contain.main #section .bannerEvent li.dp1 a { background-position:0 0; } #contain.main #section .bannerEvent li.dp2 a { background-position:-218px 0; } #contain.main #section .bannerEvent li.dp3 a { background-position:-436px 0; } #contain.main #section .bannerEvent li.dp4 a { background-position:-654px 0; } #contain.main #section .bannerEvent li.dp5 a { background-position:-872px 0; } #contain.main #section .bannerEvent li.dp1 a:hover { background-position:0 -280px; } #contain.main #section .bannerEvent li.dp2 a:hover { background-position:-218px -280px; } #contain.main #section .bannerEvent li.dp3 a:hover { background-position:-436px -280px; } #contain.main #section .bannerEvent li.dp4 a:hover { background-position:-654px -280px; } #contain.main #section .bannerEvent li.dp5 a:hover { background-position:-872px -280px; } /*product page*/ #contain.product .section { } #contain.product .section h2 { height:32px; margin-bottom:20px; padding:5px; border-bottom:1px solid #ccc; } #contain.product .section h2 p { float:left; font-size:18px; color:#333; font-weight:bold; } #contain.product .section h2 div { float:right; padding:10px 0 0 15px; background:url('/image/web/bullet/bullet_home.gif') no-repeat 0 21px; color:#999; letter-spacing:-1px; } #contain.product .section h2 div span { color:#6c3; } #contain.product .artice { float:left; width:752px; margin-right:20px; } #contain.product .aside { float:left; width:318px; } /*cart page*/ #contain.cart .section { float:left; width:988px; padding:10px 49px; border:1px solid #ccc; background:#fff; } .cart .section h2 { height:32px; margin-bottom:20px; padding:5px; border-bottom:1px solid #ccc; } .cart .section h2 p { float:left; font-size:18px; color:#333; font-weight:bold; } .cart .section h2 div { float:right; padding:10px 0 0 15px; background:url('/image/web/bullet/bullet_home.gif') no-repeat 0 21px; color:#999; letter-spacing:-1px; } .cart .section h2 div span { color:#6c3; } /*sub page*/ /*sub basic*/ #contain.sub .aside { float:left; width:170px; margin-right:20px; } #contain.sub .section { float:left; width:800px; padding:10px 49px 49px 49px; border:1px solid #ccc; background:#fff; } /*aside*/ .sub .aside .navLeft { padding-bottom:10px; background:#ae8635; } .sub .aside .navLeft h3 { height:80px; text-indent:-10000px; } .sub .aside .navLeft.intro h3 { background:url('/image/web/main/sub_cate_01_title.gif'); } .sub .aside .navLeft.review h3 { background:url('/image/web/main/sub_cate_02_title.gif'); } .sub .aside .navLeft.community h3 { background:url('/image/web/main/sub_cate_03_title.gif'); } .sub .aside .navLeft.event h3 { background:url('/image/web/main/sub_cate_04_title.gif'); } .sub .aside .navLeft.exp h3 { background:url('/image/web/main/sub_cate_05_title.gif'); } .sub .aside .navLeft.cafe h3 { background:url('/image/web/main/sub_cate_06_title.gif'); } .sub .aside .navLeft.widget h3 { background:url('/image/web/main/sub_cate_07_title.gif'); } .sub .aside .navLeft.membership h3 { background:url('/image/web/main/sub_cate_membership_title.gif'); } .sub .aside .navLeft.center h3 { background:url('/image/web/main/sub_cate_center_title.gif'); } .sub .aside .navLeft.mypage h3 { background:url('/image/web/main/sub_cate_myshop_title.gif'); } .sub .aside .navLeft ul { } .sub .aside .navLeft li a { display:block; height:40px; text-indent:-10000px; } .sub .aside .navLeft.intro li a { background:url('/image/web/main/sub_cate_01.gif'); } .sub .aside .navLeft.review li a { background:url('/image/web/main/sub_cate_02.gif'); } .sub .aside .navLeft.community li a { background:url('/image/web/main/sub_cate_03.gif'); } .sub .aside .navLeft.event li a { background:url('/image/web/main/sub_cate_04.gif'); } .sub .aside .navLeft.exp li a { background:url('/image/web/main/sub_cate_05.gif'); } .sub .aside .navLeft.cafe li a { background:url('/image/web/main/sub_cate_06.gif'); } .sub .aside .navLeft.widget li a { background:url('/image/web/main/sub_cate_07.gif'); } .sub .aside .navLeft li.menu1 a { background-position:0px 0px; } .sub .aside .navLeft li.nav1 a:hover { background-position:-170px 0px; } .sub .aside .navLeft li.nav1 a.on { background-position:-170px 0px; } .sub .aside .navLeft li.nav2 a { background-position:0px -40px; } .sub .aside .navLeft li.nav2 a:hover { background-position:-170px -40px; } .sub .aside .navLeft li.nav2 a.on { background-position:-170px -40px; } .sub .aside .navLeft li.nav3 a { background-position:0px -80px; } .sub .aside .navLeft li.nav3 a:hover { background-position:-170px -80px; } .sub .aside .navLeft li.nav3 a.on { background-position:-170px -80px; } .sub .aside .navLeft li.nav4 a { background-position:0px -120px; } .sub .aside .navLeft li.nav4 a:hover { background-position:-170px -120px; } .sub .aside .navLeft li.nav4 a.on { background-position:-170px -120px; } .sub .aside .navLeft li.nav5 a { background-position:0px -160px; } .sub .aside .navLeft li.nav5 a:hover { background-position:-170px -160px; } .sub .aside .navLeft li.nav5 a.on { background-position:-170px -160px; } .sub .aside .navLeft li.nav6 a { background-position:0px -200px; } .sub .aside .navLeft li.nav6 a:hover { background-position:-170px -200px; } .sub .aside .navLeft li.nav6 a.on { background-position:-170px -200px; } .sub .aside .navLeft li.nav7 a { background-position:0px -240px; } .sub .aside .navLeft li.nav7 a:hover { background-position:-170px -240px; } .sub .aside .navLeft li.nav7 a.on { background-position:-170px -240px; } .sub .aside .navLeft li.nav8 a { background-position:0px -280px; } .sub .aside .navLeft li.nav8 a:hover { background-position:-170px -280px; } .sub .aside .navLeft li.nav8 a.on { background-position:-170px -280px; } .sub .aside .navLeft li.nav9 a { background-position:0px -320px; } .sub .aside .navLeft li.nav9 a:hover { background-position:-170px -320px; } .sub .aside .navLeft li.nav9 a.on { background-position:-170px -320px; } .sub .aside .navLeft li.nav10 a { background-position:0px -360px; } .sub .aside .navLeft li.nav10 a:hover { background-position:-170px -360px; } .sub .aside .navLeft li.nav10 a.on { background-position:-170px -360px; } .sub .aside .navLeft ul.textType { width:150px; border:10px solid #ae8635; border-top:0; border-bottom:0; } .sub .aside .navLeft ul.textType li { border-bottom:1px solid #e2e2e2; background:#fff; text-align:left; } .sub .aside .navLeft ul.textType a { display:block; height:25px; padding:10px 0 0 10px; color:#ae8635; text-indent:0px;} .sub .aside .navLeft ul.textType a:hover, .sub .aside .navLeft ul.textType a.on { background:url('/image/web/main/left_bullet.png') no-repeat 140px 13px #fff; color:#333; font-weight:bold; } .sub .section h2 { height:32px; margin-bottom:20px; padding:5px; border-bottom:1px solid #ccc; } .sub .section h2 p { float:left; font-size:18px; color:#333; font-weight:bold; } .sub .section h2 div { float:right; padding:10px 0 0 15px; background:url('/image/web/bullet/bullet_home.gif') no-repeat 0 21px; color:#999; letter-spacing:-1px; } .sub .section h2 div span { color:#6c3; } /* quick */ #quick { position:relative; z-index:1000; width:1090px; margin:0 auto; color:#666; } #quick .quickArea { position:absolute; top:100px; left:1100px; width:76px; } #quick .quickArea div div { margin-bottom:10px; } #quick .quickArea ul { clear:both; margin-bottom:10px; } #quick .quickArea div ul { background:#161616; } #quick .quickArea span { font-weight:bold; color:#999; } #quick .quickArea div li { padding:5px; border-bottom:1px dotted #555; text-align:center; } #quick .quickArea div li.noline { border:none; } #quick .quickArea div li a { font-weight:bold; color:#f39;} /* quick */ #quickR { position:absolute; top:50px; left:1100px; z-index:999; width:88px; min-height:213px; } #quickR #play1 {cursor: pointer;} #quickR #play2 {cursor: pointer;} #quickR #play3 {cursor: pointer;} #quickR #play4 {cursor: pointer;} /*popup*/ .popupWrap { position:fixed; left:0; top:0; width:100%; z-index:10000; display: none;} .popupWrap .popBox { position:relative; width:1090px; height:620px; margin:0 auto; background:#333; } .popupWrap .popBox #movieZone { position:absolute; top:50px; left:94px; } .popupWrap .popBox .btnClose { position:absolute; top:10px; right:10px; width: 55px; background:none;} .popupWrap .popBox .btnMore { position:absolute; width:100%; top:600px; text-align:center; } .popupWrap .popBox .btnMore span { padding:10px; } /*로그인*/ .subWrap .login {width:800px; margin:0 auto; padding:49px 0 10px 0;} .cart .loginBox { float:left; width:48%; height:190px; border:1px solid #ccc; margin:0; padding:0; margin-right:28px; background:#fff; font-weight:normal; } .cart .loginCart { float:left; width:46%; height:180px; border:1px solid #ccc; background:#FFF; padding:10px 1% 0 1%; } .cart .loginOrder { float:left;width:385px; height:190px; border:1px solid #ccc; background:#FFF; } .login_bar { width:100%; border:1px solid #ccc; } .login_bar table { width:98%; margin:0 auto; } .login_bar td { padding:10px; color:#999; border-bottom:1px solid #ccc;} .login_bar .noline { border:none; } /*주문조회로그인*/ .loginBoxByType { } .loginBoxByType .loginBasic { float:left; width:46%; height:170px; padding:10px; border:1px solid #ccc; } .loginBoxByType .loginBasic p { padding:10px; text-align:center; } .loginBoxByType .loginBasic p span { font-size:18px; font-weight:bold; color:#666; } .loginBoxByType .loginBasic li { float:left; } .loginBoxByType .loginBasic li.btn { padding:10px 0 0 20px; } .loginBoxByType .loginBasic table { margin-left:10px; } .loginBoxByType .loginBasic th, .loginBoxByType .loginBasic td { padding:5px; } .loginBoxByType .loginBasic div { padding:10px; text-align:center; } .loginBoxByType .loginOrder { float:left; width:46%; height:170px; margin-left:20px; padding:10px; border:1px solid #ccc; } .loginBoxByType .loginOrder p { padding:10px; text-align:center; font-size:18px; font-weight:bold; color:#666; } .loginBoxByType .loginOrder li { float:left; } .loginBoxByType .loginOrder li.btn { padding:25px 0 0 20px; } .loginBoxByType .loginOrder table { margin-left:15px; } .loginBoxByType .loginOrder th, .loginBoxByType .loginOrder td { padding:5px; } #contain.sub .artice .pagelist { text-align:center; height:20px; padding:15px 0 0 0; }