﻿@charset "utf-8";

/* ページの設定用CSS */

/* ===========================================================
【1】reset
=========================================================== */
body,div,p,h1,h2,h3,h4,h5,h6,form,fieldset,blockquote,table,th,td,dl,dt,dd{
	margin: 0px;
	padding: 0px;
}

img,a img{
	margin: 0px;
	padding: 0px;
	border: 0px;
}

fieldset{
	border: 0px;
}

input,select,textarea{
	vertical-align:middle;
}

table{
	border-collapse: separate;
	border-spacing: 0px;
	border: none;
}

th{
	text-align: left;
}

ul,ol,li{
	margin: 0px;
	padding: 0px;
	list-style: none;
}

dl,dt,dd{
	margin: 0px;
	padding: 0px;
}

h1,h2,h3,h4,h5,h6{
	font-size: 100%;
	line-height: 110%;
}

em,strong,address,caption,cite,code,pre,dfn{
	font-style: normal;
}

/* ===========================================================
【2】text
=========================================================== */
body,th,td{
	font-size: 12px;
	font-family: Verdana, Arial, "Hiragino Kaku Gothic Pro W3", "MS P Gothic";
	color: #646464;
}

/* IE6 */
* html body{
	font-size: 75%;
}

* html td,* html th{
	font-size: 75%;
}

/* IE7 */
*:first-child+html body{
	font-size: 75%;
}

p{
	font-size: 100%;
	line-height: 160%;
}

/* ===========================================================
【3】base setting
=========================================================== */
html,body{
	height: 100%;
}

* html #wrapper{
	height: 100%;
}

#wrapper{
	position: relative;
	height: 100%;
	min-height: 100%;
}

body > #wrapper{
	height: auto;
}

/* header
----------------------------------------------------------- */
#header{
	height: 60px;
	background: url(../images/header-bg.gif) repeat-x left top;
	text-align: center;
}

#header-inner{
	margin: 0px auto;
	width: 840px;
	text-align: left;
}

/* container
----------------------------------------------------------- */
#container{
	padding-bottom: 120px;
	background: url(../images/container-bg.gif) repeat-x left top;
	text-align: center;
}

#container-inner{
	margin: 0px auto;
	width: 900px;
	text-align: left;
}

/* footer
----------------------------------------------------------- */
#footer{
	position: absolute;
	width: 100%;
	height: 120px;
	left: 0px;
	bottom: 0px;
	background: url(../images/footer-bg.gif) no-repeat center bottom;
	text-align: center;
}

#footer-inner{
	margin: 0px auto;
	width: 840px;
	text-align: left;
}

/* ===========================================================
【5】parts
=========================================================== */
/* header
----------------------------------------------------------- */
#header .logo{
	margin-top: 20px;
	width: 168px;
	float: left;
}

#header address{
	margin-top: 15px;
	width: 160px;
	float: right;
}

/* footer
----------------------------------------------------------- */
#footer .logo{
	margin-top: 20px;
	width: 420px;
	float: left;
}

#footer address{
	margin-top: 20px;
	width: 160px;
	float: right;
}

#footer .copyright{
	padding-top: 40px;
	clear: both;
}

/* catch
----------------------------------------------------------- */
.catch{
	padding: 0px 30px;
	background: url(../images/catch-bg.jpg) no-repeat left top;
}

.catch h1{
	margin-top: 20px;
}

.catch h2{
	margin-bottom: 10px;
}

.catch p{
	width: 530px;
	height: 80px;
}

/* caption
----------------------------------------------------------- */
.caption{
	margin: 0px 30px 10px 30px;
}

/* title
----------------------------------------------------------- */
.title{
	margin-bottom: 10px;
}

/* contents
----------------------------------------------------------- */
.contents{
	margin: 0px 30px 40px 30px;
}

.contents p{
	margin-bottom: 20px;
}

/* column */
.column-left01{
	width: 500px;
	float: left;
}

.column-right01{
	width: 310px;
	float: right;
	background: url(../images/brand-bg_bottom.jpg) no-repeat left bottom;
}

.column-right01 p{
	margin: 0px;
	padding: 20px 20px 200px 20px;
	background: url(../images/brand-bg_top.gif) no-repeat left top;
}

/* button
----------------------------------------------------------- */
.button-top{
	width: 840px;
	height: 240px;
	background: url(../images/btn01-bg.gif) no-repeat left top;
}

.button-top dd{
	margin: 10px 30px 0px 20px;
}

.button-bottom{
	margin: 0px 30px;
	width: 840px;
	height: 260px;
	background: url(../images/btn02-bg.gif) no-repeat left top;
}

.column-left02{
	margin: 10px 0px 0px 20px;
	width: 480px;
	float: left;
}

.column-right02{
	margin: 10px 20px 0px 0px;
	padding-left: 10px;
	width: 295px;
	float: right;
	font-size: 80%;
	border-left: dotted 1px #cccccc;
}

/* ===========================================================
【6】class
=========================================================== */
/* align
----------------------------------------------------------- */
.align-left{
	margin-right: 10px;
	float: left;
}

.align-right{
	margin-left: 10px;
	float: right;
}

.align-center{
	text-align: center;
}

/* size
----------------------------------------------------------- */
.size-small{
	font-size: 84%;
}

/* clear
----------------------------------------------------------- */
.clear{
	clear: both;
}

/* ===========================================================
【7】clearfix
=========================================================== */
.clearfix:after,ul:after,dl:after.dd:after{content:".";height:0px;font-size:0.1em;line-height:0px;visibility:hidden;display:block;clear:both;}
.clearfix,ul,dl,dd{display:inline-block;}
.clearfix,ul,dl,dd{display:block;}
/* hide from IE-mac \*/
.clearfix,ul,dl,dd{overflow:hidden;} 
/* */
