@charset "utf-8";


body#naha {
	& article {
		& aside {
			position: relative;
			flex-basis: 28vw;
			display: flex;
			flex-direction: column;
			gap: calc( 2 * var(--BaseSize) );
			padding: calc( 2 * var(--BaseSize) );
			overflow: hidden;
		}
	}
}
			
			
/* ーーーーーーーーーーーーーーーーーーーー
注意事項
ーーーーーーーーーーーーーーーーーーーー */
body#naha {
	& article {
		& aside {
			& section#floor {
				flex: 1;
				padding: calc( 2 * var(--BaseSize) ) calc( 2 * var(--BaseSize) ) 0;
				width: 100%;
				background: var(--Color_B100);
				border-radius: var(--Border-radius_S);
				overflow: hidden;
				& .slick-slider {
					display: flex;
					align-items: center;
					width: 100%;
					height: 100%;

					overflow: hidden;
					& .slick-list {
						width: 100%;
						& .slick-track {
							& img {
								width: 10px;
							}
						}
					}
				}
				& #video {
					position: absolute;
					top: 0;
					right: 0;
					awidth: 100%;
					height: 100%;
					text-align: center;
					overflow: clip;
					opacity: .4;
					& video {
						height: 100%;
					}
				}
			}
		}
	}
}



/* ーーーーーーーーーーーーーーーーーーーー
注意事項
ーーーーーーーーーーーーーーーーーーーー */
body#naha {
	& article {
		& aside {
			& section#notice {
				display: flex;
				flex-direction: column;
				gap: calc( 1 * var(--BaseSize) );
				& .rotate {
					position: relative;
					flex-basis: calc( calc( 100% - calc( 2 * calc( 1 * var(--BaseSize) ) ) ) / 3 );
					padding: calc( 1 * var(--BaseSize) ) 0;
					background: var(--Color_B100);
					border-radius: var(--Border-radius_S);
					overflow: hidden;
					& figure {
						position: absolute;
						top: calc( 1 * var(--BaseSize) );
						left: calc( 1 * var(--BaseSize) );
						display: flex;
						flex-direction: column;
						justify-content: center;
						align-items: center;
						gap: .3vw;
						width: calc( 5 * var(--BaseSize) );
						background: var(--Color_FF100);
						border: 2px var(--Color_R100) solid;
						border-radius: var(--Border-radius_L);
						aspect-ratio: 1 / 1;
						z-index: 1;
						& i {
							color: var(--Color_B100);
							font-size: calc( 2.8 * var(--BaseSize) );
							border-radius: var(--Border-radius_S);
						}
					}
					& figure:after {
						content: '';
						position: absolute;
						width: 100%;
						height: 2px;
						background: var(--Color_R100);
						transform: rotateZ(45deg) scale(1);
						transform-origin: center;
					}
					& .text {
						padding: 0 0 0 calc( 7 * var(--BaseSize) );
						width: 100%;
						overflow: clip;
						& .title {
							font-size: calc( 2.4 * var(--BaseSize) );
							color: var(--Color_FF100);
						}
						& .slick-slider {
							color: var(--Color_FF100);
							& .slick-list {
								& .slick-track {
									& .slick-slide {
										font-size: calc( 2 * var(--BaseSize) );
										display: inline-block;
										white-space: nowrap;
										margin-right: 2.5em;
									}
								}							
							}							
						}
					}
				}
			}
		}
	}
}