@charset "utf-8";


/*全端末（PC・タブレット・スマホ）共通設定

************************************************************************************************/


/*全体の設定

****************************************************************************/
html {
	-webkit-text-size-adjust: 100%;/*iOSのsafariで文字サイズが変わるのを防ぐ*/
}
body {
	margin: 0px;
	padding: 0px;
	color: #000c21;	/*全体の文字色*/
	font-family: "Yu Gothic" ,"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;	/*フォント種類*/
	font-size: 16px;	/*文字サイズ*/
	font-weight:500 ;
	line-height: 2;		/*行間*/
	background: #fff;	/*背景色*/
}
h1,h2,h3,h4,h5,p,ul,ol,li,dl,dt,dd,form,figure,form,select,input,textarea {margin: 0px;padding: 0px;font-size: 100%;font-weight: 500;}
ul {list-style-type: none;}
ul.disc{list-style:disc ;padding-left:1.5em ;/*overflow: hidden;*/}
ul.decimal{list-style:decimal ;padding-left:1.5em ;/*overflow: hidden;*/}
.ta1 ul.disc,.ta1 ul.decimal,.ta2 ul.disc,.ta2 ul.decimal{padding-left: 0 ;margin-left:0 ;}
img {border: none;max-width: 100%;height: auto;vertical-align: middle;}
table {border-collapse:collapse;font-size: 100%;border-spacing: 0;}
video,audio {max-width: 100%;}

/*リンク（全般）設定

---------------------------------------------------------------------------*/
a {
	color: #FF9D00;		/*リンクテキストの色*/
	transition: 0.5s;	/*マウスオン時の移り変わるまでの時間設定。0.5秒。*/
}
a:hover {
	text-decoration: none;	/*マウスオン時に下線を消す設定。残したいならこの１行削除。*/
}
/*マウスオン時の画像*/
a figure{
	/*background:#5A539B ;*/
	padding:0 ;
	margin:0 ;
}
a img{
	transition: 0.5s;	/*マウスオン時の移り変わるまでの時間設定。0.5秒。*/
}
a:hover img {
	transition: 0.5s;	/*マウスオン時の移り変わるまでの時間設定。0.5秒。*/
	opacity: 0.7;	/*80%色がついた状態*/
}
a img.a_big{
	-moz-transform: scale(1.0,1.0);
	-webkit-transform: scale(1.0,1.0);
	-o-transform: scale(1.0,1.0);
	-ms-transform: scale(1.0,1.0);
	transition: 0.5s;	/*マウスオン時の移り変わるまでの時間設定。0.5秒。*/
}
a:hover img.a_big {
	-moz-transform: scale(1.1,1.1);
	-webkit-transform: scale(1.1,1.1);
	-o-transform: scale(1.1,1.1);
	-ms-transform: scale(1.1,1.1);
	transition: 0.5s;	/*マウスオン時の移り変わるまでの時間設定。0.5秒。*/
}

/*inner共通

---------------------------------------------------------------------------*/
.inner {
	max-width: 1300px;	/*サイトの最大幅*/
	margin: 0 auto;
}

/*ヘッダー（ロゴが入った最上段のブロック）

****************************************************************************/
/*ヘッダーブロック*/
header {
	position:absolute ;
	top:0 ;
	left:0 ;
	width: 100%;
	height: 90px;		/*高さ*/

}
/********************
ロゴ画像

********************/
/*ロゴ画像を囲むブロック*/
header #logo {
	float: left;		/*左に回り込み*/
	width:250px ;
	height:50px ;	/*heightとpaddingを合わせて高さがヘッダーの高さ90pxになるようにする*/
	padding:20px 3% 20px 6%;	/*transformで曲げる分、左の余白を多くする*/
	margin-left:-4% ;	/*transformで曲げる分、左の余白を左にずらす*/
	transform: skewX(-30deg); /*transformで平行四辺形に曲げる*/
	background:#002665 ;
}
/*ロゴ画像*/
header #logo img{
	margin-top:10px ;
	transform: skewX(30deg); /*上記transformで曲がった分を相殺*/
}

/*メインメニューのブロック
---------------------------------------------------------------------------*/
/*メニューブロック*/
#menubar {
	text-align: center;	/*文字を中央に*/
	position: absolute ;
	right: 2%;		/*ヘッダーブロックに対して右から2%の場所に配置*/
	top: 20px;	/*ヘッダーブロックに対して下から20pxの場所に配置*/
	font-size:18px ;	/*文字サイズを少し大きく*/
}
/*メニュー１個あたりの設定*/
#menubar li {
	float: left;	/*左に回り込み*/
	width: auto;	/*メニュー幅*/
	margin:0 0 0 30px ;
}
#menubar li a {
	text-decoration: none;
	display: block;
	height:30px ;	/*heightとpaddingを合わせて高さがメニューの高さ50pxになるようにする*/
	padding:10px 0 ;
	color:#FFF ;
	font-size:90% ;
	font-weight:bold ;
}
/*マウスオン時と、現在表示中(current)のメニューの設定*/
#menubar li a:hover, #menubar li.current a {
	border-bottom: 2px solid #002665;
	border-bottom: 2px solid #FFF;
	/*color:#002665 ;*/
	opacity:0.7 ;
}
/********************
営業日カレンダー
********************/
#menubar li.menubar_cale a {
	padding:10px 10px 10px 10px;
	border:1px solid #FFF ;
	color:#FFF ;
	font-size:14px ;
}
/*マウスオン時*/
#menubar li.menubar_cale a:hover {
	background:rgba(255, 255, 255, 0.2) ;
	color:#FFF ;	/*打ち消し*/
}
/********************
採用情報
********************/
#menubar li.menubar_recruit {
	margin:0 0 0 10px ;	/*左の余白を詰める*/
}
#menubar li.menubar_recruit a {
	padding:10px 25px 10px 50px;
	border:1px solid #002665 ;
	background:#002665 ;
	background:#002665 url(../images/icon_arrow_next.png)no-repeat 20px center / 20px;
	color:#FFF ;
}
/*マウスオン時*/
#menubar li.menubar_recruit a:hover {
	border:1px solid #003998 ;
	background:#003998 ;
	background:#003998 url(../images/icon_arrow_next.png)no-repeat 25px center / 20px;
	color:#FFF ;
}
/********************
電話番号
********************/
#menubar li.menubar_tel{
	line-height:25px ;	/*電話番号と受付時間を合わせた高さ25px + 25px = メニューの高さ50px*/
	margin:0 0 0 10px ;	/*左の余白を詰める*/
	/*background:#000c21 ;*/
}
/*電話番号（基本設定）*/
#menubar li.menubar_tel .tel_no{
	color:#FFF ;	/*文字色*/
	background: url(../images/icon_tel_wh.png)no-repeat 0 7px / 20px;
}
/*iOSの自動設定を解除*/
#menubar li.menubar_tel .tel_no a{
	color:#FFF ;	/*文字色：紺*/
	text-decoration:none;
}
/*受付時間の設定*/
#menubar li.menubar_tel .tel_time{
	color:#FFF ;
	font-size:16px ;	/*文字サイズを全体を同じ大きさに戻す*/
}
/********************
その他

********************/
/*スマホ用メニューを表示させない*/
#menubar-s {display: none;}
/*３本バーアイコンを表示させない*/
#menubar_hdr {display: none;}

/*トップページのメイン画像

---------------------------------------------------------------------------*/
#mainimg {position:relative ;width:100% ;max-width:100% ;}
/********************
リードコピー
********************/
/*リードコピー共通*/
.leadcopy{
	/*◎未使用
	color:#FFF ;
	font-family: 'Noto Serif JP', serif;
	font-weight:700 ;*/
}
.leadcopy h4{
	/*◎未使用
	font-size:400% ;
	line-height:1.5 ;*/
}
/*メイン画像内（601px以上端末）*/
#mainimg .leadcopy{
	/*◎未使用
	position:absolute ;
	left:10% ;
	bottom:40% ;*/
}
/********************
採用情報ボックス
********************/
/*ボックス設定*/
#mainimg .recruit_box {
	position:absolute ;
	right:10% ;
	bottom:10% ;
	width:400px ;
	padding:15px 15px ;
	background:#004ccb ;
	background:rgba(0, 76, 203, 0.7);
	color:#FFF ;
	text-align:center ;
}
/*白いライン*/
#mainimg .recruit_box div {
	width:calc(100% - 30px);
	height:calc(100% - 30px);
	padding:15px 15px ;
	border:1px solid #FFF ;
}
/*従業員募集中*/
#mainimg .recruit_box h4 {
	font-size:170% ;
	font-weight:bold ;
}
/*採用情報はこちら*/
#mainimg .recruit_box p {
	background: url(../images/icon_arrow_next.png)no-repeat right 50px center / 20px ;
	font-size:110% ;
	font-weight:bold ;
	transition: 0.5s;	/*マウスオン時の移り変わるまでの時間設定。0.5秒。*/
}
#mainimg a:hover .recruit_box p {
	background: url(../images/icon_arrow_next.png)no-repeat right 40px center / 20px ;
}

/*フッター設定

****************************************************************************/
footer {
	clear: both;
	border-top:1px solid #d4d4d4 ;
	background:#001332 ;
	color:#FFF ;
	font-size: 14px;	/*文字サイズを少し小さく*/
}
footer a {text-decoration: none; }

/*フッターメニュー
---------------------------------------------------------------------------*/
/*ボックス全体*/
#footermenu {
	overflow: hidden;
	max-width:1300px ;
	/*border-bottom:1px solid #f6f6f6 ;*/
	margin:0 auto ;
	padding: 15px 10% 0;
}
/*１列分の設定*/
#footermenu ul {
	text-align:center ;
}
/*メニュー１個あたりの設定*/
#footermenu ul li {
	display:inline-block ;
	padding: 0 1.5em 15px ;
	font-weight:bold ;
}
#footermenu ul li a {
	color:#FFF ;
}
#footermenu ul li a:hover {
	color:#004ccb ;
	text-decoration:underline ;
}

/*コピーライト

---------------------------------------------------------------------------*/
#copyright {
	clear: both;
	text-align: right;
	max-width:1300px ;
	margin:0 auto ;
	padding: 30px 10% 45px;
	background:#000c21 ;
	color:#FFF ;
}
#copyright a{
	color:#E3F3FF ;
}
/********************
ロゴと住所の設定

********************/
#copyright #footermenu1{
	clear:both ;
	text-align:left ;
}
#copyright #footermenu1 div{
	float:left ;
	margin:0 30px 1em 0;
	padding-top:5px ;
}
#copyright #footermenu1 img{
	width:250px ;
}
/********************
電話番号・採用情報ボタン
********************/
/*共通設定*/
#copyright #footermenu1 p{
	float:left ;
	padding:0 ;
}
/*電話番号*/
#copyright #footermenu1 p.footer_tel{
	margin-right:45px ;
	text-align:center ;
}
#copyright .tel_no{
	line-height:1.5;
	background: url(../images/icon_tel_wh.png)no-repeat 0 7px / 20px;
	color:#FFF ;
}
/*iOSの自動設定を解除*/
#copyright .tel_no a{
	color:#FFF ;	/*文字色：紺*/
	text-decoration:none;
}
/*採用情報ボタン*/
#copyright p.link{
  width:200px ;
  margin:5px auto ;
}
#copyright p.link a{
  width:200px ;
  margin:0 auto ;
  border:1px solid #FFF ;
  background:transparent ;
}
#copyright p.link a:hover {
  background: #004ccb;
}

/*各コンテンツブロックの背景設定

---------------------------------------------------------------------------*/
/*背景：グレイ*/
.bg_gray {
	background: #f6f6f6 ;
}
/*背景：少し暗いグレイ（トップページ用）*/
.bg_gray_dark {
	background: #e5e5e6 ;
}
/*背景：採用情報*/
.bg_recruit{
	/*margin:0 0px 0px;*/
	/*background: url(../images/bg_recruit.jpg) no-repeat center center fixed;	/*強み*/
	background: url(../images/bg_recruit.jpg) no-repeat center center fixed ;	/*強み*/
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	color:#FFF ;
	/*padding-left:30px ;
	padding-right:30px ;*/
}






/*背景：うす紫*/
.bg_purple {
	background: #f4f3f9 ;
}
/*背景：うす紫ヘキサゴン画像*/
.bg_error {
	background: #f4f3f9 ;
	background:#f4f3f9 url(../images/bg_polygon.png) left bottom / 300px;
	height:100hv ;
}
/*コンテンツ（メニューの下にある白い背景色のブロック）

****************************************************************************/
.contents{
	clear:both ;
	padding: 90px 10% 90px 10%;	/*上、右、下、左への余白*/
	margin:0 ;
}
/*上寄せコンテンツ*/
.contents_t{
	padding: 0 10% 90px 10%;	/*上、右、下、左への余白*/
}
/*下寄せコンテンツ*/
.contents_b{
	padding: 90px 10% 0 10%;	/*上、右、下、左への余白*/
}
/*右寄せコンテンツ*/
.contents_r{
	padding: 90px 0 90px 10%;	/*上、右、下、左への余白*/
}
/*左寄せコンテンツ*/
.contents_l{
	padding: 90px 10% 90px 0;	/*上、右、下、左への余白*/
}
/*余白なしコンテンツ*/
.contents_0{
	padding: 0 0 0 0 !important;	/*上、右、下、左への余白*/
}
/********************
h2タグ
********************/
#contents h2 {
  position: relative;
  display: inline-block;
  padding: 0 45px;
  padding: 0 100px;
  /*border:1px solid #000 ;*/


  	clear: both;
	margin-bottom: 100px;	/*下に空けるボックスの外側への余白*/
	margin-bottom: 30px;	/*下に空けるボックスの外側への余白*/
	font-size: 200%;		/*文字サイズ*/
	font-weight:bold ;
	text-align: center;		/*文字を中央に*/
	line-height: 1.5;		/*行間を基準より少し狭くする*/
	/*line-height: 1.0;		/*行間を基準より少し狭くする*/
	/*color: #021b18;	/*全体の文字色*/
}
#contents h2:before, h2:after {
  content: '';
  position: absolute;
  top: 50%;
  display: inline-block;
  width: 44px;
  width: 60px;
  height: 3px;
  background-color: #003998;
  -webkit-transform: rotate(-60deg);
  transform: rotate(-60deg);
}
#contents h2:before {
  left:0;
}
#contents h2:after {
  right: 0;
}
/*背景が暗い場合の設定*/
#contents h2.h2_wh {
	color:#FFF ;
}
#contents h2.h2_wh:before, h2.h2_wh:after {
	background-color: #004ccb;
}
/*英字の飾り文字*/
#contents h2 span{
	opacity:0.5 ;
	/*font-family: 'Roboto', sans-serif;*/
	font-family: 'Source Sans Pro', sans-serif;
	font-weight:700 ;
	font-size:70% ;
	letter-spacing:0.2em ;

}
/*ページタイトル用のh2タグ*/
#contents .h2_title_box {
	display: block;
	padding: 70px 10% 100px ;	/*上下、左右へのボックス内の余白*/
	padding: 180px 10% 90px ;	/*上下、左右へのボックス内の余白*/
	background: url(../images/bg_h2_title.jpg);
	background-size:cover;
}
#contents h2.h2_title {
	margin-bottom:0 ;
	color:#FFF ;
	text-align:right ;
}
#contents h2.h2_title:before, h2.h2_title:after {
	background-color: #004ccb;
}
/********************
h3タグ
********************/
#contents h3 {
	/*clear: both;
	position: relative;
	border-left:5px solid #002665 ;
	border-bottom:1px solid #002665 ;
	padding: 10px 20px 10px 0;	/*上下、左右へのボックス内の余白*/
	/*padding: 10px 15px 10px 15px;	/*上下、左右へのボックス内の余白*/
	/*margin-bottom: 15px;	/*下に空けるボックスの外側への余白*/
	/*margin-bottom: 30px;	/*下に空けるボックスの外側への余白*/
	/*background:#edf4ff;
	background:#ededee ;
	color: #333;	/*全体の文字色*/
	/*font-size: 170%;		/*文字サイズ*/
	/*font-weight:bold ;*/


}
#contents h3 {
	clear: both;

	padding: 10px 0;	/*上下、左右へのボックス内の余白*/
	margin-bottom: 30px;	/*下に空けるボックスの外側への余白*/
	margin-bottom: 60px;	/*下に空けるボックスの外側への余白*/
	border-bottom: solid 3px #036CBE;
	border-bottom: solid 3px transparent;
	position: relative;
	/*color: #021b18;	/*全体の文字色*/
	font-size: 180%;		/*文字サイズ*/
	font-weight: bold;		/*文字サイズ*/
	text-align:center ;
	/*font-family: 'Noto Sans JP', sans-serif;*/
}
#contents h3:after {
	position: absolute;
	content: " ";
	display: block;
	display: inline-block;
	width: 20%;
	left: 50%;
	bottom: -3px;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
	border-bottom: solid 3px #004ccb;
}
/*個人情報保護方針ページの設定*/
#privacy #contents h3 {
	text-align:left ;
}
#privacy #contents h3:after {
	left: 0;
	-webkit-transform: translateX(0);
	transform: translateX(0);
}
/********************
h5タグ
********************/
/*キャッチコピー用のh5タグ*/
#contents h5 {
	clear: both;
	color:#003998;
	font-size:150% ;
	font-weight:bold ;
	margin-bottom: 10px;
	padding: 0 2%;	/*上下、左右への余白*/
}
/*段落タグ*/
#contents p {
	padding: 0 2% 1.5em;
}
#contents p + p {
	margin-top: -10px;
}
/*section同士の余白*/
#contents section + section {
	/*margin-top: 40px;*/
}
#top #contents section + section {
	margin-top: 0px;	/*トップページはなし*/
}
#contents ul {margin:0 2% 0 ;}

/*ページ内サブメニュー（ローカルナビゲーション）

---------------------------------------------------------------------------*/
/*ブロック全体*/
nav.submenu{
	text-align:center ;
}
/*メニュー1個ずつの設定*/
nav.submenu ul li{
	display: inline-block;
	width:calc(100% / 4) ;
}
nav.submenu ul a{
	display: inline-block;
	width:100% ;
	line-height:50px ;
	margin:0 0 0;
	border:2px solid #004ccb ;
	border-right:none ;
	color: #004ccb ;		/*文字色*/
	font-size: 110% ;	/*文字サイズ*/
	font-weight: bold ;	/*文字サイズ*/
	text-align: center;
	text-decoration: none;
}
/*最後のメニューだけ右線*/
nav.submenu ul li:last-child a {
	border-right:2px solid #004ccb ;
}
/*マウスオン時*/
nav.submenu ul a:hover{
	background:#edf4ff ;
}

/*.fl_r .fl_l（画像が左右に寄るコンテンツ）

---------------------------------------------------------------------------*/
/*基本の左右寄せ設定*/
.fr{float: right;}
.fl{float: left;}
.fl_all{float: left;}
/********************
画像とコンテンツ左右に寄せる

********************/
/*画像の設定*/
img.fr {
	width:40% ;
	margin:0 2% 30px 2% ;
	margin:0 2% 0 5%;
}
img.fl {
	width:40% ;
	margin:0 2% 30px 2% ;
	margin:0 5% 0 2%;
}
/*画像を小さくする設定*/
img.fr20, img.fl20 {width:20% ; min-width:200px ;}
/*文章が入るコンテンツ部分の設定*/
.fr_text {width:53% ;float: right;}
.fl_text {width:53% ;float: left;}
/********************
右寄せコンテンツ内にある場合

********************/
.contents_r img.fr {
	width:50% ;
	margin:0 0 0 5% ;
}
.contents_r .fl_text {width:45% ;}
/********************
左寄せコンテンツ内にある場合

********************/
.contents_l img.fl {
	width:50% ;
	margin:0 5% 0 0 ;
}
.contents_l .fr_text {width:45% ;}

/*採用情報ページの募集職種各ブロック
---------------------------------------------------------------------------*/
/*各ボックスの設定*/
.list {
	position: relative;
	overflow: hidden;
	padding: 20px;		/*ボックス内の余白。ここを変更する際は、下の「.list a」のpaddingとmarginの数字も合わせる。marginの方はマイナス記号を忘れずに。*/
	padding: 45px;		/*ボックス内の余白。ここを変更する際は、下の「.list a」のpaddingとmarginの数字も合わせる。marginの方はマイナス記号を忘れずに。*/
	border-top: 1px solid #CCC;	/*上の線の幅、線種、色*/
	border: 1px solid #f6f6f6;	/*上の線の幅、線種、色*/
	border:2px solid #004ccb ;
	border-bottom:none ;

}
.list a {
	text-decoration: none;display: block;overflow: hidden;

	padding: 45px;	/*変更する場合は、上の「#main .list」のpaddingの説明を読んで下さい。*/
	margin: -45px;	/*変更する場合は、上の「#main .list」のpaddingの説明を読んで下さい。*/
	background:#FFF ;
	color:#000c21 ;
}
/*マウスオン時の背景色*/
.list a:hover {
	background: #edf4ff;	/*背景色*/
	background-color: #edf4ff;
}
/*リンクを貼った際に出る「→」マーク*/
.list a::before {
	/*font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;	/*フォント種類*/
	/*content: "→";	/*出力する文字。変更しても構いませんが機種依存文字は化けるので使わないで下さい。*/
	/*font-size: 12px;	/*文字サイズ*/
	/*font-size: 180%;	/*文字サイズ*/
	/*display: block;text-align: center;
	position: absolute;
	right: 10px;	/*ボックスの右から10pxの場所に配置*/
	/*bottom: 10px;	/*ボックスの下から10pxの場所に配置*/
	/*width: 50px;	/*幅*/
	/*line-height: 50px;	/*高さ*/
	/*background: #46852A;	/*背景色*/
	/*color:#FFF ;*/
}
/*マウスオン時の「→」マーク*/
.list a:hover::before {
	/*background: #7ec26c;	/*背景色*/
}
/*ボックス内のh4タグ設定*/
.list h4 {
	/*border-left: 3px solid #388922;	/*左側の線の幅、線種、色*/
	/*padding-left: 10px;	/*左の線との間に空ける余白*/
	margin-bottom: 0.5em;	/*下に少しスペースを空ける*/
	/*margin-left: 32%;	/*左側に空けるスペース。下の画像の幅を変更する場合はここも調整して下さい。*/
	font-size:120% ;
	font-weight:bold ;
}
/*正社員・アルバイト*/
.list h4 .type{
	display:inline- block ;
	/*float:left ;*/
	width:6em ;
	padding:5px 15px ;
	margin-left:15px ;
	background:#000 ;
	color:#FFF ;
	font-size:16px ;
	text-align:center ;
}
/*経験・未経験（詳細ページ）*/
h5 .type{
	display:inline- block ;
	/*float:left ;*/
	width:6em ;
	padding:5px 15px ;
	margin-right:15px ;
	background:#004ccb ;
	color:#FFF ;
	font-size:16px ;
	text-align:center ;
}
/*ボックス内のp(段落)タグ設定*/
.list p {
	/*padding: 0px !important;*/
	padding-bottom: 0px !important;
	/*line-height: 1.6;	/*行間。通常より少し狭くする。基本となる行間は、最上部の「body」にあります。*/
	/*margin-left: 34%;	/*左側に空けるスペース。下の画像の幅を変更する場合はここも調整して下さい。*/
}
/*正社員・アルバイト*/
.list p.type{
	/*margin-left: 32%;	/*左側に空けるスペース。下の画像の幅を変更する場合はここも調整して下さい。*/
	margin-bottom:1em ;
}
.list p.type span{
	background: #46852A;	/*背景色*/
	color:#FFF ;
	padding:5px 10px 3px;
}
/*ボックス内の画像*/
.list figure {
	float: left;	/*左に回り込み*/
	width: 30%;		/*画像の幅*/
}
/*最後ボックスの設定*/
.list:last-of-type, .list:last-of-type {
	border-bottom: 1px solid #666;	/*下の線の幅、線種、色*/
	border-bottom:2px solid #004ccb ;
	margin-bottom: 20px;	/*下に空けるスペース*/
}
/*採用情報ページの未経験・経験切り替えタブ

---------------------------------------------------------------------------*/
/*タブ切り替え全体のスタイル*/
.tabs {

  /*padding-bottom: 40px;
  background-color: #fff;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);*/
	width: 700px;
	width: auto;
	margin-top: 50px;
	margin: 0 auto;
}
/*タブのスタイル*/
.tab_item {
	display: block;
	float: left;
	width: calc(100%/3);
	width: calc((100% - 6px) / 2);
	height: 50px;
	line-height: 50px;
	border-bottom: 3px solid #004ccb;
	border:2px solid #004ccb ;
	background-color: #edf4ff;
	color: #565656;
	/*font-size: 16px;*/
	font-weight: bold;
	text-align: center;
	text-align: center;
	transition: all 0.2s ease;
}
.tab_item:hover {
  /*opacity: 0.75;*/
  background-color: #edf4ff;
  background-color: #004ccb;
  color:#FFF ;
}

/*ラジオボタンを全て消す*/
input[name="tab_item"] {
  display: none;
}

/*タブ切り替えの中身のスタイル*/
.tab_content {
	clear: both;
	overflow: hidden;
	display: none;
	padding: 40px 40px 0;
	padding: 45px 0 0;

}


/*選択されているタブのコンテンツのみを表示*/
#all:checked ~ #all_content,
#programming:checked ~ #programming_content,
#design:checked ~ #design_content {
	display: block;
}

/*選択されているタブのスタイルを変える*/
.tabs input:checked + .tab_item {
	border-right:none ;
	background-color: #004ccb;
	background-color: #002665;
	color: #FFF;
}

/*list2（トップページ「保有設備」「会社概要」2つ並びの各ボックス）

---------------------------------------------------------------------------*/
/*ブロック１個あたりの設定*/
.list2 {
	overflow: hidden;
	display:inline-block ;
	position:relative ;
	float:left ;
	width: 45%;	/*幅*/
	margin: 0 6% 0 2% ;	/*上、右、下、左へのボックスの外側に空けるスペース*/
	margin-right:6% ;
	text-align:left ;
}
/*トップの設定*/
#top .list2 {
	/*width: 47%;	/*幅*/
	/*margin: 0 0 0 ;	/*上、右、下、左へのボックスの外側に空けるスペース*/
	/*margin-right:6% ;*/
}
/*右ボックスだけの設定*/
#top .list2_last,
.list2_last {
	margin-right:0 ;
}
.list2 a {
	display: block;text-decoration: none;overflow: hidden;
	margin: -2%;	/*ボックスのマージン。リンク設定する場合に、上の.listのpaddingを相殺するため。*/
	padding: 2%;	/*ボックス内の余白*/
	border-top: 2px solid #036CBE;	/*枠線の幅、線種、色*/
}
/*画像の設定*/
.list2 figure {
	background:#5A539B ;
	overflow: hidden;
	margin-bottom:10px ;
}
.list2 figure img{
	width:100% ;
}
/*h2タグ*/
#contents .list2 h2 {
	position:absolute ;
	right:-10px ;
	bottom:0 ;
	background:#000 ;
	/*font-size: 150%;	/*文字サイズ*/
	/*overflow: hidden;	/*高さを超えた場合に非表示にする*/
	/*padding: 2% 4% 2% 50px;
	margin-bottom: 0 ;
	text-align:left ;
	background:url(../images/arrow.png) no-repeat left 22px / 30px;*/
}
#contents .list2 a:hover h2 {
	/*color:#807AB8 ;
	background:url(../images/arrow.png) no-repeat 5px 22px / 30px;*/
}
/*h4（見出し）タグの設定*/
.list2 h4 {
	font-size: 120%;	/*文字サイズ*/
	overflow: hidden;	/*高さを超えた場合に非表示にする*/
	padding: 2% 4% 2% 30px;
	font-weight:bold ;
	color:#5A539B ;
}
.list2 a:hover h4 {
	/*color:#807AB8 ;*/
}
/*pタグの設定*/
#contents .list2 p {
	padding: 0 4% ;
}

/*写真4つ並び「ギャラリー」ブロック
---------------------------------------------------------------------------*/
.gallery{
	clear:both ;
	padding-top:1em ;
	text-align:center ;
	margin-bottom:30px ;
}
.gallery figure {
	display:inline-block ;
	width:21% ;
	height:auto ;
	text-align:center ;
	margin:0 1.5% 2.5em;
	padding:0 ;
	border:0.5px solid #A9ADAC ;
	background:#5A539B ;
}
.gallery figure a{
	margin:0 ;
	padding:0 ;
}
.gallery img{
	width:100% ;
	height:auto ;
	padding:0 ;
}
.gallery figcaption{
	line-height:1.5 ;
	margin:0 0 0.5em ;
}

/*トップページ内写真カルーセル
---------------------------------------------------------------------------*/
#contents ul.autoplay {
	width:95% ;
	padding: 0;
	margin:0 auto 30px ;
}
.autoplay figure{
	background:transparent ;
	width: 90%;
	margin:0 4% ;
	padding:0 ;
}
.autoplay img {
	width:100% ;
	padding: 0;
	margin: 0 ;
}
.autoplay a:hover figure{
	background:#5A539B ;
}





/*テーブル1
---------------------------------------------------------------------------*/
/*テーブル１行目に入った見出し部分（※caption）*/
.ta1 caption {
	padding: 10px;			/*ボックス内の余白*/
	border: 1px solid #002665;	/*テーブルの枠線の幅、線種、色*/
	border-bottom: none;	/*下線だけ消す*/
	background:#edf4ff ;
	background:#002665 ;
	color:#FFF ;
	font-weight: bold;		/*太字に*/
	text-align: left;		/*文字を左寄せ*/
}
/*ta1設定*/
.ta1 {
	table-layout: fixed;
	width: 96%;
	margin: 0 2% 20px;
	margin: 0 2% ;
}
.ta1, .ta1 td, .ta1 th {
	word-break: break-all;
	padding: 10px;	/*ボックス内の余白*/
	border: 1px solid #e5e5e6;	/*テーブルの枠線の幅、線種、色*/
}
/*ta1の左側ボックス*/
.ta1 th {
	/*color:#5A539B ;*/
	width: 140px;		/*幅*/
	width: 200px;		/*幅*/
	background:#ededee ;
	background:#edf4ff ;
	font-weight: bold;
	text-align: left;	/*センタリング*/
	vertical-align:top ;
	/*border-bottom: 1px solid #AAA6D0;	/*テーブルの枠線の幅、線種、色*/
}
/*ta1の見出しボックス*/
.ta1 th.tamidashi {
	background: #cac7e2 ;
	background:#ededee ;
	/*border-top: 1px solid #AAA6D0;	/*テーブルの枠線の幅、線種、色*/
}
/*labelタグを２列表示にする（CMS用）*/
.ta1.cms td label {
	display: block;
	float: left;
	width: 50%;
}
/*必須アイコン*/
.ta1 th span.reqd {
	background: #ee8700 ;
	color: #FFF;
	font-size: 80%;
	font-weight:bold ;
	text-align:center ;
	padding: 1px 10px;
	border-radius: 2px;
	margin: 0px 5px ;
	display: inline-block;
	vertical-align: text-top ;
	line-height:1.5 ;
}
/*行ごとに色を変える*/
/*.ta1 tr:nth-child(even) td { background: #f6f6f6;}*/
/***********************
横並びを縦並びにするテーブル（横長テーブル）

************************/
/*ta_attrの左側ボックス*/
.ta_attr th {
	width: auto;		/*幅*/
	text-align:center ;
}
/***********************
保有設備ページ
************************/
#facility .ta1 th{
	text-align:center ;
}
/*各設備計（台数）*/
.ta_sum {
	background: #f6f6f6 ;
}
/*設備合計（台）*/
.ta_total {
	background: #bad5ff ;
}

/*テーブルta_cale（営業日カレンダー）

---------------------------------------------------------------------------*/
/*ta_caleを囲むブロック*/
.ta_cale_wrapper {
	display:inline-block ;
	display:inline-block ;
	overflow: hidden;
	/*width:calc(88% / 3);*/
	width:100% ;
	width:96% ;
	width:calc(88% / 3);
	min-width:220px ;
	min-width:240px ;
	margin:0 2% ;
	margin: 0 2% 4% 2% ;	/*上、右、下、左へのボックスの外側に空けるスペース*/

}
/*ta_cale設定*/
.ta1.ta_cale {
	/*float:left ;*/

	/*width:calc(88% / 3);
	min-width:220px ;*/
	width:100% ;
	line-height:1.5 ;
	line-height: 1.2;
	margin:0 ;
	text-align:center ;
	font-size:16px ;
	font-weight:bold ;
}
/*ta_caleの曜日ボックス*/
.ta1.ta_cale th {
	width:auto ;
	text-align: center;	/*センタリング*/
	/*vertical-align:middle ;*/
}
.ta1.ta_cale td, .ta1.ta_cale th {
	word-break: normal;
	padding: 10px 0;	/*ボックス内の余白*/
}
.ta1.ta_cale td{
	height:40px ;
	height:35px ;
	padding: 5px 0;	/*ボックス内の余白*/
	text-align: center;	/*センタリング*/
}
/*営業日*/
.ta1.ta_cale td.workday{
	background: #cbdfff ;
}
/*休日*/
.ta1.ta_cale td.holiday{
	background: #fdd ;
}
/*カレンダー凡例*/
.cale_example p {
	height:1.5em ;
}
.workday_box {
	display:inline-block ;
	float:left ;
	width:2em ;
	height:1.5em ;
	border:1px solid #CCC ;
	background: #cbdfff ;
}
.holiday_box {
	display:inline-block ;
	float:left ;
	width:2em ;
	height:1.5em ;
	border:1px solid #CCC ;
	background: #fdd ;
}

/*お問い合わせフォーム（色なし下線のみテーブル）

---------------------------------------------------------------------------*/
/*ta1の左側ボックス*/
#contact .ta1 th ,
#contact .ta1 td ,
#contact .ta1 tr:nth-child(even) th,
#contact .ta1 tr:nth-child(even) td {
	/*background: transparent;	/*背景色*/
	/*border-bottom:1px solid #DDD ;*/
}
/*ta1の左側ボックス*/
#contact .ta1 th {
	/*font-weight:500 ;
	text-align:left ;*/
}
#contact .ta1 th.tamidashi {
	/*text-align: left;		/*文字を左寄せ*/
	/*background: rgba(204, 224, 249, 0.6) !important;	/*背景色*/
	/*font-weight: 500;		/*太字に*/
	/*padding: 10px 10px;	/*ボックス内の余白*/
}

/*inputの設定

---------------------------------------------------------------------------*/
#contents input,
#contents textarea{
	padding:7px ;
}
/*inputボタンにclass="btn"をつけた場合の設定

---------------------------------------------------------------------------*/
#contents input[type="submit"].btn,
#contents input[type="button"].btn,
#contents input[type="reset"].btn {
	padding:0 ;	/*上のpadding設定を打ち消す*/
	-webkit-appearance: none;	/*iOS独自の装飾仕様をクリアする*/
	border: none;	/*iOS独自の装飾仕様をクリアする*/
	/*width:250px ;
	display: inline-block;
	margin:20px 1em 0px ;
	color: #FFF;		/*文字色*/
	/*background:#5A539B ;
	border-radius:50px ;
	font-size: 110% ;	/*文字サイズ*/
	text-decoration: none;
	text-align: center;
	line-height:50px ;
	font-family: "Yu Gothic" ,"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;	/*フォント種類*/



	display: inline-block;
	position: relative;
	overflow: hidden;
	width:250px ;
	width:300px ;
	line-height:50px ;
	height:50px ;
	line-height:60px ;
	height:60px ;
	/*padding:15px 30px ;*/
	margin:20px auto 0px ;
	margin:30px auto 0 ;
	margin:30px 15px 0 ;
	color: #FFF;		/*文字色*/
	background-color: #651327 ;
	background:#002665 ;
	font-weight: bold ;
	text-decoration: none;
	text-align: center;
	outline: none;
	/*-webkit-box-shadow: 5px 5px #f7d5dd;
	box-shadow: 5px 5px #f7d5dd;*/

}
/*マウスオン時の設定*/
#contents input[type="submit"].btn:hover,
#contents input[type="button"].btn:hover,
#contents input[type="reset"].btn:hover {
	background:#807AB8 ;
	background:#003998 ;
	/*color:#FFF ;*/
	-webkit-appearance: none;	/*iOS独自の装飾仕様をクリアする*/
	border: none;	/*iOS独自の装飾仕様をクリアする*/
	transition: 0.5s;	/*マウスオン時の移り変わるまでの時間設定。0.5秒。*/
}


/*.link（大「平行四辺形リンクボタン」設定）

---------------------------------------------------------------------------*/
p.link {
	width:250px ;
	/*margin:auto ;*/
	transform: skewX(-30deg); /*transformで平行四辺形に曲げる*/
}
p.link a {
	display: inline-block;
	width:250px ;
	line-height:50px ;
	margin:0 auto 0;

	color: #FFF;		/*文字色*/
	background:#002665 ;
	font-size: 110% ;	/*文字サイズ*/
	font-weight: bold ;	/*文字サイズ*/
	text-decoration: none;
	text-align: center;
}
p.link a span{
	display: inline-block;
	transform: skewX(30deg); /*上記transformで曲がった分を相殺*/
}
/*マウスオン時*/
p.link a:hover {
	background:#003998 ;
}
/********************
中央寄せする場合

********************/
p.link.c {
	margin:auto ;
}
p.link.c a {
	margin:30px auto 0;
}
/*.link2（ページ内メニュー用大「リンクボタン」設定）

---------------------------------------------------------------------------*/
p.link2 {
	/*width:250px ;
	margin:auto ;
	transform: skewX(-30deg); /*transformで平行四辺形に曲げる*/
	margin:0 ;
	padding:0 ;
}
p.link2 a {
	display: inline-block;
	width:250px ;
	line-height:50px ;
	margin:0 auto 0;
	margin:30px auto 0;
	margin:0 0 0;
	border:2px solid #004ccb ;
	border-right:none ;
	/*background:#004ccb ;
	color: #FFF;		/*文字色*/
	color: #004ccb ;		/*文字色*/

	font-size: 110% ;	/*文字サイズ*/
	font-weight: bold ;	/*文字サイズ*/
	text-decoration: none;
	text-align: center;
}
p.link2 a:last-child {
	border-right:2px solid #004ccb ;
}
p.link2 a span{
	/*display: inline-block;
	transform: skewX(30deg); /*上記transformで曲がった分を相殺*/
}
/*マウスオン時*/
p.link2 a:hover {
	background:#edf4ff ;
}

/*.btn（平行四辺形ボタン）

---------------------------------------------------------------------------*/
a.btn{
  /*display: inline-block;
  text-decoration: none;
  color: #FFF;
  font-weight: bold;
  text-align: center;
  margin: 50px;
  width: 120px;
  padding: 0.5em 1em;*/
}
.btn{
  /*position: relative;
  height: 40px;
  line-height: 40px;
  background: #142c5b;
  transition: .4s;
  padding: 0;*/
}

.btn:before {
  /*position: absolute;
  content: '';
  left: 0;
  top: 0;
  width: 0;
  height: 0;
  border: none;
  border-left: solid 21px white;
  border-bottom: solid 41px transparent;
  z-index: 1;
  transition: .4s;*/
}

.btn:after {
  /*position: absolute;
  content: '';
  right: 0;
  top: 0;
  width: 0;
  height: 0;
  border: none;
  border-left: solid 21px transparent;
  border-bottom: solid 41px white;
  z-index: 1;
  transition: .4s;*/
}

/*btn1
---------------------------------------------------------------------------*/
/*btn1共通*/
a.btn1 {
	display: inline-block;
	text-decoration: none;
	color: #FFF ;
	background: #14A468 ;	/*背景色、背景の矢印画像の読み込み、左から15pxの場所に配置。幅を6pxに。*/
	border-radius:50px ;
	font-weight:bold ;
	margin-bottom: 10px;
	padding: 5px 30px ;	/*上、右、下、左へのボックス内の余白*/
	letter-spacing: 0.1em;		/*文字間隔を広くとる設定*/
}
/*マウスオン時*/
a.btn1:hover{
	background:#1BE18E ;
}

/*ボックス
---------------------------------------------------------------------------*/
/*ボックス全体*/
.box{
	clear:both ;
	background: #FFF;
	padding:30px 15px 30px;
	margin: 0 2% 30px;
	margin: 0 2% 0;
	border:1px solid #e5e5e6 ;
}
/********************
会社方針ボックス
********************/
.box_company{
	width:auto ;
	max-width:600px ;
	/*padding:30px 60px 30px ;*/
	padding:45px 15px 45px;
	margin: 0 auto 0;
	border:7px double #bad4ff;
}
#contents .box_company p{
	width:auto ;
	max-width:19em ;
	padding:0 ;
	margin: 0 auto 0;
}
#contents .box_company ul{
	width:auto ;
	max-width:19em ;
	padding:0 0 0 2em ;
	margin: 0 auto 0;
}


/*（ページ共通）お問い合わせ

---------------------------------------------------------------------------*/
/********************
電話番号（基本設定）

********************/
.tel_no{
	color:#002665 ;	/*文字色：紺*/
	font-size:24px ;	/*Googlefontが小さいので、フォントサイズを大きく設定*/
	font-weight:700 ;
	font-family: 'Source Sans Pro', sans-serif;
	font-style: italic;	/*safari用の設定*/
	background: url(../images/icon_tel.png)no-repeat 0 7px / 20px;
	padding-left:25px ;
}
/*iOSの自動設定を解除*/
.tel_no a{
	color:#002665 ;	/*文字色：紺*/
	text-decoration:none;
}
/********************
各ページのお問い合わせボックス
********************/
/*ボックス*/
.contact_box {
	padding:50px 30px 30px;
	background:#002665 ;
	color:#FFF ;
}
/*お問い合わせボックス内の電話番号設定*/
.contact_box .tel_no{
	line-height:1.0 ;
	padding-left:40px ;
	background: url(../images/icon_tel_wh.png)no-repeat 0 15px / 30px;
	color:#FFF ;	/*文字色：紺*/
	font-size:240% ;	/*Googlefontが小さいので、フォントサイズを大きく設定*/
}
/*iOSの自動設定を解除*/
.contact_box .tel_no a{
	color:#FFF ;
	text-decoration:none;
}
/*h2見出し*/
#contents .contact_box h2{
	margin-bottom:20px ;
}
#contents .contact_box p.tel_info{
	clear:both ;
	display:inline-block ;
	margin-left:0px ;
	vertical-align:middle ;
	padding: 0 2% 20px ;
}
/*お問い合わせボタン*/
.contact_box p.link a{
	width:200px ;
	background:#e85322 ;
	margin:0 ;
}
.contact_box p.link a:hover{
	background:#ed7750 ;
}

/*PAGE TOP（↑）設定

---------------------------------------------------------------------------*/
/*アニメーションのキーグレーム設定（変更不要）*/
@keyframes scroll {
0% {opacity: 0;}
100% {opacity: 1;}
}
/*デフォルトでは非表示に*/
body .nav-fix-pos-pagetop a {display: none;}
/*ボタンの設定*/
body.is-fixed-pagetop .nav-fix-pos-pagetop a {
	display: block;text-decoration: none;text-align: center;z-index: 100;position: fixed;
	width: 50px;		/*幅*/
	line-height: 49.5px;	/*高さ。copyrightのline-heightと合わせる*/
	bottom: 0;		/*下から50pxの場所に配置*/
	right: 1%;			/*右から3%の場所に配置*/
	/*background: #003998;	/*背景色（古いブラウザ用）*/
	color: #fff;		/*文字色*/
	animation-name: scroll;	/*上のアニメーションで指定しているkeyframesの名前（scroll）*/
	animation-duration: 1S;	/*アニメーションの実行時間*/
	animation-fill-mode: forwards;	/*アニメーションの完了後、最後のキーフレームを維持する*/
}
/*マウスオン時*/
body.is-fixed-pagetop .nav-fix-pos-pagetop a:hover {
	/*background: #004ccb;	/*背景色*/

}

/*その他

****************************************************************************/
.look {background: #eee;border: 1px solid #ccc;padding: 5px 10px;border-radius: 4px;}
.mb15,.mb1em {margin-bottom: 15px !important;}
.mb10 {margin-bottom: 10px !important;}
.mb30 {margin-bottom: 30px !important;}
.mb45 {margin-bottom: 45px !important;}
.mb60 {margin-bottom: 60px !important;}
.mt10 {margin-top: 10px !important;}
.mt20 {margin-top: 20px !important;}
.mt30 {margin-top: 20px !important;}
.ml30 {margin-left: 30px !important;}
.mr30 {margin-right: 30px !important;}
.pl5{padding-left: 5px !important;}
.pl20{padding-left: 20px !important;}
.pr20{padding-right: 20px !important;}
.clear {clear: both;}
.clearfix:after {content: ""; /* 擬似要素を実体化 */clear: both;/* floatを解除する */display: block;/* ブロック要素にする */}	/*floatでなくなる親要素の高さを出す*/
.color_p, .color_p a {color: #5A539B !important;}	/*パーブル：標準*/
.color_sun, .color_sun a , .red, .red a {color: #fc0002 !important;}	/*レッド：標準、日曜日*/
.color_sat, .color_sat a , .blue, .blue a{color: #0066f9 !important;}	/*ブルー：標準、土曜日*/
.b{font-weight:bold ;}
.b li{font-weight:bold ;}
.pr {font-size: 10px;}
.fs120{font-size:120% ;}
.fs70{font-size:70% ;}
.wl {width: 96%;}
.ws {width: 50%;min-width:300px ;}
.c {text-align: center;}
.c_max900 {text-align: center;}
.c_max600 {text-align: center;}
.c2 {text-align: center;}
.r {text-align: right;}
.l {text-align: left;}
.big1 {font-size: 24px;letter-spacing: 0.2em;}
.mini1 {font-size: 11px;}
.dis_flex{display:flex;flex-wrap: wrap;justify-content: center;}	/*横並びボックスの高さを揃える*/
.dis_900{display:none ;}
.dis_600{display:none ;}
.dis_480{display:none ;}
.dis_b{display:block ;}
.border{ border:1px solid #CCC ;}
.border_b{ border-bottom:1px solid #CCC ;}
/*Googleマップ*/
iframe.gmap {width: 100%;vertical-align:bottom ;}	/*下にできる余白を消す*/





/*画面幅1301px以上の設定

------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (min-width:1301px){


}



/*画面幅1300px以下の設定

------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:1300px){



/*ヘッダー（ロゴが入った最上段のブロック）

****************************************************************************/
/*ヘッダーブロック*/
header {
	height: 60px;		/*高さ*/
}
/********************
ロゴ画像

********************/
/*ロゴ画像を囲むブロック*/
header #logo {
	height:40px ;	/*heightとpaddingを合わせて高さがヘッダーの高さ60pxになるようにする*/
	padding:10px 3% 10px 6%;	/*transformで曲げる分、左の余白を多くする*/
}
/*ロゴ画像*/
header #logo img{
	margin-top:5px ;
}

/*メインメニュー
---------------------------------------------------------------------------*/
/********************
スマホ用メニュー
********************/
/*アニメーションのフレーム設定。全100コマアニメーションだと思って下さい。透明(0%)から色を100%出すアニメーション指定。*/
@keyframes menu1 {
	0% {opacity: 0;}
	100% {opacity: 1;}
}
/*スマホ用メニューブロック*/
#menubar-s {
	display: block;
	overflow: hidden;
	y-overflow: scroll;
	z-index: 10;
	position: absolute;
	top: 60px;	/*上から60pxの場所に配置*/
	top: 0;	/*上から0pxの場所に配置*/
	width: 100%;
	padding-top:60px ;
	background:rgba(255, 255, 255, 0.5) ;
	animation-name: menu1;		/*上のkeyframesの名前*/
	animation-duration: 0.5S;	/*アニメーションの実行時間。0.5秒。*/
	animation-fill-mode: both;	/*アニメーションの待機中は最初のキーフレームを維持、終了後は最後のキーフレームを維持。*/
}
/*メニュー１個あたりの設定*/
#menubar-s li a {
	text-decoration: none;
	display: block;
	float:left;
	width:50% ;
	height:30px ;
	padding: 20px 0 ;	/*上、右、下、左へのメニュー内の余白*/
	border-bottom: 1px solid #ededee;	/*下の線の幅、線種、色*/
	background: #001332;	/*背景色*/
	color:#FFF ;
	font-weight:bold ;
	text-align:center ;
}
#menubar-s li:nth-child(odd) a {
	width:calc(50% - 1px) ;
	border-right: 1px solid #ededee;	/*下の線の幅、線種、色*/
	/*border-right: 1px solid #f00;	/*下の線の幅、線種、色*/
}
/*電話番号メニューの設定（他メニューに合わせる）*/
#menubar-s li.menubar_tel {
	text-decoration: none;
	display: block;
	float:left;
	width:50% ;
	height:30px ;
	padding: 5px 0 35px;	/*上、左右、下へのメニュー内の余白*/
	border-bottom: 1px solid #ededee;	/*下の線の幅、線種、色*/
	background: #001332;	/*背景色*/
	color:#FFF ;
	text-align:center ;
	line-height:1.5 ;
}
#menubar-s li.menubar_tel .tel_no{
	background: url(../images/icon_tel_wh.png)no-repeat 0 center / 20px;
	color:#FFF ;
	display:inline-block ;
	white-space: nowrap;
	/*border:1px solid #f00 ;
	padding-top:0 ;
	line-height:20px ;
	padding:0 0 0 30px ;*/
}
#menubar-s li.menubar_tel .tel_no a{
	color:#FFF ;
	text-decoration: none;
	padding:0 ;
	width:100% ;
}
/*マウスオン時と、現在表示中(current)のメニューの設定*/
#menubar-s li a:hover, #menubar li.current a {
	background: #003998;	/*背景色*/
}
/********************
PC用メニュー
********************/
/*PC用メニューを非表示にする*/
/*#menubar {display: none;}*/
#menubar li{display: none;}

/*営業日カレンダー・採用情報・電話番号は表示したままにする*/
#menubar li.menubar_cale, #menubar li.menubar_recruit, #menubar li.menubar_tel{
	display:block ;
}
/*営業日カレンダー*/
#menubar li.menubar_cale a{
	padding:6px 10px 6px 10px;
}
/*採用情報*/
#menubar li.menubar_recruit a{
	padding:6px 25px 6px 50px;
}
/*メニューブロック*/
#menubar {
	top:8px ;	/*ヘッダーブロックに対して下から10pxの場所に配置。+メニューブロックの高さ50px+上下ライン2px = ヘッダーの高さ60px*/
	right:calc(6% + 50px) ;	/*３本バー50px + 3%ずつの余白*/
}
/*受付時間の設定*/
#menubar li.menubar_tel .tel_time{
	/*color:#FFF ;
	font-size:16px ;	/*文字サイズを全体を同じ大きさに戻す*/
}


/*３本バーアイコン設定

---------------------------------------------------------------------------*/
/*３本バーブロック*/
#menubar_hdr {
	display: block;position: absolute;
	top: 5px;	/*上から24pxの場所に配置*/
	right: 3%;	/*右から3%の場所に配置*/
	z-index: 101;
}
/*アイコン共通設定*/
#menubar_hdr.close,
#menubar_hdr.open {
	width: 50px;		/*幅*/
	height: 50px;		/*高さ*/
	border-radius: 50%;	/*円形にする。この行削除すれば正方形になります。*/
}
/*三本バーアイコン*/
#menubar_hdr.close {
	background: url(../images/icon_menu.png) no-repeat center top/50px;	/*背景色、アイコンの読み込み、上半分(top)を表示、幅50px*/
}
/*閉じるアイコン*/
#menubar_hdr.open {
	background: url(../images/icon_menu.png) no-repeat center bottom/50px;	/*背景色、アイコンの読み込み、上半分(bottom)を表示、幅50px*/
}


}



/*画面幅1100px以下の設定

------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:1100px){


/*トップページのメイン画像

---------------------------------------------------------------------------*/
/********************
リードコピー
********************/
/*メイン画像内（601px以上端末）*/
#mainimg .leadcopy{
	/*◎未使用
	left:3% ;*/
}
/********************
採用情報ボックス
********************/
/*ボックス設定*/
#mainimg .recruit_box {
	right:3% ;
	width:300px ;
}
/*採用情報はこちら*/
#mainimg .recruit_box p {
	background: url(../images/icon_arrow_next.png)no-repeat right 30px center / 20px ;
}
#mainimg a:hover .recruit_box p {
	background: url(../images/icon_arrow_next.png)no-repeat right 20px center / 20px ;
}

/*フッター設定

****************************************************************************/
/*フッターメニュー
---------------------------------------------------------------------------*/
/*ボックス全体*/
#footermenu {
	padding: 15px 3% 0;	/*上、左右、下へのボックス内の余白*/
}
/*コピーライト

---------------------------------------------------------------------------*/
#copyright {
	width:auto ;
	padding: 30px 3% 45px;
	padding: 30px 5% 45px;
}

/*コンテンツ（メニューの下にある白い背景色のブロック）

****************************************************************************/
.contents {
	padding: 45px 3% 45px 3%;	/*上、右、下、左への余白*/
}
/*上寄せコンテンツ*/
.contents_t{
	padding: 0 3% 45px 3%;	/*上、右、下、左への余白*/
}
/*下寄せコンテンツ*/
.contents_b{
	padding: 45px 3% 0 3%;	/*上、右、下、左への余白*/
}
/*右寄せコンテンツ*/
.contents_r{
	padding: 45px 0 45px 3%;	/*上、右、下、左への余白*/
}
/*左寄せコンテンツ*/
.contents_l{
	padding: 45px 3% 45px 0;	/*上、右、下、左への余白*/
}
/*その他

****************************************************************************/
.non_dis_1100{display:none ;}

}



/*画面幅900px以下の設定

------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:900px){

/*全体の設定

****************************************************************************/
body {
	font-size: 15px;	/*文字サイズ*/
}
.ta1 ul.disc,.ta1 ul.decimal,.ta2 ul.disc,.ta2 ul.decimal{padding-left: 0.2em ;margin-left:0 ;}

/*ヘッダー（ロゴが入った最上段のブロック）

****************************************************************************/
/********************
ロゴ画像

********************/
/*ロゴ画像を囲むブロック*/
header #logo {
	padding:10px 7% 10px 10%;	/*transformで曲げる分、左の余白を多くする*/
	margin-left:-8% ;	/*transformで曲げる分、左の余白を左にずらす*/
}

/*メインメニュー
---------------------------------------------------------------------------*/
/********************
PC用メニュー
********************/
/*PC用メニューを非表示にする*/
#menubar {display: none;}


/*トップページのメイン画像

---------------------------------------------------------------------------*/
#mainimg {position:relative ;}
/********************
リードコピー
********************/
.leadcopy h4{
	/*◎未使用
	font-size:320% ;*/
}
/*メイン画像内（601px以上端末）*/
#mainimg .leadcopy{
	/*◎未使用
	left:3% ;
	top:100px ;*/
}
/********************
採用情報ボックス
********************/
/*ボックス設定*/
#mainimg .recruit_box {
	width:auto ;
	padding:10px 10px ;
}
/*白いライン*/
#mainimg .recruit_box div {
	padding:10px 15px ;
}
/*従業員募集中*/
#mainimg .recruit_box h4 {
	padding-right:35px ;
	background: url(../images/icon_arrow_next.png)no-repeat right 5px center / 20px ;
	font-size:120% ;
	transition: 0.5s;	/*マウスオン時の移り変わるまでの時間設定。0.5秒。*/
}
#mainimg a:hover .recruit_box h4 {
	background: url(../images/icon_arrow_next.png)no-repeat right center / 20px ;
}
/*採用情報はこちら*/
#mainimg .recruit_box p {
	display:none ;
}

/*フッター
****************************************************************************/
/*コピーライト

---------------------------------------------------------------------------*/
/********************
ロゴと住所の設定

********************/
#copyright #footermenu1 div{
	float:none ;
	margin:0 0 1em 0;
}

/*コンテンツ（メニューの下にある白い背景色のブロック）

****************************************************************************/
/*上・右・左寄せコンテンツ*/
.contents_t, .contents_r, .contents_l {
	padding: 45px 3% 45px 3%;	/*上、右、下、左への余白*/
}
/********************
h2タグ
********************/
/*ページタイトル用のh2タグ*/
#contents .h2_title_box {
	/*padding: 30px 10% 70px ;	/*上下、左右へのボックス内の余白*/
	padding: 120px 10% 45px ;	/*上下、左右へのボックス内の余白*/
}
/********************
h5タグ
********************/
/*トップページのキャッチコピー用のh5タグ*/
#top #contents h5 {
	text-align:center ;
}
/*section同士の余白*/
#contents section + section {
	margin-top: 0;
}

/*.fl_r .fl_l（画像が左右に寄るコンテンツ）

---------------------------------------------------------------------------*/
/*基本の左右寄せ設定解除*/
.fl {float: none;}
.fr {float: none;}
/********************
画像とコンテンツ左右に寄せる設定解除
********************/
img.fr,img.fl, .contents_r img.fr, .contents_l img.fl {width:96% ;float: none;margin:0 2% 30px ;}
.fr_text, .fl_text, .contents_r .fl_text , .contents_l .fr_text {width:100% ;float: none;}


/*写真4つ並び「ギャラリー」ブロック
---------------------------------------------------------------------------*/
.gallery figure{
	width:47% ;
	width:46% ;
}

/*テーブル1
---------------------------------------------------------------------------*/
/*ta1の左側ボックス*/
.ta1 th {
	width: 140px;		/*幅*/
}
/*テーブル2
---------------------------------------------------------------------------*/
/*ta2設定*/
.ta2{
	width: 96%;
}

/*.link（大「リンクボタン」設定）

---------------------------------------------------------------------------*/
p.link {
	text-align:center ;
}

/*その他

****************************************************************************/
body.s-n #sub,body.s-n #footermenu,.m-n {display: none;}
.big1 {font-size: 20px;}
.w50 {overflow: hidden;width: auto;}
.dis_900{display:inline;}
.non_dis_900{display:none ;}
.c_max900 {text-align: left;}
.c_900{text-align:center ;}


}



/*画面幅600px以下の設定

------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:600px){

/*ヘッダー（ロゴが入った最上段のブロック）

****************************************************************************/
/********************
ロゴ画像

********************/
/*ロゴ画像を囲むブロック*/
header #logo {
	padding:10px 7% 10px 10%;	/*transformで曲げる分、左の余白を多くする*/
	margin-left:-8% ;	/*transformで曲げる分、左の余白を左にずらす*/
}
/*ヘッダーブロック*/
header {
	height: 50px;		/*高さ*/
}
/********************
ロゴ画像

********************/
/*ロゴ画像を囲むブロック*/
header #logo {
	width:200px ;
	padding:5px 7% 5px 10%;	/*transformで曲げる分、左の余白を多くする*/
}

/*３本バーアイコン設定

---------------------------------------------------------------------------*/
/*３本バーブロック*/
#menubar_hdr {
	top: 2.5px;	/*上から24pxの場所に配置*/
}

/*メインメニュー
---------------------------------------------------------------------------*/
/*メインメニュー
---------------------------------------------------------------------------*/
/********************
スマホ用メニュー
********************/
/*スマホ用メニューブロック*/
#menubar-s {
	padding-top:50px ;
}
/*電話番号メニューの設定（他メニューに合わせる）*/
#menubar-s li.menubar_tel .tel_no{
	font-size:20px ;
}

/*トップページのメイン画像

---------------------------------------------------------------------------*/
/********************
採用情報ボックス
********************/
/********************
採用情報ボックス
********************/
/*ボックス設定*/
#mainimg .recruit_box {
	/*position:absolute ;
	right:10% ;
	bottom:10% ;
	width:400px ;
	padding:15px 15px ;
	background:#004ccb ;
	background:rgba(0, 76, 203, 0.7);
	color:#FFF ;
	text-align:center ;*/
}
/*白いライン*/
#mainimg .recruit_box div {
	/*width:calc(100% - 30px);
	height:calc(100% - 30px);
	padding:15px 15px ;
	border:1px solid #FFF ;*/
}
/*ボックス設定*/
#mainimg .recruit_box {
	right:0 ;
	right:calc(3% + 10px);
	-ms-writing-mode: tb-rl;	/*縦書き*/
	-webkit-writing-mode: vertical-rl;	/*縦書き*/
	 -o-writing-mode: vertical-rl;	/*縦書き*/
	writing-mode: vertical-rl;	/*縦書き*/
}
/*白いライン*/
#mainimg .recruit_box div {
	width:calc(100% - 10px);
	height:calc(100% - 20px);
	padding:10px 10px ;
	padding:10px 5px ;
}
/*従業員募集中*/
#mainimg .recruit_box h4 {
	padding:0 0 30px ;
	background: url(../images/icon_arrow_next.png)no-repeat center bottom / 20px ;
	font-size:100% ;
	letter-spacing:0.2em ;
}
#mainimg a:hover .recruit_box h4 {
	background: url(../images/icon_arrow_next.png)no-repeat right bottom / 20px ;
}

/*トップページのメイン画像

---------------------------------------------------------------------------*/
/********************
リードコピー
********************/
/*リードコピー共通*/
.leadcopy{
	/*◎未使用
	color:#FFF ;
	font-family: 'Noto Serif JP', serif;
	font-weight:700 ;*/
}
.leadcopy h4{
	/*◎未使用
	font-size:400% ;
	line-height:1.5 ;*/
}

/*トップページのメイン画像

---------------------------------------------------------------------------*/
/********************
リードコピー
********************/
/*コンテンツ内（601px以下端末）*/
#contents .leadcopy h4{
	/*◎未使用
	font-size:300% ;
	text-align:center ;
	margin-bottom:45px ;*/
}

/*各コンテンツブロックの背景設定

---------------------------------------------------------------------------*/
/*背景：採用情報*/
.bg_recruit{
	background: url(../images/bg_recruit.jpg) ;	/*強み*/
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}

/*コンテンツ（メニューの下にある白い背景色のブロック）

****************************************************************************/
/********************
h2タグ
********************/
#contents h2 {
 	padding: 0 75px;
	font-size: 160%;		/*文字サイズ*/
}
#contents h2:before, h2:after {
  width: 45px;
}
/********************
h3タグ
********************/
#contents h3 {
	font-size: 140%;		/*文字サイズ*/
}
/********************
h5タグ
********************/
#contents h5 {
	font-size: 120%;		/*文字サイズ*/
}
.contents {
	padding: 30px 20px ;	/*上、右、下、左への余白*/
	width:auto ;
}

/*ページ内サブメニュー（ローカルナビゲーション）

---------------------------------------------------------------------------*/
/********************
メニュー数が2の倍数の場合

********************/
/*メニュー1個ずつの設定*/
nav.submenu_02 ul li{
	width:calc(100% / 2) ;
	font-size:95% ;
}
nav.submenu_02 ul a{
	border-bottom:none ;
}
/*2の番数番目のメニューだけ右線*/
nav.submenu_02 ul li:nth-child(2n) a {
	border-right:2px solid #004ccb ;
}
/*最後のメニューと最後から2番目だけ右線*/
nav.submenu_02 ul li:last-child a,
nav.submenu_02 ul li:nth-last-child(2) a {
	border-bottom:2px solid #004ccb ;
}
/********************
メニュー数が3の場合

********************/
nav.submenu_03 ul li{
	width:calc(100% / 3) ;
	font-size:95% ;
}
/*採用情報ページの募集職種各ブロック
---------------------------------------------------------------------------*/
/*各ボックスの設定*/
.list {
	padding: 30px;		/*ボックス内の余白。ここを変更する際は、下の「.list a」のpaddingとmarginの数字も合わせる。marginの方はマイナス記号を忘れずに。*/
}
.list a {
	padding: 30px;	/*変更する場合は、上の「#main .list」のpaddingの説明を読んで下さい。*/
	margin: -30px;	/*変更する場合は、上の「#main .list」のpaddingの説明を読んで下さい。*/
}
/*正社員・アルバイト*/
.list h4 .type{
	display:block ;
	padding:0 ;
	margin-left:0 ;
}
/*経験・未経験（詳細ページ）*/
h5 .type{
	display:block ;
	padding:0px ;
	margin-right:0 ;
	font-size:14px ;
}

/*list2（トップページ「設備情報」「会社案内」2つ並びの各ボックス）
---------------------------------------------------------------------------*/
/*各ボックスの設定*/
#top .list2 ,
.list2 {
	display:block ;	/*ボックス個数が3の倍数でない時、中央寄せするための設定。それ以外はコメント*/
	width: 96%;		/*ボックス幅*/
	margin: 0 auto 50px;	/*上、左右、下へ、ボックスの外側に空けるスペース*/
	float:none ;
}
/*右ボックスだけの設定*/
#top .list_last,
.list2_last {
	margin: 0 auto 50px ;	/*上、左右、下へ、ボックスの外側に空けるスペース*/
}
#contents .list2 h2 {
	font-size: 140%;	/*文字サイズ*/
}

/*フッターメニュー
---------------------------------------------------------------------------*/
footer #footermenu1 img{
	width:250px ;
}
/*テーブル1（基本のテーブル）

---------------------------------------------------------------------------*/
/***********************
横並びを縦並びにするテーブル
************************/
.ta1.ta_vertically {
    border:none ;
}
.ta1.ta_vertically th,.ta1.ta_vertically td {
    display: block;
    width: 100%;
    width:calc(100% - 32px) ;
    padding: 15px 15px;	/*ボックス内の余白*/
    padding: 10px 15px;	/*ボックス内の余白*/
    border-bottom: none;
}
/*一番下のtdに下線をつける*/
.ta1_last td:last-child {
    border-bottom: solid 1px #e5e5e6 ;
    width:calc(100% - 32px) ;
}
/***********************
横並びを縦並びにするテーブル（横長テーブル）

************************/
.ta_attr {
    width: 80%;
    width: 96%;
    border:none ;
  }
  .ta_attr .thead {
    display: none;
  }
  .ta_attr tr {
    width: 100%;
    width:calc(100% - 22px) ;
  }
  .ta_attr td {
    display: block;
    text-align: right;
    width: 100%;
    width:calc(100% - 22px) ;
    width:auto ;
    border-bottom:none ;
  }
  .ta_attr td:before {
    content: attr(data-label);
    float: left;
    /*font-weight: bold;*/
    margin-right: 10px;
  }
  /*小見出し（背景グレー）*/
  .ta_attr td.ta_attr_midashi {
    background: #e9727e;
    background:#f4f4f4 ;
    font-weight: bold;
    text-align: left;
  }
 /*行ごとに色を変える*/
.ta_attr tr:nth-child(odd) td { background: #f6f6f6;}
/*ta_attrの設備合計（台）*/
.ta_attr tr.ta_total td{
	background: #bad5ff ;
}
/*テーブルta_cale（カレンダー）

---------------------------------------------------------------------------*/
/*ta_caleを囲むブロック*/
.ta_cale_wrapper {
	width:calc(96% - 60px);
	width:96%;
}

/*（ページ共通）お問い合わせ

---------------------------------------------------------------------------*/
/********************
各ページのお問い合わせボックス
********************/
/*ボックス*/
.contact_box {
	padding:30px 30px 10px;
	margin:auto 2% ;
}
/*お問い合わせボックス内の電話番号設定*/
.contact_box .tel_no{
	font-size:220% ;	/*Googlefontが小さいので、フォントサイズを大きく設定*/
}
#contents .contact_box p.tel_info{
	padding: 0 0 20px ;
}

/*.link（大「平行四辺形リンクボタン」設定）

---------------------------------------------------------------------------*/
p.link {
	transform: skewX(-30deg); /*transformで平行四辺形に曲げる*/
	width:200px ;
}
p.link a {
	width:200px ;
	margin:30px auto 0 15px;
	font-size: 100% ;	/*文字サイズ*/
}

/*その他

****************************************************************************/
.ws {width: 96%;min-width:unset ;}
.non_dis_600{	display:none ;}
.dis_600{display:inline ;}
.c_max600 {text-align: left;}
.c2 {text-align:left ;}
.l_600{text-align:left ;}


}



/*画面幅480px以下の設定

------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:480px){

/*フッター設定

****************************************************************************/
footer {
	clear: both;
	border-top:1px solid #d4d4d4 ;
	background:#001332 ;
	color:#FFF ;
	font-size: 14px;	/*文字サイズを少し小さく*/
}
footer a {text-decoration: none; }

/*フッターメニュー
---------------------------------------------------------------------------*/
/*ボックス全体*/
#footermenu {
	/*overflow: hidden;
	max-width:1300px ;
	margin:0 auto ;
	padding: 15px 10% 0;*/
}
/*１列分の設定*/
#footermenu ul {
	/*text-align:center ;*/
}
/*メニュー１個あたりの設定*/
#footermenu ul li {
	/*display:inline-block ;
	padding: 0 1.5em 15px ;
	font-weight:bold ;*/
}
#footermenu ul li a {
	/*color:#FFF ;*/
}
#footermenu ul li a:hover {
	/*color:#004ccb ;
	text-decoration:underline ;*/
}

/*コピーライト

---------------------------------------------------------------------------*/
/********************
ロゴと住所の設定

********************/
#copyright #footermenu1 div{
	float:none ;
	text-align:center ;
}
/********************
電話番号・採用情報ボタン
********************/
/*採用情報ボタン*/
#copyright p.link{
	width:100px ;
}
#copyright p.link a{
	width:100px ;
}

	/*トップページのメイン画像

---------------------------------------------------------------------------*/
/********************
リードコピー
********************/
/*コンテンツ内（601px以下端末）*/
#contents .leadcopy h4{
	/*◎未使用
	font-size:250% ;*/
}

/*コンテンツ（メニューの下にある白い背景色のブロック）

****************************************************************************/
/********************
h2タグ
********************/
#contents h2 {
 	padding: 0 60px;
	font-size: 140%;	/*文字サイズ*/
}
#contents h2:before, h2:after {
	width: 30px;
}
/********************
h3タグ
********************/
#contents h3 {
	font-size: 120%;	/*文字サイズ*/
	margin-bottom: 20px;/*下に空けるボックスの外側への余白*/
}
/********************
h5タグ
********************/
#contents h5 {
	padding: 0 ;	/*上下、左右への余白*/
}
/*段落タグ*/
#contents p {
	padding: 0px 0px 20px;	/*上、左右、下への段落タグ内の余白*/
	line-height: 1.7;		/*行間を少し狭くする*/
}

/*フッターメニュー
ウィンドウ幅が狭くなって見づらくなるので、１列にレイアウト変更。

---------------------------------------------------------------------------*/
#footermenu ul {
	/*float: none;
	width: auto;*/
}

/*写真4つ並び「ギャラリー」ブロック
---------------------------------------------------------------------------*/
.gallery figure{
	width:44% ;
}

/*テーブル（ta1）

---------------------------------------------------------------------------*/
/*テーブル１行目に入った見出し部分（※caption）*/
.ta1 caption, .ta2 caption {
	/*padding: 5px;	/*ボックス内の余白*/
}
/*ta1共通設定*/
.ta1 {
	/*width: 96%;*/
	margin: 0 2% 30px;
}
.ta1, .ta1 td, .ta1 th{
	padding: 5px 10px;	/*ボックス内の余白*/
}
/*ta1の左側ボックス*/
.ta1 th {
	width: 100px;
}
#public03 .ta1 th {
	width: 100px;	/*幅*/
}
/***********************
横並びを縦並びにするテーブル（横長テーブル）

************************/
.ta_attr {
    margin: 0 2% 0;
  }
/***********************
保有設備ページ
************************/
#facility .ta1{
	margin-bottom:0 ;
}


/*inputボタンにclass="btn"をつけた場合の設定

---------------------------------------------------------------------------*/
#contents input[type="submit"].btn,
#contents input[type="button"].btn,
#contents input[type="reset"].btn {
	font-size: 12px;		/*文字サイズ*/
}

/*その他

****************************************************************************/
.ws,.wl {width: 94%;}
.big1 {font-size: 16px;}
img.fl ,img.fr{width:100% ;margin-right: 5px;margin-bottom: 5px;margin:0 0 30px ;}
/*ul.disc {padding: 0em 0px 20px 18px;}*/
.dis_480{display:inline;}


}