@charset "utf-8";

/*
  Josh's Custom CSS Reset
  https://www.joshwcomeau.com/css/custom-css-reset/
*/
*,*::before,*::after{box-sizing:border-box}*{margin:0}body{height:100%}body{line-height:1.5;-webkit-font-smoothing:antialiased}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}#root,#__next{isolation:isolate}


:root {
 --main-bg-color:#f9f9f9;
 --assort-color:#c2d3e8;
 --assort-color-s-darker:#75b1cb;
 --assort-color-darker:#25253f;
 --assort-color-lighter:#e1eaf5;
 --main-txt-color:#000;
 --main-txt-reverse:#fff;
 --font-family-serif: '游明朝','Yu Mincho',YuMincho,'Hiragino Mincho Pro',serif;
 --font-family-hj:'Noto Serif JP','游明朝','Yu Mincho',YuMincho,'Hiragino Mincho Pro',serif;
 --font-family-he:'EB Garamond', Garamond, 'Times New Roman' , '游明朝','Yu Mincho',YuMincho,'Hiragino Mincho Pro',serif;
 --font-family-sans-serif: 游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
}



html{
/*font-size: 62.5%;*/
  font-size: 3.8vmin;
  min-height: 100%;
-webkit-text-size-adjust: 100%;
text-size-adjust: 100%;
}


body {
  font-family: var(--font-family-serif);
  background: var(--main-bg-color);
 /* font-size: 1.6em;*/
  height: 100%;
  font-weight: 500;
  padding-top: 1rem;
}


  .pc_only { display: none; }
  .sp_only { display: block; }



section#review-post .common_wrapper{
  width: 100%;
  margin: 0 auto;
  padding: 2rem 0 0;
  text-align: center;
}

@media screen and (min-width:600px) {
  html{
/*font-size: 62.5%;*/
  font-size: 2.4vmin;
  min-height: 100%;
-webkit-text-size-adjust: 100%;
text-size-adjust: 100%;
}

section#review-post .common_wrapper{
  width: 600px;
}

.pc_only { display: block; }
.sp_only { display: none; }

  }

section#review-post h2{
  margin-bottom: 4rem!important;
}

section#review-post .common_wrapper h3{
  font-size: 1rem;
  font-weight: normal;
}
section#review-post p.exp{
  font-size: 1rem;
  text-align: center;
  margin: 2rem 0 0;
}

section#review-post p.exp2{
  font-size: 0.8rem;
  text-align: center;
  margin: 0;
  color: #bbb;
}
section#review-post .common_wrapper .cast {
  width: 100%;
  margin: 0rem auto 1rem;
}

section#review-post .common_wrapper .cast h4{
  width: 80%;
    padding: 0;
    margin: 0 auto;
    font-size:1.4rem;
}

section#review-post .common_wrapper h4{
    padding: 0.4rem 0 2rem;
    margin: 0;
    font-size: 1.2rem;
    border-bottom: 1px;
}
section#review-post .common_wrapper .size{
   font-size: 2rem;
}

section#review-post .common_wrapper p.text{
  text-align: left;
}


section#review-post .common_wrapper p.title-text{
  text-align: center;
  font-size: 1.2rem;
  color: #5f2514;
  margin-bottom: 0.5rem;
}

section#review-post .common_wrapper p span.fa{
  font-size: 1.4rem;
  color: #ccc;
}




section#review-post .common_wrapper .reviewform-box{
  width: 80%;
  padding: 2rem 0 3rem;
  margin: 0 auto 0;
  border: 1px solid #bbb;
  border-radius: 10px;
  background: #ededed;
  text-align: center;
}


section#review-post .common_wrapper .reviewform-box .review-tel-field{
    width: 80%; /*親要素いっぱい広げる*/
    padding: 10px 15px; /*ボックスを大きくする*/
    font-size: 1rem;
    border-radius: 5px; /*ボックス角の丸み*/
    border: 1px solid #bbb; /*枠線*/
    box-sizing: border-box; /*横幅の解釈をpadding, borderまでとする*/
}
section#review-post .common_wrapper .reviewform-box .review-tel-field::focus{
    box-shadow: 0 0 5px 0 rgba(255,153,0,1);
    border: 2px solid #FFF !important;
    outline: 0;
}

section#review-post .common_wrapper .reviewform-box .review-tel-field::placeholder {
  color: #bbb;
}
section#review-post .common_wrapper .reviewform-box .star-box{
  margin: 0 auto;
  width: 90%;
  max-width: 600px;
}

section#review-post .common_wrapper .reviewform-box #star-1:checked ~ section [for=star-1] svg, 
section#review-post .common_wrapper .reviewform-box #star-2:checked ~ section [for=star-1] svg, 
section#review-post .common_wrapper .reviewform-box #star-2:checked ~ section [for=star-2] svg, 
section#review-post .common_wrapper .reviewform-box #star-3:checked ~ section [for=star-1] svg, 
section#review-post .common_wrapper .reviewform-box #star-3:checked ~ section [for=star-2] svg, 
section#review-post .common_wrapper .reviewform-box #star-3:checked ~ section [for=star-3] svg, 
section#review-post .common_wrapper .reviewform-box #star-4:checked ~ section [for=star-1] svg, 
section#review-post .common_wrapper .reviewform-box #star-4:checked ~ section [for=star-2] svg, 
section#review-post .common_wrapper .reviewform-box #star-4:checked ~ section [for=star-3] svg, 
section#review-post .common_wrapper .reviewform-box #star-4:checked ~ section [for=star-4] svg, 
section#review-post .common_wrapper .reviewform-box #star-5:checked ~ section [for=star-1] svg, 
section#review-post .common_wrapper .reviewform-box #star-5:checked ~ section [for=star-2] svg, 
section#review-post .common_wrapper .reviewform-box #star-5:checked ~ section [for=star-3] svg, 
section#review-post .common_wrapper .reviewform-box #star-5:checked ~ section [for=star-4] svg, 
section#review-post .common_wrapper .reviewform-box #star-5:checked ~ section [for=star-5] svg {
  transform: scale(1);
}

section#review-post .common_wrapper .reviewform-box #star-1:checked ~ section [for=star-1] svg path, 
section#review-post .common_wrapper .reviewform-box #star-2:checked ~ section [for=star-1] svg path, 
section#review-post .common_wrapper .reviewform-box #star-2:checked ~ section [for=star-2] svg path, 
section#review-post .common_wrapper .reviewform-box #star-3:checked ~ section [for=star-1] svg path, 
section#review-post .common_wrapper .reviewform-box #star-3:checked ~ section [for=star-2] svg path, 
section#review-post .common_wrapper .reviewform-box #star-3:checked ~ section [for=star-3] svg path, 
section#review-post .common_wrapper .reviewform-box #star-4:checked ~ section [for=star-1] svg path, 
section#review-post .common_wrapper .reviewform-box #star-4:checked ~ section [for=star-2] svg path, 
section#review-post .common_wrapper .reviewform-box #star-4:checked ~ section [for=star-3] svg path, 
section#review-post .common_wrapper .reviewform-box #star-4:checked ~ section [for=star-4] svg path, 
section#review-post .common_wrapper .reviewform-box #star-5:checked ~ section [for=star-1] svg path, 
section#review-post .common_wrapper .reviewform-box #star-5:checked ~ section [for=star-2] svg path, 
section#review-post .common_wrapper .reviewform-box #star-5:checked ~ section [for=star-3] svg path, 
section#review-post .common_wrapper .reviewform-box #star-5:checked ~ section [for=star-4] svg path, 
section#review-post .common_wrapper .reviewform-box #star-5:checked ~ section [for=star-5] svg path {
  fill: #FFBB00;
  stroke: #cc9600;
}

section#review-post .common_wrapper .reviewform-box section {
  text-align: center;
  margin:0 auto;
}
section#review-post .common_wrapper .reviewform-box section p{
  font-size: 1rem;
}

section#review-post .common_wrapper .reviewform-box label {
  display: inline-block;
  width: 3rem;
  text-align: center;
  cursor: pointer;
}
section#review-post .common_wrapper .reviewform-box label svg {
  width: 100%;
  height: auto;
  fill: white;
  stroke: #a3a3a3;
  transform: scale(0.8);
  transition: transform 200ms ease-in-out;
}
section#review-post .common_wrapper .reviewform-box label svg path {
  transition: fill 100ms ease-in-out, stroke 50ms ease-in-out;
}

section#review-post .common_wrapper .reviewform-box label[for=star-null] {
  display: block;
  margin: 0 auto;
  color: #999;
}

section#review-post .common_wrapper .reviewform-box input {

}
section#review-post .common_wrapper .reviewform-box .hide{
  visibility:hidden;
}

section#review-post .common_wrapper .btn{
  margin: 0 auto;
  text-align: center;
}

section#review-post .common_wrapper input.req_submit{
    -webkit-appearance: none;
     margin: 2rem auto;
     width: 80%;
     padding: 1.4rem 0;
     font-size: 1.2rem;
     color: #FFF;
     text-decoration: none;
     font-weight: bold;
     text-align: center;
     background-color: var( --assort-color-s-darker); /*ボタン色*/
     border-radius: 5px; /*角丸*/
     cursor: pointer;
     border: 1px solid #bbb;
     border-style: solid;
     font-family: var(--font-family-sans-serif);
}



