@charset "utf-8";

/* mobile----------------------------------------------------*/
@media screen and (max-width: 480px) {

/* main  */ 
.goods_area {width: 92%; overflow: hidden; margin: 0 auto 20px;}  
.goods_flame {width: 46%; margin: 0 4% 12px 0; float: left; }  
.goods_flame p{font-size: 3vw; font-weight: 600; color: #00f; line-height: 1.6;}     
.goods_flame img{width: 99%; border:1px solid #666; }  
	
	
}/* Tablet---------------------------------------------------*/
@media (min-width: 481px) and (max-width: 768px) {

/* main  */ 
.goods_area {width: 100%; overflow: hidden; margin-bottom: 30px;}  
.goods_flame {width: 30%; margin: 0 3% 12px 0; float: left; }  
.goods_flame p{font-size: 1.5vw; font-weight: 600; color: #00f; line-height: 1.6;}     
.goods_flame img{width: 99%; border:1px solid #666; }     
    
	
}/* PC-------------------------------------------------------*/
@media print, screen and (min-width: 769px) {	
    
/* main  */ 
.goods_area {width: 624px; margin-left: 115px; margin-bottom: 30px; display: flex; flex-wrap: wrap;}   
.goods_flame {width: 270px; margin: 12px 20px;} 
.goods_flame p{font-size: 18px; font-weight: 500; color: #00f; line-height: 1.6;} 
.goods_flame img{width: 99%; border:1px solid #666; } 
    
.spec{background-color: beige;padding: 10px; font-size: 0.9em;margin-bottom: 20px;}    
.spec_btn{text-align: center;display: flex;justify-content: center;}
/*まずはお決まりのボックスサイズ算出をborer-boxに */
*,
*:before,
*:after {
  -webkit-box-sizing: inherit;
  box-sizing: inherit;
}

html {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 62.5%;/*rem算出をしやすくするために*/
}

.btn,
a.btn,
button.btn {
    text-align: center;
margin: 10px auto;
  font-size: 1.2rem;
  font-weight: 700;
  line-height: 1.5;
  position: relative;
  display: inline-block;
  padding: 1rem 3rem;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  color: #fff;
  border-radius: 0.5rem;
  background-color: #249943;
}
/*主な共通部分は省略*/

a.btn--red.btn--cubic {
    border-bottom: 5px solid #15662D;
  }
  
  a.btn--red.btn--cubic:hover {
    margin: 13px auto 10px;
    border-bottom: 2px solid #15662D;
  }
  
  a.btn--radius {
    border-radius: 100vh;
  }
  
  .fa-position-right {
    position: absolute;
    top: calc(50% - .5em);
    right: 1rem;
  } 
}