html {
    scroll-behavior: smooth;
}
.sub-item .subpd-txt {
    width: 70%;
    padding-left: 2%;
    font-size: 1.4rem;
    margin-top: 20px;
}
.other-cmp {
    text-align: right;
    margin-top: 20px;
    margin-right: 2%;
    font-weight: bold;
}
.sub-item .pd-name {
    font-weight: bold;
}
/*common*/
 .CateGoryFreeArea .pc {
    display: block;
 } 
 .CateGoryFreeArea .sp {
    display: none;
 } 
 .CateGoryFreeArea h1 img {
    width: 100%;
 } 
 .CateGoryFreeArea .color-ye {
    color: #FFF000;
 }
 .CateGoryFreeArea .tax {
    font-size: 1.2rem;
 }
/*top-area*/ 
 .CateGoryFreeArea .top-area {
    margin-bottom: 40px;
 }
 .CateGoryFreeArea .lead-area {
    width: 80%;
    margin: 0 auto;
    padding: 20px 0;
 } 
 .CateGoryFreeArea .lead-area p {
    text-align: center;    
 }   
 .CateGoryFreeArea .anchor {
    width: 100%;
    margin: 0 auto;
    padding: 20px;
 }  
 .CateGoryFreeArea .anchor ul{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
 }  
 .CateGoryFreeArea .anchor ul li{
    color: #5DC0C6;
    font-weight: bold;
    border: 2px solid #5DC0C6;
    border-radius: 5px;
    display: block;
    padding: 10px;
    margin: 5px;
    width: 20%;
    text-align: center;
 } 
 .CateGoryFreeArea .anchor ul li a {
    color: #5DC0C6;
 }  
 .CateGoryFreeArea .anchor ul li a:hover {
    opacity: 0.6;
 }  
.CateGoryFreeArea .anchor .dli-chevron-down {
    display: inline-block;
    vertical-align: middle;
    color: #5DC0C6;
    line-height: 1;
    width: 10px;
    height: 10px;
    margin-left: 10px;
    border: 0.1em solid currentColor;
    border-left: 0;
    border-bottom: 0;
    box-sizing: border-box;
    transform: translateY(-25%) rotate(135deg);
}
 /*bag-area*/
 .bag-area {
    width: 100%;
 }
 .bag-area .bag-inner .top-area {
    width: 100%;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
 } 
  .bag-area .bag-inner .bottom-area .bag-box {
    float: left;
 } 
   .bag-area .bag-inner .bottom-area #interior-bag {
    margin-left: 15px;
 } 
 .bag-inner .bag-box {
    width: 32%;
    margin: 0 auto;
    padding-bottom: 30px;
    border: 3px solid #5DC0C6;
    margin-bottom: 15px;    
 }
 .bag-inner #kitchen-bag {
    margin-left: 170px;
 }
 .bag-box h3 {
    background: #5DC0C6;
    color: #fff;
    text-align: center;
    font-weight: bold;
    font-size: 1.8rem;
    padding: 15px 0;
    margin-bottom: 30px;
 } 
  .bag-box h3 .item-total {
    color: #fff;
    font-size: 1.2rem;
    background: #D56D8D;
    border-radius: 30px;
    padding: 10px;
    margin-right: 10px;
    letter-spacing: 0.1rem;
 } 
  .bag-box h3 .big {
    font-size: 1.8rem;
    color: #FFF000;
    margin: 0 2px;
 } 
 .bag-box .box-inner {
    width: 94%;
    margin: 0 auto;
 }
 .bag-box .main-item {
    font-size: 1.4rem;
    text-align: center;
 } 
  .bag-box .main-item .pd-img {
    text-align: center;
 }  
  .bag-box .main-item .pd-name {
    font-weight: bold;
 } 
   .bag-box .main-item .pd-color {
    font-size: 1.2rem;
 }  
  .bag-box .main-item .pd-img img {
    width: 250px;
 } 
 .bag-box .plus {
    text-align: center;
    font-size: 2.4rem;
    font-weight: bold;
    vertical-align: middle;
    line-height: 40px;
    margin: 20px 0;
 }   
 .bag-box .plus-icon {
    background: #D56D8D;
    color: #FFF000;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    display: inline-table;
 }  
 .bag-box .sub-item-wrapper .sub-item {
    display: flex;
    margin-bottom: 20px;
 }
  .sub-item .subpd-img {
    width: 30%;
  }
  .sub-item .subpd-txt {
    width: 70%;
    padding-left: 2%;
    font-size: 1.4rem;
  }
  .sub-item .subpd-txt .pd-color {
    font-size: 1.2rem;
  }  
  .recipe ul {
    display: flex;
    background: #FFF4E2;
    padding: 10px;
    margin-bottom: 42px;
  }  
  .recipe ul {
    display: flex;
    font-size: 1.4rem;
  }  
  .recipe ul li:first-child {
    width: 30%;
  }  
  .recipe ul li:nth-child(2) {
    width: 70%;
    padding-left: 2%;
    font-size: 1.2rem;    
  } 
  .price ul{
    display: flex;
    font-weight: bold;
    text-align: left;
    margin-bottom: 20px;
  }
  .price ul li:first-child {
    margin-top: 20px;
  }   
  .price ul li:nth-child(2) {
    padding-left: 2%;
    font-size: 1.4rem;    
  } 
  .price .off-per{
    color: #fff;
    font-size: 1.6rem;
    background: #D56D8D;
    border-radius: 30px;
    padding: 5px 20px;
    margin-right: 10px;
    letter-spacing: 0.1rem; 
  }     
  .price .before-price {
    font-size: 1.2rem;
  }   
  .price .special-price {
    font-size: 2.4rem;
  }   
  .CateGoryFreeArea .btn {
    background: #FFF000;
    border: solid 3px #D56D8D;
    font-weight: bold;
    text-align: center;
    width: 100%;
    margin: 0 auto;
  }
  .CateGoryFreeArea .btn a{
    color: #D56D8D;
  }
  #penuts-bag .price {
    margin-top: 282px;
  }
  #toster-bag01 .price {
    margin-top: 148px;
  } 
  #toster-bag01 .price {
    margin-top: 155px;
  }  
  #interior-bag .price {
  margin-top: 286px;
  }