@charset "utf-8";
/* CSS Document */

/*================================================
　　　　* よく登場する要素のリセット
================================================*/

body, h1, h2, h3, h4, h5, h6, p, address,
ul, ol, li, dl, dt, dd,
table, caption, th, td, img, form{
	margin: 0;
	padding: 0;
	border: none;
	font-style: normal;
	font-weight: normal;
	font-size: 100%;
	text-align: left;
	list-style-type: none;
}

/* 画像の下にできる隙間をなくす */
img {vertical-align: bottom;}

a img {	cursor: pointer;}
a img.png {	cursor: pointer;}
img {border: none;}
ul,li {list-style: none;}

/*
============================================================================
 レスポンシブデザイン用　共通スタイルシート
 ----------------------------------------------------------
 概要：MediaQueriesでモバイル機器向けのサイト内共通スタイルを記述する
============================================================================


/*--------------------------------------------------------------------------
// ■初期設定
--------------------------------------------------------------------------*/

/* 表示・非表示設定 */
.sp-inline         {display:none;	/* スマホ版のみ表示(@media使用時) */}
.sp-block          {display:none;	/* スマホ版のみ表示(@media使用時) */}


/*==============================================================================
// ###ブレークポイント（768px）###
==============================================================================*/
/*
@media (min-device-width:1024px) and (max-width: 650px),
        (max-width: 650px) and (orientation:landscape),
        (max-width: 450px) and (orientation:portrait)
*/
@media screen and (max-width: 768px){
	
	/*--------------------------------------------------------------------------
	// ■基本設定
	--------------------------------------------------------------------------*/
	/* フォント */
	body {font-family: "メイリオ","ＭＳ Ｐゴシック",Osaka,"ヒラギノ角ゴ Pro W3",sans-serif;}
	
	/* スマホの縦横を切り替えた時に文字サイズを固定にする */
	html body {-webkit-text-size-adjust: 100%;} 	/* この指定と同時にHTMLヘッダでinitial-scaleかmaximum-scaleを指定する必要がある */
	
	/* 全体サイズ */
	html body {min-width: 0; width: 100%;}

	/* セルの強制改行 */	
  	td,th{word-break: break-all;}
	
	/* 非表示要素 */
	nav,
	#tool,
	#sub #gNavi,
	#main_top,
	#body--life-index #cityMenu,
	.footerLine,
	#gNavi
	{
		display: none;
	}
	nav.pagination{
		display: block;
	}
	
	/* width: 100% */
	#head,
	#headTitle,
	#footer,
	#wrap #main 
	{
		width: 100% !important;
		min-width: inherit;
		margin: 0;
		padding: 0;
	}
	
	#main {
		float: none !important;
	}
	
	#head{
		padding:0;
	}
	
	#itemNav {
	    position: relative;
	    height: 75px;
	}
	
	#spmenu,
	.slicknav_menu {
		/* display: block; */
	}
	
	#itemNav {
		display: block;
	}
	
	.slicknav_btn {
		/*width: 65px;
    	height: 65px;*/
		background-color: #00955D !important;
		-webkit-border-radius: 0px !important;
	    -moz-border-radius: 0px !important;
	    border-radius: 0px !important;
		padding: 8px 8px 2px 8px!important;
	    margin: 3px 5px 3px !important;
	    text-align: center;
	}
	
    .crumbs{
		padding: 10px;
    }
	
	.slicknav_menu {
		display: inline-block;
	    margin: 0;
	    width: 100%;
	    position: absolute;
	    top: 0;
	    right: 0;
	    background: none !important;
	    padding: 0 !important;
	    z-index: 9999;
	}
	
	.slicknav_nav {
		background: #FFFFFF;
		padding: 0 0 20px 0 !important;
	}
	
	.slicknav_nav li.spsearch {
		background: #EEEEEE;
		padding: 20px;
		text-align: center;
	}
	
	.slicknav_nav li.spsearch dl.spsearch_inner {
	    width: 100%;
	}
	
	.slicknav_nav li.spsearch dd.spsearchbox {
	    width: 80%;
	    margin: 10px auto 20px auto;
	}
	
	.slicknav_nav li.spsearch .spsearchbox input[type="text"] {
	    font-size: 13px;
	    width: 80%;
	    padding: 10px;
	    border: 1px solid #01955E;
	    margin: 0;
	    height: 40px;
	    display: table-cell;
	    font-size: 1.4em;
	}
	
	.slicknav_nav li.spsearch .spsearchbox input[type="submit"] {
	    margin: 0 0 0 -5px;
	    background: #00955D;
	    color: #FFF;
	    text-align: center;
	    border: none;
	    cursor: pointer;
	    width: 20%;
	    height: 40px;
	    font-size: 1.4em;
	}
	
	.slicknav_nav li.splink {
		background: #ffffff;
	}
	
	.slicknav_nav li.splink a{
		color: #0079D2;
		text-decoration: underline;
          border-color: #666666;
    border-style: solid;
    border-width: 1px;
	}
	
	.slicknav_nav li.splink a:hover {
		background: none !important;
	}
	.slicknav_nav li.splink dl{
	    margin-left: 10px;
    }
	.slicknav_nav li.splink dl dd {
	    float: left;
    display: block;
    width: 48%;
	}
	
	.slicknav_nav li.spmnlink a {
		background: #EEEEEE;
	    color: #0079D2;
	    border: 1px solid #676767;
	    padding: 15px;
	    margin: 5px 15px;
	    font-size: 1.2em;
	}
	
	.slicknav_nav li.spmnlink a:hover {
	    -webkit-border-radius: 0px !important;
	    -moz-border-radius: 0px !important;
	    border-radius: 0px !important;
	}
	
	.slicknav_menu .slicknav_menutxt {
	    display: block;
	    font-size: 0.9em;
	    font-weight: normal !important;
	    text-shadow: none !important;
	    float: none !important;
	}
	
	.slicknav_menu span span {
      font-size: 20px;
	    display: block;
	    text-align: center;
	    margin: 0 auto;
	}

	
	.slicknav_menu .slicknav_icon {
		display: none !important;
	}
	.slicknav_menu span span.open_text,
	.slicknav_menu span span.close_text {
	    font-size: 0.8em;
	    display: block;
	    margin: 3px auto;
      width : 3em;
	}
	
	.pagetop {
		bottom: 30px;
    	right: 15px;
	    left: inherit;
	}
	
	.pagetop a {
	    padding: 5px 9px 5px 9px;
	}
	
	.pagetop a span {
	    font-size: 30px;
	}
	
	footer {
		background-size: 200%;
	    background-repeat: no-repeat;
	    background-position: center bottom;
	}
    .Fadd{padding: 0px 10px;}
    #FMenuConts ul li {
      display: block;
      margin: 0 0px 3px 0;
      border-color: #666666;
      border-style: solid;
      border-width: 1px;

    }
    #FMenuConts ul li a{
      display: block;
      line-height: 1.8em;
      padding: 5px;
    }
	
	/* 左右余白付きメイン部 */
	#header,
	#wrap {
		width: 100%;
	}
	
	#wrap {
		overflow: hidden;
	}

	/* 画像 */
	img {
		max-width: 100%;
	}
    article.body img{
        float: none !important;
		display: block;
		margin-left: auto !important;
		margin-right: auto !important;
    }
    .article-pages img{
        float: none !important;
		display: block;
		margin-left: auto !important;
		margin-right: auto !important;
    }	
	/*--------------------------------------------------------------------------
	// ■市民向けトップページ
	//                                                                          
	--------------------------------------------------------------------------*/
	
	.sitelogo {
	    background: url(../../img/shimin/media_hokuto.png) 0 0 no-repeat;
	    width:331px;
	    height:70px;
	}
	
	.subWrap a {
		width:331px;
	    height:70px;
      position: absolute;
    z-index: 10000;
	}
	
	#wide {
		margin: 10px auto !important;
	}
	
	#wide .sp-arrows{
		display: none;
	}
	
	#wide .sp-image-container {
	    background: #000000;
	}
	
	#wide .sp-slides-container p.sp-layer.sp-black.sp-padding {
		display: none;
	}
	
	#FMenuConts {
	    width: 100%;
	    padding: 0;
	}
	
	#headMenu {
		display: none;
	}
	
	#infoAll{
		 float: inherit;
	}
	
	#infoEmr {
	    width: 95%;
	    margin: 20px auto;
	}
	
	#infoTab {
	    margin: 20px auto 0 auto;
	    width: 95%;
	}
	
	#infoTab #tab li{
		padding: 10px 5px;
	    font-size: 0.9em;
	    font-weight: bold;
	}
	
	#easySearch {
	    float: inherit;
	    width: 95%;
	    height: auto;
	    margin: 30px auto;
	}
	
	#easySearch li {
	    width: 20%;
	    height: auto;
	}
	
	#easySearch li a {
	    width: 100%;
	    font-size:0.8em;
	}
	
	#accessBusyo {
	    float: inherit;
	    width: 95%;
	    margin: 0 auto;
	}
	
	#accessBusyo li:last-child {
	    margin-left: 3%;
	}
	
	#accessBusyo li {
	    width: 48%;
	}
	
	#accessBusyo li a {
	    width: 100%;
	    height: auto;
	}
	
	#main_nav {
	    width: 95%;
	    margin: 0 auto;
	    border: none;
	}
	
	#main_nav li {
	    width: 47%;
	    margin: 1%;
	}
	
	#main_nav li a {
	    width: 100%;
	}
	
	#main_nav li:last-child {
	    margin: 1%;
	}
	
	#main_nav ul li .title,
	#main_nav ul li .title_rows {
		margin: 0;
		width: 70%;
		font-size: 0.9em;
	}
	
	#main_nav ul li .pict {
	    float: right;
	    width: 30%;
	    display: block;
	    text-align: right;
	}
	
	#main_nav ul li img {
		position: static;
	}
	
	#infoLink {
	    border: none;
	    width: 95%;
	    margin: 0 auto;
	    float: inherit;
	}
	
	#infoLink .infoLink_inner {
	    width: 95%;
	    margin: 0 auto;
	    height: auto;
	}
	
	#infoLink .infolink_left {
	    float: left;
	    margin-right: 2%;
	}
	
	#infoLink .infolink_left, 
	#infoLink .infolink_right {
	    width: 49%;
	}
	
	#infoLink .infolink_left li a, #infoLink .infolink_right li a {
	    width: 100%;
	    height: auto;
	}
	
	#outerLink {
	    width: 95%;
	    margin: 0 auto;
	    float: inherit;
	    height: auto;
	}
	
	#outerLink ul {
	    width: 100%;
	}
	
	#outerLink ul li {
	    width: 33%;
	    text-align: center;
	    margin: 0;
	}
	
	#outerLink ul li a {
	    width: 100%;
    	height: auto;
	}
	
	.main_bottom_inner {
	    width: 95%;
	    height: auto;
	    margin: 30px auto;
	}
	
	#main_bottom #relationLink li a, 
	#main_bottom #bnrLink li a,
	#main_bottom #relationLink span a, 
	#main_bottom #bnrLink span a{
	    width: 100%;
        min-width : auto;
	    height: auto;
	}
	
	#main_bottom #relationLink li, 
	#main_bottom #bnrLink li,
	#main_bottom #relationLink span, 
	#main_bottom #bnrLink span{
	    width: 48%;
	    margin: 1%;
              min-width : auto;
	}
  

	#main_bottom #bnrLink li:last-child,
	#main_bottom #bnrLink span:last-child{
	   /*width: 98%*/
	}
	#main_bottom #relationLink li:nth-last-child(2), 
	#main_bottom #bnrLink li:nth-last-child(2),
	#main_bottom #relationLink span:nth-last-child(2), 
	#main_bottom #bnrLink span:nth-last-child(2){
	  /*width: 98%;*/
	}
	
	#main_bottom #relationLink img, 
	#main_bottom #bnrLink img {
	    width: 80%;
	    margin: 10px auto;
	}
  	#main_bottom #bnrLink span:last-child img{
	       /*width: 96%;
    		margin-left: 10px;*/
	}
	
	#main_bottom #relationLink li:nth-child(even),
	#main_bottom #bnrLink li:nth-child(even){
		margin: 1% 0;
	}
	
	#main_bottom #relationLink ul,
	#main_bottom #bnrLink ul,
	#main_bottom #relationLink div,
	#main_bottom #bnrLink div{
	    width: 100%;
	    margin: 0 auto;
	}
	
	#footerMenuArea {
		width: 100%;
	}
	
	#FMenuConts ul {
	    padding: 10px 30px;
	}
	
	#LogoAddArea .FLogo a {
	    float: inherit;
	    margin: 35px auto;
	}
	
	#LogoAddArea .FAdd {
    	width: 90%;
	    margin: 0 auto;
	    font-size: 0.9em;
	}
	
	#LogoAddArea .FAdd p {
	    text-align: center;
	}
	
	#sns_search {
		height: auto;
	}
	
	#sns_search_inner {
		width: 95%;
		margin:20px auto;
		height: auto;
	}
	
	#sns_search_inner .SearchBox {
		left: 18px;
   		top: -20px;
	}
	#sns_search .site {
    float: left;
	}
    #wide, #wide .sp-mask, #wide .sp-image-container, #wide .sp-slide {
    height: 250px !important;
    padding-bottom: 10px;
	}
  #accessBusyo li.access a span {
    font-size: 40px;
	}

	/*--------------------------------------------------------------------------
	// ■市民向けカテゴリーページ
	//                                                                          
	--------------------------------------------------------------------------*/
    /*記事タイトル*/
    h1#page-title {
        width: 95%;
      	margin: 0px auto 10px auto;
    }
    #rside {
        width: 95%;
      	margin: 0px auto 10px auto;
        float: none;
      max-width : 95%;
      clear: both;
    }
	.tbl_row {
		width: 95%;
	    margin: 20px auto;
	}
	
	.tbl_row .tbl_row_title {
		width: 100%;
	    margin: 0px auto;
	}
	
	.tbl_row table {
		width: 100%;
		margin:10px auto;
	}
    .map #map-sidebar {
    width: 100%;
	height: auto !important;
  }
  #body--life-maps-map .map #map-canvas {
    width: 100% !important;
    height: 400px !important;
	}
  .gsc-search-button{
 /* padding-top: 3px;*/
  }
}
/*==============================================================================
// ###ブレークポイント（400px）###
==============================================================================*/
@media screen and (max-width: 400px){
	
	/* [MEMO:]さらにiPhone4,5の縦表示(320px)など、一部文字サイズが小さくなりすぎるものはここで大きく微調整 */
	
	.sitelogo {
		width: 250px;
	    height: 50px;
	    background-size: contain;
	}
	
	.subWrap a {
		width: 250px;
	    height: 50px;
	}
	
	#itemNav {
		height: 50px;
	}
	#footerCreditArea {
		font-size: 13px;
    background-position: center bottom;
    background-repeat: no-repeat;
    background-image: url(../../img/shimin/copy_bg_sm.png);
	}
		
	/*--------------------------------------------------------------------------
	// ■市民向けトップページ
	//                                                                          
	--------------------------------------------------------------------------*/
	
	#infoTab #tab li{
		font-size: 0.8em;
		padding: 5px 4px;
	}
	
	#main_nav ul li .title, #main_nav ul li .title_rows {
		font-size: 0.7em;
	}
	
	#accessBusyo li.access a,
	#accessBusyo li.busyo a {
	    font-size: 0.7em;
	}
	
	#main_nav li a {
	    padding: 8px;
	}
	
	#easySearch li a {
		font-size: 0.65em;
	}
	
	
	#infoLink .infolink_left li a, #infoLink .infolink_right li a {
		padding: 5px;
		font-size: 0.8em;
	}
	
	/*--------------------------------------------------------------------------
	// ■市民向けカテゴリページ
	//                                                                          
	--------------------------------------------------------------------------*/
	
	.tbl_row {
		font-size: 0.9em;
	}
}

