/* BASIC css start */ /* 메인 */ #contentWrap { padding-top: 80px; } #contentWrap:after { content:""; display:block; clear:both; } /** 메인배너(영역) **/ #m_bann { position: relative; left: 0; top: 81px; width: 100%; height: 835px; } #m_bann_wrap { min-width: 1250px; width: 100%; height: 835px; background: url('/design/emarue/onedesign/images/m_bann_bg.jpg') top center repeat; background-size: 100% 100%; } /** 메인배너(스크립트) **/ #m_bann .main_visual { position: relative; width: 100%; height: 835px; margin: 0 auto; overflow: hidden; } #m_bann .main_visual .bxslider3 { display: block; width: 100%; height: 835px; margin: 0 auto; z-index: 10; } #m_bann .main_visual .bxslider3:after { content: ""; clear: both; display: block; } #m_bann .main_visual .bxslider3 li { width: 100%; height: 835px; margin: 0 auto; cursor: pointer; } #m_bann .main_visual .bxslider3 li .img_slider { min-width: 1250px; height: 835px; } #m_bann .main_visual .bxslider3 li .img_slider01 { background: url(/design/emarue/onedesign/images/wide_bann_01.jpg) no-repeat center top; } #m_bann .main_visual .bxslider3 li .img_slider02 { background: url(/design/emarue/onedesign/images/wide_bann_02.jpg) no-repeat center top; } #m_bann .main_visual .bxslider3 li .img_slider03 { background: url(/design/emarue/onedesign/images/wide_bann_03.jpg) no-repeat center top; } #m_bann .main_visual .bxslider3 li .img_slider04 { background: url(/design/emarue/onedesign/images/wide_bann_04.jpg) no-repeat center top; } #m_bann .main_visual .bxslider3 li .img_slider05 { background: url(/design/emarue/onedesign/images/wide_bann_05.jpg) no-repeat center top; } #m_bann .main_visual .bxslider3 li .img_slider06 { background: url(/design/emarue/onedesign/images/wide_bann_06.jpg) no-repeat center top; } #m_bann .main_visual .bxslider3 li .img_slider07 { background: url(/design/emarue/onedesign/images/wide_bann_07.jpg) no-repeat center top; } /* 좌우 버튼 */ #m_bann .main_visual .bx-controls-direction { z-index: 999; position: absolute; top: 350px; left: 0; width: 100%; height: 35px; } #m_bann .main_visual .bx-controls-direction .bx-prev { display: block; display: none; z-index: 999; position: absolute; top: 0px; left: 2%; background: url(/design/emarue/onedesign/images/notice_btn_left.png) no-repeat left top; width: 100px; height: 35px; text-indent: -5000em; } #m_bann .main_visual .bx-controls-direction .bx-next { display: block; display: none; z-index: 999; position: absolute; top: 0px; right: 2%; background: url(/design/emarue/onedesign/images/notice_btn_right.png) no-repeat left top; width: 100px; height: 35px; text-indent: -5000em; } /* 하단 버튼 */ #m_bann .main_visual .bx-pager { position: absolute; left:45%; bottom: 30px; width: 10%; height: 20px; z-index: 999; text-align: center; } #m_bann .main_visual .bx-has-controls-direction .bx-pager-item { display: inline-block; *display:inline; *zoom:1; height: 20px; margin: 0 2px; vertical-align: middle; } #m_bann .main_visual .bx-has-controls-direction .bx-pager-item a { display: block; width: 10px; height: 20px; text-indent: -5000em; font-size: 0; background: url(/design/emarue/onedesign/images/notice_btn_out.png) no-repeat center center; -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } #m_bann .main_visual .bx-has-controls-direction .bx-pager-item a.active { width: 40px; height: 20px; background: url(/design/emarue/onedesign/images/notice_btn_ov.png) no-repeat center center; -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } /* 중앙배너 */ #mainBanner { clear:both; width:1250px; margin:100px auto; height:395px; overflow:hidden; } /* 좌측 슬라이드 */ #mainBanner .bannerLeft { float:left; width:905px; height:395px; position: relative; } #mainBanner .bx-pager { display: none; } #mainBanner .bx-controls-direction { font-size: 0; } #mainBanner .bx-controls-direction .bx-prev { position:absolute; left:0px; top:50%; width:43px; height:62px; margin-top:-31px; text-align:center; z-index:13; cursor:pointer; background: url('/design/emarue/onedesign/images/btn_banner_left.png'); } #mainBanner .bx-controls-direction .bx-next { position:absolute; right:0px; top:50%; width:43px; height:62px; margin-top:-31px; text-align:center; z-index:13; cursor:pointer; background: url('/design/emarue/onedesign/images/btn_banner_right.png') } /* 우측 */ #mainBanner .bannerRight { float:right; width:325px; height:395px; } #mainBanner img { opacity:1;filter:alpha(opacity=100); -webkit-transition:all 0.2s ease-in-out; transition:all 0.2s ease-in-out; } #mainBanner img:hover { opacity:0.8;filter:alpha(opacity=80); -webkit-transition:all 0.2s ease-in-out; transition:all 0.2s ease-in-out; } /** 마블박스 **/ #marble_box { width: 100%; height: auto; padding: 100px 0; overflow: hidden; background: url('/design/emarue/onedesign/images/bg_marble.jpg') center top no-repeat; } /** 탭 상품진열 ***/ #tab_box { margin-bottom: 145px; } /* 영역 */ #tab_prd { width: 100%; height: 585px; margin-bottom: 85px; overflow: hidden; } #tab_prd_ea { position: relative; width: 100%; height: 585px; overflow: hidden; } #tab_prd_ea .recmd_prd { position: relative; width: 100%; height: 585px; overflow: hidden; } /* 타이틀 */ #tab_prd_ea .recmd_prd .cmm_tlt { width: 325px; height: 585px; float: left; margin-top: 30px; padding-top: 31px; background: url('/design/emarue/onedesign/images/m_tlt_bar.gif') 0 0 no-repeat; } #tab_prd_ea .recmd_prd .cmm_tlt .tlt_l { display:inline-block; *display:inline; *zoom:1; width: 100%; height: auto; font-size: 40px; line-height: 45px; color: #272727; font-weight: 300; font-family: "Julius Sans One","Nanum Gothic",sans-serif; margin-bottom: 30px; padding-bottom: 0; } #tab_prd_ea .recmd_prd .cmm_tlt .tlt_descr_l { width: 100%; height: auto; overflow: hidden; display:inline-block; *display:inline; *zoom:1; font-size: 11px; color: #7f7f7f; line-height: 20px; margin-bottom: 30px; } /* 상품 */ #tab_prd_ea .recmd_prd ul.prdList { display: block; position: absolute; right: 0px; top: 0; width: 885px; height: 585px; } #tab_prd_ea .recmd_prd ul.prdList .box { position: relative; float: left; width: 290px; height: 290px; margin: 0 0 5px 5px; } #tab_prd_ea .recmd_prd ul.prdList .box .prdImg { width: 290px; height: 290px; } #tab_prd_ea .recmd_prd ul.prdList .box .prdImg img { width: 100%; height: 100%; } /* 탭 효과(스크립트) */ .slideshow-wrapper { margin:0 auto; width: 100%; height: 585px; } .slideshow-wrapper .vi { float:left; position:absolute; right: 0; width: 100%; height: auto; z-index:1; opacity:0; filter:alpha(opacity=0); } .slideshow-wrapper .bak { float:left; position:absolute; width: 100%; height: 250px; display:none; } .slideshow-wrapper .btn { position: absolute; top: 250px; left: 0; z-index: 999; width: 325px; height: 32px; text-align: left; } .slideshow-wrapper .btn .btnbox { position: relative; float: right; width: 100%; height:32px; text-align: left; } .slideshow-wrapper .btn .btnbox .bull { float: left; position:relative; width: auto; height:20px; line-height: 20px; padding: 10px 13px; margin: 0 5px 5px 0; text-align: center; cursor:pointer; border-radius: 5px; border: 1px #b2b2b2 solid; color: #919191; } .slideshow-wrapper .btn .btnbox .bull.active { border: 1px #686868 solid; color: #272727; } .slideshow-wrapper .btn .btnbox .bull span { font-weight: 500; font-family: "Raleway","Nanum Gothic",sans-serif; font-size: 13px; } /** 텍스트배너 **/ #txt_bann { width: 100%; height: auto; overflow: hidden; position: relative; } #txt_bann #txt_bann_obj { width: 340px; height: 610px; float: left; margin-right: 135px; } #txt_bann .inner_txt { width: 775px; height: 610px; float: left; } #txt_bann .inner_txt .tlt { width: 100%; height: auto; float: left; margin-top: 90px; padding-top: 31px; background: url('/design/emarue/onedesign/images/m_tlt_bar.gif') 0 0 no-repeat; } #txt_bann .inner_txt .tlt h2 { display:inline-block; *display:inline; *zoom:1; width: 100%; height: auto; font-size: 40px; line-height: 45px; color: #272727; font-weight: 300; font-family: "Julius Sans One","Nanum Gothic",sans-serif; margin-bottom: 30px; } #txt_bann .inner_txt .descr { width: 100%; height: auto; overflow: hidden; display:inline-block; *display:inline; *zoom:1; font-size: 11px; color: #7f7f7f; line-height: 25px; } #txt_bann .inner_txt .btn_more { position: absolute; right: 0; bottom: 0; display: block; width: 225px; height: 40px; text-align: left; background: url('/design/emarue/onedesign/images/bann_more_arr.png') 0 0 no-repeat; } #txt_bann .inner_txt .btn_more span { font-family: "Raleway","Nanum Gothic",sans-serif; } /* 백그라운드 */ .main_fixed_bg { width:100%; min-width:1460px; margin:100px auto; height:400px; background-size:cover; background-attachment:fixed; background-repeat:no-repeat; background-position:center center; background-image:url("/design/emarue/onedesign/images/bg_main_banner.jpg"); } .main_fixed_bg a { display:block; width:100%; height:100%; } .bg_wrapper { display:table; width:100%; height:100%; text-align:center; } .bg_wrap { display:table-cell; vertical-align:middle; max-width:1200px; margin:0 auto; *margin-top:102px; text-align:center; } /* BASIC css end */