@charset "utf-8";

/*下層ページベースレイアウト*/

/*--- containers ---*/
main,
main > section {
width: 100%;
}
main > section {
background: white;
}
main > section:not(:first-of-type) {
position: relative;
z-index: 3;
}

/*--- section 1 ---*/
main > section:first-of-type {
position: relative;
padding-top: calc(100vw * 1.2);
padding-top: calc(100vw * 1.17);/*微調整*/
}
@media only screen and (min-width: 769px) {
main > section:first-of-type {
/* padding-top: calc((100vw * .553) - 8.2vw); */
padding-top: calc((100vw * .436) - 8.2vw);
}
}
main > section:first-of-type .mainvisual {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: auto;
z-index: 1;
}
main > section:first-of-type picture img,
main > section:first-of-type picture source {
width: 100%;
}
main > section:first-of-type > div:nth-of-type(2) {
/* background: url(../images/top/bgsp01.png) top / contain no-repeat; */
background: #EEF2F4;
position: relative;
z-index: 3;
aspect-ratio: 77/200;
padding: 5vw;
display: flex;
justify-content: center;
align-items: flex-start;
flex-direction: column;
color: white;
/* top: -340px; */
}
main > section:first-of-type > div.nextpage_div {
padding: 0;
}
main > section:first-of-type > div.nextpage_div .second_wrapper {/*下層*/
width: 100%;
background-image: none;
background: linear-gradient(45deg, #0ADFD5 0, #14BDEE 40%, #14BDEE 80%, #0ADFD5 100%);
border-top: 4px solid #11fddd;
aspect-ratio: 77/200;
padding: 12vh 10vw;
border-bottom-right-radius: 40vw;
}
@media only screen and (min-width: 769px) {
main > section:first-of-type > div:nth-of-type(2) {
/* background: url(../images/top/bg01.png) top / contain no-repeat; */
background: #EEF2F4;
aspect-ratio: 3000/1825;
padding: 10vw;
top: 0;
}
}
main > section:first-of-type > div.nextpage_div {
padding: 0;
}
main > section:first-of-type > div.nextpage_div .second_wrapper {/*下層*/
width: 100%;
background-image: none;
background: linear-gradient(45deg, #0ADFD5 0, #14BDEE 40%, #14BDEE 80%, #0ADFD5 100%);
aspect-ratio: 3000/1825;
padding: 12vh 10vw;
border-bottom-right-radius: 40vw;
}
							@media only screen and (max-width: 768px) {
								main > section:first-of-type > div.nextpage_div .second_wrapper{
								aspect-ratio: auto;
								border-bottom-right-radius: 40vw;
								}
							}
main > section:first-of-type > div:nth-of-type(2) h2 {
font-size: 3rem;
font-weight: bold;
margin-bottom: 5vw;
line-height: 1.4;
}
@media only screen and (min-width: 769px) {
main > section:first-of-type > div:nth-of-type(2) h2 {
font-size: 2.6rem;
margin-bottom: 2vw;
}
}
@media only screen and (min-width: 961px) {
main > section:first-of-type > div:nth-of-type(2) h2 {
font-size: 3.3rem;
margin-bottom: 2vw;
}
}
main > section:first-of-type > div:nth-of-type(2) h2 > span {
display: inline-block;
}
main > section:first-of-type > div:nth-of-type(2) h2 b {
color: #ffff75;
}
main > section p {
font-size: 1.1rem;
}
@media only screen and (max-width: 768px) {
main > section:first-of-type > div:nth-of-type(2) > div:not(:has(.maintitle)) {
	width: 100%;
	/* height: 200vh; */
}
}
@media only screen and (min-width: 769px) {
main > section p {
font-size: 1rem;
}
}
@media only screen and (min-width: 961px) {
main > section p {
font-size: 1rem;
}
}
main > section:first-of-type p {
font-size: 1.3rem;
}
@media only screen and (max-width: 768px) {
main > section:first-of-type p {
line-height: 1.6;
}
main > section:first-of-type p + p {
margin-top: 4vw;
}
}
@media only screen and (min-width: 769px) {
main > section:first-of-type p {
font-size: .8rem;
}
}
@media only screen and (min-width: 961px) {
main > section:first-of-type p {
font-size: 1rem;
}
}
main > section p + p {
margin-top: 3vw;
}
@media only screen and (min-width: 769px) {
main > section p + p {
margin-top: .8vw;
}
}
@media only screen and (min-width: 961px) {
main > section p + p {
margin-top: .5vw;
}
}
main > section p span {
display: inline-block;
}
/*--- section 2 ---*/
main > section:nth-of-type(2) .parallax {
	padding: 7vw;
	aspect-ratio: 1 / 0.8;
}
@media only screen and (min-width: 769px) {
main > section:nth-of-type(2) .parallax {
	padding: 4vw;
	aspect-ratio: inherit;
	box-sizing: border-box;
}
}
main > section:nth-of-type(2) .parallax::before {
z-index: -1;
content: "";
display: block;
width: 100%;
height: 100%;
background: var(--main-color);
position: absolute;
top: 0;
left: 0;
}
								main > section:nth-of-type(2) .parallax.nextpage_ac::before {
								background-color: #EEF2F4;
								padding: 12vh 10vw;
								border-bottom-left-radius: 40vw;
								}
main > section:nth-of-type(2) .parallax article {
  max-width: 1050px;
	height: 100%;
  margin: 0 auto;
	padding: 8vw 5vw;
	position: relative;
	height: auto;
}
@media only screen and (max-width: 768px) {
	main > section:nth-of-type(2) .parallax article {
		height: auto;
	}
}
main > section:nth-of-type(2) .parallax article::before {
content: "";
display: block;
width: 100%;
height: 100%;
top: 0;
left: 0;
position: absolute;
z-index: -1;
background: url(../images/top/bgsp02.jpg) center / cover no-repeat;
height: 100%;
}
main > section:nth-of-type(2) .parallax.nextpage_ac article::before {
background-image: none;
}
@media only screen and (min-width: 769px) {
main > section:nth-of-type(2) .parallax article {
padding: 4vw 0;
}
main > section:nth-of-type(2) .parallax article::before {
background: url(../images/top/bgsp02.jpg) center / cover no-repeat;
}
}
main > section:nth-of-type(2) h2 {
margin-bottom: 5vw;
}
main > section:nth-of-type(2) h2 {
margin-bottom: 2vw;
display: flex;
justify-content: flex-start;
align-items: flex-start;
flex-direction: column;
}
main > section:nth-of-type(2) h2 > span {
display: inline-block;
padding: .4rem .5rem .5rem;
background: white;
color: var(--main-color);
font-size: 1.6rem;
font-weight: bold;
line-height: 1;
margin-bottom: 2vw;
}
@media only screen and (min-width: 769px) {
main > section:nth-of-type(2) h2 > span {
font-size: 2.2rem;
margin-bottom: 1vw;
}
}
main > section:nth-of-type(2) div:first-of-type {
width: 100%;
}

		@media only screen and (max-width: 768px) {
			main > section:nth-of-type(2) div:first-of-type {
				width: 100%;
			}
		}
main > section:nth-of-type(2) div:first-of-type p {
color: white;
}
main > section:nth-of-type(2) div:first-of-type p span {
display: inline-block;
}


/*--- section 3 ---*/
main > section:nth-of-type(3) .parallax {
	padding: 0;
	height: auto;
}
@media only screen and (min-width: 769px) {
main > section:nth-of-type(3) .parallax {
	height: auto;
	padding: 0;
}
}
main > section:nth-of-type(3) .parallax::before {
z-index: -1;
content: "";
display: block;
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
}
main > section:nth-of-type(3) .parallax.nextpage_ac::before {
background-color: #fff;
}
main > section:nth-of-type(3) .parallax article {
height: 100%;
padding: 0;
position: relative;
}
main > section:nth-of-type(3) .parallax article::before {
content: "";
display: block;
width: 100%;
height: 100%;
top: 0;
left: 0;
position: absolute;
z-index: -1;
height: 100%;
}
main > section:nth-of-type(3) .parallax.nextpage_ac article::before {
background-image: none;
}
@media only screen and (min-width: 769px) {
main > section:nth-of-type(3) .parallax article {
	padding: 14vh 0 0;
}
main > section:nth-of-type(3) .parallax article::before {
background: none;
}
}
main > section:nth-of-type(3) h2 {
margin-bottom: 6vw;
}
main > section:nth-of-type(3) h2 {
margin-bottom: 3vw;
display: flex;
justify-content: flex-start;
align-items: flex-start;
flex-direction: column;
}
main > section:nth-of-type(3) h2 > span {
display: inline-block;
padding: .4rem .5rem .5rem;
color: white;
background: var(--main-color);
font-size: 1.6rem;
font-weight: bold;
line-height: 1;
margin-bottom: 2vw;
}
@media only screen and (min-width: 769px) {
main > section:nth-of-type(3) h2 > span {
font-size: 2.2rem;
margin-bottom: 1vw;
}
}
main > section:nth-of-type(3) h2,
main > section:nth-of-type(3) div:first-of-type {
width: 100%;
margin-left: 0;
}
@media only screen and (min-width: 961px) {
main > section:nth-of-type(3) h2,
main > section:nth-of-type(3) div:first-of-type {
width: 100%;
margin-left: 0;
}
}
main > section:nth-of-type(3) div:first-of-type p {
color: var(--main-color);
}
main > section:nth-of-type(3) div:first-of-type p span {
display: inline-block;
}
main > section:nth-of-type(3) .maintitle {
color: var(--main-color);
}
@media only screen and (min-width: 769px) {
main > section:nth-of-type(3) div.with-h3 {
width: 90%;
margin-left: 10%;
}
}




.nexttitle {
position: absolute;
bottom: 2%;
left: 37px;
min-width: 800px;
}

@media only screen and (min-width: 1400px) {

  .nexttitle {
    max-width: 1100px;
    margin: 0 auto;
  }

}

@media only screen and (min-width: 1200px) {

  .aboutus .nexttitle {
  left: 50%;
  transform: translateX(-50%);
  max-width: 1100px;
  width: 100%;
  margin: 0 auto;
  }
  .aboutus .mainvisual .maintitle {
  transform: translate(0, 0) !important;
  }

}

@media only screen and (max-width: 768px) {
.nexttitle {
bottom: 4%;
left: 0px;
}
}
.mainvisual .maintitle {
transform: translate(5vw, 0);
}
@media only screen and (min-width: 961px) {
.mainvisual .maintitle {
transform: translate(5vw, 0);
}
}

.mainvisual div .maintitle span {
display: inline-block;
background: white;
line-height: 1;
color: var(--main-color);
font-weight: bold;
padding: .2rem;
font-size: 1rem;
margin-bottom: 1vw;
font-family: var(--normal-font);
font-style: normal;
}
@media only screen and (min-width: 769px) {
.mainvisual div .maintitle span {
padding: .4rem;
font-size: 1.2rem;
margin-bottom: .5vw;
}
}
.mainvisual .maintitle {
font-family: Corbel;
font-weight: bold;
font-style: italic;
font-weight: bold;
font-size: 4rem;
text-align: center;
line-height: 1;
display: flex;
justify-content: center;
align-items: flex-start;
flex-direction: column;
color: white;
}
@media only screen and (min-width: 769px) {
main > section .maintitle {
font-size: 5rem;
}
}

a.scroll {
top: 8vw;
}
@media only screen and (max-width: 768px) {
a.scroll {
top: 23vw;
left: 3vw;
}
}