@charset "Shift_JIS";
.wrapper{
  width : 980px;
  position:relative;
    margin-top: 14px;
}
.wrapper_2{
  width : 980px;
  position:relative;
  margin-top : 20px;
    margin-bottom: 50px;
    }

.left{
  float:left;
  margin-right : 52px;
}
.right{
  float:right;
  margin-top : 0px;
  margin-left : 0px;
  margin-right : 0px;
  margin-bottom : 0px;
}
h3{
  text-align : center;
text-shadow: 1px 1px 2px rgba(210, 210, 210, 0.45);
-webkit-text-shadow: 1px 1px 2px   rgba(210, 210, 210, 0.45);
 /* Safari,Google Chrome—p */  
-moz-text-shadow: 1px 1px 2px   rgba(210, 210, 210, 0.45);
/* Firefox—p */  

  color : #0a0a0a;
  position : static;
  margin-top : 10px;
  font-weight : bold;
}
.font{
  color :#0a0a0a;
  display:inline;
  font-size : 11pt;
text-shadow: 1px 1px 2px rgba(210, 210, 210, 0.45);
-webkit-text-shadow: 1px 1px 2px   rgba(210, 210, 210, 0.45);
 /* Safari,Google Chrome—p */  
-moz-text-shadow: 1px 1px 2px   rgba(210, 210, 210, 0.45);
/* Firefox—p */  
  font-family:  ArialMT, "Hiragino Kaku Gothic ProN", "ƒqƒ‰ƒMƒmŠpƒS ProN W3","Hiragino Kaku Gothic Pro W3","ƒqƒ‰ƒMƒmŠpƒS Pro W3","ƒƒCƒŠƒI","EE EƒSƒVƒ`E","Osaka";
  line-height : 24px;
  text-align : left;
  position : absolute;
  top : 70px;
  left : 10px;
  width : 240px;
}
.font_1{
  color :#0a0a0a;
  display:inline;
  font-size : 13px;
text-shadow: 1px 1px 2px rgba(210, 210, 210, 0.45);
-webkit-text-shadow: 1px 1px 2px   rgba(210, 210, 210, 0.45);
 /* Safari,Google Chrome—p */  
-moz-text-shadow: 1px 1px 2px   rgba(210, 210, 210, 0.45);
/* Firefox—p */  
  font-family:  ArialMT, "Hiragino Kaku Gothic ProN", "ƒqƒ‰ƒMƒmŠpƒS ProN W3","Hiragino Kaku Gothic Pro W3","ƒqƒ‰ƒMƒmŠpƒS Pro W3","ƒƒCƒŠƒI","EE EƒSƒVƒ`E","Osaka";
  line-height : 24px;
  text-align : left;
  position : absolute;
  top : 50px;
  left : 10px;
  width : 240px;
}

/* ********************************************************************************
		NAV STYLING
********************************************************************************** */
nav{
  overflow:hidden;
  margin-top:15px;
  color :#0a0a0a;
text-shadow: 1px 1px 2px rgba(210, 210, 210, 0.45);
  font-family:  ArialMT, "Hiragino Kaku Gothic ProN", "ƒqƒ‰ƒMƒmŠpƒS ProN W3","Hiragino Kaku Gothic Pro W3","ƒqƒ‰ƒMƒmŠpƒS Pro W3","ƒƒCƒŠƒI","EE EƒSƒVƒ`E","Osaka";
  font-weight : bold;
}
nav a{
  color : #ff6400;
  font-size:14px;
  display:inline;
text-shadow: 1px 1px 2px rgba(210, 210, 210, 0.45);  
  font-family:  ArialMT, "Hiragino Kaku Gothic ProN", "ƒqƒ‰ƒMƒmŠpƒS ProN W3","Hiragino Kaku Gothic Pro W3","ƒqƒ‰ƒMƒmŠpƒS Pro W3","ƒƒCƒŠƒI","EE EƒSƒVƒ`E","Osaka";
  font-weight : bold;
}
/* ********************************************************************************
		CSS3 STYLING
********************************************************************************** */
.single-set{
  overflow:hidden;
}
.container{
  border : 2px solid white;
  position:relative;
  overflow:hidden;
  opacity:1.0;
  -webkit-transition: all 0.7s ease-out;
  -moz-transition: all 0.7s ease-out;
  transition: all 0.7s ease-out;
border-radius: 6px; 
}
.container:hover{
  opacity:0.9;
  cursor:pointer;
}
.text{
  background : none 0% 0% / auto auto repeat scroll padding-box border-box rgba(255, 255, 255, 0.85);
  color : #0a0a0a;
  font : normal normal normal 14px /normal;
  height : 160px;
  width:inherit;
  position:absolute;
  font-family:  ArialMT, "Hiragino Kaku Gothic ProN", "ƒqƒ‰ƒMƒmŠpƒS ProN W3","Hiragino Kaku Gothic Pro W3","ƒqƒ‰ƒMƒmŠpƒS Pro W3","ƒƒCƒŠƒI","EE EƒSƒVƒ`E","Osaka";
  text-align : left;
}
.text a{
  color : #0a0a0a;
  display:block;
  font-weight:normal;
  text-decoration:none;
  width:280px;
}
.clear{
clear: both;
}

.space01{
height: 100px;
}
article.css3-1{
  top:-240px;
  left:0;
  -webkit-transition: all 0.7s ease-out;
  -moz-transition: all  0.7s ease-out;
  -o-transition: all  0.7s  ease-out;
  transition: all  0.7s  ease-out;
  font-weight : normal;
}
.text a.css3-1{
  -webkit-transition: all 0.7s ease-out;
  -moz-transition: all  0.7s ease-out;
  -o-transition: all  0.7s  ease-out;
  transition: all  0.7s  ease-out;
}
.text a:hover.css3-1{
  color : #ff6e00;
  text-decoration:none;
}
.container:hover article.css3-1{
  top:0;
  color : #ff6400;
}
/* CSS3 Bottom Effect */

article.css3-2{
  bottom:-280px;
  left:0;
  -webkit-transition: all 0.7s ease-out;
  -moz-transition: all  0.7s ease-out;
  -o-transition: all  0.7s  ease-out;
  transition: all  0.7s  ease-out;
}
.text a.css3-2{
  -webkit-transition: all 0.7s ease-out;
  -moz-transition: all  0.7s ease-out;
  -o-transition: all  0.7s  ease-out;
  transition: all  0.7s  ease-out;
}
.text a:hover.css3-2{
  color : #ff6e00;
  text-decoration:none;
}
.container:hover article.css3-2{
  bottom:0;
  color : #ff6e00;
}
/* CSS3 Right Effect */

article.css3-3{
  right:-280px;
  top:0;
  -webkit-transition: all 0.7s ease-out;
  -moz-transition: all  0.7s ease-out;
  -o-transition: all  0.7s  ease-out;
  transition: all  0.7s  ease-out;
  width:280px;
}
.text a.css3-3{
  -webkit-transition: all 0.7s ease-out;
  -moz-transition: all  0.7s ease-out;
  -o-transition: all  0.7s  ease-out;
  transition: all  0.7s  ease-out;
}
.text a:hover.css3-3{
  color : #ff6e00;
  text-decoration:none;
}
.container:hover article.css3-3{
  right:0;
  color : #ff6400;
}
/* CSS3 Left Effect */

article.css3-4{
  left:-280px;
  bottom:0;
  -webkit-transition: all 0.7s ease-out;
  -moz-transition: all  0.7s ease-out;
  -o-transition: all  0.7s  ease-out;
  transition: all  0.7s  ease-out;
  width:280px;
}
.text a.css3-4{
  -webkit-transition: all 0.7s ease-out;
  -moz-transition: all  0.7s ease-out;
  -o-transition: all  0.7s  ease-out;
  transition: all  0.7s  ease-out;
}
.text a:hover.css3-4{
  text-decoration:none;
  color : #ff6e00;
}
.container:hover article.css3-4{
  left:0;
  color : #ff6400;
}