/* - Project : makeshop - Author : odini84@gmail.com - Description : main layout (header, footer) - Create : 2011-11-27 - Modify : YYYY-MM-DD - */ /* ======================================================================== Z-INDEX ======================================================================== */ /* z-index */ #tLinkWrap { z-index: 2; } #hdrWrap, #ftrWrap { z-index: 1; } #contentWrap { z-index: 0; } /* ======================================================================== 레이어 ======================================================================== */ #dwLayer, #dwLayerDetail { top: 26px; } #dwLayer { left: 0px; } #dwLayerDetail { left: 217px; } #qrLayer { top: 26px; left: 0px; } #gnbMoreView { top: 38px; left: 0px; } /* ======================================================================== ftrWrap ======================================================================== */ #ftrWrap { width: 880px; } /* ======================================================================== tLinkWrap ======================================================================== */ #tLinkWrap { position: relative; zoom: 1; border-bottom: 1px solid #dce5ec;} #tLink { position: relative; zoom: 1; height: 25px; width: 880px; margin-left: auto; margin-right: auto; } #tLink:after { content: ""; display: block; clear: both; } /* bi */ #tLink .bi { position: absolute; top: 42px; left: 356px; width: 168px; height: 53px; } #tLink .bi.hd-logo a { overflow: hidden; display: block; width: 100%; height: 100%; text-indent: -9999px; background: url(../img/main/bi_logo.gif) no-repeat 0 0; } #tLink .bi2 { position:absolute; top:26px; left:269px; width: 342px; height:69px; } #tLink .bi2.hd-logo2 a { overflow: hidden; display: block; } #tLink a.mobile-shop { display: block; position: absolute; width: 70px; height: 45px; top: 45px; left: 535px; text-indent: -9999px; } /* dlink */ #tLink .dlink { position: absolute; left: 10px; top: 2px; margin-left: 5px; padding-top: 1px; } #tLink .dlink dt, #tLink .dlink dd { float: left; height: 27px; line-height: 27px; } #tLink .dlink dt { word-spacing: 2px; margin-right: 6px; padding-right: 11px; cursor: pointer; background: url(../img/main/bull_tlink_dwn.gif) no-repeat right 10px; } #tLink .dlink a { float: left; white-space: nowrap; font-weight: bold; height: 24px; line-height: 24px; letter-spacing: -1px; word-spacing: 1px; } #tLink .dlink a img { margin-top: 2px; margin-right: 2px; cursor: pointer; } #tLink .dlink a span { display: inline-block; margin-right: 2px; line-height: 24px; font-size: 11px; line-height: 24px; cursor: pointer; } /* mlink */ #tLink .mlink { position: absolute; right: 5px; top: 1px; padding-top: 1px; letter-spacing: -1px; } #tLink .mlink dd { float: right; } #tLink .mlink li, #tLink .mlink a { display: inline; float: left; width: auto; } #tLink .mlink a { height: 24px; line-height: 24px; letter-spacing: -1px; } #tLink .mlink li { margin-left: 14px; } #tLink .mlink li.transfer a { color: #fd3131; } #tLink .mlink li.app a { padding-left: 13px; color: #51acc9; background: url(../img/common/bull_tlink_shopapp.gif) no-repeat 0px 3px; } /* ======================================================================== hdrWrap ======================================================================== */ #hdrWrap { position: relative; zoom: 1; padding-top: 69px; } #hdr { position: relative; width: 880px; margin-left: auto; margin-right: auto; border-bottom: 2px solid #133ac3; } /* hd-cont */ #hdr .hd-cont { position: relative; height: 34px; padding-left: 14px; border: 1px solid #0e32ba; background-color: #2158d6; } /* gnb */ #gnb { zoom: 1; padding-top: 10px; } #gnb:after { content: ""; display: block; clear: both; } #gnb li, #gnb a { float: left; width: auto; font-size: 0; line-height: 0; } #gnb li { height: 14px; margin-right: 10px; } #gnb a { overflow: hidden; position: relative; height: 14px; } #gnb a span { visibility: hidden; } #gnb li.bull { padding-right: 13px; background: url(../img/main/bull_gnb_div.gif) no-repeat right 0; } #gnb li.sub { display:none; } /* menu */ #gnb li.makeshop a { width: 44px; background: url(../img/main/gnb_makeshop.gif); } #gnb li.premium03 { display: none; } #gnb li.mobile3 a { width: 44px; background: url(../img/main/gnb_mobile3.gif); } #gnb li.powermobile { position:relative; } #gnb li.powermobile .icon { position:absolute; top:-22px; left:8px; width:20px; height:19px; background:url(../img/main/icon_powermobile.png) no-repeat 0 0; } #gnb li.powermobile a { width: 33px; height:12px; margin-top:1px; background: url(../img/main/gnb_powermobile.gif); } #gnb li.powerpack { display:none; } #gnb li.sales { position:relative; } #gnb li.sales .icon { position:absolute; top:-22px; left:0; width:20px; height:19px; background:url(../img/main/icon_sales.png) no-repeat 0 0; } #gnb li.sales a { width: 22px; height:12px; margin-top:1px; background: url(../img/main/gnb_sales.gif); } #gnb li.security a { width: 23px; height:12px; margin-top:1px; background: url(../img/main/gnb_security.gif); } #gnb li.power a { width: 23px; background: url(../img/main/gnb_power.gif); } #gnb li.social { position: relative; } #gnb li.social .icon { position:absolute; top:-22px; left:2px; width:20px; height:19px; background:url(../img/main/icon_social.png) no-repeat 0 0; } #gnb li.social a { width: 22px; background: url(../img/main/gnb_social.gif) no-repeat 0 1px; } #gnb li.support { display: none; } #gnb li.onestop a { width: 33px; background: url(../img/main/gnb_onestop.gif); } #gnb li.marketing a { width: 34px; background: url(../img/main/gnb_marketing.gif); } #gnb li.edu a { width: 24px; background: url(../img/main/gnb_edu.gif); } #gnb li.design a { width: 31px; height:12px; margin-top:1px; background: url(../img/main/gnb_design.gif); } #gnb li.product a { width: 24px; background: url(../img/main/gnb_product.gif); } #gnb li.domain a { width: 33px; background: url(../img/main/gnb_domain.gif); height: 12px; margin-top: 1px; } #gnb li.overseas a { width: 44px; height:12px; margin-top:1px; background: url(../img/main/gnb_overseas.gif); } #gnb li.o2o { margin-right:0; } #gnb li.o2o a { width: 22px; height:12px; margin-top:1px; background: url(../img/main/gnb_o2o.gif); } #gnb li.mobile a { display:none; } #gnb li.more { margin-right:0; } #gnb li.more a { width: 44px; background: url(../img/main/gnb_more.gif); } /* hotIssue */ #hotIssue { position: absolute; top: 0px; right: 0px; width: 216px; height: 34px; background-color: #2271e8; } #hotIssue .list-w { overflow: hidden; position: relative; top: 10px; width: 205px; height: 20px; margin-left: 11px; } #hotIssue ol { position: absolute; left: 0px; top: 0px; width: 205px; } #hotIssue ol li, #hotIssue ol a, #hotIssue ol .num, #hotIssue ol .txt, #hotIssue ol .luv { float: left; } #hotIssue ol li, #hotIssue ol a { width: 100%; } #hotIssue ol li { position: relative; height: 20px; } #hotIssue ol a { cursor: pointer; } #hotIssue ol .num, #hotIssue ol .txt, #hotIssue ol .luv { position: relative; } #hotIssue ol .num { width: 15px; height: 15px; line-height: 15px; margin-right: 4px; font-size: 10px; font-family: Tahoma; text-align: center; color: #fff; background: url(../img/main/bg_hdr_issue_num.gif) no-repeat 0 0; } #hotIssue ol .txt { width: 125px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-right: 0px; padding-top: 2px; height: 14px; line-height: 14px; color: #fff; letter-spacing: -1px; } #hotIssue ol .luv { margin-top: 1px; height: 15px; padding-left: 15px; line-height: 13px; margin-right: 4px; font-size: 10px; font-family: Tahoma; text-align: center; color: #fef23c; background: url(../img/main/bg_hdr_issue_luv.gif) no-repeat 0 2px; } /* 추석 상단 이미지 교체 */ #tLink #r_4 { overflow: hidden; display: block; width: 100%; height: 100%; text-indent: -9999px; background: url(../img/main/logo4.gif) no-repeat 0 0px; } #tLink #r_3 { overflow: hidden; display: block; width: 100%; height: 100%; text-indent: -9999px; background: url(../img/main/logo3.gif) no-repeat 0 0px; } #tLink #r_2 { overflow: hidden; display: block; width: 100%; height: 100%; text-indent: -9999px; background: url(../img/main/logo2.gif) no-repeat 0 0px; } #tLink #r_1 { overflow: hidden; display: block; width: 100%; height: 100%; text-indent: -9999px; background: url(../img/main/logo1.gif) no-repeat 0 0px; } #tLink .bi-tanksgiving { position: absolute; top: 26px; left: 229px; width: 437px; height: 69px; } #tLink a.mobile-shop-4 { display: block; position: absolute; width: 70px; height: 35px; top: 53px; left: 528px; text-indent: -9999px; } #tLink a.mobile-shop-3 { display: block; position: absolute; width: 70px; height: 35px; top: 53px; left: 500px; text-indent: -9999px; } #tLink a.mobile-shop-2 { display: block; position: absolute; width: 70px; height: 35px; top: 53px; left: 538px; text-indent: -9999px; } #tLink a.mobile-shop-1 { display: block; position: absolute; width: 70px; height: 35px; top: 53px; left: 498px; text-indent: -9999px; }