@charset "utf-8";

/* ---------------------------------------------------------
 　■ 共通 class
--------------------------------------------------------- */
/* === フォントサイズクラス === */
/* …………………………………………………………………………………………………
　面倒でもフォントサイズの入れ子はしないで、各ブロックごとに指定する！
　HTML側にclass指定したほうがわかり易くてｲｲけど、
　thとtdで違うフォントサイズを指定したい場合なんかは、CSSに
　th{font-size: 108%;} td{font-size: 77%;}とか書いたほうがHTMLがキレイかも
………………………………………………………………………………………………… */
.txt10{ font-size: 77%; }    /* 10px */
.txt11{ font-size: 85%; }    /* 11px */
.txt12{ font-size: 93%; }    /* 12px */
.txt13{ font-size: 100%; }   /* 13px */
.txt14{ font-size: 108%; }   /* 14px */
.txt15{ font-size: 116%; }   /* 15px */
.txt16{ font-size: 123.1%; } /* 16px */
.txt17{ font-size: 131%; }   /* 17px */
.txt18{ font-size: 138.5%; } /* 18px */
.txt19{ font-size: 146.5%; } /* 19px */
.txt20{ font-size: 153.9%; } /* 20px */
.txt21{ font-size: 161.6%; } /* 21px */
.txt22{ font-size: 167%; }   /* 22px */
.txt23{ font-size: 174%; }   /* 23px */
.txt24{ font-size: 182%; }   /* 24px */
.txt25{ font-size: 189%; }   /* 25px */
.txt26{ font-size: 197%; }   /* 26px */

/* === clearfix === */
.clearfix{
	overflow: hidden; zoom: 1;
}
hr{
	clear: both;
	visibility: hidden;
}

/* === 画像とかの左右float調整 === */
.floR {
	float: right;
}
.floL {
	float: left;
}
/* === 中央置きボタン類 === */
.txtC,
.btnC {
	text-align: center;
}
.txtR,
.btnR{
	text-align: right;
}
.txtL,
.btnL{
	text-align: left;
}
/* === テーマフォントカラー === */
.colR{
	color: #FF9103;
}
.colG{
	color: #5CB427;
}
/* === こめ印（※）の字下げ === */
.kome{
	padding-left: 1em;
	text-indent: -1em;
	display: block;
}
/* 
※あああああああああああ
　あああああああああああ
↑こんなカンジで2行目が１文字分空きます
 */

/* === Jquery === */
img.rollover{ /* 画像が_onに切り替わります */ }
img.hover{ /* 画像が半透明になります */ }
.dispBox{ /* 高さを一番高い高さ揃えます */ }


/* === ページ送りとか、中央寄せリスト === */
ul.CenterList{
	margin: 0 0 10px;
	padding: 10px 10px 5px;
	text-align: center;
	background: #FFFFFF;
}
ul.CenterList li {
	display: inline;
	margin: 0 2px;
	padding: 0;
}
ul.CenterList li span,
ul.CenterList li a {
	display: inline-block;
	margin-bottom: 5px;
	padding: 1px 8px;
	border: 1px solid #FF00FF;
	text-decoration: none;
	vertical-align: middle;
}
ul.CenterList li a:hover {
	background: #FFECFF;
	border-color: #FF0000;
}

/* === よく使いそうなCSS3 === */
/* 角丸 */
.borderR {
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}
/* ボックスに影 */
.shadowBox{
	-webkit-box-shadow: 1px 1px 3px #999;
	-moz-box-shadow: 1px 1px 3px #999;
	box-shadow: 1px 1px 3px #999;
}
/* テキストに影 */
.shadowTxt{
	text-shadow: 1px 1px 0px #999;
}



/* ---------------------------------------------------------
 　■ JQuery関連CSS
--------------------------------------------------------- */
/* ---------------------------------------------------------
 　■ 共通 カルーセルBox（横スライド）
--------------------------------------------------------- */
#carouselBox {
	margin: 0 auto 10px;
	position: relative;
	width: 930px;
}
#carouselBox ul {
	padding: 0;
	list-style: none;
	overflow: hidden;
	zoom: 1;
	height: 111px;
}
#carouselBox li {
	float: left;
	margin: 3px;
}
#carouselBox li div{
	color: #999;
	text-align: center;
	padding: 3px 6px;
	display: block;
	border: 1px solid #D0D0D0;
	-webkit-box-shadow: 1px 1px 3px #ccc;
	-moz-box-shadow: 1px 1px 3px #ccc;
	-o-box-shadow: 1px 1px 3px #ccc;
	box-shadow: 1px 1px 3px #ccc;
}

.ie6 #carouselBox li div,
.ie7 #carouselBox li div,
.ie8 #carouselBox li div{
	border-bottom: none;
	margin: 0 0 5px;
}
.ie6 #carouselBox li ,
.ie7 #carouselBox li ,
.ie8 #carouselBox li {
	border-right: 1px solid #E9E9E6;
	background: url(../img/btm_shadow.png) 0 bottom repeat-x;
}

#carouselBox .prev {
	position: absolute;
	left: -15px;
	top: 30px;
}
#carouselBox .next {
	position: absolute;
	right: -15px;
	top: 30px;
}

/* ---------------------------------------------------------
 　■ 共通 タイル状写真一覧
--------------------------------------------------------- */
#photoBox{
	padding: 0 0 0 5px;
}
#photoBox dl{
	float: left;
	width: 232px;
	margin: 0 4px 5px 0;
	border: solid 1px #CCCCCC;
	background: #FFFFFF;
	-webkit-box-shadow: 1px 1px 3px #CCCCCC;
	-moz-box-shadow: 1px 1px 3px #CCCCCC;
	box-shadow: 1px 1px 3px #CCCCCC;
}
#photoBox dt{
	padding: 5px 0;
	position: relative;
	/* background: #FFFFFF url(../img/photoArea_bg.gif) 0 0 no-repeat; */
}
#photoBox dt .ico{
	position: absolute;
	right: 0px;
	top: 0px;
}
#photoBox dd{
	/* background: #FFFFFF url(../img/photoArea_bg_txt.gif) 0 bottom no-repeat; */
	padding: 0 10px 10px;
	text-align: left;
}
#photoBox dd span{
	display: block;
}
#photoBox dd span.ttl{
	font-weight: bolder;
}
#photoBox .btn{
	clear: both;
	padding: 15px 0 0;
}
/*
 * jQuery Nivo Slider v2.7.1
 * http://nivo.dev7studios.com
 *
 * Copyright 2011, Gilbert Pellegrom
 * Free to use and abuse under the MIT license.
 * http://www.opensource.org/licenses/mit-license.php
 * 
 * March 2010
 */
 
 
/* The Nivo Slider styles */
.nivoSlider {
	position:relative;
}
.nivoSlider img {
	position:absolute;
	top:0;
	left:0;
}
/* If an image is wrapped in a link */
.nivoSlider a.nivo-imageLink {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	border:0;
	padding:0;
	margin:0;
	z-index:6;
	display:none;
}
/* The slices and boxes in the Slider */
.nivo-slice {
	display:block;
	position:absolute;
	z-index:5;
	height:100%;
}
.nivo-box {
	display:block;
	position:absolute;
	z-index:5;
}
/* Caption styles */
.nivo-caption {
	position:absolute;
	left:0;
	bottom:0;
	background:#000;
	color:#fff;
	opacity:0.8; /* Overridden by captionOpacity setting */
	width:100%;
	z-index:8;
}
.nivo-caption p {
	padding:5px;
	margin:0;
}
.nivo-caption a {
	display:inline !important;
}
.nivo-html-caption {
    display:none;
}
/* Direction nav styles (e.g. Next & Prev) */
.nivo-directionNav a {
	position:absolute;
	top:45%;
	z-index:9;
	cursor:pointer;
}
.nivo-prevNav {
	left:0;
}
.nivo-nextNav {
	right:0;
}
/* Control nav styles (e.g. 1,2,3...) */
.nivo-controlNav a {
	position:relative;
	z-index:9;
	cursor:pointer;
}
.nivo-controlNav a.active {
	font-weight:bold;
}
/* --- さらに追記 --- */
.nivo-controlNav{
	background-color: #ffffff;
	text-align: right;
	position: absolute;
	left: 0;
	top: 403px;
	width: 900px;
	height: 20px;
	display: block;
}
.nivo-controlNav a.nivo-control img{
	position: static;
	float: right;
	visibility: visible !important;
}

/**
 * jQuery lightBox plugin
 * This jQuery plugin was inspired and based on Lightbox 2 by Lokesh Dhakar (http://www.huddletogether.com/projects/lightbox2/)
 * and adapted to me for use like a plugin from jQuery.
 * @name jquery-lightbox-0.5.css
 * @author Leandro Vieira Pinho - http://leandrovieira.com
 * @version 0.5
 * @date April 11, 2008
 * @category jQuery plugin
 * @copyright (c) 2008 Leandro Vieira Pinho (leandrovieira.com)
 * @license CC Attribution-No Derivative Works 2.5 Brazil - http://creativecommons.org/licenses/by-nd/2.5/br/deed.en_US
 * @example Visit http://leandrovieira.com/projects/jquery/lightbox/ for more informations about this jQuery plugin
 */
#jquery-overlay {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
}
#jquery-lightbox {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
}
#jquery-lightbox a img { border: none; }
#lightbox-container-image-box {
	position: relative;
	background-color: #fff;
	width: 250px;
	height: 250px;
	margin: 0 auto;
}
#lightbox-container-image { padding: 10px; }
#lightbox-loading {
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
}
#lightbox-nav {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
}
#lightbox-container-image-box > #lightbox-nav { left: 0; }
#lightbox-nav a { outline: none;}
#lightbox-nav-btnPrev, #lightbox-nav-btnNext {
	width: 49%;
	height: 100%;
	zoom: 1;
	display: block;
}
#lightbox-nav-btnPrev { 
	left: 0; 
	float: left;
}
#lightbox-nav-btnNext { 
	right: 0; 
	float: right;
}
#lightbox-container-image-data-box {
	font: 10px Verdana, Helvetica, sans-serif;
	background-color: #fff;
	margin: 0 auto;
	line-height: 1.4em;
	overflow: auto;
	width: 100%;
	padding: 0 10px 0;
}
#lightbox-container-image-data {
	padding: 0 10px; 
	color: #666; 
}
#lightbox-container-image-data #lightbox-image-details { 
	width: 70%; 
	float: left; 
	text-align: left; 
}	
#lightbox-image-details-caption { font-weight: bold; }
#lightbox-image-details-currentNumber {
	display: block; 
	clear: left; 
	padding-bottom: 1.0em;	
}			
#lightbox-secNav-btnClose {
	width: 66px; 
	float: right;
	padding-bottom: 0.7em;	
}