@charset "utf-8";

/* 共通設定
--------------------------------------------------------------------------*/
html {background-color: #FFF; scroll-behavior: smooth; /*scroll-padding-top: 15px;*/}
body {position: relative; -webkit-text-size-adjust: 100%; -moz-text-size-adjust: 100%; -ms-text-size-adjust: 100%; text-size-adjust: 100%; background-color: #FFF;}
section {position: relative; width: 100%;}
table {width: 100%; border-collapse: collapse; border-spacing: 0;}
h2 {position: relative; margin-bottom: 90px;}
h2.secTitle {height: 60px;}
h2 span {font-size: 60px; font-weight: 700;}
h2.secTitle span {position: absolute; left: 3%;}
.cover, .contain {display: inline-block; width: 100%; height: 240px; background: center / cover no-repeat transparent;}
.contain {background-size: contain;}
.container {position: relative; z-index: 1; width: 100%; max-width: 1200px; margin: 0 auto;}
.secArea {padding: 120px 0;}
.dispFlex {display: flex; flex-direction: row; gap: 30px;}
.dispNone {display: none;}
.calcArea2 {width: calc(50% - 30px * 1 / 2);}
.calcArea3 {width: calc(33.333% - 30px * 2 / 3);}
.calcArea4 {width: calc(25% - 30px * 3 / 4);}
.textArea {padding-top: 30px; line-height: 1.8;}
.textLead {padding-top: 30px; line-height: 1.8; text-align: center;}
.textMin {font-family: 'Noto Serif JP', sans-serif; font-weight: 500;}
.googleMap {position: relative; z-index: 9; width: 100%; height: 450px;}
.googleMap iframe {width: 100%; height: inherit;}
.grecaptcha-badge {visibility: hidden;}
.imgArea {position: relative; display: block;}
.imgArea img {position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; object-position: center;}
.tbView, .tbsView {display: none;}
@media (min-width: 1230px) {
  html {scroll-padding-top: 90px;}
  .bodyWrap {width: 100%; max-width: 1920px; margin: 0 auto;}
  a {transition: all 0.3s ease; opacity: 1;}
  a:hover {transition: all 0.3s ease; opacity: 0.6;}
}
@media (max-width: 1229px) and (min-width: 992px) {
  h2 {margin-bottom: 75px;}
  h2.secTitle {height: 50px;}
  h2 span {font-size: 50px;}
  .cover, .contain {height: 200px;}
  .container {max-width: 970px;}
  .secArea {padding: 100px 0;}
  .dispFlex {gap: 25px;}
  .calcArea2 {width: calc(50% - 25px * 1 / 2);}
  .calcArea3 {width: calc(33.333% - 25px * 2 / 3);}
  .calcArea4 {width: calc(25% - 25px * 3 / 4);}
  .textArea, .textLead {padding-top: 25px;}
  .googleMap {height: 400px;}
  .tbView {display: block;}
}
@media (max-width: 991px) {
  .googleMap {height: 350px;}
}
@media (max-width: 991px) and (min-width: 768px) {
  h2 {margin-bottom: 60px;}
  h2.secTitle {height: 40px;}
  h2 span {font-size: 40px;}
  .cover, .contain {height: 160px;}
  .container {max-width: 750px;}
  .secArea {padding: 80px 0;}
  .dispFlex {gap: 20px;}
  .calcArea2 {width: calc(50% - 20px * 1 / 2);}
  .calcArea3 {width: calc(33.333% - 20px * 2 / 3);}
  .calcArea4 {width: calc(25% - 20px * 3 / 4);}
  .textArea, .textLead {padding-top: 20px;}
  .tbsView {display: block;}
}
@media (min-width: 768px) {
  .mpView {display: none;}
}
@media (max-width: 767px) {
  h2 {margin-bottom: 45px;}
  h2.secTitle {height: 34px;}
  h2 span {left: 15px; font-size: 34px;}
  .cover, .contain {display: block; width: 100%; max-width: 450px; height: 200px; margin: 0 auto;}
  .container {max-width: 450px; padding: 0 15px;}
  .secArea {padding: 60px 0;}
  .dispFlex {gap: 15px;}
  .calcArea2, .calcArea3 {width: 100%;}
  .calcArea4 {width: calc(50% - 15px * 1 / 2);}
  .textArea, .textLead {padding-top: 15px; line-height: 1.6;}
  .pcView {display: none;}
}
@media (min-width: 361px) {
  .mpsView {display: none;}
}
@media (max-width: 360px) {
  h2.secTitle {height: 28px;}
  h2.secTitle span {font-size: 28px;}
  .cover, .contain {height: 160px;}
}

/* #header設定
--------------------------------------------------------------------------*/
#header {position: fixed; z-index: 100; justify-content: space-between; align-items: center; gap: 0; width: 100%; max-width: 1920px; height: 90px;}
#header a#headerLogo {position: relative; left: 25px; z-index: 100; display: block; height: 40px; font-size: 0;}
#header a#headerLogo img {width: 100%;}
#header #hamburger {display: none;}
#header #navWrap nav ul li {position: relative;}
#header #navWrap nav ul li a {font-weight: 500;}
#header #navWrap nav ul li.download a {background-color: #EFE070;}
#header #navWrap nav ul li.contact a {background-color: #212020; color: #FFF;}
@media (min-width: 1230px) {
  #header {background-color: #FFF;}
  #header label.menu_button {display: none;}
  #header #navWrap {z-index: 100;}
  #header #navWrap nav ul {gap: 0;}
  #header #navWrap nav ul li a {display: block; height: 90px; padding: 0 20px; line-height: 90px;}
  #header #navWrap nav ul li.download a {padding-right: 156px; border-radius: 0 0 0 30px;}
  #header #navWrap nav ul li.contact a {margin-left: -136px; border-radius: 0 0 0 30px;}
  #header #navWrap small {display: none;}
}
@media (max-width: 1229px) {
  #header {height: 60px;}
  /* #header::after {content: ''; position: absolute; top: 0; left: 0; z-index: 99; display: block; width: 100%; height: 100px; background-color: #F7F7F7;} */
  #header a#headerLogo {display: none;}
  #header label.menu_button {position: absolute; top: 0; right: 0; z-index: 100; width: 60px; height: 60px; background-color: #EFE070; border-radius: 0 0 0 24px; cursor: pointer;}
  #header label.menu_button span.menu_button__line {position: relative; top: 50%; left: 50%; display: block; width: 24px; height: 3px; background-color: #2C2C2C; border-radius: 200px; transform: translate(-50%,-50%); transition: 0.3s;}
  #header label.menu_button span.menu_button__line:before, #header label.menu_button span.menu_button__line:after {content: ''; width: 100%; height: 100%; border-radius: 200px; transition: inherit; position: absolute; top: 0; left: 0; display: block; background-color: #2C2C2C;}
  #header label.menu_button span.menu_button__line:before {top: -8px;}
  #header label.menu_button span.menu_button__line:after {top: 8px; left: auto; right: 0; width: 12px;}
  #header label.menu_button span.textArea {position: relative; display: block; width: inherit; height: inherit; padding: 0;}
  #hamburger:checked + label.menu_button span.menu_button__line {background-color: transparent;}
  #hamburger:checked + label.menu_button span.menu_button__line::before {top: 0; transform: rotate(35deg);}
  #hamburger:checked + label.menu_button span.menu_button__line::after {top: 0; transform: rotate(-35deg); left: 0; width: 24px;}
  #hamburger:checked ~ #navWrap {opacity: 1; visibility: visible; overflow-y: scroll;}
  #hamburger:checked ~ #navWrap::before {content: ''; position: absolute; top: 15px; left: 15px; z-index: 99; display: block; width: 137px; height: 30px; background: center / cover no-repeat; background-image: url("images/logo-header.svg");}
  #header #navWrap {position: absolute; top: 0; left: 0; width: 100%; height: 100dvh; z-index: 99; transition: 1s top, 1s opacity; opacity: 0; visibility: hidden; overflow-y: scroll;}
  #header #navWrap nav {position: relative; top: 0; left: 0; width: 100%; height: 100dvh; min-height: 750px; padding: 60px 15px 0; background-color: #FFF;}
  #header #navWrap nav ul {gap: 0; position: relative; flex-direction: column; align-items: center; width: 75%; margin: 0 auto;}
  #header #navWrap nav ul li {width: 100%; padding: 10px 15px; border-bottom: solid 1px #C6C6C6;}
  #header #navWrap nav ul li.mpView {display: block;}
  #header #navWrap nav ul li.faq {border: none;}
  #header #navWrap nav ul li a {position: relative; display: block; padding: 15px; text-align: center;}
  #header #navWrap nav ul li.download, #header #navWrap nav ul li.contact {padding: 0; border: none;}
  #header #navWrap nav ul li.download a, #header #navWrap nav ul li.contact a {padding: 20px 0; border-radius: 30px;}
  #header #navWrap nav ul li.download a {margin: 30px 0 15px;}
  #header #navWrap nav ul li.contact a {margin-bottom: 60px;}
  #header #navWrap nav ul li.jnova {border: none;}
}
@media (max-width: 1229px) and (min-width: 992px) {
}
@media (max-width: 991px) and (min-width: 768px) {
}
@media (min-width: 768px) {
}
@media (max-width: 767px) {
}
@media (max-width: 360px) {
}

/* #mainVisual設定
--------------------------------------------------------------------------*/
#mainVisual {position: relative; width: 100%; height: 100vh; max-height: 1080px; background: center / cover no-repeat; background-color: #004290;}
#mainVisual h1 {position: absolute; top: 60px; width: 100%; padding-left: 60px;}
#mainVisual h1 picture {}
#mainVisual h1 picture img {width: 35%;}
#mainVisual div {position: absolute; bottom: 60px; width: 45%;}
#mainVisual div p {position: relative; width: 100%;}
#mainVisual div p:first-of-type {left: 60px; width: 65%; margin-bottom: 30px;}
#mainVisual div p:first-of-type img {width: 100%;}
#mainVisual div p:last-of-type {}
#mainVisual div p:last-of-type picture {width: inherit;}
#mainVisual div p:last-of-type picture img {width: inherit; filter: drop-shadow(3px 3px 6px rgba(0,0,0,0.25));}
#mainVisual ul {position: absolute; bottom: 60px; right: 60px; flex-direction: column; gap: 15px; width: 15%;}
#mainVisual ul li {width: 100%;}
#mainVisual ul li a {width: inherit;}
#mainVisual ul li a picture {width: inherit;}
#mainVisual ul li a picture img {width: inherit; filter: drop-shadow(0 0 3px #FFF);}
@media (min-width: 1230px) {
  /* #mainVisual {height: calc(100vh - 90px); top: 90px; margin-bottom: 90px;} */
  #mainVisual h1 {top: 150px;}
}
@media (max-width: 1229px) {
}
@media (max-width: 1229px) and (min-width: 992px) {
  #mainVisual {max-height: 700px;}
  #mainVisual h1 {top: 50px; padding-left: 50px;}
  #mainVisual div p:first-of-type {left: 50px; margin-bottom: 25px;}
}
@media (min-width: 992px) {
}
@media (max-width: 991px) {
}
@media (max-width: 991px) and (min-width: 768px) {
  #mainVisual {height: 500px;}
  #mainVisual h1 {top: 40px; padding-left: 40px;}
  #mainVisual div p:first-of-type {left: 40px; margin-bottom: 20px;}
}
@media (min-width: 768px) {
  #mainVisual {background-image: url("images/bg-mv-pc.webp");}
}
@media (max-width: 767px) {
  #mainVisual {height: calc(100vw * 2.3); background-size: contain; background-position-y: 60px; background-image: url("images/bg-mv-mp.webp");}
  #mainVisual h1 {top: 15px; width: 100%; padding-left: 15px;}
  #mainVisual h1 picture img {width: 65%; max-width: 300px;}
  #mainVisual div {bottom: 30px; width: 95%; max-width: 450px;}
  #mainVisual div p:first-of-type {margin-bottom: 15px;}
  #mainVisual ul {position: fixed; bottom: 15px; left: 50%; transform: translateX(-50%); z-index: 50; flex-direction: row; gap: 15px; width: 95%; max-width: 450px;}
}
@media (max-width: 767px) and (min-width: 451px) {
  #mainVisual {height: 1040px; background-size: 450px;}
  #mainVisual div {left: 50%; margin-left: -225px;}
}
@media (max-width: 360px) {
}

/* #checksheet設定
--------------------------------------------------------------------------*/
#checksheet {background: linear-gradient(to right, #A1DDE8 0%, #FFFFFF 33%, #FFFFFF 66%, #F7F8D4 100%);}
#checksheet .container {}
#checksheet .container h2 {margin-bottom: 60px; font-size: 60px; /*font-weight: 300;*/ text-align: center;}
#checksheet .container h2::after {content: ''; position: absolute; bottom: -60px; left: 50%; transform: translateX(-50%); display: block; width: 820px; height: 30px; background: center / cover no-repeat; opacity: 0.35;}
#checksheet .container ol {gap: 15px; padding-top: 90px;}
#checksheet .container ol li {flex-direction: column; width: calc(33.333% - 15px * 2 / 3);}
#checksheet .container ol li span {position: relative; display: block; margin-bottom: 60px; padding: 30px 0; background-color: #898989; border-radius: 10px; color: #FFF; font-size: 28px; line-height: 1.4; text-align: center;}
#checksheet .container ol li span::after {content: ''; position: absolute; bottom: -60px; left: 50%; transform: translateX(-50%); display: block; border-top: 30px solid #727272; border-right: 40px solid transparent; border-left: 40px solid transparent;}
#checksheet .container ol li dl {flex-direction: column; flex-grow: 1; padding: 60px 30px; border-radius: 10px;}
#checksheet .container ol li:first-of-type dl {background-color: #2095BF;}
#checksheet .container ol li:nth-of-type(2) dl {background-color: #197AB4;}
#checksheet .container ol li:last-of-type dl {background-color: #1F469B;}
#checksheet .container ol li dl dt {color: #FFF; font-size: 32px; line-height: 1.4; text-align: center;}
#checksheet .container ol li dl dd {color: #FFF; font-size: 20px; line-height: 1.6;}
@media (min-width: 1230px) {
}
@media (max-width: 1229px) {
}
@media (max-width: 1229px) and (min-width: 992px) {
  #checksheet .container h2 {margin-bottom: 50px; font-size: 50px;}
  #checksheet .container h2::after {bottom: -50px; width: 656px; height: 24px;}
  #checksheet .container ol {padding-top: 75px;}
  #checksheet .container ol li span {margin-bottom: 50px; padding: 25px 0; font-size: 24px;}
  #checksheet .container ol li span::after {bottom: -50px; border-top-width: 25px; border-right-width: 35px; border-left-width: 35px;}
  #checksheet .container ol li dl {padding: 50px 20px;}
  #checksheet .container ol li dl dt {font-size: 26px;}
  #checksheet .container ol li dl dd {font-size: 18px;}
}
@media (min-width: 992px) {
}
@media (max-width: 991px) {
}
@media (max-width: 991px) and (min-width: 768px) {
  #checksheet .container h2 {margin-bottom: 40px; font-size: 40px;}
  #checksheet .container h2::after {bottom: -40px; width: 574px; height: 21px;}
  #checksheet .container ol {padding-top: 60px;}
  #checksheet .container ol li span {margin-bottom: 40px; padding: 20px 0; font-size: 18px;}
  #checksheet .container ol li span::after {bottom: -40px; border-top-width: 20px; border-right-width: 30px; border-left-width: 30px;}
  #checksheet .container ol li dl {padding: 40px 15px;}
  #checksheet .container ol li dl dt {font-size: 22px;}
  #checksheet .container ol li dl dd {font-size: 16px;}
}
@media (min-width: 768px) {
  #checksheet .container h2::after {background-image: url("images/checksheet-bg-h2-pc.webp");}
}
@media (max-width: 767px) {
  #checksheet .container h2 {margin-bottom: 30px; font-size: 30px; line-height: 1.3;}
  #checksheet .container h2::after {bottom: -30px; width: 290px; height: 20px; background-image: url("images/checksheet-bg-h2-mp.webp");}
  #checksheet .container ol {flex-direction: column; gap: 30px; padding-top: 45px;}
  #checksheet .container ol li {gap: 10px; width: 100%;}
  #checksheet .container ol li span {margin-bottom: 20px; padding: 15px 0; font-size: 18px;}
  #checksheet .container ol li span::after {bottom: -23px; border-top-width: 15px; border-right-width: 25px; border-left-width: 25px;}
  #checksheet .container ol li dl {padding: 30px 15px;}
  #checksheet .container ol li dl dt {font-size: 22px;}
  #checksheet .container ol li dl dd {font-size: 14px;}
}
@media (max-width: 360px) {
}

/* #features設定
--------------------------------------------------------------------------*/
#features {
  background-size: 10px 10px;
  background-position: 50% 50%;
  background-image:
  repeating-linear-gradient(
    90deg,
    #F8EC8C ,
    #F8EC8C 1px,
    transparent 1px,
    transparent 10px
  ),
  repeating-linear-gradient(
    0deg,
    #F8EC8C ,
    #F8EC8C 1px,
    #FFF7B9 1px,
    #FFF7B9 10px
  );
  overflow: hidden;
}
#features::before, #features::after {content: ''; position: absolute; top: 0; left: 50%; display: block; width: 780px; height: 1200px; margin-left: -1000px; background: center / cover no-repeat;}
#features::after {top: auto; bottom: 0; margin-left: 220px; transform: rotateZ(180deg);}
#features .container {}
#features .container .secInner {position: relative;}
#features .container .secInner h3 {width: 600px; height: 124px; margin-top: 120px; padding-top: 30px; background: center / cover no-repeat; background-image: url("images/features-bg-h3.svg"); color: #0067AF; font-size: 32px; font-weight: 700; text-align: center;}
#features .container .secInner img {position: absolute; top: 50px; right: 0;}
#features .container .secInner h4 {margin-top: 60px;}
#features .container .secInner h4 span {padding: 5px 30px; background-color: #212020; border-radius: 30px; color: #FFF; font-size: 24px; font-weight: 500;}
#features .container .secInner p.textArea {width: 570px;}
#features .container .secInner .dispFlex {margin-top: 5px; padding-top: 30px;}
#features .container .secInner .dispFlex .Inner {padding: 30px; background-color: rgba(255,255,255,0.85); border-radius: 10px;}
#features .container .secInner .dispFlex .Inner h5 {margin-bottom: 30px; font-size: 20px; font-weight: 500;}
#features .container .secInner .dispFlex .Inner h5 span:first-of-type {position: relative; padding-right: 55px;}
#features .container .secInner .dispFlex .Inner h5 span:first-of-type b {position: absolute; bottom: 2px; right: 10px; font-size: 32px;}
#features .container .secInner .dispFlex .Inner h5 span:last-of-type {padding-left: 15px; border-left: solid 1px #333;}
#features .container .secInner .dispFlex .Inner dl {}
#features .container .secInner .dispFlex .Inner dl dt {font-size: 18px; font-weight: 500;}
#features .container .secInner .dispFlex .Inner dl dd {margin-top: 15px; padding: 5px 15px; background-color: #F8EC8C;}
#features .container .secInner .dispFlex .Inner p {padding-top: 15px; line-height: 1.4;}
#features .container .secInner .Inner2 img {top: -50px; left: 5%; width: 400px;}
#features .container .secInner h4.jirei {}
#features .container .secInner dl.jirei {margin-top: 35px; padding: 40px; background-color: rgba(255,255,255,0.85); border-radius: 10px;}
#features .container .secInner dl.jirei dt {position: relative; padding-left: 40px; font-size: 20px; line-height: 1.4;}
#features .container .secInner dl.jirei dt::before {content: 'Ｑ．'; position: absolute; left: 0;}
#features .container .secInner dl.jirei dd {position: relative; margin-top: 15px; padding-left: 40px; font-size: 20px; line-height: 1.4;}
#features .container .secInner dl.jirei dd::before {content: 'Ａ．'; position: absolute; left: 0;}
#features .container .secInner dl.jirei dt:nth-of-type(2n) {margin-top: 30px; padding-top: 30px; border-top: solid 1px #CCC;}
#features .container .secInner dl.jirei dd:nth-of-type(2n) {margin-bottom: 30px; padding-bottom: 30px; border-bottom: solid 1px #CCC;}
@media (min-width: 1230px) {
}
@media (max-width: 1229px) {
}
@media (max-width: 1229px) and (min-width: 992px) {
  #features::before {width: 624px; height: 960px; margin-left: -800px;}
  #features::after {margin-left: 176px;}
  #features .container .secInner h3 {width: 480px; height: 98px; margin-top: 100px; padding-top: 25px; font-size: 26px;}
  #features .container .secInner img {top: 65px; width: 400px;}
  #features .container .secInner h4 {margin-top: 50px;}
  #features .container .secInner h4 span {padding: 5px 25px; font-size: 22px;}
  #features .container .secInner p.textArea {width: 500px;}
  #features .container .secInner .dispFlex {padding-top: 25px;}
  #features .container .secInner .dispFlex .Inner {padding: 25px;}
  #features .container .secInner .dispFlex .Inner h5 {margin-bottom: 25px; font-size: 18px;}
  #features .container .secInner .dispFlex .Inner h5 span:first-of-type {padding-right: 45px;}
  #features .container .secInner .dispFlex .Inner h5 span:first-of-type b {font-size: 26px;}
  #features .container .secInner .dispFlex .Inner dl dt {font-size: 16px;}
  #features .container .secInner .Inner2 img {top: -40px; width: 340px;}
  #features .container .secInner .Inner2 p.textArea {width: 480px;}
  #features .container .secInner dl.jirei {margin-top: 30px; padding: 35px;}
  #features .container .secInner dl.jirei dt {padding-left: 35px; font-size: 16px;}
  #features .container .secInner dl.jirei dd {padding-left: 35px; font-size: 16px;}
  #features .container .secInner dl.jirei dt:nth-of-type(2n) {margin-top: 25px; padding-top: 25px;}
  #features .container .secInner dl.jirei dd:nth-of-type(2n) {margin-bottom: 25px; padding-bottom: 25px;}
}
@media (min-width: 992px) {
}
@media (max-width: 991px) {
}
@media (max-width: 991px) and (min-width: 768px) {
  #features::before {width: 468px; height: 720px; margin-left: -600px;}
  #features::after {margin-left: 132px;}
  #features .container .secInner h3 {width: 360px; height: 74px; margin-top: 80px; padding-top: 20px; font-size: 20px;}
  #features .container .secInner img {top: 75px; width: 300px;}
  #features .container .secInner h4 {margin-top: 40px;}
  #features .container .secInner h4 span {padding: 5px 20px; font-size: 18px;}
  #features .container .secInner p.textArea {width: 420px;}
  #features .container .secInner .dispFlex {padding-top: 20px;}
  #features .container .secInner .dispFlex .Inner {padding: 20px;}
  #features .container .secInner .dispFlex .Inner h5 {margin-bottom: 20px; font-size: 16px;}
  #features .container .secInner .dispFlex .Inner h5 span:first-of-type {padding-right: 40px;}
  #features .container .secInner .dispFlex .Inner h5 span:first-of-type b {bottom: 3px; font-size: 22px;}
  #features .container .secInner .dispFlex .Inner dl dt {font-size: 16px;}
  #features .container .secInner .dispFlex .Inner dl dd {padding: 5px;}
  #features .container .secInner .Inner2 img {top: -15px; width: 280px;}
  #features .container .secInner .Inner2 p.textArea {width: 370px;}
  #features .container .secInner dl.jirei {margin-top: 25px; padding: 20px 15px;}
  #features .container .secInner dl.jirei dt {padding-left: 30px; font-size: 14px;}
  #features .container .secInner dl.jirei dd {padding-left: 30px; font-size: 14px;}
  #features .container .secInner dl.jirei dt:nth-of-type(2n) {margin-top: 20px; padding-top: 20px;}
  #features .container .secInner dl.jirei dd:nth-of-type(2n) {margin-bottom: 20px; padding-bottom: 20px;}
}
@media (min-width: 768px) {
  #features::before, #features::after {background-image: url("images/features-bg-pc.svg");}
  #features .container .secInner .Inner2 {padding-left: 50%;}
  #features .container .secInner h4.jirei {text-align: center;}
}
@media (max-width: 767px) {
  #features::before, #features::after {width: 200px; height: 860px; background-image: url("images/features-bg-mp.svg");}
  #features::before {left: 0; margin-left: 0;}
  #features::after {left: auto; right: 0; margin-left: 0;}
  #features h2.secTitle {margin-bottom: 30px;}
  #features .container .secInner {margin-top: 30px; padding-top: 230px;}
  #features .container .secInner h3 {width: 340px; height: 70px; margin-top: 0; padding-top: 18px; font-size: 18px;}
  #features .container .secInner img {top: 0; left: 50%; transform: translateX(-50%); width: 200px;}
  #features .container .secInner h4 {margin-top: 30px;}
  #features .container .secInner h4 span {padding: 5px 15px; font-size: 14px;}
  #features .container .secInner p.textArea {width: 100%;}
  #features .container .secInner .dispFlex {flex-direction: column; padding-top: 15px;}
  #features .container .secInner .dispFlex .Inner {padding: 15px;}
  #features .container .secInner .dispFlex .Inner h5 {margin-bottom: 15px; font-size: 14px;}
  #features .container .secInner .dispFlex .Inner h5 span:first-of-type {padding-right: 40px;}
  #features .container .secInner .dispFlex .Inner h5 span:first-of-type b {bottom: 3px; font-size: 22px;}
  #features .container .secInner .dispFlex .Inner dl dt {font-size: 14px;}
  #features .container .secInner .dispFlex .Inner dl dd {padding: 5px; font-size: 95%;}
  #features .container .secInner .Inner2 img {top: 0; left: 50%; transform: translateX(-50%); width: 150px;}
  #features .container .secInner .Inner2 p.textArea {width: 100%;}
  #features .container .secInner dl.jirei {margin-top: 20px; padding: 15px;}
  #features .container .secInner dl.jirei dt {padding-left: 25px; font-size: 14px;}
  #features .container .secInner dl.jirei dd {padding-left: 25px; font-size: 14px;}
  #features .container .secInner dl.jirei dt:nth-of-type(2n) {margin-top: 15px; padding-top: 15px;}
  #features .container .secInner dl.jirei dd:nth-of-type(2n) {margin-bottom: 15px; padding-bottom: 15px;}
}
@media (max-width: 360px) {
  #features .container .secInner h3 {width: 290px; height: 60px; padding-top: 13px;}
  #features .container .secInner h4 span {font-size: 85%;}
  #features .container .secInner .dispFlex .Inner h5 {font-size: 14px;}
  #features .container .secInner .dispFlex .Inner dl dd {font-size: 80%;}
}

/* #gradation設定
--------------------------------------------------------------------------*/
#gradation {background: linear-gradient(to right, #2B5BA0 0%, #91D9CE 100%);}
#gradation .secArea::before {content: ''; position: absolute; top: 0; left: 0; display: block; width: 460px; height: 640px; background: center / cover no-repeat; background-image: url("images/gradation-bg-h2.webp"); filter: blur(2px);}
@media (max-width: 1229px) and (min-width: 992px) {
  #gradation .secArea::before {width: 368px; height: 512px;}
}
@media (max-width: 991px) and (min-width: 768px) {
  #gradation .secArea::before {width: 276px; height: 384px;}
}
@media (max-width: 767px) {
  #gradation .secArea::before {width: 184px; height: 256px;}
}

/* #functions設定
--------------------------------------------------------------------------*/
#functions {padding-bottom: 60px;}
#functions .container {flex-wrap: wrap; gap: 15px;}
#functions .container .Inner {width: calc(33.333% - 15px * 2 / 3); padding: 30px; border-radius: 10px; filter: drop-shadow(3px 3px 6px rgba(0,0,0,0.15));}
#functions .container .Inner:nth-of-type(2n-1) {background-color: rgba(88,204,189,0.75);}
#functions .container .Inner:nth-of-type(2n) {background-color: rgba(45,138,199,0.75);}
#functions .container .Inner h3 {position: relative; height: 120px; margin-bottom: 45px; border: solid 5px #FFF; color: #FFF; font-size: 30px; font-weight: 500; line-height: 1.2; text-align: center;}
#functions .container .Inner h3 span {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); display: block; width: 100%;}
#functions .container .Inner h3::after {content: ''; position: absolute; bottom: -30px; left: 50%; transform: translateX(-50%); display: block; width: 5px; height: 30px; background-color: #FFF;}
#functions .container .Inner ul {flex-direction: column; gap: 10px;}
#functions .container .Inner ul li {position: relative; padding-left: 20px; color: #FFF; font-size: 18px; font-weight: 500;}
#functions .container .Inner ul li::before {content: '・'; position: absolute; left: 0;}
@media (min-width: 1230px) {
}
@media (max-width: 1229px) {
}
@media (max-width: 1229px) and (min-width: 992px) {
  #functions {padding-bottom: 75px;}
  #functions .container .Inner {padding: 25px;}
  #functions .container .Inner h3 {height: 100px; margin-bottom: 40px; border-width: 4px; font-size: 24px;}
  #functions .container .Inner h3::after {bottom: -25px; width: 4px; height: 25px;}
  #functions .container .Inner ul li {padding-left: 18px; font-size: 16px;}
}
@media (min-width: 992px) {
}
@media (max-width: 991px) {
}
@media (max-width: 991px) and (min-width: 768px) {
  #functions {padding-bottom: 60px;}
  #functions .container .Inner {padding: 20px;}
  #functions .container .Inner h3 {height: 80px; margin-bottom: 35px; border-width: 3px; font-size: 20px;}
  #functions .container .Inner h3::after {bottom: -20px; width: 3px; height: 20px;}
  #functions .container .Inner ul li {padding-left: 16px; font-size: 90%;}
}
@media (min-width: 768px) {
}
@media (max-width: 767px) {
  #functions {padding-bottom: 45px;}
  #functions .container .Inner {width: 100%; padding: 15px;}
  #functions .container .Inner h3 {height: 60px; margin-bottom: 30px; border-width: 3px; font-size: 18px;}
  #functions .container .Inner h3::after {bottom: -15px; width: 3px; height: 15px;}
  #functions .container .Inner ul li {padding-left: 16px; font-size: 14px;}
}
@media (max-width: 360px) {
}

/* #fees設定
--------------------------------------------------------------------------*/
#fees {padding-top: 60px;}
#fees .secInner {
  width: calc(100% - 60px);
  background-size: 10px 10px;
  background-position: 50% 50%;
  background-image:
  repeating-linear-gradient(
    90deg,
    #F8EC8C ,
    #F8EC8C 1px,
    transparent 1px,
    transparent 10px
  ),
  repeating-linear-gradient(
    0deg,
    #F8EC8C ,
    #F8EC8C 1px,
    #FFF7B9 1px,
    #FFF7B9 10px
  );
  border: solid 20px #EFE070;
  border-left: none;
  border-radius: 0 600px 600px 0;
  filter: drop-shadow(3px 3px 6px rgba(0,0,0,0.15));
}
#fees .secInner .container {left: 40px; padding: 90px 0 120px;}
#fees .secInner .container h2 {margin-bottom: 0; text-align: center;}
#fees .secInner .container h2 span {}
#fees .secInner .container h3 {margin: 30px 0; font-size: 30px; font-weight: 700;}
#fees .secInner .container h3 span {font-size: 70%;}
#fees .secInner .container div.dispFlex {margin-bottom: 60px;}
#fees .secInner .container div.dispFlex dl {flex-wrap: wrap; gap: 0;}
#fees .secInner .container div.dispFlex dl dt {width: 60px; background-color: #333; border-radius: 20px 0 0 20px; color: #FFF; font-size: 24px; font-weight: 500; line-height: 60px; text-align: center;}
#fees .secInner .container div.dispFlex dl dd {width: calc(100% - 60px); padding: 30px 0; border: solid 3px #333; border-radius: 0 20px 20px 0; font-size: 24px; font-weight: 500; text-align: center;}
#fees .secInner .container div.dispFlex dl dd strong {padding: 0 15px; font-size: 40px;}
#fees .secInner .container div.dispFlex dl dd span {display: block; margin-top: 15px; font-size: 18px;}
#fees .secInner .container > dl {gap: 0;}
#fees .secInner .container > dl dt {position: relative; width: 300px; padding: 60px 0; background-color: #0067AF; border-radius: 20px 0 0 20px; color: #FFF; font-size: 24px; font-weight: 500; text-align: center;}
#fees .secInner .container > dl dt span {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); display: block; width: 100%;}
#fees .secInner .container > dl dd {position: relative; width: calc(100% - 300px); padding: 60px 0; background-color: #FFF; border: solid 3px #0067AF; border-radius: 0 20px 20px 0; color: #0067AF; font-size: 24px; font-weight: 500; text-align: center;}
#fees .secInner .container > dl dd::before {content: ''; position: absolute; top: 50%; left: 50%; z-index: 2; display: block; width: 224px; height: 96px; margin: -125px 0 0 125px; background: center / cover no-repeat;}
#fees .secInner .container > dl dd strong {position: relative; z-index: 2; padding: 0 15px; font-size: 40px; font-weight: 700;}
#fees .secInner .container > dl dd strong::before {content: ''; position: absolute; bottom: -3px; left: 50%; transform: translateX(-53%); z-index: -1; display: block; width: 300px; height: 10px; background-color: #EFE070;}
#fees .secInner .container > dl dd span {display: block; margin-top: 15px; font-size: 18px;}
#fees .secInner .container > ul {flex-direction: column; align-items: center; gap: 15px; margin-top: 60px;}
#fees .secInner .container > ul li {}
@media (max-width: 1499px) and (min-width: 1230px) {
  #fees .secInner .container {width: 900px;}
}
@media (min-width: 1230px) {
}
@media (max-width: 1229px) {
  #fees .secInner .container div.dispFlex dl dd {border-width: 2px;}
  #fees .secInner .container > dl dd {border-width: 2px;}
}
@media (max-width: 1229px) and (min-width: 992px) {
  #fees {padding-top: 25px;}
  #fees .secInner {width: calc(100% - 25px); border-width: 18px; border-radius: 0 250px 250px 0;}
  #fees .secInner .container {left: 22px; width: 800px; padding: 75px 0 100px;}
  #fees .secInner .container h3 {margin: 25px 0; font-size: 24px;}
  #fees .secInner .container div.dispFlex {margin-bottom: 50px;}
  #fees .secInner .container div.dispFlex dl dt {width: 50px; font-size: 20px; line-height: 50px;}
  #fees .secInner .container div.dispFlex dl dd {width: calc(100% - 50px); padding: 25px 0; font-size: 20px;}
  #fees .secInner .container div.dispFlex dl dd strong {font-size: 32px;}
  #fees .secInner .container div.dispFlex dl dd span {font-size: 16px;}
  #fees .secInner .container > dl dt {width: 240px; padding: 50px 0; font-size: 20px;}
  #fees .secInner .container > dl dd {width: calc(100% - 240px); padding: 50px 0; font-size: 20px;}
  #fees .secInner .container > dl dd::before {width: 190px; height: 80px; margin: -115px 0 0 115px;}
  #fees .secInner .container > dl dd strong {padding: 0 13px; font-size: 32px;}
  #fees .secInner .container > dl dd strong::before {bottom: -2px; width: 240px; height: 8px;}
  #fees .secInner .container > dl dd span {font-size: 16px;}
  #fees .secInner .container > ul {margin-top: 50px;}
}
@media (min-width: 992px) {
}
@media (max-width: 991px) {
}
@media (max-width: 991px) and (min-width: 768px) {
  #fees {padding-top: 20px;}
  #fees .secInner {width: calc(100% - 20px); border-width: 16px; border-radius: 0 200px 200px 0;}
  #fees .secInner .container {left: 18px; width: 650px; padding: 60px 0 80px;}
  #fees .secInner .container h3 {margin: 20px 0; font-size: 20px;}
  #fees .secInner .container div.dispFlex {margin-bottom: 40px;}
  #fees .secInner .container div.dispFlex dl dt {width: 40px; font-size: 16px; line-height: 40px;}
  #fees .secInner .container div.dispFlex dl dd {width: calc(100% - 40px); padding: 20px 0; font-size: 16px;}
  #fees .secInner .container div.dispFlex dl dd strong {font-size: 24px;}
  #fees .secInner .container div.dispFlex dl dd span {font-size: 14px;}
  #fees .secInner .container > dl dt {width: 200px; padding: 40px 0; font-size: 16px;}
  #fees .secInner .container > dl dd {width: calc(100% - 200px); padding: 40px 0; font-size: 16px;}
  #fees .secInner .container > dl dd::before {width: 140px; height: 60px; margin: -95px 0 0 95px;}
  #fees .secInner .container > dl dd strong {padding: 0 10px; font-size: 28px;}
  #fees .secInner .container > dl dd strong::before {bottom: -2px; width: 240px; height: 6px;}
  #fees .secInner .container > dl dd span {font-size: 14px;}
  #fees .secInner .container > ul {margin-top: 40px;}
}
@media (min-width: 768px) {
  #fees .secInner .container div.dispFlex dl dt {writing-mode: vertical-rl;}
  #fees .secInner .container > dl dd::before {background-image: url("images/fees-15off-pc.svg");}
}
@media (max-width: 767px) {
  #fees {padding-top: 15px;}
  #fees .secInner {width: calc(100% - 15px); border-width: 10px; border-radius: 0 100px 100px 0;}
  #fees .secInner .container {left: 0; width: calc(100% - 30px); padding: 45px 0 60px;}
  #fees .secInner .container h3 {margin: 15px 0; font-size: 18px;}
  #fees .secInner .container div.dispFlex {flex-direction: column; margin-bottom: 30px;}
  #fees .secInner .container div.dispFlex dl {flex-direction: column;}
  #fees .secInner .container div.dispFlex dl dt {width: 100%; padding: 10px 0; border-radius: 20px 20px 0 0; font-size: 14px; line-height: 1;}
  #fees .secInner .container div.dispFlex dl dd {width: 100%; padding: 15px 0; border-radius: 0 0 20px 20px; font-size: 14px;}
  #fees .secInner .container div.dispFlex dl dd strong {font-size: 26px;}
  #fees .secInner .container div.dispFlex dl dd span {font-size: 14px;}
  #fees .secInner .container > dl {flex-direction: column;}
  #fees .secInner .container > dl dt {width: 100%; padding: 15px 0; border-radius: 20px 20px 0 0; font-size: 14px;}
  #fees .secInner .container > dl dt span {position: static; transform: none;}
  #fees .secInner .container > dl dd {width: 100%; padding: 30px 0; border-radius: 0 0 20px 20px; font-size: 14px;}
  #fees .secInner .container > dl dd::before {width: 100px; height: 70px; margin: -135px 0 0 80px; background-image: url("images/fees-15off-mp.svg");}
  #fees .secInner .container > dl dd strong {padding: 0 10px; font-size: 30px;}
  #fees .secInner .container > dl dd strong::before {bottom: 2px; width: 200px; height: 5px;}
  #fees .secInner .container > dl dd span {font-size: 14px;}
  #fees .secInner .container > ul {align-items: flex-start; margin-top: 30px;}
}
@media (max-width: 360px) {
  #fees .secInner .container > dl dd::before {width: 80px; height: 56px; margin: -120px 0 0 75px;}
}

/* #faq設定
--------------------------------------------------------------------------*/
#faq {padding-bottom: 60px;}
#faq .container {padding: 120px; background-color: rgba(0,0,0,0.1); border-radius: 15px;}
#faq .container dl {}
#faq .container dl dt {position: relative; padding-left: 40px; color: #FFF; font-size: 20px; font-weight: 500; line-height: 1.4;}
#faq .container dl dt::before {content: 'Ｑ．'; position: absolute; left: 0;}
#faq .container dl dd {position: relative; margin-bottom: 45px; padding: 15px 0 45px 40px; border-bottom: solid 1px #FFF; color: #FFF; font-size: 20px; font-weight: 500; line-height: 1.4;}
#faq .container dl dd::before {content: 'Ａ．'; position: absolute; left: 0;}
#faq .container dl dd:last-of-type {margin-bottom: 0; padding-bottom: 0; border: none;}
@media (min-width: 1230px) {
}
@media (max-width: 1229px) {
  #faq .container dl dt {padding-left: 30px; font-size: 14px;}
  #faq .container dl dd {font-size: 14px;}
}
@media (max-width: 1229px) and (min-width: 992px) {
  #faq {padding-bottom: 75px;}
  #faq .container {padding: 100px;}
  #faq .container dl dd {margin-bottom: 40px; padding: 15px 0 40px 30px;}
}
@media (min-width: 992px) {
}
@media (max-width: 991px) {
}
@media (max-width: 991px) and (min-width: 768px) {
  #faq {padding-bottom: 60px;}
  #faq .container {padding: 60px;}
  #faq .container dl dd {margin-bottom: 35px; padding: 15px 0 35px 30px;}
}
@media (min-width: 768px) {
}
@media (max-width: 767px) {
  #faq {padding-bottom: 45px;}
  #faq .container {width: calc(100% - 30px); padding: 30px;}
  #faq .container dl dd {margin-bottom: 30px; padding: 15px 0 30px 30px;}
}
@media (max-width: 360px) {
}

/* #download設定
--------------------------------------------------------------------------*/
#download {padding-top: 60px;}
#download .secInner {
  position: relative;
  left: 60px;
  width: calc(100% - 60px);
  background-size: 10px 10px;
  background-position: 50% 50%;
  background-image:
  repeating-linear-gradient(
    90deg,
    #F8EC8C ,
    #F8EC8C 1px,
    transparent 1px,
    transparent 10px
  ),
  repeating-linear-gradient(
    0deg,
    #F8EC8C ,
    #F8EC8C 1px,
    #FFF7B9 1px,
    #FFF7B9 10px
  );
  border: solid 20px #EFE070;
  border-right: none;
  border-radius: 600px 0 0 600px;
  filter: drop-shadow(-3px 3px 6px rgba(0,0,0,0.15));
}
#download .secInner::before {content: ''; position: absolute; bottom: 0; right: 0; display: block; width: 600px; height: 600px; background: center / cover no-repeat; background-image: url("images/download-bg.webp"); opacity: 0.2;}
#download .secInner .container {left: -40px; gap: 60px; padding: 120px 0;}
#download .secInner .container .Inner {flex-direction: column; justify-content: center; align-items: center; padding-top: 90px;}
#download .secInner .container .Inner h2 {margin-bottom: 30px;}
#download .secInner .container .Inner h2 span {position: relative;}
#download .secInner .container .Inner h2 span::before {content: ''; position: absolute; top: -100px; left: 50%; transform: translateX(-50%); display: block; width: 300px; height: 70px; background: center / cover no-repeat; background-image: url("images/download-bg-h2.svg");}
#download .secInner .container .Inner a {position: relative; top: 0; left: 0; display: block; width: 450px; height: 80px; background-color: #212020; border-radius: 0 0 50px 0; color: #FFF; font-size: 20px; font-weight: 500; line-height: 70px; text-align: center;}
#download .secInner .container .Inner a::before {content: ''; position: absolute; top: 8px; left: 8px; z-index: -1; display: block; width: inherit; height: inherit; background-color: #FFF; border: solid 1px #333; border-radius: 0 0 50px 0;}
#download .secInner .container .Inner a span {}
#download .secInner .container > img {}
@media (min-width: 1500px) {
  #download .secInner .container .Inner {width: calc(100% - 520px - 30px);}
  #download .secInner .container > img {width: 520px;}
}
@media (max-width: 1499px) and (min-width: 1230px) {
  #download .secInner::before {width: 500px; height: 500px;}
  #download .secInner .container {width: 900px;}
  #download .secInner .container .Inner {padding-top: 75px;}
  #download .secInner .container .Inner h2 span {font-size: 50px;}
  #download .secInner .container .Inner h2 span::before {top: -80px; width: 270px; height: 63px;}
  #download .secInner .container .Inner a {width: 400px; height: 70px; font-size: 18px; line-height: 60px;}
}
@media (min-width: 1230px) {
  #download .secInner .container .Inner a, #download .secInner .container .Inner a:hover {transition: none;}
  #download .secInner .container .Inner a:hover::before {transition: none; opacity: 0;}
}
@media (max-width: 1229px) {
}
@media (max-width: 1229px) and (min-width: 992px) {
  #download {padding-top: 25px;}
  #download .secInner {left: 25px; width: calc(100% - 25px); border-width: 18px; border-radius: 250px 0 0 250px;}
  #download .secInner::before {width: 400px; height: 400px;}
  #download .secInner .container {left: -22px; gap: 50px; width: 800px; padding: 100px 0;}
  #download .secInner .container .Inner {padding-top: 75px;}
  #download .secInner .container .Inner h2 {margin-bottom: 25px;}
  #download .secInner .container .Inner h2 span {font-size: 40px;}
  #download .secInner .container .Inner h2 span::before {top: -70px; width: 240px; height: 56px;}
  #download .secInner .container .Inner a {width: 350px; height: 60px; border-radius: 0 0 40px 0; font-size: 16px; line-height: 55px;}
  #download .secInner .container .Inner a::before {top: 7px; left: 7px; border-radius: 0 0 40px 0;}
}
@media (min-width: 992px) {
}
@media (max-width: 991px) {
}
@media (max-width: 991px) and (min-width: 768px) {
  #download {padding-top: 20px;}
  #download .secInner {left: 20px; width: calc(100% - 20px); border-width: 16px; border-radius: 200px 0 0 200px;}
  #download .secInner::before {width: 300px; height: 300px;}
  #download .secInner .container {left: -18px; width: 650px; padding: 80px 0;}
  #download .secInner .container .Inner {padding-top: 60px;}
  #download .secInner .container .Inner h2 {margin-bottom: 20px;}
  #download .secInner .container .Inner h2 span {font-size: 34px;}
  #download .secInner .container .Inner h2 span::before {top: -60px; width: 210px; height: 49px;}
  #download .secInner .container .Inner a {width: 300px; height: 50px; border-radius: 0 0 30px 0; font-size: 14px; line-height: 45px;}
  #download .secInner .container .Inner a::before {top: 6px; left: 6px; border-radius: 0 0 30px 0;}
}
@media (min-width: 768px) {
}
@media (max-width: 767px) {
  #download {padding-top: 15px;}
  #download .secInner {left: 15px; width: calc(100% - 15px); border-width: 10px; border-radius: 100px 0 0 100px;}
  #download .secInner::before {width: 200px; height: 200px;}
  #download .secInner .container {left: 0; display: block; width: calc(100% - 30px); padding: 60px 0;}
  #download .secInner .container .Inner {gap: 0; padding-top: 45px;}
  #download .secInner .container .Inner h2 {margin-bottom: 275px;}
  #download .secInner .container .Inner h2 span {left: 0; font-size: 34px;}
  #download .secInner .container .Inner h2 span::before {top: -50px; width: 180px; height: 42px;}
  #download .secInner .container .Inner a {width: 100%; max-width: 275px; height: 45px; border-radius: 0 0 25px 0; font-size: 14px; line-height: 40px;}
  #download .secInner .container .Inner a::before {top: 5px; left: 5px; border-radius: 0 0 25px 0;}
  #download .secInner .container > img {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 200px; margin-top: 15px;}
}
@media (max-width: 360px) {
  #download .secInner .container .Inner h2 {margin-bottom: 275px;}
  #download .secInner .container .Inner h2 span {font-size: 30px;}
  #download .secInner .container .Inner h2 span::before {top: -50px; width: 180px; height: 42px;}
}

/* #contact設定
--------------------------------------------------------------------------*/
#contact {margin-top: 120px; padding: 0 0 120px;}
#contact .container {}
#contact .container h2 {padding-top: 120px;}
#contact .container h2 span {font-weight: 500;}
@media (min-width: 1230px) {
}
@media (max-width: 1229px) {
}
@media (max-width: 1229px) and (min-width: 992px) {
  #contact {margin-top: 100px; padding: 0 0 100px;}
  #contact .container h2 {padding-top: 100px;}
}
@media (min-width: 992px) {
}
@media (max-width: 991px) {
}
@media (max-width: 991px) and (min-width: 768px) {
  #contact {margin-top: 80px; padding: 0 0 80px;}
  #contact .container h2 {padding-top: 80px;}
}
@media (min-width: 768px) {
  #contact .container > p.textArea {text-align: center;}
}
@media (max-width: 767px) {
  #contact {margin-top: 60px; padding: 0 0 60px;}
  #contact .container h2 {padding-top: 60px;}
}

/* #secForm設定
--------------------------------------------------------------------------*/
#secForm {margin-top: 30px;}
#secForm form {padding: 60px; background-color: rgba(255,255,255,0.9); border-radius: 15px;}
#secForm form dl:not(:first-child) {margin-top: 30px;}
#secForm form dl dt {width: 250px;}
#secForm form dl dt p {padding: 0; font-weight: 500;}
#secForm form dl dt p span.cf7Must {color: #E7654B; font-size: 80%;}
#secForm form dl dd {width: 500px;}
#secForm form dl dd p {padding: 0;}
#secForm form dl dd p span input {width: 100%; padding: 5px; border: solid 1px #CCC; font-size: 80%;}
#secForm form dl dd p span select {padding: 4px; border: solid 1px #CCC; font-size: 80%;}
#secForm form dl dd.cf7Image p span input {border: none;}
#secForm form dl dd p span.wpcf7-list-item {display: inline-block; margin: 0; padding-right: 30px;}
#secForm form dl dd p span.wpcf7-list-item input {width: auto; margin-right: 3px;}
#secForm form dl dd p span.wpcf7-not-valid-tip {display: block; color: #E7654B; font-size: 80%;}
#secForm form dl dd p span textarea {width: 100%; height: 100px; padding: 5px; border: solid 1px #CCC; font-size: 80%;}
#secForm form p.cf7Btn > span {position: relative; display: block; width: 200px; margin: 0 auto;}
#secForm form p.cf7Btn > span:hover {opacity: 0.8;}
#secForm form p.cf7Btn > span input {display: inline-block; width: inherit; padding: 13px; background-color: #E7654B; border-radius: 5px; color: #FFF; text-align: center; cursor: pointer;}
#secForm form p.cf7Btn > span span.wpcf7-spinner {position: absolute; top: 50%; transform: translateY(-50%); margin: 0 0 0 15px;}
#secForm form p.cf7Btn > span a {display: block; width: 200px; margin: 0 auto; padding: 13px; background-color: #E7654B; border-radius: 5px; color: #FFF; text-align: center; cursor: pointer;}
#secForm form .wpcf7-response-output {margin: 15px 0 0; padding: 0.2em; font-size: 80%; line-height: 2; text-align: center;}
#secForm .textArea {align-items: center; gap: 0;}
#secForm .textArea p.textRecap {width: 260px; height: 60px; padding: 10px 5px 0 80px; background: center / cover no-repeat; background-image: url('images/recaptcha-v3.webp'); border-radius: 4px; box-shadow: 0 0 6px #CCC; color: #FFF; font-size: 75%; line-height: 1.6;}
#secForm .textArea p.textRecap a {color: #FFF; font-size: 75%; text-decoration: underline; text-underline-offset: 0.3em;}
#secForm .textArea p.textDetail {width: calc(100% - 260px); padding: 0 0 0 30px; line-height: 1.4;}
#secPripoli {width: 100%; height: 250px; margin-top: 30px; padding: 30px 30px 15px; background-color: rgba(255,255,255,0.9); border: solid 1px #CCC; overflow-x: inherit; overflow-y: scroll;}
#secPripoli h3 {margin-top: 0; margin-bottom: 15px; padding: 0; color: #E7654B; font-size: 16px; font-weight: 700;}
#secPripoli h4 {margin-bottom: 10px; padding: 0; color: #E7654B; font-size: 14px; font-weight: 700;}
#secPripoli p {padding: 0 0 15px; font-size: 14px; line-height: 1.4;}
#secPripoli ul {padding: 0 0 10px;}
#secPripoli li {position: relative; padding: 0 0 5px 13px; font-size: 13px; line-height: 1.2;}
#secPripoli li::before {content: '・'; position: absolute; left: 0;}
@media (min-width: 1230px) {
  #secForm form p.cf7Btn {margin: 30px 0 0 -15px;}
}
@media (max-width: 1229px) {
  #secForm form dl dt {width: 200px;}
  #secForm form dl dd {width: 400px;}
  #secForm .textArea p.textRecap {font-size: 85%;}
  #secForm .textArea p.textDetail {line-height: 1.4;}
}
@media (max-width: 1229px) and (min-width: 992px) {
  #secForm {margin-top: 25px;}
  #secForm form {padding: 50px;}
  #secForm form dl:not(:first-child) {margin-top: 25px;}
  #secForm form dl dd p span.wpcf7-list-item {padding-right: 25px;}
  #secForm form p.cf7Btn {margin: 25px 0 0 40px;}
  #secForm .textArea p.textDetail {padding-left: 25px;}
  #secPripoli {height: 200px; margin-top: 25px; padding: 25px 25px 10px;}
}
@media (max-width: 991px) {
  #secForm form dl:not(:first-child) {margin-top: 20px;}
  #secForm .textArea p.textDetail {font-size: 13px;}
}
@media (max-width: 991px) and (min-width: 768px) {
  #secForm {margin-top: 20px;}
  #secForm form {padding: 40px;}
  #secForm form dl dd p span.wpcf7-list-item {padding-right: 20px;}
  #secForm form p.cf7Btn {margin: 20px 0 0 20px;}
  #secForm .textArea p.textDetail {padding-left: 20px;}
  #secPripoli {height: 200px; margin-top: 20px; padding: 20px 20px 10px;}
}
@media (min-width: 768px) {
  #secForm form dl {justify-content: center; align-items: center;}
}
@media (max-width: 767px) {
  #secForm {margin-top: 15px;}
  #secForm form {padding: 15px;}
  #secForm form dl {flex-direction: column; gap: 5px;}
  #secForm form dl dt, #secForm form dl dd {width: 100%;}
  #secForm form dl dd p span.wpcf7-list-item {padding-right: 15px;}
  #secForm form p.cf7Btn {margin: 20px auto 0;}
  #secForm form p.cf7Btn > span {width: 260px;}
  #secForm form p.cf7Btn > span a {width: 260px;}
  #secForm .textArea {flex-direction: column; gap: 15px;}
  #secForm .textArea p.textDetail {width: 100%; padding: 0;}
  #secPripoli {height: 150px; margin-top: 15px; padding: 15px 15px 0;}
  #secPripoli h3 {font-size: 14px;}
}
@media (max-width: 360px) {
  #secForm form p.cf7Btn > span, #secForm form p.cf7Btn > span a {width: 100%;}
}

/* #footer設定
--------------------------------------------------------------------------*/
#footer {}
#footer dl {flex-direction: column; gap: 0; text-align: center;}
#footer dl dt {order: 2; background-color: #F5F5F5;}
#footer dl dt span {display: block; width: 1200px; margin: 0 auto 30px; padding: 60px 0 30px; border-bottom: solid 1px #CCC; line-height: 1.8;}
#footer dl dd {line-height: 1.8;}
#footer dl dd:first-of-type {order: 3; padding-bottom: 60px; background-color: #F5F5F5;}
#footer dl dd:first-of-type a {}
#footer dl dd:first-of-type address {}
#footer dl dd:first-of-type address span {display: block;}
#footer dl dd:first-of-type address span:first-of-type {}
#footer dl dd:first-of-type address span:last-of-type {}
#footer dl dd:last-of-type {order: 1; padding: 120px 0;}
#footer dl dd:last-of-type a {display: block; width: 455px; height: 164px; margin: 0 auto;}
#footer dl dd:last-of-type a picture {width: inherit; height: inherit;}
#footer dl dd:last-of-type a picture img {width: inherit; height: inherit;}
#footer small {display: block; padding: 10px; background-color: #212020; color: #FFF; text-align: center;}
@media (min-width: 1230px) {
}
@media (max-width: 1229px) {
}
@media (max-width: 1229px) and (min-width: 992px) {
  #footer dl dt span {width: 970px; margin-bottom: 25px; padding: 50px 0 25px;}
  #footer dl dd:first-of-type {padding-bottom: 50px;}
  #footer dl dd:last-of-type {padding: 100px 0;}
  #footer dl dd:last-of-type a {width: 400px; height: 145px;}
}
@media (min-width: 992px) {
}
@media (max-width: 991px) {
}
@media (max-width: 991px) and (min-width: 768px) {
  #footer dl dt span {width: 750px; margin-bottom: 20px; padding: 40px 0 20px;}
  #footer dl dd:first-of-type {padding-bottom: 40px;}
  #footer dl dd:last-of-type {padding: 80px 0;}
  #footer dl dd:last-of-type a {width: 360px; height: 130px;}
}
@media (min-width: 768px) {
  #footer dl dd:first-of-type address span:first-of-type b {padding-left: 14px;}
}
@media (max-width: 767px) {
  #footer dl dt span {width: 90%; margin-bottom: 15px; padding: 30px 0 15px;}
  #footer dl dd:first-of-type {padding-bottom: 30px;}
  #footer dl dd:first-of-type address span:first-of-type b {display: block;}
  #footer dl dd:last-of-type {padding: 60px 0;}
  #footer dl dd:last-of-type a {width: 258px; height: 284px;}
  #footer small {padding-bottom: 75px;}
}
@media (max-width: 360px) {
}

/* #thanksPage設定
--------------------------------------------------------------------------*/
#thanksPage {}
#thanksPage .container {flex-direction: column; text-align: center;}
#thanksPage .container > div {order: 2;}
#thanksPage .container > div h1 {margin-bottom: 60px; color: #0067AF; font-size: 30px; font-weight: 700; line-height: 1.4;}
#thanksPage .container > div p {color: #0067AF; font-weight: 500; line-height: 1.8;}
#thanksPage .container > div a {position: relative; display: block; width: 260px; margin: 60px auto; color: #0067AF; font-weight: 500;}
#thanksPage .container > div a::before, #thanksPage .container > div a::after {content: '・';}
#thanksPage .container > div a span {text-decoration: underline; text-underline-offset: 0.3em;}
#thanksPage .container img {order: 1; width: 300px; margin: 120px auto 30px;}
@media (min-width: 1230px) {
}
@media (max-width: 1229px) {
}
@media (max-width: 1229px) and (min-width: 992px) {
  #thanksPage .container > div h1 {margin-bottom: 50px; font-size: 24px;}
  #thanksPage .container > div a {margin: 50px auto;}
  #thanksPage .container img {width: 240px; margin: 100px auto 25px;}
}
@media (min-width: 992px) {
}
@media (max-width: 991px) {
  #thanksPage .container > div h1 {font-size: 20px;}
  #thanksPage .container img {width: 200px;}
}
@media (max-width: 991px) and (min-width: 768px) {
  #thanksPage .container > div h1 {margin-bottom: 40px;}
  #thanksPage .container > div a {margin: 40px auto;}
  #thanksPage .container img {margin: 80px auto 20px;}
}
@media (min-width: 768px) {
}
@media (max-width: 767px) {
  #thanksPage .container > div h1 {margin-bottom: 30px;}
  #thanksPage .container > div p {text-align: left;}
  #thanksPage .container > div a {margin: 30px auto;}
  #thanksPage .container img {margin: 60px auto 15px;}
}
@media (max-width: 360px) {
  #thanksPage .container > div h1 {font-size: 16px;}
}