@charset "UTF-8";

* {
  font-family: "futura-pt", "Zen Kaku Gothic New", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
}

#index{
  width: 100%;
}
/* -----------------------------------------------

header

----------------------------------------------- */
header{
  position: relative;
  background: #eaeaea;
}
header picture{
  display: block;
  width: 100%;
  max-width: 1366px;
  margin: auto;
  text-align: center;
}
header .topbar{
  position: absolute;
  top: 0;
  z-index: 1;
  width: 100%;
  background-color: rgba(58, 201, 235, 0.9);
  mix-blend-mode: multiply;
}
header .topbar h1{
  width: 100%;
  max-width: 750px;
  margin: auto;
  font-size: calc(1rem + 3vw);
  color: #ffffff;
  padding: 3%;
}
header .topbar h1 a {
  color: inherit !important;
}
@media screen and (min-width:750px) and ( max-width:1366px) {
    /*　画面サイズが750pxから1366pxまで　*/
    header .topbar h1{
      max-width: 1366px;
      font-size: calc(1rem + 2.2vw);
      padding: 2%;
    }
}
@media screen and (min-width:1366px) {
    /*　画面サイズが1366pxから　*/
    header .topbar h1{
      width: 100%;
      max-width: 1366px;
      font-size: 3rem;
      padding: 25px 25px 25px 25px;
    }
}

header .fv{
  position: absolute;
  top: 0;
  width: 100%;
}
header ul.icon{
  position: absolute;
  top: 14%;
  left: 5%;
  width: 30%;
  z-index: 10;
}
header ul.icon li{
  margin-bottom: calc(10px + 5vw);
  color: #ffffff;
}
header ul.icon li:nth-child(2){
  margin-bottom: 0;
}
header ul.icon li .let{
  width: 70%;
  margin: -78% 0 0 16%;
  color: #ffffff;
  text-align: center;
}
header ul.icon li .let span.top{
  display: block;
  font-size: calc(0.2rem + 2vw);
}
header ul.icon li .let span.bottom{
  font-size: calc(0.2rem + 5.4vw);
}
@media screen and (min-width:750px) and ( max-width:1366px) {
    /*　画面サイズが750pxから1366pxまで　*/
    header ul.icon{
      top: 10%;
      left: 62%;
      width: 14.6%;
    }
    header ul.icon li{
      margin-bottom: calc(10px + 2.5vw);
    }
    header ul.icon li .let{
      width: 70%;
      margin: -79% 0 0 16%;
    }
    header ul.icon li .let span.top{
      font-size: calc(0.2rem + 1.2vw);
    }
    header ul.icon li .let span.bottom{
      font-size: calc(0.2rem + 2.8vw);
    }
}
@media screen and (min-width:1366px) {
    /*　画面サイズが1366pxから　*/
    header::before,
    header::after{
        content: "";
        position: absolute;
        display: block;
        top: 0%;
        height: 100%;
        width: 150px;
    }
    header::before{
        left: 50%;
        margin-left: -700px;
        background: linear-gradient(270deg, rgba(234, 234, 234, 0) 0%, rgba(234, 234, 234, 1) 100%);
    }
    header::after{
        right: 50%;
        margin-right: -700px;
        background: linear-gradient(90deg, rgba(234, 234, 234, 0) 0%, rgba(234, 234, 234, 1) 100%);
    }
    header ul.icon{
      top: 60px;
      left: calc(50% + 160px);
      width: 200px;
    }
    header ul.icon li{
      margin-bottom: 40px;
    }
    header ul.icon li .let{
      width: 140px;
      margin: -155px 0 0 30px;
    }
    header ul.icon li .let span.top{
      font-size: 1.2rem;
    }
    header ul.icon li .let span.bottom{
      font-size: 2.6rem;
    }
}

header .head .balloon {
  position: absolute;
  top: 68%;
  left: 32.5%;
  display: block;
  margin: auto;
  padding: 1%;
  width: 36%;
  font-size: calc(0.2rem + 5.5vw);
  color: #ffffff;
  text-align: center;
  background-color: #3ac9eb;
  border: 1px solid #3ec9eb;
  border-radius: 30px;
}
header .head .balloon .jidai{
  font-size: calc(0.2rem + 4.5vw);
}
header .head .balloon::before {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -10px;
  border: 10px solid transparent;
  border-top: 15px solid #3ac9eb;
}

header .head  h3 {
  position: absolute;
  top: 78%;
  width: 100%;
  margin: auto;
  text-align: center;
  font-size: calc(0.2rem + 9.5vw);
  text-shadow: 0px 0px 3px #3ac9eb, 0px 0px 5px #3ac9eb, 0 0 10px #3ac9eb, 0 0 15px #3ac9eb;
  color: #ffffff;
}
header .head h2 {
  position: absolute;
  top: 90%;
  left: 10%;
  width: 80%;
  margin: auto;
  padding: 1%;
  background-color: #ffffff;
  text-align: center;
  font-size: calc(0.2rem + 4vw);
  color: #000000;
  line-height: 1.5;
  border-radius: 10px;
}
@media screen and (min-width:750px) and ( max-width:1366px) {
    /*　画面サイズが750pxから1366pxまで　*/
    header .head .balloon {
      top: 25%;
      left: 5%;
      padding: 0.2%;
      width: 29%;
      font-size: calc(0.2rem + 4.8vw);
      border-radius: 50px;
    }
    header .head .balloon .jidai{
      font-size: calc(0.2rem + 3.8vw);
    }
    header .head .balloon small{
      font-size: calc(0.2rem + 2.8vw);
    }
    header .head .balloon::before {
      top: 100%;
      left: 50%;
      margin-left: -10px;
      border: 10px solid transparent;
      border-top: 15px solid #3ac9eb;
    }
    header .head  h3 {
      top: 41%;
      left: 3%;
      width: 35%;
      margin: 0;
      font-size: calc(0.2rem + 7.5vw);
    }
    header .head h2 {
      top: 81%;
      left: 3.5%;
      width: 53%;
      margin: 0;
      padding: 1% 0% 0.5% 0%;
      font-size: calc(0.2rem + 3vw);
      border-radius: 15px;
    }
}
@media screen and (min-width:1366px) {
    /*　画面サイズが1366pxから　*/
    header .head .balloon {
      top: 25%;
      left: calc(50% - 620px);
      padding: 0 0 0 0;
      width: 400px;
      font-size: 4.5rem;
      border-radius: 50px;
    }
    header .head .balloon .jidai{
      font-size: 3.5rem;
    }
    header .head .balloon small{
      font-size: 2.8rem;
    }
    header .head .balloon::before {
      top: 100%;
      left: 50%;
      margin-left: -10px;
      border: 10px solid transparent;
      border-top: 15px solid #3ac9eb;
    }
    header .head  h3 {
      top: 41%;
      left: calc(50% - 650px);
      width: 500px;
      margin: 0;
      font-size: 6.5rem;
    }
    header .head h2 {
      top: 81%;
      left: calc(50% - 630px);
      width: 720px;
      margin: 0;
      padding: 12px 0px 8px 0px;
      font-size: 2.8rem;
      border-radius: 15px;
    }
}
/* -----------------------------------------------

article

----------------------------------------------- */
section.solution {
  position: relative;
  width: 100%;
  margin: 0 0 0 0;
  padding: 3% 0 0 0;
  background-color: #3ac9eb;
}
section.solution ul {
  display: flex;
  justify-content: space-around;
}
section.solution ul li{
  position: relative;
  display: inline-block;
  width: 46%;
  margin: 0;
  padding: 3% 1% 3% 1%;
  background-color: #ffffff;
  text-align: center;
  line-height: 1.5;
  font-size: calc(0.2rem + 3.5vw);
  color: #000000;
  border: 1px solid #ffffff;
  border-radius: 60px;
}
section.solution ul li span{
  text-decoration: underline wavy #ffe97a; /* 線、スタイル、色 */
  text-underline-offset: 5px;  /* 文字と線の間隔 */
}
section.solution ul li.hidari::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 75%;
  border-style: solid;
  border-width: 20px 20px 0 0;
  border-color: #ffffff transparent transparent;
  translate: -50% 100%;
  transform: skew(-25deg);
  transform-origin: top;
}
section.solution ul li.migi::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 25%;
  border-style: solid;
  border-width: 20px 20px 0 0;
  border-color: #ffffff transparent transparent;
  translate: -50% 100%;
  transform: skew(55deg);
  transform-origin: top;
}

section.solution h3{
  width: 80%;
  margin: auto;
  padding: 5% 0 10% 0;
  text-align: center;
  color: #ffffff;
  line-height: 1.5;
  font-size: calc(0.2rem + 4.5vw);
  font-weight: bold;
}
section.solution h3 span{
  color: #ffe97a;
  line-height: 1.5;
  font-size: calc(0.2rem + 6.5vw);
  font-weight: bold;
}
section.solution div.man{
  position: absolute;
  bottom: -2%;
  left: 4%;
  width: 25%;
}
section.solution div.woman{
  position: absolute;
  bottom: -2%;
  right: 4%;
  width: 25%;
}
@media screen and (min-width:750px) and ( max-width:1366px) {
    /*　画面サイズが750pxから1366pxまで　*/
    section.solution ul {
      width: 72%;
      margin: auto;
    }
    section.solution ul li{
      width: 46%;
      margin: 0;
      padding: 4% 1% 4% 1%;
      font-size: calc(0.2rem + 2.8vw);
      font-weight: bold;
      border-radius: 90px;
      line-height: 1.3;
    }
    section.solution ul li span{
      text-underline-offset: 10px;  /* 文字と線の間隔 */
      font-weight: bold;
    }
    section.solution ul li.hidari::after {
      left: 75%;
      border-width: 30px 40px 0 0;
      translate: -50% 100%;
      transform: skew(-25deg);
    }
    section.solution ul li.migi::after {
      left: 30%;
      border-width: 30px 40px 0 0;
      translate: -50% 100%;
      transform: skew(60deg);
    }
    section.solution h3{
      width: 80%;
      padding: 5% 0 10% 0;
      line-height: 1.3;
      font-size: calc(0.2rem + 3.5vw);
      font-weight: bold;
    }
    section.solution h3 span{
      line-height: 1.4;
      font-size: calc(0.2rem + 5vw);
      font-weight: bold;
    }
    section.solution div.man{
      bottom: -3%;
      left: 8%;
      width: 33%;
    }
    section.solution div.woman{
      bottom: -3%;
      right: 9%;
      width: 33%;
    }
}
@media screen and (min-width:1366px) {
    /*　画面サイズが1366pxから　*/
    section.solution ul {
      width: 1000px;
      margin: auto;
    }
    section.solution ul li{
      width: 46%;
      margin: 0;
      padding: 4% 1% 4% 1%;
      font-size: 2.6rem;
      font-weight: bold;
      border-radius: 90px;
      line-height: 1.3;
    }
    section.solution ul li span{
      text-underline-offset: 10px;  /* 文字と線の間隔 */
      font-weight: bold;
    }
    section.solution ul li.hidari::after {
      left: 75%;
      border-width: 30px 40px 0 0;
      translate: -50% 100%;
      transform: skew(-25deg);
    }
    section.solution ul li.migi::after {
      left: 30%;
      border-width: 30px 40px 0 0;
      translate: -50% 100%;
      transform: skew(60deg);
    }
    section.solution h3{
      width: 80%;
      padding: 5% 0 10% 0;
      line-height: 1.3;
      font-size: 3.2rem;
      font-weight: bold;
    }
    section.solution h3 span{
      line-height: 1.4;
      font-size: 4.4rem;
      font-weight: bold;
    }
    section.solution div.man{
      bottom: -3%;
      left: calc(50% - 570px);
      width: 450px;
    }
    section.solution div.woman{
      bottom: -3%;
      right: calc(50% - 560px);
      width: 450px;
    }
}
/* ----- hand ------------------------------ */
section.hand {
  position: relative;
  width: 92%;
  max-width: 750px;
  margin: -5% 0 0 0;
  z-index: 10;
  overflow: hidden;
}
section.hand .smartphone{
  width: 100%;
  z-index: 100;
}
section.hand .smartphone img{
  position: relative;
  width: 100%;
  z-index: 50;
}

@media screen and (min-width:750px) and ( max-width:1366px) {
    /*　画面サイズが750pxから1366pxまで　*/
    section.hand {
      position: absolute;
      top: calc(0.9% + 3.6vw);
      right: 0%;
      width: 40%;
      margin: 0 auto;
      z-index: 5;
      overflow: hidden;
    }
    section.hand .smartphone {
      width: 115%;
    }
}
@media screen and (min-width:1366px) {
    /*　画面サイズが1366pxから　*/
    section.hand {
      position: absolute;
      top: 60px;
      left: calc(50% + 160px);
      width: 522px;
      margin: 0 0 0 0;
      z-index: 5;
    }
    section.hand .smartphone {
      width: 120%;
    }
}
/* ----- approach ------------------------------ */
section.approach {
  width: 98%;
  margin: auto;
  padding: 5% 0 10% 0;
  text-align: center;
  line-height: 1.8;
  font-size: calc(0.2rem + 2.8vw);
}
@media screen and (min-width:750px) and ( max-width:1366px) {
    /*　画面サイズが750pxから1366pxまで　*/
    section.approach {
      width: 90%;
      padding: 5% 0 10% 0;
      font-size: calc(0.2rem + 1.6vw);
    }
}
@media screen and (min-width:1366px) {
    /*　画面サイズが1366pxから　*/
    section.approach {
      width: 1200px;
      padding: 5% 0 10% 0;
      font-size: 1.6rem;
    }
}
/* ----- service_link ------------------------------ */
section.service_link{
  position: relative;
  width: 100%;
  background-color: #e9f1f4;
}
section.service_link h2{
  position: absolute;
  top: -4.4%;
  left: 0;
  right: 0;
  color: #3ac9eb;
  text-align: center;
  font-style: oblique;
  font-size: calc(0.2rem + 12vw);
  mix-blend-mode: multiply;
}
section.service_link h3{
  padding: 10% 0 5% 0;
  color: #000000;
  text-align: center;
  font-weight: bold;
  font-size: calc(0.2rem + 4.6vw);
}
section.service_link .video{
  width: 86%;
  margin: 0 auto 5%;
  overflow: hidden;
}
section.service_link .video video{
  transform: scale(1.01);
}
section.service_link p{
  width: 80%;
  margin: auto;
  padding: 0 0 5% 0;
  color: #000000;
  text-align: center;
  line-height: 1.5;
  font-weight: bold;
  font-size: calc(0.2rem + 3.6vw);
}
section.service_link ul.link{
  display: flex;
  flex-wrap: wrap;
  width: 80%;
  margin: auto;
  padding: 0 0 5% 0;
}
section.service_link ul.link li{
  width: 100%;
  margin: 0 0 10% 0;
}
section.service_link ul.link li div.image{
  position: absolute;
  width: 42%;
  z-index: 10;
}
section.service_link ul.link li div.let{
  width: 75%;
  margin: 15% 0 0 25%;
  background-color: #ffffff;
  border-radius: 20px;
}
section.service_link ul.link li div.let span.top1{
  display: block;
  padding: 6% 7% 0 0;
  color: #000000;
  text-align: right;
  line-height: 2;
  font-weight: bold;
  font-size: calc(0.2rem + 4vw);
}
section.service_link ul.link li div.let span.top2{
  display: block;
  padding: 6% 7% 0 0;
  color: #000000;
  text-align: right;
  line-height: 2;
  font-weight: bold;
  font-size: calc(0.2rem + 4vw);
}
section.service_link ul.link li div.let span.bottom1{
  display: block;
  padding: 0 6% 8% 0;
  text-align: right;
  color: #248bb4;
  font-weight: bold;
  font-size: calc(0.2rem + 8vw);
}
section.service_link ul.link li div.let span.bottom1::before{
  content:">>";
  font-size:calc(0.2rem + 5vw);
  color: #000000;
  padding: 0 1rem 0 0;
}
section.service_link ul.link li div.let span.bottom2{
  display: block;
  padding: 0 6% 8% 0;
  text-align: right;
  color: #003787;
  font-weight: bold;
  font-size: calc(0.2rem + 8vw);
}
section.service_link ul.link li div.let span.bottom2::before{
  content:">>";
  font-size:calc(0.2rem + 5vw);
  color: #000000;
  padding: 0 1rem 0 0;
}
@media screen and (min-width:750px) and ( max-width:1366px) {
    /*　画面サイズが750pxから1366pxまで　*/
    section.service_link h2{
      top: -6.8%;
      font-size: calc(0.2rem + 9vw);
    }
    section.service_link h3{
      padding: 8% 0 3% 0;
      font-size: calc(0.2rem + 2.5vw);
    }
    section.service_link .video{
      width: 73.2%;
      margin: 0 auto 3%;
    }
    section.service_link p{
      width: 73.2%;
      padding: 0 0 2% 0;
      font-size: calc(0.2rem + 2vw);
    }
    section.service_link ul.link{
      flex-wrap: nowrap;
      justify-content: space-between;
      width: 73.2%;
      margin: auto;
      padding: 0 0 2% 0;
    }
    section.service_link ul.link li{
      width: 100%;
      margin: 0 0 5% 0;
    }
    section.service_link ul.link li:nth-child(2){
      margin-left: 2%;
    }
    section.service_link ul.link li div.image{
      width: 20%;
    }
    section.service_link ul.link li div.let{
      width: 80%;
      margin: 18% 0 0 20%;
      border-radius: 20px;
    }
    section.service_link ul.link li div.let span.top1{
      padding: 6% 7% 0 0;
      line-height: 2;
      font-size: calc(0.2rem + 1.8vw);
    }
    section.service_link ul.link li div.let span.top2{
      padding: 6% 7% 0 0;
      line-height: 2;
      font-size: calc(0.2rem + 1.8vw);
      letter-spacing: 0.3rem;
    }
    section.service_link ul.link li div.let span.bottom1{
      padding: 0 6% 8% 0;
      font-size: calc(0.2rem + 3.8vw);
    }
    section.service_link ul.link li div.let span.bottom1::before{
      font-size:calc(0.2rem + 1.8vw);
      padding: 0 1rem 0 0;
    }
    section.service_link ul.link li div.let span.bottom2{
      padding: 0 6% 8% 0;
      font-size: calc(0.2rem + 3.8vw);
    }
    section.service_link ul.link li div.let span.bottom2::before{
      font-size:calc(0.2rem + 2vw);
      padding: 0 1rem 0 0;
    }
}
@media screen and (min-width:1366px) {
    /*　画面サイズが1366pxから　*/
    section.service_link h2{
      top: -6.7%;
      font-size: 8rem;
    }
    section.service_link h3{
      width: 1366px;
      margin: auto;
      padding: 8% 0 3% 0;
      font-size: 2.4rem;
    }
    section.service_link .video{
      width: 1000px;
      margin: 0 auto 3%;
    }
    section.service_link p{
      width: 1000px;
      padding: 0 0 2% 0;
      font-size: 1.9rem;
    }
    section.service_link ul.link{
      flex-wrap: nowrap;
      justify-content: space-between;
      width: 1000px;
      margin: auto;
      padding: 0 0 2% 0;
    }
    section.service_link ul.link li{
      width: 100%;
      margin: 0 0 5% 0;
    }
    section.service_link ul.link li:nth-child(2){
      margin-left: 2%;
    }
    section.service_link ul.link li div.image{
      width: 270px;
    }
    section.service_link ul.link li div.let{
      width: 390px;
      margin: 85px 0 0 100px;
      border-radius: 20px;
    }
    section.service_link ul.link li div.let span.top1{
      padding: 6% 7% 0 0;
      line-height: 2;
      font-size: 1.7rem;
    }
    section.service_link ul.link li div.let span.top2{
      padding: 6% 7% 0 0;
      line-height: 2;
      font-size: 1.7rem;
      letter-spacing: 0.3rem;
    }
    section.service_link ul.link li div.let span.bottom1{
      padding: 0 6% 8% 0;
      font-size:3.4rem;
    }
    section.service_link ul.link li div.let span.bottom1::before{
      font-size:1.8rem;
      padding: 0 1rem 0 0;
    }
    section.service_link ul.link li div.let span.bottom2{
      padding: 0 6% 8% 0;
      font-size:3.4rem;
    }
    section.service_link ul.link li div.let span.bottom2::before{
      font-size:1.8rem;
      padding: 0 1rem 0 0;
    }
}
/* ----- service sns------------------------------ */
section.service{
  position: relative;
  width: 100%;
  margin-bottom: 10%;
  padding-bottom: 0;
  background-color: #e9f1f4;
}

section.service div.cont{
  width: 86%;
  margin: auto;
  background-color: #ffffff;
}
section.service .sns .head{
  display: flex;
  width: 100%;
  background-color: #248bb4;
  position: relative;
}
section.service .sns .head .icon{
  position: absolute;
  bottom: 0px;
  width: 33%;
}
section.service .sns .head h2{
  width: 100%;
  padding: 1%;
  background-color: #248bb4;
  color: #ffffff;
}
section.service .sns .head h2 .top{
  width: 65%;
  margin: 3% 0 0 35%;
  font-size: calc(0.2rem + 5vw);
}
section.service .sns .head h2 .bottom{
  width: 65%;
  margin: 0% 0 0 35%;
  font-size: calc(0.2rem + 14vw);
}
section.service .sns .head h2 .bottom span{
  font-size: calc(0.2rem + 12vw);
}
section.service .sns p{
  width: 90%;
  margin: 5% auto 0 auto;
  text-align: justify;
  line-height: 1.8;
  font-size: calc(0.2rem + 2.9vw);
}
section.service .sns p span.spacer{
  display: block;
  height: 1rem;
}
section.service .sns h3{
  position: relative;
  width: 90%;
  margin: 5% auto 0 auto;
  background-color: #248bb4;
  color: #ffffff;
  line-height: 2;
  text-align: center;
  font-size: calc(0.2rem + 5vw);
  border-radius: 15px;
  border: 1px solid #248bb4;
}
section.service .sns h3::before {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -10px;
  border: 10px solid transparent;
  border-top: 15px solid #248bb4;
}
section.service .sns h3 span{
  font-size: calc(0.2rem + 6vw);
}
section.service .sns dl{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  width: 90%;
  margin: 8% auto 0% auto;
}
section.service .sns dl div{
  width: calc(90% / 2);
}
section.service .sns dl dt{
  display: flex;
  justify-content: center;
  align-items: center;
  padding-top: 5%;
  width: 100%;
  aspect-ratio: 1 / 1;
  border-radius: 100%;
  font-size: calc(0.2rem + 3.4vw);
  border: 2px solid #248bb4;
  text-align: center;
  line-height: 1.5;
}
section.service .sns dl dd{
  width: 100%;
  padding:  10% 0 0 0;
  text-align: justify;
  line-height: 1.5;
  font-size: calc(0.2rem + 3.2vw);
}
section.service .sns .image{
  width: 100%;
  margin-bottom: 10%;
}
@media screen and (min-width:750px) and ( max-width:1366px) {
    /*　画面サイズが750pxから1366pxまで　*/
    section.service{
      margin-bottom: 0;
      padding-bottom: 10%;
    }
    section.service div.cont{
      width: 73.2%;
    }
    section.service .sns .head{
      display: flex;
      width: 100%;
    }
    section.service .sns .head .icon{
      position: absolute;
      width: 20%;
      padding: 0 0 0 1%;
    }
    section.service .sns .head h2{
      width: 100%;
    }
    section.service .sns .head h2 .top{
      width: 100%;
      margin: 3% auto 0 auto;
      text-align: center;
      font-size: calc(0.2rem + 2.6vw);
    }
    section.service .sns .head h2 .bottom{
      width: 100%;
      margin: 0 auto 0 auto;
      text-align: center;
      font-size: calc(0.2rem + 6vw);
    }
    section.service .sns .head h2 .bottom span{
      font-size: calc(0.2rem + 5vw);
    }
    section.service .sns p{
      width: 80%;
      margin: 4% auto 0 auto;
      line-height: 1.8;
      font-size: calc(0.2rem + 1.4vw);
    }
    section.service .sns p span.spacer{
      display: block;
      height: 1rem;
    }
    section.service .sns h3{
      width: 40%;
      margin: 2% auto 0 auto;
      line-height: 2;
      font-size: calc(0.2rem + 2vw);
      border-radius: 15px;
    }
    section.service .sns h3::before {
      margin-left: -10px;
      border: 10px solid transparent;
      border-top: 15px solid #248bb4;
    }
    section.service .sns h3 span{
      font-size: calc(0.2rem + 2.4vw);
    }
    section.service .sns dl{
      flex-wrap: nowrap;
      justify-content: space-around;
      width: 80%;
      margin: 3% auto 0% auto;
    }
    section.service .sns dl div{
      width: calc(90% / 4);
    }
    section.service .sns dl dt{
      display: flex;
      justify-content: center;
      align-items: center;
      width: 100%;
      border-radius: 100%;
      font-size: calc(0.2rem + 1.3vw);
      border: 2px solid #248bb4;
      text-align: center;
      line-height: 1.5;
    }
    section.service .sns dl dd{
      width: 100%;
      padding:  10% 0 0 0;
      line-height: 1.5;
      font-size: calc(0.2rem + 1.2vw);
    }
}
@media screen and (min-width:1366px) {
    /*　画面サイズが1366pxから　*/
    section.service{
      margin-bottom: 0;
      padding-bottom: 30px;
    }
    section.service #sns,
    section.service #attract{
      padding-top: 60px;
      margin-top: -60px;
      pointer-events: none;
    }
    section.service div.cont{
      width: 1000px;
    }
    section.service .sns .head{
      width: 1000px;
    }
    section.service .sns .head .icon{
      position: absolute;
      width: 270px;
      padding: 0 0 0 1%;
    }
    section.service .sns .head h2{
      width: 100%;
    }
    section.service .sns .head h2 .top{
      width: 100%;
      margin: 30px auto 0 auto;
      text-align: center;
      font-size: 2.4rem;
    }
    section.service .sns .head h2 .bottom{
      width: 100%;
      margin: 0 auto;
      text-align: center;
      font-size: 5.2rem;
    }
    section.service .sns .head h2 .bottom span{
      font-size: 4.4rem;
    }
    section.service .sns p{
      width: 80%;
      margin: 4% auto 0 auto;
      line-height: 1.8;
      font-size: 1.4rem;
    }
    section.service .sns p span.spacer{
      height: 1rem;
    }
    section.service .sns h3{
      width: 40%;
      margin: 20px auto 0 auto;
      line-height: 2;
      font-size: 1.9rem;
      border-radius: 15px;
    }
    section.service .sns h3::before {
      margin-left: -10px;
      border: 10px solid transparent;
      border-top: 15px solid #248bb4;
    }
    section.service .sns h3 span{
      font-size: 2.2rem;
    }
    section.service .sns dl{
      flex-wrap: nowrap;
      justify-content: space-around;
      width: 80%;
      margin: 30px auto 0 auto;
    }
    section.service .sns dl div{
      width: calc(90% / 4);
    }
    section.service .sns dl dt{
      font-size: 1.4rem;
    }
    section.service .sns dl dd{
      width: 100%;
      padding: 20px 0 0 0;
      line-height: 1.5;
      font-size: 1.2rem;
    }
    section.service .sns .image{
      margin-bottom: 100px;
    }
}
/* ----- service attract------------------------------ */
section.service .attract .head{
  display: flex;
  width: 100%;
  background-color: #003787;
  position: relative;
}
section.service .attract .head .icon{
  position: absolute;
  bottom: 0px;
  right: 2%;
  width: 32%;
}
section.service .attract .head h2{
  width: 100%;
  background-color: #003787;
  color: #ffffff;
}
section.service .attract .head h2 .top{
  width: 70%;
  margin: 4% 0 0 4%;
  font-size: calc(0.2rem + 5vw);
}
section.service .attract .head h2 .bottom{
  width: 70%;
  margin: 0 0 3% 4%;
  font-size: calc(0.2rem + 12vw);
}
section.service .attract p{
  width: 90%;
  margin: 5% auto 0 auto;
  line-height: 1.8;
  font-size: calc(0.2rem + 2.9vw);
}
section.service .attract p span.spacer{
  display: block;
  height: 1rem;
}
section.service .attract h3{
  position: relative;
  width: 90%;
  margin: 5% auto 0 auto;
  background-color: #003787;
  color: #ffffff;
  line-height: 2;
  text-align: center;
  font-size: calc(0.2rem + 5vw);
  border-radius: 15px;
  border: 1px solid #003787;
}
section.service .attract h3::before {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -10px;
  border: 10px solid transparent;
  border-top: 15px solid #003787;
}
section.service .attract h3 span{
  font-size: calc(0.2rem + 6vw);
}
section.service .attract dl{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  width: 90%;
  margin: 8% auto 0% auto;
}
section.service .attract dl div{
  width: calc(90% / 2);
}
section.service .attract dl dt{
  display: flex;
  justify-content: center;
  align-items: center;
  padding-top: 5%;
  width: 100%;
  aspect-ratio: 1 / 1;
  border-radius: 100%;
  font-size: calc(0.2rem + 3.4vw);
  border: 2px solid #003787;
  text-align: center;
  line-height: 1.5;
}
section.service .attract dl dd{
  width: 100%;
  padding:  10% 0 5% 0;
  text-align: justify;
  line-height: 1.5;
  font-size: calc(0.2rem + 3.2vw);
}
section.service .attract .image{
  width: 100%;
  margin-bottom: 10%;
}
@media screen and (min-width:750px) and ( max-width:1366px) {
    /*　画面サイズが750pxから1366pxまで　*/
    section.service .attract .head{
      display: flex;
      width: 100%;
    }
    section.service .attract .head .icon{
      position: absolute;
      right: 16%;
      width: 18%;
    }
    section.service .attract .head h2{
      width: 100%;
    }
    section.service .attract .head h2 .top{
      width: 100%;
      margin: 3% auto 0 auto;
      text-align: center;
      font-size: calc(0.2rem + 2.6vw);
    }
    section.service .attract .head h2 .bottom{
      width: 100%;
      margin: 0 auto 3% auto;
      text-align: center;
      font-size: calc(0.2rem + 5vw);
    }
    section.service .attract p{
      width: 80%;
      margin: 4% auto 0 auto;
      line-height: 1.8;
      font-size: calc(0.2rem + 1.4vw);
    }
    section.service .attract p span.spacer{
      display: block;
      height: 1rem;
    }
    section.service .attract h3{
      width: 40%;
      margin: 2% auto 0 auto;
      line-height: 2;
      font-size: calc(0.2rem + 2vw);
      border-radius: 15px;
    }
    section.service .attract h3::before {
      margin-left: -10px;
      border: 10px solid transparent;
      border-top: 15px solid #003787;
    }
    section.service .attract h3 span{
      font-size: calc(0.2rem + 2.4vw);
    }
    section.service .attract dl{
      flex-wrap: nowrap;
      justify-content: space-around;
      width: 80%;
      margin: 3% auto 0% auto;
    }
    section.service .attract dl div{
      width: calc(90% / 4);
    }
    section.service .attract dl dt{
      display: flex;
      justify-content: center;
      align-items: center;
      width: 100%;
      border-radius: 100%;
      font-size: calc(0.2rem + 1.3vw);
      border: 2px solid #003787;
      text-align: center;
      line-height: 1.5;
    }
    section.service .attract dl dd{
      width: 100%;
      padding:  10% 0 0 0;
      line-height: 1.5;
      font-size: calc(0.2rem + 1.2vw);
    }
    section.service .attract .image{
      margin-bottom: 0%;
    }
}
@media screen and (min-width:1366px) {
    /*　画面サイズが1366pxから　*/
    section.service .attract .head{
      width: 1000px;
    }
    section.service .attract .head .icon{
      position: absolute;
      right: calc(50% - 462px);
      width: 246px;
    }
    section.service .attract .head h2{
      width: 100%;
    }
    section.service .attract .head h2 .top{
      width: 100%;
      margin: 30px auto 0 auto;
      text-align: center;
      font-size: 2.4rem;
    }
    section.service .attract .head h2 .bottom{
      width: 100%;
      margin: 0 auto 30px auto;
      text-align: center;
      font-size: 4.4rem;
    }
    section.service .attract p{
      width: 80%;
      margin: 4% auto 0 auto;
      line-height: 1.8;
      font-size: 1.4rem;
    }
    section.service .attract p span.spacer{
      height: 1rem;
    }
    section.service .attract h3{
      width: 40%;
      margin: 20px auto 0 auto;
      line-height: 2;
      font-size: 1.9rem;
      border-radius: 15px;
    }
    section.service .attract h3::before {
      margin-left: -10px;
      border: 10px solid transparent;
      border-top: 15px solid #003787;
    }
    section.service .attract h3 span{
      font-size: 2.2rem;
    }
    section.service .attract dl{
      flex-wrap: nowrap;
      justify-content: space-around;
      width: 80%;
      margin: 30px auto 0 auto;
    }
    section.service .attract dl div{
      width: calc(90% / 4);
    }
    section.service .attract dl dt{
      font-size: 1.4rem;
    }
    section.service .attract dl dd{
      width: 100%;
      padding: 20px 0 0 0;
      line-height: 1.5;
      font-size: 1.2rem;
    }
    section.service .attract .image{
      margin-bottom: 100px;
    }
}
/* ----- service go_contact ------------------------------ */
section.service .go_contact{
  width: 82%;
  margin: auto;
  padding-bottom: 13%;
}
section.service .go_contact a .contact_btn{
  width: 100%;
  background-color: #ffe97a;
  border-radius: 50px;
  line-height: 2.5;
  text-align: center;
  font-size: calc(0.2rem + 4.8vw)
}
section.service .go_contact a .contact_btn::after{
  content: ">";
  margin-left: 1rem;
}
@media screen and (min-width:750px) and ( max-width:1366px) {
    /*　画面サイズが750pxから1366pxまで　*/
    section.service .go_contact{
      display: none;
    }
}
@media screen and (min-width:1366px) {
    /*　画面サイズが1366pxから　*/
    section.service .go_contact{
      display: none;
    }
}
/* ----- achievements ------------------------------ */
section.achievements{
  position: relative;
  width: 100%;
  padding: 0 0 10% 0;
  background-color: #ffffff;
}
section.achievements h2{
  position: absolute;
  top: -14.4%;
  left: 0;
  right: 0;
  color: #33ccff;
  opacity: 0.9;
  text-align: center;
  font-style: oblique;
  font-size: calc(0.2rem + 12vw);
  mix-blend-mode: multiply;
}
section.achievements h3{
  padding: 0 0 5% 0;
  color: #000000;
  text-align: center;
  font-weight: bold;
  font-size: calc(0.2rem + 4.6vw);
}
section.achievements .slider .balloon{
  position: relative;
  width: 80%;
  margin: 5% auto 0 auto;
  background-color: #ffe97a;
  color: #000000;
  line-height: 2;
  text-align: center;
  font-size: calc(0.2rem + 5vw);
  border-radius: 30px;
  border: 1px solid #ffe97a;
}
section.achievements .slider .balloon::before {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -3px;
  border: 6px solid transparent;
  border-top: 10px solid #ffe97a;
}
section.achievements .slider .result{
  width: 80%;
  margin: auto;
  color: #000000;
  line-height: 2;
  text-align: center;
  font-size: calc(0.2rem + 5.2vw);
}
section.achievements .slider .result span{
  color: #3ac9eb;
}
section.achievements .slider .image{
  width: 80%;
  margin: auto;
}
section.achievements .slider .icon{
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 2%;
  margin: -1.2% 0 0 0.2%;
  border-radius: 100%;
  background-color: #248bb4;
  border: 2px solid #248bb4;
  text-align: center;
  line-height: 1.2;
  color: #ffffff;
  font-size: calc(0.2rem + 3vw);
  z-index: 10;
}
section.achievements .slider .icon::before{
  content: '';
  display: block;
  padding-top: 100%;
}
section.achievements .slider .navy{
  background-color: #003787;
  border: 2px solid #003787;
}
section.achievements .slider .name{
  width: 80%;
  margin: auto;
  padding: 10% 0 3% 0;
  text-align: center;
  border-bottom: dotted 5px #3ac9eb;
  font-size: calc(0.2rem + 4vw);
}
section.achievements .slider p{
  width: 80%;
  margin: auto;
  padding: 3% 0 10% 0;
  line-height: 1.8;
  font-size: calc(0.2rem + 2.8vw);
}
section.achievements .slider .slick-dots li button:before {
  content:'';
  width: 16px;
  height: 16px;
  border-radius: 8px;
  background: #000000;
  opacity: 1;
}
section.achievements .slider .slick-dots li.slick-active button:before{
  background: #ffe97a;
}
@media screen and (min-width:750px) and ( max-width:1366px) {
    /*　画面サイズが750pxから1366pxまで　*/
    section.achievements{
      padding: 5% 0 10% 0;
    }
    section.achievements h2{
      top: -10%;
      font-size: calc(0.2rem + 9vw);
    }
    section.achievements h3{
      padding: 0 0 3% 0;
      font-size: calc(0.2rem + 2.5vw);
    }
    section.achievements .slider .balloon{
      margin: 5% auto 0 auto;
      line-height: 2;
      font-size: calc(0.2rem + 2vw);
      border-radius: 30px;
      border: 1px solid #ffe97a;
    }
    section.achievements .slider .balloon::before {
      margin-left: -10px;
      border: 10px solid transparent;
      border-top: 16px solid #ffe97a;
    }
    section.achievements .slider .result{
      line-height: 2.5;
      font-size: calc(0.2rem + 2.2vw);
    }
    section.achievements .slider .icon{
      width: 1.8%;
      margin: -1.2% 0 0 0.2%;
      border-radius: 100%;
      line-height: 1.2;
      font-size: calc(0.2rem + 1.6vw);
    }
    section.achievements .slider .name{
      padding: 10% 0 3% 0;
      border-bottom: dotted 4px #3ac9eb;
      font-size: calc(0.2rem + 2vw);
    }
    section.achievements .slider p{
      padding: 3% 0 10% 0;
      line-height: 1.8;
      font-size: calc(0.2rem + 1.2vw);
    }
    section.achievements .slider .slick-dots li button:before {
      width: 16px;
      height: 16px;
      border-radius: 8px;
    }
}
@media screen and (min-width:1366px) {
    /*　画面サイズが1366pxから　*/
    section.achievements{
      padding: 100px 0 150px 0;
    }
    section.achievements h2{
      top: -80px;
      font-size: 8rem;
    }
    section.achievements h3{
      width: 100%;
      max-width: 1366px;
      margin: auto;
      padding: 0 0 3% 0;
      font-size: 2.4rem;
    }
    section.achievements .slider .balloon{
      margin: 5% auto 0 auto;
      line-height: 2;
      font-size: calc(0.2rem + 2vw);
      border-radius: 30px;
      border: 1px solid #ffe97a;
    }
    section.achievements .slider .balloon::before {
      margin-left: -10px;
      border: 10px solid transparent;
      border-top: 16px solid #ffe97a;
    }
    section.achievements .slider .result{
      line-height: 2.5;
      font-size: calc(0.2rem + 2.2vw);
    }
    section.achievements .slider .icon{
      width: 1.8%;
      margin: -1.2% 0 0 0.2%;
      border-radius: 100%;
      line-height: 1.2;
      font-size: calc(0.2rem + 1.6vw);
    }
    section.achievements .slider .name{
      padding: 10% 0 3% 0;
      border-bottom: dotted 4px #3ac9eb;
      font-size: calc(0.2rem + 2vw);
    }
    section.achievements .slider p{
      padding: 3% 0 10% 0;
      line-height: 1.8;
      font-size: calc(0.2rem + 1.2vw);
    }
    section.achievements .slider .slick-dots li button:before {
      width: 16px;
      height: 16px;
      border-radius: 8px;
    }
}
/* ----- flow ------------------------------ */
section.flow{
  position: relative;
  width: 100%;
  background-color: #3ac9eb;
}
section.flow h2{
  position: absolute;
  top: -3.8%;
  left: 0;
  right: 0;
  color: #33ccff;
  opacity: 0.9;
  text-align: center;
  font-style: oblique;
  font-size: calc(0.2rem + 12vw);
  mix-blend-mode: multiply;
}
section.flow h3{
  padding: 10% 0 12% 0;
  color: #000000;
  text-align: center;
  font-weight: bold;
  font-size: calc(0.2rem + 4.6vw);
}
section.flow dl{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}
section.flow dl div.flow_box{
  display: flex;
  justify-content: center;
  align-items: center;
  width: 80%;
  margin: auto;
  padding-bottom: 14%;
}
section.flow dl dt{
  display: flex;
  justify-content: center;
  align-items: center;
  padding-top: 5%;
  width: calc(90% / 2);
  aspect-ratio: 1 / 1;
  border-radius: 100%;
  border: 2px solid #ffffff;
  background-color: #ffffff;
  text-align: center;
  line-height: 1.2;
  color: #000000;
  font-size: calc(0.2rem + 4vw);
  position: relative;
}
section.flow dl dt .image{
  position: absolute;
  top: -10%;
  width: 42%;
  left: 50%;
  z-index: 1;
  transform: translateX(-50%);
}
section.flow dl dt::after{
  content: '';
  position: absolute;
  top: -50%;
  left: 50%;
  transform: translateX(-50%);
  width: 3px;
  height: 100%;
  background-color: #ffffff;
}
section.flow dl dt.flow_first::after{
  display: none;
}
section.flow dl dd{
  width: 44%;
  margin: auto;
  text-align: justify;
  line-height: 1.5;
  font-size: calc(0.2rem + 3vw);
}
@media screen and (min-width:750px) and ( max-width:1366px) {
    /*　画面サイズが750pxから1366pxまで　*/
    section.flow{
      width: 100%;
    }
    section.flow h2{
      top: -10%;
      font-size: calc(0.2rem + 9vw);
    }
    section.flow h3{
      padding: 8% 0 6% 0;
      font-size: calc(0.2rem + 2.5vw);
    }
    section.flow dl{
      display: flex;
      flex-wrap: nowrap;
      justify-content: center;
      align-items: flex-start;
      width: 73.2%;
      margin: 0 auto;
    }
    section.flow dl div.flow_box{
      display: block;
      align-items: flex-start;
      width: 100%;
      margin: 0 auto;
      padding-bottom: 10%;
    }
    section.flow dl dt{
      display: flex;
      justify-content: center;
      align-items: center;
      width: 80%;
      border-radius: 100%;
      border: 2px solid #ffffff;
      background-color: #ffffff;
      text-align: center;
      line-height: 1.2;
      color: #000000;
      font-size: calc(0.2rem + 1.6vw);
    }
    section.flow dl dt::after{
      top: 50%;
      left: -35%;
      transform: translateY(-50%);
      width: 5vw;
      height: 3px;
    }
    section.flow dl dd{
      width: 85%;
      margin: 8% 0 0 0;
      line-height: 1.5;
      font-size: calc(0.2rem + 1.5vw);
    }
}
@media screen and (min-width:1366px) {
    /*　画面サイズが1366pxから　*/
    section.flow h2{
      top: -12%;
      font-size: 8rem;
    }
    section.flow h3{
      width: 100%;
      max-width: 1366px;
      margin: auto;
      padding: 100px 0 70px 0;
      font-size: 2.4rem;
    }
    section.flow dl{
      display: flex;
      flex-wrap: nowrap;
      justify-content: center;
      align-items: flex-start;
      width: 1000px;
      margin: 0 auto;
    }
    section.flow dl div.flow_box{
      display: block;
      align-items: flex-start;
      width: 100%;
      margin: 0 auto;
      padding-bottom: 100px;
    }
    section.flow dl dt{
      width: 80%;
      line-height: 1.2;
      font-size: 1.6rem;
    }
    section.flow dl dt .image{
      position: absolute;
      top: -10%;
      width: 42%;
      left: 50%;
      z-index: 1;
      transform: translateX(-50%);
    }
    section.flow dl dt::after{
      top: 50%;
      left: -35%;
      transform: translateY(-50%);
      width: 90px;
      height: 3px;
    }
    section.flow dl dd{
      width: 85%;
      margin: 8% 0 0 0;
      line-height: 1.5;
      font-size: 1.5rem;
    }
}
/* ----- inquiry ------------------------------ */
section.inquiry{
  width: 100%;
  margin: auto;
}
section.inquiry h2{
  margin-top: -9%;
  color: #33ccff;
  opacity: 0.9;
  text-align: center;
  font-style: oblique;
  font-size: calc(0.2rem + 12vw);
  mix-blend-mode: multiply;
}
section.inquiry h3{
  color: #000000;
  margin-top: 5%;
  text-align: center;
  font-size: calc(0.2rem + 4.6vw);
  font-weight: bold;
}
section.inquiry .conflet{
  text-align: center;
  font-size: calc(0.2rem + 3.2vw);
  margin: 5%;
  line-height: 1.4em;
}
section.inquiry form{
  width: 90%;
  margin: 5% auto 10% auto;
}
section.inquiry form dl dt{
  padding: 0 0 0 1.2%;
  color: #000000;
  font-size: calc(0.2rem + 4vw);
  line-height: 1.8;
}
section.inquiry form dl dd{
  margin: 0 0 3% 0;
  background-color: #e9f1f4;
  border-radius: 15px;
}
section.inquiry form dl dd input{
  width: 100%;
  padding: 1.4% 4%;
  color: #000000;
  font-size: calc(0.2rem + 3vw);
  line-height:1.5;
  outline: none;
}
section.inquiry form dl dd textarea{
  width: 100%;
  padding: 1.4% 4%;
  color: #000000;
  font-size: calc(0.2rem + 3vw);
  line-height: 1.5;
  outline: none;
  resize: vertical;
  min-height: 100px;
}
section.inquiry form button{
  width: 100%;
  margin: 8% 0 0 0;
  padding: 2% 0 1% 0;
  background-color: #ffe97a;
  color: #000000;
  text-align: center;
  font-size: calc(0.2rem + 5vw);
  line-height: 2;
  border-radius: 40px;
}
@media screen and (min-width:750px) and ( max-width:1366px) {
    /*　画面サイズが750pxから1366pxまで　*/
    section.inquiry{
      width: 100%;
    }
    section.inquiry h2{
      font-size: calc(0.2rem + 9vw);
      margin-top: -6%;
    }
    section.inquiry h3{
      font-size: calc(0.2rem + 2.5vw);
    }
    section.inquiry .conflet{
      font-size: calc(0.2rem + 1.2vw);
    }
    section.inquiry form{
      width: 80%;
      margin: 5% auto 5% auto;
    }
    section.inquiry form dl{
      display: flex;
      justify-content: space-between;
      flex-wrap: wrap;
      width: 80%;
      margin: 5% auto 1% auto;
    }
    section.inquiry form dl dt{
      width: 23%;
      padding: 0 0 0 1.2%;
      font-size: calc(0.2rem + 1.2vw);
      line-height: 1.8;
    }
    section.inquiry form dl dd{
      width: 73%;
      margin: 0 0 3% 0;
      border-radius: 15px;
    }
    section.inquiry form dl dd input{
      font-size: calc(0.2rem + 1.2vw);
      line-height:1.5;
    }
    section.inquiry form dl dd textarea{
      font-size: calc(0.2rem + 1.2vw);
      line-height: 1.5;
    }
    section.inquiry form button{
      width: 35%;
      margin: 0 0 0 31%;
      padding: 1% 0 0.3% 0;
      font-size: calc(0.2rem + 1.5vw);
      line-height: 2;
      border-radius: 30px;
    }
    section.inquiry form button + button{
      margin: 2% 0 0 31%;
    }
}
@media screen and (min-width:1366px) {
    /*　画面サイズが1366pxから　*/
    section.inquiry{
      width: 100%;
      max-width: 1366px;
    }
    section.inquiry h2{
      font-size: 8rem;
      margin-top: -6%;
    }
    section.inquiry h3{
      font-size: 2.4rem;
    }
    section.inquiry .conflet{
      font-size: 1.2rem;
    }
    section.inquiry form{
      width: 1100px;
      margin: 5% auto 5% auto;
    }
    section.inquiry form dl{
      display: flex;
      justify-content: space-between;
      flex-wrap: wrap;
      width: 870px;
      margin: 5% auto 1% auto;
    }
    section.inquiry form dl dt{
      width: 23%;
      padding: 0 0 0 1.2%;
      font-size: 1.2rem;
      line-height: 1.8;
    }
    section.inquiry form dl dd{
      width: 73%;
      margin: 0 0 3% 0;
      border-radius: 15px;
    }
    section.inquiry form dl dd input{
      font-size: 1.2rem;
      line-height:1.5;
    }
    section.inquiry form dl dd textarea{
      font-size: 1.2rem;
      line-height: 1.5;
    }
    section.inquiry form button{
      width: 380px;
      margin: 0 0 0 345px;
      padding: 10px 0 3px 0;
      font-size: 1.5rem;
      line-height: 2;
      border-radius: 30px;
    }
    section.inquiry form button + button{
      margin: 20px 0 0 345px;
    }
}

/* -----------------------------------------------

footer

----------------------------------------------- */
footer{
  width: 100%;
  padding: 3% 0 3% 0;
  background-color: #3ac9eb;
}
footer div{
  max-width: 750px;
  margin: auto;
  padding: 0 1% 0 3%;
  font-size: calc(0.2rem + 2vw);
  color: #000000;
  line-height:2;
}
footer div.company{
  font-size: calc(0.2rem + 4vw);
}
@media screen and (min-width:750px) and ( max-width:1366px) {
    /*　画面サイズが750pxから1366pxまで　*/
    footer{
      padding: 1% 0 1% 0;
    }
    footer div{
      width: 100%;
      max-width: 1366px;
      padding: 0 1% 0 3%;
      font-size: calc(0.2rem + 1vw);
      line-height:1.6;
    }
    footer div.company{
      font-size: calc(0.2rem + 2vw);
    }
}
@media screen and (min-width:1366px) {
    /*　画面サイズが1366pxから　*/
    footer{
      padding: 14px 0 30px 0;
    }
    footer div{
      width: 100%;
      max-width: 1366px;
      padding: 0 10px 0 35px;
      font-size: 1.1rem;
      line-height:1.6;
    }
    footer div.company{
      font-size: 1.9rem;
    }
}