.header-logo{
	width: calc(var(--content-width) * 0.80); left: 50%;
	height: calc(var(--content-width) * 0.40);
	transform: translate(-50%,0);
	z-index: 4;
}
.header-logo .image{
	width: 22%; left: 0%; top: 74%; transform: translate(0,-50%); cursor: pointer;
}
.header-logo p.paragraph{
	left: 24%; top: 64%; transform: translate(0,-50%);
	font-size: calc(var(--font-base) * 1.2); letter-spacing: calc(var(--font-base) * 0.1);
}
.header-logo p.title{
	left: 24%; top: 80%; transform: translate(0,-50%);
	font-size: calc(var(--font-base) * 2.0); letter-spacing: calc(var(--font-base) * 0.1);
}
.header-drawing{width: 100%; height: calc(var(--content-width) * 1.60); margin-bottom: calc(var(--content-width) * 0.06); overflow: hidden;}
.header-drawing .forest{
	width: 30%; left: 10%; top: calc(var(--content-width) * 0.22); transform: translate(0,-50%); opacity: 0;
}
.header-drawing .copy{
	left: 42%; top: calc(var(--content-width) * 0.22); transform: translate(0,-50%);
	letter-spacing: calc(var(--font-base) * 0.2); line-height: 1.5; opacity: 0;
}
.header-drawing .drawing{width: 90%; left: 5%; top: calc(var(--content-width) * 0.44); opacity: 0;}
#header-area .leaf-l{width: 44%;  z-index: 1; opacity: 0;}
.loaded #main-visual-leaf01{left: 10%; top: calc(var(--content-width) * 0.96);}
.loaded #main-visual-leaf02{left: 28%; top: calc(var(--content-width) * 0.66);}
.loaded #main-visual-leaf03{left: 55%; top: calc(var(--content-width) * 1.08);}
.loaded #main-visual-leaf04{left: -10%; top: calc(var(--content-width) * 0.66);}
.loaded #main-visual-leaf05{left: 60%; top: calc(var(--content-width) * 0.72);}
#header-area .leaf-s{width: 8%;  z-index: 1; opacity: 0;}
.loaded #main-visual-leaf06{left: 8%; top: 68%;}
.loaded #main-visual-leaf07{left: 90%; top: 74%;}
.loaded #main-visual-leaf08{left: 50%; top: 84%;}
.loaded #main-visual-leaf09{display: none;}
.loaded #main-visual-leaf10{display: none;}

#greeting-area .text-block{
	width: 90%; left: 5%; height: calc(var(--content-width) * 1.10);
	border-radius: calc(var(--content-width) * 0.06) 0 calc(var(--content-width) * 0.06) 0;
	overflow: hidden;
}
.hope, .utopia{font-size: calc(var(--font-base) * 2.8);}
.hope{left: 44%; top: calc(var(--content-width) * 0.16); transform: translate(-100%, -50%);}
.and{left: 50%; top: calc(var(--content-width) * 0.16); transform: translate(-50%, -50%);}
.utopia{left: 56%; top: calc(var(--content-width) * 0.16); transform: translate(0%, -50%);}
.hope-sub{left: 43%; top: calc(var(--content-width) * 0.24); transform: translate(-100%, -50%);}
.utopia-sub{left: 57%; top: calc(var(--content-width) * 0.24); transform: translate(0%, -50%);}
.greeting{width: 80%; left: 10%; top: calc(var(--content-width) * 0.32);}

#news-area{margin-bottom: calc(var(--margin-base) * 2);}
#news-area .area-content{width: 90%; left: 5%;}

#life-area{overflow: hidden;}
#life-area .whiteblock{width: 90%; left: 5%;}
#life-area .activity-block{width: 100%; height: calc(var(--content-width) * 0.50);}
#life-area .activity-block p.title{top: 10%; width: 60%;}
#life-area .activity-block p.paragraph{top: 20%; width: 50%;}
#life-photoframe1{width: 35%; left: 60%; top: 0%; transform-origin: center; transform: rotate(10deg);}
#life-photoframe2{width: 35%; left: 5%; top: 10%; transform-origin: center; transform: rotate(-5deg);}
#life-photoframe3{width: 35%; left: 60%; top: 10%; transform-origin: center; transform: rotate(5deg);}

#schedule-area{overflow: hidden;}
#schedule-area table{width: 96%; left: 2%;}
#schedule-area .whiteblock{width: 90%; left: 5%;}
#schedule-area .paragraph{width: 80%; left: 10%;}
#schedule-area table td{font-size: calc(var(--font-base) * 0.8);}
#schedule-photoframe6{display: none;}
#schedule-photoframe7{display: none;}
#schedule-photoframe8{display: none;}

#rollback-area{height: calc(var(--content-width) * 0.12);}
#rollback-area .link-button{width: 40%; left: 30%; top: 25%; height: 50%;}

#footer-area{height: calc(var(--content-width) * 0.32); background-color: rgb(255, 222, 161);}
#footer-area .footer-logo{width: 20%; left: 10%; top: 50%; transform: translate(0,-50%);}
#footer-area p{left: 32%; top: 50%; transform: translate(0,-50%);}

#main-visual-bird01{width: 16%; z-index: 2; opacity: 0;}
.loaded #main-visual-bird01{
	left: 66%; top: 8%; animation: fade-in ease-in forwards 1.2s, bird1-v-sp 2.5s ease-in-out infinite alternate,
	bird1-h 7s ease-in-out infinite alternate, bird1-turn 14s linear infinite;
	animation-delay: 8s;
}
#main-visual-bird02{width: 12%; z-index: 2; opacity: 0;}
.loaded #main-visual-bird02{
	left: 66%; top: 8%; animation: fade-in ease-in forwards 1.2s, bird2-v-sp 2.5s ease-in-out infinite alternate,
	bird2-h 6s ease-in-out infinite alternate, bird2-turn 12s linear infinite;
	animation-delay: 8s;
}

#overview-area .activity-block{width: 100%; height: calc(var(--content-width) * 0.50);}
#overview-area .activity-block p.title{top: 10%; width: 60%;}
#overview-area .activity-block p.paragraph{top: 20%; width: 50%;}
#overview-area .activity-block p.paragraph#life-text5{width: 60%;}
#overview-area .whiteblock{width: 90%; left: 5%;}
#life-photoframe4{width: 40%; left: 0%; top: -5%;  transform-origin: center; transform: rotate(5deg);}
#life-photoframe5{width: 40%; left: 60%; top: -20%; transform-origin: center; transform: rotate(-10deg);}

#access-area .area-paragraph{left: 8%; width: 80%;}
#access-area .access{width: 90%; left: 5%; height: calc(var(--content-width) * 0.70);}
#access-area .access-map{width: 80%; left: 10%; height: 75%;}
#access-area .access .paragraph{width: 80%; left: 10%; top: 85%; transform: none;}

#news-list-area table{
	width: 90%; left: 5%;
}
#year-switch{right: 5%; top: calc(var(--content-width) * 0.04);}

.news-detail-date{right: 5%; text-align: right;}

form .full-input{
	width: calc(var(--font-base) * 13.2);
	height: calc(var(--font-base) * 2);
	border: 0;
	padding: 0 calc(var(--font-base) * 1);
	font-size: calc(var(--font-base) * 0.9);
	font-family: "Kaisei Opti", serif;
	font-weight: 500;
	font-style: normal;
}
form textarea{
	width: calc(var(--font-base) * 13.2);
	height: calc(var(--font-base) * 7);
	border: 0;
	padding: calc(var(--font-base) * 0.5) calc(var(--font-base) * 1);
	font-size: calc(var(--font-base) * 0.9);
	font-family: "Kaisei Opti", serif;
	font-weight: 500;
	font-style: normal;
	background-color: white;
}
form button{
	width: calc(var(--content-width) * 0.40); left: calc(var(--content-width) * 0.30);
	height: calc(var(--content-width) * 0.08);
	background-color: rgb(168, 122, 90);
	border-radius: calc(var(--font-base) * 0.2);
	margin-top: calc(var(--content-width) * 0.04);
	margin-bottom: calc(var(--content-width) * 0.04);
}

.side-menu{background: rgb(224, 191, 0);}
.side-menu-ul .decorated-link{color: rgb(254, 255, 197);}
.side-menu-ul li{height: 7%;}