@charset "utf-8";
/*=================================================================================
 能美市公式
 base.css
=================================================================================*/
/* -------------------------------------------------------------------------

基本設定

---------------------------------------------------------------------------*/
body {
	background-color: #ffffff;
	color: #111111;
    font-family: 'Noto Sans JP', sans-serif;
	font-style: normal;
	font-weight: normal;
	word-wrap: break-word;
	overflow-wrap : break-word;	
	font-size: 100%;
	line-height: 1.6em;
	}
input,textarea,select{ font-family: 'Noto Sans JP', sans-serif}

h1, h2, h3, h4, h5, h6,
article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary,
div, span,p,
ul, ol, li,dl, dt, dd,
table, tr, th, td,
a, img,input,
*, *::before, *::after {
  box-sizing: border-box;
}

.clearfix::after {
  content: '';
  display: block;
  clear: both;
}

strong { font-weight: bold;}

a[href]{
	word-wrap: break-word;
}
a[href]:hover img{
	opacity:0.7;
	filter: Alpha(opacity=70);
	-ms-filter:"Alpha(opacity=70)";
}

input, select { vertical-align: middle; }

a:link    { text-decoration: underline; }
a:visited { text-decoration: underline; }
a:active  { text-decoration: underline; }
a:hover   { text-decoration: underline; }

/*　本文へジャンプ
-------------------------------------------*/
#blockskip {
	overflow: visible;
	position: relative;
}
#blockskip a{
	position:absolute;
	height:0em;
	overflow:hidden;
}
#blockskip a:focus{
	height: 2.5em;
	text-indent: 0;
	background-color: #FFF;
	line-height: 2.5em;
	z-index: 1000;
}

/* -------------------------------------------------------------------------

　ヘッダー

---------------------------------------------------------------------------*/
.header-wrap { 
	position: relative;
	margin: 0;
	padding: 0;
	background-color: #f5ead7;
	}
.header-container {
	margin: 0 auto;
	padding: 0;	
	width: 980px;
	}
.header-container:before, .header-container:after {
	content: "."; 
	display: block;
	height: 0;
	overflow: hidden;
}
.header-container:after {
	clear: both;
}

/* アクセシビリティ・検索
-------------------------------------------*/
#header-sub-contents {
	background-color:#faf6ee;
	}

/*　アクセシビリティツール　*/
.header-sub-nav {
	display:block;
	float: left;
	}
	
/* ヘッダーナビゲーション
-------------------------------------------*/
ul.headerNav {
	display:block;
	margin: 0;
	padding: 0;
	width: 560px;
	}
ul.headerNav {	
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	align-items: stretch;
}

ul.headerNav li {
	position: relative;
    z-index: 400;
	list-style-type: none;
	background-color: #f7eee0;
	padding: 0;
	width: 180px;
	}
ul.headerNav li a {
	display: block;
	color: #211100;
	padding: 4px 0;
	font-size: 88%;
	font-weight: normal;
	text-decoration: none;
	}
ul.headerNav > li:hover > a {
    visibility: visible;
    opacity: 1;
}
ul.headerNav li ul {
    left: 0;
	width: 180px;
	display: none;
	position: absolute;
	text-align: left;
}
ul.headerNav > li li:hover > a {
	background-color: #48331b;
}
ul.headerNav li ul li a {
	display: block;
	background-color: #726250;
	border: none;
	line-height: 1;
	padding: 12px 16px;
	color: #fff;
	font-weight: normal;
	text-decoration: none;
}

ul.headerNav li.menu1 {
	padding: 2px 20px 2px 24px;
	background: #f7eee0 url(../img/down-h-snavi.png) no-repeat right 50%;
	}
ul.headerNav li.menu2 {
	padding: 2px 20px 2px 48px;
	background: #f7eee0 url(../img/ic-h-snavi-size.png) no-repeat center 50%;
	}
ul.headerNav li.menu3 {
	display: none;
	}	
ul.headerNav li.menu4 {
	padding: 2px 20px 2px 24px;
	background: #f7eee0 url(../img/arrow-h-snavi.png) no-repeat right 50%;
	}	

/*　検索窓（PC）
-------------------------------------------*/
.search {
	display: block;
	float: right;
	margin: 0;
	padding: 4px 0 0;
	width: 340px;
	text-align: right;
	}
.search input[type="text"] {
	width: 160px;
	border-style: none;
	margin-right: 10px;
	border: 1px solid #D0D0D0;
	}
.search input[type="submit"] {
	padding: 0 8px;
    font-size: 113%;
    background-color: #faf6ee;
	color: #211100;
    border-style: none;
	cursor: pointer;
	}

/*　検索窓（SP）
-------------------------------------------*/
.search_sp {
	display: none;
	}
	
/* ロゴ・キャッチコピー
-------------------------------------------*/
#header-main-contents {
	line-height: 1;
	}
	
/* キャッチコピー　*/
.catch {
	float: left;
	margin: 0;
	padding: 14px 20px 0;
	width: 750px;	
	}

/* ロゴ　*/
.logo_pc {
	float: right;
	margin: 0;
	padding: 22px 0 0;
	width: 190px;
	}	
.logo_sp {
	display:none;
	}

/* グローバルナビ
-------------------------------------------*/
#header-main-nav {
	display:block;
	}
h2.globalNav-ttl{ display: none;}

/*　グローバルナビ　*/
ul.globalNav {	
	list-style-type: none;
	margin: 0;
	padding: 0;
	width: 780px;
	}	
ul.globalNav {	
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	align-items: stretch;
	}
	
ul.globalNav li {
	width: 110px;
	font-size: 75%;
	text-align: center;
    display: flex;
	}
ul.globalNav li a {
	width: 110px;
	padding: 2px 0;
	color: #211100;
	font-weight: normal;
	text-decoration: none;
	border-top-left-radius: 6px;
	border-top-right-radius: 6px;
	background-color: #dacebb;
	}	
ul.globalNav li a:hover {
	color: #fff;
	background-color: #726250;
	}
	

/* コンテンツプレビュー時のヘッダー画像
-------------------------------------------*/
#preview-header-img {
	line-height: 0;
	width: 100%;
}
#preview-header-img img {
	margin: 0 auto;
}

/* -------------------------------------------------------------------------

　フッター

---------------------------------------------------------------------------*/
.footer-wrap {
	background-color: #271D1C;
	margin: 0;
	overflow: hidden;
	padding: 0;
	}

/* SNS
-------------------------------------------*/
#sns-contents {
	background-color: #312625;
	margin: 0;
	padding: 32px 0;
	color:#fff;
	text-align: center;
	}
	
dl.sns-info {
	margin: 0 auto;
	overflow: hidden;
	padding: 0;
	}
dl.sns-info dt {
	margin: 0 0 1em;
	}
dl.sns-info dd {
	display: inline-block;
	width: 120px;
	}	

#sns-contents a {
	color: #ffffff;
	text-decoration: none;
	}
	
/* フッター
-------------------------------------------*/
#footer-contents {
	display: block;
	margin: 0 auto;
	padding: 16px 0;
	color:#fff;
	font-size: 94%;
	text-align: center;
	width: 980px;
	}

dl.nomi-info {
	margin: 1em auto;
	padding: 0;
	}
dl.nomi-info dt,
dl.nomi-info dd {
	display: inline-block;
	margin: 0 8px;
	}

ul.footerNav {
	margin: 1em auto;
	padding: 0;
	}
ul.footerNav li {
	display: inline-block;
	margin: 0 8px;
	}

#footer-contents a {
	color: #fff;
	text-decoration: underline;
}

.copyright{
	text-align: center;
	}

/* ページトップリンク　*/
.pagetop{ text-align:right; }



/* -------------------------------------------------------------------------

共通パーツ

---------------------------------------------------------------------------*/
/*　パンくずリスト
-------------------------------------------*/
.breadcrumb {
	box-sizing: border-box;
	padding: 0 0;
	background-color:#e5dbcc;
}
.breadcrumb ul { 
	clear: both;
	list-style: none;
	overflow: hidden;
	margin: 0 auto;
	margin-bottom: 0.2em;
	width: 980px;
}
.breadcrumb ul li {
	position: relative;
	display: inline-block;
	margin: 0;
	padding: 0 1em 0 0.3em;
	font-size: 75%;
	line-height: 1.1;
}
.breadcrumb ul li a {
	color: #211100;
	font-weight: normal;
	text-decoration: none
}
.breadcrumb ul li::before {
	content: "";
	display: block;
	position: absolute;
	top: 0.2em;
	right: 0;
	width: 0.5em;
	height: 0.5em;
	transform: rotate(-45deg);
	border-bottom: 1px solid #AAA;
	border-right: 1px solid #AAA;
}

.breadcrumb ul li:last-child::before {
	border-bottom: none;
	border-right: none;
}

/* -------------------------------------------------------------------------

　ページレイアウト

---------------------------------------------------------------------------*/
/*　内容包括　*/
.container{
	clear: both;
	overflow: hidden;
	margin: 0 auto;
	width: 100%;
}

/* -------------------------------------------------------------------------

コンテンツ

---------------------------------------------------------------------------*/
/*　コンテンツの内容枠　*/
#page-main-contents {
	display: block;
	position: relative;
	margin: 1em auto 3em;
	padding: 0;
	width: 980px;
}
#page-main-contents:before, #page-main-contents:after {
	content: "."; 
	display: block;
	height: 0;
	overflow: hidden;
}
#page-main-contents:after {
	clear: both;
}

.page-container {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: flex-start;
}


/*　メインコンテンツ
-------------------------------------------*/
/*　コンテンツの内容枠　*/
#main-contents {
	display: block;
	margin: 0;
	padding: 0;
	width: 100%;
	}
/*　メニュー付コンテンツの内容枠　*/	
.page-container #main-contents {
	display: block;
	margin: 0;
	padding: 0;
	width: 720px;
	order: 2;
	}

/* ページメニュー/コンテンツ一覧 */	
ul.pageNav {
	display: block;
	margin: 0;
	padding: 0;
	width: 100%
	}	
ul.pageNav li {
	display: block;
	border-bottom:#fff 4px solid;
	background-color: #fcf5ea;
	}
ul.pageNav li a {
	display: block;
	margin: 0;
	padding: 8px 16px;
	color: #211100;
	text-decoration: none;
	}
ul.pageNav li a:hover {
	display: block;
	color: #d03b00;
	}



/*============================================================================
 コンテンツページ
 【注意】以下の「edit-item」「opt-item」「map-item」「viewer-item」「contact-item」「enquete_item」のID・class名は変更しないでください。
*============================================================================*/
/* ページ見出し
-------------------------------------------*/
#main-contents h1{
	color:#211100;
	background-color: #ffecd7;
	border-top-left-radius: 6px;
	border-top-right-radius: 6px;
	font-size: 200%;
	font-weight: bold;
	line-height: 1.2em;
	margin-bottom: 8px;
	padding: 0.5em 16px 0.5em;
}

#main-contents h1.subNav2-ttl { background-color: #ffb664;} /* 第3階層メニュー */
#main-contents h1.subNav3-ttl { background-color: #ffd5a5;} /* 第4階層メニュー */


.updated{ text-align:right;}

/* HTTP(S)から始まるa要素（能美市ドメインを含むものを除く）に外部リンクアイコンを設定 */
#main-contents .edit-item a[href^='http']:not([href*='www.city.nomi.lg.jp']),
#main-contents .opt-item a[href^='http']:not([href*='www.city.nomi.lg.jp']) {
	padding-left: 0;/* 外部PDF等の場合の余白を0にする */
	padding-right: 82px;
	background: transparent url(../img/icon_link_gaibu.png) no-repeat right center;
	background-position: right 3px center;
}

/*　CMSからの「内容」入力枠　*/
.edit-item{
	clear: both;
	text-align: left;
	overflow: hidden;
	padding: 0 0 0.5em;
}

/*　CMSからの「内容」入力枠内のパーツ.edit-item　*/
/* 見出し
-------------------------------------------*/
.edit-item h2,
.edit-item h3,
.edit-item h4,
.edit-item h5,
.edit-item h6 {
	clear: both;
	font-size: 1em;
}

.edit-item h2 {
	border-top: 4px solid #ff8800;
	border-bottom: 1px solid #908888;
	font-size: 175%;/* 28px */
	font-weight: bold;
	line-height: 1.1em;
	margin: 30px 0 10px;
	padding: 0.5em 0 0.5em;
}
.edit-item h3 {
	border-left: 10px solid #ff8800;
	color:#211100;
	font-size: 150%;/* 24px */
	font-weight: bold;
	line-height: 1.1em;
	margin: 30px 0 10px;
	padding: 0.1em 8px 0.1em 16px;
}
.edit-item h4 {
	color:#fff;
	background-color:#211100;
	font-size: 125%;/* 20px */
	font-weight: bold;
	line-height: 1.1em;
	margin: 30px 0 10px;
	padding: 0.5em 16px 0.5em;
	}
.edit-item h5 {
	border-bottom: 1px dashed #211100;
	color:#211100;
	font-size: 125%;/* 20px */
	font-weight: bold;
	line-height: 1.1em;
	margin: 30px 0 10px;
	padding: 0.5em 0 0.5em;
}
.edit-item h6 {
	color: #003B89;
	font-size: 125%;/* 20px */
	font-weight: bold;
	line-height: 1.1em;
	margin: 30px 0 10px;
	padding: 0.5em 0 0.5em;
}


/*　サブコンテンツ（サブナビゲーション）
-------------------------------------------*/
/*　サブコンテンツの内容枠　*/
#sub-contents {
	display: block;
	margin: 0;
	padding: 0;
	width: 240px;
	order: 1;
}


/* カテゴリーメニュー（第2階層） */
#subNav-contents {
	display: block;
	margin: 0;
	padding: 0;
}
h2.subNav1-ttl /*カテゴリータイトル1*/{
	display: block;
	margin: 0;
	overflow: hidden;
	padding: 4px 8px;
	color: #211100;
	font-size: 113%;/*18px*/
	border-top-left-radius: 6px;
	border-top-right-radius: 6px;
	background-color: #eee;
	text-align: center;
}
h2.subNav1-ttl.category1 { background-color: #f8c1c1;} /*暮らし */
h2.subNav1-ttl.category2 { background-color: #BAD5B8;} /*市役所・施設案内 */
h2.subNav1-ttl.category3 { background-color: #E6E386;} /*観光・特産品 */
h2.subNav1-ttl.category4 { background-color: #F5C098;} /*産業・移住定住 */
h2.subNav1-ttl.category5 { background-color: #B1C2EA;} /*火事・災害・防災 */
h2.subNav1-ttl.category6 { background-color: #C4F8F8;} /*市政・議会 */


/* カテゴリーメニュー（第3階層） */
h2.subNav2-ttl /* カテゴリータイトル */{
	display: block;
	margin: 0;
	overflow: hidden;
	padding: 4px 8px;
	color: #211100;
	font-size: 113%;/*18px*/
	border-top-left-radius: 6px;
	border-top-right-radius: 6px;
	background-color: #ffb664;
	text-align: center;
	}
	
/* カテゴリーメニュー（第4階層） */	
h2.subNav3-ttl /* カテゴリータイトル */{
	display: block;
	margin: 0;
	overflow: hidden;
	padding: 4px 8px;
	color: #211100;
	font-size: 113%;/*18px*/
	border-top-left-radius: 6px;
	border-top-right-radius: 6px;
	background-color: #ffd5a5;
	text-align: center;
	}

/* カテゴリーメニュー一覧 */	
ul.subNav1,
ul.subNav2,
ul.subNav3 {
	display: block;
	}	
ul.subNav1 li,
ul.subNav2 li,
ul.subNav3 li {
	display: block;
	border-top:#fff 1px solid;
	background-color:#fcf5ea;
	position: relative;
	color: #211100;
	}
ul.subNav1 li:before, ul.subNav1 li:after,
ul.subNav2 li:before, ul.subNav2 li:after,
ul.subNav3 li:before, ul.subNav3 li:after {
  content: '';
  display: inline-block;
  position: absolute;
  top: 50%;
  right: 0;
  z-index: 0;
  width: 0;
  height: 0;
  margin-top: -6px;
  border-top: 6px solid transparent;
  border-right: 12px solid transparent;
  border-bottom: 6px solid transparent;
  border-left: 12px solid #856a4b;
}
ul.subNav1 li:after,
ul.subNav2 li:after,
ul.subNav3 li:after {
  z-index: 1;
  margin-left: -3px;
  border-left-color: #856a4b;
}

ul.subNav1 li a,
ul.subNav2 li a,
ul.subNav3 li a {
	display: block;
	margin: 0;
	padding: 8px 32px 8px 16px;
	color: #211100;
	text-decoration: none;
	}
ul.subNav1 li a:hover,
ul.subNav2 li a:hover,
ul.subNav3 li a:hover {
	display: block;
	color: #d03b00;
	}
ul.subNav1 li:hover:before, ul.subNav1 li:hover:after,
ul.subNav2 li:hover:before, ul.subNav2 li:hover:after,
ul.subNav3 li:hover:before, ul.subNav3 li:hover:after {
  content: '';
  display: inline-block;
  position: absolute;
  top: 50%;
  right: 0;
  z-index: 0;
  width: 0;
  height: 0;
  margin-top: -6px;
  border-top: 6px solid transparent;
  border-right: 12px solid transparent;
  border-bottom: 6px solid transparent;
  border-left: 12px solid #f18700;
}
ul.subNav1 li:hover:after,
ul.subNav2 li:hover:after,
ul.subNav3 li:hover:after {
  z-index: 1;
  margin-left: -3px;
  border-left-color: #f18700;
}

/* 表示中ページ */
ul.subNav1 li.current, ul.subNav1 li.current a,
ul.subNav2 li.current, ul.subNav2 li.current a,
ul.subNav3 li.current, ul.subNav3 li.current a {
	display: block;
	color: #d03b00;
	text-decoration: none;
	}
ul.subNav1 li.current:before, ul.subNav1 li.current:after,
ul.subNav2 li.current:before, ul.subNav2 li.current:after,
ul.subNav3 li.current:before, ul.subNav3 li.current:after {
  content: '';
  display: inline-block;
  position: absolute;
  top: 50%;
  right: 0;
  z-index: 0;
  width: 0;
  height: 0;
  margin-top: -6px;
  border-top: 6px solid transparent;
  border-right: 12px solid transparent;
  border-bottom: 6px solid transparent;
  border-left: 12px solid #f18700;
}
ul.subNav1 li.current:after,
ul.subNav2 li.current:after,
ul.subNav3 li.current:after {
  z-index: 1;
  margin-left: -3px;
  border-left-color: #f18700;
}

/*============================================================================
 ジャンルページアイコン付与（詳細非表示コンテンツはアイコンなし）
*============================================================================*/
.gnricon {
	padding: 0 0 0 20px;
	background:url(../img/icon_folder.png) no-repeat;
	background-position: 10px center;
  }
  
  .conicon {
	padding: 0 0 0 20px;
	background:url(../img/icon_memo.png) no-repeat;
	background-position: 10px center;
  }
  
  .no-link {
	display: block;
	padding: 8px 16px;
  }



/*============================================================================
　トップページ
*============================================================================*/

/*============================================================================
　ジャンルページ
*============================================================================*/

/*============================================================================
 新着情報一覧ページ
*============================================================================*/

/*============================================================================
 イベントカレンダーページ
*============================================================================*/

/*============================================================================
 サイトマップページ
*============================================================================*/

/*============================================================================
 窓口案内ページ
*============================================================================*/

/*============================================================================
 部署情報一覧ページ
*============================================================================*/

/*============================================================================
 担当事務ページ
*============================================================================*/

/*============================================================================
 ビューワ一覧ページ　別ウィンドウ
*============================================================================*/

/*============================================================================
 関連サイトリンク集ページ
*============================================================================*/

/*============================================================================
 検索結果ページ
*============================================================================*/

/*============================================================================
 レスポンシブ調整：PC版非表示
*============================================================================*/
/*　PC版【非表示】スマホ版【表示】　*/
.sp-only{ display: none !important;}

/*　PC版【表示】スマホ版【非表示】　*/
.pc-only { display: block !important;}










/* ========================================================================================================
 for SHIRASAGI CMS
======================================================================================================== */
/*============================================================================
 記事ページ
*============================================================================*/

/* 「カテゴリー」エリア非表示 
------------------------------------------- */
section.categories {
	display: none;
}