body {
  font-family: Yu Gothic Medium, "游ゴシック", "Yu Gothic", "游ゴシック体",
    YuGothic, sans-serif;
  color: #333;
}
.kaigyou {
  display: block;
}

p {
  font-family: "Shippori Mincho B1", serif;
}
li {
  font-family: "Shippori Mincho B1", serif;
}

@media screen and (min-width: 800px) {
  .all-wrap {
    width: 800px;
    margin: 0px auto;
    padding: 0px;
    background-color: rgb(255 255 255 / 68%);
  }

  .title-wrap {
    width: 800px;
    position: relative;
    margin: 0px auto;
    filter: initial;
    position: relative;
    padding: 0;
    background-color: black;
  }

  h1 {
    font-family: "Shippori Mincho B1", serif;
    color: rgb(255, 255, 255);
    font-size: 26px;
    font-weight: bold;
    text-align: center;
    width: 100%;
    margin: auto;
    padding: 6px 0;
  }

  .text1 {
    font-weight: bold;
    color: #2d7be3;
    margin: 0 auto;
    max-width: 80%;
    letter-spacing: 0.03em;
    font-size: 20px;
    line-height: 28px;
  }

  .text2 {
    margin: 10px auto;
    max-width: 80%;
    letter-spacing: 0.04em;
    font-size: 16px;
    line-height: 30px;
  }

  .text3 {
    font-weight: bold;
    /* color: #001aff; */
    margin: 0 auto;
    max-width: 80%;
    letter-spacing: 0.03em;
    font-size: 19px;
    line-height: 28px;
    font-weight: bold;
    text-align: center;
  }

  .fv {
    width: 100%;
  }

  .hame {
    width: 65%;
    margin: 15px auto;
    box-shadow: 0px 3px 6px rgb(0 0 0 / 20%);
    height: 100%;
    display: block;
  }

  .hame2 {
    width: 65%;
    margin: 15px auto;
    height: 100%;
    display: block;
  }

  img.emoji {
    color: #a5d85d;
    display: inline;
    border: none;
    box-shadow: none;
    height: 1em;
    width: 1em !important;
    margin: 0 0.07em;
    vertical-align: -0.1em;
    background: none;
    padding: 0;
  }

  .simple-box1 {
    width: 80%;
    padding: 5px 15px;
    box-sizing: border-box;
    border: 10px solid #def1f9;
    background-color: #def1f8;
    border-radius: 4px;
    margin: 20px auto;
    text-align: center;
  }

  .simple-box2 {
    width: 80%;
    margin: 20px auto;
    padding: 10px 25px;
    box-sizing: border-box;
    border: 3px dashed #a5d85d;
    border-radius: 4px;
    position: relative;
    list-style: none;
    font-size: 19px;
    font-weight: bold;
    letter-spacing: 0.04em;
  }

  .simple-box2 li {
    padding: 5px;
    color: #ff7100;
  }
  .simple-box2 li::before {
    background-color: #a5d85d;
    content: ""; /* 空の要素作成 */
    width: 15px;
    height: 15px;
    display: inline-block;
    border-radius: 50%; /* 要素を丸くする */
    position: relative; /* 位置調整 */
    top: -1px; /* 位置調整 */
    margin-right: 10px; /* 余白指定 */
  }

  .simple-box3 {
    width: 80%;
    padding: 15px 25px;
    border: 3px double #b5e28a;
    border-radius: 4px;
    margin: 20px auto;
  }

  .simple-box4 {
    width: 80%;
    margin: 20px auto;
    padding: 10px 25px;
    list-style: none;
    font-weight: bold;
    letter-spacing: 0.04em;
  }

  .simple-box4 li {
    margin-bottom: 0.2rem;
    padding: 5px;
    background-color: #ffffff;
    font-weight: bold;
    font-size: 19px;
  }

  .simple-box4 li::before {
    margin-right: 0.5rem;
    border-left: 10px solid;
    content: "";
  }

  .simple-box5 {
    margin: 1.5rem auto;
    width: 60%;
    position: relative;
    padding: 1rem;
    background-image: linear-gradient(-135deg, transparent 10px, #c1e9f9 10px);
    color: #212121;
    overflow: hidden;
    text-align: center;
  }
  .simple-box5 li {
    list-style: none;
    line-height: 2;
    font-size: 18px;
  }
  .simple-box5::before {
    position: absolute;
    content: "";
    right: 0px;
    top: 0px;
    width: 15px;
    height: 15px;
    border-left: 2px solid white;
    border-bottom: 2px solid white;
  }

  .simple-box5 p {
    color: #292929;
    line-height: 1.5;
  }

  .simple-box6 {
    position: relative;
    padding: 2rem;
    border-radius: 10px;
    border: 3px solid #333;
    box-shadow: 5px 5px 0 #333;
    color: #333;
  }

  .simole-box6 p {
    line-height: 1.5;
  }

  .simple-box7 {
    width: 80%;
    margin: 10px auto;
    position: relative;
    list-style-type: none;
    padding: 1rem 1rem 1rem 2rem;
    border: 1px solid #003dcb;
    background-color: #ffffff;
    color: #003dcb;
    font-weight: bold;
  }

  .simple-box7 li {
    padding: 0.5rem 0;
    line-height: 1;
  }

  .simple-box7 li::before {
    position: absolute;
    left: 1rem;
    padding-left: 0.2rem;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f105";
  }
  .simple-box8 {
    position: relative;
    padding: 1rem 1.5rem;
    font-size: 1.5rem;
    font-weight: bold;
    text-align: center;
  }

  .simple-box8::before,
  .simple-box8::after {
    position: absolute;
    top: 0.8rem;
    height: 1.8rem;
    content: "";
  }

  .simple-box8::before {
    border-left: solid 3px;
    left: 0;
    transform: rotate(-30deg);
  }

  .simple-box8::after {
    border-right: solid 3px;
    right: 0;
    transform: rotate(30deg);
  }
  .simple-box9 {
    width: 80%;
    background-color: white;
    margin: 1.5rem auto;
    padding: 1rem;
    color: #212121;
    text-align: center;
    box-shadow: 5px 5px 0px 0 rgb(231 231 231);
  }
  /* 
h2{
  font-size: 1.65rem;
  line-height: 2rem;
  padding: 15px;
  padding-bottom: 16px;
  margin-top: 2.6rem;
  margin-bottom: 1.6rem;
  background-color: #a5d85d;
  color: white;
  text-shadow: 1px 1px 1px #86b840, -1px 1px 1px #86b840, 1px -1px 1px #86b840, -1px -1px 1px #86b840, 1px 0px 1px #86b840, 0px 1px 1px #86b840, -1px 0px 1px #86b840, 0px -1px 1px #86b840;
} */

  h2 {
    margin-bottom: 0.2rem;
    padding: 0.6rem;
    color: #333;
    border: 1.5px solid;
    /* border-radius: 2rem; */
    font-size: 26px;
    text-align: center;
  }

  .frame {
    position: relative;
    width: 90%;
    margin: 10px auto;
    /* padding-bottom: 10px; */
    padding: 1rem 1rem 1.2rem;
    border-bottom: 4px solid #333;
  }

  .frame p {
    color: #333;
    line-height: 1.5;
  }

  .frame img {
    width: 80%;
    margin: 8px auto;
    padding: 35px;
    padding-bottom: 0px;
  }

  .frame:before {
    position: absolute;
    left: 50%;
    content: "";
    height: 0;
    width: 0;
    top: 100%;
    border: 15px solid;
    border-color: transparent;
    border-top-color: #333;
  }

  /* h3 {
  width: 90%;
  margin: 0 auto;
  position: absolute;
  top: 20px;
  position: relative;
  margin-bottom: 0.2rem;
  padding: 0 0.7rem;
  border: 0.3rem solid;
  color: white;
  font-size: 26px;
  font-weight: bold;
  text-shadow: 1px 1px 1px #406d86, -1px 1px 1px #406d86, 1px -1px 1px #406d86, -1px -1px 1px #406d86, 1px 0px 1px #406d86, 0px 1px 1px #406d86, -1px 0px 1px #406d86, 0px -1px 1px #406d86;
}

h3:before {
  position: absolute;
  top: -0.6rem;
  left: -0.6rem;
  bottom: -0.6rem;
  right: -0.6rem;
  border: 1px solid;
  content: '';
} */

  h3 {
    width: 20%;
    margin-bottom: 0.2rem;
    padding: 0 0.7rem;
    background-color: #212121;
    color: white;
    font-size: 26px;
    font-weight: bold;
    text-align: center;
  }

  .big {
    font-size: 18px;
    font-weight: bold;
  }
  .superbig {
    font-size: 24px;
    font-weight: bold;
  }
  .marker {
    font-weight: bold;
    background: linear-gradient(transparent 60%, rgb(255 253 162) 60%);
  }
  .fullmarker {
    background: #ffdf0094;
    display: inline-block;
    padding: 3px 5px;
  }
  .underline-red {
    border-bottom: double;
    border-color: #ff0000;
    border-width: 3px;
    color: #ff0000;
    font-size: 20px;
    font-weight: bold;
  }
  .markerLightblue {
    text-shadow: 0 3px 5px rgba(163, 226, 252, 0.6); /* 微妙ににじんだ感じを出すため（さほど明示的ではない） */
    line-height: normal; /* このnormalの指定が、可変文字サイズ取得やクロスブラウザのために重要！ */
    font-weight: bold;
    background: linear-gradient(
      rgba(0, 0, 0, 0) 60%,
      rgba(163, 226, 252, 0.6) 0
    );
  }
  .markerLightblue::before,
  .markerLightblue::after {
    display: inline-block; /* 高さを持たせるためにインラインブロックに */
    content: "\A"; /* 改行を入れて高さを発生させる */
    white-space: pre; /* 改行を入れて高さを発生させる */
    width: 0.41em; /* この数字が出てくる理由は後述 */
    clip-path: inset(1px 0); /* はみ出し部分をトリミング */
    transform-origin: bottom left; /* トランスフォームの起点を左下隅に。重要！ */
    transform: skewX(-20deg) translateX(-0.41em); /* 「平行四辺形」の幅の分ずらす */
    background: linear-gradient(
      rgba(0, 0, 0, 0) 60%,
      rgba(163, 226, 252, 0.6) 0
    ); /* 本要素と同じ指定 */
  }
  .markerLightblue::after {
    filter: blur(0.03em); /* 終端のにじみの演出 */
    transform: skewX(-20deg); /* マーカー右端の平行四辺形の移動は不要 */
    background: linear-gradient(
      rgba(0, 0, 0, 0) 60%,
      rgba(163, 226, 252, 0.95) 0
    ); /* 背景色の透明度を少し濃い目に */
  }
  .markerLightyellow {
    text-shadow: rgb(
      252 230 163 / 60%
    ); /* 微妙ににじんだ感じを出すため（さほど明示的ではない） */
    line-height: normal; /* このnormalの指定が、可変文字サイズ取得やクロスブラウザのために重要！ */
    font-weight: bold;
    background: linear-gradient(rgba(0, 0, 0, 0) 60%, rgb(252 244 163 / 60%) 0);
  }
  .markerLightyellow::before,
  .markerLightyellow::after {
    display: inline-block; /* 高さを持たせるためにインラインブロックに */
    content: "\A"; /* 改行を入れて高さを発生させる */
    white-space: pre; /* 改行を入れて高さを発生させる */
    width: 0.41em; /* この数字が出てくる理由は後述 */
    clip-path: inset(1px 0); /* はみ出し部分をトリミング */
    transform-origin: bottom left; /* トランスフォームの起点を左下隅に。重要！ */
    transform: skewX(-20deg) translateX(-0.41em); /* 「平行四辺形」の幅の分ずらす */
    background: linear-gradient(
      rgba(0, 0, 0, 0) 60%,
      rgb(240 231 131 / 60%) 0
    ); /* 本要素と同じ指定 */
  }
  .markerLightyellow::after {
    filter: blur(0.03em); /* 終端のにじみの演出 */
    transform: skewX(-20deg); /* マーカー右端の平行四辺形の移動は不要 */
    background: linear-gradient(
      rgba(0, 0, 0, 0) 60%,
      rgb(248 231 166 / 95%) 0
    ); /* 背景色の透明度を少し濃い目に */
  }

  .blink {
    animation: blinkAnime 0.7s infinite alternate;
  }
  @keyframes blinkAnime {
    0% {
      color: #ffa000;
    }
    100% {
      color: #ff5e00;
    }
  }
  .red {
    color: #ff0000;
    font-weight: bold;
  }
  .yellow {
    color: #e2fd02;
  }
  .blue {
    color: #003dcb;
  }
  .pink {
    color: #fa45ff;
  }

  .shadow {
    font-size: 24px;
    text-align: center;
    line-height: 0.95em;
    font-weight: bold;
    color: #ffa000 !important;
    text-shadow: 0.02em 0.02em 0.02em rgb(0 0 0);
  }

  .btn {
    width: initial;
    margin: initial;
    padding: initial;
    float: initial;
    font-size: initial;
    background: initial;
    text-decoration: initial;
    width: 630px;
    margin: 15px auto;
    transition: all 0.3s ease 0s;
  }
  .btn img {
    display: inline-block;
    max-width: 100%;
    height: 100%;
  }
  .btn:hover {
    width: 640px;
  }
}

@media screen and (max-width: 799px) {
  .all-wrap {
    width: 100%;
    margin: 0px auto;
    padding: 5px;
    background-color: #fff;
  }

  .title-wrap {
    width: 100%;
    position: relative;
    margin: 0px auto;
    filter: initial;
    position: relative;
    padding: 0;
    background-color: black;
  }

  h1 {
    font-family: "Shippori Mincho B1", serif;
    padding: 0.5rem;
    color: rgb(255, 255, 255);
    font-size: 17px;
    font-weight: bold;
    text-align: center;
    margin: auto;
  }

  .text1 {
    font-weight: bold;
    color: #2d7be3;
    margin: 0 auto;
    max-width: 100%;
    letter-spacing: 0.04em;
    font-size: 17px;
    line-height: 25px;
  }

  .text2 {
    margin: 5px auto;
    max-width: 90%;
    letter-spacing: 0.04em;
    font-size: 16px;
    line-height: 25px;
  }
  .text3 {
    font-weight: bold;
    margin: 0 auto;
    max-width: 100%;
    letter-spacing: 0.04em;
    font-size: 17px;
    line-height: 25px;
    text-align: center;
  }
  .fv {
    width: 100%;
  }

  .hame {
    width: 92%;
    margin: 10px auto;
    display: block;
  }

  .hame2 {
    width: 92%;
    margin: 10px auto;
    display: block;
  }

  img.emoji {
    color: #a5d85d;
    display: inline;
    border: none;
    box-shadow: none;
    height: 1em;
    width: 1em !important;
    margin: 0 0.07em;
    vertical-align: -0.1em;
    background: none;
    padding: 0;
  }

  .simple-box1 {
    width: 90%;
    /* padding: 5px 15px; */
    box-sizing: border-box;
    border: 10px solid #def1f9;
    background-color: #def1f8;
    border-radius: 4px;
    margin: 5px auto;
    text-align: center;
  }

  .simple-box2 {
    width: 90%;
    margin: 5px auto;
    padding: 5px 5px;
    box-sizing: border-box;
    border: 3px dashed #a5d85d;
    border-radius: 4px;
    position: relative;
    list-style: none;
    font-size: 15px;
    font-weight: bold;
    letter-spacing: 0.04em;
  }

  .simple-box2 li {
    padding: 5px;
    color: #ff7100;
  }
  .simple-box2 li::before {
    background-color: #a5d85d;
    content: ""; /* 空の要素作成 */
    width: 15px;
    height: 15px;
    display: inline-block;
    border-radius: 50%; /* 要素を丸くする */
    position: relative; /* 位置調整 */
    top: -1px; /* 位置調整 */
    margin-right: 10px; /* 余白指定 */
  }

  .simple-box3 {
    width: 80%;
    padding: 5px 10px;
    border: 3px double #b5e28a;
    border-radius: 4px;
    margin: 5px auto;
  }
  .simple-box4 {
    width: 80%;
    margin: 20px auto;
    padding: 10px 25px;
    list-style: none;
    font-weight: bold;
    letter-spacing: 0.04em;
  }

  .simple-box4 li {
    margin-bottom: 0.2rem;
    padding: 5px;
    background-color: #ffffff;
    font-weight: bold;
    font-size: 19px;
  }

  .simple-box4 li::before {
    margin-right: 0.5rem;
    border-left: 10px solid;
    content: "";
  }
}
.pink {
  color: #fa45ff;
}

.simple-box5 {
  margin: 1rem auto;
  width: 100%;
  position: relative;
  padding: 0.5rem;
  background-image: linear-gradient(-135deg, transparent 10px, #c1e9f9 10px);
  color: #212121;
  overflow: hidden;
  text-align: center;
}
.simple-box5 li {
  list-style: none;
  line-height: 2;
  font-size: 16px;
}
.simple-box5::before {
  position: absolute;
  content: "";
  right: 0px;
  top: 0px;
  width: 15px;
  height: 15px;
  border-left: 2px solid white;
  border-bottom: 2px solid white;
}

.simple-box5 p {
  color: #292929;
  line-height: 1.5;
}

.simple-box6 {
  position: relative;
  padding: 2rem;
  border-radius: 10px;
  border: 3px solid #333;
  box-shadow: 5px 5px 0 #333;
  color: #333;
}

.simole-box6 p {
  line-height: 1.5;
}

.simple-box7 {
  width: 90%;
  margin: 10px auto;
  position: relative;
  list-style-type: none;
  padding: 1rem 1rem 1rem 2rem;
  border: 1px solid #003dcb;
  background-color: #ffffff;
  color: #003dcb;
  font-weight: bold;
}

.simple-box7 li {
  padding: 0.5rem 0;
  line-height: 1;
}

.simple-box7 li::before {
  position: absolute;
  left: 1rem;
  padding-left: 0.2rem;
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  content: "\f105";
}
.simple-box8 {
  position: relative;
  padding: 1rem 1.5rem;
  font-size: 1.5rem;
  font-weight: bold;
  text-align: center;
}

.simple-box8::before,
.simple-box8::after {
  position: absolute;
  top: 0.8rem;
  height: 1.8rem;
  content: "";
}

.simple-box8::before {
  border-left: solid 3px;
  left: 0;
  transform: rotate(-30deg);
}

.simple-box8::after {
  border-right: solid 3px;
  right: 0;
  transform: rotate(30deg);
}
.simple-box9 {
  width: 90%;
  background-color: white;
  margin: 1.5rem auto;
  padding: 0.5rem;
  color: #212121;
  text-align: center;
  box-shadow: 5px 5px 0px 0 rgb(231 231 231);
}

/* 

h2{
  padding: 0.4em 0.5em;
  margin: 2em auto 0.5em;
  font-size: 19px;
  line-height: 25px;
  background-color: #a5d85d;
  color: white;
  text-shadow: 1px 1px 1px #86b840, -1px 1px 1px #86b840, 1px -1px 1px #86b840, -1px -1px 1px #86b840, 1px 0px 1px #86b840, 0px 1px 1px #86b840, -1px 0px 1px #86b840, 0px -1px 1px #86b840;
} */

h2 {
  margin: 2em auto 0.5em;
  padding: 0.4em 0.5em;
  color: #333;
  border: 1.5px solid;
  font-size: 19px;
  text-align: center;
  line-height: 25px;
}

.frame {
  width: 100%;
  margin: 10px auto;
  padding: 1rem 1rem 1.2rem;
  background-color: #eeeeee;
  position: relative;
  border-bottom: 4px solid #333;
}

.frame p {
  color: #333;
  line-height: 1.5;
}

.frame img {
  width: 80%;
  margin: 10px auto;
  padding: 15px;
  padding-bottom: 0px;
}
.frame:before {
  position: absolute;
  left: 40%;
  content: "";
  height: 0;
  width: 0;
  top: 100%;
  border: 15px solid;
  border-color: transparent;
  border-top-color: #333;
}

/* h3 {
  width: 90%;
  margin: 0 auto;
  position: absolute;
  top: 12px;
  position: relative;
  padding: 0 0.7rem;
  border: 0.3rem solid;
  color: white;
  font-size: 17px;
  font-weight: bold;
  text-shadow: 1px 1px 1px #406d86, -1px 1px 1px #406d86, 1px -1px 1px #406d86, -1px -1px 1px #406d86, 1px 0px 1px #406d86, 0px 1px 1px #406d86, -1px 0px 1px #406d86, 0px -1px 1px #406d86;
}

h3:before {
  position: absolute;
  top: -0.6rem;
  left: -0.6rem;
  bottom: -0.6rem;
  right: -0.6rem;
  border: 1px solid;
  content: '';
} */
h3 {
  width: 40%;
  margin-bottom: 0.2rem;
  padding: 0 0.7rem;
  background-color: #212121;
  color: white;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
}
.big {
  font-size: 18px;
  font-weight: bold;
}
.superbig {
  font-size: 19px;
  font-weight: bold;
}
.small {
  font-size: 13px;
}
.marker {
  font-weight: bold;
  background: linear-gradient(transparent 60%, rgb(255 227 0 / 58%) 60%);
}
.fullmarker {
  background: #ffdf0094;
  display: inline-block;
  padding: 3px 5px;
}
.underline-red {
  border-bottom: double;
  border-color: #ff0000;
  border-width: 3px;
  color: #ff0000;
  font-size: 20px;
  font-weight: bold;
  line-height: 38px;
}
.markerLightblue {
  text-shadow: 0 3px 5px rgba(163, 226, 252, 0.6); /* 微妙ににじんだ感じを出すため（さほど明示的ではない） */
  line-height: normal; /* このnormalの指定が、可変文字サイズ取得やクロスブラウザのために重要！ */
  font-weight: bold;
  background: linear-gradient(rgba(0, 0, 0, 0) 60%, rgba(163, 226, 252, 0.6) 0);
  font-size: 30px;
}
.markerLightblue::before,
.markerLightblue::after {
  display: inline-block;
  content: "\A";
  white-space: pre;
  width: 0.3em;
  clip-path: inset(1px 0);
  transform-origin: bottom left;
  transform: skewX(-20deg) translateX(-0.3em);
  background: linear-gradient(rgba(0, 0, 0, 0) 60%, rgba(163, 226, 252, 0.6) 0);
}
.markerLightblue::after {
  filter: blur(0.03em); /* 終端のにじみの演出 */
  transform: skewX(-20deg); /* マーカー右端の平行四辺形の移動は不要 */
  background: linear-gradient(
    rgba(0, 0, 0, 0) 60%,
    rgba(163, 226, 252, 0.95) 0
  ); /* 背景色の透明度を少し濃い目に */
}
.markerLightyellow {
  text-shadow: rgb(
    252 230 163 / 60%
  ); /* 微妙ににじんだ感じを出すため（さほど明示的ではない） */
  line-height: normal; /* このnormalの指定が、可変文字サイズ取得やクロスブラウザのために重要！ */
  font-weight: bold;
  background: linear-gradient(rgba(0, 0, 0, 0) 60%, rgb(252 244 163 / 60%) 0);
}
.markerLightyellow::before,
.markerLightyellow::after {
  display: inline-block; /* 高さを持たせるためにインラインブロックに */
  content: "\A"; /* 改行を入れて高さを発生させる */
  white-space: pre; /* 改行を入れて高さを発生させる */
  width: 0.41em; /* この数字が出てくる理由は後述 */
  clip-path: inset(1px 0); /* はみ出し部分をトリミング */
  transform-origin: bottom left; /* トランスフォームの起点を左下隅に。重要！ */
  transform: skewX(-20deg) translateX(-0.41em); /* 「平行四辺形」の幅の分ずらす */
  background: linear-gradient(
    rgba(0, 0, 0, 0) 60%,
    rgb(240 231 131 / 60%) 0
  ); /* 本要素と同じ指定 */
}
.markerLightyellow::after {
  filter: blur(0.03em); /* 終端のにじみの演出 */
  transform: skewX(-20deg); /* マーカー右端の平行四辺形の移動は不要 */
  background: linear-gradient(
    rgba(0, 0, 0, 0) 60%,
    rgb(248 231 166 / 95%) 0
  ); /* 背景色の透明度を少し濃い目に */
}
.blink {
  animation: blinkAnime 0.7s infinite alternate;
}
@keyframes blinkAnime {
  0% {
    color: #ffa000;
  }
  100% {
    color: #ff5e00;
  }
}
.red {
  color: #f23131;
  font-weight: bold;
}
.yellow {
  color: #e2fd02;
}
.blue {
  color: #003dcb;
}

.pink {
  color: #fa45ff;
}
.shadow {
  font-size: 24px;
  text-align: center;
  line-height: 0.95em;
  font-weight: bold;
  color: #ffa000 !important;
  text-shadow: 0.02em 0.02em 0.02em rgb(0 0 0);
}

.btn {
  width: initial;
  margin: initial;
  padding: initial;
  float: initial;
  font-size: initial;
  background: initial;
  text-decoration: initial;
  width: 94%;
  margin: 0px auto;
  padding: 10px 0;
  text-align: center;
}

/* //////////////////////////////////////////////////////////////
追加分

///////////////////////////////////////////////////////////////// */
/* //////////////////////////////////////////////////////////////
ユーザー口コミ
///////////////////////////////////////////////////////////////// */
.star {
  border-bottom: 2px solid rgb(68, 68, 68);
  width: 100%;
  margin: 0 0 0 0;
}

.name,
.sub-tit {
  margin: 0;
}

.kutikomi {
  padding: 8px 18px 20px 18px;
  border-radius: 15px;
}
.kutikomi .text2 {
  padding: 15px 30px;
  margin-left: 40px;
  position: relative;
  display: inline-block;
  background: #fff;
  border: solid 3px #555;
  box-sizing: border-box;
  width: 80%;
}
.kutikomi .text2::before {
  content: "";
  position: absolute;
  border: 12px solid transparent;
  border-right: 12px solid #fff;
  z-index: 2;
  top: 50%;
  left: -24px;
}
.kutikomi .text2::after {
  content: "";
  position: absolute;
  border: 14px solid transparent;
  border-right: 14px solid #555;
  z-index: 1;
  left: -30px;
  top: 50%;
}
.flex {
  display: flex;
  align-items: center;
  margin-top: 10px;
}

.space {
  padding-top: 14px;
}

.text {
  background: #fff;
  padding: 16px;
  border-radius: 30px;
  margin-left: 18px;
  line-height: 36px;
  text-align: justify;
}
.centar {
  text-align: center;
}
.sec-01 h3 {
  margin: 0 auto;
  font-size: 25px;
  width: 80%;
  padding: 16px;
}

/* //////////////////////////////////////////////////////////////
レスポンシブ
///////////////////////////////////////////////////////////////// */

@media screen and (max-width: 650px) {
  /* 文字の大きさ */
  .markerLightblue {
    font-size: 25px;
  }
  .underline-red {
    font-size: 20px;
  }
  .shadow {
    line-height: 32px;
  }
  .sec-01 h3 {
    width: 100%;
    font-size: 1rem;
    padding: 10px;
  }
  .kutikomi h3 {
    width: 100%;
  }
  /* 口コミ調整 */

  .flex {
    flex-direction: column;
  }
  .kutikomi {
    padding: 8px 8px 20px 8px;
  }
  .kutikomi .text2::after {
    border: 14px solid transparent;
    border-bottom: 14px solid #555;
    left: 50%;
    top: -30px;
  }
  .kutikomi .text2::before {
    border: 12px solid transparent;
    border-bottom: 12px solid #fff;
    left: 50%;
    top: -24px;
  }
  .kutikomi .text2 {
    padding: 6px 12px;
    margin: 12px auto;
  }
  .star {
    margin: 0 0 9px 0;
  }
  .underline-red {
    font-size: 18px;
  }
  /* ボタン */
  .btn img {
    width: 100%;
  }
}