/* ************************************************ 
 *  product_detail_page
 * ************************************************ */



h2.product_name {
font-size: 28px;
padding: 0px 0px 0px 0px;
    margin: 0px 0px 20px 0px;
    height: 34px;
    line-height: 28px;
}

.product_detail_area {
margin-bottom: 40px;
position: relative;
width: 100%;
justify-content: space-between;
display: flex;
flex-wrap: wrap;
height: auto;

}



.product_images {
width: 610px;
justify-content: space-between;
display: flex;
flex-wrap: wrap;
}
.product_images #mainImg{width: 500px;height: 500px; border: 1px solid #CCC;box-sizing: border-box; position: relative;}

.product_images #mainImg img{
    position: absolute;
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
}

.product_images ul#subImg{width: 100px;height: 100px;}

.product_images ul#subImg li {padding: 5px;border: 1px solid #CCC;box-sizing: border-box;margin-bottom: 10px;background-color: #FFF;cursor: pointer}

.product_images ul#subImg li img{width: 100%; vertical-align: top}
.product_images ul#subImg li img:hover{opacity: 0.6;transition: .3s;}

.product_detail_area .product_detail_area_input{width: 340px;}



dl.add_cart_table {
width: 100%;
margin: 0px 0px 40px 0px;
border-top:1px solid #CCC;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

dl.add_cart_table dt{
border-bottom: 1px solid #ccc;
padding: 10px 20px 10px 20px;
margin: 0px;
text-align: left;
font-size: 14px;
    width: 60px;
    display: flex;
    align-items: center;
}
dl.add_cart_table dd{
border-bottom: 1px solid #ccc;
margin: 0px;
padding: 10px 0px 10px 0px;
text-align: left;
    width: calc(100% - 100px)
}
dl.add_cart_table dd strong.price {
font-size: 28px;
    font-weight: bold;
    color: black;
}

dl.add_cart_table dd span.price_tax{ margin-left: 10px;font-size: 16px;font-weight: 400}
dl.add_cart_table dd span.price_tax::before{ 
    content: "\A" ;
	white-space: pre ;
    
}



.num_btn{    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;}
.num_btn_num{width: 45px}
.num_btn_num input{width: 30px;height: 29px; text-align: center;font-size: 16px;}
.num_btn_num_btn{width: calc(100% - 45px)}
.num_btn_num_btn a.num_btn:first-of-type{margin-bottom: 3px}
.num_btn_num_btn a.num_btn:hover{opacity: 0.5}



table#option_tbl {
width: 100%;
margin-bottom: 20px;
}
table#option_tbl th,
table#option_tbl td.none {
background: whiteSmoke;
}
table#option_tbl th,
table#option_tbl td {
border: 1px solid #ccc;
padding: 20px 10px 20px 10px;
text-align: left;
font-size: 15px;
}
table#option_tbl th {
background: whiteSmoke;		
}
table#option_tbl td div input {
margin-bottom: 5px;
}

ul.option_price {
margin: 0 0 20px 0px;
}
ul.option_price li {
list-style-type: none;
}

div.button_area {
    width: 280px;
margin: 0px auto 0px auto;
}
div.button_area input {
    width: 100%;

}




/* @group button */

.btn {
background-image: url(https://img07.shop-pro.jp/PA01383/779/etc/cart.png);
background-repeat: no-repeat;
background-position: center left 20px;
color: #fff;
background-color: #000;
font-size: 18px;
font-weight: 400;
padding: 15px 0px 15px 35px;
font-family: 'Shippori Mincho', serif;
    cursor: pointer;transition: .3s;
    border: none;
    
}

.btn:hover{opacity: 0.6}



.andmore{padding: 20px 0px 40px 0px;width: 280px;margin: 0 auto 0 auto;}

.andmore a{  padding: 9px 14px;
  font-size: 15px;
  line-height: normal;
  -webkit-border-radius: 0px;
     -moz-border-radius: 0px;
          border-radius: 0px;
background-color: #e3e3e3;
color: #000;
    display: block;
    text-align: center;
    border: 1px solid #e3e3e3;
    background-image: url(https://img07.shop-pro.jp/PA01383/779/etc/min_arrow.png);background-repeat: no-repeat;background-position: right 10px center;
    background-size: 8px;
    transition: .3s
}

.andmore a:hover{background-color: #FFF;}


.product_link_area{padding-bottom:0px;width: 280px;
margin: 0px auto 0px auto;}
.product_link_area .product_link_single{margin-bottom: 8px}
.product_link_area .product_link_single a{
background-image: url(https://img07.shop-pro.jp/PA01383/779/etc/min_arrow.png);background-repeat: no-repeat;background-position: right top 5px;
background-size: 5px;
font-size: 12px;
font-weight: 400;
padding-right: 10px;}

.product_link_area .product_link_single:last-of-type{margin-bottom: 0px}

.product_link_area .product_link_single a{position: relative}
.product_link_area .product_link_single a:hover{color: #999;transition: .3s}
.product_link_area .product_link_single a::after{position: absolute;
width: 0%;height: 1px;display: block;bottom: -3;left: 0;content: "";background-color: #999;transition: .3s}
.product_link_area .product_link_single a:hover::after{width: 100%;}

.sns_area{padding: 0px 0px 0px 0px; display: flex;flex-wrap: wrap; justify-content: flex-start;overflow: hidden;width: 280px;
margin: 40px auto 0px auto;}
.sns_area .twitter{display: block; margin-right: 0px;width: 105px;}
.sns_area .twitter .twitter-share-button{width: 105px !important;height: 32px !important}
.sns_area .fb-like{display: block;width: 105px;}

div.product_description {
font-size: 14px;
line-height: 24px;
margin-bottom: 0px;
padding: 30px 20px 0px 20px;
border-top: 1px solid #ccc;	
clear: both;
word-wrap: break-word;
}
div.product_description a{ text-decoration: underline}
div.product_description a:hover{color: #999;transition: .3s}

div.product_image_extra {
text-align: center;
margin-bottom: 20px;
}
div.product_image_extra img.item {
margin-bottom: 20px;
}


div.product_description table{border-collapse: collapse;border: 1px solid #000}

div.product_description table th{border-collapse: collapse;border: 1px solid #000;padding: 5px}

div.product_description table td{border-collapse: collapse;border: 1px solid #000;padding: 5px}


/*==============================================================================================================

1280px以下

==============================================================================================================*/

@media screen and (max-width:1280px) {
    
.product_detail_area .product_detail_area_input{width: calc(100% - 630px);}  
    
}

/*==============================================================================================================

1000px以下

==============================================================================================================*/

@media screen and (max-width:1000px) {
    
.product_detail_area .product_detail_area_input{width: calc(100% - 460px);}  
    
.product_images {
width: 440px;
justify-content: space-between;
display: flex;
flex-wrap: wrap;
}
.product_images #mainImg{width: 360px;height: 360px; border: 1px solid #CCC;box-sizing: border-box; position: relative;}

.product_images ul#subImg{width: 70px;height: 70px;}
    
    
    
    
    
}




/*==============================================================================================================

768px以下

==============================================================================================================*/

@media screen and (max-width:768px) {
.product_detail_area {display: block;height: auto;position: static;}
.product_detail_area .product_detail_area_input{width:100%;max-width: 500px; height: auto;display: block;margin: 0 auto 0 auto}
    
 h2.product_name {
font-size: 18px;
padding: 0px 0px 15px 0px;
margin: 0px 0px 0px 0px;
     height: auto;
}

    
    
.product_images {
width: 100%;
max-width: 500px;
display: block;
    margin: 0 auto 30px auto;
}
.product_images #mainImg{width: 100%;height: auto; border: 1px solid #CCC;box-sizing: border-box; position: static;margin-bottom: 10px;}    
.product_images #mainImg img{
    position: initial;
  max-width: 100%;
  max-height: 100%;
  width: 100%;

}
table.add_cart_table td strong.price {
font-size: 22px;
    font-weight: bold;
    color: black;
}

    
.product_images ul#subImg{width: 100%;height: auto; display: flex; justify-content: flex-start; flex-wrap: wrap} 
.product_images ul#subImg li {width: 60px;height: 60px; padding: 5px;border: 1px solid #CCC;box-sizing: border-box;margin-bottom: 10px;background-color: #FFF;cursor: pointer;margin-right: 10px;}
    
    
div.product_description {
font-size: 14px;
line-height: 24px;
margin-bottom: 0px;
padding: 30px 0px 0px 0px;
border-top: 1px solid #ccc;	
}
    
    
}
