@charset "UTF-8";

/*	Common Things	*/

.disp-mph,
.disp-lib1,
.disp-lib2 { display: none; }


.obj--tuna { position: absolute; top: 50%; left: 50%; animation: tunaMoveSp 30s linear infinite; pointer-events: none; z-index: 300; }

.ani--top { position: absolute; top: 0; left: 0; width: 100%; z-index: 10; pointer-events: none; }





.trg--library { top: 46%; right: 21%; width: 7%; }
.trg--library .trg__btn { clip-path: polygon(37% 0%, 0% 24%, 0% 92%, 18% 100%, 34% 92%, 53% 100%, 65% 97%, 71% 100%, 88% 92%, 87% 84%, 92% 81%, 92% 30%); }


.trg--pond1 { top: 48%; left: 21%; width: 10%; aspect-ratio: 1.5/1; }
.trg--pond1 .trg__btn { clip-path: polygon(23% 0, 98% 22%, 67% 88%, 0% 59%); }
.trg--pond1 .trg__label { top: 1vh; }

.trg--ground { top: 10%; left: 22%; width: 22%; aspect-ratio: 1.7/1.2; }
.trg--ground .trg__btn { clip-path: polygon(69% 0%, 100% 41%, 61% 91%, 3% 65%); }
.trg--ground .trg__label { top: 12vh; left: 65%; }

.trg--gym { top: 61%; left: 19.8%; width: 5.8%; }
.trg--gym .trg__btn { clip-path: polygon(42% 3%, 72% 3%, 100% 15%, 100% 37%, 60% 100%, 0 87%, 0% 80%, 10% 48%); }
.trg--gym .trg__label { top: -2vh; left: 58%; z-index: 400; }

.trg--agfa1 { top: 86%; left: 19.5%; width: 3%; }
.trg--agfa1 .trg__btn { clip-path: polygon(23% 0, 98% 22%, 67% 88%, 0% 59%); }
.trg--agfa1 .trg__label { top: -4vh; left: 60%; }

.trg--agfa2 { top: 78%; left: 1%; width: 18%; aspect-ratio: 2/0.8; }
.trg--agfa2 .trg__btn { clip-path: polygon(13% 0, 100% 47%, 84% 100%, 0% 49%); }
.trg--agfa2 .trg__label { top: 3vh; left: 56%; }

.trg--satoyama { top: 6%; left: 55.5%; width: 22%; aspect-ratio: 1.6/1; }
.trg--satoyama .trg__btn { clip-path: polygon(43% 0, 100% 45%, 52% 90%, 0 39%); }
.trg--satoyama .trg__label { top: 11vh; left: 45%; }

.trg--clubhouse { top: 26%; left: 80%; width: 4.5%; aspect-ratio: 1.3/1; }
.trg--clubhouse .trg__btn { clip-path: polygon(11% 2%, 33% 9%, 100% 64%, 100% 88%, 80% 100%, 0 36%, 0 12%); }
.trg--clubhouse .trg__label { top: -3vh; left: 70%; }

.trg--biotop { top: 22%; left: 76.5%; width: 3%; aspect-ratio: 1.3/1; }
.trg--biotop .trg__btn { clip-path: polygon(70% 0, 100% 36%, 38% 67%, 0 29%); }
.trg--biotop .trg__label { top: -7vh; left: 58%; }

.trg--rstr { top: 31%; left: 70%; width: 5.5%; aspect-ratio: 1.5/1; }
.trg--rstr .trg__btn { clip-path: polygon(0 50%, 29% 24%, 42% 0, 75% 7%, 100% 47%, 100% 52%, 90% 86%, 100% 57%, 76% 81%, 73% 84%, 31% 100%, 0 66%); }
.trg--rstr .trg__label { top: -7vh; left: 58%; }

.trg--narayama { top: 44.7%; left: 70%; width: 4.7%; }
.trg--narayama .trg__btn { clip-path: polygon(0 9%, 12% 0, 25% 9%, 25% 20%, 74% 49%, 74% 39%, 85% 34%, 100% 44%, 100% 90%, 85% 100%, 0 54%); }
.trg--narayama .trg__label { top: -4vh; left: 30%; }

.trg--classroom { top: 32%; left: 55.2%; width: 6.2%; }
.trg--classroom .trg__btn { clip-path: polygon(68% 0, 100% 12%, 100% 39%, 35% 80%, 0 60%, 0 38%); }
.trg--classroom .trg__label { top: -2vh; left: 40%; }

.trg--classroom_new { top: 35%; left: 61.5%; width: 6.5%; }
.trg--classroom_new .trg__btn { clip-path: polygon(24% 0, 100% 42%, 100% 74%, 70% 90%, 0 45%, 0 14%); }
.trg--classroom_new .trg__label { top: -2vh; left: 55%; }

.trg--cvs { top: 51%; left: 63%; width: 4%; }
.trg--cvs .trg__btn { clip-path: polygon(78% 0, 100% 12%, 100% 65%, 45% 100%, 0 72%, 0 38%); }
.trg--cvs .trg__label { top: -2vh; left: 40%; }

.trg--library { top: 55%; left: 61%; width: 6.5%; }
.trg--library .trg__btn { clip-path: polygon(34% 0, 90% 42%, 90% 55%, 65% 85%, 0 45%, 0 25%); }
.trg--library .trg__label { top: -1vh; left: 64%; z-index: 320; }

.trg--mph { top: 52%; left: 47.5%; width: 7.5%; }
.trg--mph .trg__btn { clip-path: polygon(42% 0%, 100% 32%, 100% 45%, 55% 70%, 0% 35%, 0% 25%); }
.trg--mph .trg__label { top: -2vh; left: 55%; }

.trg--cook { top: 62%; left: 55.2%; width: 5.5%; }
.trg--cook .trg__btn { clip-path: polygon(56% 3%, 100% 28%, 100% 39%, 45% 70%, 0 40%, 0 38%); }
.trg--cook .trg__label { top: -2vh; left: 40%; }

.trg--bus { top: 64%; left: 41%; width: 5.5%; }
.trg--bus .trg__btn { clip-path: polygon(61% 0, 91% 20%, 40% 60%, 0 32%); }
.trg--bus .trg__label { top: -2vh; left: 40%; }

.trg--pond2 { top: 30%; left: 87%; width: 10%; aspect-ratio: 1.7/1; }
.trg--pond2 .trg__btn { clip-path: polygon(44% 0, 88% 16%, 100% 85%, 53% 85%, 0 100%, 10% 25%); }
.trg--pond2 .trg__label { top: 0.5vh; left: 40%; }


.l-footer { position: fixed; left: 0; bottom: 0; width: 100%; z-index: 100; }
@media only screen and (max-width: 680px) {
	.obj--tuna { width: calc(495px / 2); }
}
@media only screen and (min-width: 681px) {
	.trg--pond1 .trg__label { top: 25%; left: 55%; }
	.trg--ground .trg__label { top: 34%; }
	.trg--agfa1 .trg__label { top: -50%; }
	.trg--agfa2 .trg__label { top: 32%; }
	.trg--satoyama .trg__label { top: 31%; left: 46%; }
	.trg--clubhouse .trg__label { top: -25%; }
	.trg--rstr .trg__label { top: -60%; left: 60%; }
	.trg--narayama .trg__label { top: -30px; }
	.trg--classroom .trg__label { top: -5%; left: 30%; }
	.trg--classroom_new .trg__label { top: -6%; left: 60%; }
	.trg--pond2 .trg__label { top: 20%; left: 36%; }
	.obj--tuna { width: 38.2vh; animation: tunaMovePc 40s linear infinite; }
}
/*
@keyframes tunaMove {
  from { transform: translate(100%, -100%); }
  to { transform: translate(-100%, 100%); }
}

@keyframes tunaMoveSp {
	from { transform: translate(90vw, -30vh); }
	to { transform: translate(-370vw, 120vh); }
}
@keyframes tunaMovePc {
	from { transform: translate(30vw, -30vh); }
	to { transform: translate(-180vw, 175vh); }
}
*/
@keyframes tunaMoveSp {
	from { transform: translate(350%, -350%); }
	to { transform: translate(-350%, 250%); }
}
@keyframes tunaMovePc {
	from { transform: translate(60vw, -80vh); }
	to { transform: translate(-180vw, 185vh); }
}



/*
@keyframes tunaMove {
    0% { top: -31%; right: -24%; background-image: url("../img/obj_tuna_1.svg"); }
    25% { top: 7%; right: 3%; }
    26% { background-image: url("../img/obj_tuna_1.svg"); }
    27% { background-image: url("../img/obj_tuna_2.svg"); }
    50% { top: 50%; right: -23%; }
    75% { top: 7%; right: 3%; }
    76% { background-image: url("../img/obj_tuna_2.svg"); }
    77% { background-image: url("../img/obj_tuna_1.svg"); }
    100% { top: -31%; right: -24%; background-image: url("../img/obj_tuna_1.svg"); }
}
@keyframes tunaMove {
    0% { top: -26vw; right: -49vw; background-image: url("../img/obj_tuna_1.svg"); }
    25% { top: 16vw; right: 11vw; }
    26% { background-image: url("../img/obj_tuna_1.svg"); }
    27% { background-image: url("../img/obj_tuna_2.svg"); }
    50% { top: 65vw; right: -48vw; }
    75% { top: 16vw; right: 11vw; }
    76% { background-image: url("../img/obj_tuna_2.svg"); }
    77% { background-image: url("../img/obj_tuna_1.svg"); }
    100% { top: -26vw; right: -49vw; background-image: url("../img/obj_tuna_1.svg"); }
}
*/

.blur { position: fixed; top: 0; left: 0; display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(50px); z-index: 5000; transition: 2.0s; }
.blur._off { opacity: 0; }
.blur img { min-width: 200px; }
@media only screen and (min-width: 681px) {
	.blur img { min-width: 800px; }
}







/*		*/
.guidance-wrap { transition: 1.0s ease; }
.guidance-wrap--top { opacity: 0; }
@media only screen and (max-width: 680px) {
	
}
@media only screen and (min-width: 681px) {
	
}

/*		*/

@media only screen and (max-width: 680px) {
	
}
@media only screen and (min-width: 681px) {
	
}

/*		*/

@media only screen and (max-width: 680px) {
	
}
@media only screen and (min-width: 681px) {
	
}