html, body, #page{
	overflow: hidden;
}
@keyframes logo_anime {
  0% {
    stroke-dashoffset: 500;
    fill:#1e2f3f;
  }
  50%{
  	fill:transparent;
  }
  100% {
    stroke-dashoffset: 0;
    fill:#a964ff;
  }
}
.sp-menu-btn:not(.is-open){
	border-color: var(--gnav-color);

}
.sp-menu-btn:not(.is-open) .-line{
	background-color: var(--gnav-color);
}
.sp-menu-btn:not(.is-open) .-line:before,
.sp-menu-btn:not(.is-open) .-line:after{
	background-color: var(--gnav-color);
}
.page-about .header .logo svg path {
	stroke-dasharray: 2000;
	stroke-dashoffset: 0;
	stroke-width: .5;
}
.page-about .header .logo:hover svg path {
	stroke:#17a5ff;
	animation: logo_anime 0.5s ease-in 0s forwards;
	fill-opacity: 1;
}
.page-child-total_design #slideContainer{
	width: 400%;
}
.page-child-total_design #pinContainer{
	width: 100%;
}
.page-child-total_design .panel{
	width: 25%;
}
.page-child-total_design #sec0{
	background: url(../images/about/about_intro.webp) 50% 50%;
	background-size: cover;
}
.page-child-total_design .center-box{
	background-color: rgba(169, 100, 255, 0.5);
}
.page-child-total_design #pinContainer .sec-title{
	color: #a964ff;
}

@media(max-width: 767px){
	html, body, #page{
		overflow: inherit;
	}
	.page-child-total_design .box-title img{
		height: 40px;
	}
	.page-child-total_design .text-img img{
		width: 200px;
	}
}