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

/* メインヘッダー画像 */
.header_image_box {
	height:600px;
	position:relative;
	overflow: hidden;
}
.header_image_box_inner {
	background-image:url('/image/gallery_header_image_01.jpg');
	background-size:cover;
	background-position:center;
	height:600px;
	transform:scale(1.1);
	-webkit-transform: scale(1.1);
	opacity:0;
}

/* ヘッダー画像内テキスト枠 */
.header_box_title {
	text-align:center;
	position:absolute;
	top:30%;
	left:10%;
	font-weight: bold;
	color:#ffffff;
	transition:0.5s;
	min-width:300px;
}

/* タブレット */
@media only screen and (max-width:767px) {
	.header_image_box {
		height:400px;
	}
	.header_box_title {
		left:50%;
		-webkit-transform:translateX(-50%); /* Safari用 */
		transform:translateX(-50%);
	}
}

/*------------------------------*/
/* メインサムネイル枠 */
.image_frame {
	max-height:250px;
	overflow:hidden;
}

/*------------------------------*/
/* ページャー用ボタン */
.pager_button_off {
	font-size:12px;
	min-width: 40px;
	padding: 5px 10px;
	text-align: center;
	margin: 2px;
	text-decoration: none;
	border-radius: 3px;
	background-color: #ffffff;
	border:1px solid #cccccc;
	color:#cccccc;
	transition:0.3s;
	line-height:50px;
}

.pager_button_on {
	font-size:12px;
	min-width: 40px;
	padding: 5px 10px;
	text-align: center;
	margin: 2px;
	text-decoration: none;
	border-radius: 3px;
	background-color: #008cd6;
	border:1px solid #cccccc;
	color: #ffffff;
	line-height:50px;
}

.pager_button_off:hover {
	border:1px solid #cccccc;
	background-color: #008cd6;
	color: #ffffff;
}

/* -------------------------------------------------- */
/* 画像表示枠 */
.image_box {
	height:200px;
	background-position:center center;
	background-repeat:no-repeat;
	background-color:#000000;
	transition:0.5s;
	background-size:100%;
}

.image_box_main_image {
	width:100%;
	height:auto;
	height:initial;
}

/* ポップアップ要素 */
.image_box_in_panel {
	width:100%;
	-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;
}

/* ポップアップ要素を包む枠 */
.image_box_in_panel_wrapper {
	background-color:#000000;
	position:absolute;
	max-width:1000px;
	border:2px solid #333333;
	margin:0xp auto;
	box-shadow: 5px 5px 5px rgba(0,0,0,0.4);
	z-index:-1;
	margin-bottom:150px;
	overflow:hidden;
	width:100%;

	/* 透過処理 (IE対策済み) */
	filter:alpha(opacity=0);
	-ms-filter:alpha(opacity=0);
	-moz-opacity:0;
	-khtml-opacity:0;
	opacity:0;
	zoom:1;
}

/* ポップアップ内サムネイル */
.image_box_thumbnail {
	height:50px;
	width:100%;
	background-size:cover;
	background-position:center center;
	transition:0.5s;
}
.image_box_thumbnail:hover {
	opacity:0.9;
	filter:alpha(opacity=90);
	-ms-filter:"alpha(opacity=90)";
}

/* ポップアップ内メイン画像 */
.image_box_main {
	width:100%;
	position:relative;
	overflow:hidden;
}

/* -------------------------------------------------- */
/* 非表示要素 */
.position_right_top {
	position:absolute;
	top:0px;
	right:0px;
	padding:10px;
}
.position_right_bottom {
	position:absolute;
	bottom:0px;
	right:0px;
}

.no_icon {
	text-align:center;
	cursor:pointer;
	background-color:#ffffff;
	border-radius:30px;
	padding:5px 10px;
	font-size:20px;
	font-weight:bold;
	-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;
	transition:0.3s;
}
.no_icon:hover {
	background-color:#000000;
	color:#ffffff;
}

/* -------------------------------------------------- */
/* 閉じるボタン */
.close_icon {
	text-align:center;
	cursor:pointer;
	background-color:#ffffff;
	font-size:20px;
	padding:5px 10px;
	font-weight:bold;
}
.close_icon:hover {
	background-color:#cccccc;
}