@import url(/common/css/utility.css);



/* パララックス用css */
html, body {
  margin:0;
  padding:0;
  min-height: 100%;
  width: 100%;
  background-color: #ffffff;
  font-family: "Arial","Helvetica","sans-serif","Hiragino Kaku Gothic Pro","Osaka";
}
.contents {
  width: 100%;
  color: #333333;
  display: table;
}
.contents > * {
  display:table-cell;
  vertical-align: middle;
  text-align: center;
}
.fadeDone {
    opacity: 0;
}
#contents1 {
  background-color: #ffffff;　overflow: hidden;
}
#contents2 {
  background:url("/img/img-bg-01.png")  no-repeat ;
  background-position:bottom;
  background-size:100% auto;
  background-color: #ffffff;　overflow: hidden;

}
#contents3 {
  background-color: #eaeaea;　overflow: hidden;
}
#contents4 {
  background-color: #d3d3d3;　overflow: hidden;
}
#contents5 {
  background-color: #ffffff;　overflow: hidden;
}

.contact {
background-color:#FFCC33;
padding:5px 10px 5px 10px;
margin:15px 40% 0 40%;
    border-radius: 15px;        /* CSS3草案 */  
    -webkit-border-radius: 15px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 15px;   /* Firefox用 */  
max-width:20% !important;


}

.contact a,  .contact a:hover {
display: block;
text-decoration:none;
}






@media screen and (min-width: 450px) {
   /* 表示領域が450px以上の場合に適用するスタイル */

/**basic**/
#contents2 p.sponly {
	display:none;
}

body {
	margin:0px;
	padding:0px;
	text-align:center;
	font-style: normal;
	font-size:13px;
	color:#333333;
	-webkit-text-size-adjust: none;}
	  
	  

a:link {text-decoration:none;  color:#333333;}
a:visited {text-decoration: none; color:#333333;}
a:hover {text-decoration: underline; color:#333333;}
a:active {text-decoration: none;}

a:hover img
{
opacity:0.8;
filter: alpha(opacity=80);
-ms-filter: "alpha( opacity=80 )";
background: #ffffff;
}


em {font-style:normal;
font-weight:normal;
color:#FF0000;}

p {margin:0;     width: 100%;
    float: left;
    clear: both;
}

h1 {
 font:Arial, Helvetica, sans-serif;
 font-size:14px;
 color:#333333;
 font-weight:bold;
 margin:0;}
 
h2 {
	font-size:13px;
	color:#333333;
	font-weight:bold;
	font:Arial, Helvetica, sans-serif;
	margin:0 0 0px 0;
}

h3 {
	font-size:13px;
	color:#333333;
	font-weight:bold;
	font:Arial, Helvetica, sans-serif;
	margin:0;
	float:left;
	clear:both;
}
 

img {
     border:none;}

td{ font-size: 13px;
    vertical-align: top;
	padding-left: 5px;
	padding-top: 4px;
	padding-bottom: 4px;
	text-align: left;
	font-style: normal;
}

th{
	font-size: 13px;
	vertical-align: top;
	padding-left: 5px;
	padding-top: 2px;
	padding-bottom: 2px;
	text-align: left;
	font-style: normal;
	font-weight: normal;	
}




/**BODY**/
#top {
 background-color:#FFFFFF;
 	margin-left:auto;
	margin-right:auto;
	margin-bottom:0px;}



/**HEADER**/
#header {
}

 
/**MENU**/


/**FOOTER**/
#footer {
	position: fixed;
	bottom:0;
 background-color:#969696;
 color:#FFFFFF;
 text-align:center;
 padding: 2px 0 2px 0 ;
 width:100%;
 margin: 0px;}


/**PANKUZU**/
#BREADCRUMB {
	float:left;
	clear:both;
	border-right: solid 1px #969696;
	border-left: solid 1px #969696;
	padding: 5px 10px 5px 30px;
	width:960px;
	height: 20px;
	text-align:left;
}
	
#BREADCRUMB ul li {
 background:url("img/naviarrow.gif") no-repeat scroll right 4px transparent;
 display:inline;
 font-size:12px;
 color:#333333;
 margin: 0;
 padding: 0 9px 0 3px;
 line-height:180%;}	
 
 
#BREADCRUMB ul li.last{
 background:none repeat scroll 0 0 Transparent;
 display:inline;
 font-size:12px;
 color:#333333;
 margin: 0;
 padding: 0 0px 0 3px;
 line-height:180%;}	


/**CONTENTS**/
#contents {}




}




@media screen and (max-width: 449px) {
   /* 表示領域が449px以下の場合に適用するスタイル */
#contents2 p.pconly {
	display: none;
}

p {margin:0;
	width: 100%;
    float: left;
    clear: both;
}

body {
	font-family: "Arial","Helvetica","sans-serif","Hiragino Kaku Gothic Pro","Osaka";
	margin:0px;
	padding:0px;
	width:100%;
	font-style: normal;
	font-size:0.8em;
	color:#333333;
	-webkit-text-size-adjust: none;
    display: -webkit-flexbox;
    display: -moz-flexbox;
    display: -ms-flexbox;
    display: -o-flexbox;
    display: flexbox;
overflow: hidden;
}

a:link {text-decoration:none;  color:#333333;}
a:visited {text-decoration: none; color:#333333;}
a:hover {text-decoration: underline; color:#333333;}
a:active {text-decoration: none;}



input[type="button"],,input[type="text"]input[type="submit"] {
   -webkit-appearance: none;
   border-radius: 0;
}



h1 {
 font:Arial, Helvetica, sans-serif;
 font-size:134%;
 color:#333333;
 font-weight:bold;
 margin:15px 5% 3px 5%;
	width:90%;
	float:left;
	clear:both;
	text-align:left;
	border-left:3px solid  #969696;
	padding:0px 0 0 6px;
}
 
h2 {
	font-size:125%;
	color:#333333;
	font-weight:bold;
	font:Arial, Helvetica, sans-serif;
	margin:10px 5% 10px 5%;
	padding:1px 5px 1px 5px ;
	width:90%;
	border:1px solid #cecece;
	float:left;
	clear:both;
}

h3 {
	font-size:117%;
	color:#333333;
	font-weight:bold;
	font:Arial, Helvetica, sans-serif;
	margin:0 7% 5px 7%;
	padding:0 3px 0 3px ;
	width:86%;
}



/**CONTENTS**/
#contents {
 width:98%;
 background-color:#FFFFFF;
 margin:60px auto 0px auto;
	padding:10px 1% 10px 1%;
}



#CONTENTS {
}


/* TOP page */



/* FOOTER */
#footer {
	position: fixed;
	bottom:0;
	margin:5px 0 0 0;
	background-color:#969696;
	width:100%;
	padding:0;
} 

#footer p {
	margin:2px 0 2px 0 !important;
	text-align:center;
	font-size:0.7em;
	color:#fff;
} 


.contact {
background-color:#FFCC33;
padding:5px 10px 5px 10px;
margin:15px 32% 0 32%;
    border-radius: 15px;        /* CSS3草案 */  
    -webkit-border-radius: 15px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 15px;   /* Firefox用 */  
max-width:36% !important;


}

.contact a,  .contact a:hover {
display: block;
text-decoration:none;
}

#contents3 img {
width:80%;
}



}