@charset "utf-8";
/*============================================
段組レイアウト画面　サイドメニュー（左カラム）	Index.php
============================================*/

#sidemenu {
	float: left;
	height: auto;
	width: 300px;
	margin: 15px;
	padding: 5px 15px 15px 15px;
	text-align: left;
	border-style: dotted;
	border-color: #6CC;
	background: #FFFFD6;
}

/* スマホ用、画面幅780pxまで */
@media screen and (max-width:780px) {
#sidemenu {
	float: none;
	width: 85%;
}
}
/*============================================
段組レイアウト画面　メイン画面（右カラム）	Index.php
============================================*/

#mainmenu {
	float: left;
	height: auto;
	width: 600px;
	padding: 15px;
}

/* スマホ用、画面幅780pxまで */
@media screen and (max-width:780px) {
#mainmenu {
	float: none;
	width: 90%;
}
}
/*============================================
段組レイアウト画面　サイドメニュー（左カラム）	Members.php
============================================*/

#sidemenu2 {
	float: left;
	height: auto;
	width: 200px;
	margin: 15px;
	padding: 5px 15px 15px 15px;
	border-style: dotted;
	border-color: #6CC;
	background: #FFFFD6;
}

/* スマホ用、画面幅780pxまで */
@media screen and (max-width:780px) {
#sidemenu2 {
	float: none;
	width: 85%;
}
}
#sidemenu2 ul {
	margin: 0px 0px 0px 20px;
}
/*============================================
段組レイアウト画面　メイン画面（右カラム）	Members.php
============================================*/

#mainmenu2 {
	float: left;
	height: auto;
	width: 700px;
	padding: 15px;
}

/* スマホ用、画面幅780pxまで */
@media screen and (max-width:780px) {
#mainmenu2 {
	float: none;
	width: 90%;
}
}
/*============================================
メイン画面ロゴ表示部				index.php
============================================*/

#logo {
	display: inline-block;
	height: auto;
	width: auto;
}

/* スマホ用、画面幅780pxまで */
@media screen and (max-width:780px) {
#logo {
	display: none;
}
}

/*============================================
サイドページテーブル					
============================================*/

table.tbl_side {
	width: 300px;
	border-collapse: collapse;
}

/* スマホ用、画面幅780pxまで */
@media screen and (max-width:780px) {
table.tbl_side {
	width:100%;				
}
}

/* 新着情報 index.php */
table.tbl_side td.info {
	padding: 5px;
	height: 7px;
	text-align: left;
	vertical-align: top;
	border-bottom: dotted #666666 1px;
}

/* スマホ用、画面幅780pxまで */
@media screen and (max-width:780px) {
table.tbl_side td.info {
	border-bottom:dotted #666666 2px;		
}
}

/* 絞り込みメニュー Members.php */
table.tbl_side td.memb {
	padding: 5px;
	height: 7px;
	text-align: left;
	vertical-align: top;
}
/* インデックスボタン用カラム Announce.php */
table.tbl_ind {
	width: 200px;
	color: #000000;
	border-collapse: collapse;
}
table.tbl_ind td {
	height: auto;
	width: 50px;
	text-align: left;
	color: #000000;
}
/*============================================
メインページテーブル					
============================================*/

table.tbl_main {
	width: 600px;
	border-collapse: collapse;
}
/*============================================
オーバーレイ表示枠			index.php
============================================*/

.itemBox {
	display: inline-block;
	position: relative;
}
.itemBoxImg {
	display: inline-block;
	max-width: 150px;
	max-height: 75px;
}
.itemBoxOverlay {
	background: url(image/overlay.png) repeat 0 0;
	position: absolute;
	top: 0;
	left: 0;
	width: 110px;
	height: 62px;
	padding: 13px 10px 0px 30px;
	-webkit-transition: opacity .3s linear;
	-moz-transition: opacity .3s linear;
	-o-transition: opacity .3s linear;
	transition: opacity .3s linear;
	opacity: 0;
	filter: alpha(opacity=0);
}
.itemBoxOverlay:hover {
	opacity: 1;
	filter: alpha(opacity=100);
}
.itemBoxImg_Full {
	display: inline-block;
	max-width:  450px;
	max-height: 225px;
}
.itemBoxOverlay_FUll {
	background: url(image/overlay_Full.png) repeat 0 0;
	position: absolute;
	top: 0;
	left: 0;
	width: 330px;
	height: 186px;
	padding: 13px 10px 0px 30px;
	-webkit-transition: opacity .3s linear;
	-moz-transition: opacity .3s linear;
	-o-transition: opacity .3s linear;
	transition: opacity .3s linear;
	opacity: 0;
	filter: alpha(opacity=0);
}
.itemBoxOverlay_FUll:hover {
	opacity: 1;
	filter: alpha(opacity=100);
}
#mainmenu p {
	font-size: small;
	text-align: center;
}
