/* ========モバイルフレンドリー対応　横幅480px以下の場合のみ適用======== */


@media (max-width: 480px) {

  /* サイドバーを消す*/
  #sub{
    display: none;
  }

  img{
    max-width: 99%;
    height: auto;
  }

  iframe{
    max-width: 99%;
    height: 250px;
  }


/* --- コンテナ --- */
#container {
width: 100%; /* ページの幅 */
}

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

div#headWrap {
   width:100%;
}

div#header {
   width:100%;
   height:80px;
   background:#000
}

div#header h1 {
   margin:0;
   padding:10px 0px 0px 20px;
   color:#fff;
   line-height:0px;
}

div#header h1 a {
   color:#9B0000;
}

div#header h1 a:hover {
   color:#D30000;
}


/* --- メインカラム(スマホでは１段) --- */

#content {
			width: 100%; /* メインカラムの幅 */
			padding:0px 0px 0px 0px;
			float: none;
}




/* --- コンテンツエリア(スマホでは１段) --- */

div#cont {
   width:100%;
   padding:8px 0px 0px 2px;
			float: none;
}

div#cont a {
   color:#0000FF;
}

div#cont a:hover {
   color:#9B0000;
}

div#cont p{
   margin:0 0 1em 0;
   font-size:0.88em;
	  line-height : 150%;
   padding:10px 20px 0px 6px;
}


/* --- ２段組コンテンツ(スマホでは１段) --- */

div#main {
   width:100%;
   padding:0px 0px 0px 0px;
			float: none;
}

div#main a {
   color:#0000FF;
}

div#main a:hover {
			color:#FF0000;
}

div#main h2 {
   padding:2px 0px 0px 35px;
   font-size:0.78em;
   font-weight:bold;
			color:#000;
	  line-height :28px;
   background:url(images/bg_h2.gif) 0 0 no-repeat;
}


div#main h3 {
   margin:0 0 1em 0;
   padding:12px 0px 0px 6px;
   font-size:0.88em;
   font-weight:bold;
			color:#6F0000;
	  line-height : 170%;
   background:url(images/bg_dotline.gif) 0 100% repeat-x;
}


div#main p{
   margin:0 0 0em 0;
   padding:8px 0px 0px 15px;
   font-size:0.88em;
	  line-height : 140%;
}


div#main ul{
   font-size:0.88em;
   padding:0px;
	  line-height : 150%;
}


/* --- 会社概要エリア --- */

#update {
width: 95%; /* 新着情報エリアの幅 */
background-color: #fff;
font-size: 8px;
padding: 10px;
}

/* --- 情報リスト --- */
#update dl {
width: 100%; /* 情報リストの幅 */
margin: 0;
border-top: 1px #c0c0c0 dotted; /* 情報リストの上境界線 */
}

/* --- 情報見出し --- */
#update dt {
width: 31%; /* 情報見出しの幅 */
float: left;
padding: 7px 0 6px 3px; /* 情報見出しのパディング（上右下左） */
line-height: 120%;
}

/* --- 本文エリア --- */
#update dd {
margin: 0;
padding: 7px 3px 6px 6.6em; /* 本文エリアのパディング（上右下左） */
border-bottom: 1px #c0c0c0 dotted; /* 本文エリア下境界線 */
line-height: 120%;
}

/* --- clearfix --- */
.clearFix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.clearFix {
min-height: 1px;
}



/* --- 地図情報エリア --- */

#update-m {
width: 95%; /* 新着情報エリアの幅 */
background-color: #fff;
font-size: 8px;
padding: 10px;
}

/* --- 沿革リスト --- */
#update-m dl {
width: 100%; /* 情報リストの幅 */
margin: 0;
border-top: 1px #c0c0c0 dotted; /* 情報リストの上境界線 */
}

/* --- 日付エリア --- */
#update-m dt {
width: 20%; /* 情報見出しの幅 */
float: left;
padding: 7px 0 6px 3px; /* 情報見出しのパディング（上右下左） */
line-height: 120%;
}

/* --- 本文エリア --- */
#update-m dd {
margin: 0;
padding: 7px 3px 6px 6.6em; /* 本文エリアのパディング（上右下左） */
border-bottom: 1px #c0c0c0 dotted; /* 本文エリア下境界線 */
line-height: 120%;
}

/* --- clearfix --- */
.clearFix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.clearFix {
min-height: 1px;
}




/* --- メールフォームエリア --- */


form.contact {
width: 95%; /* フォームエリアの幅 */
font-size: 8px;
padding:0px 0px 0px 10px;
}
/* --- フォームエリア内の段落 --- */
form.contact p {
line-height: 110%;
}
/* --- 段落内の「必須」画像 --- */
form.contact p.attention img {
vertical-align: middle;
}

/* --- テーブル --- */
form.contact table {
width: 100%; /* テーブルの幅 */
background-color: #f9f9f9; /* テーブルの背景色 */
border: 1px #c0c0c0 solid; /* テーブルの境界線 */
}
/* --- データセル（th） --- */
form.contact th {
width: 30%; /* thの幅 */
}
/* --- データセル（td） --- */
form.contact td {
padding: 10px 5px 7px; /* データセルのパディング（上、左右、下） */
background-color: #ffffff; /* データセルの背景色 */
border-bottom: 1px #c0c0c0 dotted; /* データセルの下境界線 */
}
/* --- データセル内の補足テキスト --- */
form.contact td span.supplement {
color: #808080;
}

form.contact td span.supplement2 {
color: #FF0000;
}

/* --- 必須項目セル --- */
form.contact td.required {
width: 10%; /* 必須項目セルの幅 */
padding: 10px 3px; /* 必須項目セルのパディング（上下、左右） */
background-color: #c4e6fa; /* 必須項目セルの背景色 */
text-align: center;
}
/* --- 任意項目セル --- */
form.contact td.arbitrary {
background-color: #e0f1fc; /* 任意項目セルの背景色 */
}

/* --- フォーム部品 --- */
form.contact input,
form.contact select,
form.contact textarea {
margin-bottom: 2px; /* フォーム部品の下マージン */
}
/* --- フォーム部品のサイズ --- */
/* --- （長めのテキスト入力欄） --- */
#company, #section, #name, #name1,
#email,#address {
width: 90%; /* フォーム部品の幅 */
}
/* --- （中めのテキスト入力欄） --- */
#tel,#fax1 {
width: 60%; /* フォーム部品の幅 */
}
/* --- （短めのテキスト入力欄） --- */
#zip1,#Contract, {
width: 40%; /* フォーム部品の幅 */
}
/* --- （複数行のテキスト入力欄） --- */
#message {
width: 90%; /* フォーム部品の幅 */
height: 10em; /* フォーム部品の高さ */
}

/* --- ボタン --- */
form.contact p.button {
margin: 20px 0 0; /* ボタンのマージン（上、左右、下） */
text-align: center;
}



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

div#footer {
			clear: right; /* フロートのクリア */
			width: 100%;
			background-color: #fff; /* フッタの背景色 */
   border-top:1px solid #4D0000;
   border-bottom:5px solid #4D0000;
}

address{
   padding:30px 0px 5px 0px;
   font-size:0.75em;
   color:#333;
   text-align:center;
}

div#footMenu {
   width:100%;
   margin:0 auto;
}

div#footMenu ul {
   margin:0;
   padding:12px 8px 0 10px;
   text-align:right;
}

div#footMenu li {
   display:inline;
   margin:0 0 0 10px;
   font-size:0.75em;
   list-style:none;
}

div#footMenu li a {
   padding-left:10px;
   background: url(images/bg_footmenu.gif) 0 50% no-repeat;
}



/* --- ２行記載エリア --- */

#update2 {
width: 98%; /* 新着情報エリアの幅 */
font-size: 8.5px;
padding: 9px 20px 7px;
padding-bottom: 3px; /* ボックスの下パディング */
margin-right: 0px; /* メインカラムの右マージン（サイドバーの幅以上） */
}

/* --- 見出し --- */
#update2 h3 {
margin: 0 0 5px; /* 見出しのマージン（上、左右、下） */
font-size: 100%;
}

/* --- 沿革リスト --- */
#update2 dl {
width: 100%; /* 新着リストの幅 */
height: 100%; /* 新着リストの高さ */
margin: 0;
padding: 0px; /* ボックス内パディング */
background-color: #fff; /* 新着リストの背景色 */
border-top: 0px #000080 dotted; /* 新着リストの上境界線 */
border-bottom: 0px #000080 dotted; /* 新着リストの下境界線 */
}

/* --- 日付エリア --- */
#update2 dt {
width: 50%; /* 日付エリアの幅 */
float: left;
padding: 3px 0px 3px 3px; /* 日付エリアのパディング（上右下左） */
line-height: 120%;
}

/* --- 本文エリア --- */
#update2 dd {
margin: 0;
padding: 3px 3px 3px 9.6em; /* 本文エリアのパディング（上右下左） */
border-bottom: 0px #000080 dotted; /* 本文エリアの下境界線 */
line-height: 120%;
}

/* --- clearfix --- */
.clearFix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.clearFix {
min-height: 1px;
}


/* --- ２行記載�Aエリア --- */

#update3 {
width: 98%; /* 新着情報エリアの幅 */
font-size: 8.5px;
padding: 9px 20px 7px;
padding-bottom: 3px; /* ボックスの下パディング */
margin-right: 0px; /* メインカラムの右マージン（サイドバーの幅以上） */
}

/* --- 見出し --- */
#update3 h3 {
margin: 0 0 5px; /* 見出しのマージン（上、左右、下） */
font-size: 100%;
}

/* --- 沿革リスト --- */
#update3 dl {
width: 100%; /* 新着リストの幅 */
height: 100%; /* 新着リストの高さ */
margin: 0;
padding: 0px; /* ボックス内パディング */
background-color: #fff; /* 新着リストの背景色 */
border-top: 0px #000080 dotted; /* 新着リストの上境界線 */
border-bottom: 0px #000080 dotted; /* 新着リストの下境界線 */
}

/* --- 日付エリア --- */
#update3 dt {
width: 50%; /* 日付エリアの幅 */
float: left;
padding: 3px 0px 3px 3px; /* 日付エリアのパディング（上右下左） */
line-height: 120%;
}

/* --- 本文エリア --- */
#update3 dd {
margin: 0;
padding: 3px 3px 3px 9.6em; /* 本文エリアのパディング（上右下左） */
border-bottom: 0px #000080 dotted; /* 本文エリアの下境界線 */
line-height: 120%;
}

/* --- clearfix --- */
.clearFix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.clearFix {
min-height: 1px;
}



/* ========新着情報データ======== */

/* --- 新着情報エリア --- */

div.update_new {
width: 98%; /* 新着情報エリアの幅 */
font-size: 11px;
padding-top: 6px; /* 上のパディング */
padding-bottom: 12px; /* 下パディング */
}

/* --- 新着リスト --- */
div.update_new dl {
width: 98%; /* 新着リストの幅 */
height: 100px; /* 新着リストの高さ */
overflow: auto;
margin: 0;
background-color: #FFFFF4; /* 新着リストの背景色 */
border-top: 1px #00557D dotted; /* 新着リストの上境界線 */
border-bottom: 1px #00557D dotted; /* 新着リストの下境界線 */
}

/* --- 日付エリア --- */
div.update_new dt {
width: 6.5em; /* 日付エリアの幅 */
float: left;
padding: 7px 0 6px 6px; /* 日付エリアのパディング（上右下左） */
line-height: 130%;
}

/* --- 本文エリア --- */
div.update_new dd {
margin: 0;
padding: 0px 6px 12px 8.0em; /* 本文エリアのパディング（上右下左） */
border-bottom: 1px #00557D dotted; /* 本文エリアの下境界線 */
line-height: 130%;
}

/* --- clearfix --- */
.clearFix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.clearFix {
min-height: 1px;
}




/* ---ＣＳＳの要素 --- */


.float-left  { float: none; }
.float-center{ float: none; }
.float-right { float: none; }

.strong{ font-weight:bold; }
.white  { color : #ffffff ; }
.black  { color : #000000 ; }
.blue   { color : #000094 ; }
.green  { color : #008000 ; }
.red    { color : #FF0F0F; }	 


.padding-6px{ padding:6px; }
.padding6   { padding:6px; }
.padding12  { padding:12px; }
.padding16  { padding:16px; }
.padding20  { padding:20px; }
.padding30  { padding:30px; }
.padding-b6 { padding-bottom:6px; }
.padding-b12{ padding-bottom:12px; }
.padding-b20{ padding-bottom:20px; }
.padding-b30{ padding-bottom:30px; }
.padding-t6 { padding-top:6px; }
.padding-t12{ padding-top:12px; }
.padding-t20{ padding-top:20px; }
.padding-t30{ padding-top:30px; }



}