.header-visual{height: calc(var(--content-width) * 1.40);}
#header-area .logo{width: 50%;}
#header-area .copy{top: 4%; right: 76%; line-height: 1.6;}

.header-logo{width: 100%; height: calc(var(--content-width) * 0.20); margin-top: 0;}
.header-logo .image{height: 100%; left: 50%; transform: translate(-50%, 0);}
.header-logo.disabled{display: none;}

#rollback-area{height: calc(var(--content-width) * 0.18);}
#rollback-area .link-button{width: 50%;}

#footer-area{height: calc(var(--content-width) * 0.72); background: linear-gradient(135deg, rgb(170, 18, 18), rgb(133, 13, 13));}
#footer-area .logo{width: calc(var(--content-width) * 0.30); height: calc(var(--content-width) * 0.30); left: 50%; top: 25%; transform: translate(-50%,-50%);}
#footer-area .profile{width: 70%; right: 50%; top: 65%; transform: translate(50%,-50%); text-align: center; z-index: 1;}

#news-area{height: calc(var(--content-width) * 0.36);}
#news-area p.subtitle{left: 50%; transform: translate(-50%,0);}
#news-area table{width: 80%; left: 10%; top: calc(var(--content-width) * 0.12); font-size: calc(var(--font-base) * 1.2);}
#news-area table td.news-date{width: calc(var(--content-width) * 0.16);}
#news-area .link-button{width: 50%; left: 25%; height: calc(var(--content-width) * 0.09); top: calc(var(--content-width) * 0.24);}
#news-area .link-button p{font-size: calc(var(--font-base) * 1.0);}

#concept-area{height: calc(var(--content-width) * 2.10);}
#concept-area .concept-image1{width: 60%; left: 20%; height: calc(var(--content-width) * 0.50); top: 0;}
#concept-area .concept-image2{width: 60%; left: 20%; height: calc(var(--content-width) * 0.45); top: calc(var(--content-width) * 1.60);}
#concept-area p{width: 70%; left: 15%; top: calc(var(--content-width) * 0.70);}
#concept-area p.subtitle{font-size: calc(var(--font-base) * 1.2); }

#link-area{height: calc(var(--content-width) * 2.10); background: linear-gradient(135deg, rgb(48, 48, 48), rgb(0, 0, 0));}
#link-area .link-image1{width: 60%; left: 50%; height: calc(var(--content-width) * 0.50); top: calc(var(--content-width) * 0.10); transform: translate(-50%, 0);}
#link-area .link-image2{width: 60%; left: 50%; height: calc(var(--content-width) * 0.50); top: calc(var(--content-width) * 0.75); transform: translate(-50%, 0);}
#link-area .link-image3{width: 60%; left: 50%; height: calc(var(--content-width) * 0.50); top: calc(var(--content-width) * 1.40); transform: translate(-50%, 0);}
#link-area .link-title1{width: 60%; left: 50%; top: calc(var(--content-width) * 0.64); transform: translate(-50%, 0);}
#link-area .link-title2{width: 60%; left: 50%; top: calc(var(--content-width) * 1.29); transform: translate(-50%, 0);}
#link-area .link-title3{width: 60%; left: 50%; top: calc(var(--content-width) * 1.94); transform: translate(-50%, 0);}

#access-area{height: calc(var(--content-width) * 1.28);}
#access-area .access-map{width: 60%; left: 20%;  height: calc(var(--content-width) * 0.48); top: calc(var(--content-width) * 0.24);}
#access-area .profile{width: 60%; left: 20%; text-align: center; top: calc(var(--content-width) * 0.48);}
#access-area .instagram{height: calc(var(--content-width) * 0.12); top: calc(var(--content-width) * 1.16); left: 22%;}
#access-area .line{height: calc(var(--content-width) * 0.12); top: calc(var(--content-width) * 1.16); left: 38%;}
#access-area .link-button{width: 50%; left: 25%; height: calc(var(--content-width) * 0.09); top: calc(var(--content-width) * 1.00);}
#access-area .link-button p{font-size: calc(var(--font-base) * 1.0);}

#menu-area .main-visual{width: 100%; height: calc(var(--content-width) * 0.70);}
#menu-area .main-visual .title{font-size: calc(var(--font-base) * 2.8); top: 50%; transform: translate(-50%, -50%);}
#menu-area .image-relative{width: 88%; left: 6%;}

#overview-area .main-visual{width: 100%; height: calc(var(--content-width) * 0.70);}
#overview-area .main-visual .title{font-size: calc(var(--font-base) * 2.8); top: 50%; transform: translate(-50%, -50%);}
#overview-area table{width: 84%; left: 8%;}
#overview-area tr{width: 100%;}
#overview-area th{width: 20%;}
#overview-area td{width: 80%;}
#overview-area .link-button{width: 50%; left: 25%; height: calc(var(--content-width) * 0.09);}
#overview-area .link-button p{font-size: calc(var(--font-base) * 1.0);}

#message-area .main-visual{width: 100%; height: calc(var(--content-width) * 0.70);}
#message-area .main-visual .title{font-size: calc(var(--font-base) * 2.8); top: 50%; transform: translate(-50%, -50%);}
#message-area .paragraph{width: 84%; left: 8%;}
#message-area .right{text-align: right;}

#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;}

.side-menu{background: linear-gradient(135deg, rgb(170, 18, 18), rgb(133, 13, 13));}
.side-menu-ul li{
	font-size: calc(var(--font-base) * 1.5);
	height: 10%;
}
.side-menu-ul li .decorated-link{color: gold;}
