#loading {
	  width: 100vw;
	  height: 100vh;
	  transition: all 1s;
	  background-color: #fff;
	  position: fixed;
	  top: 0;
	  left: 0;
	  z-index: 9999;
	}

	.loaded {
	  opacity: 0;
	  visibility: hidden;
	}

	.spinner {
	  width: 200px;
	  height: 200px;
	  margin: 200px auto;
	  background-color: #fff;
	  border-radius: 100%;
	  animation: sk-scaleout 2.0s infinite ease-in-out;
	}
	/* ローディングアニメーション */
	@keyframes sk-scaleout {
	 0% { transform: translateY(0) }
	  33.33333% { transform: translateY(-15px) }
	  66.66667% { transform: translateY(0) }
	  100% { transform: translateY(0) }
	}

	.topbody {
	  padding: 2rem 1rem;
	  margin-bottom: 2rem;
	  background-image:url("images/topview.jpg");
	  background-position: right;
	  background-repeat: no-repeat;
	  background-color: #e9ecef;
	  border-radius: 0.3rem;
	}
	.cscolor{
	color:#21aee6;
	}
	.cscolor_bg{
	background-color:#21aee6;
	}
	
	.sdgscolor_1{
	color:#de4c31;
	border-bottom-width: 8px;
	border-bottom-color:#de4c31;
	}

	.sdgscolor_1:hover,.sdgscolor_1.active{
	color:#fff;
	background-color:#de4c31;
	}

	.sdgscolor_2{
	color:#79ccbf;
	border-bottom-width: 8px;
	border-bottom-color:#79ccbf;
	}
	.sdgscolor_2:hover,.sdgscolor_2.active{
	color:#fff;
	background-color:#79ccbf;
	}
	.sdgscolor_3{
	color:#83c9eb;
	border-bottom-width: 8px;
	border-bottom-color:#83c9eb;
	}
	.sdgscolor_3:hover,.sdgscolor_3.active{
	color:#fff;
	background-color:#83c9eb;
	}

	.sdgscolor_4{
	color:#a386bf;
	border-bottom-width: 8px;
	border-bottom-color:#a386bf;
	}
	.sdgscolor_4:hover,.sdgscolor_4.active{
	color:#fff;
	background-color:#a386bf;
	}

	.sdgscolor_5{
	color:#ffaf9d;
	border-bottom-width: 8px;
	border-bottom-color:#ffaf9d;
	}
	.sdgscolor_5:hover,.sdgscolor_5.active{
	color:#fff;
	background-color:#ffaf9d;
	}

	.sdgscolor_6{
	color:#ffcc3b;
	border-bottom-width: 8px;
	border-bottom-color:#ffcc3b;
	}
	.sdgscolor_6:hover,.sdgscolor_6.active{
	color:#fff;
	background-color:#ffcc3b;
	}

	.sdgscolor_7:hover{
	background-color:#e078db;
	}


	.font-copy{
		font-family: a-otf-ud-shin-go-pr6n, sans-serif;
		font-weight: 400;
		font-style: normal;
	}


	.font-message{
		font-family:a-otf-ud-reimin-pr6n, sans-serif;
		font-weight: 300;
		font-style: normal;
	}

	.font-yabuki{
		font-family:  ta-kai-regular, serif;
		font-weight: 400;
		font-style: normal;
	}
	.font-menu{
		font-family: a-otf-ud-shin-go-pr6n, sans-serif;
		font-weight: 300;
		font-style: normal;
	}

body{
		font-family: a-otf-ud-shin-go-pr6n, sans-serif;
		font-weight: 300;
		font-style: normal;
}