@charset "utf-8";

/************************************************************************
 * 파일명      : product.css
 * 설명        : 상세페이지
 * 작성자      : (주)스마일웹 디자인팀
 * 작성일      : 2012.12.18
 * 최종수정일  : 2012.12.18
 * Copyright (c) 2012 Smileweb co., Ltd.  All rights reserved.  www.smileweb.co.kr *
************************************************************************/

h2 {font:12px Dotum; color:#444;}
h4 {position:relative; clear:both;}

.step_1 {float:left; width:900px;}


 /* 쇼핑상세정보 */
.detail_area {float:left; width:900px;}
.title_area {border-bottom:5px solid #ddd; padding-bottom:10px; height:30px;}
.title_area .title {font-size:13px; color:#272727; font-weight:bold; margin-bottom:10px;}
.title_area .codenum {font-size:11px; color:#999;}
.photo_area {float:left; width:365px; margin-top:10px;}
.photo_area .big_photo {width:360px; height:360px; border:2px solid #ddd; margin-top:10px;}
.photo_area .photo {float:left; width:302px; }
.photo_area .big {display:table-cell; border:2px solid #ddd; width:302px; height:302px; vertical-align:middle;} 
.photo_area .zoom {margin:12px 0; text-align:center;}
.photo_area .sns_btn{text-align:center; padding:10px 0;}
.photo_area .thum {text-align:center; height:69px; margin-top:10px;}	
.photo_area .thum ul {float:left; width:302px;}
.photo_area .thum ul li {float:left; width:69px; height:69px; margin-right:8px;}
.photo_area .thum ul li.last {margin-right:0px;}
.photo_area .thum ul li img {width:67px; height:67px; border:1px solid #ddd;}

.detail {float:right; width:490px; margin:0;}
.detail dl {border-bottom:1px solid #ddd; font-size:12px; margin-top:5px;}
.detail dl dt {width:100px; color:#777; line-height:30px; padding-left:10px; }
.detail dl dd {float:right; width:380px; font-size:12px; letter-spacing:0; margin-top:-22px; padding-right:1px;}
.detail dl dd .price { color:#ff6600; font-size:21px; font-weight:bold; font-family:Tahoma; line-height:18px;}
.detail dl dd img.ico {vertical-align:text-bottom; margin:0 2px;}


 /* 경매상세정보 */
 .detail_area1 {float:left; width:900px;}
.title_area1 {border-bottom:5px solid #ddd; padding-bottom:10px; height:20px;}
.title_area1 .title {font-size:15px; color:#272727; font-weight:bold; margin-bottom:10px;}
.title_area1 .codenum {font-size:11px; color:#999;}
.photo_area1 {float:left; width:365px; margin-top:10px;}
.photo_area1 .big_photo {width:360px; height:360px; border:1px solid #ddd; margin-top:10px;}
.photo_area1 .photo {float:left; width:302px; }
.photo_area1 .big {display:table-cell; border:2px solid #ddd; width:302px; height:302px; vertical-align:middle;} 
.photo_area1 .zoom {margin:12px 0; text-align:center;}
.photo_area1 .sns_btn{text-align:center; padding:10px 0;}
.photo_area1 .thum {text-align:center; height:69px; margin-top:10px;}	
.photo_area1 .thum ul {float:left; width:302px;}
.photo_area1 .thum ul li {float:left; width:69px; height:69px; margin-right:8px;}
.photo_area1 .thum ul li.last {margin-right:0px;}
.photo_area1 .thum ul li img {width:67px; height:67px; border:1px solid #ddd;}

.detail1 {float:right; width:490px; margin-top:0px;}
.detail1 dl {border-bottom:1px solid #ddd; font-size:12px; margin-top:5px;}
.detail1 dl .box{ border-bottom:0px; height: 131px; font-size:12px; margin-top:5px; background:url('/images/product/gray_bx.png') no-repeat ;}
.detail1 dl dt {width:100px; color:#777; line-height:30px; padding-left:10px; }
.detail1 dl dd {float:right; width:380px; font-size:12px; letter-spacing:0; margin-top:-22px; padding-right:1px;}
.detail1 dl dd .price { color:#ff6600; font-size:21px; font-weight:bold; font-family:Tahoma; line-height:18px;}
.detail1 dl dd img.ico {vertical-align:text-bottom; margin:0 2px;}


.opt_price {border-top:1px solid #7e7d7d; padding-top:10px; margin-top:15px; font-weight:bold; text-align:right;}
.opt_price .gap {font-weight:normal; color:#e0e0e0;}

.product_btn {text-align:center; margin-top:20px;}
​
 /* option */
.detail {font-size:11px;}
.detail .title {padding-bottom:5px}
.detail .del {position:absolute; right:10px; top:10px;}

.detail .option_type1 {position:relative; background:#fbfbfb; border:1px solid #ddd; margin-top:8px; padding:8px 10px;}
.detail .option_type1 td {font-size:11px; padding:2px 0;}
.detail .option_type1 select {width:93%; height:19px; font-size:12px; color:#444;}
.detail .option_type1 .su {position:relative;}
.detail .option_type1 .su input {height:12px;}
.detail .option_type1 .su .num_plus {position:absolute; left:42px; top:0;}
.detail .option_type1 .su .num_minus {position:absolute; left:42px; top:10px;}
.detail .option_type1 .su .ea {position:absolute; left:58px; top:3px;}

.detail .option_type2 {position:relative; background:#fff; border:1px solid #ddd; margin-top:8px; padding:8px 10px;}
.detail .option_type2 td {font-size:11px; padding:2px 0;}
.detail .option_type2 td.v_top {vertical-align:top;}
.detail .option_type2 td.v_top2 {vertical-align:top; padding-top:6px;}
.detail .option_type2 td img {vertical-align:top; padding-top:1px;}
.detail .option_type2 .su {position:relative; margin-left:10px; width:60px;}
.detail .option_type2 .su input {height:12px; margin:2px 0;}
.detail .option_type2 .su .num_plus {position:absolute; right:12px; top:2px;}
.detail .option_type2 .su .num_minus {position:absolute; right:12px; top:12px;}
.detail .option_type2 .su .ea {position:absolute; right:0; top:5px;}

/* 오른쪽 영역 */
.grade_area {float:right; width:180px;}
.grade_area .review {position:relative; height:16px; border-bottom:5px solid #ddd; font-size:11px; padding:6px 0 8px 0;}
.grade_area .review .star {position:absolute; bottom:9px; right:0;}
.grade_area .satisfy {height:50px; border-bottom:1px solid #ddd; padding:14px 5px 0 0;}
.grade_area .satisfy .per {text-align:right; font:bold 24px Malgun Gothic; color:#ff6600;}
.grade_area .like_goods li {margin-top:12px;}
.grade_area .like_goods .img {display:inline-block; vertical-align:middle; margin-right:4px;  border:1px solid #ddd;}
.grade_area .like_goods .txt {display:inline-block; vertical-align:middle; width:60%; font-size:11px;}

/* 미니샵정보 */
.shop_area {float:left; width:898px; height:193px; border-width:2px 1px 1px 1px; border-color:#ddd; border-style:solid; font-size:11px; margin-top:40px;}
.mini_info {float:left; width:242px; height:193px; border-right:1px solid #ddd;}
.mini_info h3 {height:12px; background:#f7f7f7; font:bold 12px Dotum; padding:10px 15px;}
.mini_info .txt {margin:5px 15px;  padding-top:10px;}
.mini_info .logo {display:inline-block; vertical-align:middle; margin:7px 10px 0 15px; border:1px solid #ddd; padding:4px;}
.mini_info .btn {display:inline-block; vertical-align:middle;}
.mini_info .plan {margin:10px 0 0 15px;}
.shop_goods {float:left; width:600px; padding:10px 15px 0 40px; position:relative;}
.shop_goods li {float:left; height:120px; margin:5px 13px; text-align:center;}
.shop_goods li .img {border:1px solid #ddd;}
.shop_goods .btn {text-decoration:underline; color:#ff6600;}
.shop_goods .btn_l {position:absolute; top:70px; left:20px;}
.shop_goods .btn_r {position:absolute; top:70px; right:20px;}


/* 경매미니샵정보 */
.shop_area {float:left; width:898px; height:193px; border-width:2px 1px 1px 1px; border-color:#ddd; border-style:solid; font-size:11px; margin-top:40px;}
.mini_info1 {float:left; width:242px; height:193px; border-right:1px solid #ddd;}
.mini_info1 h3 {height:12px; background:#f7f7f7; font:bold 12px Dotum; padding:10px 15px;}
.mini_info1 .txt {margin:5px 15px; padding-top:10px;}
.mini_info1 .logo {display:inline-block; vertical-align:middle; margin:7px 10px 0 15px; border:1px solid #ddd; padding:4px;}
.mini_info1 .btn {display:inline-block; vertical-align:middle;}
.mini_info1 .plan {margin:10px 0 0 15px;}
.shop_goods {float:left; width:600px; padding:10px 15px 0 40px; position:relative;}
.shop_goods li {float:left; height:120px; margin:5px 13px; text-align:center;}
.shop_goods li .img {border:1px solid #ddd;}
.shop_goods .btn {text-decoration:underline; color:#ff6600;}
.shop_goods .btn_l {position:absolute; top:70px; left:20px;}
.shop_goods .btn_r {position:absolute; top:70px; right:20px;}

.blank {clear:both; overflow:hidden; margin-top:10px;}

.layer {position:absolute; top:-100px; left:-1px; width:300px; background:#fff; z-index:1000; border:2px solid #4858da; padding:15px;}
.layer h5 {border-bottom:1px solid #4858da; padding:5px 0; font-weight:bold; color:#4858da;}
.layer tr th {border:1px solid #ddd; text-align:center; padding:5px 10px; background:#fbfbfb;}
.layer tr td {border:1px solid #ddd; text-align:center; padding:5px 10px;}

/* tab */
.tab_info {width:900px; height:34px; margin:40px 0 20px 0; border-bottom:1px solid #4959da;}
.tab_info li {width:225px; float:left; text-align:center;}
.tab_info li a {background:#f7f7f7; border:1px solid #d4d4d4; border-bottom:none; position:relative; margin-right:-1px; height:25px; padding-top:8px; display:block;}
.tab_info li.on {width:224px;}

/*경매 tab */
.tab_info1 {width:900px; height:34px; margin:40px 0 20px 0; border-bottom:1px solid #4959da;}
.tab_info1 li {width:300px; float:left; text-align:center;}
.tab_info1 li a {background:#f7f7f7; border:1px solid #d4d4d4; border-bottom:none; position:relative; margin-right:-1px; height:25px; padding-top:8px; display:block;}
.tab_info1 li.on {width:299px;}

/* table */
.tbl_info {margin-top:10px;}
.tbl_info th {border:1px solid #ddd; padding:6px; text-align:left; font:normal 11px Dotum; background:#fbfbfb;}
.tbl_info td {border:1px solid #ddd; padding:6px; text-align:left; font:normal 11px Dotum;}

.tbl_return {margin-top:10px;}
.tbl_return th {border:1px solid #ddd; padding:10px; text-align:left; font:bold 11px Dotum; background:#fbfbfb;}
.tbl_return td {border:1px solid #ddd; padding:10px; text-align:left; font:normal 11px Dotum; line-height:180%;}

/* 상세이미지 */
.info_img {margin-top:15px; text-align:center; margin:0 auto 0 auto;}

/* 구매후기 */
.review_box {float:left; width:852px; border:4px solid #ddd; padding:15px 20px; margin:10px 0 30px 0;}
.line_v_dot {float:left; width:1px; height:112px; background:url('/images/product/common/line_v_dot.gif') no-repeat center 0; padding:0 30px;}

.review1 {float:left; width:380px; margin-right:10px;}
.review1 tr td {padding:3px 0; font-size:11px;}
.review1 .graph {width:113px; height:10px; background:#ddd;}

.review2 {float:left;}
.review2 tr td {padding:2px 10px; font-size:11px; vertical-align:bottom; text-align:center;}
.review2 .graph {width:30px; height:50px;}

.review_btn {clear:both; overflow:hidden; margin-top:40px;}
.review_btn .txt_l {float:left;}
.review_btn .txt_r {float:right;}

/* 상품문의 */
.qna_box {border:1px solid #ddd; width:868px; padding:15px;}
.qna_box h3 {border-bottom:1px dotted #999; padding-bottom:15px;}
.qna_box table {margin-top:15px;}
.qna_box tr th {padding:5px; text-align:left; font:normal 11px Dotum;}
.qna_box tr td {padding:5px; text-align:left; font:normal 11px Dotum;}
.qna_box .btn {border-top:1px solid #ddd; text-align:center; padding-top:15px; margin-top:15px;}
