@charset "utf-8";

/* style */
/* -------------------------------------------------------- */
.top-mv {width:100%; padding:96.2% 0 0 0; position:relative;}
.top-mv .img.parallax {width:100%; position:absolute; top:0; left:0;}
.top-mv .img > div {width:100%; position:absolute; top:0; left:0;}
.top-mv .img.parallax {opacity:1; transform:translate3d(0,0,0);}
.top-mv .img.parallax > div {opacity:0; transform:translate3d(0,15px,0);}
.top-mv .img.parallax.on > div {opacity:1; transform:translate3d(0,0,0); transition:opacity 1.0s 0s ease, transform 1.0s 0s ease;}
.top-mv .img.parallax.on > div:nth-of-type(1) {transition-delay:0s;}
.top-mv .img.parallax.on > div:nth-of-type(2) {transition-delay:0.6s;}
.top-mv .img.parallax.on > div:nth-of-type(3) {transition-delay:2.0s;}
.top-mv .img.parallax.on > div:nth-of-type(4) {transition-delay:2.3s;}
.top-mv .img.parallax.on > div:nth-of-type(5) {transition-delay:2.6s;}
.top-mv .img.parallax.on > div:nth-of-type(6) {transition-delay:2.9s;}
.top-mv .img.parallax.on > div:nth-of-type(7) {transition-delay:4.0s;}

.top-mv2 {width:100%; position:relative; opacity:0; transition:opacity 1.0s ease;}
.top-mv2 .img {position:relative; z-index:1;}
.top-mv2 .img > div {width:100%; position:absolute; top:0; left:0; opacity:0; transition:opacity 3.0s ease;}
.top-mv2 .img > div.on {position:relative; opacity:1;}
.top-mv2 .txt {width:100%; position:absolute; bottom:0; left:0; z-index:10; opacity:0; transform:translate3d(0,15px,0); transition:opacity 1.0s 1.0s ease, transform 1.0s 1.0s ease;}
body.load .top-mv2 {opacity:1;}
body.load .top-mv2 .txt {opacity:1; transform:translate3d(0,0,0);}

.top-summary {padding:50px 0;}

.top-bnr {padding:50px 0;}
.top-bnr .list > div {max-width:700px; margin:30px auto 0 auto;}
.top-bnr .list > div:first-of-type {margin-top:0;}

.top-information {margin:80px 0 0 0;}
.top-information .ttl {font-size:2.0rem; font-weight:400; color:#d27c7e;}
.top-information .txt1 {font-size:3.4rem; letter-spacing:0.2em; margin:20px 0 0 0;}
.top-information .txt1 span {font-size:58.8%; display:block;}
.top-information .txt2 {max-width:440px; margin:35px auto 0 auto;}
.top-information .txt2 a.btn-01 {max-width:100%; width:100%; letter-spacing:0.2em; color:#000; background:-webkit-linear-gradient(left, #45ff6a, #d5ff5c); background:linear-gradient(to right, #45ff6a, #d5ff5c);}
.top-information .txt2 a.btn-01::before {background-image:url(../img/common/arrow_02.svg);}

.top-information .txt2-1 {max-width:440px; margin:35px auto 0 auto;}
.top-information .txt2-1 a.btn-01 {max-width:100%; width:100%; letter-spacing:0.2em; color:#000; background:-webkit-linear-gradient(left, #FF8080, #FFACAC); background:linear-gradient(to right, #FF8080, #FFACAC);}
.top-information .txt2-1 a.btn-01::before {background-image:url(../img/common/arrow_02.svg);}

.top-information .txt3 {max-width:860px; margin:150px auto 0 auto; border-bottom:dotted 1px #343434;}
.top-information .txt3 dl {font-size:1.4rem; text-align:left; padding:1.7em 0; border-top:dotted 1px #343434; display:flex;}
.top-information .txt3 dt {width:10em; font-size:1.4rem; font-weight:400; letter-spacing:0.1em; color:#d27c7e;}
.top-information .txt3 dd {font-size:1.4rem; font-weight:400; flex:1;}

.top-information .clm-bnr {max-width:1000px;  margin:35px auto 0 auto; display:flex;}
.top-information .clm-bnr > div {width:50%; padding:0 13px 50px 0; box-sizing:border-box;}

.top-catch {padding:360px 0 850px 0; background:url(../img/top/img_02.jpg) no-repeat center bottom; background-size:1350px auto;}
.top-catch .sec {max-width:1130px; padding:0 15px; position:relative;}
.top-catch .txt1 {font-size:5.7rem; line-height:1.7; letter-spacing:0.1em; text-align:left; position:relative; z-index:5;}
.top-catch .txt2 {text-align:left; margin:30px 0 0 0; position:relative; z-index:5;}
.top-catch .txt2 dt {font-size:2.4rem; line-height:1.8; letter-spacing:0.1em;}
.top-catch .txt2 dd {font-size:1.4rem; line-height:3.1; letter-spacing:0.1em; margin:2.0em 0 0 0;}
.top-catch .img {width:45.2%; position:absolute; top:0; right:15px;}
.top-catch .img > div {width:100%; padding:153.4% 0 0 0; position:relative;}
.top-catch .img1 {width:73%; position:absolute; top:14.5%; left:0;}
.top-catch .img2 {width:35%; position:absolute; top:0; right:0;}
.top-catch .img3 {width:56%; position:absolute; bottom:0; right:0;}

.top-nav1 .sec {max-width:1110px; padding:0 15px;}
.top-nav1 .mv {position:relative;}
.top-nav1 .mv .ctx {width:2.4em; font-size:3.6rem; padding:1.2em 0; background-color:#fff; position:absolute; bottom:-100px;}
.top-nav1 .clm {margin:50px 0 0 0; display:flex; justify-content:space-between; align-items:center;}
.top-nav1 .clm .ctx {width:59%; box-sizing:border-box;}
.top-nav1 .clm .img {width:41%;}
.top-nav1 .ttl {font-size:6.5rem; font-family: 'Libre Bodoni', serif; font-weight:400; line-height:1; letter-spacing:0.2em; margin:0 0 -0.3em 0;}
.top-nav1 .txt1 {font-size:3.6rem; line-height:1.2; text-align:center;}
.top-nav1 .txt1 span {display:inline-block; transform:rotate(90deg);}
.top-nav1 .txt2 {font-size:2.4rem; font-weight:400; line-height:1.8; letter-spacing:0.1em; text-align:left; margin:55px 0 0 0;}
.top-nav1 .txt3 {font-size:1.4rem; font-weight:400; line-height:3.1; letter-spacing:0.1em; text-align:left;}
.top-nav1 .txt4 {max-width:240px; margin:65px auto 0 auto;}
.top-nav1.type1 {margin-top:200px;}
.top-nav1.type1 .ttl {text-align:right;}
.top-nav1.type1 .mv .ctx {left:9%;}
.top-nav1.type1 .clm {padding-left:8%;}
.top-nav1.type1 .clm .ctx {text-align:left; padding-left:60px; order:2;}
.top-nav1.type1 .clm .img {order:1;}
.top-nav1.type1 .txt2 {text-align:left; margin-left:27%;}
.top-nav1.type2 {margin-top:170px;}
.top-nav1.type2 .ttl {text-align:left;}
.top-nav1.type2 .mv .ctx {right:9%;}
.top-nav1.type2 .clm {padding-right:8%;}
.top-nav1.type2 .clm .ctx {text-align:right; padding-right:60px; order:1;}
.top-nav1.type2 .clm .img {order:2;}
.top-nav1.type2 .txt2 {text-align:right; margin-right:27%;}

.top-nav2 {margin:180px 0 0 0;}
.top-nav2 .mv {position:relative;}
.top-nav2 .mv .ctx {width:100%; position:absolute; top:0; left:0;}
.top-nav2 .ttl {font-size:6.5rem; font-family: 'Libre Bodoni', serif; font-weight:400; line-height:1; letter-spacing:0.3em; text-align:center; color:#fff; position:relative; top:-0.4em;}
.top-nav2 .txt1 {font-size:1.6rem; font-weight:400; line-height:2.7; letter-spacing:0.1em; color:#fff; margin:100px 0 0 0;}
.top-nav2 .txt2 {max-width:240px; margin:50px auto 0 auto;}
.top-nav2 .box {padding:0 0 130px 0; background-color:#120606;}

.top-nav3 {margin:120px 0 60px 0;}
.top-nav3 .sec {max-width:1200px;}
.top-nav3 .ttl {font-size:6.5rem; font-family: 'Libre Bodoni', serif; font-weight:400; line-height:1; letter-spacing:0.2em; text-align:center; position:relative; top:-0.4em;}
.top-nav3 .clm {display:flex;}
.top-nav3 .clm a {width:25%; text-decoration:none; color:#fff; padding:120px 0 110px 0; box-sizing:border-box; display:block; position:relative; overflow:hidden; transition:opacity 0.3s ease;}
.top-nav3 .clm a:hover {opacity:0.7;}
.top-nav3 .clm .txt {font-size:3.3rem; font-family: 'Libre Bodoni', serif; font-weight:400; line-height:1; letter-spacing:0.1em; text-align:center; word-break:break-all; color:#fff; position:relative; z-index:5;}
.top-nav3 .clm .btn {max-width:225px; height:40px; font-size:1.2rem; letter-spacing:0.2em; text-align:center; text-decoration:none; color:#000; margin:35px auto 0 auto; background:-webkit-linear-gradient(left, #fff, #ff8e86); background:linear-gradient(to right, #fff, #ff8e86); border-radius:100px; display:flex; justify-content:center; align-items:center; position:relative; z-index:5; transition:opacity 0.3s ease;}
.top-nav3 .clm .btn::before {content:''; width:20px; height:20px; margin:-10px 0 0 0; background:url(../img/common/arrow_02.svg) no-repeat center center; background-size:100% auto; display:block; position:absolute; top:50%; right:20px;}
.top-nav3 .clm .img {width:100%; height:100%; background-repeat:no-repeat; background-position:center center; background-size:cover; position:absolute; top:0; left:0;}

#top-modal-check {display:none;}
#top-modal-check:checked + .top-modal {opacity:1; pointer-events:auto;}
.top-modal {width:100%; height:100vh; background-color:rgba(0,0,0,0.8); position:fixed; top:0; left:0; z-index:310; overflow:auto; opacity:0; pointer-events:none; transition:opacity 1.0s ease;}
.top-modal > div {text-align:center; padding:50px; box-sizing:border-box; display:inline-block; position:relative;}
.top-modal img {max-width:732px; width:100%;}
.top-modal label {width:80px; height:80px; display:block; position:absolute; top:0; right:0; cursor:pointer;}
.top-modal label::before,
.top-modal label::after {content:''; width:100%; height:2px; background-color:#fff; display:block; position:absolute; top:50%; left:0;}
.top-modal label::before {transform:rotate(45deg);}
.top-modal label::after {transform:rotate(-45deg);}

@media screen and (max-width:1600px){
	.top-nav3 .clm .txt {font-size:2.0vw;}
	.top-nav3 .clm .btn {font-size:0.7vw;}
	.top-nav3 .clm .btn::before {right:1.2vw;}
}

@media screen and (max-width:767px){
    .top-mv {margin:50px 0 0 0; padding:166.6% 0 0 0;}

    .top-summary {padding:50px 0;}

	.top-bnr {padding:50px 0;}
	.top-bnr .list > div {max-width:700px; margin:20px auto 0 auto;}
	.top-bnr .list > div:first-of-type {margin-top:0;}

    .top-information {margin:20px 0 0 0;}
    .top-information .ttl {font-size:1.4rem;}
    .top-information .txt1 {font-size:1.9rem; margin:15px 0 0 0;}
    .top-information .txt2 {max-width:200px; margin:20px auto 0 auto;}
    .top-information .txt2 a.btn-01 {max-width:100%; width:100%;}
    .top-information .txt2-1 {max-width:200px; margin:20px auto 0 auto;}
    .top-information .txt2-1 a.btn-01 {max-width:100%; width:100%;}
    .top-information .txt3 {margin:80px auto 0 auto;}
    .top-information .txt3 dl {font-size:1.1rem;}
    .top-information .txt3 dt {width:8em; font-size:1.1rem;}
    .top-information .txt3 dd {font-size:1.1rem;}
    
    .top-information .clm-bnr {width:100%; margin:0px 0 0 0; flex-wrap:wrap;}
    .top-information .clm-bnr > div {width:auto; padding:20px 0 0 0;}

    .top-catch {padding:100px 0 45.6vw 0; background:url(../img/top/img_02.jpg) no-repeat center bottom; background-size:100% auto;}
    .top-catch .sec {padding:0 7.0vw;}
    .top-catch .txt1 {font-size:2.8rem;}
    .top-catch .txt2 {margin:20px 0 0 0;}
    .top-catch .txt2 dt {font-size:1.6rem;}
    .top-catch .txt2 dd {font-size:1.1rem;}
    .top-catch .img {width:68.1vw; margin:40px auto 0 auto; position:static;}

    .top-nav1 .sec {padding:0 7.0vw;}
    .top-nav1 .mv {margin:0 -7.0vw;}
    .top-nav1 .mv .ctx {font-size:2.0rem; bottom:-1px;}
    .top-nav1 .clm {margin:25px 0 0 0; display:flex; flex-wrap:wrap;}
    .top-nav1 .clm .ctx {width:100%; margin:20px 0 0 0; order:2;}
    .top-nav1 .clm .img {width:100%; order:1;}
    .top-nav1 .ttl {font-size:3.2rem;}
    .top-nav1 .txt1 {font-size:2.0rem;}
    .top-nav1 .txt2 {font-size:1.6rem; text-align:center; margin:25px 0 0 0;}
    .top-nav1 .txt3 {font-size:1.0rem; line-height:2.4;}
    .top-nav1 .txt4 {max-width:216px; margin:40px auto 0 auto;}
    .top-nav1.type1 {margin-top:100px;}
    .top-nav1.type1 .mv .ctx {left:9%;}
    .top-nav1.type1 .clm {padding-left:0;}
    .top-nav1.type1 .clm .ctx {text-align:left; padding-left:0; order:2;}
    .top-nav1.type1 .clm .img {order:1;}
    .top-nav1.type1 .txt2 {text-align:center; margin-left:0;}
    .top-nav1.type2 {margin-top:100px;}
    .top-nav1.type2 .mv .ctx {right:9%;}
    .top-nav1.type2 .clm {padding-right:0;}
    .top-nav1.type2 .clm .ctx {text-align:left; padding-right:0; order:2;}
    .top-nav1.type2 .clm .img {order:1;}
    .top-nav1.type2 .ttl {letter-spacing:0;}
    .top-nav1.type2 .txt2 {text-align:center; margin-right:0;}

    .top-nav2 {margin:100px 0 0 0;}
    .top-nav2 .ttl {font-size:3.2rem;}
    .top-nav2 .txt1 {font-size:1.1rem; margin:80px 0 0 0;}
    .top-nav2 .txt2 {max-width:216px; margin:40px auto 0 auto;}
    .top-nav2 .box {padding:0 0 50px 0; }

    .top-nav3 {margin:80px 0 80px 0;}
    .top-nav3 .ttl {font-size:3.2rem; top:0.2em;}
    .top-nav3 .clm {display:flex; flex-wrap:wrap;}
    .top-nav3 .clm a {width:50%; padding:60px 0;}
    .top-nav3 .clm .txt {font-size:1.8rem;}
    .top-nav3 .clm .btn {max-width:125px; height:28px; font-size:1.0rem; margin:15px auto 0 auto; padding:0 10px 0 0; box-sizing:border-box;}
    .top-nav3 .clm .btn::before {width:14px; height:14px; margin:-7px 0 0 0; right:10px;}

    .top-modal > div {padding:12.0vw 3.0vw;}
    .top-modal label {width:16.0vw; height:16.0vw;}
}


@media screen and (max-width:1194px){

	.top-summary {padding:50px 0;}

	.top-information {margin:20px 0 0 0;}
	.top-information .ttl {font-size:1.8rem;}
	.top-information .txt1 {font-size:2.3rem; margin:15px 0 0 0;}
	.top-information .txt2 {max-width:260px; margin:20px auto 0 auto;}
    .top-information .txt2 a.btn-01 {max-width:100%; width:100%;}
    .top-information .txt2-1 {max-width:260px; margin:20px auto 0 auto;}
    .top-information .txt2-1 a.btn-01 {max-width:100%; width:100%;}
	.top-information .txt3 {margin:80px auto 0 auto;}
	.top-information .txt3 dl {font-size:1.5rem;}
	.top-information .txt3 dt {width:8em; font-size:1.5rem;}
	.top-information .txt3 dd {font-size:1.5rem;}

	.top-catch {padding:100px 0 45.6vw 0; background:url(../img/top/img_02.jpg) no-repeat center bottom; background-size:100% auto;}
	.top-catch .sec {padding:0 7.0vw;}
	.top-catch .txt1 {font-size:2.8rem;}
	.top-catch .txt2 {margin:20px 0 0 0;}
	.top-catch .txt2 dt {font-size:2.0rem;}
	.top-catch .txt2 dd {font-size:1.5rem;}
	.top-catch .img {width:68.1vw; margin:40px auto 0 auto; position:static;}

	.top-nav1 .sec {padding:0 17.0vw;}
	.top-nav1 .mv {margin:0 -7.0vw;}
	.top-nav1 .mv .ctx {font-size:2.4rem; bottom:-1px;}
	.top-nav1 .clm {margin:25px 0 0 0; display:flex; flex-wrap:wrap;}
	.top-nav1 .clm .ctx {width:100%; margin:20px 0 0 0; order:2;}
	.top-nav1 .clm .img {width:100%; order:1;}
	.top-nav1 .ttl {font-size:3.6rem;}
	.top-nav1 .txt1 {font-size:2.4rem;}
	.top-nav1 .txt2 {font-size:2.0rem; text-align:center; margin:25px 0 0 0;}
	.top-nav1 .txt3 {font-size:1.4rem; line-height:2.4;}
	.top-nav1 .txt4 {max-width:216px; margin:40px auto 0 auto;}
	.top-nav1.type1 {margin-top:100px;}
	.top-nav1.type1 .mv .ctx {left:9%;}
	.top-nav1.type1 .clm {padding-left:0;}
	.top-nav1.type1 .clm .ctx {text-align:left; padding-left:0; order:2;}
	.top-nav1.type1 .clm .img {order:1;}
	.top-nav1.type1 .txt2 {text-align:center; margin-left:0;}
	.top-nav1.type2 {margin-top:100px;}
	.top-nav1.type2 .mv .ctx {right:9%;}
	.top-nav1.type2 .clm {padding-right:0;}
	.top-nav1.type2 .clm .ctx {text-align:left; padding-right:0; order:2;}
	.top-nav1.type2 .clm .img {order:1;}
	.top-nav1.type2 .ttl {letter-spacing:0;}
	.top-nav1.type2 .txt2 {text-align:center; margin-right:0;}

	.top-nav2 {margin:100px 0 0 0;}
	.top-nav2 .ttl {font-size:3.6rem;}
	.top-nav2 .txt1 {font-size:1.5rem; margin:80px 0 0 0;}
	.top-nav2 .txt2 {max-width:216px; margin:40px auto 0 auto;}
	.top-nav2 .box {padding:0 0 50px 0; }

	.top-nav3 {margin:80px 0 80px 0;}
	.top-nav3 .ttl {font-size:3.6rem; top:0.2em;}
	.top-nav3 .clm {display:flex; flex-wrap:wrap;}
	.top-nav3 .clm a {width:50%; padding:60px 0;}
	.top-nav3 .clm .txt {font-size:2.2rem;}
	.top-nav3 .clm .btn {max-width:125px; height:28px; font-size:1.0rem; margin:15px auto 0 auto; padding:0 10px 0 0; box-sizing:border-box;}
	.top-nav3 .clm .btn::before {width:14px; height:14px; margin:-7px 0 0 0; right:10px;}

	.top-modal > div {padding:12.0vw 3.0vw;}
	.top-modal label {width:16.0vw; height:16.0vw;}
}