/* BASIC css start */ #content { width: 100% !important; padding-left: 0 !important; margin-bottom: 50px !important; max-width: 100% !important; width: 100% !important; } .Wrap { position: relative; width: 1100px; /* max-width: 1600px; min-width: 1260px !important; */ margin: 0 auto; padding-left: 0 !important; } /* best-evt */ #main .best-evt { zoom: 1; overflow: hidden; margin-top: 20px; } /* slideBestEvt */ #main #slideBestEvt { float: left; width: auto; border-left: 0; } /* hashBestEvt */ #main #hashBestEvt { position: relative; float: right; } /* headlineBanner */ #main #headlineBanner { position: relative; margin-top: 20px; } /* mdItem */ #main #mdItem { position: relative; margin-top: 20px; } /* 메인_top */ #contentWrap { width:100% !important; } #content { float:none !important; width:100% !important;} #main { position: relative; } /* visual, notice */ #main .visual-evt { zoom: 1; overflow: hidden; } /* visual */ #main .visual-evt .visual { float: left; } #mainImg { } #mainImg .m_img { width: 100%; position: relative; } .m_img .fixed { width: 362px; height: 454px; overflow: hidden; display: block; } #mainImg .m_img .bxImg { margin: 0 auto; } /* notice */ #main .visual-evt .evt-wrap { float: right; width: 212px; } #main .visual-evt .ntc h2 { font-size: 0; line-height: 0; } #main .visual-evt .ntc .list { zoom: 1; overflow: hidden; padding-top: 17px; padding-left: 10px; margin-right: 6px } #main .visual-evt .ntc .list li, #main .visual-evt .ntc .list a { float: left; } #main .visual-evt .ntc .list li { padding-left: 16px; width: 180px; background: url(/images/d3/modern_simple/common/bull_main_ntc.gif) no-repeat 0 45%; } #main .visual-evt .ntc .list a { width: 100%; height: 23px; line-height: 18px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } #main .visual-evt .ntc .list a:hover { font-weight: bold; letter-spacing: -1px; text-decoration: underline; } /* tit */ .tit_type01 { font-size: 1.9em; color: #000; } .tit_type01 span { display: inline-block; padding-left: 10px; font-size: 13px; color: #666; } /* #banner_type01 */ #banner_type01 { padding: 50px 0; } #banner_type01 > ul { overflow: hidden; } #banner_type01 > ul > li { float: left; border-right: 1px solid #ddd; } #banner_type01 > ul > li:last-child { border-right: none; } /* #banner_type02 */ #banner_type02 { margin-bottom: 50px; } #banner_type02 .ombs_banner01 { width: 100%; overflow: hidden; } #banner_type02 .ombs_banner01 > a, #banner_type02 .ombs_banner01 > div { float: left; } #banner_type02 .ombs_banner01 .banner_s_link, #banner_type02 .ombs_banner01 .bx-wrapper { /* float: left; */ display: inline-block; } #banner_type02 .ombs_banner01 img { } .ombs_banner01 > div > a { display: inline-block; width: 31%; margin-right: 20px; vertical-align: top; } #banner_type02 .ombs_banner01 > div:nth-of-type(1) { width: 551px; } #banner_type02 .ombs_banner01 > div:nth-of-type(2) { position: relative; } #banner_type02 .ombs_banner01 > div:nth-of-type(2) ul { overflow: hidden; position: absolute; top: 50px; text-align: center; width: 100%; } #banner_type02 .ombs_banner01 > div:nth-of-type(2) ul li { } #banner_type02 .ombs_banner01 > div:nth-of-type(2) ul li a { line-height: 1.8em; color: #fff; display: block; font-size: 18px; } /* item_listWrap */ .item_listWrap { margin-top: 60px; margin-bottom: 60px; width: 80%; } .item_listWrap .hd { display: table; width:100%; text-align: center; margin-bottom: 0; } .item_listWrap .hd > h2 { font-size: 3.2em; /* font-family:"Open Sans",'sans-serif'; */ color:#222; line-height:40px; text-transform: uppercase; display: block; } .item_listWrap .hd span { color:#999; font-size: 13px; display: inline-block; margin: 8px 0 0 10px; } .item_listWrap .hd > a { position: absolute; top: 15px; right: 10px; font-size: 0.85em; text-transform: lowercase; font-family:'Dotum','sans-serif'; } .prd_list_boxWrap { display: table; width:100%; overflow: hidden; } .prd_list_boxWrap > li { position: relative; overflow: hidden; display: inline-block; width: 15.3%; box-sizing: border-box; vertical-align: top; margin-right: 15px; } .prd_list_boxWrap > li .list { padding: 4px 4px 0 0; box-sizing: border-box; overflow: hidden; position: relative; } .prd_list_boxWrap > li[data-slide-index="0"], .prd_list_boxWrap > li[data-slide-index="1"], .prd_list_boxWrap > li[data-slide-index="2"] { width: 32.3%; margin-bottom: 15px; } .prd_list_boxWrap > li[data-slide-index="1"] { margin-left: -4px; } .prd_list_boxWrap > li[data-slide-index="2"], .prd_list_boxWrap > li[data-slide-index="8"] { margin: 0 0 0 0 !important; } .prd_list_boxWrap > li .list .list_con { position: absolute; right: 4px; top: 4px; display: none; width: 100%; height: 100%; padding: 50px 18px 0; box-sizing: border-box; background: rgba(0, 0, 0, 0.5); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#4f000000, endColorstr=#4f000000); -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#4f000000, endColorstr=#4f000000)"; } .prd_list_boxWrap > li[data-slide-index="0"] .list_con, .prd_list_boxWrap > li[data-slide-index="2"] .list_con { padding: 42% 30px 0;} .prd_list_boxWrap > li[data-slide-index="3"] { margin-left: 4px; } .prd_list_boxWrap > li .list .fixed { overflow: hidden; width:100%; display: inline-block; } .prd_list_boxWrap > li .list .prdImg { width: 100%; } .prd_list_boxWrap > li .suj { border-bottom: 1px solid #a1a1a1; margin-bottom: 10px; } .prd_list_boxWrap > li .suj a { color: #fff; } .prd_list_boxWrap > li .price strike, .prd_list_boxWrap > li .price strike { display: block; color: #fff; font-size: 0.9em; margin-bottom: 3px; } .prd_list_boxWrap > li .price { color: #fff; } .prd_list_boxWrap > li .brand { margin: 7px 0 10px 0; } /* 베스트상품 */ .specialWrap { padding-bottom: 0px; position: relative; overflow: hidden; width: 1100px; margin: 0 auto; } .specialWrap h2 { font-size: 42px !important; margin-bottom: 15px; font-family: "Nanum Gothic","Open Sans",'sans-serif' !important; font-weight: 600; } .specialWrap h3 { font-size: 15px !important; margin-bottom: 15px; font-family: "Nanum Gothic","Open Sans",'sans-serif' !important; font-weight: 600; position: relative; border:1px solid #f0f0f0; background: #fdfdfd; padding: 10px 15px; } .specialWrap h3 span { color: #000; } .specialWrap h3 a { position: absolute; right: 15px; top: 10px; } .specialWrap > div { overflow: hidden; position: relative; display: table; width: 100%; vertical-align: top; } .specialWrap > div > a, .specialWrap > div > div { display: table-cell; vertical-align: top; } .specialWrap > div > div { width: 600px; border-bottom: 1px solid #f0f0f0; } .specialWrap > div > div .bx-wrapper { margin: 0 auto; } .special_list_boxWrap { display: table; width:100%; overflow: hidden; } .special_list_boxWrap > li { position: relative; overflow: hidden; display: inline-block; width: 15.3%; box-sizing: border-box; vertical-align: top; margin-right: 15px; } .special_list_boxWrap > li .list { padding: 4px 4px 0 0; box-sizing: border-box; overflow: hidden; position: relative; } .special_list_boxWrap > li .list .list_con { position: absolute; right: 4px; top: 4px; display: none; width: 100%; height: 100%; padding: 50px 18px 0; box-sizing: border-box; background: rgba(0, 0, 0, 0.5); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#4f000000, endColorstr=#4f000000); -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#4f000000, endColorstr=#4f000000)"; } .special_list_boxWrap > li[data-slide-index="0"] .list_con, .special_list_boxWrap > li[data-slide-index="2"] .list_con { padding: 42% 30px 0;} .special_list_boxWrap > li[data-slide-index="3"] { margin-left: 4px; } .special_list_boxWrap > li .list .fixed { overflow: hidden; width:100%; display: inline-block; } .special_list_boxWrap > li .list .prdImg { width: 100%; } .special_list_boxWrap > li .suj { border-bottom: 1px solid #eee; margin-bottom: 10px; text-align: center; } .special_list_boxWrap > li .suj a { color: #666; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; white-space: normal; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;} .special_list_boxWrap > li .price strike, .special_list_boxWrap > li .price strike { display: block; color: #666; font-size: 0.9em; margin-bottom: 3px; } .special_list_boxWrap > li .price { color: #666; } .special_list_boxWrap > li .brand { margin: 7px 0 10px 0; } .special_list_boxWrap .sub_content { display: none; } .special_list_boxWrap .sub_content > a { white-space: normal; line-height: 1.4; height: 2.8em; text-align: left; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-align: center; } .special_list_boxWrap > li .listPrd { padding: 30px 20px 0px; } /* 신상품 */ .prd_newWrap { } .prd_newWrap .hd { margin: 60px 0 0px} .prd_newWrap .hd > h2 { } /* tit */ .prd_newWrap .hd { display: table; width:100%; margin-bottom: 20px; text-align: left; background: #f8f8f8; border: 1px solid #e4e4e4; height: 40px; } .prd_newWrap .hd > h2 { font-size: 15px; font-family:"Open Sans",'sans-serif'; color:#222; line-height:40px; text-transform: uppercase; display: block; padding: 0 20px; } .prd_newWrap .hd > h2 span { color: #000; } .prd_newWrap .hd > h2 > a { position: absolute; right: 20px; top: 20px; font-size: 13px; color: #555; } .prd_newWrap .hd > h2 > a:hover { color:#000; } .prd_newWrap .hd span { color:#999; font-size: 13px; display: inline-block; margin: 8px 0 0 10px; } .prd_newWrap .hd > a { position: absolute; top: 15px; right: 10px; font-size: 0.85em; text-transform: lowercase; font-family:'Dotum','sans-serif'; } /* review */ #reviewWrap { max-width: 1620px; margin: 0 auto; } #reviewWrap .hd { margin-bottom: 30px; } .board_list { overflow: hidden; width: 100%; display: table; } .board_list > li { position: relative; overflow: hidden; display: inline-block; box-sizing: border-box; vertical-align: top; } .board_list .listBoard { padding: 20px 0 0 0; box-sizing: border-box; overflow: hidden; position: relative;} .board_list .board_con { margin-top: 10px; width: 85%; } .board_list .board_con .star { margin-bottom: 5px; margin-top: 20px; } .board_list .board_con p { word-break: break-all; } .board_list .board_con:last-child p { margin-bottom: 10px; padding-right: 10px; } .board_list .board_con .MS_review_mark { margin-top: 5px; } .board_list > li .board_img { box-sizing: border-box; overflow: hidden; position: relative; width: 100%; height: 100%; } /** ===================================* * BxSlider v4.1.2 - Fully loaded, responsive content slider * http://bxslider.com * * Written by: Steven Wanderski, 2014 * http://stevenwanderski.c om * (while drinking Belgian ales and listening to jazz) * * CEO and founder of bxCreative, LTD * http://bxcreative.com */ /** RESET AND LAYOUT =================================== 지우지 마세요! */ /* .bx-wrapper img { display: block; width:100%; } */ .bx-wrapper .prdImg, .bx-wrapper .bxImg { display: block; width: 100%; } /* 메인이미지 */ .main_ombs img { width: 100%; } #mainImg { position: relative; overflow: hidden; } .m_img .bx-wrapper .bx-controls-auto { position: absolute; bottom: 0; width: 100%; } /* DIRECTION CONTROLS (NEXT / PREV) */ .m_img .bx-wrapper .bx-controls-direction { position: absolute; top: 45%; width: 100%; display: none; } .m_img .bx-wrapper .bx-controls-direction a { position: absolute; top: 0; outline: 0; width: 27px; height: 52px; text-indent: -9999px; z-index: 9999; } .m_img .bx-wrapper .bx-controls-direction a.disabled { display: none; } .m_img .bx-wrapper .bx-controls-direction a { text-indent: -999em; } .m_img .bx-wrapper .bx-prev { left: 5%; background: url(/design/icosco/sn0848/images/main_best_arrow_l.png) no-repeat; } .m_img .bx-wrapper .bx-next { right: 5%; background: url(/design/icosco/sn0848/images/main_best_arrow_r.png) no-repeat; } .m_img .bx-controls-direction a { opacity: 0; transition: opacity .25s ease-in-out; -moz-transition: opacity .25s ease-in-out; -webkit-transition: opacity .25s ease-in-out; } .m_img .bx-wrapper:hover .bx-controls-direction a { opacity: 1; } #bx-pager { position: absolute; bottom:0; left: 50%; margin-left: -365px; width: 800px; z-index: 9000; } #bx-pager a { display: inline-block; width: 170px; text-align: center; border: 1px solid #ddd; height: 30px; line-height: 30px; background: #fff; margin-left: -3px; } #bx-pager a.active { background: #5b5852; color: #fff; font-weight: bold; } /* 판매자 추천상품 */ #bestPrd_ombs .bx-wrapper .bx-controls-auto { position: absolute; bottom: 0; width: 100%; } #bestPrd_ombs .bx-pager { width: 100%; z-index: 9999; bottom: 5%; /*top: 58%; */ position: absolute; display: table; text-align: center; display: none; } #bestPrd_ombs .bx-pager > div { display: inline-block; text-align: center; margin: 0 5px; } #bestPrd_ombs .bx-pager-item { } #bestPrd_ombs .bx-pager-item a { text-indent: -999em; width: 10px; height: 10px; border-radius: 50%; background: #fff; display: block; } #bestPrd_ombs .bx-pager-item a.active { background: #555; } /* DIRECTION CONTROLS (NEXT / PREV) */ #bestPrd_ombs .bx-wrapper .bx-controls-direction { position: absolute; top: -55px; width: 100%; } #bestPrd_ombs .bx-wrapper .bx-controls-direction a { position: absolute; top: 0; outline: 0; width: 32px; height: 32px; text-indent: -9999px; z-index: 9999; border:1px solid #ddd; } #bestPrd_ombs .bx-wrapper .bx-controls-direction a i { display: inline-block; width:100%; position: absolute; text-align: center; font-size:1.5em; height: 33px; line-height: 33px; text-indent: 0; left:0; top: 0; } #bestPrd_ombs .bx-wrapper .bx-controls-direction a.disabled { display: none; } #bestPrd_ombs .bx-wrapper .bx-controls-direction a { text-indent: -999em; } #bestPrd_ombs .bx-wrapper .bx-prev { right: 33px; background: #f4f4f4; } #bestPrd_ombs .bx-wrapper .bx-next { right: 0px; background: #f4f4f4; } /* start / stop */ #bestPrd_ombs .bx-wrapper .bx-controls-auto { position: absolute; top: -25px; width: 100%; text-align: right; display: table; } #bestPrd_ombs .bx-wrapper .bx-controls-auto > div { display: inline-block; width: 20px; text-align: left; } #bestPrd_ombs .bx-wrapper .bx-controls-auto > div a { position: relative; display: block; color: #fff; margin-right: 10px; } #bestPrd_ombs .bx-wrapper .bx-controls-auto > div a i { position: absolute; top: 0; left: 0; width: 100%; color: #888; font-size: 1.5em; } #bestPrd_ombs .bx-wrapper .bx-controls-auto > div a:hover i { color: #000; } #bestPrd_ombs .bx-wrapper .bx-controls-auto .bx-stop { } #bestPrd_ombs .bx-wrapper .bx-controls-auto .bx-start { } .tabPrd_list .bx-controls-direction { display: none; } /* #bannery_type01 */ #banner_type02 .ombs_banner01 .bx-wrapper .bx-controls-auto { position: absolute; bottom: 0; width: 100%; } #banner_type02 .ombs_banner01 .bx-pager { width: 100%; z-index: 9999; bottom: 10px; /*top: 58%; */ position: absolute; display: table; text-align: center; } #banner_type02 .ombs_banner01 .bx-pager > div { display: inline-block; text-align: center; margin: 0 1.5px; } #banner_type02 .ombs_banner01 .bx-pager-item { } #banner_type02 .ombs_banner01 .bx-pager-item a { text-indent: -999em; width: 22px; height: 3px; background: #b5b5b5; display: block; } #banner_type021 .ombs_banner01 .bx-pager-item a.active { background: #000; } /* DIRECTION CONTROLS (NEXT / PREV) */ #banner_type02 .ombs_banner01 .bx-wrapper .bx-controls-direction { position: absolute; top: 48%; width: 100%; } #banner_type02 .ombs_banner01 .bx-wrapper .bx-controls-direction a { position: absolute; top: 0; outline: 0; width: 49px; height: 36px; text-indent: -9999px; z-index: 9999; } #banner_type02 .ombs_banner01 .bx-wrapper .bx-controls-direction a i { display: inline-block; width:100%; position: absolute; text-align: center; font-size:1.5em; height: 33px; line-height: 33px; text-indent: 0; left:0; top: 0; color: #fff; } #banner_type02 .ombs_banner01 .bx-wrapper .bx-controls-direction a.disabled { display: none; } #banner_type02 .ombs_banner01 .bx-wrapper .bx-controls-direction a { text-indent: -999em; } #banner_type02 .ombs_banner01 .bx-wrapper .bx-prev { left: 0px; background: rgba(000, 000, 000, 0.4); } #banner_type02 .ombs_banner01 .bx-wrapper .bx-next { right: 0px; background: rgba(000, 000, 000, 0.4); } /* #mdChoice */ #mdChoice .bx-wrapper .bx-controls-auto { position: absolute; bottom: 0; width: 100%; } #mdChoice .bx-pager { width: 100%; z-index: 9999; top: -25px; left: 85%; /*top: 58%; text-align: center; */ position: absolute; display: table; } #mdChoice .bx-pager > div { display: inline-block; text-align: center; margin: 0 1.5px; } #mdChoice .bx-pager-item { } #mdChoice .bx-pager-item a { text-indent: -999em; width: 8px; height: 5px; background: #b5b5b5; display: block; } #mdChoice .bx-pager-item a.active { background: #000; } #mdChoice .bx-wrapper .bx-controls-direction { display: none; } /* 특별상품 */ .specialWrap .bx-pager { display: none; } /* DIRECTION CONTROLS (NEXT / PREV) */ .specialWrap .bx-wrapper .bx-controls-auto { position: absolute; bottom: 0; width: 100%; } .specialWrap .bx-pager { width: 100%; z-index: 9999; bottom: -40px; /*top: 58%; */ position: absolute; display: table; text-align: center; display: none; } .specialWrap .bx-pager > div { display: inline-block; text-align: center; margin: 0 5px; } .specialWrap .bx-pager-item { } .specialWrap .bx-pager-item a { text-indent: -999em; width: 10px; height: 10px; border-radius: 50%; background: #b5b5b5; display: block; } .specialWrap .bx-pager-item a.active { background: #000; } .specialWrap .bx-wrapper .bx-controls-direction { position: absolute; top: 40%; width: 100%; /* display: none; height: 80px; */ } .specialWrap .bx-wrapper .bx-controls-direction a { position: absolute; top: 0; outline: 0; width: 27px; height: 52px; text-indent: -9999px; z-index: 9999; /* display: none; */ } .specialWrap .bx-wrapper .bx-controls-direction a.disabled { display: none; } .specialWrap .bx-wrapper .bx-controls-direction a { text-indent: -999em; } .specialWrap .bx-wrapper .bx-prev { left: -20px; background: url(/design/icosco/sn0848/images/main_best_arrow_l.png) no-repeat; background-size: 50%; } .specialWrap .bx-wrapper .bx-next { right: -30px; background: url(/design/icosco/sn0848/images/main_best_arrow_r.png) no-repeat; background-size: 50%; } .specialWrap .bx-controls-auto { display: none; } /* .banner01 DIRECTION CONTROLS (NEXT / PREV) */ .banner02_slideWrap .bx-wrapper .bx-controls-direction { width: 1000px; left: 50%; margin-left: -570px; position: absolute; top: 30px; z-index: 9999; } .banner02_slideWrap .bx-wrapper .bx-controls-direction a { position: absolute; top: 0; outline: 0; text-indent: -9999px; z-index: 19999; height: 30px; opacity: 0.3; width: 40px; background: #000; } .banner02_slideWrap .bx-wrapper .bx-controls-direction a.disabled { display: none; } .banner02_slideWrap .bx-wrapper .bx-controls-direction a { text-indent: -999em; } .banner02_slideWrap .bx-wrapper .bx-prev { } .banner02_slideWrap .bx-wrapper .bx-next { left: 41px; } .banner02_slideWrap .bx-wrapper .bx-controls-direction a i { text-indent: 0px !important; color: #fff; font-size: 1.5em; width:100%; height:100%; position: absolute; top:5px; left:0; text-align: center; } .banner02_slideWrap .bx-wrapper .bx-controls-direction a:hover { opacity: 0.5; } .banner02_slideWrap .bx-wrapper .bx-controls-auto { position: absolute; bottom: 0; width: 100%; } .banner02_slideWrap .bx-pager { width: 100%; z-index: 9999; bottom: 10px; position: absolute; display: table; text-align: center; } .banner02_slideWrap .bx-pager > div { display: inline-block; text-align: center; margin: 0 5px; } .banner02_slideWrap .bx-pager-item { } .banner02_slideWrap .bx-pager-item a { text-indent: -999em; width: 9px; height: 9px; border-radius: 50%; background: #fff; display: block; } .banner02_slideWrap .bx-pager-item a.active { background: #555;} @media screen and (min-width:320px) and (max-width:1530px){ .banner01_Wrap ul { margin-left: 23%; } .banner01_Wrap .bx-wrapper .bx-controls-direction { left: 23%; } #boardWrap > div > div.noticeWrap li a { width: 180px; } } /* BASIC css end */