@charset "utf-8";

*{
	box-sizing: border-box;
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		-o-box-sizing: border-box;
		-ms-box-sizing: border-box;
}

html, body, h1, h2, h3, h4, h5, h6, header, footer, nav, p, hr, ul, ol, li, form, img, dl, dt, dd {
	margin: 0;
	padding: 0;
}

li {
	list-style-type: none;
}

img {
	vertical-align: bottom;
	border: none;
	max-width: 100%;
    height: auto;
    width /****/:auto;  /*IE8のみ適用*/
}

.noborder {
	border: none !important;
}

.nospace {
	margin: 0 !important;
}

.nowrap {
	white-space: nowrap;
}

.none {
	display: none;
}

.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block }
/* End hide from IE-mac */

.textCenter {
	text-align: center;
}

.textRight {
	text-align: right;
}

.imgLeft {
	float: left;
	margin: 0 10px 10px 0;
}

.imgRight {
	float: right;
	margin: 0 0 10px 10px;
}

.left,
.left1,
.left2,
.left3,
.left4 {
	float: left;
}

.right,
.right1,
.right2,
.right3,
.right4 {
	float: right;
}

.box1, .box2, .box3, .box4, .box5, .box6, .box7, .box8, .box9, .box10 {
	clear: both;
}

.marginB5 {
	margin: 0 0 5px !important;
}

.marginB10 {
	margin: 0 0 10px !important;
}

.marginB15 {
	margin: 0 0 15px !important;
}

.marginB20 {
	margin: 0 0 20px !important;
}

.marginB25 {
	margin: 0 0 25px !important;
}

.marginB30 {
	margin: 0 0 30px !important;
}

.marginB40 {
	margin: 0 0 40px !important;
}

.marginB50 {
	margin: 0 0 50px !important;
}

.marginB60 {
	margin: 0 0 60px !important;
}

a:hover .link{
	opacity:0.8;
	filter:alpha(opacity=80);
	-ms-filter: "alpha( opacity=80 )";
}

.link01 {
	padding: 0 0 0 20px;
	background: url(../common/com_icon.png) left center no-repeat;
}

.pagetop{
	margin: 0 0 20px;
	text-align: right;
}

.topicpath{
	padding: 10px 20px;
    text-align:right;
	background:url(../common/com_bg03.gif) left top;
	border-top-left-radius: 5px;
		-moz-border-top-left-radius: 5px;
		-webkit-border-top-left-radius: 5px;
		-o-border-top-left-radius: 5px;
		-ms-border-top-left-radius: 5px;
		-khtml-border-top-left-radius: 5px;
	border-top-right-radius: 5px;
		-moz-border-top-right-radius: 5px;
		-webkit-border-top-right-radius: 5px;
		-o-border-top-right-radius: 5px;
		-ms-border-top-right-radius: 5px;
		-khtml-border-top-right-radius: 5px;
}

.topicpath li {  
    display:inline;
}


.liststyle01 li{
	list-style-type: disc;
}

/* ボディー
----------------------------------------------------------------------------------------------------*/

body {
	margin: 0;
	padding: 0;
	text-align: center;
	background: url(../images/masa_bg01.gif) left top;
}

#container {
	margin: 0 auto;
	padding: 2% 4%;
	max-width: 700px;
	background: #FFF;
}

/* ヘッダー
----------------------------------------------------------------------------------------------------*/

header{
	position: relative;
	text-align: left;
	margin: 0 0 10%;
}

header h1 {
	position: absolute;
	top: 0;
	right: 0;
	width: 203px;
	height: 411px;
}

header h2 {
	margin: 0 0 16%;
}

@media screen and (max-width:580px){
	header{
		position: static;
		text-align: center;
	}
	
	header h1 {
		position: static;
		top: 0;
		right: 0;
		margin: 0 0 5%;
		width: 100%;
		height: auto;
		text-align: center;
	}
	
	header h2 {
		display: none;
	}
}



/* コンテンツ
----------------------------------------------------------------------------------------------------*/

#contents {
	text-align: left;
}

#contents .box1{
	margin: 0 0 5%;
}

#contents .box1 .left,
#contents .box1 .left2,
#contents .box1 .right{
	width: 32%;
}

#contents .box1 .left{
	margin: 0 2.5% 0 0;
}

#contents .box1 .right{
	text-align: right;
}


/* フッター
----------------------------------------------------------------------------------------------------*/

footer {
	margin: 0;
	padding: 0;
	background: #1E0A0B;
}

#footer {
	margin: 0 auto;
	padding: 5% 0;
	max-width: 700px;
}

#footer .left {
	width: 208px;
}

#footer .right {
	width: 330px;
	text-align: right;
}

@media screen and (max-width:580px){
	#footer .left {
		margin: 0 0 5%;
		width: 100%;
		text-align: center;
	}
	
	#footer .right {
		width: 100%;
		text-align: center;
	}
}