@charset "utf-8";


/* =============================================================

　　個別設定：白黒設定

============================================================= */


/*  TOP : トップページ 設定
--------------------------------------------------------------*/

/*  Content Top
-----------------------------------*/

.inverse-black .home #contentTop {
}

/* -------- メインビジュアル -------- */


/* ---- コントロール ---- */

.inverse-black .boxMainVisual .bx-controls {
  background: #000 !important;
  background: #000\9 !important;/* IE8用 */
}

/* IE9用 */
body:not(:target) .inverse-black .boxMainVisual .bx-controls {
  background: #000\9 !important;
}

/* -- コントロール・ページング -- */

.inverse-black .boxMainVisual .bx-pager .bx-pager-item a {
  border: 1px solid #fff;
}

/* -------- 初めての方へ -------- */

.inverse-black .boxMainVisual .boxGuide .boxGuideInner {
  background: #000 !important;
  background: #000\9 !important;/* IE8用 */
}

/* IE9用 */
body:not(:target) .inverse-black .boxMainVisual .boxGuide .boxGuideInner {
  background: #000\9 !important;
}

.inverse-black .boxMainVisual .boxGuide .btnHowToUse a {
  border: 1px solid #fff;
  box-shadow: none;
  background-color: #000;
  color: #fff;
  text-shadow: none;
}

.inverse-black .boxMainVisual .boxGuide .btnHowToUse a:hover,
.inverse-black .boxMainVisual .boxGuide .btnHowToUse a:focus {
  background-color: #000;
}

/* -------- お問い合わせボタン -------- */

.inverse-black .boxMainVisual .btnContactBnr a {
  box-shadow: none;
}

/* -------- カテゴリーリスト -------- */

.inverse-black .boxCategoryList {
  background: none;
}

.inverse-black .boxCategoryList a:hover,
.inverse-black .boxCategoryList a:focus {
  color: #fff !important;
}


/*  Content Main
-----------------------------------*/

.inverse-black .home #contentMain {
}

/*  メイン 設定
-----------------------------------*/

/* -------- 新着情報 -------- */

.inverse-black .boxInfoTab {
  background: #fff;
}

/* ------ Tab Content Wrap ------ */

.inverse-black .boxInfoTab .boxTabContentWrap {
  border-color: #fff;
  background-color: #000;
}

/* ---- Tabボタン ---- */

.inverse-black .boxInfoTab .boxBtnArea li span {
  border-color: #000;
  border-bottom-color: #fff;
  background-color: #fff;
  text-shadow: none;
  color: #000;
}

.inverse-black .boxInfoTab .boxBtnArea li.selected span,
.inverse-black .boxInfoTab .boxBtnArea li:hover span {
  border-color: #fff;
  border-bottom-color: #000;
  background-color: #000;
  color: #fff;
}

.inverse-black .boxInfoTab .boxBtnArea li.selected span::before,
.inverse-black .boxInfoTab .boxBtnArea li:hover span::before {
  background: #000;
}

/* ---- インフォ一覧 ---- */

/* 矢印 */
.inverse-black .boxInfoTab .boxInfoList li a::before {
  border-left-color: #fff;
}



/*  Content Bottom
-----------------------------------*/

.inverse-black .home #contentBtm {
}

/*  関連リンク
-------------------------- */

.inverse-black .boxRelatedLink {
  border-radius: 8px;
  border: 1px solid #fff;
  background: none;
}

.inverse-black .boxRelatedLink a {
  color: #fff;
}

/* ---- スライダー ---- */

.inverse-black .boxRelatedLink .boxRelatedSlider .bx-viewport {
  border-top: 1px solid #fff;
  border-bottom: 1px solid #fff;
  background: none;
}

.inverse-black .boxRelatedLink .boxRelatedSlider .slider li {
  border-left: 1px solid #fff;
  background: none;
}

.inverse-black .boxRelatedLink .boxRelatedSlider .slider li a img {
  box-shadow: none;
}

/* -- PREV＆NEXTボタン -- */

.inverse-black .boxRelatedLink .bx-controls-direction .bx-prev,
.inverse-black .boxRelatedLink .bx-controls-direction .bx-next {
  border: 1px solid #fff;
  background-color: #000;
  box-shadow: none;
}

/* ---- カルーセル ---- */

.inverse-black .boxRelatedLink .bx-pager .bx-pager-item .active span {
  border: 4px solid #fff;
}

.inverse-black .boxRelatedLink .bx-pager .bx-pager-item img {
  box-shadow: none;
}

.inverse-black .boxRelatedLink .pager li .active span,
.inverse-black .boxRelatedLink .pager li a:hover span {
  border-color: #fff;
}



/*  OPENDATA : オープンデータ 設定
--------------------------------------------------------------*/

/* ---- カテゴリ ---- */

.inverse-black .boxTypeListSection.boxOpenData .boxTypeList > ul > li {
  border-right-color:#fff;
  border-left-color:#fff;
  background-color: #000 !important;
}

/* ---- 詳細 ---- */

.inverse-black .boxEntryBody div.styleH4 h2 {
  border-bottom-color: #fff;
}



@media screen and (max-width: 740px) {

/* =============================================================

　　スマホ画面 個別設定：白黒設定

============================================================= */


/*  TOP : トップページ 設定
--------------------------------------------------------------*/

/*　コンテンツ　設定
--------------------------------------------- */

/*  Content Top
-----------------------------------*/

/* -------- お問い合わせボタン -------- */

.inverse-black .boxMainVisual .btnContactBnr {
  border-top-color: #fff;
}

.inverse-black .boxMainVisual .btnContactBnr a {
  border: none;
}

/* -------- カテゴリーリスト -------- */

.inverse-black .boxCategoryList {
  border-top-color: #fff;
  border-bottom: none;
}

/*  Content Main
-----------------------------------*/

/* -------- 新着情報 -------- */

.inverse-black .boxInfoTab {
  border-bottom-color: #fff;
}

/*  Content Bottom
-----------------------------------*/

.inverse-black .home #contentBtm {
}


/*  関連リンク
-------------------------- */

.inverse-black .boxRelatedLink {
  border-radius: 0;
  border-left: none;
  border-right: none;
}

.inverse-black .boxRelatedLink .pager li .active span,
.inverse-black .boxRelatedLink .pager li a:hover span {
  border-color: #a18f85;
}



}

/* =============================================================

　　個別設定：サイトツアー（intro.js）白黒

============================================================= */


/*  サイトツアー選択箇所
-------------------------- */
      
.inverse-black .introjs-helperLayer {
  background-color: #000;
}


/*  サイトツアー選択中の数字
-------------------------- */

.inverse-black .introjs-helperNumberLayer {
  background: #000;
}


/*  吹き出し矢印
-------------------------- */

/* ---- Top ---- */

.inverse-black .introjs-arrow.top,
.inverse-black .introjs-arrow.top::before  {
  border-bottom-color:#000;
}

.inverse-black .introjs-arrow.top::before {
  border-bottom-color: #fff;
}

/* ---- Top-Right ---- */

.inverse-black .introjs-arrow.top-right,
.inverse-black .introjs-arrow.top-right::before {
  border-bottom-color:#000;
}

.introjs-arrow.top-right::before {
  border-bottom-color: #000;
}

/* ---- Top-Middle ---- */

.inverse-black .introjs-arrow.top-middle,
.inverse-black .introjs-arrow.top-middle::before {
  border-bottom-color:#000;
}

.inverse-black .introjs-arrow.top-middle::before {
  border-bottom-color: #fff;
}

/* ---- Right ---- */

.inverse-black .introjs-arrow.right,
.inverse-black .introjs-arrow.right::before {
  border-left-color:#000;
}

.inverse-black .introjs-arrow.right::before {
  border-left-color: #fff;
}

/* ---- Right-Bottom ---- */

.inverse-black .introjs-arrow.right-bottom,
.inverse-black .introjs-arrow.right-bottom::before {
  border-left-color:#000;
}

.inverse-black .introjs-arrow.right-bottom::before {
  border-left-color: #fff;
}

/* ---- Bottom ---- */

.inverse-black .introjs-arrow.bottom,
.inverse-black .introjs-arrow.bottom::before {
  border-top-color:#000;
}

.inverse-black .introjs-arrow.bottom::before {
  border-top-color: #fff;
}

/* ---- Left ---- */

.inverse-black .introjs-arrow.left,
.inverse-black .introjs-arrow.left::before {
  border-right-color:#000;
}

.inverse-black .introjs-arrow.left::before {
  border-right-color: #fff;
}

/* ---- Left-Bottom ---- */

.inverse-black .introjs-arrow.left-bottom,
.inverse-black .introjs-arrow.left-bottom::before {
  border-right-color:#000;
}

.inverse-black .introjs-arrow.left-bottom::before {
  border-right-color: #fff;
}


/*  吹き出し枠・本体
-------------------------- */

.inverse-black .introjs-tooltip {
  background-color: #000;
  border-color: #fff;
}

.inverse-black .introjs-tooltipbuttons {
  border-top-color: #fff;
}


/*  吹き出し内ボタン
-------------------------- */

/* ---- ボタン共通 ---- */

.inverse-black .introjs-button {
  height: 35px;
  padding: 5px 10px;
  border: 1px solid #fff;
  background: #000;
  color: #fff;
  text-align: center;
}

/* ---- 閉じるボタン ---- */

.inverse-black .introjs-skipbutton {
  width: auto;
  margin-left: 2px;
}

/* ---- ボタン・グレー ---- */

.inverse-black .introjs-button:hover,
.inverse-black .introjs-disabled,
.inverse-black .introjs-disabled:hover,
.inverse-black .introjs-disabled:focus {
  border-color: #999;
  color: #999;
}


/*  吹き出し内・内容
-------------------------- */

.inverse-black .introjs-tooltiptext {
  color: #fff;
}

.inverse-black .introjs-tooltiptext dl dt,
.inverse-black .introjs-tooltiptext dl dd {
  border-right-color: #fff;
}



/*  KURASHI : 暮らし・手続き 設定
--------------------------------------------------------------*/


/*  FAQ : よくある質問 設定
--------------------------------------------------------------*/


/*  SEARCH : 検索結果 設定
--------------------------------------------------------------*/


/*  SITEMAP : サイトマップ 設定
--------------------------------------------------------------*/

/* ---- セクション ---- */

.inverse-black .boxSiteMapSection {
  border-top-color: #fff;
}

/* ---- セクションタイトル ---- */

.inverse-black .sitemap .ttlSection,
.inverse-black .sitemap .ttlSection a {
  color: #fff;
}

.inverse-black .sitemap .ttlSection {
  border: none;
}

.inverse-black .sitemap .ttlSection a {
  border-bottom-color: #fff;
}


/*  CONTACT : お問い合わせ 設定
--------------------------------------------------------------*/

/* -- 必須 -- */

.inverse-black .boxContactForm .txtRequired {
  border: 1px solid #fff;
  background: none;
}

/* ---- メッセージボックス ---- */

.inverse-black .boxContactMessage {
  border-color: #fff;
  background: none;
}

/* ---- お問い合わせ完了 ---- */

.inverse-black .boxContactComp {
  border-color: #fff;
  background: none;
}

/* ---- エラーメッセージ ---- */

.inverse-black .boxContactError {
  border-color: #fff;
  background: none;
  color: #fff;
}

.inverse-black .boxContactError .boxErrorList li {
  color: #fff;
}

/*  SHISEI : 市の施設 設定
--------------------------------------------------------------*/

/* ---- 施設一覧 ---- */

/* -- サブタイトル -- */

.inverse-black .boxShisetsuSection .boxPageList .ttlSub {
  border-bottom-color: #fff;
}


/*  SHISEI : 市の組織 設定
--------------------------------------------------------------*/


/*  EVENT : イベントカレンダー 設定
--------------------------------------------------------------*/

/* ---- カレンダータイトル ---- */

.inverse-black .boxCalendarSection h2 {
  border: 1px solid #fff;
  background: none;
}

/* ---- イベントカレンダー ---- */

.inverse-black .boxEventCalendar {
  background: #fff;
}

.inverse-black .boxEventCalendar tr {
  border-top-color: #fff;
}

.inverse-black .boxEventCalendar th,
.inverse-black .boxEventCalendar td {
  background: #000;
}

.inverse-black .boxEventCalendar th.boxCalSunday,
.inverse-black .boxEventCalendar th.boxCalSaturday {
  color: #fff;
}

/* ---- MTN ADD 2016/2/19 ---- */
.inverse-black .boxEventCalendar th.sun,
.inverse-black .boxEventCalendar th.sat {
  color: #fff;
}
/* ---- MTN ADD END 2016/2/19 ---- */


/*  RECRUIT : 職員採用試験情報 設定
--------------------------------------------------------------*/

/* -------- ポップアップ関連設定 -------- */

.inverse-black .mfp-bg {
  background: #000;
}

.inverse-black .mfp-content {
  border-color: #fff;
}

/* ---- 閉じるボタン ---- */

.inverse-black button.mfp-close {
  border: 3px solid #fff;
  background: #000;
}

/* -------- 職員一覧 -------- */

/* -------- 吹き出し表示 -------- */

.inverse-black .boxRecruitList .boxBalloon {
  background: #000;
}

.inverse-black .boxRecruitList .boxBalloon::after {
  border-top-color: #000;
}

/* -------- プロフィール・モーダルウィンドウ -------- */

.inverse-black .mfp-content .boxProfile {
  background: #000;
  color: #fff;
}

/* ---- 詳細ボタン ---- */

.inverse-black .mfp-content .boxProfile .icnArw a {
  border: 1px solid #fff;
  background: #000;
}

@media screen and (max-width: 740px) {

/* -------- アコーディオンメニュー -------- */

.inverse-black .boxRecruitList.boxAcc .btnAcc,
.inverse-black .boxRecruitList.boxAcc .btnAcc.active {
  border: 1px solid #fff;
  background: #000;
}

}