@charset "utf-8";
/* CSS Document */


/* 以下はスクリプト関係 */

div#forIE {
	display: none;
	margin-top: -6px;
	text-align: center;;
}
div#notforIE {
	margin-top: -10px;
	text-align: center;;
}

@media all and (-ms-high-contrast: none){

div#forIE {
	display: block;
}

div#notforIE {
	display: none;
}

}

/*------------------------------------------ ボタン */

button#btnStartAnim {
	margin-bottom: 8px;
	padding: 1px 10px 0 10px;
	color: white;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 14px;
	-webkit-text-size-adjust: 100%;	/* iPhone横位置でフォントサイズが変わるのを抑制 */
	background-color: gray;
	border: none;
	border-radius: 12px;
	cursor: pointer;
}

/*------------------------------------------ スライダー */

input[type=range] {
	-webkit-appearance: none;
	margin: -20px 0 0 0;
	width: 200px;
	cursor: pointer;
}
input[type=range]:focus {
	outline: none;
}

/****************************** WebKit・Blink */
input[type=range]::-webkit-slider-runnable-track {	/* 溝 */
	height: 5px;
	background-color: silver;
	border: 1px solid dimgray;
	border-radius: 3px;
	cursor: pointer;
	animate: 0.2s;
}
input[type=range]::-webkit-slider-thumb {	/* つまみ */
	width: 17px;
	height: 17px;
	background-color: #a89dac;
	border: 1px solid dimgray;
	border-radius: 50%;
	cursor: pointer;
	-webkit-appearance: none;
	margin-top: -7px;	/* 縦位置調整 */
}

/* 何故か上の margin-top 指定が Edge に効いてしまうので、Edge向けに設定をリセット */
@supports (-ms-ime-align: auto) {
input[type=range]::-webkit-slider-thumb {
	margin-top: 0 !important;
}
}

/****************************** Firefox */
input[type=range]::-moz-range-track {	/* 溝 */
	height: 3px;
	background-color: silver;
	border: 1px solid dimgray;
	border-radius: 3px;
	animate: 0.2s;
}
input[type=range]::-moz-range-thumb {	/* つまみ */
	width: 15px;
	height: 15px;
	background-color: #a89dac;
	border: 1px solid dimgray;
	border-radius: 50%;
}

/****************************** Edge・IE */
input[type=range]::-ms-track {	/* 背景 */
	height: 5px;
	color: transparent;
	background-color: transparent;
	border-color: transparent;
	border-width: 6px 0;
	animate: 0.2s;
}
input[type=range]::-ms-fill-lower,	/* 溝（つまみより左側） */
input[type=range]::-ms-fill-upper {	/* 溝（つまみより右側） */
	background-color: silver;
	border: 1px solid dimgray;
	border-radius: 3px;
}
input[type=range]::-ms-thumb {	/* つまみ */
	width: 15px;
	height: 15px;
	background-color: #a89dac;
	border: 1px solid dimgray;
	border-radius: 50%;
}
input[type=range]::-ms-tooltip {	/* ポップアップを非表示 */
	display: none;
}