﻿/*percent*/
.st-w-100p {
	width: 100%;
}

.st-w-80p {
	width: 80%;
}

.st-w-8p-10p {
	width: 80%;
}

/*fixed width*/
.st-w-40 {
	width: 40px;
}

.st-w-100 {
	width: 100px;
}

.st-w-150 {
	width: 150px;
}

.st-h-40 {
	height: 40px;
}

.st-h-80 {
	height: 80px;
}

.st-h-380 {
	height: 380px;
}

.st-h-500 {
	height: 500px;
}

.st-fz-075 {
	font-size: 0.75rem;
}

.st-fz-1 {
	font-size: 1rem;
}

.st-fz-1-2 {
	font-size: 1.2rem;
}


.st-fz-1-3 {
	font-size: 1.3rem;
}

.st-fz-1-35 {
	font-size: 1.35rem;
}

.st-fz-1-4 {
	font-size: 1.4rem;
}

.st-fz-1-5 {
	font-size: 1.5rem;
}

.st-fz-1-6 {
	font-size: 1.6rem;
}

.st-fz-1-7 {
	font-size: 1.7rem;
}

.st-fz-1-8 {
	font-size: 1.8rem;
}

.st-fz-2 {
	font-size: 2rem;
}

.st-fz-2-1 {
	font-size: 2.1rem;
}

.st-fz-2-9 {
	font-size: 2.9rem;
}


.st-fz-3 {
	font-size: 3rem;
}

.st-fz-3-0 {
	font-size: 3rem;
}

.st-fz-4 {
	font-size: 4rem;
}

.st-fz-5 {
	font-size: 5rem;
}

.st-fz-title {
	font-size: 1.5rem;
}

.st-auto-shrink {
	/* 最小8px〜最大12pxの範囲で、行内に収まるまで縮小 */
	font-size: clamp(10px, calc(100vw / (var(--chars, 60) * 1.1)), 12px);
	/* 1行に制限 */
	white-space: nowrap;
	overflow: hidden;
}

.st-auto-shrink-mid {
	/* 最小10px〜最大12pxの範囲で、行内に収まるまで縮小 */
	font-size: clamp(12px, calc(100vw / (var(--chars, 60) * 1.1)), 16px);
	/* 1行に制限 */
	white-space: nowrap;
	overflow: hidden;
}
/*上記は、980px以上用（PC用）の記述 */

@media screen and (max-width: 979px) {
	/* 979px以下用（タブレット用）の記述 */
	.st-w-8p-10p {
		width: 95%;
	}
	/*.st-fz-2 {
		font-size: calc(2rem - 0.5rem);
	}*/

	.st-fz-3 {
		font-size: calc(3rem - 0.5rem);
	}

	.st-fz-3-0 {
		font-size: calc(3rem - 0.5rem);
	}

	.st-fz-4 {
		font-size: calc(4rem - 1rem);
	}

	.st-fz-title {
		font-size: 1.3rem;
	}
}

/*@media screen and (max-width: 767px) {*/
/* 767px以下用（タブレット／スマートフォン用）の記述 */
/*.st-fz-4 {
		font-size: calc(4rem - 1rem);
	}
}*/

@media screen and (max-width: 479px) {
	/* 479px以下用（スマートフォン用）の記述 */
	.st-fz-1-5 {
		font-size: calc(1.5rem - 0.28rem);
	}

	.st-fz-1-6 {
		font-size: calc(1.6rem - 0.2rem);
	}

	.st-fz-1-7 {
		font-size: calc(1.7rem - 0.2rem);
	}

	.st-fz-2 {
		font-size: calc(2rem - 0.5rem);
	}

	.st-fz-3 {
		font-size: calc(3rem - 1rem);
	}

	.st-fz-3-0 {
		font-size: calc(3rem - 1.3rem);
	}

	.st-fz-4 {
		font-size: calc(4rem - 1.7rem);
	}

	.st-fz-title {
		font-size: 1.2rem;
	}
/*	.st-fz-title {
		font-size: 1.2rem;
	}*/
	/*	.st-fz-06 {
		font-size: 0.6rem;
		transform: scale(0.9);
	}*/

}

@media screen and (max-width: 360px) {
	.st-fz-1-6 {
		font-size: calc(1.6rem - 0.4rem);
	}

	.st-fz-1-2 {
		font-size: 1.1rem;
	}

}

@media screen and (max-width: 320px) {
	/* 320px以下用（スマートフォン用）の記述 */
	.st-fz-1-5 {
		font-size: calc(1.5rem - 0.5rem);
	}

	.st-fz-2 {
		font-size: calc(2rem - 1rem);
	}

	.st-fz-3 {
		font-size: calc(3rem - 1.5rem);
	}

	.st-fz-3-0 {
		font-size: calc(3rem - 1.5rem);
	}

	.st-fz-4 {
		font-size: calc(4rem - 2.1rem);
	}

	.st-fz-075 {
		font-size: 0.6rem;
		transform: scale(0.8);
	}
}
