@charset "Shift_JIS";

/*=========================================
#header
=========================================*/
#headr_area{
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 4;
  margin: 0 auto;
  background: #FFF;
  border-bottom: 4px solid #FAD9FB;
  box-shadow: 0.25em 0.25em 0.5em -0.25em rgba(0, 0, 0, 0.3), -0.25em -0.25em 0.5em -0.25em rgba(255, 255, 255, 0.75);
}
#headr_area #header {
  max-width: 1200px;
  margin: 0 auto;
  padding: 10px 10px;
  display: flex;
  align-items: center;
}
#headr_area #header .cLeft {
  width: 20%;
}
#headr_area #header .cRight {
  width: 80%;
}
#headr_area li {
  font-size: 1px!important;
}
#headr_area #header .cLeft .logo_pc {
	display: flex;
	align-items: center;
}
#headr_area #header .cLeft .logo_pc img {
	width: 176px;
	margin-right: 10px;
}
#headr_area #header .cLeft .logo_pc img:hover {
	opacity: 0.7;
}
#headr_area #header .cRight .navigation_pc {
  list-style:none;
  margin: 0;
  padding: 0;
  display: flex;
  justify-content: right;
  border-right: 1px solid #c7b78d;
}
#headr_area #header .cRight .navigation_pc li{
  width: 24.5%;
  padding: 10px 0;
  text-align: center;
	text-decoration: none;
  border-right: 1px solid #c7b78d;
}
#headr_area #header .cRight .navigation_pc li:last-child {
  border-right: none;
  align-self: center;
}
#headr_area #header .cRight .navigation_pc li a {
  font-size: 16px;
	line-height: 140%;
  color: #333;
  height: 100%;
  text-align: center;
	text-decoration: none;
  align-items: center;
  display: block;
  justify-content: center;
}
#headr_area #header .cRight .navigation_pc li a span {
  color: #E4007F;
  font-weight: bold;
  font-size: 1.1em;
}
#headr_area #header .cRight .navigation_pc li a:hover {
  text-decoration: none;
  opacity: 0.7;
}

.navigation {
	display: none;
}
.header {
		display: none;
}



@media (max-width:959px) {
	#headr_area {
		display: none;
	}

	/*=========================================
	#hamburger
	=========================================*/
	.header {
		width: 100%;
		height: 50px;
		display: flex;
		justify-content: space-between;
		align-items: center;
		position: relative;
		background: #FFF;
		box-shadow: 0.25em 0.25em 0.5em -0.25em rgba(0, 0, 0, 0.3), -0.25em -0.25em 0.5em -0.25em rgba(255, 255, 255, 0.75);
		position: fixed;
		top: 0;
		left: 0;
		z-index: 4;
	}
	.header .logo img {
		width: 150px;
		height: auto;
		margin-left: 15px;
	}
	.hamburger-menu {
		width: 50px;
		height: 53px;
		position: relative;
		border: none;
		background: transparent;
		appearance: none;
		padding: 0;
		outline: none;
		margin-right: 10px;
	}
	.hamburger-menu__bar {
		display: inline-block;
		width: 55%;
		height: 3px;
		background: #E4007F;
		position: absolute;
		left: 53%;
		transform: translateX(-50%);
		transition: .5s;
	}
	.hamburger-menu__bar:first-child {
		top: 16px;
	}
	.hamburger-menu__bar:nth-child(2) {
		top: 24px;
	}
	.hamburger-menu__bar:last-child {
		top: 32px;
	}
	.hamburger-menu--open .hamburger-menu__bar {
		top: 50%;
	}
	.hamburger-menu--open .hamburger-menu__bar:first-child {
		transform: translateX(-50%) translateY(-50%) rotate(45deg);
	}
	.hamburger-menu--open .hamburger-menu__bar:last-child {
		transform: translateX(-50%) translateY(-50%) rotate(-45deg);
	}
	.hamburger-menu--open .hamburger-menu__bar:nth-child(2) {
		display: none;
	}

	.navigation {
		display: none;
		background: #fce6fd;
		position: absolute;
		top: 50px;
		width: 100%;
		z-index: 9999;
		box-shadow: 0.25em 0.25em 0.5em -0.25em rgba(0, 0, 0, 0.3), -0.25em -0.25em 0.5em -0.25em rgba(255, 255, 255, 0.75);
	}
	.navigation__list {
		text-align: left;
		list-style: none;
		padding: 0;
		margin: 0;
	}
	.navigation__list-item a {
		color: #333;
	}
	.navigation__list-item a::after {
    content: "";
    width: 15px;
    height: 24px;
    position: absolute;
    z-index: -2;
    right: 10px;
    background: url(../images/arrow_right.png) bottom 0.5em center / 0.75em 0.75em no-repeat;
}
	.navigation__list-item {
		border-bottom: solid 1px #fdc2ff;
	}
	.navigation__list-item:first-child {
		border-top: solid 1px #fdc2ff;
	}
	.navigation__link {
		color: #333;
		font-size: 15px;
		font-weight: bold;
		text-decoration: none;
		display: block;
		padding: 20px 15px;
		transition: .5s;
	}
	.navigation__link span {
		color: #E4007F;
		font-size: 1.1em;
	}
	@media (hover: hover) and (pointer: fine) {
		.navigation__link:hover {
			opacity: 0.7;
			color: #333;
			text-decoration: none;
		}
	}
	
	



}	