h1{
    font-size: 48px;
    line-height: 1.4;
    font-weight: normal;
    text-align:center;
    margin: 30px 0 30px;
  }
@media only screen and (max-width: 480px) {
h1{
	font-size: 32px;
}
}

h2{
	text-align: center;
	font-size: 30px;
	line-height: 1.6;
	text-align:center;
}
@media only screen and (max-width: 480px) {
	h2{
		font-size: 20px;
	}
}

h3.head {
  text-align: center;
  color: #333 !important;
  margin: 0px 0px 30px;
}

.logo {
  max-width: 500px;
  width: 90%;
  margin: -20px auto 40px;
  display: block;
}
#logo {
  transition: all 0.3s ease;
  transform: scale(1);
}
#logo:hover {
  transform: scale(1);
}
#logo:active {
  transform: scale(0.9);
}

@media only screen and (max-width: 480px) {
  .logo {
    display: none;
  }
}

.buttonIcon {
  font-size: 30px !important;
  transition: all 0.3s ease;
  transform: scale(1);
}
.buttonIcon:hover {
  transform: scale(1);
}
.buttonIcon:active {
  transform: scale(0.9);
}

.post-title h3 {
  font-size: 24px;
  font-family: "Libre Bodoni", "Noto Sans JP", sans-serif;
  margin: 15px 0;
  text-align: center;
  letter-spacing: 2px;
}

.material-symbols-outlined {
    font-variation-settings:
    'FILL' 0,
    'wght' 400,
    'GRAD' 0,
    'opsz' 24;
    margin: 0px 5px;
  }
  .material-symbols-outlined.selected {
    font-variation-settings:
    'FILL' 1,
    'wght' 400,
    'GRAD' 0,
    'opsz' 24
  }


	header{
		margin: 15px 0 0;
		padding-top: 10px;
		font-size: 17px;
	}
	header a{
		color:#333;
		text-decoration: none;
		font-family: "Inter", sans-serif;
	}
	header a:hover{
		text-decoration: underline;
	}
	.header-wrap{
		display:flex;
		max-width: 1300px;
		margin:0 auto;
		padding: 0px 20px;
		width: 100%;
		justify-content: center;
		box-sizing: border-box;
	}
	.header-title{
		font-weight: 500;
		margin: 0;
	}
	nav#header{
		display:flex;
		align-items: center;
		justify-content: end;
	}

	.header-menu{
		list-style:none;
		display:flex;
		margin: 0;
		padding: 0;
	}
	.header-menu li
	{
		padding-left: 20px;
	}
	.header-menu li a{
		padding: 0;
		margin: 0;
		height: 60px;
	}

	.brand_logo {
		max-height: 60px; width: auto; display: block;
	}

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

		.header-wrap{
			margin-bottom:35px;
		}

		.brand_logo {
			max-height: 40px; width: auto; display: block;
		}
		.pc{
			display: none !important;
		}
		.buttonIcon{
		}
		.header-menu li a{
			height: 24px;
		}
		.header-menu li
		{
			padding-left: 10px;
		}
	}