
aside.main-floating-layer{

	position: fixed;
	right:12px;
	bottom:12px;
	z-index: 500;

	.floating-layer-wrapper{

		.btn-list{
			display: inline-flex;
			flex-direction: column;
			gap: 8px;

			.floating-btn{
				display: inline-flex;
				align-items: center;
				justify-content: center;
				border-radius:50%;
				width: 46px;
				height: 46px;
				overflow: hidden;

				img{
					max-width:100%;
					max-height: 100%;
				}
			}
		}

	}
}


article.view-layer {
	position: fixed;
	z-index: 501;
	display: none;


	&:before {
		z-index: 400;
		position: fixed;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		content: '';
		background-color: rgba(0, 0, 0, .4);
	}

	.layer-wrapper {
		box-sizing: border-box;
		position: fixed;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		max-width: 500px;
		margin: 0 auto;
		width: calc(100% - 30px);
		z-index: 401;

		.layer-contents {
			overflow: hidden;
			border-radius: 16px;
			animation: showSweetAlert .3s;
			will-change: transform;
			background-color: #fff;
		}

		.layer-view{

			img{
				max-width:100%;
				display: block;
			}



		}

	}

}
