@import url("common.css");


/* Á¦Ç° ¸®½ºÆ® */
.price_search{background:#f9f9f9; border:1px solid #ddd; padding:10px 25px; height:40px; margin-bottom:10px;}
.price_search h5{color:#333; font-size:14px; float:left; margin:7px 30px 7px 0;}
.price_search .input_area{padding:5px 20px 5px 0; display:inline-block;}
.price_search .input_area input{padding:5px;}
.price_search .btn{float:right;}

.sort_area{position:relative; overflow:hidden; border:1px solid #ddd; padding:20px 30px 17px 30px;}
.sort_area dd{float:left;}
.sort_area dd a{display:inline-block; line-height:100%; margin-right:20px; letter-spacing:-0.5pt; vertical-align:top;}
.sort_area dt{float:right; line-height:100%; letter-spacing:-0.5pt;}
.sort_area dt strong{ line-height:100%; letter-spacing:0.3pt; color:#333}

.cate_table {border:1px solid #ddd; background:#f9f9f9; padding:10px; margin-bottom:20px;}
.cate_table td {background:url('/admin/product2/skin/prdBasic/image/product_cat_icon.gif') 10px 15px no-repeat  ; padding:5px 0 5px 20px; line-height:120%; text-align:left;} /*  height:40px; */
.category_area h3{font-weight:600; background:#333; padding:15px 20px; color:#fff; font-size:15px; line-height:100%; text-align:left;}



.prd_list{position:relative;  overflow:hidden;}
.prd_list .none{background:#f9f9f9; text-align:center; padding:60px 0; width:100%;}
.prd_list dl{position:relative; width:100%; margin:0 0 2% 0; font-size:0}
.prd_list dl a{display:block; background:#fff; border:1px solid #ddd; transition: all 0.5s;}
.prd_list dl a dt{display:inline-block; width:100px; text-align:center; vertical-align:middle; transition: all 0.3s; padding:20px 0;}
.prd_list dl a dd{display:inline-block; width:calc(100% - 100px); vertical-align:middle; font-size:1rem; word-break: keep-all;}
.prd_list dl a dd p.tit{color:#666; margin:0 0 0 0; letter-spacing:-0.4pt; transition: all 0.3s;}
.prd_list dl a dd p.price{color:#333; font-size:1.1rem; font-weight:bold; transition: all 0.3s;}
.prd_list dl a p.price s{color:#999; font-weight:normal}
	
	.prd_list dl a:hover{border-color:#ed1c24; background:#fcf9f9; transition: all 0.5s;}
	.prd_list dl a:hover p.tit{color:#ed1c24; transition: all 0.3s;}
	.prd_list dl a:hover p.price{color:#ed1c24; transition: all 0.3s;}
	.prd_list dl a:hover p.price s{color:rgba(237,28,36,.5); transition: all 0.3s;}


/* »óÇ°°Ë»ö */
.prd_search{position:relative; overflow:hidden; border:1px solid #ddd; text-align:center; padding:30px 0; margin-bottom:10px}
.prd_search h4.search_tit{color:#333; letter-spacing:-0.5pt; font-weight:normal; font-size:18px; padding-bottom:10px;}
.prd_search ul{width:70%; margin:0 auto;}
.prd_search ul li{float:left; width:49.5%; margin:0 1% 1% 0;}
.prd_search ul li.one{float:none; width:100%; margin:0 0 1% 0;}
.prd_search ul li:nth-child(3){margin-right:0}
.prd_search ul li:nth-child(5){margin-right:0}
.prd_search ul li .input{width:100%;}
.prd_search ul li select{width:100%;}
.prd_search ul li dt{display:inline-block; width:84px; vertical-align:top; text-align:left; line-height:42px; padding:0 0 0 12px; color:#333; letter-spacing:-0.5pt;}
.prd_search ul li dd{display:inline-block; width:calc(100% - 102px)}
.prd_search ul li .input_price{width:48%}
.prd_search ul li span{display:inline-block; width:4%;}

.prd_search ul li .search_btn{display:inline-block; background: #333;text-align: center;color:#fff; border: 1px solid #333;  letter-spacing:-1pt;width:100%; height:54px; font-size:15px; margin-top:12px; cursor: pointer; transition: all 0.3s;}
.prd_search ul li .search_btn:hover{background-color:#fff; color:#333; transition: all 0.3s;}


/* ºäÆäÀÌÁö */
.pro_view{position:relative; overflow:hidden;}
.pro_view .viewImg{position:relative; float:left; width:450px; margin-bottom:50px;}
	.pro_view .viewImg .certi_icon{position:absolute; left:10px; top:10px; z-index:9}
	.pro_view .viewImgNor{position:relative; overflow:hidden;}
	.pro_view .viewImgNor .prdimg{width:500px; height:500px; border:1px solid #ddd; text-align:center;}
	.pro_view .imgBtn{text-align:center; padding:15px 0 20px 0;}
	.pro_view ul.smallImg{position:relative; overflow:hidden;}
	.pro_view ul.smallImg li{float:left; border:1px solid #ddd; margin-right:10.5px;}
	.pro_view ul.smallImg li:last-child{margin-right:0}
.pro_view .viewTxt{width:100%; box-sizing:border-box;}
.pro_view .viewTxt h4.p_name{font-size:22px; color:#313538; letter-spacing:-1pt;  font-weight:bold; padding:0 0 25px 0; word-break:break-all; line-height:120%}
.pro_view .viewTxt .price_con{position:relative; padding:15px; background-color:#f7f7f7}
.pro_view .viewTxt .price_con span.gram{position:absolute; right:20px; font-size:13px; color:#888}

.pro_view .viewTxt .viewTable{border-bottom:1px solid #ddd; padding:15px;}
.pro_view .viewTxt .view_table{width:100%; border-collapse:separate; border-spacing:0px;}
.pro_view .viewTxt .view_table th{font-weight:400; color:#888; text-align:left; vertical-align:top; width:100px; padding:5px 0;}
.pro_view .viewTxt .view_table td{padding:3px 0 3px 10px; color:#333;}


.prd_tab{position:relative; clear:both; overflow:hidden; border-left:1px solid #ddd; margin-bottom:25px; background:url('/admin/product/image/line_bg.gif') bottom repeat-x}
.prd_tab li{float:left}
.prd_tab li a{display:block; width:198px; line-height:100%; padding:20px 0; border-bottom:1px solid #ddd; border-top:1px solid #aaa; border-right:1px solid #ddd; font-size:15px; letter-spacing:-0.7pt; color:#888; text-align:center; background-color:#f8f8f8}
.prd_tab li span{line-height:inherit; letter-spacing:inherit }
.prd_tab_up{background-color:#fff !important; border-bottom:1px solid #fff !important; color:#222 !important;}
 
.pro_view .btn_area{text-align:center;}

.buy_btn{font-size:15px; letter-spacing:-0.5pt; width:240px; height:55px; line-height:53px; background:#ed1c24; color:#fff; border:1px solid #ed1c24; cursor:pointer; transition:all 0.3s;}
.buy_btn i{color:#fff; margin:-5px 10px 0 0; transition:all 0.3s;}
.buy_btn:hover{color:#ed1c24; background:#fff; transition:all 0.3s;}
.buy_btn:hover i{color:#ed1c24; transition:all 0.3s;}
.basket_btn{font-size:15px; letter-spacing:-0.5pt; width:120px; height:55px; line-height:53px; background-color:#666; color:#fff;  border:1px solid #666;  cursor:pointer; margin-left:4px; transition:all 0.3s;}
.basket_btn:hover{background:#fff; color:#666;}
.wish_btn{font-size:15px; letter-spacing:-0.5pt; width:120px; height:55px; line-height:53px; background:#fff url('/admin/product/image/wish_icon.png') 13px no-repeat; color:#666; border:1px solid #d4d4d4; padding:0 0 0 20px; cursor:pointer; box-sizing:border-box; transition: all 0.3s;}
.wish_btn:hover{background:#fff url('/admin/product/image/wish_icon_up.png') 13px no-repeat; color:#333; border:1px solid #333;  transition: all 0.3s;}

/*.list_btn{background:#fff url('/admin/product/image/cate_icon.png') center no-repeat; width:54px; height:55px; border:1px solid #aaa; opacity:.5; font-size:0; cursor:pointer; transition: all 0.3s;}
.list_btn:hover{border-color:#333; opacity:1; transition: all 0.3s;}*/	


	/* »óÇ°»ó¼¼Á¤º¸ °íÁ¤ table */
	.detail_table{width:100%; border-collapse:separate; border-spacing:0px; border-top:1px solid #333;}
	.detail_table th{width:25%; color:#333; font-weight:normal; text-align:left; padding:14px 0 14px 15px; border-bottom:1px solid #d4d4d4; background-color:#f9f9f9; letter-spacing:-0.5pt;}
	.detail_table td{border-bottom:1px solid #e9e9e9; padding:14px 0 14px 15px; text-align:left}

.pro_det{text-align:center; padding:20px 0;}


/* ºäÆäÀÌÁö NEW - 200818 */
.pro_view_new{position:relative; overflow:hidden; padding-top:85px}
.pro_view_new .viewImg{position:relative; float:left; width:820px; margin-bottom:50px;}
.pro_view_new .viewImg dl{position:relative; overflow:hidden; text-align:center; margin-bottom:10px}
.pro_view_new .viewImg dd{  }
.pro_view_new .viewImg dd .panel{ position: relative;display:inline-block; width: 400px; height:600px; overflow:hidden; margin-right:6px;
cursor: -webkit-zoom-in; overflow: hidden;}

.pannel:before {content: "";position: absolute;display: block;top: 0;	right: 0;	bottom: 0;	left: 0;	background: #000;	opacity: .03;	z-index: 1;}
.pannel:before {content: "";	position: absolute; top: 0;	right: 0; bottom: 0; 	left: 0; 	background: #000; opacity: .03; 	z-index: 1;}
.panel img {width:100%;}
.bigImg dd {
-webkit-flex-shrink: 0;	
-ms-flex: 0 0 auto;-webkit-flex-shrink: 0;	
-ms-flex-negative: 0;	
flex-shrink: 0;	
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;	justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
}

.mask {position: absolute; top: 0; right: 0; bottom: 0; left: 0; -webkit-transform-origin: 0 0 0; -ms-transform-origin: 0 0 0; transform-origin: 0 0 0;}


.pro_view_new .viewImg dd img{width:400px;}

.pro_view_new .viewImg ul.smallImg{}
.pro_view_new .viewImg ul.smallImg li{position:relative; display:inline-block; cursor:pointer}
.pro_view_new .viewImg ul.smallImg li img{width:80px; height:120px;}
.pro_view_new .viewImg ul.smallImg li:after{position:absolute; top:0; display:block; content:""; overflow:hidden; width:164px; height:120px; border:2px solid #19c2ac; box-sizing:border-box; opacity:0}
.pro_view_new .viewImg ul.smallImg li.on:after{opacity:1}

.pro_view_new .viewTxt{position:relative; float:right; width:calc(100% - 870px); box-sizing:border-box; margin-bottom:50px;}
.pro_view_new .viewTxt h4.p_name{font-size:25px; color:#333; letter-spacing:-0.5pt;  font-weight:normal; padding:0 0 20px 0; word-break:break-all; line-height:120%;}
.pro_view_new .viewTxt p.sp_img {margin:10px 0 15px 0;}
.pro_view_new .viewTxt p.sp_img img{margin-right:2px;}

.pro_view_new .viewTxt .sns_scrap{position:absolute; right:0; top:0; z-index:99; padding:0 0 0 24px; background:url('/img/sns_icon.gif') 0 no-repeat;}
.pro_view_new .viewTxt .sns_scrap img{margin-right:2px;}
.pro_view_new .viewTxt .stortexp{position:relative; margin:-10px 0 30px 0; letter-spacing:-0.4pt; color:#777}


.pro_view_new .viewTxt .price_con{position:relative; padding-bottom:30px;}

.pro_view_new .viewTxt .viewTable{padding:10px 0 10px 0;}
.pro_view_new .viewTxt .view_table{width:100%; border-collapse:separate; border-spacing:0px;}
.pro_view_new .viewTxt .view_table th{font-weight:normal; color:#888; text-align:left; width:100px; padding:5px 0; font-size:15px}
.pro_view_new .viewTxt .view_table td{padding:3px 0 3px 10px; color:#333;}
.pro_view_new .viewTxt .view_table td select{width:100%; padding:8px 10px}
.pro_view_new .viewTxt .view_table td.price_inner{padding:3px 0 3px 0;}

.pro_view_new .selling_txt{padding:18px 20px 20px 20px; border:1px solid #ddd; margin-top:30px; color:#333;}
.pro_view_new .selling_txt h4{color:#888; font-size:15px; font-weight:normal}

.color_option{position:relative; overflow:hidden; padding-bottom:20px;}
.color_option dd{float:left; width:83px; height:62px; border:1px solid #ddd; box-sizing:border-box; cursor:pointer; margin:3.75px 3.75px 0 0; text-align:center; font-size:13px; padding:9px 0 0 0;}
.color_option dd.sel{border:2px solid #333; box-sizing:border-box;}
.color_option dd span{display:block; width:18px; height:18px; border-radius:100%; margin:0 auto 5px auto;}
.color_option dd:nth-child(6n){margin:3.75px 0 0 0;}

.n_option{position:relative; overflow:hidden; padding-bottom:20px;}
.n_option dd{display:inline-block; border:1px solid #ddd; color:#888; padding:0 12px; font-size:13px; line-height:32px;}
.n_option dd.sel{border:2px solid #333; color:#333; box-sizing:border-box;}

.buy_btn2{font-size:15px; letter-spacing:-0.5pt; width:154px; height:52px; line-height:50px; background:#333; color:#fff; border:1px solid #333; cursor:pointer; margin-left:4px; transition:all 0.3s;}
.buy_btn2:hover{color:#333; background:#fff;}
.basket_btn2{font-size:15px; letter-spacing:-0.5pt; margin:0 -2px 0 8px; width:154px; height:52px; line-height:50px; background-color:#666; color:#fff;  border:1px solid #666;  cursor:pointer; transition:all 0.3s;}
.basket_btn2:hover{background:#fff; color:#666;}
.wish_btn2{font-size:0; width:54px; height:52px; line-height:51px; background:#fff url('/img/wish_icon.png') center no-repeat; color:#666; border:1px solid #d4d4d4; padding:0 0 0 22px; cursor:pointer; box-sizing:border-box; transition: all 0.3s;}
.wish_btn2:hover{background:#fff url('/img/wish_icon_up.png') center no-repeat; border:1px solid #333;  transition: all 0.3s;}

.list_btn2{background:#fff url('/img/cate_icon.png') center no-repeat; width:54px; height:52px; border:1px solid #aaa; margin-right:-2px; opacity:.5; font-size:0; cursor:pointer; transition: all 0.3s;}
.list_btn2:hover{border-color:#333; opacity:1; transition: all 0.3s;}



/* °áÁ¦³»¿ª */
.order_list_top{background:#fafafa; text-align:center; padding:15px 0;}
.order_list_top dl {display:inline-block}
.input2 {border:none; color:#666; font-size:1rem; padding:7px; width:91px; height:38px; box-sizing:border-box;}
.order_list_top .cal > span {display:inline-block; border:1px solid #ddd; background:#fff;}
.order_list_top .cal > span.hipen {border:none; margin:0 2px; position:relative; left:2px;}
.order_list_top .cal img{line-height:100%; padding:9px 8px 9px 0}
.order_list_top dd{}
.order_list_top dd .button {margin-bottom:4px;}

.order_list_top dt.chech_btn{margin:10px 1px 0 1px}
.order_list_top dt.chech_btn input{width:260px; height:45px; background:#222; text-align:center; border:none; font-size:1rem; letter-spacing:-0.4pt; color:#fff; cursor:pointer; font-weight:400;}

.period_1 {border:1px solid #888; background:#888; width:50px; height:38px; line-height:35px; letter-spacing:-0.5pt; color:#fff; margin:0 2px 0 0; cursor:pointer; font-size:1rem; color:#777; font-weight:400; transition:all 0.3s; box-sizing:border-box;}
input[id="set6"] {margin-right:0;}
.period_2 {border:1px solid #ddd; width:50px; height:38px; line-height:35px; letter-spacing:-0.5pt; background:#fff; margin:0 2px 0 0; cursor:pointer; font-size:1rem; color:#777; font-weight:400; transition:all 0.3s; box-sizing:border-box;}
.period_2:hover {border:1px solid #888 !important; background:#888 !important; color:#fff !important; transition:all 0.3s;}


.order_table{width:100%; border-collapse:separate; border-spacing:0px; border-top:1px solid #adadad;}
.order_table th{color:#333; font-weight:normal; text-align:center; padding:10px; border-bottom:1px solid #d6d6d6; letter-spacing:-0.5pt;}
.order_table td{border-bottom:1px solid #e9e9e9; padding:10px; text-align:center}
.order_table td.left{text-align:left; border-left:1px solid #e9e9e9; border-right:1px solid #e9e9e9;}

.order_table td .pay_method{color:#333}
.order_table td .pay_method i{font-size:20px; margin:-1px 2px 0 0;}

.order_info{}
.order_info li{position:relative; padding:2px 0 2px 60px; min-height:22px}
.order_info li span.tit{color:#222; position:absolute; left:0; display:inline-block;}


/* °áÁ¦¾ç½Ä(order_form) */
.order_form_con{position:relative; padding-bottom:210px}

.order_form_con .btn_area{text-align:center; margin-top:30px;}
.order_form_con .btn_style2{letter-spacing:-.5pt; width:200px; height:50px; line-height:48px; font-size:15px; cursor: pointer;}

.pay_select{width:100%}
.pay_select dl{display:flex; flex-wrap:wrap; }
.pay_select dl.bpad_50{padding-bottom:20px;}
.pay_select dd:first-of-type{border-left:1px solid #ddd;}
.pay_select dd{position:relative; width:100%;}
.pay_select dd input[type="radio"] {position:absolute; top:50%; margin-top:-10px; left:15px}
.pay_select dd input[type="radio"] + label {position:relative; display:inline-block; width:100%; border:1px solid #ddd; border-left:0;
line-height:46px; height:50px; box-sizing:border-box; letter-spacing:-0.5pt; margin-left:-1px;
color:#666; padding-left:50px; cursor:pointer;}
.pay_select dd input[type="radio"] + label i{color:#999; margin-right:8px}
.pay_select dd input[type="radio"]:checked + label {border:2px solid #ed1c24; color:#ed1c24; z-index:99}
.pay_select dd input[type="radio"]:checked + label i{color:#ed1c24;}

	.receipt_style{width:100%; border-collapse:separate; border-spacing:0px; border-top:1px solid #333;}
	.receipt_style th{color:#333; font-weight:normal; text-align:left; padding:10px 0 10px 10px; border-bottom:1px solid #e9e9e9; border-right:1px solid #e9e9e9; letter-spacing:-0.5pt;}
	.receipt_style td{border-bottom:1px solid #e9e9e9; padding:10px 0 10px 10px; text-align:left;}
	.receipt_style td.add input{margin:1px 0;}
	.receipt_style td label{letter-spacing:-0.45pt; margin-right:20px; line-height:170%;}

.pay_info{position:absolute; bottom:30px; width:100%;}
.pay_info .btn_style2{width:100%;}

.pay_pro{border:2px solid #333; margin-bottom:5px; padding:15px;}
.pay_pro dt{letter-spacing:-0.3pt; color:#777}
.pay_pro dd{text-align:right; color:#333; font-weight:bold;}