@charset "UTF-8";
/* CSS Document */


/* ////////////////////////////////////////////////////////////////////////////////

	Common

//////////////////////////////////////////////////////////////////////////////// */

@font-face {
  font-family: 'sns_ico';
  src:
    url('../fonts/sns_ico.ttf?z7sza2') format('truetype'),
    url('../fonts/sns_ico.woff?z7sza2') format('woff'),
    url('../fonts/sns_ico.svg?z7sza2#sns_ico') format('svg');
  font-weight: normal;
  font-style: normal;
}

i.snsIcon {
  font-family: 'sns_ico' !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;

	color: #000;
}

.icon-search:before { content: "\e908";}
.icon-arrow1_left:before { content: "\e90c";}
.icon-arrow1_bottom:before { content: "\e90d";}
.icon-arrow1_right:before { content: "\e90e";}
.icon-arrow1_top:before { content: "\e90f";}
.icon-arrow2_left:before { content: "\e910";}
.icon-arrow2_bottom:before { content: "\e911";}
.icon-arrow2_right:before { content: "\e912";}
.icon-arrow2_top:before { content: "\e913";}
.icon-link:before { content: "\e914";}
.icon-note:before { content: "\e915";}
.icon-ap:before { content: "\e900";}
.icon-blo:before { content: "\e901";}
.icon-fb:before { content: "\e902";}
.icon-hp:before { content: "\e903";}
.icon-in:before { content: "\e904";}
.icon-line:before { content: "\e905";}
.icon-spo:before { content: "\e906";}
.icon-tt:before { content: "\e907";}
.icon-yt:before { content: "\e909";}
.icon-x:before { content: "\e90a";}
.icon-wb:before { content: "\e90b";}
.icon-arrow3_top:before { content: "\ea3a";}
.icon-arrow3_right:before { content: "\ea3c";}
.icon-arrow3_bottom:before { content: "\ea3e";}
.icon-arrow3_left:before { content: "\ea40";}


html {
	scroll-behavior: smooth;
}
body {
  font-family: "IBM Plex Sans JP", sans-serif;
	font-size: min(3.2vw, 14px);
	line-height: 1.8;
	-webkit-text-size-adjust: 100%;
  background-color: #fff;
}

img {
	max-width: 100%;
	height: auto;
}
ul { list-style: none;}

.anim {
	opacity: 0;
	transition: all .6s ease-out;
}
.anim.on {
	opacity: 1;
}

a {
  color: #000;
}

@media screen and (min-width: 821px) {

	.sp { display: none !important;}

	a { transition: all 0.3s ease-out;}
	a:hover { opacity: 0.5;}

}
@media screen and (max-width: 820px) {

	.pc { display: none !important;}

}


/* ////////////////////////////////////////////////////////////////////////////////

	Header

//////////////////////////////////////////////////////////////////////////////// */
header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: min(3vw, 15px) min(3vw, 20px) min(3vw, 15px) min(3vw, 20px);
  background-color: #ededed;
  position: sticky;
  top: 0;
  left: 0;
  width: 100vw;
  z-index: 1000;
}
header .hdrBlock {
  display: flex;
  align-items: center;
  gap: min(6vw, 40px);
}

header h1 {
  width: min(30vw, 200px);
  line-height: 0;
}

header .hdrNavWrap {
  display: flex;
  align-items: center;
  gap: min(3vw, 25px);
}

header .hdrNavWrap .hdrNav {
  display: flex;
  gap: min(5vw, 25px);
}
header .hdrNavWrap .hdrNav a {
  text-decoration: none;
  font-weight: bold;
  display: flex;
  align-items: center;
  gap: min(2vw, 10px);
}
header .hdrNavWrap .hdrNav .forFirstTime a {
  color: #005744;
}
header .hdrNavWrap .hdrNav a span {
  display: block;
  width: 2em;
  height: 2em;
  aspect-ratio: 1/1;
}

header .hdrNavWrap .hdrNav li:nth-child(1) a span {
  width: 1.6em;
  background: url("../images/navi_ico01.png") no-repeat center center / contain;
}
header .hdrNavWrap .hdrNav li:nth-child(2) a span {
  background: url("../images/navi_ico02.png") no-repeat center center / contain;
}
header .hdrNavWrap .hdrNav li:nth-child(3) a span {
  width: 2.2em;
  background: url("../images/navi_ico03.png") no-repeat center center / contain;
}
header .hdrNavWrap .hdrNav li:nth-child(4) a span {
  width: 2.5em;
  background: url("../images/navi_ico04.png") no-repeat center center / contain;
}
header .hdrNavWrap .hdrNav li:nth-child(5) a span {
  background: url("../images/navi_ico05.png") no-repeat center center / contain;
}
header .hdrNavWrap .hdrNav li:nth-child(6) a span {
  width: 1.6em;
  background: url("../images/navi_ico06.png") no-repeat center center / contain;
}


header .hdrNavWrap .hdrTel {
  text-align: center;
}
header .hdrNavWrap .hdrTel p {
  font-size: min(2vw, 12px);
  font-weight: 600;
  line-height: 1.4;
}
header .hdrNavWrap .hdrTel .telNum {
  font-family: "Roboto", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  color: #005744;
  font-size: min(4.6vw, 28px);
  line-height: 1.2;
}
header .hdrNavWrap .hdrTel .telNum a {
  text-decoration: none;
  color: #005744;
}

header .hdrNavWrap .hdrBnr {
  line-height: 0;
  width: min(20vw, 120px);
}

header .hdrBtn {
  display: flex;
  align-content: center;
  gap: min(2vw, 10px);
}
header .hdrBtn a {
  display: block;
  text-decoration: none;
  width: 140px;
  text-align: center;
  padding: min(1vw, 4px) min(2vw, 10px) min(0.7vw, 3px);
  border-radius: min(1vw, 5px);
  font-weight: bold;
}
header .hdrBtn .appraisalBtn a {
  background-color: #cf102b;
  border: #cf102b solid 2px;
  color: #fff;
}
header .hdrBtn .contactBtn a {
  background-color: #fff;
  text-align: center;
  border: #000 solid 2px;
}

@media screen and (max-width: 820px) {

  header .hdrNavWrap .hdrNav {
    display: none;
  }

}


#globalNavi {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 1000;
  background-color: rgba(0,0,0,0.60);

  display: none;
}
#globalNavi .globalNaviMain {
  position: absolute;
  top: 0;
  right: 0;
  width: 1140px;
  max-width: calc(100% - 40px);
  background-color: #ededed;
  border-radius: min(4vw, 20px) 0 0 min(4vw, 20px);
  padding: min(4vw, 20px) min(10vw, 80px) min(8vw, 60px) min(8vw, 60px);
}
#globalNavi .menuLogo {
  width: 180px;
  line-height: 0;
  margin-bottom: min(6vw, 40px);
}

#globalNavi .hdrNav {
  display: flex;
  justify-content: space-around;
  gap: min(5vw, 25px);
  padding-bottom: min(4vw, 20px);
  border-bottom: #aeaeae solid 1px;
}
#globalNavi .hdrNav a {
  text-decoration: none;
  font-weight: bold;
  display: flex;
  align-items: center;
  gap: min(2vw, 10px);
  font-size: min(3.8vw, 16px);
}
#globalNavi .hdrNav .forFirstTime a {
  color: #005744;
}
#globalNavi .hdrNav a span {
  display: block;
  width: 2em;
  height: 2em;
  aspect-ratio: 1/1;
}

#globalNavi .hdrNav li:nth-child(1) a span {
  width: 1.6em;
  background: url("../images/navi_ico01.png") no-repeat center center / contain;
}
#globalNavi .hdrNav li:nth-child(2) a span {
  background: url("../images/navi_ico02.png") no-repeat center center / contain;
}
#globalNavi .hdrNav li:nth-child(3) a span {
  width: 2.2em;
  background: url("../images/navi_ico03.png") no-repeat center center / contain;
}
#globalNavi .hdrNav li:nth-child(4) a span {
  width: 2.5em;
  background: url("../images/navi_ico04.png") no-repeat center center / contain;
}
#globalNavi .hdrNav li:nth-child(5) a span {
  background: url("../images/navi_ico05.png") no-repeat center center / contain;
}
#globalNavi .hdrNav li:nth-child(6) a span {
  width: 1.6em;
  background: url("../images/navi_ico06.png") no-repeat center center / contain;
}

#globalNavi .subMenu {
  display: flex;
  justify-content: space-around;
  align-items: center;
  padding: min(4vw, 20px) 0;
}
#globalNavi .subMenu li a {
  font-size: min(3.2vw, 14px);
  font-weight: bold;
  text-decoration: none;
}
#globalNavi .subMenu li.contact a {
  color: #005744;
  border: #005744 solid 1px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: min(2vw, 10px);
  padding: min(1.3vw, 6px) min(6vw, 30px) min(1vw, 5px) min(6vw, 30px);
  border-radius: 100px;
}
#globalNavi .subMenu li.contact a::before {
  content: "";
  display: block;
  width: 1.3em;
  aspect-ratio: 40/37;
  background: url("../images/ico_mail.png") no-repeat center center / contain;
}
#globalNavi .menuFlex {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
}
#globalNavi #shopSearch {
  padding: 0;
  width: 49%;
}
#globalNavi #shopSearch h3 {
  margin-bottom: min(3vw, 15px);
  font-size: min(3.8vw, 20px);
}
#globalNavi #shopSearch .topShopSearchInr {
  height: 100%;
}
#globalNavi #shopSearch .searchForm {
  margin-bottom: 0;
}
#globalNavi #shopSearch .searchForm .searchInput input[type="text"] {
  font-size: 16px;
}
#globalNavi .bnrAppraisal {
  padding: 0;
  width: 49%;
  line-height: 0;
  position: relative;
}
#globalNavi .bnrAppraisal ul {
  position: absolute;
  bottom: min(4vw, 20px);
  left: 0;
  width: 100%;
  display: flex;
  padding: 0 min(4vw, 20px);
  gap: 0 min(2vw, 10px);
}


#menuButton {
  display: block;
  width: min(14vw, 80px);
  aspect-ratio: 165/143;
  position: fixed;
  top: 0;
  right: 0;
  z-index: 9999;
  background: url("../images/menu_btn_bg.png") no-repeat right top / contain;
}
#menuButton.active {
  background: url("../images/menu_btn_bg_open.png") no-repeat right top / contain;
}
#menuButton span {
  display: block;
  background: #005744;
  width: 50%;
  height: 3px;
  position: absolute;
  top: 42%;
  left: 56%;
  transition: all 0.4s;
}
#menuButton.active span {
  background: #ffe512;
}
#menuButton span:nth-child(1) { transform: translate(-50%, -350%) rotate(0deg);}
#menuButton span:nth-child(2) { transform: translate(-50%, 250%) rotate(0deg);}
#menuButton span:nth-child(3) { transform: translate(-50%, -50%);}
#menuButton.active span:nth-child(1) { transform: translate(-50%, -50%) rotate(45deg);}
#menuButton.active span:nth-child(2) { transform: translate(-50%, -50%) rotate(-45deg);}
#menuButton.active span:nth-child(3) { opacity: 0;}

#menuButton:hover {
  opacity: 1;
}


@media screen and (max-width: 820px) {

  #globalNavi .menuLogo {
    padding: min(5vw, 25px) min(4vw, 20px);
    margin-bottom: 0;
    width: min(40vw, 180px);
  }
  #globalNavi .globalNaviMain {
    border-radius: 0;
    width: 100%;
    max-width: 100%;
    height: 100%;
    padding: 0;
  }

  #globalNavi .hdrNav {
    gap: 0;
    flex-direction: column;
    padding-bottom: 0;
  }
  #globalNavi .hdrNav li {
    width: 100%;
    border-top: #aeaeae solid 1px;
  }

  #globalNavi .hdrNav li.forFirstTime {
    border: none;
    position: absolute;
    top: min(6.4vw, 60px);
    right: min(14vw, 100px);
    width: fit-content;
    padding: 0;
  }
  #globalNavi .hdrNav li.forFirstTime a {
    padding: 0;
  }

  #globalNavi .hdrNav a {
    padding: min(3vw, 15px) min(4vw, 20px);
  }
  #globalNavi .hdrNav a span {
    display: block;
    width: 2em;
    height: 2em;
    aspect-ratio: 1/1;
  }

  #globalNavi .hdrNav li:nth-child(1) a span {
    width: 2.5em;
  }
  #globalNavi .hdrNav li:nth-child(2) a span {
    width: 2.5em;
  }
  #globalNavi .hdrNav li:nth-child(3) a span {
    width: 2.5em;
  }
  #globalNavi .hdrNav li:nth-child(4) a span {
    width: 2.5em;
  }
  #globalNavi .hdrNav li:nth-child(5) a span {
    width: 2.5em;
  }
  #globalNavi .hdrNav li:nth-child(6) a span {
    width: 2.5em;
  }

  #globalNavi .subMenu li.contact {
    padding: min(4vw, 20px);
    width: 100%;
    border: none;
  }
  #globalNavi .subMenu li.contact a {
    width: 80%;
    margin: 0 auto;
    font-size: min(3.8vw, 20px);
  }

  #globalNavi .subMenu {
    padding: 0;
    flex-wrap: wrap;
    gap: 0;
  }
  #globalNavi .subMenu li {
    width: 50%;
    border-bottom: #aeaeae solid 1px;
  }
  #globalNavi .subMenu li:nth-child(even) {
    border-left: #aeaeae solid 1px;
  }
  #globalNavi .subMenu li a {
    display: block;
    text-align: center;
    padding: min(3vw, 15px);
  }

  #globalNavi .menuFlex {
    display: none;
  }

  #globalNavi .spBtn {
    display: flex;
    align-items: flex-end;
  }
  #globalNavi .spBtn li {
    width: 50%;
    line-height: 0;
  }

}


/* ////////////////////////////////////////////////////////////////////////////////

	Footer

//////////////////////////////////////////////////////////////////////////////// */
footer {
  padding: min(7vw, 50px) min(6vw, 60px);
  width: 100vw;
  background: url("../images/yellow_bg.gif") repeat center center;
  color: #005744;
}
footer .contentWrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
footer .ftrBlock {
  width: fit-content;
}
footer .ftrBlock p {
  font-weight: bold;
  font-size: min(3vw, 12px);
}

footer .ftrBnr {
  width: min(74vw, 360px);
  line-height: 0;
}
footer .ftrBnr a {
  display: block;
  border-radius: min(2vw, 10px);
  overflow: hidden;
}
footer .ftrAddress {
  font-size: min(3vw, 12px);
}



@media screen and (max-width: 820px) {

  footer {
    padding-right: 0;
    padding-left: 0;
  }
  footer .contentWrap {
    flex-direction: column;
    gap: min(6vw, 30px);
  }

  footer .ftrBlock {
    flex-direction: column;
  }

}


/* ////////////////////////////////////////////////////////////////////////////////

	Common

//////////////////////////////////////////////////////////////////////////////// */

main {

}

.contentWrap {
  max-width: 1000px;
  margin: 0 auto;
  padding: 0 min(6vw, 60px);
}

.basicBtn {
  margin-top: min(7vw, 40px);
}
.basicBtn a {
  display: block;
  text-align: center;
  text-decoration: none;
  border: #0e5945 solid 2px;
  border-radius: 100px;
  color: #0e5945;
  font-size: min(3.6vw, 16px);
  font-weight: bold;
  padding: min(2.2vw, 7px) min(2vw, 10px) min(2vw, 5px);
  max-width: 260px;
  margin: 0 auto;
}


@media screen and (max-width: 820px) {

  main {

  }

}


/* ////////////////////////////////////////////////////////////////////////////////

	Index

//////////////////////////////////////////////////////////////////////////////// */
#mainVisual {
  background: url("../images/mv_bg.gif") repeat center center / 70px;
  padding: min(10vw, 50px) min(3vw, 60px) min(6vw, 60px);
}
#mainVisual .mvTtl {
  max-width: 1080px;
  margin: 0 auto;
  line-height: 0;
  display: flex;
  align-items: center;
}
#mainVisual .mvTtl .mvSlide {
  width: 34%;
  aspect-ratio: 743/819;
  overflow: hidden;
}
#mainVisual .mvTtl .mvSlide li {
  line-height: 0;
}
#mainVisual .mvTtl .mvTtlTxt {
  width: 66%;
}

@media screen and (min-width: 821px) {

  #mainVisual .mvTtl .spBaloon {
    display: none;
  }

}
@media screen and (max-width: 820px) {

  #mainVisual .mvTtl {
    flex-direction: column;
    position: relative;
  }
  #mainVisual .mvTtl .spBaloon {
    position: absolute;
    top: -6vw;
    left: 4vw;
    line-height: 0;
    width: 32vw;
  }
  #mainVisual .mvTtl .mvSlide {
    width: 70%;
    padding-left: 3%;
  }
  #mainVisual .mvTtl .mvTtlTxt {
    width: 96%;
  }

}


#fc01 {
  padding: min(10vw, 80px) 0;
}
.pointList {
  display: flex;
  justify-content: space-between;
  margin-bottom: min(8vw, 60px);
}
.pointList li {
  width: 23.5%;
  background-color: #f0f0f0;
  border-radius: min(2vw, 10px);
  text-align: center;
  padding: min(6vw, 30px) min(2vw, 15px) min(3vw, 15px);
  color: #005744;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.pointList li .baloon {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, -50%);
  width: fit-content;
  background-color: #fae257;
  white-space: nowrap;
  border: #005744 solid 2px;
  border-radius: 100px;
  font-size: min(3vw, 12px);
  font-weight: bold;
  padding: min(0.5vw, 3px) min(4vw, 20px) 0;
}
.pointList li .baloon::after {
  content: "";
  display: block;
  position: absolute;
  top: 100%;
  left: 30%;
  width: min(2.8vw, 13px);
  background: url("../images/point_arrow.png") no-repeat center center / contain;
  aspect-ratio: 26/21;
}

.pointList li .pointMain {
  font-size: min(3.8vw, 18px);
  font-weight: bold;
  line-height: 1.6;
}
.pointList li .pointMain span {
  display: block;
  font-size: 0.7em;
}


@media screen and (max-width: 820px) {

  .pointList {
    gap: min(7vw, 40px) 0;
    justify-content: space-between;
    flex-wrap: wrap;
  }
  .pointList li {
    width: 48%;
  }

}


#fc02 {
  background: url("../images/bg_check.gif") repeat center center / 20px;
}
#fc02 .contentWrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.graphBoard {
  width: 20%;
  transform: scale(1.12);
  transform-origin: left bottom;
  line-height: 0;
}

.graphTxt {
  width: 75%;
  text-align: center;
}
.graphTxt h3 {
  font-size: min(7.4vw, 36px);
  font-weight: bold;
  color: #005744;
  line-height: 1;
  margin-bottom: min(4vw, 20px);
}
.graphTxt h3 .txt01 {
  background-color: #fff;
  display: inline-block;
  border-radius: min(2vw, 10px);
  padding: min(2vw, 10px) min(2vw, 10px) min(1vw, 5px);
  margin-right: 0.3em;
}
.graphTxt h3 .txt02 {
  color: #fff;
  background-color: #005744;
  display: inline-block;
  border-radius: min(2vw, 10px);
  padding: min(2vw, 10px) min(2vw, 10px) min(1vw, 5px);
  margin-left: 0.3em;
}
.graphTxt p {
  font-size: min(3.2vw, 16px);
  font-weight: bold;
}

.graphTxt .yellowBg {
  color: #005744;
  background-color: #fae257;
  border-radius: 100px;
  margin-top: min(3vw, 15px);
}


@media screen and (max-width: 820px) {


  #fc02 .contentWrap {
    position: relative;
  }
  .graphBoard {
    width: 25%;
    position: absolute;
    bottom: 0;
    left: min(6vw, 60px);
    transform: scale(1);
  }
  .graphTxt {
    width: 100%;
    padding: min(4vw, 20px) 0;
  }
  .graphTxt .graphTxtBody {
    width: 72%;
    margin-left: auto;
  }
  .graphTxt p {
    line-height: 1.5;
  }
  .graphTxt .yellowBg {
    padding: min(1.6vw, 10px) min(4vw, 20px);
    line-height: 1.4;
    border-radius: min(2vw, 8px);
    width: fit-content;
    margin: min(3vw, 15px) auto 0;
    position: relative;
  }
  .graphTxt .yellowBg::after {
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-right: 5px solid transparent;
    border-left: 5px solid transparent;
    border-bottom: 6px solid #fae257;
    border-top: 0;
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%);
  }


}


#fc03 {
  padding: min(10vw, 80px) 0;
}
#fc03 .contentWrap {
  position: relative;
}

.redWrap {
  position: relative;
  z-index: 1;
  width: 86%;
}
.redWrap .redTxt {
  font-size: min(3.6vw, 16px);
  font-weight: bold;
  line-height: 1.6;
}
.redWrap .redTxt::before {
  content: "";
  display: inline-block;
  width: 2em;
  background: url("../images/ico_graph.png") no-repeat center center / contain;
  aspect-ratio: 77/75;
  vertical-align: sub;
  margin-right: 0.4em;
}
.redWrap .redTxt span {
  color: #cf102b;
  font-size: 1.8em;
}
.redWrap h3 {
  font-size: min(4.6vw, 38px);
  font-weight: bold;
  line-height: 1.4;
  margin-bottom: min(2vw, 10px);
}
.redWrap p {
  font-size: min(2.9vw, 11px);
}

.coinPic {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 0;
  line-height: 0;
  width: 25%;
}


@media screen and (max-width: 820px) {

  .redWrap {
    width: 100%;
  }
  .redWrap .redTxt {
    margin-bottom: min(1vw, 5px);
    text-align: center;
  }
  .redWrap .redTxt::before {
    width: 1.7em;
  }
  .redWrap .redTxt span {
    font-size: 1.3em;
  }
  .redWrap h3 {
    margin-bottom: min(4vw, 20px);
    text-align: center;
  }
  .redWrap p {
    line-height: 1.6;
  }

  .coinPic {
    width: 56%;
    top: 66%;
    right: 50%;
    transform: translate(50%, -50%);
  }

}


#fc04 {
  padding: min(10vw, 80px) 0;
}
.featuresHead {
}
.featuresHead .baloon {
  width: fit-content;
  margin: 0 auto min(4vw, 20px);
  color: #005744;
  border: #005744 solid 3px;
  padding: min(1vw, 5px) min(6vw, 30px) min(0.5vw, 3px);
  font-size: min(4vw, 18px);
  font-weight: bold;
  border-radius: 100px;
  position: relative;
}
.featuresHead .baloon::after {
  content: "";
  display: block;
  position: absolute;
  top: 100%;
  left: 30%;
  width: min(4.2vw, 26px);
  background: url("../images/features_arrow.png") no-repeat center center / contain;
  aspect-ratio: 52/38;
}
.featuresHead h3 {
  text-align: center;
  color: #005744;
  font-size: min(4.2vw, 38px);
  line-height: 1.4;
  border-bottom: #e5eeec solid 10px;
  margin-bottom: min(6vw, 30px);
}
.featuresHead h3 span {
  font-size: 1.8em;
  font-weight: 900;
}
.featuresHead h3 .logo {
  display: inline-block;
  width: min(26vw, 280px);
  line-height: 0;
  vertical-align: sub;
  margin-right: min(4vw, 20px);
}

.featuresList {
  padding: 0 min(4vw, 20px);
  margin-bottom: min(8vw, 60px);
}
.featuresList ul li {
  border-bottom: #e5eeec solid 5px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding: min(4vw, 20px) 0;
}
.featuresList ul li .img {
  width: 30%;
  line-height: 0;
  border-radius: min(2vw, 10px);
  overflow: hidden;
}
.featuresList ul li .txt {
  width: 65%;
}
.featuresList ul li .txt h4 {
  font-size: min(5.6vw, 34px);
  font-weight: bold;
  color: #005744;
}
.featuresList ul li .txt h4 span {
  font-family: "Roboto", sans-serif;
  font-optical-sizing: auto;
  font-weight: 900;
  font-size: 1.6em;
  line-height: 1;
  margin-right: 0.2em;
}

.featuresList ul li .txt .sup {
  display: flex;
  align-items: center;
  margin-top: min(4vw, 20px);
  justify-content: space-between;
}
.featuresList ul li .txt .sup p {
  line-height: 1.4;
}
.featuresList ul li .txt .sup .supPoint {
  color: #005744;
  font-weight: 600;
  text-align: center;
  line-height: 1.6;
  padding: min(4vw, 20px) 0 min(4vw, 20px) min(6vw, 30px);
  background: url("../images/sup_line.png") no-repeat left center / 10px;
}


@media screen and (max-width: 820px) {

  .featuresHead h3 {
    position: relative;
    padding-bottom: 0;
    border: none;
    line-height: 1.2;
    margin-bottom: min(1vw, 5px);
  }
  .featuresHead h3 .logo {
    position: absolute;
    top: 0;
    left: 0;
    width: min(34vw, 300px);
  }
  .featuresHead h3 span {
    font-size: 1.6em;
  }
  .featuresHead h3 strong {
    font-size: min(10vw, 38px);
    font-weight: 900;
    margin-left: min(3vw, 15px);
  }
  .featuresHead .baloon {
    line-height: 1.6;
    padding: min(2vw, 10px) min(8vw, 30px) min(1.5vw, 8px);
  }

  .featuresList {
    padding: 0;
  }
  .featuresList ul li {
    gap: min(4vw, 20px);
    flex-direction: column;
  }
  .featuresList ul li .img {
    width: 100%;
  }
  .featuresList ul li .txt {
    width: 100%;
  }
  .featuresList ul li .txt h4 {
    text-align: center;
    font-size: 1.2em;
  }

  .featuresList ul li .txt .sup {
    flex-direction: column;
    align-items: center;
  }
  .featuresList ul li .txt .sup p {
    text-align: center;
  }

  .featuresList ul li .txt .sup .supPoint {
    color: #005744;
    font-weight: 600;
    text-align: center;
    line-height: 1.6;
    padding: min(4vw, 20px) 0 0;
    background: url(../images/sup_line_sp.png) no-repeat center top / 100%;
    margin-top: min(4vw, 20px);
    font-size: min(4vw, 20px);
  }

}

#fc05 {
  padding: 0;
}
.plan {
  background-color: #005744;
  padding: min(6vw, 30px) min(6vw, 60px);
}
.plan .planContent {
  width: fit-content;
  margin: 0 auto;
}
.plan .planContent h4 {
  color: #fff;
  font-size: min(5.2vw, 26px);
  text-align: center;
  margin-bottom: min(1vw, 5px);
}
.plan .planContent h4::before {
  content: "";
  display: inline-block;
  background: url("../images/ico_plan.png") no-repeat center center / contain;
  width: 1.6em;
  aspect-ratio: 109/87;
  vertical-align: sub;
  margin-right: 0.4em;
}

.plan .planList {
  background-color: #fff;
  padding: min(1vw, 5px) min(6vw, 30px);
  position: relative;
}
.plan .planList::after {
  content: "";
  display: block;
  width: 0;
  height: 0;
  border-style: solid;
  border-right: 10px solid transparent;
  border-left: 10px solid transparent;
  border-top: 12px solid #ffffff;
  border-bottom: 0;
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
}
.plan .planList h5 {
  text-align: center;
  color: #005744;
  font-size: min(3.6vw, 18px);
  border-bottom: #005744 solid 2px;
}
.plan .planList ul li {
  padding: min(2vw, 10px) 0;
  border-bottom: #005744 dotted 1px;
  text-align: center;
  font-size: min(3.4vw, 16px);
  font-weight: bold;
  line-height: 1.6;
  color: #005744;
}
.plan .planList ul li:last-child {
  border-bottom: none;
}
.plan .planList ul li span {
  font-size: 0.8em;
}


.model {
  background: #fae257 url("../images/yellow_bg.gif") repeat center center;
  padding: min(6vw, 30px) min(6vw, 60px);
}
.model .contentWrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.model .modelEx {
  width: 40%;
}
.model .modelEx h4 {
  color: #005744;
  font-size: min(4.2vw, 24px);
  margin-bottom: min(1vw, 5px);
}
.model .modelEx h4::before {
  content: "";
  display: inline-block;
  background: url("../images/ico_model.png") no-repeat center center / contain;
  width: 1.2em;
  aspect-ratio: 1/1;
  vertical-align: sub;
  margin-right: 0.4em;
}
.model .modelEx ul {
  background-color: #fff;
}
.model .modelEx ul li {
  border-bottom: #000 dotted 1px;
  display: flex;
  justify-content: space-between;
  padding: min(1vw, 5px) min(2vw, 10px);
  font-weight: bold;
}
.model .modelEx ul li:last-child {
  border-bottom: none;
}
.model .modelEx ul li.listHead {
  color: #005744;
}
.model .modelEx ul li.total {
  color: #fff;
  background-color: #005744;
}
.model .modelPic {
  width: 56%;
}


@media screen and (max-width: 820px) {

  .model {
    padding: min(6vw, 30px) 0;
  }
  .model .contentWrap {
    flex-direction: column;
    gap: min(6vw, 30px);
  }
  .model .modelEx {
    width: 100%;
  }
  .model .modelPic {
    width: 100%;
  }

}


#fc06 {
  padding: min(10vw, 80px) 0;
}
#fc06 h3 {
  text-align: center;
  color: #005744;
  font-size: min(6vw, 36px);
  line-height: 1.4;
  margin-bottom: min(6vw, 30px);
}
#fc06 h3::before {
  content: "";
  display: inline-block;
  background: url("../images/ico_check.png") no-repeat center center / contain;
  width: 1.2em;
  aspect-ratio: 71/69;
  vertical-align: sub;
  margin-right: 0.4em;
}

.flow li {
  display: flex;
  justify-content: space-between;
  margin-bottom: min(6vw, 30px);
}
.flow li .num {
  width: 10%;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: min(4vw, 20px);
  color: #fff;
  font-size: min(8vw, 56px);
  font-weight: 900;
  position: relative;
  font-family: "Roboto", sans-serif;
  font-optical-sizing: auto;
}
.flow li:nth-child(1) .num { background-color: #73a398;}
.flow li:nth-child(2) .num { background-color: #4c897c;}
.flow li:nth-child(3) .num { background-color: #267060;}
.flow li:nth-child(4) .num { background-color: #005744;}

.flow li .num::after {
  content: "";
  display: block;
  width: 0;
  height: 0;
  border-style: solid;
  border-right: 10px solid transparent;
  border-left: 10px solid transparent;
  border-bottom: 0;
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
}
.flow li:nth-child(1) .num::after { border-top: 12px solid #73a398;}
.flow li:nth-child(2) .num::after { border-top: 12px solid #4c897c;}
.flow li:nth-child(3) .num::after { border-top: 12px solid #267060;}
.flow li:nth-child(4) .num::after { display: none;}

.flow li .flowTxt {
  width: 88%;
  background-color: #e5eeec;
  border-radius: min(4vw, 20px);
  padding: min(4vw, 20px);
}
.flow li:nth-child(4) .flowTxt {
  background-color: #fae257;
  color: #005744;
  font-weight: bold;
}
.flow li .flowTxt h4 {
  color: #005744;
  font-size: min(4.8vw, 30px);
  line-height: 1.4;
}

@media screen and (max-width: 820px) {

  .flow li .num {
    width: 14%;
  }
  .flow li .flowTxt {
    width: 83%;
  }
}


#fc07 {
  padding: min(6vw, 30px) 0;
  background-color: #fae7ea;
}
#fc07 h3 {
  color: #cf102b;
  text-align: center;
  font-size: min(5.6vw, 28px);
  line-height: 1.4;
  margin-bottom: min(4vw, 20px);
}

.faqList dt {
  border: #cf102b solid 3px;
  position: relative;
  border-radius: 100px;
  padding: min(1.2vw, 7px) min(4vw, 20px) min(1vw, 5px);
  color: #cf102b;
  font-size: min(3.4vw, 16px);
  font-weight: bold;
  margin-bottom: min(4vw, 20px);
}
.faqList dt::after {
  content: "";
  display: block;
  position: absolute;
  top: 100%;
  left: min(6vw, 80px);
  width: min(4.2vw, 16px);
  background: url(../images/faq_arrow.png) no-repeat center center / contain;
  aspect-ratio: 32 / 23;
}
.faqList dd {
  background-color: #fff;
  margin-bottom: min(6vw, 30px);
  padding: min(3vw, 15px) min(4vw, 20px);
  border-radius: min(2vw, 10px);
}



#fc08 {
  padding: min(8vw, 60px) 0;
}
.telBnr {
  line-height: 0;
}

#fc09 {
  background-color: #e5eeec;
  padding: min(6vw, 30px) 0;
}

#fc09 h3 {
  text-align: center;
  color: #005744;
  font-size: min(4.2vw, 32px);
  margin-bottom: min(4vw, 20px);
}

.voiceList {
  display: flex;
  justify-content: space-between;
}
.voiceList li {
  width: 32%;
}
.voiceList li .voicePic {
  line-height: 0;
  border-radius: min(2vw, 10px);
  overflow: hidden;
  margin-bottom: min(3vw, 15px);
}
.voiceList li .voiceTxt h4 {
  text-align: center;
  color: #005744;
  padding-bottom: min(1vw, 5px);
  border-bottom: #005744 dotted 1px;
  margin-bottom: min(3vw, 15px);
  font-size: min(4vw, 18px);
  line-height: 1.6;
}
.voiceList li .voiceTxt h4 span {
  font-size: 0.8em;
  display: block;
}
.voiceList li .voiceTxt p {
  text-align: center;
  font-weight: 600;
  font-size: min(3vw, 14px);
}


@media screen and (max-width: 820px) {

  .voiceList {
    flex-direction: column;
    gap: min(4vw, 20px);
  }
  .voiceList li {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
  }
  .voiceList li .voicePic {
    width: 39%;
  }
  .voiceList li .voiceTxt {
    width: 57%;
  }
  .voiceList li .voiceTxt p {
    line-height: 1.4;
  }

}


#fc10 {
  background-color: #005744;
  color: #fff;
  position: relative;
  padding: min(8vw, 60px) 0;
}
#fc10::before {
  content: "";
  display: block;
  background: url("../images/contact_wave.png") no-repeat center bottom / 100%;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: min(20vw, 180px);
  z-index: 0;
}

#fc10 .contentWrap {
  position: relative;
  z-index: 1;
}
#fc10 h3 {
  font-size: min(7.2vw, 34px);
  font-weight: bold;
  letter-spacing: 0.04em;
}

.contactIco {
  width: min(34vw, 280px);
  line-height: 0;
  margin-bottom: min(4vw, 20px);
}

.contactTitel {
  font-size: min(3.6vw, 18px);
  font-weight: 600;
}
.contactTitel + p {
  margin-top: 0.5em;
  font-size: min(3.2vw, 15px);
}

.mail {
  margin-top: min(6vw, 30px);
}
.mailWrap {
  border: #fff solid 2px;
  border-radius: min(2vw, 10px);
  padding: min(6vw, 30px);
  margin-bottom: min(8vw, 60px);
}
.mailWrap .formBox {
  display: flex;
  margin-bottom: min(4vw, 20px);
  font-size: 16px;
}
.mailWrap .formBox .formLeft {
  width: 200px;
}
.mailWrap .formBox .formLeft .required {
  background-color: #fae257;
  color: #005744;
  font-weight: 600;
  font-size: 0.8em;
  margin-left: 1em;
  padding: min(0.2vw, 1px) min(3vw, 15px) 0;
  border-radius: 100px;
}
.mailWrap .formBox .formRight,
.mailWrap .formBox .formRight2 {
  width: calc(100% - 200px);
}
.mailWrap .formBox .formSelect {
  width: fit-content;
  position: relative;
}
.mailWrap .formBox .formSelect::after {
  content: "";
  display: block;
  width: min(2vw, 12px);
  aspect-ratio: 1/1;
  border-right: #005744 solid 3px;
  border-bottom: #005744 solid 3px;
  transform: translateY(-50%) rotate(45deg);
  position: absolute;
  top: 42%;
  right: min(3vw, 15px);
}

.mailWrap .formBox input[type="text"],
.mailWrap .formBox input[type="email"],
.mailWrap .formBox textarea {
  background-color: #ccddda;
  color: #005744;
  border-radius: min(1vw, 5px);
  padding: min(1vw, 5px) min(3vw, 15px);
  width: 100%;
}
.mailWrap .formBox textarea {
  height: 180px;
}
.mailWrap .formBox select {
  background-color: #ccddda;
  border-radius: min(1vw, 5px);
  padding: min(1vw, 5px) min(3vw, 15px);
  color: #005744;
  font-weight: 600;
  padding-right: min(7vw, 40px);
}

.mailWrap .formBox .radio {
  position: relative;
  padding-left: 2.2em;
  display: block;
  margin-bottom: min(1vw, 5px);
}
.mailWrap .formBox .radio::before,
.mailWrap .formBox .radio::after {
  content: "";
  display: block;
  width: 1.6em;
  aspect-ratio: 1/1;
  position: absolute;
  top: 0;
  left: 0;
  border-radius: 50%;
}
.mailWrap .formBox .radio::before {
  background-color: #ccddda;
}
.mailWrap .formBox .radio::after {
  background-color: #005744;
  transform: scale(0.6);
  opacity: 0;
}
.mailWrap .formBox input[type="radio"]:checked + label.radio::after {
  opacity: 1;
}
.mailWrap .formBox input[type="radio"] {
  display: none;
}

.policyText {
  text-align: center;
  font-size: min(4vw, 20px);
  font-weight: bold;
  margin-bottom: min(4vw, 20px);
}
.policyMail {
  border: #fff solid 1px;
  padding: min(4vw, 20px);
  margin-bottom: min(6vw, 30px);
}

.policygo {
  text-align: center;
  font-size: min(3.6vw, 18px);
  font-weight: 600;
}

.mail .policygo input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.mail .policygo .check {
  position: relative;
  padding-left: 2.2em;
  display: block;
  width: fit-content;
  margin: 0 auto;
}
.mail .policygo .check::before,
.mail .policygo .check::after {
  content: "";
  display: block;
  width: 1.6em;
  aspect-ratio: 1/1;
  position: absolute;
  top: 0;
  left: 0;
  border-radius: 50%;
}
.mail .policygo .check::before {
  background-color: #ccddda;
}
.mail .policygo .check::after {
  background-color: #005744;
  transform: scale(0.6);
  opacity: 0;
}
.mail .policygo input[type="checkbox"]:checked + label.check::after {
  opacity: 1;
}


/* .mail input[type="submit"] {
} */

#fc10.page::before {
  display: none;
}

#fc10.page .mailWrap > p {
  font-size: 16px;
}
#fc10.page .mailWrap h4 {
  text-align: center;
  font-size: min(6.4vw, 28px);
  font-weight: bold;
  letter-spacing: 0.04em;
  margin-bottom: 0.4em;
}

.btnSubmit {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: min(4vw, 24px);
  margin-top: min(4vw, 40px);
}
.formBtn {
  background-color: #fae257;
  color: #005744;
  font-size: min(4.6vw, 18px);
  font-weight: 600;
  line-height: 2.9;
  border-radius: 100px;
  width: 250px;
  height: 50px;
  border: 0px solid;
  cursor: pointer;
}
.formBtn.gray {
  background-color: #e2e1e1;
  color: #333;
}
a.formBtn {
  display: block;
  text-decoration: none;
  text-align: center;
}
ul.form li {
  display: flex;
  margin-bottom: 10px;
}
ul.form li .label {
  font-size: 16px;
  width: 160px;
}
ul.form li .input {
  font-size: 16px;
  width: calc(100% - 160px);
}

.errorWrap {
  margin-top: 16px;
}
.errorWrap p {
  font-size: 16px;
}



@media screen and (max-width: 820px) {

  .mailWrap .formBox {
    flex-direction: column;
    gap: min(2vw, 10px);
  }
  .mailWrap .formBox .formLeft {
    width: 100%;
  }
  .mailWrap .formBox .formRight,
  .mailWrap .formBox .formRight2 {
    width: 100%;
  }

  ul.form li {
    display: block;
  }
  ul.form li .label {
    width: 100%;
    font-weight: bold;
  }
  ul.form li .input {
    width: 100%;
  }
}

.hs-form-frame {
  background: #fff;
  border-radius: 20px;
  margin-top: 40px;
}