html { scroll-behavior: smooth;}
body {
	font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	/*
	font-family:"Roboto Slab" , Garamond , "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
	*/
	line-height: 1.1em;
    font-size: 62.5%; 
}
canvas {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
    height: auto;
}
.floLeft {
	float: left;
	color: #869300
}
.floRight {
	float: right;
}
.bold {
	font-weight: bold;
}
a, a img {
	text-decoration: none;
	transition: all ease .2s;
}
a:hover, a img:hover{
    opacity: .7
}
img {
	max-width: 100%;
}


body{

}
@media print, screen and (min-width: 768px) {
	/* PC */
	html {
		font-size: 62.5%;
	}
	.sp {
		display: none;
	}
	a[href^="tel:"] {
		pointer-events: none;
	}
	a:hover {
		opacity: 0.8;
	}
}

@media screen and (max-width: 767px) {
	.pc {
		display: none;
	}
}
/******************header***************/
header{
    padding: 2rem;
}
header ul {
	display: flex;
    align-items: center;
	width: 100%;
	background: #fff;
}
header ul li:first-child{
    margin-right: auto;
}
header ul li:first-child img{
    width: 300px;
}
header ul li{
    font-size: 1.6rem ;
    margin-right: 2rem;
}
@media print, screen and (min-width: 768px) {

}


@media print, screen and (max-width: 1300px) and (min-width: 768px) {

}

.contents{}

.content01{
    background: #d4e20d;
    width: 100%;
    text-align: center;
    padding: 5rem 0;
}

.content01 img{
    width: 60%;
}

.content02{
    position: relative;
    padding-bottom: 10rem;
}

.content02 h2{
    font-family:"Roboto Slab" , Garamond , "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
    font-size: 6rem;
    line-height: 8rem;
    font-weight: bold;
    color: rgb(0, 4, 255);
    margin: 10rem 0 10rem 10rem ;
}
.content02 h2 span{
    font-size: 7rem;
    color: rgb(0, 183, 255);
    border-bottom: rgb(0, 183, 255) 3px solid;
}

.content02 ul{
    background: #15004e;
    color: #fff;
    padding: 5rem 10rem;
}

.content02 ul li{
    font-size: 2rem ;
    margin-bottom: 3rem;
}
.content02 ul li:last-child{
    margin-bottom: 0;
}

.content02 ul li span{
    color: #d4e20d;
}

.content02 .human{
    
}
.content02 .human img{
    position: absolute;
    right: 0;
    bottom: 0;
}
.content02 .tri img{
    position: absolute;
    bottom: -10%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
}

.content03{
    font-family:"Roboto Slab" , Garamond , "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
    font-size: 6rem;
    font-weight: bold;
    color: #fff;
    background: #2693ec;
    padding: 10rem;
    text-align: center;
    line-height: 8rem;
}
.content03 h2 span{
    color: #d4e20d;
}

.content04 {
    width: 100%;
    text-align: center;
    background: #fdffdb;
    padding-top: 5rem;
}

.content04 .cont4_01{

}
.content04 .cont4_01 img{
    width: 30%;
}

.content04 article .cont4_02{
    position: relative;
    margin-top: 5rem;
}

.content04 article .cont4_03{
    width: 70%;
}


.content04 article .cont4_04{
    width: 40%;
    text-align: left;
    position: absolute;
    right: 0;
    bottom: -1.5rem;
    background: #fff;
    padding: 7rem 3rem;
}

.content04 article .cont4_04 h4{
    font-size: 3.5rem;
    line-height: 4rem;
    font-weight: bold;
}

.content04 article .cont4_04 p{
    font-size: 1.2rem;
    line-height: 3rem;
}
.content04 article .cont4_05{
    width: 40%;
    text-align: left;
    position: absolute;
    left: 0;
    bottom: -1.5rem;
    background: #fff;
    padding: 7rem 3rem;
}
.content04 article .cont4_05 h4{
    font-size: 3.5rem;
    line-height: 4rem;
    font-weight: bold;
}


  

.content04 article .cont4_05 p{
    font-size: 1.2rem;
    line-height: 3rem;
}

.content04 article .cont4_06{
    width: 70%;
    margin-left: auto;
}

.content04 .onestop{
    width: 70%;
    margin: 0 auto;
    padding: 5rem 0;
}


.content05{
    background: #9cd2ff;
    padding: 10rem 0 0;
    text-align: center;
}

.content05 h3{
    font-size: 6rem;
    font-weight: bold;
    line-height: 9rem;
}
.content05 p{
    font-size: 2rem;

}

.content05 .cont5_01{
    width: 70%;
    margin: 5rem auto;
}
.content05 .cont5_02{
    width: 85%;
    margin-left: auto;
}

.content06{
    color: #fff;
    background: #020080;
    padding: 10rem 0 0;
    text-align: center;
}
.content06 h3{
    font-size: 6rem;
    font-weight: bold;
    line-height: 9rem;
}
.content06 p{
    font-size: 2rem;
    padding-bottom: 5rem;
}

.content06 ul{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 70%;
    margin: 5rem auto;
}

.content06 ul li {
    width: 30%;
    margin-bottom: 3rem;
}

.content07{
    background: #9cd2ff;
    padding: 10rem 0 5rem;
    text-align: center;
}
.content07 h3{
    font-size: 5rem;
    font-weight: bold;
    line-height: 9rem;
}
.content07 p{
    font-size: 2rem;
    line-height: 4rem;
}

.content07 ul{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 70%;
    margin: 5rem auto;
    background: #fff;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
    padding: 3rem;
    box-sizing: border-box;
}
.content07 ul li {
    width: 30%;
}

.content08{
    background: #fff9c1;
    padding: 10rem 0 5rem;
    text-align: center;
}
.content08 h2{
    font-size: 5rem;
    font-weight: bold;
    line-height: 9rem;
}
.content08 p{
    font-size: 1.5rem;
    line-height: 2rem;
    margin-top: 2rem;
}
.content08 ul{
    width: 70%;
    margin: 0 auto;
    text-align: left;
}
.content08 ul li{
    margin-bottom: 3rem;
}
.content08 ul li .flow_left{
width: 25%;
}
.content08 ul li .flow_right{
width: 70%;
}
.content08 ul li .flow_right h3{
font-size: 3rem;
font-weight: bold;
}
.content08 ul li .flow{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.content09{
    background: url(../img/cont09_bak.png) no-repeat;
    background-size: cover;
    height: 100vh;
    position: relative;
}

.content09 h2{
    font-size: 3rem;
    font-weight: bold;
    line-height: 4rem;
}

.content09 .cont9_text{
    color: #fff;
    position: absolute;
    top: 50%;
    left: 70%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    width: 550px;
    margin-left: auto;
}

.content09 ul{}
.content09 ul li{
    font-size: 1.8rem;
    margin: 3rem 0 3rem;
    text-align: center;;
}

.content010{
    text-align: center;
    background: #9cd2ff;
    padding: 6rem;
}

.content010 p{
    font-size: 4rem;
    line-height: 5rem;
}

.content010 .cont10_img{
    width: 60%;
    margin: 3rem auto;
}

footer{
    padding: 2rem;
}
footer ul {
	display: flex;
    align-items: center;
	width: 100%;
	background: #fff;
}
footer ul li:first-child{
    margin-right: auto;
}
footer ul li:first-child img{
    width: 300px;
}
footer ul li{
    font-size: 1.6rem ;
    margin-right: 2rem;
}

footer p{
    text-align: center;
    padding: 3rem;
}

@media screen and (max-width: 767px) {
    .content01 {
    padding: 1rem 0;
    }
    .content02 {
    position: relative;
    padding-bottom: 3rem;
}
	.content02 h2 {
    font-family: "Roboto Slab", Garamond, "Times New Roman", "游明朝", "Yu Mincho", "游明朝体", "YuMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
    font-size: 1.5rem;
    line-height: 3rem;
    font-weight: bold;
    color: rgb(0, 4, 255);
    margin: 2rem 0 2rem 1rem;
}
    .content02 h2 span {
    font-size: 2rem;
    color: rgb(0, 183, 255);
    border-bottom: rgb(0, 183, 255) 3px solid;
}
    .content02 ul {
    background: #15004e;
    color: #fff;
    padding: 3rem 2rem;
}
    .content02 ul li {
    font-size: 1rem;
    margin-bottom: 1rem;
    line-height: 2rem;
}
    .content03 {
    font-family: "Roboto Slab", Garamond, "Times New Roman", "游明朝", "Yu Mincho", "游明朝体", "YuMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
    font-size: 2rem;
    font-weight: bold;
    color: #fff;
    background: #2693ec;
    padding: 2rem;
    text-align: center;
    line-height: 3rem;
}
    .content04 .cont4_01 {
    padding-top: 2rem;
}
    .content04 .cont4_01 img {
    width: 70%;
}
    .content04 article .cont4_02 {
    position: relative;
    margin-top: 3rem;
}
    
    .content04 article .cont4_03 {
    width: 100%;
}
    .content04 article .cont4_04 {
    width: 100%;
    text-align: left;
    position: static;
    right: 0;
    bottom: -1.5rem;
    background: #fff;
    padding: 2rem;
}
    .content04 article .cont4_04 h4 {
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: bold;
}
    .content04 article .cont4_04 p {
    font-size: 1.2rem;
    line-height: 2rem;
}
    .content04 article .cont4_05 {
    width: 100%;
    text-align: left;
    position: static;
    left: 0;
    bottom: -1.5rem;
    background: #fff;
    padding: 2rem;
}
    .content04 article .cont4_06 {
    width: 100%;
    margin-left: auto;
}
    .content04 article .cont4_05 h4 {
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: bold;
}
    .content04 article .cont4_05 p {
    font-size: 1.2rem;
        line-height: 2rem;
}
    .content04 .onestop {
    width: 100%;
    margin: 0 auto;
    padding: 2rem 0;
}
    
    .content05 {
    background: #9cd2ff;
    padding: 2rem 0 0;
    text-align: center;
}
    .content05 h3 {
    font-size: 3rem;
    font-weight: bold;
    line-height: 5rem;
}
    .content05 p {
    font-size: 1.5rem;
    line-height: 2rem;
}
    .content05 .cont5_01 {
    width: 95%;
    margin: 2rem auto;
}
    .content05 .cont5_02 {
    width: 95%;
    margin-left: auto;
}
    .content06 {
    color: #fff;
    background: #020080;
    padding: 3rem 0 0;
    text-align: center;
}
    .content06 h3 {
    font-size: 3rem;
    font-weight: bold;
    line-height: 5rem;
}
    .content06 p {
    font-size: 1.5rem;
    line-height: 2rem;
    padding-bottom: 1rem;
}
    .content06 ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 90%;
    margin: 2rem auto;
}
    .content07 {
    background: #9cd2ff;
    padding: 3rem 0 2rem;
    text-align: center;
}
    .content07 h3 {
    font-size: 2rem;
    font-weight: bold;
    line-height: 2rem;
}
    .content07 ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 90%;
    margin: 2rem auto;
    background: #fff;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
    padding: 1rem;
    box-sizing: border-box;
}
    .content07 p {
    font-size: 1rem;
    line-height: 2rem;
}
    .content08 {
    background: #fff9c1;
    padding: 3rem 0 2rem;
    text-align: center;
}
    .content08 h2 {
    font-size: 2rem;
    font-weight: bold;
    line-height: 4rem;
}
    .content08 ul {
    width: 90%;
    margin: 0 auto;
    text-align: left;
}
    .content08 ul li .flow_right h3 {
    font-size: 1.5rem;
    font-weight: bold;
}
    .content08 p {
    font-size: 1rem;
    line-height: 1.5rem;
    margin-top: 1rem;
}
    .content09 {
    background: url(../img/cont09_bak.png) no-repeat;
    background-size: cover;
    height: 100vh;
    position: relative;
}
    .content09 .cont9_text {
    color: #fff;
    position: static;
    /* top: 50%; */
    /* left: 70%; */
    transform: none;
    -webkit-transform: none;
    -ms-transform: translate(-50%, -50%);
    width: 100%;
    margin-left: 0;
    padding-top: 2rem;
    text-align: center;
}
    .content09 h2 {
    font-size: 1.5rem;
    font-weight: bold;
    line-height: 2rem;
}
    .content09 ul li {
    font-size: 1rem;
    margin: 2rem 0 2rem;
    text-align: center;
    line-height: 1.5rem;
}
    .content010 {
    text-align: center;
    background: #9cd2ff;
    padding: 2rem;
}
    .content010 p {
    font-size: 1.5rem;
    line-height: 3rem;
}
    .content010 .cont10_img {
    width: 80%;
    margin: 2rem auto;
}
    footer p {
    text-align: center;
    padding: 1rem;
}
}