@import url('https://fonts.googleapis.com/css?family=M+PLUS+Rounded+1c');
body{
width: 100%;
max-width: 1920px;
margin: 0 auto;
padding:65px 0 0 0;
}
.wrap{
width: 980px;
margin: 0 auto;
}

header{
font-weight: bold;
font-family: 'M PLUS Rounded 1c';
transform: rotate(0.03deg);
position: fixed;
left: 0;
top: 0;
width: 100%;
background-color: #fff;
z-index: 999;
}
header .wrap{
display: flex;
  justify-content: center;
  align-items: center;
justify-content: space-between;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding:1em 2%;
}
header .wrap a{
font-size:3.6rem;
color: #0b2268;
}

/*-----------------------
 mv
-------------------------*/
section.mv{
background-image: url("../images/bg_img01.png");
background-size: cover;
width: 100%;
height:500px;
color: #fff;
}
section.mv .wrap{
padding:2em 5%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
section.mv .wrap h2{
font-size:9rem;
font-weight: bold;
font-family: 'M PLUS Rounded 1c';
transform: rotate(0.03deg);
margin: 0.25em 0;
}
section.mv .wrap p.catch{
font-size: 3rem;
line-height: 1.5;
letter-spacing: 2px;
}
section.mv .wrap p.catch strong{
font-size: 4rem;
}
section.mv .wrap p.catch:nth-of-type(1) strong{
font-weight: bold;
}
section.mv .wrap .tocontact{
margin-top: 4em;
	display:flex;
	justify-content:flex-end;
	align-items: center;	
}
section.mv .wrap .tocontact a{
font-size: 2.4rem;
color: #0b2268;
padding: 1em 2em;
border-radius: 0.5em;
display:inline-block;
background-color: #dcda0f;
box-shadow: 3px 3px 5px #333;
}
section.mv .wrap .tocontact a:hover{
opacity: 0.8;
}


h2.subtitle{
font-size: 3rem;
line-height:6rem;
text-align: center;
font-weight: bold;
}
h2.subtitle span{
color: #fff;
padding:0.25em 1.5em;
background: linear-gradient(90deg,#2653e0 0%,#2653e0 40%,#62cdb0 80%,#62cdb0 100%);
position: relative;
}
h2.subtitle span:before{
content: "";
display: block;
position: absolute;
bottom: 0;
left: 0;
  width: 0;
  height: 0;
  border-left:23px solid #fff;
  border-top:0px solid transparent;
  border-bottom:60px solid transparent;
}
h2.subtitle span:after{
content: "";
display: block;
position: absolute;
bottom: 0;
right: 0;
  width: 0;
  height: 0;
  border-right:23px solid #fff;
  border-top:60px solid transparent;
  border-bottom:0px solid transparent;
}

/*-----------------------
 feature
-------------------------*/
section.feature{
background-image: url("../images/bg_img02.png");
background-size: cover;
padding:2vw 0 4vw 0;
}
section.feature ul.feature_list{
display: flex;
  justify-content: center;
  align-items:stretch;
  margin-top: 2vw;
}
section.feature ul.feature_list li{
width: 306px;
background-color:#2452e4;
color: #fff;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding:2em 1em 1em 1em;
margin: 0 1em;
border-radius: 1em;
display: flex;
  justify-content: center;
  align-items:flex-start;
    -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
section.feature ul.feature_list li h3{
font-size: 2.4rem;
text-align: center;
margin-bottom: 0.5em;
}
section.feature ul.feature_list li .square{
width: 230px;
height: 149px;
display: block;
background-color: #f0f0f0;
border-radius: 1em;
display: flex;
  justify-content: center;
  align-items: center;
  margin: 1em auto;
}
section.feature ul.feature_list li .down{
width: 230px;
height: 135px;
display: flex;
  justify-content: center;
  align-items: center;
text-align: left;
line-height:1.5;
font-size: 1.6rem;
letter-spacing:2px;
}

/*-----------------------
 nagare
-------------------------*/
section.nagare{
padding:4vw 0;
}

section.nagare ul{
width: 100%;
margin:4vw auto 0 auto;
color: #010101;
font-size: 2.5rem;
line-height: 1.5;
counter-reset: count 0;
}

section.nagare ul h3{
font-size: 3.8rem;
font-weight:bold;
color: #0b2268;
line-height: 2;
}
section.nagare ul li{
position: relative;
padding-left: 13rem;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding-bottom:3em;
margin-bottom:3em;
}
section.nagare ul li:after{
content: "";
display: block;
position: absolute;
bottom:-40px;
left:50%;
transform: translateX(-50%); 
  width: 0;
  height: 0;
  border-right:115px solid transparent;
  border-top:60px solid #6d8ee4;
  border-left:115px solid transparent;
}
section.nagare ul li:nth-last-of-type(1){
padding-bottom: 0;
margin-bottom: 0;
}
section.nagare ul li:nth-last-of-type(1):after{
display: none;
}

section.nagare ul li:before{
  content:"0"counter(count);
  counter-increment: count 1;
  font-size: 5.4rem;
  color: #fff;
font-weight: bold;
font-family: 'M PLUS Rounded 1c';
transform: rotate(0.03deg);
width:10rem;
height:10rem;
border-radius:5rem;
background-color: #2452e4;
display: flex;
  justify-content: center;
  align-items: center;
  float: left;
  position: absolute;
  left: 0;
  top:0.35em;
}

/*-----------------------
 qanda
-------------------------*/
section.qanda{
width: 100%;
padding:4vw 0;
background: linear-gradient(90deg, #2653db, #5dd3ab);
}

section.qanda h2{
text-align: center;
}
section.qanda h2 span{
background-color: #fff;
width:8em;
font-size: 4.2rem;
line-height: 4.2rem;
padding: 0.25em;
display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  margin: 0 auto;
  position: relative;
}
section.qanda h2 span strong{
font-size: 4.2rem;
font-weight:bold;
  color: #FFFFFF;
  background:linear-gradient(80deg, #2653db, #5dd3ab);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
section.qanda h2 span:before{
content: "";
display: block;
position: absolute;
bottom: 0;
left:-23px;
  width: 0;
  height: 0;
  border-right:23px solid #fff;
  border-top:63px solid transparent;
  border-bottom:0px solid transparent;
}
section.qanda h2 span:after{
content: "";
display: block;
position: absolute;
bottom: 0;
right:-23px;
  width: 0;
  height: 0;
  border-left:23px solid #fff;
  border-top:0px solid transparent;
  border-bottom:63px solid transparent;
}

section.qanda ul{
font-size: 2.4rem;
color:#010101;
line-height: 1.5;
margin:4vw 0 0 0;
}
section.qanda ul li{
background-color: #fff;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding:1em 2em;
border-radius: 0.5em;
margin-bottom: 3em;
position: relative;
z-index: 1;
}
section.qanda ul li h3{
margin-bottom: 1em;
padding-left: 1.5em;
position: relative;
}
section.qanda ul li h3:before{
content: "Q";
margin-right:0.5em;
position: absolute;
top: -2px;
left: 0;
  font-size:2.8rem;
  color: #2452e4;
font-weight: bold;
}
section.qanda ul li p{
padding-left: 1.5em;
position: relative;
}
section.qanda ul li p:before{
content: "A";
margin-right:0.5em;
position: absolute;
top: -2px;
left: 0;
  font-size:2.8rem;
  color: #e42432;
font-weight: bold;
}

.tripre{
position: absolute;
bottom: 0;
left: 2em;
z-index:-1;
}
.tripre.right{
left: inherit;
right: 2em;
transform: scale(-1, 1);
}

    .triangle, .triangle:before, .triangle:after { 
      width:100px;
      height:100px;
      
    }
    .triangle {
      overflow: hidden;
      background-color: transparent;
      position: relative;
      margin: 0 auto;
      border-radius: 12%;
      transform: translateY(50%) rotate(80deg) skewY(30deg) scaleX(.866);
    } 
    .triangle:before, .triangle:after {
      position: absolute;
      content: '';
    }
    .triangle:before {
      background-color:#fff;
      border-radius: 12% 12% 12% 53%;
      transform: scaleX(1.155) skewY(-30deg) rotate(-30deg) translateY(-42.3%) 
                            skewX(30deg) scaleY(.866) translateX(-24%);
    }
    .triangle:after {
      background-color:#fff;
      border-radius: 12% 12% 53% 12%;
      transform: scaleX(1.155) skewY(-30deg) rotate(-30deg) translateY(-42.3%) 
                            skewX(-30deg) scaleY(.866) translateX(24%);
    }


/*-----------------------
 contact
-------------------------*/
section.contact{
background-image: url("../images/bg_img02.png");
background-size: cover;
padding:6vw 0;
}
section.contact .wrap{
padding:3vw 3em;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
background:linear-gradient(90deg, #2653db, #5dd3ab);
}
section.contact h2{
text-align: center;
font-size: 4.2rem;
font-weight: bold;
color: #fff;
margin-bottom: 2em;
}

form table{
width: 100%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
line-height: 2;
margin:3vw auto 2em auto;
display: table;
table-layout:fixed;
}
form table td{
padding:1em 0;
font-size:1.8rem;
color: #fff;
}
form table td i{
color: #fff;
font-weight: bold;
padding: 0 5px;
background-color: #e42432;
border-radius: 0.5em;
float: right;
font-size: 1.4rem;
}
form table td strong{
font-size: 2.4rem;
font-weight: bold;
}
form table td:nth-of-type(1){
padding-right: 1em;
	display:flex;
	align-items: center;
justify-content: space-between;    
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;      
}
form table td:nth-of-type(1) p{
width: 100%;
}
form table td:nth-of-type(2){
width:65%;
}

form table td input[type=text],
form table td input[type=email]{
padding: 0.5em 1em;
font-size: 1.6rem;
min-width:20em;
background-color: #fff;
border: none;
width: 100%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
form table td textarea{
padding: 0.5em 1em;
font-size: 1.6rem;
min-width:100%;
max-width: 100%;
min-height: 8em;
background-color: #fff;
border: none;
width: 100%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
form table td input[type=text].half{
min-width:14em;
max-width:14em;
margin-right: 0.5em;
}



::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color:#c9c9c9;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
   color:#c9c9c9;
}
::placeholder{ /* Others */
 color:#c9c9c9;
}

.policy{
display: block;
margin: 2em auto;
width: 70%;
max-height:300px;
background-color: #fff;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding:0 2em 2em 2em;
overflow-y: auto;
}
.policy .inn{
line-height: 2;
}
.policy .inn .bold{
clear: both;
margin:2em 0 0 0;
font-weight: bold;
}
form p.doi{
margin: 2em 0;
color: #fff;
line-height: 1.5;
font-size: 2rem;
}

form button{
padding: 0 8em;
border: none;
border-radius: 0.5em;
cursor: pointer;
background-color: #fff;
box-shadow: 3px 3px 6px #000;
}
form button:hover{
opacity: 0.8;
}
button strong{
font-size: 4.2rem;
font-weight:bold;
  color: #FFFFFF;
  background:linear-gradient(80deg, #2653db, #5dd3ab);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}


/*-----------------------
 thanks
-------------------------*/

section.thanks{
border-top: 2px solid #2755DA;
padding: 6vw 0;
}
section.thanks .wrap{
line-height:2;
font-size:1.6rem;
text-align: center;
}
section.thanks p.thanks-read{
margin:3em 0;
}


/*-----------------------
 page-top
-------------------------*/
#page-top{
	width:40px;
	height:40px;
	display:block;
	position:fixed;
	right:5%;
	bottom:5%;
	cursor:pointer;
	  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all  0.3s ease;
  z-index:998;
}
#page-top img{
	width:40px;
	height:40px;
}
#page-top:hover{
	opacity:0.8;
}

/*-----------------------
 footer
-------------------------*/
footer{
width: 100%;
padding:2vw 0;
 background:linear-gradient(90deg, #2653db, #5dd3ab);
}
footer .copy{
font-size: 2rem;
color: #fff;
text-align: center;
}



/*---------------------------------------------*
* width 1000px
*----------------------------------------------*/
@media screen and (max-width:1000px) {
.wrap{
width: 98%;
margin: 0 auto;
}
section.mv .wrap p.catch {
    font-size:2.2rem;
    letter-spacing:1px;
}
section.mv .wrap p.catch strong {
    font-size:3.2rem;
}
section.feature ul.feature_list {
    display: flex;
    justify-content: center;
    align-items:flex-start;
    margin-top: 2vw;
}

section.feature ul.feature_list li {
    width: 30vw;
    min-height: 337px;
}
section.feature ul.feature_list li .square {
    width:100%;
    height: 15vw;
}
section.feature ul.feature_list li .square img{
width:auto;
max-height:90%;
height: auto;
}
section.feature ul.feature_list li .down {
    width:100%;
    height:auto;
    font-size: 1.4rem;
}
section.feature ul.feature_list li h3 {
    font-size: 2.4vw;
    margin-bottom:none;
}

section.nagare ul {
    font-size: 2rem;
}
section.nagare ul h3 {
    font-size: 3rem;
}
section.nagare ul li {
    padding-left:8rem;
}
section.nagare ul li:before {
    font-size:3rem;
width:6rem;
height:6rem;
border-radius:3rem;
}

section.qanda ul {
    font-size: 2rem;
}
section.qanda ul li p:before,
section.qanda ul li h3:before {
    font-size: 2.2rem;
}

form table td {
    font-size: 1.6rem;
}
form table td strong {
    font-size:1.8rem;
}
.policy {
    width:100%;
}
form p.doi {
    font-size:1.6rem;
}
button strong {
    font-size:2.4rem;
}
footer .copy {
    font-size:1.4rem;
}

}
/* width 1000px end --------------------------------------------*/

/*---------------------------------------------*
* width 640px
*----------------------------------------------*/
@media screen and (max-width:640px) {
body{
padding:50px 0 0 0;
}
    header .wrap a {
        font-size:2.2rem;
    }
section.mv {
    height:auto;
}

section.mv .wrap {
    padding: 2em 1em;
}
section.mv .wrap p.catch {
    font-size:1.6rem;
    letter-spacing:0;
}
section.mv .wrap p.catch strong {
    font-size:2rem;
}
section.mv .wrap p.catch br{
display: none;
}
section.mv .wrap h2 {
    font-size:6rem;
    text-align: center;
}
section.mv .wrap .tocontact {
    margin-top:2em;
    display: flex;
    justify-content:center;
    align-items: center;
}
section.mv .wrap .tocontact a {
    font-size: 2rem;
}

section.feature {
    padding:4vw 0 8vw 0;
}
section.feature ul.feature_list li {
    width:100%;
    min-height: 337px;
}

section.feature ul.feature_list {
margin-top: 5vw;
-ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
h2.subtitle {
    font-size:2rem;
    line-height:4rem;
}
h2.subtitle span::before {
    content: "";
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 0;
    border-left: 2.3rem solid #fff;
    border-top: 0px solid transparent;
    border-bottom:4rem solid transparent;
}
h2.subtitle span::after {
    content: "";
    display: block;
    position: absolute;
    bottom: 0;
    right: 0;
    width: 0;
    height: 0;
    border-right: 2.3rem solid #fff;
    border-top:4rem solid transparent;
    border-bottom: 0px solid transparent;
}

section.feature ul.feature_list li {
    min-height:inherit;
    margin-bottom: 2em;
}
section.feature ul.feature_list li h3 {
    font-size:1.8rem;
    margin-bottom: none;
}
section.feature ul.feature_list li .square {
    width: 100%;
    height:30vw;
}

section.nagare {
    padding:4vw 0 8vw 0;
}
section.nagare ul li::before {
    font-size:1.8rem;
    width:3.6rem;
    height:3.6rem;
    border-radius:1.8rem;
}
section.nagare ul li {
padding-bottom: 1.5em;
margin-bottom: 1.5em;
    padding-left:4rem;
}
section.nagare ul h3 {
    font-size:1.8rem;
}
section.nagare ul {
    font-size:1.6rem;
}
section.nagare ul li br{
display: none;
}
section.nagare ul li::after {
    content: "";
    display: block;
    position: absolute;
    bottom: -20px;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-right:60px solid transparent;
    border-top:30px solid #6d8ee4;
    border-left:60px solid transparent;
}
section.qanda h2 span strong {
    font-size:2rem;
}
section.qanda h2 span {
    background-color: #fff;
    width: 8em;
    font-size:2rem;
    line-height:2rem;
}
section.qanda h2 span:before {
    content: "";
    display: block;
    position: absolute;
    bottom: 0;
    left: -12px;
    width: 0;
    height: 0;
    border-right:12px solid #fff;
    border-top:30px solid transparent;
    border-bottom: 0px solid transparent;
}
section.qanda h2 span:after {
    content: "";
    display: block;
    position: absolute;
    bottom: 0;
    right: -12px;
    width: 0;
    height: 0;
    border-left:12px solid #fff;
    border-top: 0px solid transparent;
    border-bottom:30px solid transparent;
}
section.qanda ul li {
    padding: 1em;
}
section.qanda ul {
    font-size:1.6rem;
}
section.qanda ul li p:before, section.qanda ul li h3:before {
    font-size:1.8rem;
}
section.contact h2 {
    font-size:2rem;
}
section.qanda {
    padding:8vw 0;
}
section.contact .wrap {
    padding:6vw 1em;
}
form table td{
width: 100%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
clear: both;
display: block;
}
form table td:nth-of-type(1) {
width: 100%;
    padding:1em 0 0 0;
    display: block;
    -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
form table td:nth-of-type(2) {
    width:100%;
    padding: 0 0 1em 0;
    -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
form table td i {
    font-size: 1rem;
    margin-top: 1em;
}


.policy {
    width:100%;
    padding: 0 1em 1em 1em;
}
.policy .inn {
    line-height:1.5;
}
form p.doi {
    font-size: 1.4rem;
}

}
/* width 640px end --------------------------------------------*/

/*---------------------------------------------*
* width 480px
*----------------------------------------------*/
@media screen and (max-width:480px) {
}
/* width 480px end --------------------------------------------*/

/*---------------------------------------------*
* width 375px
*----------------------------------------------*/
@media screen and (max-width:375px) {
}