@charset "utf-8";




/* ーーーーーーーーーーーーーーーーーーーー
  サイドバー
ーーーーーーーーーーーーーーーーーーーー */

#side {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 1vw;
}

#side div.item {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	align-items: center;
	gap: var(--Size_04);
	padding: var(--Size_06);
	background: var(--Color_1D100);
	border-radius: var(--Border-radius_S);
}

.kanda #side div.item {
	padding: var(--Size_18) var(--Size_06) var(--Size_06);
}

#side aside {
	display: flex;
	flex-direction: row;
	align-items: stretch;
	gap: 1vw;
}

#side aside div.item {
	flex-basis: calc( calc( 100% - 2vw ) / 3 );
}

.osaka #side aside div.item {
	flex-basis: calc( calc( 100% - 1vw ) / 2 );
}




/* ーーーーーーーーーーーーーーーーーーーー
  時計
ーーーーーーーーーーーーーーーーーーーー */

#side date {
	color: var(--Color_FF100);
	font-size: var(--Size_12);
	line-height: 1;
}

#side date span {
	font-size: var(--Size_08);
}

.osaka #side date span {
	font-size: var(--Size_06);
}

#side time {
	color: var(--Color_FF100);
	font-size: var(--Size_16);
	line-height: 1;
}

#side.osaka time {
	font-size: var(--Size_14);
}

#side time span {
	font-size: var(--Size_12);
}

.osaka #side time span {
	font-size: var(--Size_08);
}

#side time span:nth-of-type(1) {
	padding: 0 var(--Size_04) 0 var(--Size_02);
}

#side time span:nth-of-type(2) {
	padding: 0 0 0 var(--Size_02);
}

#side div.item i {
	position: absolute;
	top: 0;
	left: 0;
	display: flex;
	justify-content: flex-start;
	align-items: flex;
	padding: var(--Size_04);
	width: var(--Size_30);
	height: var(--Size_30);
	color: var(--Color_FF100);
	line-height: 1;
	background: var(--Color_A100);
	clip-path: polygon(0% 0%, 100% 0%, 0% 100%);
	border-radius: var(--Border-radius_S) 0 0 0;
}

.kanda #side div.item i {
	background: var(--Color_K100);
}

.osaka #side div.item i {
	width: var(--Size_28);
	height: var(--Size_28);
	font-size: var(--Size_08);
	background: var(--Color_O100);
}




/* ーーーーーーーーーーーーーーーーーーーー
  LINE公式
ーーーーーーーーーーーーーーーーーーーー */

#side div.item p {
	text-align: center;
	font-size: var(--Size_08);
}

#side div.item img {
	width: 74px;
	border-radius: var(--Border-radius_S);
}




/* ーーーーーーーーーーーーーーーーーーーー
  Wi-Fi
ーーーーーーーーーーーーーーーーーーーー */

#side div.item p {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--Size_04);
	font-size: var(--Size_10);
	color: var(--Color_FF100);
	line-height: 1.4;
}

#side div.item ul {
	display: flex;
	flex-direction: column;
	gap: var(--Size_04);
}

#side div.item ul li {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: var(--Size_02);
	font-family: "Noto Sans", sans-serif;
	line-height: 1;
}

#side div.item em {
	font-size: var(--Size_06);
	color: var(--Color_FF060);
}

#side div.item strong {
	color: var(--Color_FF100);
	font-size: var(--Size_14);
}

.osaka #side div.item strong {
	font-size: var(--Size_10);
}