/* BASIC css start */ /* 메인이미지 */ .visual { position:relative } .visual .bx-controls-direction { position:absolute; top:45%; left:0; right:0; z-index:101} .visual .bx-controls-direction a {position: absolute; top: 0; font-size: 28px; color: #000; background: rgba(255, 255, 255, 0.9); border-radius: 100px; width: 45px; height: 45px; line-height: 45px; text-align: center;} .visual .bx-controls-direction .bx-prev { left:26px } .visual .bx-controls-direction .bx-next { right:26px } .visual .bx-pager{position:absolute;bottom: 20px;left:0;right:0;text-align:center; z-index:101} .visual .bx-pager-item{transition:all 0.3s ease;-webkit-transition:all 0.3s ease;display:inline-block;position:relative;} .visual .bx-pager-link{display:inline-block;width: 25px;height: 6px;font-size:0;margin: 0 3px;background-color: #aaa;} .visual .bx-pager-link.active{width: 25px;background-color: rgba(45, 45, 45, 0.8);} .item-wrap { padding-top:70px } .item-wrap h3 { padding-bottom:20px; font-size:20px; font-weight:700; text-align:center; } .item-wrap h3 span { padding: 0 25px; background: #fff; } /* 신상품 */ #newitemArea .item-wrap .item-cont .item-list {width:calc(100%/3); position: relative; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-around; float: left; margin:0;} #newitemArea .item-wrap .item-cont .item-list .thumb{object-fit:contain;} #mdChoiceArea .item-wrap .item-cont .item-list {width:calc(100%/4); position: relative; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-around; float: left; margin:0;} #mdChoiceArea .item-wrap .item-cont .item-list .thumb{object-fit:contain; object-position:;} /* 중간 3종 배너*/ .subBanner{ position:relative; margin-top: 30px; margin-bottom:30px; left:100px;} .subBanner:after { content:""; clear:both; display:block; } .subBanner li{float:left; padding-right: 18px;} .subBanner li:last-child{padding-right:0} .subBanner li a{ display: block;} .subBanner img{max-width: 320px; } /*영상*/ .movieWrap {position:relative; overflow: hidden; background:url('/design/abilitykor/12890/tem160/movie_bg1.jpg'); width:1200px; height:704px} .movieWrap:after { content:""; clear:both; display:block; } .movieWrap .load{position:relative; padding-bottom:56.25%; height:0;} .movieWrap .load iframe{ position: absolute; top: 42%; left: 23%; width: 640px; height: 360px;} /* 추가한 부분 Video Area */ .videoWrap { margin-top:30px; position:relative; width: 100%; background:#f8f8f8 } .videoWrap .videoInner { width: 1200px; margin: 0 auto ; padding: 68px 0;} .videoWrap .videoInner dl.video { float:left; font-weight: bold;} .videoWrap .videoInner dl.video dt {margin: 0 0 28px 0} .videoWrap .videoInner dl.video dt .vdTit {font-size: 30px;} .videoWrap .videoInner dl.video dd { position:relative; overflow: hidden; } .videoWrap .videoInner dl.video dd iframe { width: 780px; height:430px;border:0; } /* 추가한 부분 */ .add1Product {float:left; margin:0 0 0 40px; position:relative;width:340px} .add1Product > dt { font-size:30px; font-weight:bold; margin: 0 0 28px 0} .add1Product .item-list { width:340px; } .add1Product .item-list .thumb { position:relative; width:340px; overflow: hidden; } .add1Product .item-list .thumb img { width:340px;} .add1Product .item-list .thumb:hover .prd-preview { display:block; -webkit-transition: -webkit-transform 0.5s ease;transition:transform 0.5s ease; } .add1Product .item-list .thumb .prd-preview { display:none; position:absolute; right:0; bottom:0; width:40px; height:40px; background-color:rgba(255, 255, 255, 0.9);} .add1Product .item-list .thumb .prd-preview a { display:block;font-size:18px; line-height:40px; text-align:center;} .add1Product .item-list .thumb .prd-preview:hover { background-color:rgba(255, 255, 255, 1);} .add1Product .item-list .prd-name { padding:20px 0 0;font-size:16px; } .add1Product .item-list .prd-price { padding:15px 0 0; font-size:16px; } .add1Product .item-list .prd-price del { color:#999; font-size:14px; margin-right:5px; } .add1Product .bx-controls-direction { position:absolute; top:270px; left:0; right:0 } .add1Product .bx-controls-direction a { position:absolute; top:0; font-size:35px; } .add1Product .bx-controls-direction .bx-prev { left:-50px } .add1Product .bx-controls-direction .bx-next { right:-50px } .add1Product .bx-pager { position:absolute;right:0;bottom:0;margin:32px 0 0; } .add1Product .bx-pager .bx-pager-item { display:inline-block; margin:0 5px; } .add1Product .bx-pager .bx-pager-item a { width:12px; height:12px; border-radius:50%;display:block; font-size:0;background-color:#8d8d8d; } .add1Product .bx-pager .bx-pager-item a.active { background-color:#000; } .specialItem { margin: 30px auto 30px; position:relative } .specialItem:after { content:""; clear:both; display:block; } .specialItem .slide dl { position:relative } .specialItem .slide dt { width:100%; height:100%; cursor:pointer; overflow:hidden } .specialItem .slide dt img { width:100%; height:100%; transition: all 1s ease; -moz-transition: all 1s ease; -ms-transition: all 1s ease; -webkit-transition: all 1s ease; -o-transition: all 1s ease } .specialItem .slide dd { display:none; position:absolute; top:0; left:0; width:100%; height:100%; background-color: rgba(225,225,225,0.8); overflow:hidden; z-index:2 } .specialItem .slide dd a { display:block; padding-top:100px; width:100%; color:#fff; text-align:center } .specialItem .slide dd a .prd-name { display: block; margin:0 10px; padding-bottom:5px; font-size:12px; color:#000; border-bottom:none } .specialItem .slide dd a .prd-price { display:block; margin:0 10px !important ;padding-top:3px;font-size:14px; font-weight: bold;color:#000;} .specialItem .slide dd a .prd-price del {color:#000; font-weight: normal; font-size: 12px; margin-right: 5px} .specialItem .slide dd a .prd-subname{padding: 15px 25px;color:#000; } .specialItem .bx-controls { position:absolute; top:70px; left:0; width:100% } .specialItem .bx-controls a { position:absolute; top:0; font-size:24px } .specialItem .bx-controls .bx-prev { left:0 } .specialItem .bx-controls .bx-next { right:0 } /* BASIC css end */