
.lgbox{
  width: 100%;
  height: 100%;
  min-height:100%;
  padding: 0px;
  margin: 0 auto;
  text-align: center;
}

.bgbox{
  height: 100%;
  min-height:100%;
  width: 60%;
  padding: 55px 0 0 0;
  margin: 0 auto;
  display:table;
}

.bgbox2{
  height: 100%;
  min-height:100%;
  width: 60%;
  padding: 20px 0 0 0;
  margin: 0 auto;
  display:table;
}

.bgbox3{
  height: 100%;
  min-height:100%;
  width: 60%;
  padding: 2px 0 0 0;
  margin: 0 auto;
  display:table;
}

.idx{
  width: 40%;
  min-width: 360px;
  margin:0 auto;
  margin-top:40px;
  padding: 40px 5%;
  box-shadow:0px 0px 8px 0px #333333 ;
  text-align: center;
  line-height:1.5em;
}
.idx p{
  margin-bottom:12px;
}


.idxbt{
  background: #444444;
  width: 200px;
  height:70px;
  line-height: 70px;
  border-radius: 15px;
  color:#FFFFFF;
  box-shadow:0px 1px 6px #AAAAAA;
  transition: all .3s;
  margin-top: 20px;
}
.idxbt:hover{
  background: #666666;
  transition: all .3s;
}


.mdbox{
}

.mdbox2{
  background: #FFFFFF;
  padding: 20px 0px 0px 0px;
  height: 100%;
  width: 75%;
  min-height:100%;
  box-shadow:3px 0px 7px #777777;
  position: relative;
  z-index: 2;
  display:table-cell;
}
.mdbox3{
  padding: 0px;
  display:table-cell;
}

/* アバウト */

.mdbox4{
  padding: 20px;
}

/* トップ */

.topbox{
  width: 100%;
  max-width: 1500px;
  position: relative;
  text-align: left;
}

.topbox2{
  top: 0;
  left: 0;
  width: 100%;
  min-width: 600px;
  position: absolute;
  overflow: hidden;

}
	.zina{
	  z-index:0;
	}
	.zinb{
	  z-index:4;
	}
	.zinc{
	  z-index:7;
	}



.toptxt{
  position: absolute;
  width: 95%;
  height:70px;
  z-index:2;
  top:10%;
  right:0;
  background: #FFFFFF;
  opacity:0.7;
  text-align: left;
  padding-left: 5%;
  padding-top: 20px;
  color: #000000;
  border-top:solid #000000 5px;
  border-bottom:solid #000000 5px;
  display:none ;
}



.topbox3{
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 200px;
  display: none;
}

.topbox4{
  width: 100%;
  height: 60px;
  border-bottom: solid #000000 2px; 
  line-height: 80px;
  text-align: left;
}
.topbox5{
  width: 100%;
  height: 140px;
}
	.topbox5 li{
 	 float: left;
 	 padding:30px;
	  list-style: none;
	}

/* プロダクト */


.mdbox5{
  margin: 0px 0px 50px 0px;
  height:60px;
  width: 100%;
  text-align: center;
  line-height: 60px;
}

.mdbox5b{
  height:100%;
  width: 50%;
  float:left;
  background: #FFFFFF;
}
.mdbox5c{
  height:100%;
  width: 50%;
  float:right;
  color: #000000;
  background: #DDDDDD;
  box-shadow:5px -5px 5px 0px #AAAAAA inset;
  transition: all .3s;
}
.mdbox5c:hover{
  box-shadow:5px -90px 5px 0px #555555 inset;
  color: #FFFFFF;
  transition: all .5s;
}


.mdbox5d{
  height:100%;
  width: 50%;
  float:left;
  color: #000000;
  background: #DDDDDD;
  box-shadow:-5px -5px 5px 0px #AAAAAA inset;
  transition: all .3s;
}
.mdbox5e{
  height:100%;
  width: 50%;
  float:right;
  background: #FFFFFF;
}
.mdbox5d:hover{
  box-shadow:-5px -90px 5px 0px #555555 inset;
  color: #FFFFFF;
  transition: all .5s;
}


.mdbox8{
  padding: 0px;
  width: 100%;
}


.mdbox8 ul {
  position: relative;
  left: 0%;
}

.mdbox8 li{
  psition:relative;
  width: 50%;
  float:left;
  margin-bottom: 80px;
  list-style: none;
}

.mdbox9{
  width: 80%;
  margin:0 auto;
  overflow:hidden;
  box-shadow:1px 1px 8px 0px #333333 ;
  border-radius: 15px;
  position:relative;
  z-index:1;
}


.prdim{
  width: 100%;
  margin:0;
  padding:0;
  position:relative;
}


.prdim2{
  width: 100%;
  padding-top:6;
  padding-left:10;
  padding-bottom:10;
  text-align: left;
  position:absolute;
  bottom:0px;
  background:	rgba(255,255,255,0.9);
  box-shadow:0px 0px 8px 0px #333333 ;
  color: #000000;
  text-shadow: 0px 0px 3px #FFFFFF; 
}


.scim{
  transition: all .5s;
}

.scim:hover {
    transition: all .5s;
    transform: scale(1.1);
}




/* 作品解説 */


.pdbox{
  margin: 35px 0px 30px 0px;
  text-align:left;
  padding:0px;
  height:600px;
  position:relative;
}


.pdtp{
  width: 100%;
  height:30px;
  border-bottom: solid #888888 3px;
  margin-bottom: 20px;
  padding-bottom: 5px;
  margin-top: 10px;
}

.pdlf{
  width: 25%;
  height:100%;
  float:left;
  position:absolute;
  left:660px;
}

.lfsm{
  padding-bottom: 20px;
}

.pdbox button:hover{
  opacity: 0.7;
}

.pdrt{
  width: 640px;
  height:540px;
  float:left;
}

.pdrtpic{
  width: 640px;
  height:540px;
  border: solid #888888 1px;
  margin-bottom:30px;
  position:relative;
  overflow:hidden;
  background:#FFFFFF;
}

	.pdrtpic ul{
		position:absolute;
		width:5120px;
	}
	.pdrtpic li{
		float:left;
		width:640px;
		height:540px;
		list-style-type:none;
		display: table;
	}
	.pdrtpic li p {
		display: table-cell;
		margin: 0;
		text-align: center;
		vertical-align: middle;
	}

button{
        background-color: transparent;
        border: none;
        cursor: pointer;
        outline: none;
        padding: 0;
        appearance: none;
}
#prevBtn{
	position:absolute;
	top:0px;
	left:0px;
}
#nextBtn{
	position:absolute;
	top:0px;
	left:580px;	
}





.pdtxt{
  width: 100%;
  box-shadow:0px 0px 8px 0px #666666 ;
  padding:20px 0px;
  text-align:left;
}

.pdtxt2{
  width: 92%;
  margin:0 auto;
  display:table;
}

.pdtxt3{
  width: 50%;
  display:table-cell;
}

.pdtxt4{
  width: 50%;
  display:table-cell;
}


/* 真ん中 */
.note{
margin: 15px 20px 30px 20px;
min-height: 300px;
text-align: left;
padding:10px;
background: #FFFFFF;
box-shadow:0px 0px 8px 0px #666666 ;
}

h1{
background: #DDDDDD;
padding:10px;
}

.notet{
padding:10px;
min-height: 260px;
width: 600px;
line-height:1.5em;
}

.noft{
background: #DDDDDD;
padding-top:2px;
padding-bottom:1px;
padding-right:15px;
text-align: right;
}

.ntbtm{
height: 200px;
min-height: 200px;
}


/* about用 */
.notetb{
padding:10px;
min-height: 100px;
width: 450px;
line-height:1.5em;
}

.noteal{
margin: 35px 0px 30px 0px;
min-height: 300px;
text-align: left;
padding:10px;
background: #FFFFFF;
box-shadow:0px 0px 8px 0px #666666 ;
}

.noteal2{
margin: 35px 0px 30px 0px;
min-height: 300px;
text-align: left;
padding:0px;
background: #FFFFFF;
box-shadow:0px 0px 8px 0px #666666 ;
}


/* 右 */

.nv2{ 
margin: 0px 0px;
min-height: 300px;
width: 120px;
padding:0px;
-webkit-text-size-adjust: 100%;
}


.oybx {
display: block;
}

.clearfix:after{
content: "";
clear: both;
display: block;
}


.box0 {
width: 100px;
height: 40px;
line-height: 40px;
margin: 10px;
margin-left: 0px;
border-left: solid #999999  15px;
background: #99BBDD;
}

.box {
width: 182px;
padding: 0px;
border-bottom: solid #FFFFFF 2px;
margin-left: 0px;
display: block;
}

.box2 {
width: 180px;
background: #FFFFFF;
}

.box3 {
width: 72px;
padding: 5px;
margin: 5px;
background: #FFFFFF;
display: block;
display: table-cell;
color: #000000;
border-top: solid   2px;
border-bottom: solid  2px;
border-color: #FFFFFF;
}

.box3:hover{
background: #557799;
color: #FFFFFF;
cursor: pointer;
transition: all .5s;
}

.box4 {
width: 72px;
padding: 5px;
margin: 5px;
background: #FFFFFF;
display: block;
display: table-cell;
color: #000000;
border-top: solid   2px;
border-bottom: solid  2px;
border-color: #FFFFFF;
}

.box4:hover{
background: #557799;
color: #FFFFFF;
cursor: pointer;
transition: all .5s;
}



#acMenu dt{
height: 40px;
line-height: 40px;
background: #CCDDEE;
cursor: pointer;
border-left: 0px;
border-color: #FFFFFF;
    }

#acMenu dd{
display: none;
width: 180px;
border: solid 2px;
border-left: 0px;
border-color: #CCDDEE;
    }




#bg{
	position:fixed;
	left:0;
	top:0;
	height:100%;
	width:100%;
	background:rgba(0,0,0,0.6);
	z-index: 9;
}


#photo{
	position:absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
	margin:auto;
	background:#FFFFFF;
	border: solid 10px #FFFFFF;
	text-align: center;
	z-index: 9;
}
