@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700;900&family=Open+Sans:wght@700&display=swap");

body {
  font-family: "Noto Sans JP", "Helvetica Neue", Arial, "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  color: #000;
  background-color: #fff;
  line-height: 1.5;
}

.container {
  margin: 0 auto;
  max-width: 750px;
  background-color: #fff;
}

/* ----- */

a.button {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 32px;
  line-height: 90px;
  padding: 0 40px;
  font-weight: 700;
  color: #003f98;
  white-space: nowrap;
  border: 1.5px solid #003f98;
  border-radius: 56px;
}

a.button:hover {
  /*text-decoration: none;*/
}

a.button:after {
  content: "";
  background: #003f98;
  height: 15px;
  width: 13px;
  -webkit-clip-path: polygon(50% 0, 100% 100%, 0 100%);
          clip-path: polygon(50% 0, 100% 100%, 0 100%);
  -webkit-clip-path: polygon(0 0, 100% 50%, 0 100%);
          clip-path: polygon(0 0, 100% 50%, 0 100%);
  position: absolute;
  right: 30px;
}

a.button-blue {
  background: #003f98;
  color: #fff;
  white-space: nowrap;
  border: 1px solid #003f98;
  border-radius: 56px;
}

a.button-blue:hover {
  text-decoration: none;
}

a.button-blue:after {
  content: "";
  background: #ffffff;
  height: 15px;
  width: 13px;
  -webkit-clip-path: polygon(50% 0, 100% 100%, 0 100%);
          clip-path: polygon(50% 0, 100% 100%, 0 100%);
  -webkit-clip-path: polygon(0 0, 100% 50%, 0 100%);
          clip-path: polygon(0 0, 100% 50%, 0 100%);
  position: absolute;
  right: 30px;
}

img {
  width: 100%;
}

@media all and (max-width: 750px) {
  a.button {
    font-size: 4.267vw;
    line-height: 12vw;
    padding: 0 5.333vw;
    border: 1.5px solid #003f98;
    border-radius: 7.467vw;
  }
  
  a.button:hover {
    text-decoration: none;
  }
  
  a.button:after {
    height: 2vw;
    width: 1.733vw;
    right: 4vw;
  }
  
  a.button-blue {
    border-radius: 7.467vw;
  }
  
  a.button-blue:after {
    height: 2vw;
    width: 1.733vw;
    right: 4vw;
  }
  
  img {
    width: 100%;
  }
}

/* ---------- ● kv ---------- */

#kv {
  padding: 50px 0 0;
}

#kv-feature {
  position: relative;
}

#kv .kv-image {
  max-width: 636px;
  margin: auto;
  padding: 0;
}

#kv .kv-note {
  font-size: 16px;
  max-width: 636px;
  margin: 40px auto;
  padding: 0 0 0 33px;
  text-align: left;
}

#kv .kv-text {
  font-size: 32px;
  text-align: center;
  font-weight: 700;
  margin: 0 0 40px;
}

#kv .img_top{
  padding-top: 40px;
}

#kv .kv-text a {
  text-decoration: underline;
  transition: .3s all;
}

#kv .kv-text a:hover {
  opacity: .5;
}

#kv .kv-text span {
  font-size: 20px;
}

#kv .kv-button {
  max-width: 512px;
  margin: 40px auto 60px;
}

@media all and (max-width: 750px) {
  #kv {
    padding: 6.667vw 0 0;
  }
  
  #kv .kv-image {
    max-width: 84.8vw;
  }
  
  #kv .kv-note {
    font-size: 3vw;
    max-width: 84.8vw;
    margin: 5.333vw auto;
    padding: 0 0 0 4.4vw;
  }
  
  #kv .kv-text {
    font-size: 4.267vw;
    margin: 0 0 5.333vw;
  }
  
  #kv .kv-text span {
    font-size: 2.8vw;
  }
  
  #kv .kv-button {
    max-width: 68.267vw;
    margin: 5.333vw auto 8vw;
  }
}

/* ---------- ● feature ---------- */

#feature {
  
  position: relative;
  overflow: visible;
  max-width: 636px;
  margin: auto;
}

#feature .items{
	padding: 20px;
}
#feature .img_top{
  padding-top: 40px;
}

#feature .img_buttom{
	padding-bottom: 150px;
}


#feature .feature-item__title-number {
  font-size: 70px;
  font-weight: 700;
  width: 120px;
  height: 120px;
  line-height: 120px;
  text-align: center;
  color: #fff;
  background: #004098;
  margin: 0 30px 0 0;
}

#feature .feature-item__title-text {
  margin: 20px 0 0;
}

#feature .feature-item__title-icon {
  position: absolute;
}

#feature .feature-item__image-logo {
  margin: auto;
}

#feature .feature-item__note_01 {
  font-size: 20px;
}

#feature .feature-item__note_02 {
  font-size: 16px;
}

#feature .feature-item__point {
  width: calc(100% - 40px);
  margin: 20px auto;
  border: 3px solid #009744;
  background: #fffbb2;
  border-radius: 20px;
  padding: 40px 30px;
}

#feature .feature-item__point-note p {
  font-size: 16px;
  text-indent: -1em;
  padding-left: 1em;
}

#feature .feature-item__list {
  display: flex;
}

#kv-feature .feature-sticky {
  display: flex;
  align-items: flex-end;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  height: 100%;
  width: 100%;
  z-index: 100;
  pointer-events: none;
}

#kv-feature .feature-sticky__inner {
	position: sticky;
    bottom: 0;
    width: 100%;
    background: white;
    padding: 20px 0 20px 0;
}
.feature-sticky__text {
    margin: 15px auto;
	text-align: center;
  	font-size: 22px;
  	font-weight: 700;
}

#kv-feature .feature-button {
  position: relative;
  background: white;
  width: 100%;
  padding: 0 50px;
  margin: auto;
  pointer-events:auto;
}

#feature .feature-item--01 .feature-item__title-text {
  width: 389px;
}

#feature .feature-item--01 .feature-item__title-icon {
  right: 10px;
  top: -20px;
  width: 111px;
}

#feature .feature-item--01 .feature-item__image-logo {
  width: 535px;
  margin-top: 55px;
  margin-bottom: 55px;
}

#feature .feature-item--01 .feature-item__note {
  padding-left: 50px;
  margin-bottom: 40px;
}

#feature .feature-item--01 .feature-item__point-title {
  width: 562px;
  margin: auto;
}

#feature .feature-item--01 .feature-item__point-content {
  width: 503px;
  margin: 20px auto 30px;
}

#feature .feature-item--02 .feature-item__title-text {
  width: 490px;
}

#feature .feature-item--02 .feature-item__content-title {
  width: 588px;
  margin: 45px auto 0;
}

#feature .feature-item--02 .feature-item__list {
  padding: 40px 40px 50px;
}

#feature .feature-item--02 .feature-item__list-icon {
  width: 70px;
  margin: 100px 0 0;
  padding: 0 8px;
}

@media all and (max-width: 750px) {
  #feature {
    padding: 0 0 20vw;
    
  }
  
  #feature .items{
  	padding: 4vw;
  }

#feature .img_buttom{
	padding-bottom: 0px;
}
  
  
  #feature .feature-item__title-number {
    font-size: 9.333vw;
    width: 16vw;
    height: 16vw;
    line-height: 16vw;
    margin: 0 4vw 0 0;
  }
  
  #feature .feature-item__title-text {
    margin: 2.667vw 0 0;
  }
  
  #feature .feature-item__note_01 {
    font-size: 3.6vw;
    text-align: left;
  }
  
  #feature .feature-item__note_02 {
    font-size: 3.5vw;
    text-align: left;
  }  
  
  #feature .feature-item__point {
    width: calc(100% - 5.333vw);
    margin: 2.667vw auto;
    border-radius: 2.667vw;
    padding: 5.333vw 4vw;
  }
  
  #feature .feature-item__point-note p {
    font-size: 2.133vw;
  }
  
  #kv-feature .feature-sticky__inner {
    padding: 4vw 0 4vw 0;
  }
  
.feature-sticky__text {
/*	width: 89.933vw;*/
    margin: 3vw auto 2.667vw;
    text-align: center;
    font-size: 4.5vw;
    font-weight: 700;
  }
  
  
  #feature .feature-item--01 .feature-item__note {
    padding-left: 6.667vw;
    margin-bottom: 5.333vw;
  }
  
}

.feature-sticky_a{
	text-decoration: underline!important;	
}

#bottom_text .kv-text {
    font-size: 32px;
    text-align: center;
    font-weight: 700;
    margin: 0 0 40px;
}

#bottom_text .kv-text span {
    font-size: 20px;
}

@media all and (max-width: 750px) {
#bottom_text .kv-text {
    font-size: 4.267vw;
    margin: 0 0 5.333vw;
}

#bottom_text .kv-text span {
    font-size: 2.8vw;
}

}