@charset "UTF-8";
/* =========================================================================

Magnet kaitori.com  Mar 2016.                                                                  

========================================================================= */

/* --------------------------------------------------------------------------------------
 基本設定
--------------------------------------------------------------------------------------- */


/* 基本フォント ------------------------------ */

body {
	color: #40210f;
	font-family: YuGothic,'Yu Gothic',游ゴシック体,游ゴシック,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',Roboto,メイリオ,Meiryo,'ＭＳ Ｐゴシック',Osaka,'MS PGothic',Arial,Helvetica,Verdana,sans-serif!important;
	/*font-family: Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; */
	font-size: 100%;
	line-height: 1.5; 
}


html:not(:target) body {
	font-size: 12px;
}

input,textarea,select {
    font-family: YuGothic, 'Yu Gothic', 游ゴシック体, 游ゴシック, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', Roboto, メイリオ, Meiryo, 'ＭＳ Ｐゴシック', Osaka, 'MS PGothic', Arial, Helvetica, Verdana, sans-serif;
	font-size: 100%;
}


* html table {
	font-size: 100%;
	line-height: 1.5;
}



/* 基本タグ ------------------------------ */

body,div,
h1,h2,h3,h4,h5,h6,
dl,dt,dd,ul,ol,li,
p,blockquote,pre,cite,code,caption,
form,fieldset,legend,input,textarea,select,option,label {
	margin: 0;
	padding: 0;
}

html, body { height:100%; }

img,table {
	border: none;
}

table {
	border-collapse: collapse;
}

ul {
	list-style: none;
}


li img,
dt img {
	vertical-align: bottom;
}



/* 基本テキストリンク ------------------------------ */

a {
	overflow: hidden;
}

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


/* --------------------------------------------------------------------------------------
 float解除
--------------------------------------------------------------------------------------- */


/* clearfix */
.clearfix:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0;
}
 /* IE6 */
* html .clearfix { zoom: 1;}
 /* IE7 */
*:first-child+html .clearfix { zoom: 1;}



/* --------------------------------------------------------------------------------------
 共通CSS
--------------------------------------------------------------------------------------- */

.leftblock {
	float: left;
}

.rightblock {
	float: right;
}

.m-5 {
	margin-bottom:5px;
}
.m-10 {
	margin-bottom:10px;
}
.m-15 {
	margin-bottom:15px;
}
.m-20 {
	margin-bottom:20px;
}
.m-25 {
	margin-bottom:25px;
}
.m-30 {
	margin-bottom:30px;
}
.m-35 {
	margin-bottom:35px;
}
.m-40 {
	margin-bottom:40px;
}
.m-45 {
	margin-bottom:45px;
}
.m-50 {
	margin-bottom:50px;
}

.mt-20 {
	margin-top: 20px;
}
.mt-30 {
	margin-top: 30px;
}
.mt-40 {
	margin-top: 40px;
}
.mt-50 {
	margin-top: 50px;
}

::selection { background: #16de01; }

::-moz-selection { background: #16de01; }

.indent {
  padding-left: 1em;
  text-indent: -1em;
}

.underline {
	text-decoration: underline;
}

.red {
	color:red;
}

.centre {
	text-align: center;
}
	


/* --------------------------------------------------------------------------------------
 レイアウト枠
--------------------------------------------------------------------------------------- */

div#wrap {
	width: 100%;
	min-width:900px; 
	margin: 0 auto;
	text-align: left;
	background-image:url(../img/bg-main.gif);
	background-repeat:repeat
}


/* --------------------------------------------------------------------------------------
 header
--------------------------------------------------------------------------------------- */

div#headertop {
	background-color:#f67203;
	width:100%;
	min-width:900px;
	height: 25px;
	clear:both ;
}

div#h1header {
	width: 900px;
	margin: 0 auto;
	padding: 5px 0px; 
}

h1#head{
	color:#FFFFFF;
	font-size: 10px;
	padding-left: 20px;
}


div#header {
	width: 900px;
	height:138px;
	margin: 0 auto;
}


div#logo {
	margin: 10px 0 0 20px;
}

div#topinfor {
	margin: 10px 20px 0 0;
}

div#mainimage-bg{
	background-color:#B1A297;
	width:100%;
	min-width:900px;
	height: 315px;
	margin-bottom: 20px;
}

div#mainimage {
	width: 900px;
	height:320px;
	margin: 0 auto;
	padding : 10px 0 0 0;
}


/*-----------------------------------------------------------------
container
-----------------------------------------------------------------*/

div#contbg {
	width: 100%;
	min-width: 900px;
}

div#container {
	width: 900px;
    margin: 0 auto; 
	margin-top: 0px;
}

section#flow {
/*	background-color:#fcf9e5;  */
	padding: 40px 20px 10px 20px;
}

h1.conttitle {
	height: 80px;
/*	color: #009ce4;  */
	color: #33A9A7;
	font-size: 40px;
    letter-spacing: -0.05em;
    line-height: 1.35em;
    text-decoration: none;
    font-weight: 700;
    text-shadow: 0px 1px 1px rgba(0,0,0,.1);
} 

.batch {
	vertical-align:middle;
	margin-right: 10px;
}

div#flowcont {
	height: 170px;
/*	padding-top: 0px;  */
	background-image: url(../img/flowbg.gif);
	background-repeat:no-repeat;
	padding: 105px 0 0 20px;
}

div#folow1 {
    width: 150px;
    margin-right: 75px;
    float: left;
}

div#folow2 {
    width: 150px;
    margin-right: 75px;
    float: left;
}

div#folow3 {
    width: 150px;
    margin-right: 75px;
    float: left;
}

div#folow4 {
    width: 150px;
    margin-right: 0px;
    float: left;
}

section#flow h2 {
	color: #fd7201;
	font-size: 15px;
}

div#flowcont p {
	margin-top: 20px;
	font-size: 14px;
}

section#area1 {
	padding: 20px 20px 10px 20px;
	width: 900px;
}

section#area2 {
	padding: 40px 20px 10px 20px;
	width: 900px;
}

section#area3 {
	padding: 40px 20px 10px 20px;
	width: 900px;
}

section#area5 {
	padding: 40px 20px 10px 20px;
	width: 900px;
}

div#back {
	text-align:right;
	height: 50px;
	padding-top: 30px;
}
	



/*-----------------------------------------------------------------
Form
-----------------------------------------------------------------*/

div#contactform table {
	width:750px;
	margin: 0 auto; 
	margin-top: 0px;
	text-align:left;
}


div#contactform table tr th {
	font-family: YuGothic, 'Yu Gothic', 游ゴシック体, 游ゴシック, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', Roboto, メイリオ, Meiryo, 'ＭＳ Ｐゴシック', Osaka, 'MS PGothic', Arial, Helvetica, Verdana, sans-serif;
	width: 250px;
	background-color: #b39a87;
	color: #FFF;
	font-size: 14px;
	padding: 10px 20px;
	border-bottom: 1px solid #C6BEB9;
}

div#contactform table tr td {
	padding: 10px 20px;
	border: 0;
	background-color: #F3F3F3;
	border-bottom: 1px solid #E2DDD9;
}

#buttonspace {
	padding: 20px ;
	background-color: #F3F3F3;
}


.formbutton {
	cursor:pointer;/*カーソルを指先型にします*/
	font-size:130%;
	font-weight: bold;
	width:150px;
	padding: 5px 0;
	margin:0.5em 0.5em 0 0;
	border-style:none;/*デフォルトのボーダーを消す。ボーダーの指定を上書きしてもOK*/
	color: #fff;
	background:#B1A297;/*背景色を指定*/
/*↓ボックスの角丸の指定です*/
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
/*↓ボックスのシャドウの指定です
	-moz-box-shadow: 2px 2px 3px 1px #666;
	-webkit-box-shadow: 2px 2px 3px 1px #666;
	box-shadow: 2px 2px 3px 1px #666; */
/*↓テキストシャドウの指定です
	text-shadow: 1px 1px 2px #000;  */
}
/*↓「:hover」で、ロールオーバー時に変えたい指定をします。ここでは背景色だけ変更*/
.formbutton:hover {
	background-color: #C8C9CA;
}

.thanks-text1 {
	font-size:24px;
}
.thanks-text2 {
	font-size:15px;
}





/*-----------------------------------------------------------------
Footer
-----------------------------------------------------------------*/


div#footer {
	width:100%;
/*	min-width:900px; */
	height: 160px;
	background-color:#e6e0d2;
	border-top: 1px solid #e2d9c6;
}

div#footercont {
	width: 900px;
    margin: 0 auto; 
	text-align: center;
	padding-top: 13px;
}

div#copybg {
	width:100%;
/*	min-width:900px; */
	height: 40px;
	background-color:#dad4c5;
	border-top: 1px solid #ddac82;
}

div#copyright {
	width: 900px;
	height:25px;
    margin: 0 auto; 
	text-align: center;
	padding-top: 12px;
	color:#575349;
	font-size: 10px;
}