@charset "UTF-8";
p{
	margin-block-start: 0px;
    margin-block-end: 0px;
}
a:hover{
	opacity: 1!important;
}
/********** breadcrumbs **********/
.c-breadcrumbs{
  top:100px;
	z-index: 3;
}
.c-breadcrumbs_sub{
	width: 230px;
	height: 90px;
  position:fixed;
  top:290px;
  left:30px;
  z-index: 3;
}
.l-contents-side a{
	color: #fff;
}
.l-contents-side a span {
	font-size: 0.75em;
}
@media screen and (max-width: 768px) {
	.c-breadcrumbs {
		left:25px;
        z-index:2;
        top:15%;
	}
	.c-breadcrumbs_sub{
        left:25px;
        z-index:2;	
	}
}
.c-breadcrumbs-list,
.side-button {
 -webkit-writing-mode: vertical-rl; 
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  font-size: 12px;
	width: 20px;
	z-index: 10;
}
.c-breadcrumbs-list a,
.side-button a {
  color:#fff;
}
@media screen and (max-width: 768px) {
	.c-breadcrumbs-list a:hover {
		color:#fff;
	}
	.c-breadcrumbs-list,
    .side-button {
        font-size: 10px;
		width: auto;
	}
}
.side-button {
  position:fixed;
  top: 50%;
}
.c-breadcrumbs-list__item {
  position: relative;
  display: inline-block;
  margin-right: 0px!important;
}
@media screen and (max-width: 768px) {
	.sp-flex {
		display: flex;
		flex-direction: column-reverse;
		align-items: flex-start;
		gap: 75px;
	}
	.sp-archive-list{
		transform: rotate(-90deg);
		transform-origin: center left;
		opacity: 0;
		transition:0.4s;
        margin-top: 6.3px;
		pointer-events: none;
		line-height: 2.2em;
	}
	.sp-archive-list.open{
		opacity: 1;
		pointer-events: auto;
	}
}
/******************************/
/* Utility */
/******************************/
@media screen and (max-width: 768px) {
	.sp-only {
		display:block;
	}
	.pc-only {
		display:none;
	}
}
.l-contents-side {
	padding: 0px 5% 0;
	margin: 281px 0!important;
	z-index:3;
}
.l-side-navi-list__item{
	line-height: 2em;
}
.l-side-navi-list{
	display:none;
	pointer-events: none;
	animation: disappear .4s ease;
}
  @keyframes disappear {
    0%{
      opacity: 0;
    }
    100%{
      opacity: 1;
    }
  }
.l-side-navi .l-side-navi-list.hover_active{ 
    display: block;
	pointer-events: auto;
	animation: appear .4s ease;
}
  @keyframes appear {
    0%{
      opacity: 0;
    }
    100%{
      opacity: 1;
    }
  }
.l-side-navi-list a:hover{
	opacity: 0.7!important;
}
@media screen and (max-width: 768px) {
    .l-contents-side {
		background-color: transparent;
        z-index: 2;
        width: 100%;
        margin: 60px 0 0 -25px!important;
		transform: translateX(-100%);
        transition:0.4s;
        opacity: 0;
	}
	.l-contents-side.open {
		opacity:1;
		transform: translateX(0%);
	}
	.l-side-navi {
        position: relative;
        margin: 57.9vw auto 0 60px;
        line-height: 2;
        font-size: 10px;
    }
	.l-side-navi-list{
		display:block;
	}
	.close-btn {
        z-index: 999;
        position: absolute;
        color: #2A2D77;
        top: 30px;
        right: 30px;
    }
}