/* ======================================================================================== */
/* ボタン */
/* ======================================================================================== */
.green_btn {
  background: linear-gradient(to bottom, #15c115, #229722);
}

.orange_btn {
  background: linear-gradient(to bottom, #ffa21e, #ff851c);
}

.blue_btn {
  background: linear-gradient(to bottom, #2c8bfd, #2178e2);
}

.common_btn01 {
  width: 29.5vw;
  min-width: 350px;
  margin-top: 20px;
  padding: 1.830161vw 0px;
  margin-left: auto;
  border-radius: 5px;
}
@media screen and (min-width: 1440px) {
  .common_btn01 {
    padding: 25px 0;
  }
}

.common_btn01 img.btn_arrow {
  width: 25px;
  height: auto;
  transition: all 0.4s;
  margin-left: 10px;
}

.common_btn01:hover img.btn_arrow {
  transform: translateX(5px);
}

@media screen and (max-width: 480px) {
  .common_btn01 {
    min-width: 300px;
  }

  .common_btn01 img.btn_arrow {
    width: 20px;
  }
}

/* ======================================================================================== */
/* タイトル */
/* ======================================================================================== */
.sec_ttl {
  padding-bottom: 10px;
  border-bottom: 5px solid var(--main_color);
  position: relative;
  width: fit-content;
  margin: auto;
}

.sec_ttl::after {
  position: absolute;
  content: "";
  width: 30px;
  height: 5px;
  background-color: var(--white);
  border: 1px solid var(--white);
  border-right: unset;
  border-left: unset;
  bottom: -5px;
  right: 0;
  left: 0;
  margin: auto;
  z-index: 1;
}

.sec_ttl::before {
  position: absolute;
  content: "";
  width: 20px;
  height: 20px;
  border-right: 5px solid var(--main_color);
  border-bottom: 5px solid var(--main_color);
  transform: rotate(45deg);
  right: 0;
  left: 0;
  bottom: -16px;
  margin: auto;
  z-index: 2;
}

.sec_ttl02 {
  background-color: var(--main_color);
  padding: 25px 35px;
}

@media screen and (max-width: 768px) {
  .sec_ttl02 {
    padding: 15px 20px;
  }
}

/* Tシャツ */
.sec_ttl_tshirt02 {
  background-color: var(--tshirt_main_color);
  padding: 25px 35px;
}

@media screen and (max-width: 768px) {
  .sec_ttl_tshirt02 {
    padding: 15px 20px;
  }
}

/* ======================================================================================== */
/* 電話リンク */
/* ======================================================================================== */
a.links_tel {
  flex-direction: column;
}

/* ======================================================================================== */
/* ハンバーガー */
/* ======================================================================================== */
header .hamburger {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background: linear-gradient(to bottom, #15c115, #229722);
  position: relative;
  display: none;
  margin-left: 20px;
}

header .hamburger span:first-child {
  position: absolute;
  width: 40%;
  height: 2px;
  background-color: #ffffff;
  top: 40%;
  left: 5%;
  right: 0;
  margin: auto;
  transition: all 0.5s;
}

header .hamburger span:last-child {
  position: absolute;
  width: 45%;
  height: 2px;
  background-color: #ffffff;
  top: 56%;
  left: 0;
  right: 0;
  margin: auto;
  transition: all 0.5s;
}

header .hamburger.show span:first-child {
  width: 45%;
  transform: rotate(-45deg);
  top: 50%;
  left: 0;
}

header .hamburger.show span:last-child {
  width: 45%;
  transform: rotate(45deg);
  top: 50%;
}

/* ======================================================================================== */
/* ハンバーガーメニュー */
/* ======================================================================================== */
.hamburger_menu {
  position: fixed;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  margin-left: auto;
  padding-bottom: 100px;
  padding-top: 120px;
  z-index: 5;
  background-color: var(--green2);
  transition: all 0.4s ease-in-out;
  transform: translate(0, -200%);
  opacity: 0;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

.hamburger_menu.show {
  transform: translate(0, 0);
  opacity: 1;
}

.hamburger_menu .inner {
  width: 90%;
  margin: auto;
}

.hamburger_menu .head {
  margin-top: 40px;
}

.hamburger_menu .head a.item.btn {
  background-color: var(--white);
  padding: 15px 25px;
  border-radius: 5px;
  margin-top: 5px;
}

.hamburger_menu .head a.item.btn img {
  width: 30px;
  height: auto;
  margin-right: 15px;
  filter: brightness(0);
}

.hamburger_menu .container {
  margin-top: 40px;
}

.hamburger_menu .container a.item {
  margin-top: 20px;
}

.hamburger_menu a.links_tel {
  display: none;
}

/* -----------------------------レスポンシブ----------------------------- */
@media screen and (max-width: 480px) {
  .hamburger_menu .head a.item.btn {
    padding: 10px 15px;
  }

  .hamburger_menu .head a.item.btn img {
    width: 20px;
  }

  header .hamburger {
    width: 40px;
    height: 40px;
  }

  .hamburger_menu a.links_tel {
    display: flex;
  }
}

/* ================================================================================================ */
/* 吹き出し */
/* ================================================================================================ */
.comments_box {
  position: absolute;
  right: 0;
  left: 0;
  margin: auto;
  padding: 1.610541728vw 0;
  background-color: var(--yellow);
  border-radius: 10px;
  border: 5px solid var(--black);
}

.comments_box::after {
  position: absolute;
  content: "";
  width: 20px;
  height: 5px;
  right: 0;
  left: 0;
  margin: auto;
  bottom: -5px;
  background-color: var(--yellow);
}

.comments_box::before {
  position: absolute;
  content: "";
  width: 15px;
  height: 15px;
  border-right: 5px solid var(--black);
  border-bottom: 5px solid var(--black);
  transform: rotate(45deg);
  right: 0;
  left: 0;
  margin: auto;
  bottom: -15px;
  z-index: 1;
  background-color: var(--yellow);
}

/* ================================================================================================ */
/* under_mv */
/* ================================================================================================ */
section.under_mv {
  background: url(../../img/common/under_mv.png) no-repeat center;
  background-size: cover;
  width: 100%;
}

section.under_mv .container {
  width: 80%;
  margin: auto;
  max-width: 1440px;
  padding: 6.954612006vw 0;
  position: relative;
}

section.under_mv .container h4.sub_ttl {
  text-shadow: 10px 5px 0px rgba(0, 0, 0, 0.3);
}

section.under_mv .container h2.main_ttl {
  text-shadow: 10px 5px 0px rgba(0, 0, 0, 0.3);
}

section.under_mv .container p.main_txt {
  margin-top: 60px;
}

@media screen and (max-width: 1024px) {
  section.under_mv .container {
    width: 90%;
    padding: 60px 0;
  }
}

/* ================================================================================================ */
/* estimate_select_box */
/* ================================================================================================ */
.estimate_select_box .estimate_select_item .estimate_select {
  position: relative;
  width: 11.71303vw;
  background-color: var(--green3);
  margin-left: 1.464128843vw;
  border-radius: 5px;
}

.estimate_select_box .estimate_select_item .estimate_select::after {
  position: absolute;
  content: "";
  width: 6px;
  height: 6px;
  border-right: 2px solid #000000;
  border-bottom: 2px solid #000000;
  transform: rotate(45deg);
  top: 0;
  bottom: 0;
  margin: auto;
  right: 15px;
}

.estimate_select_box .estimate_select_item select {
  width: 100%;
  padding: 1.4641288vw 0;
  text-align: center;
}

@media screen and (max-width: 480px) {
  .estimate_select_box .estimate_select_item .estimate_select {
    width: 20.83333333vw;
  }

  .estimate_select_box .estimate_select_item .estimate_select::after {
    width: 5px;
    height: 5px;
    border-right: 1px solid #000000;
    border-bottom: 1px solid #000000;
  }
}

/* ================================================================================================ */
/* sec_tag */
/* ================================================================================================ */
.sec_tag {
  background-color: var(--main_color);
  padding: 5px 25px;
  border-radius: 10px;
  width: fit-content;
  margin: auto;
  margin-bottom: 20px;
}

/* ================================================================================================ */
/* voice */
/* ================================================================================================ */
section.voice {
  padding-top: 75px;
  margin-top: 75px;
  padding-bottom: 10.2489019vw;
}

section.voice .container {
  width: 93%;
  margin: auto;
}

section.voice .container p.sec_txt {
  margin-top: 40px;
}

section.voice .contents {
  flex-wrap: wrap;
}

section.voice .contents .item {
  margin-top: 40px;
  width: fit-content;
}

section.voice .contents .item .left {
  width: 13.17715959vw;
  margin-right: 2.562225476vw;
}

section.voice .contents .item .left .item_img {
  width: 100%;
  height: auto;
}

section.voice .contents .item .left p.img_txt {
  margin-top: 20px;
}

section.voice .contents .item .right {
  padding: 2.928257687vw;
  max-width: 28.40409956vw;
  border: 3px solid var(--main_color);
  border-radius: 10px;
}

section.voice .contents .item .right .right_txt {
  margin-top: 20px;
}

section.voice .contents .item .right a.link {
  width: fit-content;
  margin-top: 20px;
  margin-left: auto;
}

section.voice .contents .item .right a.link img.arrow {
  width: 20px;
  height: auto;
  margin-right: 10px;
}

section.voice .contents .item .right a.link p {
  border-bottom: 1px solid var(--main_color);
  width: fit-content;
}

section.voice .container a.common_btn01 {
  margin: auto;
  margin-top: 40px;
}

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

@media screen and (max-width: 1024px) {
  section.voice .container {
    width: 82%;
  }

  section.voice .contents .item .left {
    width: 25%;
  }

  section.voice .contents .item .right {
    width: 70%;
    max-width: unset;
  }
}

@media screen and (max-width: 768px) {
  section.voice {
    padding-bottom: 100px;
  }

  section.voice .container {
    width: 90%;
  }

  section.voice .container p.sec_txt {
    text-align: unset;
  }

  section.voice .contents .item .right {
    padding: 25px;
  }
}

@media screen and (max-width: 480px) {
  section.voice {
    margin-top: 60px;
    padding-top: 60px;
    padding-bottom: 80px;
  }

  section.voice .contents .item {
    flex-direction: column;
  }

  section.voice .contents .item .left {
    width: 40%;
    margin: auto;
  }

  section.voice .contents .item .left p.img_txt {
    margin-top: 10px;
  }

  section.voice .contents .item .right {
    width: 100%;
    margin-top: 20px;
  }

  section.voice .container a.common_btn01 {
    padding: 15px 0;
  }
}

/* ================================================================================================ */
/* reason */
/* ================================================================================================ */
section.reason {
  margin-top: 80px;
  overflow: hidden;
}

section.reason .container {
  width: 76%;
  margin: auto;
}

section.reason .container .head_tag {
  width: fit-content;
  margin: auto;
  margin-bottom: 20px;
  background-color: var(--main_color);
  border-radius: 10px;
  padding: 5px 1.830161054vw;
}

section.reason .contents {
  margin-top: 60px;
}

section.reason .contents .item {
  margin-top: 20px;
  width: 100%;
  box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.3);
  position: relative;
}

section.reason .contents .item:first-child img.face_icon {
  position: absolute;
  width: 23.42606149vw;
  max-width: 330px;
  height: auto;
  bottom: 98%;
  right: -150px;
}

section.reason .contents .item:last-child img.book_icon {
  position: absolute;
  width: 18.30161054vw;
  max-width: 250px;
  height: auto;
  bottom: 60%;
  right: -3%;
}

section.reason .contents .item .num {
  background-color: var(--yellow);
  width: 110px;
}

section.reason .contents .item .box {
  background-color: var(--main_color);
  padding: 2.928257687vw;
  width: calc(100% - 110px);
}

section.reason .contents .item .box h4.box_ttl {
  text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.3);
}

section.reason .contents .item .box p.box_txt {
  margin-top: 30px;
}

section.reason .container a.common_btn01 {
  margin: auto;
  margin-top: 40px;
}

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

@media screen and (max-width: 1024px) {
  section.reason .container {
    width: 85.65%;
  }

  section.reason .contents .item:first-child img.face_icon {
    right: -70px;
  }
}

@media screen and (max-width: 768px) {
  section.reason .container {
    width: 90%;
  }

  section.reason .contents {
    margin-top: 120px;
  }

  section.reason .contents .item:first-child img.face_icon {
    right: -40px;
  }

  section.reason .contents .item {
    flex-direction: column;
  }

  section.reason .contents .item .num {
    width: 100%;
  }

  section.reason .contents .item .box {
    width: 100%;
    padding: 25px;
  }

  section.reason .container a.common_btn01 {
    margin-top: 60px;
  }
}

@media screen and (max-width: 480px) {
  section.reason {
    margin-top: 60px;
  }

  section.reason .contents .item:first-child img.face_icon {
    right: -20px;
    width: 35vw;
  }

  section.reason .contents .item:last-child img.book_icon {
    width: 25vw;
    /* bottom: -20%; */
    bottom: -5%;
  }

  section.reason .container a.common_btn01 {
    padding: 15px 0px;
    margin-top: 40px;
    /* margin-top: 80px; */
  }
}

/* ================================================================================================ */
/* guide_top */
/* ================================================================================================ */
section.guide_top {
  padding-top: 80px;
}

section.guide_top .container {
  width: 58.56515373%;
  margin: auto;
}

section.guide_top .container .top_ttl {
  color: #28b921;
}

/* Tシャツ */
section.guide_top .container .top_ttl_tshirt {
  color: #33ac9e;
}

section.guide_top .container .top_txt {
  margin-top: 40px;
}

/* ----- */
/* レスポンシブ */
/* ----- */
@media screen and (max-width: 1024px) {
  section.guide_top .container {
    width: 70%;
  }
}

@media screen and (max-width: 768px) {
  section.guide_top {
    padding-top: 40px;
  }
  section.guide_top .container .top_txt {
    text-align: unset;
  }

  section.guide_top .container {
    width: 90%;
  }
}

@media screen and (max-width: 480px) {
  section.guide_top .container .top_ttl {
    text-align: unset;
  }

  section.guide_top .container .top_ttl_tshirt {
    text-align: unset;
  }

  section.guide_top .container .top_txt {
    margin-top: 20px;
  }
}

/* ================================================================================================ */
/* form_item */
/* ================================================================================================ */
.item_tag {
  width: 50px;
  padding: 5px;
  background: #afafaf;
  margin-left: auto;
  margin-right: 60px;
  height: fit-content;
}

.item_tag.hissu {
  background: #28b921;
}

form.main .form_item .item_wrap .text_box {
  background: var(--white);
  border-radius: 3px;
  border: 1px solid #ccedcc;
  padding: 15px;
}

form.main .form_item .item_wrap .text_box_confirm {
  padding: 15px;
}

form.main .form_item .item_wrap .text_box.size_l {
  width: 100%;
}
.haserror {
  margin-top: 25px;
  color: red;
  font-size: 14px;
}
form.main .form_item .item_wrap .error,
form.main .form_item .item_wrap .haserror {
  color: red;
  font-size: 14px;
  margin: 0;
  margin-top: 8px;
  margin-left: 8px;
  text-align: left;
}


form.main .form_item .item_wrap .text_box.size_s {
  width: 33%;
}

/* ---------- */
/* フォームボタン */
/* ---------- */
form.main .submit_box {
  margin-top: 60px;
}

form.main .submit_box .common_btn01 {
  margin: 0px 20px;
  position: relative;
  min-width: unset;
}

form.main .submit_box .common_btn01.gray_btn {
  background: linear-gradient(to bottom, #cecece, #9d9d9d);
}

form.main .submit_box .common_btn01 img.btn_arrow {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  right: 2.049780381vw;
}

form.main .submit_box .common_btn01.reverse img.btn_arrow {
  transform: rotate(180deg);
  right: unset;
  left: 2.049780381vw;
}

form.main .submit_box .common_btn01.reverse:hover img.btn_arrow {
  left: 1.8vw;
}

/* ---------- */
/* レスポンシブ */
/* ---------- */
@media screen and (max-width: 768px) {
  .item_tag {
    margin-right: unset;
    margin-left: 20px;
  }

  form.main .submit_box {
    flex-direction: column;
    align-items: center;
  }

  form.main .submit_box .common_btn01 {
    width: 45vw;
  }

  form.main .submit_box .common_btn01:nth-child(2) {
    margin-top: 20px;
  }
}

@media screen and (max-width: 480px) {
  form.main .form_item .item_wrap .text_box {
    padding: 12px;
  }

  form.main .form_item .item_wrap .text_box.size_s {
    width: 60%;
  }

  .item_tag {
    width: 40px;
  }

  form.main .submit_box .common_btn01 {
    width: 60vw;
    padding: 10px;
  }
}

/* ================================================================================================ */
/* ラジオボックス */
/* ================================================================================================ */
.radio_box label.radio_item input[type="radio"] + span {
  display: inline-block;
  position: relative;
  padding-left: 35px;
}

.radio_box label.radio_item input[type="radio"] + span::after,
.radio_box label.radio_item input[type="radio"] + span::before {
  position: absolute;
  content: "";
  display: block;
  border-radius: 50%;
  top: 0;
  bottom: 0;
  margin: auto;
}

.radio_box label.radio_item input[type="radio"] + span::before {
  width: 24px;
  height: 24px;
  background: var(--white);
  border: 1px solid #ccedcc;
  left: 0;
}

.radio_box label.radio_item input[type="radio"] + span::after {
  width: 15px;
  height: 15px;
  left: 5.5px;
  background: var(--main_color);
  opacity: 0;
}

.radio_box label.radio_item input[type="radio"]:checked + span::after {
  opacity: 1;
}

@media screen and (max-width: 480px) {
  .radio_box label.radio_item input[type="radio"] + span {
    padding-left: 30px;
  }

  .radio_box label.radio_item input[type="radio"] + span::before {
    width: 18px;
    height: 18px;
  }

  .radio_box label.radio_item input[type="radio"] + span::after {
    width: 10px;
    height: 10px;
    left: 5px;
  }
}

.radio_box label.radio_item {
  width: fit-content;
}

/* ================================================================================================ */
/* チェックボックス */
/* ================================================================================================ */
.check_box label.check_item {
  width: fit-content;
}

.check_box label.check_item input[type="checkbox"] + span {
  position: relative;
  display: inline-block;
  padding-left: 40px;
}

.check_box label.check_item input[type="checkbox"] + span::before,
.check_box label.check_item input[type="checkbox"] + span::after {
  position: absolute;
  content: "";
  display: block;
  top: 0;
  bottom: 0;
  margin: auto;
}

.check_box label.check_item input[type="checkbox"] + span::before {
  width: 24px;
  height: 24px;
  background: var(--white);
  border: 1px solid #ccedcc;
  left: 0;
}

.check_box label.check_item input[type="checkbox"] + span::after {
  background: url(../../img/common/check_box.png) no-repeat center;
  background-size: cover;
  width: 20px;
  height: 19px;
  left: 3px;
  opacity: 0;
}

.check_box label.check_item input[type="checkbox"]:checked + span::after {
  opacity: 1;
}

@media screen and (max-width: 480px) {
  .check_box label.check_item input[type="checkbox"] + span::before {
    width: 18px;
    height: 18px;
  }

  .check_box label.check_item input[type="checkbox"] + span::after {
    width: 15px;
    height: 15px;
  }
}

/* ================================================================================================ */
/* セレクトボックス */
/* ================================================================================================ */
.select_box {
  position: relative;
  border: 1px solid #ccedcc;
}

.select_box::after {
  position: absolute;
  content: "";
  width: 8px;
  height: 8px;
  border-right: 2px solid var(--black);
  border-bottom: 2px solid var(--black);
  transform: rotate(45deg);
  top: 0;
  bottom: 0;
  right: 30px;
  margin: auto;
}

.select_box select {
  padding: 20px;
  background: var(--white);
  position: relative;
  padding-right: 40px;
  width: 100%;
}

@media screen and (max-width: 768px) {
  .select_box select {
    padding: 15px;
    padding-right: 30px;
  }
}

@media screen and (max-width: 480px) {
  .select_box::after {
    width: 5px;
    height: 5px;
    right: 15px;
    border-right: 1px solid var(--black);
    border-bottom: 1px solid var(--black);
  }
}

/* ================================================================================================ */
/* テキストエリア */
/* ================================================================================================ */
.textarea_box textarea {
  width: 100%;
  background: var(--white);
  padding: 5px 10px;
  font-size: calc(16px + 2 * (100vw - 480px) / 886);
  line-height: 1.75;
  height: 100%;
}

/* ================================================================================================ */
/* 数字選択 */
/* ================================================================================================ */
.num_select input[type="number"] {
  padding: 20px;
  background: var(--white);
  max-width: 260px;
  min-width: 120px;
  border: 1px solid #ccedcc;
  width: 19.03367496vw;
}

@media screen and (max-width: 768px) {
  .num_select input[type="number"] {
    padding: 12px;
  }
}



.single_container h1 {
  font-size: 36px;
  margin-bottom: 20px;
}

.single_container h2 {
  font-size: 30px;
  margin-bottom: 20px;
}

.single_container h3 {
  font-size: 24px;
  margin-bottom: 20px;
}

.single_container h4 {
  font-size: 18px;
  margin-bottom: 20px;
}

.single_container h5 {
  font-size: 16px;
  margin-bottom: 20px;
}

.single_container h6 {
  font-size: 14px;
  margin-bottom: 20px;
}

.single_container ul {
  margin-left: 20px;
  list-style: disc;
}

.single_container ol {
  margin-left: 20px;
  list-style: decimal;
}

.single_container ul li,
.single_container ol li {
  margin-bottom: 10px;
}

.single_container blockquote {
  font-style: italic;
  border-left: 4px solid #ccc;
  padding-left: 10px;
}

.single_container strong {
  font-weight: bold;
}

.single_container em {
  font-style: italic;
}

.single_container img {
  max-width: 100%;
  height: auto;
  margin-bottom: 20px;
}

.single_container p {
  margin-bottom: 20px;
  line-height: 1.6;
}

.single_container .text-left {
  text-align: left;
}

.single_container .text-center {
  text-align: center;
}

.single_container .text-right {
  text-align: right;
}

.single_container .aligncenter {
  display: block;
  margin: 0 auto;
}

.single_container .alignleft {
  float: left;
  margin-right: 20px;
}

.single_container .alignright {
  float: right;
  margin-left: 20px;
}

.single_container a {
  color: blue;
  text-decoration: none;
  border-bottom: 1px solid blue;
}

.single_container a:hover {
  color: #000;
  border-bottom: 1px solid #000;
}

.single_container del {
  text-decoration: line-through;
}
.single_page_bottom .common_btn01 {
    margin: auto;
    margin-top: 80px;
}

@media ((max-width: 480px)) {
  .modal-content .common_btn01 {
    min-width: 100%;
  }
}