.contents .side-nav.ScrollSideTop {
	max-width: 300px;
	background: #44a3a8;
	width: 100%;
	position: fixed;
	min-height: 100vh;
	height: 100%;
	overflow: visible;
	top: 85px;
	z-index: 1;
}
.contents .side-nav.ScrollSideTop.side-fixed-content {
	position: fixed;
	top: 85px;
	height: 100%;
	z-index: 19;
}
.contents .side-nav.ScrollSideTop.side-fixed-content + .main-contents.side-fixed-area {
	margin-left: 330px;
}
.side-nav ul {
	list-style: none;
	padding: 0;
	margin: 0;
}
.side-nav ul.menu-01  li > a {
	color: #FFFFFF;
	transition: all 0.4s ease;
}
.side-nav ul.menu-01 > li > a + ul.menu-02 {
	display: none;
}
/* .side-nav ul.menu-01 > li:hover > a + ul.menu-02, */
.side-nav ul.menu-01 > li.active > a + ul.menu-02,
.side-nav ul.menu-01 > li ul.menu-02.active {
	pointer-events: auto;
	background: #3d9498;
	display: block;
}
.side-nav ul.menu-01  li > a:hover,
.side-nav ul.menu-01 > li > a.active,
.side-nav ul.menu-01 > li ul.menu-02 li a.active,
.side-nav ul.menu-01 > li.active > a + ul.menu-02 li a.active {
	color: #FFD800;
}

.side-nav ul.menu-01 > li {
	position: relative;
}
.side-nav ul.menu-01 > li:hover,
.side-nav ul.menu-01 > li .nav-opener.active {
	background: #3a8a8f;
}

.side-nav ul.menu-01 > li a {
	padding: 0.6em 15px 0.6em 25px;
	position: relative;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	gap: 10px;
	position: relative;
}
.side-nav ul.menu-01 > li a i.attention {
	position: absolute;
	top: 50%;
	right: 15px;
	transform: translateY(-50%);
	width: 24px;
	height: 24px;
	background-image: url(../img/common/icon-attention.png);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: 100%;
}
.side-nav ul.menu-01 > li a i.attention img {
	width: 1.5em;
}
.side-nav ul.menu-01 > li > a::before {
	content: "";
	background-image: url(../img/common/icon-mypage-no01-off.png);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: auto 20px;
	display: inline-block;
	width: 34px;
	height: 24px;
}
.side-nav ul.menu-01 > li.list-01 > a::before { background-image: url(../img/common/icon-mypage-no01-off.png); }
.side-nav ul.menu-01 li.list-01 > a:hover::before,
.side-nav ul.menu-01 > li.list-01 > a.active::before { background-image: url(../img/common/icon-mypage-no01-on.png); }
.side-nav ul.menu-01 > li.list-02 > a::before { background-image: url(../img/common/icon-mypage-no02-off.png); }
.side-nav ul.menu-01 li.list-02 > a:hover::before,
.side-nav ul.menu-01 > li.list-02 > a.active::before { background-image: url(../img/common/icon-mypage-no02-on.png); }
.side-nav ul.menu-01 > li.list-03 > a::before { background-image: url(../img/common/icon-mypage-no03-off.png); }
.side-nav ul.menu-01 li.list-03 > a:hover::before,
.side-nav ul.menu-01 > li.list-03 > a.active::before { background-image: url(../img/common/icon-mypage-no03-on.png); }
.side-nav ul.menu-01 > li.list-04 > a::before { background-image: url(../img/common/icon-mypage-no04-off.png); }
.side-nav ul.menu-01 li.list-04 > a:hover::before,
.side-nav ul.menu-01 > li.list-04 > a.active::before { background-image: url(../img/common/icon-mypage-no04-on.png); }
.side-nav ul.menu-01 > li.list-05 > a::before { background-image: url(../img/common/icon-mypage-no05-off.png); }
.side-nav ul.menu-01 li.list-05 > a:hover::before,
.side-nav ul.menu-01 > li.list-05 > a.active::before { background-image: url(../img/common/icon-mypage-no05-on.png); }
.side-nav ul.menu-01 > li.list-06 > a::before { background-image: url(../img/common/icon-mypage-no06-off.png); }
.side-nav ul.menu-01 li.list-06 > a:hover::before,
.side-nav ul.menu-01 > li.list-06 > a.active::before { background-image: url(../img/common/icon-mypage-no06-on.png); }
.side-nav ul.menu-01 > li.list-07 > a::before { background-image: url(../img/common/icon-mypage-no07-off.png); }
.side-nav ul.menu-01 li.list-07 > a:hover::before,
.side-nav ul.menu-01 > li.list-07 > a.active::before { background-image: url(../img/common/icon-mypage-no07-on.png); }
.side-nav ul.menu-01 > li.list-08 > a::before { background-image: url(../img/common/icon-mypage-no08-off.png); }
.side-nav ul.menu-01 li.list-08 > a:hover::before,
.side-nav ul.menu-01 > li.list-08 > a.active::before { background-image: url(../img/common/icon-mypage-no08-on.png); }
.side-nav ul.menu-01 > li.list-09 > a::before { background-image: url(../img/common/icon-mypage-no09-off.png); }
.side-nav ul.menu-01 li.list-09 > a:hover::before,
.side-nav ul.menu-01 > li.list-09 > a.active::before { background-image: url(../img/common/icon-mypage-no09-on.png); }

.side-nav ul.menu-01 > li ul.menu-02 a {
	padding-left: 70px;
}
.side-nav ul.menu-01 li ul.menu-03 {
	display: none;
}
/* .side-nav ul.menu-01 li a.side-nav-opener + ul.menu-03 {
	height: 0;
	width: 0;
	opacity: 0;
	transition: all 0.5s ease;
}
.side-nav ul.menu-01 li a.side-nav-opener:hover + ul.menu-03 {
	height: auto;
	width: 260px;
	opacity: 1;
} */
.side-nav ul.menu-01 > li a.side-nav-opener + ul.menu-02 {
}
.side-nav ul.menu-01 > li:hover a.side-nav-opener:not(.active) + ul.menu-02 {
	background-color: #417d80;
	position: absolute;
	left: 100%;
	top: 0;
	width: 260px;
	height: auto;
	display: block;
	padding: 10px 0;
}
.side-nav ul.menu-01 > li:hover a.side-nav-opener:not(.active) + ul.menu-02 a {
	padding: 5px 20px;
}
.side-nav ul.menu-01 > li:hover a.side-nav-opener:not(.active) + ul.menu-02::before {
	content: "";
	position: absolute;
	top: 12px;
	left: -40px;
	display: block;
	border-top: 10px solid rgba(0,0,0,0);
	border-right: 10px solid #417d80;
	border-bottom: 10px solid rgba(0,0,0,0);
	border-left: 10px solid rgba(0,0,0,0);
	width: 20px;
	height: 0;
}

@media screen and (max-width:1024px) {
	.hamburger-menu .side-nav.ScrollSideTop ul.menu-01 > li > a {
		background: #44a3a8;
		padding-right: 50px;
		border-bottom: 1px solid #31787c;
		border-top: 1px solid #3ab4ba;
	}
	.hamburger-menu .side-nav.ScrollSideTop ul.menu-01 > li > a::after {
		content: "";
		background-image: url(../img/common/icon-arrow-02-wit.png);
		width: 40px;
		height: 40px;
		position: absolute;
		right: 0;
		top: 50%;
		transform: translateY(-50%) rotate(-90deg);
		background-position: center center;
		background-repeat: no-repeat;
		background-size: auto 20px;
		transition: all 0.5s ease;
	}
	.hamburger-menu .side-nav.ScrollSideTop ul.menu-01 > li > a.active::after {
		transform: translateY(-50%) rotate(90deg);
	}
	.hamburger-menu .side-nav.ScrollSideTop ul.menu-01 > li.non-list > a::after,
	.hamburger-menu .side-nav.ScrollSideTop ul.menu-01 > li.non-list > a.active::after { display: none; }
	.hamburger-menu .side-nav.ScrollSideTop ul.menu-01 > li > ul.menu-02 a {
		padding-left: 70px;
	}

}