@charset "utf-8";

/* ****************************************************************** 

	--base.css--

	1. Layout setting
		1-1. Page styles
		1-2. global navigation styles
		1-3. Header styles
		1-4. contents styles
		1-5. Footer styles
		
	2. Other Settings
		2-1. Scroll Up styles
		2-2. Mailform styles


****************************************************************** */


/*==================================================================
	1. Layout setting
===================================================================*/

/* ------------------------------------------------------------------
	1-1. Page styles
-------------------------------------------------------------------*/



html {
  font-size: 62.5%;
  font-family: Verdana, sans-serif;
  }
 
body {
  font-size: 16px; font-size: 1.6rem;
  line-height: 1.8;
  color: #777;
  background: url(../img/bg-main.jpg) left top repeat-x;
  }
  
  
#wrapper {
	margin: 0 auto;
	width: 920px;
}

#header {
	width: 100%;
	margin: 0;
	overflow: hidden;
}
  
#main {
	width: 100%;
	margin: 0;
	padding-top: 20px;
	padding-left: 20px;
	background: url(../img/bg-contents.png) left top no-repeat;
	clear: both;
}



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

.clearfix {*zoom: 1;} /*IE6/7*/







/* ------------------------------------------------------------------
	1-2. global navigation styles
-------------------------------------------------------------------*/

#gnav {
	display: inline;
	width: 880px;
	height: 40px;
}

#gnav ul {
	margin-top:10px;
	margin-bottom:10px;
	padding: 0;
	width: 880px;
	list-style:none;
}

#gnav li {
	display:inline;
}





/* ------------------------------------------------------------------
	1-3. Header styles
-------------------------------------------------------------------*/

#header h1 {
	width: 480px;
	float: left;
}

#header p.jp {
	wifth: 300px;
	float: right;
	margin-top: 45px;
	padding-right: 10px;
	font-size: 14px; font-size: 1.4rem;
	color: #ffffff;
}

#header p.jp a {
	color: #ffffff;
	text-decoration: none;
	}
	
#header p.jp a:link {
    color:ffffff;
    text-decoration:none;
}

#header p.jp a:visited {
    color:#e7e784;
    text-decoration: none;
}

#header p.jp a:hover {
    color:#e7e784;
    font-style:normal;
    text-decoration:underline;
}

#header p.jp a:active {
    text-decoration:none;
}




/* ------------------------------------------------------------------
	1-4. contents styles
-------------------------------------------------------------------*/
	
#contents {
	width: 800px;
	margin: 30px 0 0 40px;
}

#contents h2 {
	font-size: 2.4em; font-size: 2.4rem;
	line-height: 1.5;
	color: #11a3bf;
	font-weight: normal;
	margin: 40px 0 20px 0;
}

#contents h3 {
	clear: both;
	font-size: 2em; font-size: 2rem;
	color: #11a3bf;
	font-weight: normal;
	margin: 40px 0 10px 0;
}

#contents h4 {
	clear: both;
	font-size: 1.8em; font-size: 1.8rem;
	line-height: 1.4;
	font-weight: normal;
	margin: 30px 0 10px 0;
	padding-left: 10px;
	border-left: 3px solid #11a3bf;
}

#contents p {
	font-size: 1.4em; font-size: 1.4rem;
	margin: 10px 0 10px 0;
	text-align:justify;
	text-justify:distribute-all-lines; 
}

#contents p.right {
	margin: 10px 0 30px 0;
	text-align: right;
}


#contents a:link {
	color: #a78a31;
	text-decoration: none;
}

#contents a:visited {
	color: #7d6b2b;
	text-decoration: none;
}

#contents a:hover,
#contents a:focus {
	color: #d9b032;
	text-decoration: underline;
}

#contents a:active {
	color: #d9b032;
}

#contents a img{
	border:none;
}

#contents img.mb40{
	margin: 0 0 40px 0;
}




#contents ul {
	margin: 5px 0 10px 5px;
	list-style-type: none;
}

#contents ul li {
	margin: 0 0 10px 15px;
	font-size: 1.4em; font-size: 1.4rem;
}

#contents ul li ul {
	margin: 5px 0 10px 0;
	list-style-type: cjk-ideographic;
}


#contents ul li ul li {
	margin: 0 0 0 15px;
}




#contents ol {
	margin: 5px 0 10px 5px;
	list-style-type: decimal;
}

#contents ol li {
	margin: 0 0 10px 15px;
	font-size: 1.4em; font-size: 1.4rem;
}

#contents ol li ol {
	margin: 5px 0 10px 0;
	list-style-type: cjk-ideographic;
}


#contents ol li ol li {
	margin: 0 0 0 15px;
}



/* ------------------------------------------------------------------
	1-5. Footer styles
-------------------------------------------------------------------*/

#footer {
	width: 880px;
	margin: 40px auto 50px;
	overflow: hidden;
	color: #777;
	font-size: 14px; font-size: 1.4rem;
	line-height: 1.6;
	border-top: 1px solid #ccc;
}

#footer .footleft {
	float: left;
	margin-bottom: 30px;
	width: 660px;
}

#footer .footlogo {
	margin: 0 0 20px 0;
}


#footer .footright {
	float: right;
	margin-bottom: 30px;
	width: 220px;
}

#copyright {
	clear: both;
	width: 100%;
	margin: 0 0 20px 0;
	text-align: right;
}

#copyright address {
	font-size: 12px; font-size: 1.2rem;
	margin-top: 20px;
}




/*==================================================================
	2. Other setting
===================================================================*/


/* ------------------------------------------------------------------
	2-1. Scroll Up styles
-------------------------------------------------------------------*/


#scrollUp {
	bottom: 20px;
	right: 20px;
	background: #777;
	color: #fff;
	font-size: 12px;
	font-family: sans-serif;
	text-decoration: none;
	opacity: .9;
	padding: 10px 20px;
	-webkit-border-radius: 16px;
	-moz-border-radius: 16px;
	border-radius: 16px;
	-webkit-transition: background 200ms linear;
	-moz-transition: background 200ms linear;
	transition: background 200ms linear;
	-webkit-backface-visibility: hidden;
}
	#scrollUp:hover {
		background: #11a4c0;
	}
	
	
/* ------------------------------------------------------------------
	2-2. Mailform styles
-------------------------------------------------------------------*/	
	
	
form#mailform {
	margin:  30px 0 40px 0;
	padding: 5px;
}

table.mailform {
	width: 100%;
}

table.mailform tr th,table.mailform tr td {
	text-align: left;
	font-weight: normal;
	font-size: 14px; font-size: 1.4rem;
	border-bottom: solid 1px #ccc;
	padding: 10px 5px 10px 5px;
}

table.mailform tr th {
	width: 200px;
}

table.mailform tr th span {
	color: #CC0000;
	font-size: 10px;
}

table.mailform tr th p {
	margin: 0px;
	padding: 0px;
	font-size: 14px; font-size: 1.4rem;
	color: #ccc;
}

table.mailform tr td textarea {
	width: 100%;
	height: 150px;
}




table.agree {
	width: 100%;
}

table.agree tr th {
	text-align: left;
	font-weight: normal;
	font-size: 14px; font-size: 1.4rem;
	border-bottom: solid 1px #ccc;
	border-top: solid 1px #ccc;
	padding: 10px 5px 10px 5px;
}

table.agree tr td {
	text-align: left;
	font-weight: normal;
	font-size: 14px; font-size: 1.4rem;
	border-bottom: solid 1px #ccc;
	border-top: solid 1px #ccc;
	padding: 10px 5px 10px 20px;
}

table.agree tr th {
	width: 620px;
}

table.agree tr th span {
	color: #CC0000;
	font-size: 10px;
}

table.agree tr th p {
	margin: 0px;
	padding: 0px;
	font-size: 14px; font-size: 1.4rem;
	color: #ccc;
}

table.agree tr td textarea {
	width: 100%;
	height: 150px;
}