
/* 共通ヘッダ */
.zai-header2 { max-width : 1000px; margin : 0 auto; }
.zai-header2 div { display : inline-block; float : left; }
.zai-header2 div:last-child { float : right; }
.zai-header2 div#logo img { width : 100%; max-width : 460px; }
.zai-header2 div#contact img { width : 100%; max-width : 370px; }

/* トップ画面のメインバナー */
.zai-top-header2
{
  margin: 0 auto;
  position: relative;
  width:100%;
  background-color: #F0F0F0;
}

.zai-top-header2 > img
{
  display : block;
  max-width : 100%;
  margin : 0 auto;
  padding : 4px 0;
}

/* トップ画面のサイドメニュー下のアクセスカウンターと外部リンク */
div.accesscounter, div.linkbanner { text-align:center; }

/* トップ画面のお知らせ・新着情報 */
.news td.new { min-width : 45px; }
.news td.date { width : 6em; }
.zai-layout-cell.layout-item-list.full.scrollbox{padding : 0 0 !important;}
div.news-bkcolor { background-color : #fffcf5; font-weight:normal; padding : 5px 10px; }

/* drawerメニュー */
#nav-content > ul.zai-rmenu li
{
  padding-left : 1em;
}

.zai-rmenu a,
.zai-rmenu a:link,
.zai-rmmenu a.visited,
.zai-rmenu a.active,
.zai-rmenu a.hover
{
  text-decoration : none;
}

/* ハンバーガーメニュー */
#nav-drawer {
  position: relative;
}

/*チェックボックス等は非表示に*/
.nav-unshown {
  display:none;
}

/*アイコンのスペース*/
#nav-open {
  display: inline-block;
  width: 30px;
  height: 22px;
  vertical-align: middle;
  margin-top : 22px;
  margin-left : 4px;
}

/*ハンバーガーアイコンをCSSだけで表現*/
#nav-open span, #nav-open span:before, #nav-open span:after {
  position: absolute;
  height: 3px;/*線の太さ*/
  width: 25px;/*長さ*/
  border-radius: 3px;
  background: #555;
  display: block;
  content: '';
  cursor: pointer;
}
#nav-open span:before {
  bottom: -8px;
}
#nav-open span:after {
  bottom: -16px;
}
/*閉じる用の薄黒カバー*/
#nav-close {
  display: none;/*はじめは隠しておく*/
  position: fixed;
  z-index: 99;
  top: 0;/*全体に広がるように*/
  left: 0;
  width: 100%;
  height: 100%;
  background: black;
  opacity: 0;
  transition: .3s ease-in-out;
}
/*中身*/
#nav-content {
  overflow: auto;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;/*最前面に*/
  width: 90%;/*右側に隙間を作る（閉じるカバーを表示）*/
  max-width: 330px;/*最大幅（調整してください）*/
  height: 100%;
  background: #fff;/*背景色*/
  transition: .3s ease-in-out;/*滑らかに表示*/
  -webkit-transform: translateX(-105%);
  transform: translateX(-105%);/*左に隠しておく*/
}

/*チェックが入ったらもろもろ表示*/
#nav-input:checked ~ #nav-close {
  display: block;/*カバーを表示*/
  opacity: .5;
}

#nav-input:checked ~ #nav-content {
  -webkit-transform: translateX(0%);
  transform: translateX(0%);/*中身を表示（右へスライド）*/
  box-shadow: 6px 0 25px rgba(0,0,0,.15);
}
/* drawerメニューここまで */


/* 各画面のメイン部のブロック */
.zai-layout-cell { box-sizing: border-box; }
div.full { width : 100%; }
div.half { width : 50%; }

/* 進捗状況の矢印が表示されている見出し(求人情報を見る、など) */
.zai-post .step-n { width : 100%; clear : both; overflow : hidden; }
.zai-post .step-n > h2 { float : left; }
.zai-post .step-n > .status { float : right; margin-top : 14px; }

/* トップ画面他のリンクのアイコン */
img.icon { float : left; margin-bottom : 10px; margin-right : 10px; }

/* トップページの「お知らせ」「新着情報」 */
.scrollbox { overflow-x : hidden; overflow-y : auto; }
.scrollbox > div.news { max-height : 300px; }

/* すべて表示/隠す */
div.more
{
  text-align : right;
}

/* トップページの各リンクの説明 */
p.content { min-height : 100px; }

/* 画像(横幅一杯) */
img.fullsz
{
  max-width : 100%; /* 親要素の幅に追従するが、最大幅は画像の実サイズとなる。*/
  /* ここで width : 100%; を入れると親要素の幅に追従するだけで、max-widthが効かない */
}

/* アイコン付き見出し(アイコン画像はIDで個別に指定) */
div.contents_header > h1
{
  display : table-cell;
  vertical-align : middle;
  width : 100%;
  height : 50px;
  padding : 4px;
  padding-left : 62px;
  background-size : 50px 50px;
  background-repeat : no-repeat;
  background-position : 4px center;
}
#dlcenter { background-image : url('./images/download_s.png'); }  /* ダウンロードセンター */
#touzaidan { background-image : url('./images/outline_s.png'); }  /* 当財団について */
#yokuaru { background-image : url('./images/question_s.png'); }  /*  よくあるお問い合わせについて */

#icon-women { background-image : url('./images/doctor_women_s.png'); }  /* 北海道女性医師バンク */
#icon-member { background-image : url('./images/member_s.png'); }  /* 賛助会員募集 */
#icon-links { background-image : url('./images/link_s.png'); }  /* 関連リンク */
#icon-mail { background-image : url('./images/mail_inquiry_s.png'); }  /* メールフォーム */
#icon-inquiry { background-image : url('./images/inquiry_s.png'); }  /* お問い合わせ */

/* 入力フォーム -----------------------------------------------*/
div.register * { padding : 0; margin : 0; } /* いったんクリア */
input, select, textarea { margin : 0; } 

/* 入力項目 */
.register dl
{
  overflow: hidden;
  background: #ffffff;
  /*width: calc(100% - 16px);*/ /*calc(100% - 16px); */
  margin : 8px auto;
  padding : 6px;
}

/* 見出し */
.register dt
{
  box-sizing: border-box;
  width: 24%;
  float: left;
  padding : 6px 4px 10px;
  vertical-align : top;
  font-weight : 100;
}

.register dt.closed_header
{
  background-color: #F6F6F6;
}

.register dt.open_header
{
	color: #2667F2;
	background-color: #DFF0FF;
}

.register dd
{
  box-sizing : border-box;
  width : 76%;
  margin-left: 24%;
  padding : 4px;
}

.register dd:after
{
  display: block;
  content: "";
  clear: both;
}

.register dd > p { margin-bottom : 4px; } 
.register dd > p:last-child { margin-bottom : 0; }

.register dl dl { margin : 0; padding : 0;  }
.register dl dl > dt { width : 100%; }
.register dl dl > dt:before { content : '['; }
.register dl dl > dt:after { content : ']'; }
.register dl dl > dd { width : 100%; margin-left : 0; }
.register dl dl > dd > label { display : inline-block; text-align : right; padding-right : 4px; }
.register .tel { width : 15em !important; max-width : calc(100% - 4.0em); }

/* 必須項目 */
dt.necessary:before
{
  content : '※';
  color : #ff0000;
}

/* ガイド */
div.comment2 { padding-left : 1.0em; }

/* 見出しの補足事項 */
span.caption { font-size : 14px; }

.zai-postcontent ul>li { padding : 0; }
.zai-postcontent ul>li, .zai-post ul>li, .zai-textblock ul>li { overflow-y : visible; } /* 2020.06.18 add by ayumi */
.zai-postcontent, .zai-postcontent li { text-align : left; } /* style.css l.76の「text-align:justify」を打ち消すため・・・ */

/* ul.hlist > li { margin-block-start : 0; margin-block-end  : 0;  } */
/* 横並びのリスト */
ul.hlist { list-style-type : none; margin : 0 0 0 10px; padding : 0; }
ul.hlist > li::before { content : ''; } /* script.jsでlist-style-typeを設定するのでそいつを消してやる */
ul.hlist > li { display : inline-block; padding-right : 12px; margin : 2px auto; }
ul.hlist > li.br { display : block; }

/* 縦並びのリスト */
ul.vlist { list-style-type : none;  margin : 0 0 0 10px; padding : 0; }
ul.vlist > li::before { content : ''; }
ul.vlist > li { width : 100%; line-height : 2.0em; padding : 2px 0; }
ul.vlist > li:first-child { padding-top : 0; }
ul.vlist > li:last-child { padding-bottom : 0; }

ul.vlist ul.hlist { display : inline-block; }

/* 日付色々 */
li.year > input { width : 4.0em !important; margin-right : 4px !important; }
li.year_s > input { width : 2.0em !important; margin-right : 4px !important; }
li.month > input { width : 2.0em !important; margin-right : 4px !important; }
li.day > input { width : 2.0em !important; margin-right : 4px !important; }

/* 専門科目、科目 */
ul.kamoku > li { width : 6em; /*padding : 2px 1em;*/ margin : 0; line-height : 32px; vertical-align : middle; }
ul.kamoku > li:last-child { width : auto; }

/* 年収 */
ul.salary > li input { width : 4em !important; }

ul.btns { display : table; margin : auto; box-sizing: border-box; }
ul.btns li { margin : 10px 8px; padding-left : 10px; padding-right : 10px; }
ul.btnm4px li { margin : 4px 8px; }
ul.btnm10px li { margin : 10px 8px; }

/* フォーム部品 */
div.register input[type="text"],
div.register input[type="number"],
div.register input[type="tel"],
div.register input[type="email"]
{
  box-sizing: border-box;
  margin : 0;
  padding : 2px;
  width : 98%;
  max-width : 100%;
}

input[type="number"],
input[type="tel"],
input[type="email"]
{
   background: #F9FAFB;
   -webkit-border-radius:3px;
   -moz-border-radius:3px;
   border-radius:3px;
   border:1px solid #90C1CB;
   margin:0 auto;
}
/*
input[type="number"]
{
   width: 100%;
   padding: 3px 0;
   color: #274C53 !important;
}
*/
/*
form.zai-search input[type="number"]
{
   background: #F9FAFB;
   border-radius: 0;
   margin:0 auto;
   width: 100%;
   padding: 0 0;
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
   box-sizing: border-box;
   color: #274C53 !important;
}
*/

div.register input[type="number"]:hover,
div.register input[type="tel"]:hover,
div.register input[type="email"]:hover
{
	background-color: #FDEED5;
}

div.register input[type="number"]:focus,
div.register input[type="tel"]:focus,
div.register input[type="email"]:focus
{
	background-color: #FFFFA3;
	border:1px solid #FF5E19;
}

div.register textarea
{
  box-sizing: border-box;
	margin : 0 0 6px;
  padding : 2px;
  width : 98%;
  max-width : 100%;
  resize : none;
}

/* プルダウン */
div.register select
{
  box-sizing: border-box;
	/* margin : 6px; 2020.06.18 */
  padding : 2px;
  width : auto;
}

/* inputの横幅定義(基本sizeに依存) */
input[size="1"] { width : 2.0em !important; } 
input[size="2"] { width : 2.0em !important; } 
input[size="3"] { width : 3.6em !important; } 
input[size="4"] { width : 4.0em !important; }
input[size="6"] { width : 6.5em !important; }
input[size="10"] { width : 10.0em !important; }
input[size="15"] { width : 13.0em !important; }
input[size="20"] { width : 20em !important; max-width : 98% !important; }
input[size="25"] { width : 20em !important; max-width : 98% !important; }
input[size="30"] { width : 30em !important; max-width : 98% !important; }

/* 汎用的な幅の定義 */
.w3em { width : 3.0em; }
.w4em { width : 4.0em; }

/* 改行させたくないところ */
.nowrap { white-space : nowrap; }

/* placeholderのフォントサイズ */
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { font-size : 0.8em; }
input:-moz-placeholder, textarea:-moz-placeholder { font-size : 0.8em; }
input::-moz-placeholder, textarea::-moz-placeholder { font-size : 0.8em; }
input:-ms-input-placeholder, textarea:-ms-input-placeholder { font-size : 0.8em; }

/* 送信確認ダイアログ */
#printarea { padding : 8px; }
#printarea h2
{
  border-left : 4px solid #aed0ea;
  border-bottom : 2px solid #aed0ea;
  padding-left : 5px;
}
#printarea dl { box-sizing : border-box; padding-left : 1em;  }
#printarea dl > dt { box-sizing : border-box; width : 30%; float : left; font-weight : bold; color : #696969;  }
#printarea dl > dd { box-sizing : border-box; width : 70%; margin-left : 30%; word-break: break-all; }

.hide { display : none; }
.confirmmsg { padding : 8px 1em; }

table.vtable { margin : auto auto; } /* センタリング */

/* for PC */
@media (min-width : 1000px )
{
    #nav-drawer { display : none; }
    .register .caption { display : block; }
}

/* for Tablet */
@media (max-width : 999px )
{
    body { min-width : initial; }
    #zai-main { width : 100%; }
    .zai-sheet { width : 100%; }
    .zai-sidebar1 { display : none; }
    .zai-footer-inner { width : 100%; }
}

/* fot smartphone? */
@media (max-width : 750px )
{
  body { min-width : initial; }
  #zai-main { width : 100%; }
  .zai-header2 { width : 100% !important; }
  .zai-header2 div#logo { width : 88%; }
  .zai-header2 div#contact { width : 70%; }
  .zai-nav { display : none; }
  .zai-sheet { width : 100%; }
  .zai-sidebar1 { display : none; }
  .zai-footer-inner { width : 100%; padding-left : 0; padding-right : 0; margin-right : 0; }

  #sidebar-footer > div { margin : 8px; }

  .statune tr, .vtable tr { display:block; }
  .statune td, .vtable td { display:block; width : 100% !important; box-sizing : border-box; }

  div.half { display : inline-block; width : 100%; }
  div.half td { padding-right : 20px; }

  /* お知らせ・新着情報の1行目の説明は隠す(テーブルの外に出す) */
  /*div.news table tr:first-child { display : none; }*/

  /* お知らせ・新着情報はノーマルでは5件表示 */
  .scrollbox > div.news { max-height : none; height : auto; }
  td.new { display : none; }
  div.news table tr:nth-child(n+5) { display : none; }

  .zai-content .zai-postcontent-0 .zai-content-layout-row > .r {
    border-left-style : none !important;
    border-top: 1px solid #cfcfcf;
  }
  .zai-content .zai-postcontent-0 .layout-item-6 { padding : 4px !important;  } /* いらないかも・・・ */
  .register dt { width : 100%; }
  .register dd { width : 100%; margin-left : 0; padding-top : calc(1em + 28px); }
  .register dl dl > dd { padding-top : 4px; }

  /* 進捗状況の矢印が表示されている見出し(求人情報を見る、など) */
  .zai-post .step-n > h2 { margin-bottom : 8px; }
  .zai-post .step-n > .status { float : right; width : 100%; text-align : center; margin : 0 auto; }

  #printarea dl > dt { width : 100%; }
  #printarea dl > dd { width : 100%; margin-left : 0; }

  ul.hlist > li.br { display : inline-block; }

  /* 横並びボタン */
  ul.btnm4px li { width : 90%; text-align : center; }

  /* 定款 */
  div.statune td.header { width : 100%; }
  div.statune td.chapter { width : 100%; text-align : left; }

  /* 一覧 */
  .zai-postcontent .list { overflow : auto; }
}

@media print
{
  header, nav, footer, .zai-sidebar1, #entrymode, .zai-postmetadataheader, .confirmmsg, .btns * { display : none; }
}
