@charset "utf-8";

/* ------------------------------ */
/* フレームスクエアスクローラー */
/* ------------------------------ */

/* フレームスクエアスクローラー メイン枠 */
.frame_square_scroller_main_frame {
	overflow:hidden;
	position:relative;
	min-height:600px; /* フレームの高さを固定する場合 */
}

/* フレームスクエアスクローラー スライド枠 */
.frame_square_scroller_inner {
	display:flex; 
	flex-wrap:wrap;
	position:absolute;
}
.frame_square_scroller_inner img {
	pointer-events: none;
}
.frame_square_scroller_inner a  {
	pointer-events: auto;
}
.frame_square_scroller_inner a img {
	pointer-events: auto;
	transition:0.3s;
}
.frame_square_scroller_inner a img:hover {
	opacity: 0.8;
}

/* ------------------------------ */
/* コントローラー (アクティブ時に出現) */
.frame_square_controller_frame {
	display:none;
	border:1px solid #cccccc;
	border-radius: 5px;
	background-color:rgba(0,0,0,0.1);
	-webkit-tap-highlight-color:rgba(0,0,0,0); /* スマホハイライトカラー */
	position:fixed;
	right:70px;
	bottom:20px;
	height:100px;
	width:100px;
	margin-left:auto;
	margin-right:auto;
	cursor:pointer;
	-webkit-user-select: none; /* Chrome or Safari */
	-webkit-touch-callout: none; /* Android and iOS*/
	-moz-user-select: none; /* FireFox */
	-ms-user-select: none; /* IE */
	-o-user-select: none; /* Opera */
	user-select: none;
	z-index:2;
}

/* スマホ */
@media only screen and (max-width:599px) {
	.frame_square_controller_frame {
		height:70px;
		width:80px;
		bottom:15px;
		right: 80px;
	}
}

/* 針 */
.frame_square_scroller_needle {
	position:absolute;
	width: 25px;
	height: 25px;
	border-radius: 50px;
	background-image: -webkit-radial-gradient(#dddddd,#333333);
	background-image: radial-gradient(#dddddd,#333333);
	-webkit-transform:translate(-50%,-50%); /* Safari用 */
	transform:translate(-50%,-50%);
	z-index:1;
	-webkit-tap-highlight-color:rgba(0,0,0,0); /* スマホハイライトカラー */
}

/* ------------------------------ */
/* コントローラー内のメモリ (縦) */
.frame_square_controller_scale {
	border:1px solid #cccccc;
	border-radius: 50px;
	background-color:rgba(0,0,0,0.1);
	-webkit-tap-highlight-color:rgba(0,0,0,0); /* スマホハイライトカラー */
	position:absolute;
	width:10px;
	height:100%;
	margin-left: 50%;
	-webkit-transform:translateX(-50%); /* Safari用 */
	transform:translateX(-50%);
}