@charset "Shift_JIS"; body{ /* background-color: #fefde2; */ } /* 一番外枠 */ div#site-box { width: auto; height:auto; /* 1画面に収まるようにしないと、カレンダーで次月ボタン押したときに、画面全体で移動してしまう */ margin: 0 auto; } /* ------------------------------------------------------------------------ */ /* ヘッダー外枠　図書館ロゴなど */ div#header { width: 100%; } /* ------------------------------------------------------------------------ */ /* ヘッダー、メニュー、コンテンツ、フッターそれぞれの外枠のすぐ内側の枠 */ div.inner { width: 1000px; /* background-color : #ffffff; */ margin-left : auto; margin-right : auto; } /* ------------------------------------------------------------------------ */ /* コンテンツ部分外枠 */ div#contents{ width: 1000px; margin-left : auto; margin-right : auto; } /* ------------------------------------------------------------------------ */ /* お知らせ等indexメニュー関係 */ /* flexコンテナ：親要素 */ .container{ display:flex; /* フレックスボックスを有効にする */ 　 width: 900pxpx; } /* 子要素の水平方向の位置を指定する */ .kintou{ justify-content: space-between;/* 要素の間にスペースを均等に配置 */ padding-left: 2%; padding-right: 2%; } /* 横幅の指定 */ .item{ width:32%; } /* お知らせ部分 flexコンテナ子要素 */ .news { width: 66%; height:auto; font-weight :500; } /* ------------------------------------------------------------------------ */ /* メイン部分(左)flexコンテナ子要素 */ .left { } /* ------------------------------------------------------------------------ */ /* メイン部分(真ん中)flexコンテナ子要素 */ .center { } /* ------------------------------------------------------------------------ */ /* メイン部分(右)flexコンテナ子要素 */ .right { } /*　・・・・・・・・indexのみ・・・・・・・・・・・ */ /* indexメニューバー */ h2.indexbar{ font-size: 25px; font-weight :1000; color: #fcfcfc;/* 文字色 */ padding-left:10px;/* 左余白 */ line-height:40px; /* 背景色の高さ */ background-repeat: no-repeat; background-color: #59a4e0;/* 背景色 */ } /* お知らせの外枠 */ dl.osirase{ /* border-bottom: 1px dotted #b4dbea; */ margin: 10px; font-size: 14px; font-weight :500; height: 320px; /* お知らせ内容部分がこの長さをはみ出さないように */ overflow: auto; /* 上の長さをはみ出たらスクロールバーが出る(＝auto) */ } /* お知らせ日付 */ dt.date{ float: left; clear: left; width: 80px; padding: 10px; color:#2A2A2A; } /* お知らせ内容 */ dd.osirasemain{ margin-left:95px; padding: 10px; color:#2A2A2A; } /* ・・・・・・・・index以外全部・・・・・・・・・・・ */ /* 各ページタイトル 章 */ h2{ font-size: 40px; font-weight :1000; /*color: #00ffff;*/ } /* 節 */ h3{ font-size: 20px; font-weight :1000; padding-left:10px; line-height:30px; /* 背景色の高さ */ background-repeat: no-repeat; font-size: 20px; color: #fcfcfc; background-color: #59a4e0; } /* 項 */ h4{ font-size: 16px; font-weight :1000; } /* 本文　本文は全てこれに統一するなら、p class＝honbunは外す！ */ p.honbun{ color: #2A2A2A; font-size: 15px; font-weight :500; } li { /*width: 20%; 項目の横幅（100÷6の％） */ padding: 0px; /* 内側の余白*/ float: center; /* ★先頭から順に中央となるように*/ display: inline-block; /* ★横並びに配置する */ list-style-type: none; /* ★リストの先頭記号を消す */ position: relative; /* ★表示の基準位置にする */ } /* オンマウス時の動き */ #p a:hover { color:#0C58A6; } /* 利用案内の中の表 */ table.annai{ border-collapse: collapse; margin-left: 45px; } td.annai{ border: solid 1px #9fb6c5; width:auto; height:30px; padding-left:10px; padding-right:10px; background:#fcfcfc; } /* ------------------------------------------------------------------------ */ /* フッター外枠 */ div#footer { width: 100%; clear: both; background-color: #b4dbea; font-size: 14px; font-weight :500; } /* ------------------------------------------------------------------------ */ /* -----------確認で分かりやすくするために出してる------------------------------- */ /* iframe { border: 1px solid; } */ /* --------スマホで文字が大きくなる対処--------- */ body { -webkit-text-size-adjust: 100%; } /* --htmlので、“スマホで勝手に文字が大きくなる対処、footerが半分で切れるが、切れないようにする【width=960(907以上であればOK)】と、文字サイズが大きくなる”も設定してる */