@charset "UTF-8";
 
/* CSSリセット */
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,
pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,
strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,
caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,
figure,footer,header,hgroup,menu,nav,section,summary,time,mark,
audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;
vertical-align:baseline;background:transparent;font-weight:normal;}
body{line-height:1}article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section{display:block}
ul{list-style:none}blockquote,q{quotes:none}blockquote:before,
blockquote:after,q:before,q:after{content:none}a{margin:0;padding:0;
font-size:100%;vertical-align:baseline;background:transparent}
del{text-decoration:line-through}abbr[title],dfn[title]
{border-bottom:1px dotted;cursor:help}
table{border-collapse:collapse;border-spacing:0}
hr{display:block;height:1px;border:0;border-top:1px solid #ccc;
margin:1em 0;padding:0}input,select{vertical-align:middle}

/*641px～PC　PC上では見えないようにする*/
@media screen and (min-width:641px){
	.footer_area{
		display: none;
}	
}

/*スマホ～641pxの幅サイズまで*/
@media screen and (max-width:640px){
.footer_area {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: rgba( 0, 0, 0, 0.6 );
	z-index: 10000;
}
.footer_area .footer_area_inner {
    position: relative;
    width: 100%;
    margin: 0px auto;
    padding: 0px 0;
	margin-right: 0px;
}
.footer_area .footer_area_inner .footer_area_inner_btn {
    width: 100%;
    padding: 0px 0;
    font-size: 20px;
    font-weight: bold;
    margin-left: 10px;
	line-height: 1.3;
    
}
.inquiry_btn {
    background-color: #729533;
    -webkit-border-radius: 3px;
    display: inline-block;
    text-align: center;
    text-decoration: none;
	   width: 100%;
    padding: 15px 0;
    font-size: 32px;
    font-weight: bold;
}
.inquiry_btn:link, .inquiry_btn:visited {
    color: #FFFFFF !important;
}
.footer_area_inner span{
	color: #fff;
}
#siteBottom{
	margin-bottom: 85px;
}
}

#sen {
   width: 100%;
   border-bottom: 1px solid #696969;
   height: 10px;
   display: inline-block;
   margin-bottom: 10px;
}
 
 
 /*YouTube埋め込み用*/

#aaa {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
}


#bbb {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

#ccc {
	max-width:560px;
	margin:0 auto;
}

/* 一般・共通設定 */
body{    
font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",'メイリオ',Meiryo,Helvetica,Arial,Sans-Serif; 
}

/* "ヒラギノ明朝 Pro W3","Hiragino Mincho Pro",  */
/*font: 16px/20px "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",'メイリオ',Meiryo,Helvetica,Arial,Sans-Serif;*/

/* 部分的にフォントかえる */
.pop {font-family: "ヒラギノ明朝 Pro","Hiragino Mincho Pro";}



p.resizeimage {
  background:url(images/header_bg.jpg) no-repeat 50% 0;

}

/* 灰色の帯 */
p.resizeimage img { 
margin: -25px auto 20px auto;
width: 100%;
display: block;
max-width: 1060px; 
}

/* リンクの下線を消す */
a {
text-decoration: none;
}

/* リンククリックで下線がでる */
a:hover{
color:#666666;
text-decoration:underline;
}



/*文字の装飾 */

.test1	{ font-size: 85px;  }
.test2	{ font-weight:bold;   }
.test3	{  font-style:oblique;  }
.test4	{ font-size: 20px;  }
.test5	{ font-size: 25px;  }
.test6  { font-size: 18px;
	  margin-bottom: 5px;
	  display: inline-block;
          font-weight: bold;  
 }

/* 画像のレスポンシブル */
img { 
    max-width: 100%; 
    height: auto; 
} 

/* 画像が小さくなる　レスポンシブル */
#box {
  width: 40%;
}
#box img {
  width: 100%;
}
#box {
  height: 40%;
}
#box img {
  height: 100%;
}


/* 表のレスポンシブル */
table.tbl1 {
border-collapse:separate;
border-spacing:30px;/* 表のすきま */
}
table.tbl1 tr td {
padding:0px;
}


/*
width : auto 
margin-left: auto;
margin-right: auto;
*/

/*フォントの大きさ*/
.text9 { font-size:100%; }

.text10 { font-size:77%; }
.text11 { font-size:85%; }
.text12 { font-size:93%; }

.text13 { font-size:120%; }/* 効いてる */

.text14 { font-size:108%; }
.text15 { font-size:116%; }
.text16 { font-size:123.1%; }
.text17 { font-size:131%; }
.text18 { font-size:138.5%; }
.text19 { font-size:146.5%; }

.text20 { font-size:140%; }/*  効いてる */

.text21 { font-size:161.6%; }
.text22 { font-size:167%; }

.text23 { font-size:150%; }/*  効いてる */

.text24 { font-size:182%; }
.text25 { font-size:189%; }
.text26 { font-size:197%; }

.text27 { font-size:350%; }/*  効いてる */
.text28 { font-size:457%; }/*  効いてる */

.text29 { font-size:174%; }
.text30 { font-size:153.9%; }

#branding { /* ヘッダーのデザインを指定するidです */
    background: #cccccc;
    margin: 0 -500%; /* ネガティブマージンを追記 */
    padding: 0 500%; /* マージンで横へはみ出した部分を相殺 */
}




/*背景の範囲 */

/*
div.sample00 {
      margin : px ;
      padding :　px ;
      border: 
      background-color :#ffffff;
      background-position:top　fixed;
      background-repeat:no-repeat
      background-position: center;
      background-image:url("images/a11.jpg");
      font-size: px;
      width: px;
      height: 60px;
      margin: 0 auto;
      -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;
      position: relative;
 }
*/

div.sample7 {
      margin : px ;
      padding : 10px ;
      background-color :#ffffff;
      background-position:top　fixed;
      background-repeat:no-repeat
      background-position: center;
      background-image:url("images/a9.jpg"); 
      font-size: px;
      width: %;/*  背景画像フレキシブルにする場合指定しないこと */
      height: px;/*  背景画像フレキシブルにする場合指定しないこと */
      margin: 0 auto;
      -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;
      position: relative;
      opacity: 0.9 ;/* 1にちかずくほど不透明  */
 }


div.sample8 {
      margin : 0px ;
      padding : 0px ;
      background-color :#ffffff;
      background-position:top　fixed;
      background-repeat:no-repeat
      background-position: center;
      background-image:url("images/a8.jpg"); 
      font-size: px;
      width: ;/* 100% */
      height: ;/* 130px*/
      margin: 0 auto;
      -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;
      position: relative;
      opacity: 1 ;/* 1にちかずくほど不透明  */
 }


div.sample16 {
      margin : 0px ;
      padding : 0px ;
      border: 
      background-position:top　fixed;
      background-repeat:no-repeat
      background-position: center;
      font-size: px;
      width: 90%  ;/* 960 */
      height: px;
      position: relative; /* absolute */
      top: 0px;
      left: 0px;
      margin: 0 auto;
      opacity: 0.9 ;/* 1にちかずくほど不透明  */
      max-width:765px;
 }



div.sample017 {
      margin : 0px ;
      padding : 0px ;
      border: 
      background-color :#ffffff;
      background-position:top　fixed;
      background-repeat:no-repeat
      background-position: center;
      /*background-image:url("images/c10.jpg"); */
      font-size: px;
      width: px;
      height: px;/* 970  */
      margin: 0 auto;
      -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;
      position: relative;
      opacity: 1 ;/* 1にちかずくほど不透明  */
 }

div.sample17 {
      margin : 0px ;
      padding : 0px ;
      border: 
      background-position:top　fixed;
      background-repeat:no-repeat
      background-position: center;
      font-size: px;
      width: 72%  ;/* 960 */
      height: px;
      position: relative; /* absolute */
      top: 0px;
      left: 0px;
      margin: 0 auto;
      opacity: 0.9 ;/* 1にちかずくほど不透明  */
 }

























/*画像と画像の切れ目用　div.sample10　*/

div.sample10 {
      margin : 0px ;
      padding : 0px ;
      border: 10px solid red;
      background-color :#ffffff;
      background-position:top　fixed;
      background-repeat:no-repeat
      background-position: center;
      background-image:url("");
      font-size: px;
      width: 1300px;
      height: 300px;
      margin: 0 auto;
      -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;
      position: relative;
      opacity: 1 ;/* 1にちかずくほど不透明  */
 }



/*背景  */


body {
background-image: url("");
background-position:top　fixed;
background-repeat:no-repeat
background-position: center;
background-color: #ffffff;
width: px; /* これがないと文字が動いてしまう揃い */
font-size: px;
margin-right: auto;/* 中央に揃える*/
margin-left : auto;
 -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;
/*文字間の幅 */
line-height:1.4;

/*フォントの大きさ統一 これがきいてる*/
 font:16px “ヒラギノ角ゴ Pro W3”,"Hiragino Kaku Gothic Pro",arial,helvetica,clean,sans-serif;
*font-size:small;
*font:x-small;




/*"Hiragino Kaku Gothic Pro"*/





/* 各ブラウザにてフォントの大きさをそ揃える*/
body {
    font: 13px/1.231 "ＭＳ Ｐゴシック",arial,helvetica,clean,sans-serif;
}
select, input, button, textarea {
    font: 99% "ＭＳ Ｐゴシック",arial,helvetica,clean,sans-serif;
}
table {
    font-size: inherit;
}
pre, code, kbd, samp, tt {
    font-family: monospace;
    line-height: 100%;
}

/* 各ブラウザにてフォントの大きさをそ揃える　2　*/

body, div, dl, dt, dd, ul, ol, li, h1, h2, h2, h3, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td  {  
2.    margin: 0;  padding: 0;  
3.}  

h1, h2, h2, h3, h5, h6  {  
2.    font-size: 100%;  
3.}  

body {  
2.    font-size: 75%;  
3.}  
4.html>/**/body {  
5.    font-size: 12px;  
6.}  


html {  
2.    overflow-y: scroll;  
3.}  
4.table   {  
5.    border-collapse: collapse;  border-spacing: 0;  
6.}  
7.img {  
8.    border: 0;  
9.}  
10.li  {  
11.    list-style-type: none;  
12.}  




/*
text-align: center;
*/


 #background {
 width:100%;
 position:absolute;
 top:0;
 left:0;
 }
 #page {
 width:100%;
 position:absolute;
 top:0;
 left:0;
 z-index:1;
 }
 #honbun {
 width:700px;
 text-align:left;
 margin:0 auto;
 padding:0;
 }

/*自動で改行 */

div.honbun2{
 background:#cda;
 color:#333;
 width:350px; /*※幅を指定する必要あり */
 word-wrap:break-word;
}



div.sample2 {width:350px; background-color:#99cc00; word-wrap: break-word;}


/* 文字の中央揃い */
#index1{
color:;
text-align: ;
font-size: px;
}

div.h{
text-align: center;
margin: 0 auto; 
}

/* 文字が重ならないようにする */

h1 a:link,h1 a:visited,h1 a:active{
/*font-size :24px;*/
color:#555555;
text-decoration:none;
font-weight:normal;
line-height:1.4em;
padding : 0px 0px 0px 0px;
}

/*
p.sample3{ 
color: 
font-size: 25px;
text-decoration:none;
font-weight:normal;
line-height: 1.5;}
padding : 0px 0px 0px 0px;
}  
*/

/*
p{ 
color: 
font-size: 25px;
text-decoration:none;
font-weight:normal;
line-height: 1.0;}
padding : 0px 0px 0px 0px;
}  
*/

/* 文字の色 */
p.example0 { color: #ffffff; font-size: px;}  /* 文字の色 白  */
p.example1 { color: #ff0000; font-size: px;}  /* 文字の色 赤  */
p.example2 { color: #008000; font-size: px;}  /* 文字の色 緑　*/
p.example3 { color: ##0000ff; font-size: px;}  /* 文字の色 青　*/
p.example4 { color: #ffff00; font-size: px;}  /* 文字の色 黄　*/
p.example4 { color: #000000; font-size: px;}  /* 文字の色 黒　*/





/* カラム */
 

#global{
width: 960px;
    margin: 0 auto;
	}

#greetings{
     width: 960px;
     float: left;
     margin-right: 30px;
}
#wrapper{
    width: px;
    /* margin: 0 auto; */
	}

/* フッター */
footer:before{
 content:"";
 display: table;
 clear:both;
 text-align:center;
 font-size:13px;
 color: #999999;
 margin-top:20px;
 margin-right:10px ;
 margin-left:10px;
 border-top:1px dotted #ccc;
 }


footer a{
	color: #ffffff;
	}
	
footer a:hover{
color:#b7b7b6;
}


/*ボタン*/

div.b1 { text-align : center ; }

#nav1:hover{
	filter:alpha(opacity=60);
	opacity:0.6;
	}




/*ボタンが小さくなる*/

p.resizeimage5 img { width: 100%; }
		p.resizeimage5 img.miniimage { display: none; } /* Media Queriesが使えないブラウザのため */

		/* ▼表示領域が400px以上の場合 */
		@media screen and (min-width: 400px) {
		   p.resizeimage5 img.miniimage { display: none; }   /* miniを非表示 */
		   p.resizeimage5 img.bigimage  { display: block; }  /* bigを表示 */
		}
		/* ▼表示領域が400px未満の場合 */
		@media screen and (max-width: 399px) {
		   p.resizeimage5 img.miniimage { display: block; }  /* miniを表示 */
		   p.resizeimage5 img.bigimage  { display: none; }   /* bigを非表示 */
		}

/* 　伸びるレスポンシブル背景 1*/

#mybox {
   padding-bottom:55px;
   width:1164px;/* 585 */
   background:url(images/a10.jpg) bottom no-repeat;
   /* ↑三分割した一番下の画像 */
 }
 #mybox .header {
   height:55px;
   text-align:center;
   line-height:55px;
   background:url(images/a10.jpg) no-repeat;
   /* ↑三分割した一番上の画像 */
 }
 #mybox .body {
   padding:0 20px;
   background:url(images/a10.jpg) repeat-y;
   /* ↑三分割した真ん中の画像。これにより本文の背景が繰り返される background-image:url(images/a10.jpg);*/
 }

/* 　伸びるレスポンシブル背景 2*/

#form-top {
    background-image: url('images/a10.jpg');
    max-width: 100%;
    width: 320px;
    height: 75px;
    background-size: 100% 75px;
}

#form-middle {
    background: url('images/a10.jpg') repeat-y;
    max-width: 100%;
    height: auto;
    width: 320px;
    background-size: 100% 100%;
}

#form-bottom {
    background-image: url('images/a10.jpg');
    max-width: 100%;
    width: 320px;
    height: 16px;
    background-size: 100% 16px;
}

body , html {
    height: 100%;
}
 
#container {
    width: 100%;
    position: relative;
    height: auto !important;
    height: 100%;
    min-height: 100%;
}
 
#contents {
    padding-bottom: 100px;
}
 
#footer {
    position: fixed;
    bottom: 0;
    width: 100%;
    height: 100px;
}

.komidashi { display:block; margin: 50px 0!important; }


/**************************************
 * LP調整用 追加CSS（style3.css の末尾に追記）
 **************************************/

/**************************************
 * LP調整用 追加CSS（style3.css の末尾に追記）
 **************************************/

/* ▼ 最下部の sample8（会社情報エリア）の調整 */
.sample8{
    display: block;
    width: 100%;
    background-color: #000;          /* 背景を黒に */
    color: #fff;                     /* 文字は白に */
    padding: 20px 0;                 /* 上下に余白をつけて高さを出す */
    box-sizing: border-box;
    background-image: url("images/a8.jpg");  /* 背景画像も使う場合はこのまま */
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
}

.sample8 a{
    color: #fff;
    text-decoration: none;
}
.sample8 a:hover{
    text-decoration: underline;
}

/* ▼ 固定フッターCTA（.footer_area）の位置と幅を調整（スマホ専用） */
@media screen and (max-width:640px){
    .footer_area{
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        width: 100%;
        background-color: rgba(0,0,0,0.6);
        display: block;
        margin: 0;
        padding: 0;
        z-index: 10000;
    }

    .footer_area_inner{
        width: 100%;
        margin: 0 auto;
        padding: 0;
        text-align: center;
    }

    .footer_area_inner .inquiry_btn{
        display: block;
        width: 100%;
        margin: 0;
        padding: 15px 0;
    }

    /* ▼ ページ本体の下に余白を作って、固定ボタンと重ならないようにする */
    #contents{
        padding-bottom: 90px;   /* 固定ボタンの高さ＋少し余裕 */
    }
}

/* ▼ PC幅では固定CTAを非表示のままにする（念のため再指定） */
@media screen and (min-width:641px){
    .footer_area{
        display: none;
    }
}

/* 灰色の帯 */
p.resizeimage img { 
margin: 0px auto 20px auto;
width: 100%;
display: block;
}


/**************************************
 * スマホ表示用 レイアウト調整
 **************************************/
@media screen and (max-width:640px){

  /* ページ全体を画面幅いっぱいにする */
  html, body{
    width: 100%;
    margin: 0;
    padding: 0;
  }

  /* メインのラッパーを 960px 固定ではなく可変に */
  #global{
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
  }

  /* 本文ブロックも可変＋左右に少し余白 */
  #honbun{
    width: auto;
    max-width: 100%;
    padding: 0 10px;
    box-sizing: border-box;
  }
}