@charset "utf-8";

/*------------------------------------------------------------------------------------------------------------------------------------------------------
slide.cssの読み込み
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@import url(slide.css);

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

/*全体の設定
--------------------------------------------------*/
body {
  margin: 0px;
  padding: 0px;
  color: #333; /*全体の文字色*/
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; /*フォント種類*/
  font-size: 16px; /*文字サイズ*/
  line-height: 2; /*行間*/
  background: #fff; /*背景色*/
  -webkit-text-size-adjust: none;
}
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: normal;
}
ul {
  list-style-type: none;
}
img {
  border: none;
  max-width: 100%;
  height: auto;
  vertical-align: middle;
}
table {
  border-collapse: collapse;
  font-size: 100%;
  border-spacing: 0;
}
iframe {
  width: 100%;
}
video,
audio {
  max-width: 100%;
}

/*リンク（全般）設定
--------------------------------------------------*/
a {
  color: #333; /*リンクテキストの色*/
  transition: 0.5s; /*マウスオン時の移り変わるまでの時間設定。0.5秒。*/
}
a:hover {
  color: #59c2a4; /*マウスオン時の文字色*/
  text-decoration: none; /*マウスオン時に下線を消す設定。残したいならこの１行削除。*/
}

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

/*ヘッダー（ロゴが入った最上段のブロック）
--------------------------------------------------*/
/*ヘッダーブロック*/
header {
  background: #fff; /*背景色*/
  height: 100px; /*高さ*/
  color: #fff; /*文字色*/
}
header a {
  color: #fff; /*リンクテキストの文字色*/
}
/*ロゴ画像*/
header #logo {
  width: 500px; /*ロゴ画像の幅*/
  float: left; /*左に回り込み*/
  margin-top: 32px; /*ロゴの上にあける余白。上下のバランスをここで調整して下さい。*/
  margin-left: 1%; /*ロゴの左側にあける余白。*/
}

/*ヘッダー右側のボタン
--------------------------------------------------*/
header .login a {
  display: inline-block;
  text-decoration: none;
  float: right;
  margin-right: 3%;
  margin-top: 40px;
  border: 1px solid #fe7200;
  background: #fe7200;
  color: #fff;
  padding: 5px 20px 5px 20px;
  border-radius: 4px;
  font-size: 14px;
  box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2);
  letter-spacing: 0.1em;
}

/*メインメニューのブロック
--------------------------------------------------*/
/*メニューブロック*/
#menubar {
  clear: both;
  height: 75px; /*メニューの高さ。下の「#menubar ul li a」の「height」と「padding-top」の数字を合計した数字に合わせる。*/
  text-align: center; /*文字を中央に*/
  background: #59c2a4; /*背景色*/
  border-top: 1px solid #fff; /*上の線の幅、線種、色（古いブラウザ用）*/
  border-bottom: 1px solid #fff; /*下の線の幅、線種、色（古いブラウザ用）*/
  border-top: 1px solid rgba(255, 255, 255, 0.5); /*上の線の幅、線種、255,255,255は白の事で0.5は50%色がついた状態の事。*/
  border-bottom: 1px solid rgba(255, 255, 255, 0.5); /*上の線の幅、線種、255,255,255は白の事で0.5は50%色がついた状態の事。*/
}
/*メニュー１個あたりの設定*/
#menubar li {
  float: left; /*左に回り込み*/
  width: 16.66%; /*メニュー幅（100÷6個=16.66%）　もし４個にするなら100÷4=25%になる。*/
}
#menubar li a {
  text-decoration: none;
  display: block;
  font-weight: bold; /*太字に*/
  line-height: 1.8; /*行間を少し狭く*/
  color: #fff; /*文字色*/
  height: 60px; /*高さ*/
  padding-top: 15px; /*上に追加する余白*/
  border-right: 1px solid #fff; /*メニューの右側の線の幅、線種、色（古いブラウザ用）*/
  border-right: 1px solid rgba(255, 255, 255, 0.5); /*右の線の幅、線種、255,255,255は白の事で0.5は50%色がついた状態の事。*/
}
/*１つ目のメニューへの追加設定*/
#menubar li:first-child a {
  border-left: 1px solid #fff; /*メニューの線の幅、線種、色（古いブラウザ用）*/
  border-left: 1px solid rgba(255, 255, 255, 0.5); /*左の線の幅、線種、255,255,255は白の事で0.5は50%色がついた状態の事。*/
}
/*飾り文字*/
#menubar li span {
  display: block;
  font-size: 9px; /*文字サイズ*/
  font-weight: normal; /*文字を太字でなく標準に戻す設定*/
  letter-spacing: 0.2em; /*文字間隔を少しあける設定*/
  opacity: 0.5; /*透明度50％*/
}
/*マウスオン時、現在表示中(current)のメニューの共通設定*/
#menubar li a:hover,
#menubar li.current a {
  background: #fff; /*背景色*/
  color: #59c2a4; /*文字色*/
}
/*スマホ用メニューを表示させない*/
#menubar-s {
  display: none;
}
/*３本バーアイコンを表示させない*/
#menubar_hdr {
  display: none;
}

/*ドロップダウンメニュー用
--------------------------------------------------*/
/*メニューブロック*/
#menubar ul.ddmenu {
  position: absolute;
  visibility: hidden;
  z-index: 10;
  padding-top: 1px;
  width: 16.66%; /*幅。上の「#menubar li」と合わせる。*/
  font-size: 12px; /*文字サイズ*/
}
/*メニュー１個あたりの設定*/
#menubar ul.ddmenu li {
  float: none;
  width: 100%;
}
#menubar ul.ddmenu li a {
  width: 100%;
  height: auto;
  font-weight: normal;
  border: none; /*線を一旦リセット*/
  border-bottom: 1px solid #fff; /*下の線の幅、線種、色*/
  background: #000; /*背景色（古いブラウザ用）*/
  background: rgba(0, 0, 0, 0.7); /*背景色。0,0,0は黒の事で0.7は70%色がついた状態の事。*/
  color: #fff; /*文字色*/
  padding: 10px 0; /*上下、左右への余白*/
}
/*マウスオン時*/
#menubar ul.ddmenu li a:hover {
  background: #000; /*背景色*/
}

/*fixmenu設定（メニューが画面上部に到達した際のスタイル）
--------------------------------------------------*/
/*上部固定メニュー用fixmenu設定*/
body.is-fixed-menu .nav-fix-pos {
  width: 100%;
  z-index: 100;
  position: fixed;
  top: 0;
  left: 0;
}
body.is-fixed-menu header {
  margin-bottom: 75px; /*メニューの高さを指定。menubarのborderが2px分ありますが大差ないので75でOKです。*/
}
/*上の設定の「is-fixed-menu」を「is-fixed」に変更したものをそのまま記入します。fixmenuスクリプトを２つ使う為に必要な設定になります。*/
body.is-fixed .nav-fix-pos {
  width: 100%;
  z-index: 100;
  position: fixed;
  top: 0;
  left: 0;
}
body.is-fixed header {
  margin-bottom: 75px;
}

/*contents（３カラムを囲むブロック）
--------------------------------------------------*/
#contents {
  clear: both;
  overflow: hidden;
  padding-top: 40px; /*上に空けるボックス内の余白*/
  padding-bottom: 40px; /*下に空けるボックス内の余白*/
}

/*contents-in（mainとsubを囲むブロック）
--------------------------------------------------*/
#contents-in {
  float: left; /*左に回り込み*/
  width: 80%; /*ブロックの幅*/
}
/*２カラム時*/
.c2 #contents-in {
  float: none;
  width: auto;
}

/*mainコンテンツ（中央のブロック）
--------------------------------------------------*/
#main {
  float: right; /*右に回り込み*/
  width: 100%; /*ブロックの幅*/
}
/*mainコンテンツのh2タグ設定*/
#main h2 {
  clear: both;
  margin-bottom: 40px;
  padding: 10px 20px; /*上下、左右への余白*/
  font-size: 18px; /*文字サイズ*/
  color: #fff; /*文字色*/
  background: #59c2a4; /*背景色*/
}
/*h2タグの１文字目への追加設定*/
#main h2::first-letter {
  border-left: 3px solid #fff; /*左の線の幅、線種、色*/
  padding-left: 15px; /*線とテキストとの余白*/
}
/*mainコンテンツのh3タグ設定*/
#main h3 {
  clear: both;
  margin-top: 60px;
  margin-bottom: 30px;
  padding: 4px 20px; /*上下、左右への余白*/
  font-size: 16px; /*文字サイズ*/
  border: 1px solid #ccc; /*枠線の幅、線種、色*/
}
/*h3タグの１文字目への追加設定*/
#main h3::first-letter {
  border-left: 3px solid #59c2a4; /*左の線の幅、線種、色*/
  padding-left: 15px; /*線とテキストとの余白*/
}
/*mainコンテンツの段落タグ設定*/
#main p {
  padding: 0px 20px 20px; /*上、左右、下への余白*/
}

/*mainコンテンツ（追記）
--------------------------------------------------*/
#main p + p {
  margin-top: -5px;
}
#main h2 + p,
#main h3 + p {
  margin-top: -10px;
}
#main section + section {
  margin-top: 30px;
}
#case-box {
  text-align: center;
}
.c2 .list {
  width: 43%;
  padding: 2%;
  margin: 1%;
  display: inline-block;
  text-align: left;
}
#case-box figure {
  text-align: center;
}

/*ボックスの設定
--------------------------------------------------*/
.list {
  position: relative;
  overflow: hidden;
  padding: 25px; /*ボックス内の余白*/
  border: 1px solid #ccc; /*枠線の幅、線種、色*/
  margin-bottom: 20px; /*ボックス同士の上下間に空けるスペース*/
}
/*ボックス内のh4タグ設定*/
.list h4 {
  font-size: 28px; /*文字サイズ*/
  color: #59c2a4; /*文字色*/
  line-height: 1.4; /*行間を少しせまく*/
}
.list h4 a {
  color: #59c2a4; /*リンクテキストの文字色*/
}
/*ボックス内のh5タグ設定*/
.list h5 {
  font-size: 28px; /*文字サイズ*/
  color: #666; /*文字色*/
  line-height: 1.4; /*行間を少しせまく*/
  letter-spacing: 0.2em;
  margin-top: 20px;
  margin-bottom: 20px;
  text-align: center;
}
.taglist {
  position: relative;
  overflow: hidden;
  padding: 8px 0px 3px 10px; /*ボックス内の余白*/
  border: none; /*枠線の幅、線種、色*/
  margin-bottom: -100px; /*ボックス同士の上下間に空けるスペース*/
  margin-top: 50px;
  text-align: right;
}

/*ボックス追加設定*/
.box28 {
  position: relative;
  margin: 1em 10em;
  padding: 3em 1em 1em 1em;
  border: solid 1px #59c2a4;
  border-radius: 10px;
}
.box28 .box-title {
  position: absolute;
  display: inline-block;
  top: -1px;
  left: -1px;
  padding: 0 20px;
  height: 25px;
  line-height: 25px;
  font-size: 17px;
  background: #59c2a4;
  color: #ffffff;
  font-weight: bold;
}
.box28 p {
  margin: 0;
  padding: 0;
}
.box2 {
  padding: 2em 2em 1.2em 2em;
  margin: 2em 10em;
  font-weight: bold;
  color: #6091d3; /*文字色*/
  text-align: center;
  background: #f4faff;
  border: solid 3px #6091d3; /*線*/
  border-radius: 10px; /*角の丸み*/
}
.box2 p {
  margin: 0;
  padding: 0;
}
.box3 {
  padding: 0.5em 1em;
  margin: 2em 0;
  color: #2c2c2f;
  background: #cde4ff; /*背景色*/
}
.box3 p {
  margin: 0;
  padding: 0;
}

.box4 {
  border: solid 1px #999;
  margin: 0px 0px 70px 0px;
  padding: 20px 20px 20px 20px;
  line-height: 2;
}

.box4 p {
  font-size: 85%;
  padding: 0px 0px 0px 0px;
}

/*ボックス内のp(段落)タグ設定*/
.list p {
  padding: 0px 0px 10px !important; /*上、左右、下への余白*/
}
/*ボックス内の写真*/
.list p.img {
  float: left; /*左に回り込み*/
  width: 30%; /*画像の幅*/
  margin-bottom: 20px; /*画像の下に空けるスペース*/
}
/*写真の右側に回り込むブロック*/
.list .text {
  float: right; /*右に回り込み*/
  width: 67%; /*ブロック幅*/
}
/*listブロック内のta1設定*/
.list .ta1,
.list .ta1 td,
.list .ta1 th {
  padding: 5px; /*ボックス内の余白*/
  font-size: 14px; /*文字サイズ*/
}
/*ta1の左側ボックスの文字を太字でなく標準にする*/
.ta1 th {
  font-weight: normal;
}
/*日付(CMS用)*/
.date {
  font-size: 11px; /*文字サイズ*/
  color: #999; /*文字色*/
  text-align: right; /*文字を右寄せ*/
}
.date span {
  display: inline-block;
}

/*list2ボックス
--------------------------------------------------*/
/*ボックス全体の設定*/
.list2 {
  overflow: hidden;
}
/*各ボックスの設定*/
.list2 a {
  display: block;
  text-decoration: none;
  height: 65px; /*ボックスの高さ*/
  overflow: hidden; /*ボックスから飛び出た場合、非表示にする設定*/
  background: linear-gradient(#fff, #f2f2f2); /*背景グラデーション*/
  border-radius: 10px; /*角丸のサイズ*/
  box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.1); /*ボックスの影。右へ、下へ、広げる幅、0,0,0は黒の事で0.1は10%色がついた状態の事。*/
  padding: 15px; /*ボックス内の余白*/
  border: 1px solid #ccc; /*枠線の幅、線種、色*/
}
/*マウスオン時*/
.list2 a:hover {
  background: #fff; /*背景色*/
  box-shadow: none; /*ボックスの影をなくす設定*/
  position: relative;
  left: 1px; /*現在地から右に1px移動する*/
  top: 1px; /*現在地から下に1px移動する*/
}
/*ボックス内の画像。※imgタグにclass="img"をつけた場合。*/
.list2 .img {
  height: 100%; /*高さ*/
  float: right; /*右に回り込み*/
}
/*件数のテキスト。※list2内でspanタグで囲った場合。*/
.list2 span {
  font-size: 28px; /*文字サイズ*/
  color: #59c2a4; /*文字色*/
}

/*3カラム利用時(2019.10.25)--------------------------------------------*/
.col3 {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-bottom: 20px;
}

.col3::after {
  content: "";
  display: block;
  width: 30%;
}

.col3 li {
  width: 30%;
  padding-left: 0;
  margin-top: 0;
  margin-bottom: 0;
  list-style: none;
  background: #fff;
  text-align: center;
  padding: 20px 0;
  border: 1px solid #ccc;
  min-height: 18em;
}

.col3 .banner_company img {
  display: inline-block; /* ここがポイント */
  height: 60px;
  margin-right: 15px;
  margin-bottom: 15px;
  text-align: center;
}
.thumbnail img {
  height: 100%;
}

/*h4タグ*/
.col3 h4 {
  height: 3em;
  margin: 10px 0px;
  font-size: 100%;
  color: #333;
  line-height: 1.4;
}
/*p段落タグ*/
.col3 p {
  font-size: 100%;
  /*  height: 9em;*/
  text-align: left;
}
/*右下の「→」マークを少し小さく設定しなおす*/
.col3 a::before {
  width: 20px;
  line-height: 20px;
  font-size: 12px;
}

/*会員ページ調整(2019.10.31)--------------------------------------------*/
#member00 dl {
  padding: 0px 20px; /*上下、左右へのブロック内の余白*/
  margin-bottom: 20px; /*ブロックの下(外側)に空ける余白*/
}

#member00 dt {
  float: left;
  width: 9em;
  letter-spacing: 0.1em;
}

#member00 dd {
  padding-left: 9em;
  border-bottom: 1px solid #ccc; /*下線の幅、線種、色*/
}

#member00 {
  margin-top: -50px !important;
  padding-top: 50px;
}

#member05 {
  margin-top: -50px !important;
  padding-top: 50px;
}

#member06 {
  margin-top: -50px !important;
  padding-top: 50px;
}

/*会員ページアコーディオン(2019.11.06)--------------------------------------------*/

.accordion-container .accordion-title {
  position: relative;
  padding: 0.5em 2em 0.5em 0.8em;
  background-color: #ddd;
  font-size: 1em;
  font-weight: normal;
  color: #000;
  cursor: pointer;
  border-bottom: 1px solid #fff;
}
.accordion-container .accordion-title:hover,
.accordion-container .accordion-title:active,
.accordion-title.open {
  background-color: #bbb;
}

.accordion-container .accordion-title::before {
  content: "";
  position: absolute;
  top: 50%;
  right: 25px;
  width: 15px;
  height: 2px;
  /*縦線に*/
  transform: rotate(90deg);
  background: #fff;
  transition: all 0.3s ease-in-out;
}

.accordion-container .accordion-title::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 25px;
  /*横線*/
  width: 15px;
  height: 2px;
  background: #fff;
  transition: all 0.2s ease-in-out;
}

.accordion-container .accordion-title.open::before {
  transform: rotate(180deg);
}

.accordion-container .accordion-title.open::after {
  opacity: 0;
}

.accordion-content {
  border: none;
}

/* CSS for CodePen */
.accordion-container {
  margin: 0 auto;
}

#member05 .faq {
  padding: 0 0px 10px; /*上、左右、下へのボックス内余白*/
  margin-bottom: 20px;
}

#member05 .faq dt {
  margin-top: 0px;
}

#member05 .faq p {
  margin-top: 20px;
}

#member05 .faq .accordion-content p {
  margin-top: 20px;
  margin-bottom: 10px;
}

/*subコンテンツ（左側のブロック）
--------------------------------------------------*/
#sub {
  float: left; /*左に回り込み*/
  width: 22.5%; /*ブロックの幅*/
}

/*sideコンテンツ（右側のブロック）
--------------------------------------------------*/
#side {
  float: right; /*右に回り込み*/
  width: 18%; /*ブロックの幅*/
}
/*２カラム時*/
.c2 #side {
  display: none;
}

/*sub,side共通設定
--------------------------------------------------*/
/*h2見出しタグ設定*/
#sub h2,
#side h2 {
  text-align: center; /*文字をセンタリング*/
  border: 1px solid #ccc; /*枠線の幅、線種、色*/
  padding: 8px 0px; /*上下、左右への余白*/
  background: linear-gradient(#fff, #eee); /*グラデーション*/
}
/*段落タグ（p）設定*/
#sub p,
#side p {
  line-height: 1.6; /*行間を少し狭く*/
}

/*box1設定（sub,sideで使っています）
--------------------------------------------------*/
/*box1設定*/
#sub .box1,
#side .box1 {
  border: 1px solid #ccc; /*枠線の幅、線種、色*/
  padding: 10px; /*ボックス内の余白*/
  margin-bottom: 20px; /*ボックスの下にあけるスペース*/
  background: #fafafa; /*背景色*/
}
/*box1の中にsubmenuがある場合の下のmarginをなくす*/
.box1 .submenu {
  margin-bottom: 0 !important;
}

/*submenu（sub,sideのメニュー）
--------------------------------------------------*/
/*メニューブロック全体の設定*/
#sub .submenu,
#side .submenu {
  margin-bottom: 20px; /*メニューブロックの下にあけるスペース*/
  border-top: 1px solid #ccc; /*上の線の幅、線種、色*/
}
/*メニュー１個ごとの設定*/
#sub .submenu li a,
#side .submenu li a {
  text-decoration: none;
  display: block;
  padding: 0 10px; /*上下、左右のボックス内の余白*/
  border: 1px solid #ccc; /*枠線の幅、線種、色*/
  border-top: none; /*上の線を消す設定*/
}
/*h2タグにsubmenuが続いた場合にsubmenuの上の線を消す*/
#sub h2 + .submenu,
#side h2 + .submenu {
  border-top: none;
}

/*sub,sideコンテンツ内のlist-subボックス
--------------------------------------------------*/
/*ボックス１個あたりの設定*/
.list-sub {
  position: relative;
  overflow: hidden;
  border-left: 1px solid #dcdcdc; /*左の線の線種、幅、色*/
  border-right: 1px solid #dcdcdc; /*右の線の線種、幅、色*/
  border-bottom: 1px solid #dcdcdc; /*下の線の線種、幅、色*/
  line-height: 1.5; /*行間を少し狭くする。基本となる値は一番上のbodyにあります。*/
  font-size: 12px; /*文字サイズ*/
}
.list-sub a {
  display: block;
  text-decoration: none;
  overflow: hidden;
  padding: 5px; /*ボックス内の余白*/
}
/*マウスオン時のボックス*/
.list-sub a:hover {
  background: #fff; /*背景色*/
}
/*h4タグ*/
.list-sub a h4 {
  font-weight: bold; /*太字にする設定*/
}
/*段落(p)タグ*/
.list-sub p {
  padding: 0 !important;
}
/*画像*/
.list-sub figure {
  width: 30%; /*画像の幅*/
  float: left; /*左に回り込み*/
  margin-right: 5px; /*画像右側に空ける余白*/
}

/*フッター設定
--------------------------------------------------*/
footer {
  clear: both;
  background: #59c2a4; /*背景色*/
  font-size: 85%; /*文字サイズ*/
  color: #fff; /*文字色*/
}
footer a,
footer a:hover {
  color: #fff; /*リンクテキスト、マウスオン時の文字色*/
}
footer .pr {
  display: block;
  font-size: 12px;
  padding: 5px;
}

/*フッターメニュー
--------------------------------------------------*/
/*ボックス全体*/
#footermenu {
  overflow: hidden;
  padding: 20px 0; /*上下、左右へのボックス内の余白*/
  font-size: 12px; /*文字サイズを少し小さく*/
}
/*１行分の設定*/
#footermenu ul {
  float: left; /*左に回り込み*/
  width: 23%; /*幅。今回は4列作ったのでここの幅23%と下のpadding(合計の2%)でトータル25%になるよう設定。列に応じて調整して下さい。*/
  padding-right: 1%;
  padding-left: 1%;
}
/*見出し*/
#footermenu li.title {
  font-weight: bold; /*太字にする*/
}
/*リンクテキスト*/
#footermenu a {
  text-decoration: none;
  opacity: 0.8; /*透明度。90%色がでた状態の事。*/
}
/*マウスオン時*/
#footermenu a:hover {
  opacity: 1; /*透明度。100%色がでた状態の事。*/
}

/*コピーライト
--------------------------------------------------*/
#copyright {
  clear: both;
  text-align: center;
  background: #333; /*背景色*/
}
#copyright a {
  text-decoration: none;
}

/*トップページ内「更新情報・お知らせ」ブロック
--------------------------------------------------*/
/*ブロック全体の設定*/
#new dl {
  padding: 0px 20px; /*上下、左右へのブロック内の余白*/
  margin-bottom: 20px; /*ブロックの下(外側)に空ける余白*/
}
/*日付設定*/
#new dt {
  float: left;
  width: 9em;
  letter-spacing: 0.1em;
}
/*記事設定*/
#new dd {
  padding-left: 9em;
  border-bottom: 1px solid #ccc; /*下線の幅、線種、色*/
}

/*よくある質問ページ
--------------------------------------------------*/
/*質問と答えのボックス全体を囲むブロック*/
.faq {
  padding: 0 20px 10px; /*上、左右、下へのボックス内余白*/
}
/*質問*/
.faq dt {
  font-weight: bold; /*太字にする設定*/
  color: #59c2a4; /*文字色*/
  margin-top: 30px;
}
/*回答*/
.faq dd {
  padding-bottom: 10px; /*下に空けるスペース*/
}

/*アイコン
--------------------------------------------------*/
/*アイコン共通*/
.icon {
  display: inline-block;
  position: relative;
  bottom: 2px;
  font-size: 11px; /*文字サイズ*/
  padding: 0 5px; /*上下、左右へのボックス内の余白*/
  border-radius: 4px; /*角丸のサイズ*/
  border: 1px solid #ccc; /*枠線の幅、線種、色*/
  background: #eee; /*背景色*/
}
.icon a {
  text-decoration: none;
}
/*アイコン：赤（正社員）*/
.icon.color1 {
  border: 1px solid #d90000; /*枠線の幅、線種、色*/
  background: #d90000; /*背景色*/
  color: #fff !important; /*文字色*/
}
/*アイコン：青（アルバイト）*/
.icon.color2 {
  border: 1px solid #2b2ebc; /*枠線の幅、線種、色*/
  background: #2b2ebc; /*背景色*/
  color: #fff; /*文字色*/
}

/*一覧ページのボックス内の右上のマーク
（CMSの場合は管理ページだと「オプション1」〜のプルダウン、setup.phpだと「オプション選択肢」に関連します）
--------------------------------------------------*/
/*option1〜option3、と、newアイコン共通*/
.option1,
.option2,
.option3,
.new {
  text-align: center;
  display: inline-block;
  font-size: 12px; /*文字サイズ*/
  padding: 0 30px; /*上下、左右へのアイコン内の余白*/
  line-height: 20px; /*高さ*/
  position: absolute;
  right: 25px; /*右から25pxの場所に配置*/
  top: 0px; /*上から0pxの場所に配置*/
}
/*sub,sideコンテンツ内で使う場合の追加（変更）設定*/
#sub .option1,
#sub .option2,
#sub .option3,
#sub .new,
#side .option1,
#side .option2,
#side .option3,
#side .new {
  font-size: 10px; /*文字サイズ*/
  padding: 0 30px; /*上下、左右へのアイコン内の余白*/
  line-height: 16px; /*行間*/
  right: 0px; /*右から0pxの場所に配置*/
  transform: rotate(45deg) translate(22px, -10px); /*45度回転、右へ,下へ(マイナス設定なので上へ向けての指定)の移動距離*/
}
/*option1*/
.option1 {
  color: #fff; /*文字色*/
  background: #5cb85c; /*背景色*/
}
/*option2*/
.option2 {
  color: #000; /*文字色*/
  background: #ffd200; /*背景色*/
}
/*option3*/
.option3 {
  color: #fff; /*文字色*/
  background: #999; /*背景色*/
}
/*new*/
.new {
  color: #fff; /*文字色*/
  background: #f00; /*背景色*/
}

/*求人一覧ページの「詳細を見る・応募する」ボタン（不使用）
--------------------------------------------------*/
a.btn {
  display: block;
  text-decoration: none;
  background: #d90000; /*背景色（古いブラウザ用）*/
  background: linear-gradient(#d90000, #a70000); /*グラデーション*/
  color: #fff; /*文字色*/
  font-size: 20px; /*文字サイズ*/
  text-align: center; /*文字をセンタリング*/
  padding: 10px; /*ボタン内の余白*/
  border-radius: 4px; /*角丸のサイズ*/
  letter-spacing: 0.2em; /*文字間隔を広くとる設定*/
  box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3); /*ボックスの影。右に、下に、広げる幅、0,0,0は黒の事で0.3は色が30%ついた状態。*/
  border: 1px solid #a70000; /*枠線の幅、線種、色*/
}
/*マウスオン時*/
a:hover.btn {
  box-shadow: none;
  background: #fff; /*背景色*/
  color: #a70000; /*文字色*/
}

/*テーブル
--------------------------------------------------*/
/*テーブル１行目に入った見出し部分（※caption）*/
.ta1 caption {
  border: 1px solid #ccc; /*テーブルの枠線の幅、線種、色*/
  border-bottom: none; /*下線だけ消す*/
  text-align: left; /*文字を左寄せ*/
  background: #eee; /*背景色*/
  color: #666; /*文字色*/
  font-weight: bold; /*太字に*/
  padding: 10px; /*ボックス内の余白*/
}
/*ta1設定*/
.ta1 {
  table-layout: fixed;
  width: 100%;
  margin: 0 auto 20px;
  background: #fff; /*背景色*/
  color: #666; /*文字色*/
}
.ta1,
.ta1 td,
.ta1 th {
  word-break: break-all;
  border: 1px solid #ccc; /*テーブルの枠線の幅、線種、色*/
  padding: 10px; /*ボックス内の余白*/
}
/*ta1の左側ボックス*/
.ta1 th {
  width: 140px; /*幅*/
  text-align: center; /*センタリング*/
}
/*labelタグを２列表示にする（CMS用）*/
.ta1.cms td label {
  display: block;
  float: left;
  width: 50%;
}

/*inputボタン
--------------------------------------------------*/
#main input[type="submit"].btn,
#main input[type="button"].btn,
#main input[type="reset"].btn {
  padding: 5px 10px;
  border: 1px solid #ccc;
  font-size: 15px;
  border-radius: 3px;
  background: #eee;
}
/*マウスオン時の設定*/
#main input[type="submit"].btn:hover,
#main input[type="button"].btn:hover,
#main input[type="reset"].btn:hover {
  border: 1px solid #999;
  background: #fff;
}

/*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: 120px; /*幅*/
  line-height: 50px; /*高さ*/
  bottom: 50px; /*下から50pxの場所に配置*/
  right: 5%; /*右から3%の場所に配置*/
  background: #000; /*背景色（古いブラウザ用）*/
  background: rgba(255, 83, 83, 0.6); /*背景色。0,0,0は黒の事で0.6は透明度60%の事。*/
  color: #fff; /*文字色*/
  border: 1px solid #fff; /*枠線の幅、線種、色*/
  animation-name: scroll; /*上のアニメーションで指定しているkeyframesの名前（scroll）*/
  animation-duration: 1s; /*アニメーションの実行時間*/
  animation-fill-mode: forwards; /*アニメーションの完了後、最後のキーフレームを維持する*/
  border-radius: 5px;
}
/*マウスオン時*/
body.is-fixed-pagetop .nav-fix-pos-pagetop a:hover {
  background: #ff8282; /*背景色*/
}

/*トップページのNEWアイコン
--------------------------------------------------*/
.newicon {
  background: #f00; /*背景色*/
  color: #fff; /*文字色*/
  font-size: 70%;
  line-height: 1.5;
  padding: 2px 5px;
  border-radius: 2px;
  margin: 0px 5px;
  vertical-align: text-top;
}

/*トップページの特別なお知らせ
--------------------------------------------------*/
.topix {
  padding: 0.5em 2em !important;
  margin: 2em 0;
  font-weight: bold;
  background: #fff;
  border: solid 2px #3d84a0;
  border-radius: 10px;
}

.topix a {
  font-weight: bold;
  color: #ed7d31;
}

/*セミナーページのセミナー種別アイコン
--------------------------------------------------*/
.seminar01icon {
  background: #337ab7; /*背景色-外部セミナー*/
  color: #fff; /*文字色*/
  font-size: 70%;
  line-height: 1.5;
  padding: 4px 8px;
  border-radius: 3px;
  margin: 0px 0px;
  vertical-align: text-top;
  font-weight: bold;
}

.seminar02icon {
  background: #ed7d31; /*背景色*/
  color: #fff; /*文字色*/
  font-size: 70%;
  line-height: 1.5;
  padding: 4px 8px;
  border-radius: 3px;
  margin: 0px 0px;
  vertical-align: text-top;
  font-weight: bold;
}

.seminar03icon {
  background: #5cb85c; /*背景色-人事労務担当者向け*/
  color: #fff; /*文字色*/
  font-size: 70%;
  line-height: 1.5;
  padding: 4px 8px;
  border-radius: 3px;
  margin: 0px 0px;
  vertical-align: text-top;
  font-weight: bold;
}

.seminar04icon {
  background: #ff9999; /*背景色-産業保健スタッフ向け*/
  color: #fff; /*文字色*/
  font-size: 70%;
  line-height: 1.5;
  padding: 4px 8px;
  border-radius: 3px;
  margin: 0px 0px;
  vertical-align: text-top;
  font-weight: bold;
}

/*会員ページのお役立ち種別アイコン
--------------------------------------------------*/
.taglist_text {
  color: #333; /*文字色*/
  font-size: 80%;
  line-height: 1.5;
  margin-bottom: 4px;
}

.member01icon {
  background: #6abe83; /*背景色-健康管理*/
  color: #fff; /*文字色*/
  font-size: 70%;
  line-height: 1.5;
  padding: 4px 8px;
  border-radius: 3px;
  margin: 0px 0px;
  vertical-align: text-top;
  font-weight: bold;
}

.member02icon {
  background: #859797; /*背景色-人事労務対応*/
  color: #fff; /*文字色*/
  font-size: 70%;
  line-height: 1.5;
  padding: 4px 8px;
  border-radius: 3px;
  margin: 0px 0px;
  vertical-align: text-top;
  font-weight: bold;
}

.member03icon {
  background: #d5544f; /*背景色—ストレスチェック*/
  color: #fff; /*文字色*/
  font-size: 70%;
  line-height: 1.5;
  padding: 4px 8px;
  border-radius: 3px;
  margin: 0px 0px;
  vertical-align: text-top;
  font-weight: bold;
}

.member04icon {
  background: #2ba4a1; /*背景色—健康診断*/
  color: #fff; /*文字色*/
  font-size: 70%;
  line-height: 1.5;
  padding: 4px 8px;
  border-radius: 3px;
  margin: 0px 0px;
  vertical-align: text-top;
  font-weight: bold;
}

.member05icon {
  background: #bc698f; /*背景色—長時間労働*/
  color: #fff; /*文字色*/
  font-size: 70%;
  line-height: 1.5;
  padding: 4px 8px;
  border-radius: 3px;
  margin: 0px 0px;
  vertical-align: text-top;
  font-weight: bold;
}

.member06icon {
  background: #48a1c6; /*背景色—安衛委員会*/
  color: #fff; /*文字色*/
  font-size: 70%;
  line-height: 1.5;
  padding: 4px 8px;
  border-radius: 3px;
  margin: 0px 0px;
  vertical-align: text-top;
  font-weight: bold;
}

.member07icon {
  background: #c49958; /*背景色—労基署対応*/
  color: #fff; /*文字色*/
  font-size: 70%;
  line-height: 1.5;
  padding: 4px 8px;
  border-radius: 3px;
  margin: 0px 0px;
  vertical-align: text-top;
  font-weight: bold;
}

.member08icon {
  background: #a59aca; /*背景色—オフィス環境*/
  color: #fff; /*文字色*/
  font-size: 70%;
  line-height: 1.5;
  padding: 4px 8px;
  border-radius: 3px;
  margin: 0px 0px;
  vertical-align: text-top;
  font-weight: bold;
}

.member09icon {
  background: #4974a5; /*背景色—アーカイブ*/
  color: #fff; /*文字色*/
  font-size: 70%;
  line-height: 1.5;
  padding: 4px 28px;
  border-radius: 0px;
  margin: 0px 0px;
  vertical-align: text-top;
  font-weight: bold;
}

/*checkブロック。赤い注意書きブロックです。
--------------------------------------------------*/
p.check {
  background: #ff0000;
  color: #fff;
  padding: 10px 25px !important;
  margin-bottom: 20px;
}
p.check a {
  color: #fff;
}

/*ul.disc,olタグ
--------------------------------------------------*/
ul.disc {
  list-style: disc;
  padding: 0 20px 20px 40px;
}
ol {
  padding: 0 20px 20px 45px;
}

/*その他
--------------------------------------------------*/
.look {
  background: #eee;
  border: 1px solid #ccc;
  padding: 5px 10px;
  border-radius: 4px;
}
.mt10 {
  margin-top: 10px !important;
}
.mt20 {
  margin-top: 20px !important;
}
.mt30 {
  margin-top: 20px !important;
}
.mt40 {
  margin-top: 40px !important;
}
.mt50 {
  margin-top: 50px !important;
}
.mt80 {
  margin-top: 80px !important;
}
.mt100 {
  margin-top: 100px !important;
}
.mb0 {
  margin-bottom: 0px !important;
}
.mb10 {
  margin-bottom: 10px !important;
}
.mb20 {
  margin-bottom: 20px !important;
}
.mb30 {
  margin-bottom: 20px !important;
}
.mb40 {
  margin-bottom: 40px !important;
}
.mb50 {
  margin-bottom: 40px !important;
}
.mb80 {
  margin-bottom: 80px !important;
}
.mb100 {
  margin-bottom: 100px !important;
}
.clear {
  clear: both;
}
.color1,
.color1 a {
  color: #59c2a4;
}
.pr {
  font-size: 10px;
}
ｆ .wl {
  width: 96%;
}
.ws {
  width: 50%;
}
.c {
  text-align: center;
}
.r {
  text-align: right;
}
.l {
  text-align: left;
}
img.fr {
  float: right;
  margin-left: 10px;
  margin-bottom: 10px;
}
img.fl {
  float: left;
  margin-right: 10px;
  margin-bottom: 10px;
}
.big1 {
  font-size: 24px;
  letter-spacing: 0.2em;
  margin-bottom: 60px;
  margin-top: 60px;
}
.big2 {
  font-size: 28px;
}
.big3 {
  font-size: 24px;
  letter-spacing: 0.2em;
  margin-bottom: 40px;
  margin-top: 60px;
}
.small1 {
  font-size: 0.85em;
  line-height: 1.5;
  margin-left: 1.5em;
}
#sub .big1,
#side .big1 {
  font-size: 12px;
  letter-spacing: normal;
}
.mini1 {
  font-size: 11px;
  display: inline-block;
  line-height: 1.5;
}
.sh {
  display: none;
}
.color0 {
  color: #f00;
}
.color2 {
  color: #666;
}
.color3 {
  color: #6091d3;
}
.color4 {
  color: #59c2a4;
}

/*ボーダー付き*/
.border1 {
  border-bottom: 1px solid #ccc; /*下線の幅、線種、色*/
  margin-top: 2em;
  margin-bottom: 2em;
  font-weight: bold;
}
/*下向き三角形*/
.triangle01 {
  width: 0;
  height: 0;
  border-top: solid 15px #59c2a4;
  border-right: solid 20px transparent;
  border-bottom: solid 1px transparent;
  border-left: solid 20px transparent;
  margin: 10px auto 10px auto;
}
/*下向き三角 アンカー*/
.arrow05 {
  position: relative;
  padding-left: 40px;
}
.arrow05::before {
  position: absolute;
  content: "";
  width: 6px;
  height: 6px;
  border-top: solid 3px #59c2a4;
  border-right: solid 3px #59c2a4;
  -webkit-transform: rotate(135deg);
  transform: rotate(135deg);
  top: 50%;
  left: 0;
  margin-top: -5px;
  margin-left: 22px;
}

/*右向き三角*/
.arrow03 {
  position: relative;
  padding-left: 13px;
}
.arrow03::before {
  position: absolute;
  content: "";
  width: 0;
  height: 0;
  border: solid 6px transparent;
  border-left: solid 8px #59c2a4;
  top: 40%;
  left: 0;
  margin-top: -5px;
}

#main #member01 {
  padding-top: 50px;
  margin-top: -50px;
}
#main #member02 {
  padding-top: 50px;
  margin-top: -50px;
}
#main #member03 {
  padding-top: 50px;
  margin-top: -50px;
}
#main #member04 {
  padding-top: 50px;
  margin-top: -50px;
}
#main #member05 {
  padding-top: 50px;
  margin-top: -50px;
}
#main #member06 {
  padding-top: 50px;
  margin-top: -50px;
}
#main #seminar01 {
  padding-top: 50px;
  margin-top: -50px;
}
#main #seminar02 {
  padding-top: 50px;
  margin-top: -50px;
}
/*トップ＆サービス内容のhタグ*/
#message h4,
#service h4 {
  font-size: 24px;
  color: #59c2a4;
  text-align: center;
  padding: 0px 20px 20px;
  letter-spacing: 0.2em;
  margin-bottom: 30px;
}
.hr1 {
  height: 1px;
  border: none;
  border-top: 1px solid #ccc;
}

/*セミナー・資料ページ　資料に画像表示(2020.12.23)--------------*/
.siryou-img {
  float: left;
  margin-right: 20px;
}
.siryou-img img {
  border: 1px solid;
}

/*セミナー・資料ページ　メディア情報を追加(2024.7.17)--------------*/
#seminar01 dl {
  padding: 0px 20px; /*上下、左右へのブロック内の余白*/
  margin-bottom: 20px; /*ブロックの下(外側)に空ける余白*/
}

#seminar01 dt {
  float: left;
  width: 9em;
  letter-spacing: 0.1em;
}

#seminar01 dd {
  padding-left: 9em;
  border-bottom: 1px solid #ccc; /*下線の幅、線種、色*/
}

#seminar01 {
  margin-top: -50px !important;
  padding-top: 50px;
}

/*セミナー・資料ページ　サムネイル横並び(2025.5.29)--------------*/
.img-flex {
  display: flex;
}

.img-flex li {
  border: 1px solid #ccc;
  margin: 10px;
}

/*セミナー・資料ページの特別なお知らせ(2025.6.27)
--------------------------------------------------*/
.seminar-topix {
  margin: 2em 0;
  font-weight: bold;
background: linear-gradient(transparent 50%, #FF0 40%);
}

/*------------------------------------------------------------------------------------------------------------------------------------------------------
画面幅1301px以上の設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (min-width: 1301px) {
  /*inner共通
--------------------------------------------------*/
  .inner {
    width: 1301px; /*サイトの幅。この指定がないと上部メニューが一瞬段落ちする場合があるので。*/
  }

  /*メインメニューとドロップダウンメニューの設定変更。
メニュー数が6個なので、1301÷6=216pxになります。
--------------------------------------------------*/
  #menubar li,
  #menubar ul.ddmenu {
    width: 216px;
  }
}

/*------------------------------------------------------------------------------------------------------------------------------------------------------
画面幅1300px以下の設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width: 1300px) {
  /*contents（３カラムを囲むブロック）
--------------------------------------------------*/
  #contents {
    margin: 0 1%; /*上下、左右へのコンテンツの外側へ空けるスペース*/
  }
}

/*------------------------------------------------------------------------------------------------------------------------------------------------------
画面幅900px以下の設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width: 900px) {
  /*ヘッダー右側の電話番号ブロック
--------------------------------------------------*/
  /*TELブロック全体*/
  #tel {
    display: none; /*非表示にする*/
  }

  /*ヘッダー右側のボタン
--------------------------------------------------*/
  header .login a {
    margin-top: 85px;
    letter-spacing: 0em;
  }

  /*3カラム部分　（2019.10.29)
--------------------------------------------------*/
  .col3 {
    display: block;
    margin-bottom: 10px;
  }

  .col3 .list {
    float: none;
    width: auto;
    min-height: 0;
    margin: 0 2% 10px;
    padding: 2%; /*ボックス内の余白の上書き*/
    width: 100%; /*幅*/
    margin: 0 2% 10px;
    min-height: 18em;
    text-align: center;
    display: none;
  }

  .col3 .list p {
    height: 4em;
  }

  /*セミナーページ調整　（2024.7.17)
--------------------------------------------------*/
  #seminar01 {
    margin-top: 0px !important;
    padding-top: 0px;
  }

  /*会員ページ調整　（2019.10.31)
--------------------------------------------------*/
  #member00 {
    margin-top: 0px !important;
    padding-top: 0px;
  }

  #member05 {
    margin-top: 0px !important;
    padding-top: 0px;
  }

  .col3 li {
    width: auto;
    margin: 2%;
    margin-bottom: 10px;
    min-height: initial;
    padding: 20px 0 0 0;
  }

  .col3 p {
    height: auto;
    padding: 4% !important;
  }

  #side .box1 {
    margin-top: 20px;
  }

  .taglist {
    position: relative;
    overflow: hidden;
    padding: 3px 0px 7px 5px; /*ボックス内の余白*/

    margin-bottom: -20px; /*ボックス同士の上下間に空けるスペース*/
    margin-top: 0px;
    text-align: right;
    line-height: 2em;
    display: inline-block;
  }

  .no-wrap {
    display: inline-block; /* インラインブロック化 */
  }

  /*アコーディオンのプラスマーク調整*/
  .accordion-container .accordion-title::before {
    content: "";
    position: absolute;
    top: 50%;
    right: 10px;
    width: 15px;
    height: 2px;
    /*縦線に*/
    transform: rotate(90deg);
    background: #fff;
    transition: all 0.3s ease-in-out;
  }

  .accordion-container .accordion-title::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 10px;
    /*横線*/
    width: 15px;
    height: 2px;
    background: #fff;
    transition: all 0.2s ease-in-out;
  }

  /*fixmenu設定（メニューが画面上部に到達した際のスタイル）
--------------------------------------------------*/
  /*fixmenuから折りたたみメニューになるのでリセット。*/
  body.is-fixed-menu header,
  body.is-fixed header {
    margin-bottom: 0px;
  }

  /*メインメニュー
--------------------------------------------------*/
  /*アニメーションのフレーム設定。全100コマアニメーションだと思って下さい。透明(0%)から色を100%出すアニメーション指定。*/
  @keyframes menu1 {
    0% {
      opacity: 0;
    }
    100% {
      opacity: 1;
    }
  }
  /*スマホ用メニューブロック*/
  #menubar-s {
    display: block;
    overflow: hidden;
    position: absolute;
    top: 100px; /*上から100pxの場所に配置*/
    border-top: 1px solid #fff; /*上の線の幅、線種、色*/
    width: 100%;
    z-index: 10;
    animation-name: menu1; /*上のkeyframesの名前*/
    animation-duration: 0.5s; /*アニメーションの実行時間。0.5秒。*/
    animation-fill-mode: both; /*アニメーションの完了後、最後のキーフレームを維持する*/
  }
  /*メニュー１個あたりの設定*/
  #menubar-s li a {
    display: block;
    text-decoration: none;
    padding: 15px 10px 15px 20px; /*上、右、下、左へのメニュー内の余白*/
    border-bottom: 1px solid #fff; /*下の線の幅、線種、色*/
    background: rgba(0, 0, 0, 0.8); /*背景色*/
    font-size: 20px;
    color: #fff; /*文字色*/
  }
  /*英語表記（飾り文字）*/
  #menubar-s li a span {
    display: block;
    font-size: 12px; /*文字サイズ*/
  }
  /*PC用メニューを非表示にする*/
  #menubar {
    display: none;
  }

  /*３本バーアイコン設定
--------------------------------------------------*/
  /*３本バーブロック*/
  #menubar_hdr {
    display: block;
    position: absolute;
    top: 24px; /*上から24pxの場所に配置*/
    right: 3%; /*右から3%の場所に配置*/
    border: 1px solid #59c2a4; /*枠線の幅、線種、色*/
  }
  /*アイコン共通設定*/
  #menubar_hdr.close,
  #menubar_hdr.open {
    width: 50px; /*幅*/
    height: 50px; /*高さ*/
  }
  /*三本バーアイコン*/
  #menubar_hdr.close {
    background: url(../images/icon_menu.png) no-repeat center top/50px;
  }
  /*閉じるアイコン*/
  #menubar_hdr.open {
    background: url(../images/icon_menu.png) no-repeat center bottom/50px;
  }

  /*contents（３カラムを囲むブロック）
--------------------------------------------------*/
  #contents {
    padding: 20px 2%; /*上下、左右へのボックス内の余白*/
  }

  /*main,sub,side,contents-in
--------------------------------------------------*/
  #main,
  #sub,
  #side,
  #contents-in {
    float: none;
    width: auto;
  }

  /*その他
--------------------------------------------------*/
  body.s-n #sub,
  body.s-n #side {
    display: none;
  }
  .sh {
    display: block;
  }
  .pc {
    display: none;
  }

  .box2 {
    padding: 2em 2em 1.2em 2em;
    margin: 2em 1em;
  }
  .box2 p {
    margin: 0;
    padding: 0;
  }
  .box28 {
    padding: 2em 2em 1.2em 2em;
    margin: 1em 1em;
  }
  .box28 p {
    margin-top: 10px;
  }
  .c2 .list {
    width: 80%;
  }
  /*アンカーリンクの表示調整*/
  #main #member01 {
    padding-top: 0px;
    margin-top: 0px;
  }
  #main #member02 {
    padding-top: 0px;
    margin-top: 0px;
  }
  #main #member03 {
    padding-top: 0px;
    margin-top: 0px;
  }
  #main #member04 {
    padding-top: 0px;
    margin-top: 0px;
  }
  #main #member05 {
    padding-top: 0px;
    margin-top: 0px;
  }
  #main #member06 {
    padding-top: 30px;
    margin-top: 0px;
  }
  #main #seminar01 {
    padding-top: 0px;
    margin-top: 0px;
  }
  #main #seminar02 {
    padding-top: 0px;
    margin-top: 0px;
  }
}

/*------------------------------------------------------------------------------------------------------------------------------------------------------
画面幅480px以下の設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width: 480px) {
  /*全体の設定
--------------------------------------------------*/
  body {
    font-size: 12px; /*文字サイズ*/
    line-height: 1.5; /*行間*/
  }

  /*ヘッダー右側のボタン
--------------------------------------------------*/
  header .login a {
    margin-top: 20px;
  }

  /*ヘッダー（ロゴが入った最上段のブロック）
--------------------------------------------------*/
  /*ヘッダーブロック*/
  header {
    height: 70px; /*高さ*/
  }
  /*ロゴ画像*/
  header #logo {
    width: 300px; /*ロゴ画像の幅*/
    margin-top: 20px; /*ロゴの上にあける余白。上下のバランスをここで調整して下さい。*/
  }

  /*メインメニュー
--------------------------------------------------*/
  /*スマホ用メニューブロック*/
  #menubar-s {
    top: 70px; /*上から70pxの場所に配置*/
  }

  /*３本バーアイコン設定
--------------------------------------------------*/
  /*３本バーブロック*/
  #menubar_hdr {
    top: 9px; /*上から9pxの場所に配置*/
  }

  /*mainコンテンツ
--------------------------------------------------*/
  #main h2,
  #main h3 {
    font-size: 14px;
    padding-left: 10px;
    padding-right: 10px;
    margin-top: 30px;
  }
  /*段落タグ設定*/
  #main p {
    padding: 0px 10px 15px;
  }

  /*ボックスの設定
--------------------------------------------------*/
  .list {
    margin: 2% !important;
    padding: 4% !important;
    float: none !important;
    width: auto !important;
    box-shadow: none;
    border-top: 1px solid #ccc;
  }
  .list:last-of-type {
    border-bottom: 1px solid #ccc;
    margin-bottom: 20px !important;
  }
  /*ボックス内のh5タグ設定*/
  .list h5 {
    font-size: 150% !important;
  }
  /*ボックス内のh4タグ設定*/
  .list h4 {
    font-size: 16px; /*文字サイズ*/
    color: #59c2a4; /*文字色*/
    line-height: 1.4; /*行間を少しせまく*/
  }
  .box2 {
    padding: 2em 2em 1.2em 2em;
    margin: 2em 1em;
  }
  .box2 p {
    margin: 0;
    padding: 0;
  }
  .box28 {
    padding: 2em 2em 1.2em 2em;
    margin: 1em 1em;
  }
  .box28 p {
    margin-top: 10px;
  }

  /*list2ボックス
--------------------------------------------------*/
  /*各ボックスの設定*/
  .list2 a {
    padding: 5px 10px; /*上下、左右へのボックス内の余白*/
  }
  /*件数のテキスト。※list2内でspanタグで囲った場合。*/
  .list2 span {
    font-size: 18px; /*文字サイズ*/
  }

  /*submenu（sub,sideのメニュー）
--------------------------------------------------*/
  /*メニュー１個ごとの設定*/
  #sub .submenu li a,
  #side .submenu li a {
    padding: 10px; /*ボックス内の余白*/
  }

  /*アイコン
--------------------------------------------------*/
  /*アイコン共通*/
  .icon {
    font-size: 9px; /*文字サイズ*/
  }

  /*一覧ページのボックス内の右上のマーク
（CMSの場合は管理ページだと「オプション1」〜のプルダウン、setup.phpだと「オプション選択肢」に関連します）
--------------------------------------------------*/
  /*option1〜option3、と、newアイコン共通*/
  .option1,
  .option2,
  .option3,
  .new {
    font-size: 9px; /*文字サイズ*/
    padding: 0 10px; /*上下、左右へのアイコン内の余白*/
    line-height: 14px; /*高さ*/
    right: 15px; /*右から15pxの場所に配置*/
  }

  /*トップページ内「更新情報・お知らせ」ブロック
--------------------------------------------------*/
  /*ブロック全体の設定*/
  #new dl {
    padding-left: 10px;
    padding-right: 10px;
  }

  /*求人一覧ページの「詳細を見る・応募する」ボタン
--------------------------------------------------*/
  a.btn {
    font-size: 16px; /*文字サイズ*/
    letter-spacing: normal; /*文字間隔を標準に戻す*/
  }

  /*テーブル(ta1)
--------------------------------------------------*/
  /*余白の上書き*/
  .ta1 caption,
  .ta1 th,
  .ta1 td {
    padding: 5px;
  }
  /*テーブル内の左側*/
  .ta1 th {
    width: 100px;
  }
  /*labelタグを1列にする（CMS用）*/
  .ta1.cms td label {
    float: none;
    width: 100%;
  }

  /*フッターメニュー
--------------------------------------------------*/
  #footermenu ul {
    width: 100%;
  }

  /*その他
--------------------------------------------------*/
  .ws,
  .wl {
    width: 94%;
  }
  .big1 {
    font-size: 18px;
    letter-spacing: normal;
  }
  .big2 {
    font-size: 18px;
    letter-spacing: normal;
  }
  .big3 {
    font-size: 18px;
    letter-spacing: normal;
  }
  img.fr,
  img.fl {
    float: none;
    margin: 0;
    width: 100%;
  }
  .sh {
    display: block;
  }
  .pc {
    display: none;
  }

  /*トップ＆サービス内容のhタグ*/
  #message h4,
  #service h4 {
    font-size: 16px;
  }

  /*セミナー・資料ページ　資料に画像表示(2020.12.23)--------------*/
  .siryou-img {
    float: none;
    margin-bottom: 10px;
  }
}

/*------------------------------------------------------------------------------------------------------------------------------------------------------
画面幅360px以下の設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width: 360px) {
  /*list2ボックス
--------------------------------------------------*/
  /*各ボックスの設定*/
  .list2 li {
    float: none;
    width: auto; /*１列にする設定*/
    margin: 0 0 10px; /*上、左右、下に空けるボックスの外側の余白。*/
  }
  .list2 li a {
    height: auto;
  }
  /*ボックス内の画像。※imgタグにclass="img"をつけた場合。*/
  .list2 .img {
    height: auto; /*高さをリセット*/
    width: 20%; /*幅の指定に変更*/
  }
}