font-family: "Hiragino Sans", Meiryo, sans-serif;


@charset "Shift_JIS";

div.e-shop-review{ font-size:100%; }

div.e-shop-review div.e-rev-box1 p.rev-star-score{
	font-size:100%;
}


div.e-shop-review div.e-rev-box1 input.rev-write-button{
  display: inline-block;
  max-width: 1600px;
  text-align: left;
  border: 2px solid #6E6E6E;
  font-size: 17px;
  color: #000000;
  text-decoration: none;
  font-weight: bold;
  padding: 8px 16px;
  border-radius: 4px;
  transition: .4s;
}

div.cms-sp-review div.e-rev-box2{
  display: inline-block;
  max-width: 1600px;
  text-align: left;
  border: 2px solid #6E6E6E;
  font-size: 17px;
  color: #000000;
  text-decoration: none;
  font-weight: bold;
  padding: 8px 16px;
  border-radius: 4px;
  transition: .4s;
}

div.e-shop-review div.e-rev-box2{
  display: inline-block;
  max-width: 1200px;
  text-align: left;
  border: 2px solid #6E6E6E;
  font-size: 35px;
  color: #000000;
  text-decoration: none;
  font-weight: bold;
  padding: 8px 16px;
  border-radius: 4px;
  transition: .4s;
}

 #topbutton{
      /* ▼表示位置を画面の右下に固定 */
      position: fixed; /* ←表示場所を固定 */
      bottom: 80px;   /* ←下端からの距離 */
      right: 80px;    /* ←右端からの距離 */
      width: 7em;     /* ←横幅 */

      /* ▼最初は非表示にしておく */
      display: none;

      /* ▼配色・配置・文字の装飾など */
      background-color: transparent;/* ←背景色 */
      opacity: 0.75;             /* ←透明度 */
      border-radius: 24px;       /* ←角丸の半径 */
      text-align: center;    /* ←文字の位置 */
      font-size: 120%;       /* ←文字サイズ */
      font-weight: bold;     /* ←文字の太さ */
      margin: 0px;    /* ←外側の余白 */
      padding: 10px;  /* ←内側の余白 */
   }
   #topbutton a{
      /* ▼リンクの装飾 */
      color: white;          /* ←文字色 */
      text-decoration: none; /* ←下線なし */
   }
   #topbutton a:hover{
      /* ▼マウスが載ったときの装飾 */
      color: yellow;              /* ←文字色 */
      text-decoration: underline; /* ←下線あり */
   }
</style>




.pc-video {
    display: block;
}

.sp-video{
    display: none;
}

@media screen and (max-width: 1000px) {
    .pc-video{
        display: none;
    }

    .sp-video{
        display: block;
    }
}









footer{
	background-color: #444444;
}






.pc-modaru{
    display: block;
}

.sp-modaru{
    display: none;
}

@media screen and (max-width: 1000px) {
    .pc-modaru{
        display: none;
    }

    .sp-modaru{
        display: block;
    }
}








.modal-container{
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0px;
  left: 0px;
  text-align: center;
  
  background:rgba(0, 0, 0, 0.5);
  overflow: auto;
  opacity: 0;
  visibility: hidden;
  transition: .3s ease-out;
  z-index: 9;
}
 
.modal-container::before{
  content: "";
  display: inline-block;
  vertical-align: middle;
  height: 100%;
}
 
.modal-container.active{
  opacity: 1;
  visibility: visible;
}
 
.modal-body{
  position: absolute;
  right: 0px;
  left: 0px;
  top:30px;
 width:50%;	

  margin-left : 0px ;
  padding : 0px ;
  border : 0px ;
  

  display: inline-block;
  vertical-align: middle;
  max-width:1000px;
  max-height:2000px;
  width: 100%;
}
 
.modal-close{
  position: absolute;
  top: 20px;
  right: 110px;
  font-size: 50px;
  color: #fff;
  background: rgba(0,0,0,60%);
  padding: 20px 50px;
  cursor: pointer;
  border-radius: 5px 5px 0 0;
}
 
.modal-content{
  background:#f00;
  border-top-width : 0px;border-right-width : 0px;border-bottom-width : 0px;border-left-width : 0px;border-top-style : solid;border-right-style : solid;border-bottom-style : solid;border-left-style : solid;border-top-color : #000000;border-right-color : transparent;border-bottom-color : transparent;border-left-color : #000000;
  text-align: left;
  padding: 0px;
  font-weight: bold;
}


















.menu{
  position: fixed;
  display: flex;
  left: 0;
  bottom: -20px;
  width: 100%;
  /* 1. メニューを画面下へ隠す */
  transform: translateY(100%);
  /* 2. 0.3秒かけて表示する */
  transition: .3s;
}
.menu li{
  width: 25%;
}
.menu li a{
  display: block;
  font-size: 20px;
  font-weight: bold;
  color: ;
  background:#FFFFFF ;
  text-align: center;
  text-decoration: none;
  padding: 17px;
  border: 2px solid #ccc;
}
.active{
  /* 3. メニューを定位置へ戻す */
  transform: translate(0);
}

ul{
  padding-left:0;
}

li{
  list-style:none;
}




a{
    text-decoration: none;
    color: #000000; /* 今回は#000000を指定していますが、好きな色を指定できます */
}


a{
  text-decoration: none;
}


body{
	overflow-x: hidden;
}










.modal{
  display: none;
  position: fixed;
  z-index: 1;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: rgba(0, 0, 0, 0.4);
}
.modal-content{
  background-color : transparent;  /* モーダルウィンドウの背景色 */
  margin: 15% auto;
  padding: 20px;
  border-top-width : 1px;border-right-width : 1px;border-bottom-width : 0px;border-left-width : 1px;border-top-style : solid;border-right-style : solid;border-bottom-style : solid;border-left-style : solid;
  width: 60%;  /* モーダルウィンドウの横幅 */
}
.modal-title{
  color: #800000; /* モーダルウィンドウの文字の色 */
  font-size: 18px; /* モーダルウィンドウの文字の大きさ */
  font-weight: bold;
  line-height: 200%;
  text-align: center;
}
.close-button{
  color: #aaaaaa;
  float: right;
  font-size: 100px;
  font-weight: bold;
}
.close-button:hover,
.close-button:focus{
  color: black;
  text-decoration: none;
  cursor: pointer;
}