body{    
    

  position: relative;
  margin: 0;
  
  min-height: 100%;
  font-family: "Helvetica Neue", Arial, sans-serif;

  }

  
html {
  height: 100%;
  box-sizing: border-box;
}

*,
*:before,
*:after {
  box-sizing: inherit;
}




  
  .container{
    margin-bottom: 15vh;
    padding-bottom: 10vh;
  }
  
a{
    color: #333;
    text-decoration: none;    
  }



  .background-none-button {
    background: none;
    border: none;
    cursor: pointer;
  }


/* 商品紹介ページ start */
  

/* 商品紹介ページ end */


/* お問い合わせページ start */



/* お問い合わせページ end */



.contents-title{
  padding-top: 1px;
  padding-bottom: 1px;
  font-weight: bold;
  font-size: 16px;
  position: relative;
  text-align: left;
}
.contents-title::before{
  content: '';
  position: absolute;
  bottom: -3px;
  width: 100%;
  height: 3px;
  background: linear-gradient(
    to right, 
    #f98469 0%, #f98469 25%, /*ピンク*/
    #ffd12a 25%, #ffd12a 50%, /*黄色*/
    #a4de32 50%, #a4de32 75%, /*緑*/
    #91c0f1 75%, #91c0f1 100% /*青*/
  );
}



.underline{
  border-bottom: dotted 2px blue;
}



.emphasis{
  font-weight: 900;
  color: rgb(255, 0, 128);
}


.item-flash{
	animation: flash 2s linear infinite;
}

@keyframes flash {
	0% {
		opacity: 1;
	}
	50% {
		opacity: 0.1;
	}
	100% {
		opacity: 1;
	}
}

.loader-area{
  position: fixed;
  background: rgba(0, 0, 0, 0.1);
  width: 100%;
  height: 100%;
  top: 0; 
  left: 0;
  z-index: 100000;
}


.loader {
  position: fixed;    
  top: 48%;
  left: 48%;
  z-index: 100001;
}

/* 参考URL */
/* https://css-loaders.com/colorful/ */

.loader {
  width: 40px;
  aspect-ratio: 1;
  border-radius: 50%;
  margin-top: -30px;
  display: flex;
  justify-content: center;
  overflow: hidden;
  transform-origin: 50% 116.5%;
  animation: l17 2s infinite linear;
}
.loader:before {
  content:"";
  min-width: 233%;
  height: 233%;
  background: 
  radial-gradient(farthest-side,#00DA3C 90%,#0000) top,
  radial-gradient(farthest-side,#00CBE7 90%,#0000) left,
  radial-gradient(farthest-side,#FD8603 90%,#0000) bottom,
  radial-gradient(farthest-side,#F4F328 90%,#0000) right;
  background-size: 43% 43%;
  background-repeat: no-repeat;
  animation: inherit;
  animation-direction: reverse;
}

@keyframes l17 {
  100% {transform: rotate(360deg)}
}






.processing-area{
  position: fixed;
  background: rgba(0, 0, 0, 0.1);
  width: 100%;
  height: 100%;
  top: 0; 
  left: 0;
  z-index: 100000;
}


.processing {
  position: fixed;    
  top: 48%;
  left: calc((100% - 120px) / 2);
  z-index: 100001;
}



.processing {
  width: 120px;
  height: 20px;
  border-radius: 20px;
  background:
   repeating-linear-gradient(135deg,#f03355 0 10px,#ffa516 0 20px) 0/0%   no-repeat,
   repeating-linear-gradient(135deg,#ddd    0 10px,#eee    0 20px) 0/100%;
  animation: l3 2s infinite;
}
@keyframes l3 {
    100% {background-size:100%}
}