@charset "UTF-8";

#sub .wrap {padding:0 !important; width:100%; display:inline-block;  border-top:1px solid #ddd !important; }
 
 .menu {width:100%; height:50px; background-color:#ddd; overflow:hidden; float:left;  }
 .menu h3 {font-weight:600; display:none !important;  padding-bottom:5px;}
 .menu ul {width:100%;  border-top:1px solid #333; float:left;}
 .menu li {display:inline-block; border:1px solid red;  font-size:15px; padding:8px 0;  color:#777;  }
  .menu li a {color:#777 !important; width:100%; display:inline-block}
  .menu li a:hover {text-decoration:underline}
  .menu li.ov a {color:#333 !important; font-weight:600}

 .sub_con {width:100%; display:inline-block; margin-top:40px; margin-bottom:40px ; padding:0 3%; box-sizing:border-box;   }
 h2.title {width:100%;     margin-bottom:10px; font-size:1.2em; font-weight:700; color:#333; text-align:left}
 h2.title span {float:right;  display:none; font-size:13.5px; margin-top:10px; font-weight:400; color:#666 }

 h2.title2 {width:100%;     margin-bottom:20px; font-size:1.2em; font-weight:700; color:#333; text-align:left; border-bottom:1px solid #ddd; padding-bottom:10px; }
 h2.title2 span {float:right;  display:none; font-size:13.5px; margin-top:10px; font-weight:400; color:#666 }



 #sub h3 {width:100%;     margin-bottom:10px; font-size:1.1rem; font-weight:600; color:#333; display:inline-block}

#sub .text_box {font-size:0.88rem; color:#666; line-height:1.35em}
#sub .text_box .t1 {font-size:1.15em; color:#333; font-weight:700; line-height:1.35em}
#sub .text_box .t2 {font-size:1.05em; color:#333; font-weight:500; line-height:1.35em}
#sub .text_box .t3 {font-size:1.05rem; color:#333; font-weight:700; line-height:1.35em}

#sub .bg_box {background-color:#f9f9f9; box-sizing:border-box; width:100%; padding:15px; display:inline-block }


 #sub  .product {font-size:0; display:flex; flex-wrap:wrap;}
 #sub  .product div.box {width:47%; margin-right:6%; padding-bottom:20px;}
 #sub  .product div.box:nth-child(2n) { margin-right:0 }

.list_select		{ border:1px solid #ddd; font-size:0.85em;  height:30px; vertical-align:middle; color:#666; padding-left:5px; padding-right:15px; background-color:#fff }



 /*제품뷰*/

#sub .product_view .view_img {width:100%;  float:left;}
#sub .product_view .b_img {border:1px solid #ddd; width:80%; box-sizing:border-box;  float:left;  }
#sub .product_view .s_img {width:18%; margin-left:2%;  float:left;  }
#sub .product_view .s_img li {width:100%;  margin-bottom:-1px; box-sizing:border-box; float:left; border:1px solid #ddd;  }
 #sub .product_view .s_img li img {width:100%;   }

#sub .product_view h3 {font-size:1.1rem; line-height:1.3em; color:#333; font-weight:700; margin-bottom:5px; margin-top:10px; width:100%; display:inline-block}

#sub .product_view .info_t {font-size:0.9rem; line-height:1.3em; color:#666; }
#sub .product_view table.info {width:100%;  float:left; margin-top:15px;}
#sub .product_view table.info td input {vertical-align:middle; margin-right:4px;}
#sub .product_view table.info td span {float:right;}

#sub .product_view table.info td.price {display:flex; align-items:center}
#sub .product_view table.info td.price  *  {line-height:1em;  }
#sub .product_view table.info td.price span.line_t  {float:none;  font-weight:400; font-size:1rem; text-decoration:line-through ; padding-left:10px }
#sub .product_view table.info td.price span.sale {font-size:1.2rem; font-weight:800; float:none; color:#ae0d44; margin-left:auto   }
#sub .product_view table.info td.price b {font-size:1.3rem; font-weight:800; letter-spacing:-1px; color:#333; }

#sub .product_view .total_info {width:100%; float:left; margin-top:0; background-color:#f9f9f9; box-sizing:border-box; padding:15px;}
#sub .product_view .total_info p {width:100%; color:#555; font-size:16px; }
#sub .product_view .total_info p span {float:right; color:#333; font-weight:600 }

#sub .product_view .total_pay {width:100%;   margin-top:10px;  float:left; margin-top:0; border-bottom:1px solid #ddd;  margin-top:-1px; font-size:1em; color:#666; font-weight:400; box-sizing:border-box; padding:10px; text-align:Center; }
#sub .product_view .total_pay span {color:#333; font-size:1.5em; font-weight:600 }

#sub .product_view table.info .option_t {line-height:1.3em;  padding-top:8px;   color:#333; font-size:0.9rem; width:70%; float:left;}


#sub  .number {border:1px solid #ddd;  float:left; align-items:center; display:flex}
#sub  .number p {width:40px; text-align:Center; font-size:0.9rem; background-color:#fff; }
#sub  .number img  {height:30px} 

 
a.cart_btn   {background-color:#fff;  border:1px solid #ddd; box-sizing:border-box; margin-top:-1px; float:left;  line-height:45px;  width:33.33333%;   color:#666 !important; text-align:center;  font-weight:400; font-size:0.9rem; border-right:none }
a.cart_btn:last-child {border-right:1px solid #ddd}
a.btn_color2 {background-color:#333;  border:1px solid #333; color:#fff !important; }

 



 .navigatonBox {
  width:100%; float:left; position:relative; border-bottom:1px solid #ddd;  height:40px;  
}


.buttonGroup {
  overflow-x: auto;
  white-space: nowrap;

  -webkit-overflow-scrolling: touch;
}
.navButton, .option {
  display: inline-block;
  margin-right:12px;
  cursor:default;
}

.navButton {}
.navButton a {font-size:0.95rem;  line-height:40px; font-weight:400; color:#777; }
.navButtonov a {font-weight:600; color:#333 !important; text-align:Center }

.navButton:last-child {
  margin-right:20px;
}
.navButton:first-child {
  margin-left:20px;
}
.optionGroup {
  width:100%;
  height:100px;
  position:absolute;
  top:50px;
  left:0;
}

.option {
  position:absolute;
  top:0;
  left:0;
  padding: 5px 10px;
  border:1px solid #DDD;
  border-radius:3px;
}

.option p {
  margin:0 0 5px;
  white-space: nowrap;
}

.option p:hover {
  background-color:#EEE;
}

.arrow {
  width:18px;
  height:40px;
  position:absolute;
  top:0; 
  background-color:#fff;
}

.arrow::before {
  content:'';
  width:100%;
  height:100%;
  position:absolute;
  top:0;
  left:0;
  background-size:100% 100%;
  background-image: url(data:image/svg+xml;utf8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pgo8IS0tIEdlbmVyYXRvcjogQWRvYmUgSWxsdXN0cmF0b3IgMTYuMC4wLCBTVkcgRXhwb3J0IFBsdWctSW4gLiBTVkcgVmVyc2lvbjogNi4wMCBCdWlsZCAwKSAgLS0+CjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+CjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4PSIwcHgiIHk9IjBweCIgd2lkdGg9IjY0cHgiIGhlaWdodD0iNjRweCIgdmlld0JveD0iMCAwIDMwNiAzMDYiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDMwNiAzMDY7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPGc+Cgk8ZyBpZD0iY2hldnJvbi1yaWdodCI+CgkJPHBvbHlnb24gcG9pbnRzPSI5NC4zNSwwIDU4LjY1LDM1LjcgMTc1Ljk1LDE1MyA1OC42NSwyNzAuMyA5NC4zNSwzMDYgMjQ3LjM1LDE1MyAgICIgZmlsbD0iIzAwMDAwMCIvPgoJPC9nPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+Cjwvc3ZnPgo=)
}

.arrow.left {
  left:0;
  transform:rotate(180deg);
}
.arrow.right {
  right:0;
}