@charset "utf-8";

html,body{
	min-height: 100%;
}
html{
	background: #fff;
}
body{
	background: #000;
	
	opacity: 0;

	-webkit-transition-property: -webkit-filter;
	-webkit-transition-duration: 1s;
	-webkit-transition-timing-finction: linear;

	-moz-transition-property: -moz-filter;
	-moz-transition-duration: 1s;
	-moz-transition-timing-finction: linear;

	-o-transition-property: -o-filter;
	-o-transition-duration: 1s;
	-o-transition-timing-finction: linear;
/*
	transtiion-property: filter;
	transition-duration: 1s;
	transition-timing-finction: linear;
	-webkit-filter:brightness(1000%);
	-moz-filter:brightness(1000%);
	-o-filter:brightness(1000%);
	filter:brightness(1000%);
	*/
}

body.flg{
	/*
	-webkit-filter:brightness(100%);
	-moz-filter:brightness(100%);
	-o-filter:brightness(100%);
	filter:brightness(100%);
	*/
}

#wrapper{
	width: 972px;
	margin: 0 auto;
}
#logo{
	padding: 25px 0 11px 0;
}

#header{
	padding: 25px 0 5px 0;
}

#gallerylogo{
float: left;
}

#cuplogo{
float: right;
}


#gallery{
	width: 976px;
	font-size: 0;
}
#gallery > div{
	display: inline-block;
}
#gallery .photo{
	position: relative;
	display: inline-block;
	margin: 0 4px 4px 0;
	opacity: 0;
}
#gallery .photo a.disable{
	cursor: default;
}
#gallery .photo_none{
	position: relative;
	display: inline-block;
	margin: 0 4px 4px 0;
}
#gallery .photo_none a.disable{
	cursor: default;
}
#gallery .img{
	position: relative;
	display: inline-block;
	margin: 0 4px 4px 0;
}

/********************/
#gallery .photo img{
	-webkit-transition-property: -webkit-transform;
	-webkit-transition-duration: 1s;
	-webkit-transition-timing-finction: linear;

	-moz-transition-property: -moz-transform;
	-moz-transition-duration: 1s;
	-moz-transition-timing-finction: linear;

	-o-transition-property: -o-transform;
	-o-transition-duration: 1s;
	-o-transition-timing-finction: linear;

	transtiion-property: transform;
	transition-duration: 1s;
	transition-timing-finction: linear;
}

.translate_reset{
	-webkit-transform: translate(0,0) !important;
	-moz-transform: translate(0,0) !important;
	-o-transform: translate(0,0) !important;
	transform: translate(0,0) !important;
}

.w976{
	width: 976px;
  position: relative;
}
.w732{
	width: 732px;
  position: relative;
}
.w488{
	width: 488px;
  position: relative;
}
.w244{
	width: 244px;
  position: relative;
}
.absolute{
  position: absolute!important;
}
.position_bottom{
  bottom: 0;
}
.position_bottom_150{
  bottom: 150px;
}
.position_left{
  left: 0;
}
.position_right{
  right: 0;
}
.position_top{
  top: 0;
}
.position_top_150{
  top: 150px;
}

.adj_upr {
	position: relative;
	top: -150px;
}

.adj_upr_ex {
	position: relative;
	top: -300px;
}

.adj_dwn {
	position: relative;
	bottom: -150px;
}

.adj_rgt {
	position: relative;
	left: 244px;
}

.adj_mgn {
	margin-top: -150px;
}

#footer{
	width: 972px;
	margin: 0 auto;
	position: relative;
	margin-top: 30px;
	margin-bottom: 30px;
}

#footer .copy{
	margin-top: 7px;
	font-size: 12px;
	line-height: 12px;
	color: #fff;
}

#footer p a img {
	height: 31px;
	margin-right: 16px;
}


#gallery .ttl_tado_sai{
	margin:60px auto 15px;
}
#hole .w976 .photo {
    margin: 0 auto;
    padding: 7px 0 21px 0;
}
#hole .designsai {
    margin: 0 auto;
    padding: 0px 0 14px 0;
}

/* ====================================================
    写真集レイアウトパターン別背景画像 4パターンできるまで
    下記にパターンごとで追加
==================================================== */
/* 2014年、2017年のパターン mark01～mark11 */
.mark01 {
  background: url(../img/mark01.jpg) left top no-repeat;
}

.mark03 {
  background: url(../img/mark03.jpg) left bottom no-repeat;
}

.mark04 {
  background: url(../img/mark04.jpg) left bottom no-repeat;
}

.mark06 {
  background: url(../img/mark06.jpg) 488px 150px no-repeat;
}

.mark07 {
  background: url(../img/mark07.jpg) left top no-repeat;
}

.mark08 {
  background: url(../img/mark08.jpg) 244px 150px no-repeat;
}

.mark09 {
  background: url(../img/mark09.jpg) right bottom no-repeat;
}

.mark10 {
  background: url(../img/mark10.jpg) 0 0 no-repeat;
}

.mark11 {
  background: url(../img/mark11.jpg) 0 0 no-repeat;
}




