@charset"UTF-8";

/*  ↓すべてのページに適用  */

/*  フォントをゴシックにする  */
  body {font-family : sans-serif;}

/*  nav要素のli項目をパンくずリスト化する  */
  nav li{ display:inline; }
  nav li::after{ content: ">"; padding-left: 7px;}
  nav li:last-child::after{ content: none;}

/*  nav要素の下に実線で太さ1ピクセルの青線を引く  */
  nav {border-bottom: solid 1px mediumblue;}

/* テーブル内の見出し欄（th欄）の文字サイズを1.3倍にする　*/
  th { font-size: 1.3em;}

/*   ｈ４要素の項目に背景色(薄青)をつけて左右に50px余白を設ける  */
  h4  {background-color: #e6e6fa; margin-left: 50px; margin-right: 50px;}

/*   p要素の左に70px、右に50px余白を設ける  */
   p   {margin-left: 70px; margin-right: 50px;}

/*   koumoku要素内のpoint_pic要素をフロート表示して左寄せ（左余白50px）する　*/
/*   業務概要で使用　*/
   .koumoku {overflow: hidden;}
   .point_pic {float : left ;  margin-left: 50px;}


/* ここから下はスマホ（画面幅767px以下）のための設定です　*/
  @media screen and (max-width : 767px) {

/*  id="bosyu"要素の画像（118と職員募集ボタン）をそれぞれ画面幅の25％に縮小（２つで50%幅） */
     #bosyu img {width: 25%; }

/* nav要素の画像（リンクボタン）をそれぞれ画面幅の18％に縮小（５つで90%幅） */
     nav img {width: 18%; }

/* img要素（画像）を画面幅に収める。但し航路標識位置図(id="nav_map")のみ原寸とする*/
     img { max-width:100%; heigth: auto;}
    #nav_map img{ min-width: 800px; }

/* ｈ４要素と p要素の左右の余白をなしにする*/
     h4,p  { margin-left: 0px; margin-right: 0px;}

/*   point_pic要素をフロート表示して左寄せ（左余白なし）する　*/
/*   業務概要で使用　*/
   .point_pic {float : left ;  margin-left: 0px; }

/* テーブル幅を100％に広げる*/
     table { width: 100%;}

/* th要素（テーブルの見出し欄）とfooter要素（フッター）の文字サイズを0.8倍にする　*/
     th { font-size: 0.8em;}
     footer { font-size: 0.8em;}

/* h1要素の文字サイズ拡大率1.5倍のところやや下げて1.3倍とする　*/
     h1 { font-size: 1.3em;}

     }
/* ↑この ｝ は必須ですので消さないで　*/
