@charset "utf-8";

/**
* 共通CSS
*
* @author  早稲田システム開発株式会社（開発部：中野）
* @since   2012.11.1
*
*/

/* ※ピクトビューアーについては、来館者端末（タッチパネル対応）.touch-pnl もこのファイルに記述する */
/* ※画像めくりボタンに関する指定は css/button/btn_common.css に*/


/* ■■■■■■■■ 基本設定 ■■■■■■■■ */

* {
	margin:0px;
	padding:0px;
}

html {
	overflow-y:hidden;
	overflow-x:hidden;
	/*overflow-x:auto;
}

body {
	font-size:84%;
	/*font-family: verdana, arial, helvetica, "ヒラギノ角ゴ Pro W3","MS ゴシック","ＭＳ Ｐゴシック", Osaka , sans-serif;*/
	font-family: "MS ゴシック","ＭＳ Ｐゴシック", Osaka , sans-serif;
	font-style:normal;
	color:#333333;
	background-color:#fff;
	text-align:center;
	padding:0px;
}

/* 画像 */
img {
	border: none;
}

/* ボタン */
button {
	cursor:pointer;
}
button:hover {
	text-decoration:none; color:#ff6600;
}
button:active {
	color:#ff6600;
	position:relative;
	top:1px;
	left:1px;
}
button[disabled]:hover {
	color:#aca899;
	cursor:default;
}
button[disabled]:active {
	position:relative;
	top:0px;
	left:0px;
}


/* リードオンリー */
input[readonly],
textarea[readonly] {
	ime-mode : disabled;
	background-color:#dddddd;
}


/* ■■■■■■■■ イメージビューア ■■■■■■■■ */

/* ラッパー */
div#wrapperAll {
	width:auto;
	margin:0px auto;
	text-align:center;
}

#panelUpper {
	padding:0px 10px;
	text-align:right;
	/*background:url(../img/bg_conpane.png) repeat-x;*/
	background-image: linear-gradient(180deg, rgba(240, 240, 240, 1.0), rgba(201, 201, 201, 1.0));
}

/*背景色選択ボタン*/
dl#navBgColor {
	height:21px;
	padding-top:8px;
	float:left;
}
dl#navBgColor dt {
	padding-top:3px;
	display:inline;
	font-size:77%;
	letter-spacing:0px;
}
dl#navBgColor dd {
	display:inline;
	font-size:1px;
}
dl#navBgColor dd button {
	width:15px;
	height:15px;
	border:1px solid #666;
}
dl#navBgColor dd button:focus {
	outline:none;
	border:1px solid #f60;
}

.touch-pnl #panelUpper {
	height: 46px;
}
.touch-pnl dl#navBgColor {
	height: auto;
}
.touch-pnl dl#navBgColor dt {
	font-size:16px;
	margin-left: 10px;
	margin-right: 8px;
}
.touch-pnl dl#navBgColor dd button {
	margin-right: 7px;
}
.touch-pnl dl#navBgColor dd button {
	width:30px;
	height:30px;
}

/*閉じるボタン*/
p#btnClose {
	/*float:right;*/
	position:absolute;
	top:4px;
	right:10px;
}
p#btnClose a {
	display: inline-block;
	color:#555;
	font-size:92%;
	line-height: 1.0rem;
	letter-spacing:1px;
	text-decoration:none;
}
p#btnClose a:hover {
	opacity: 0.7;
}

p#btnClose a::before {
	content: "×";
	font-size: 20px;
	position: relative;
	top: 3px;
	line-height: 1.0rem;
}
.touch-pnl p#btnClose {
	top:10px;
	right:25px;
}
.touch-pnl p#btnClose a {
	font-size:20px;
	letter-spacing: 0px;
}
.touch-pnl p#btnClose a::before {
	font-size: 35px;
	top: 4px;
	left:1px;
}

#block_view {
	padding:20px 0px;
	overflow:hidden;
}

#pict_base {
	position:relative;
	overflow:hidden;
}

#pict_base img {
	position:absolute;
	top:0;
	left:0;
}

#pict_base img#cdot_vert {
	width:1px;
	display:none;
}
#pict_base img#cdot_horz {
	height:1px;
	display:none;
}

#panelLower {
	width: 100%;
	height:37px;
	padding-right:5px;
	text-align:left;
	position:absolute;
	bottom:0px;
	border-top:1px solid #ddd;
	background-image: linear-gradient(180deg, rgba(240, 240, 240, 0.8), rgba(201, 201, 201,  0.8));
	box-sizing: border-box;
	overflow: hidden;
}
#panelLower ul {
	float:left;
}
#panelLower ul li {
	float:left;
	display:block;
}

#panelLower button {
	width:50px;
	height: 40px;
	padding-bottom: 4px;
	border:1px solid #999;
	border-top-color:#eee;	
	border-left-color:#eee;
	background:transparent;
	box-sizing: border-box;
}
#panelLower button svg {
	fill: #666;
}

.touch-pnl #panelLower {
	/*height:50px;*/
	height:55px;
}
.touch-pnl #panelLower button {
	width: 60px;
	height:55px;
	padding-bottom: 0px;
}

/* スライダー */
#zoomSlidar {
	margin-top:2px;
	padding-left:2px;
	height:26px;
	float:left;
	position:relative;
	line-height:26px;
}
#zoomSlidar div {
	 height:26px;
	 padding-top:12px;
	 float:left;
	 line-height:26px;	 
}
.touch-pnl #zoomSlidar div {
	 padding-top:16px;
}
#zoomSlidar div img {
	 width:6px;
	 float:left;
	 display:block;
}
#zoomSlidar #slider_bar {
	width:130px;
	float:left;
	background:url(../img/ib_pict_slider_c.png) repeat-x; 
}
#slider_btn {
	 width:19px;
	 height:26px;
	 display:block;
	 position:absolute;
	 left:0px;
	 top:5px;
	 cursor:pointer;
}
#btnZoomOut button {
	width:40px;
	text-align:right;
	padding-right:5px;
	border:none;
}
#btnZoomIn button {
	width:40px;
	text-align:left;
	padding-left:6px;
	border-left:none;
}
/*#panelLower #changePos {
	height:26px;
}*/

.touch-pnl #slider_btn {
	 width:35px;
	 height:40px;	 
	 top:3px;
}
.touch-pnl #changeSize  button {
	width:50px;
	/*height: 50px;*/
}
.touch-pnl #changeSize  button svg {
	width: 36px;
	height: 36px;
}


/* サイズ、座標表示 */
#pict_size {
	/*width:200px;*/
	/*width:221px;*/
	width:auto;
	margin-top:10px;
	float:right;
	white-space: nowrap;
	text-align:right;
	overflow:hidden;
}
span.colon {
	margin: 0 -1px;
}
.touch-pnl #pict_size {
	margin-top:20px;
}

/* ライセンス、クレジット */
div#pictInfor {
	padding:10px 10px 0;
	display:none;
}
div#pictInfor a {
	color:#333;
	text-decoration:none;
}

p#pictLicense,
p#pictCredit {
	margin:10px 0 5px;
	font-size:90%;
	font-weight:normal;	
	line-height:1.1em;
}
#pictLicense p,
p#pictCredit {
	margin-top:5px;
	text-align:left;
}

p.creativecommons span.icon img {
	width:15px;
	height:15px;
	margin-left:1px;
	vertical-align:middle;
}

p.creativecommons span.text {
	margin-left:5px;
	vertical-align:middle;
}

.no-speak {
	speak:none;
}



/* ---------------------------------------------------------------------
*    フロート解除
* ------------------------------------------------------------------- */
#panelUpper:after,
#panelLower:after,
#panelLower ul:after {
    content: ".";
    display: block;
    height: 0px;
    clear: both;
    visibility: hidden;
}
#panelUpper,
#panelLower,
#panelLower ul {
	zoom: 1;
}

#pict_load_error {
	padding:20px;
	display:none;
}

#msgError {
	padding:20px;
}