/* IMPORTS ------------------------------------------------------------*/

@import url('reset.css');


/* HACKS ------------------------------------------------------------*/

.clear{
	clear:both;
}

.inv{ display:none; }

.alignleft{
	float: left;
	margin: 5px 10px 5px 0px;
}

/* GENERAL ------------------------------------------------------------*/

html {
  min-height: 100%;
  background-size: cover; /*ボックス全体をカバーする大きさで表示*/
  background-image: url(../images/top_photo.jpg);
  background-repeat: no-repeat;
  background-position: center bottom;/*写真の見せたい場所を調整*/
  border: 10px solid #fff;
  font-family: 'Open Sans', 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', メイリオ, Meiryo, sans-serif;
}
body{
  min-height:100%;
  color: #000;
  margin: 0 0 0 -24px;
  
  }
/*

html, body {
  height: 100%;
  width: 100%;
  padding: 0;
  margin: 0;
}

body {
	border: 10px solid #dbaf40;
	margin: 0 0 0 -24px;
}


#full-screen-background-image {
  z-index: -999;
  min-height: 100%;
  min-width: 1024px;
  width: 100%;
  height: auto;
  position: fixed;
  top: 0;
  left: 0;
}

*/

#wrapper {
	min-width:100%;
	min-height: 100%;
	height: 100%;
	border-left: 20px solid #fff;
}

#content {
  position: relative;
  width: 30%;
  margin: 10px;
  padding: 20px;
  text-align: left;
  color: #000;
  line-height: 1.5;
}

#content a {
	color: #df5435;
}

#content a:hover {
	opacity: 0.4 ;
	filter: alpha(opacity=40) ;	/* Ie用 */
	-webkit-transition: 0.6s ;
	transition: 0.6s ;
}

#content h1 { font-size: 1em; padding: 0 0 10px 0; letter-spacing: 0.5px; font-weight: normal; }
#content h2 { font-size: 0.7em; padding: 20px 0 5px 0; letter-spacing: 0.5px; font-weight: normal; }
#content h3.top { font-size: 0.7em; padding: 0;  letter-spacing: 0.5px; font-weight: normal; }
#content h3 { font-size: 0.7em; padding: 20px 0 0 0;  letter-spacing: 0.5px; font-weight: normal; }
#content p {
  font-size: 0.7em;
}
#content p.top20m { margin-top: 20px; }
#content ul { 
  font-size: 0.75em;
  padding: 20px 0;
  letter-spacing: 0.5px;
  margin: 20px 0;
  border-top: 1px dashed #000; 
}
#content ul li {
	pading: 1px 0;
}

#footer {
	color: #000;
	width: 100%;
	margin-top: 40px;
}

#footer p {
	margin: 0;
	padding: 0;
	font-size: 0.7em;
	letter-spacing: 0.5px;
}


.fade {  
    -webkit-transition: 0.3s ease-in-out;  
       -moz-transition: 0.3s ease-in-out;  
         -o-transition: 0.3s ease-in-out;  
            transition: 0.3s ease-in-out;  
} 

.fade:hover {  
    opacity: 0.6;  
    filter: alpha(opacity=60);  
} 

.my-sticky-element.stuck {
position:fixed;
top:0;
}


@media (max-width: 780px) {
	
html {
  min-height: 100%;
  background-size: cover; /*ボックス全体をカバーする大きさで表示*/
  background-image: url(../images/top_photo.jpg);
  background-repeat: no-repeat;
  background-position: center top;/*写真の見せたい場所を調整*/
  border:none;
}
body{
  min-height:100%;
  color: #fff;
	margin: 0;
  }
  
#wrapper {
	min-width:100%;
	min-height: 100%;
	height: 100%;
	border-left: none;
}


img#top-btm {
	width: 50%;
	height: 50%;
}
	
#content {
  width: 90%;
	}
}