@charset "UTF-8";


/* -------------------------------------------------------------------------
 ?.　画面幅 768px 
------------------------------------------------------------------------- */

@media screen and (max-width:768px) {
    
/* base.css
------------------------------------------------------------------------- */
    img {
        max-width: 100% !important;
        height: auto;
    }
    p {
        margin: 0 5px 10px;
    }
	#page p#crumb, p#crumb {
		margin: 0 5px 30px 5px;
	}
	#page p {
		margin: 0px 15px 10px 15px;
	}
    #header {
        width: 100%;
        margin: 0 0 5px;
    }
    #header_inner {
        width: auto;
        padding: 0 5px;
    }
    #header-translate,#header_top,#header_search,#header_bottom {
        float: none;
    }
    #header_item {
        float: none;
        overflow: hidden;
        width: 100%;
        margin-top: 10px;
        padding: 0;
    }
    #header_top {
        padding: 0;
    }
    #header_bgcolor, #header_fontsize, #header_navi {
        display: none;
    }
    #site_logo {
        display: inline-block;
        width: 200px;
        float: none;
        text-align: left;
    }
    #sp_globalnavi {
        display: block;
        width: 80px;
        float: right;
    }
    ul.globalnavi {
        overflow: hidden;
        width: 100%;
    }
    ul.globalnavi li {
        display: block;
        float: left;
        width: 25%;
        height: 80px;
        border-right: none;
    }
    ul.globalnavi li#gnavi_home, 
    ul.globalnavi li#gnavi_sangyou,
    body#sangyou ul.globalnavi li#gnavi_sangyou {
        width: 25%;
    }
    #content {
        width: 100%;
    }
    #content #right_content {
        float: none;
        width: 100%;
        margin: 0 0 25px;
    }
    #content #side_group {
        float: none;
        width: 100%;
    }
    #content #side_banner ul {
        max-width: 465px;
        margin: 0 auto;
    }
	#content table {
		width: auto !important;
	}
    #footer_banner {
        width: 100%;
        margin: 15px auto 0;
    }
    #footer_banner ul {
        max-width: 500px;
        margin: 0 auto;
    }
    #footer_content-inner {
        width: 100%;
    }
    #footer_globalnavi ul {
        width: 100%;
        overflow: hidden;
        margin: 0;
        padding: 0 0 20px;
    }
    #footer_globalnavi ul li {
        display: block;
        float: left;
        width: 50%;
        margin: 0;
        padding: 10px 0;
        border-bottom: 2px dotted #6a72d5;
        background: none;
        box-sizing: border-box;
    }
    #footer_globalnavi ul li:nth-child(2n) {
        border-left: 2px dotted #6a72d5;
    }
    #footer_subnavi {
        display: none;
    }
    p#footer_log {
        float: none;
        max-width: 300px;
        margin: 0 auto;
    }
    address {
        float: none;
        max-width: 318px;
        margin: 0 auto;
    }
    ul#sp-menu {
		display: block;
		margin: 10px 0;
	}
	ul#sp-menu li {
		margin: 5px 0;
		padding: 0;
        background: none;
		text-align: center;
	}
/* top.css
------------------------------------------------------------------------- */
    #main_content {
        width: 100%;
        padding: 0;
    }
    #main_slider {
        float: none;
        max-width: 100%;
        margin: 0;
    }
    .bx-pager {
        position: static;
        margin: 10px 0;
        text-align: center;
    }
    #main_banner {
        display: none;
    }
    #kurashi_navi ul {
        max-width: 418px; /*横5列*/    
        margin: 0 auto;
    }
    #kurashi_navi ul li {
        display: inline-block;
        float: none;
    }
    #population, #kouhou, #keyword {
        float: none;
        width: 100%;
        margin-bottom: 20px;
    }
    #population h3, #kouhou h3, #keyword h3 {
        text-align: center;
    }
    #population, #kouhou {
        margin-right: 0;
    }
    .top_tabarea-content dt,
    .news_list dt {
        float: none;
        padding: 10px 15px 5px 5px;
    }
    p.kouhou_img {
        float: none;
        max-width: 300px;
        margin: 0 auto;
    }
    p.kouhou_img a img {
        width: 100%;
        height: auto;
    }
    p.kouhou_text {
        display: block;
        height: auto;
        margin: 10px 0;
    }
    p.kouhou_back {
        max-width: 300px;
        margin: 0 auto;
    }
    #weather img {
        display: block;
        margin: 0 auto;
    }
    .top_tabarea-content dd {
        padding: 2px 0 5px 5px; 
    }
    .news_list dd {
        padding: 20px 0 10px 5px;
    }
    #emergency {
        padding: 0px 5px;
    }
    #emergency ul#emergency-inner {
        display: block;
    }
    #emergency ul li {
        display: block;
    }
    #emergency ul li#emergency-left {
        display: block;
        width: 100%;
        padding: 8px 0;
    }
    #emergency ul li#emergency-right {
        width: 100%;
        margin: 0;
        padding: 0;
    }
    li#emergency-right ul {
        margin: 0;
        padding: 6px 0 6px 10px;
    }
/* content.css
------------------------------------------------------------------------- */
    #cateimg {
        max-width: 100%;
        margin: 0 auto 10px;
    }
    #cateimg h1 {
        top: 45%;
        padding: 2px 0 0;
    }
    #cateimg img {
        width: 100%;
    } 
    .indexlist {
        max-width: 680px;
        margin:  0 auto 20px; 
    }
    #ystory {
        max-width: 680px;
        margin: 0 auto;
    }
    #ystory dt {
        float: none;
    }
    #ystory dl {
        margin: 10px;
    }
    #ystory dd {
        padding: 0 20px 7px
    }
    #ystory p#ylist {
        float: none;
        margin: 0 auto;
    }
    #page ul, #page ol {
        padding: 10px;
    }
    #content ul#public-year {
        max-width: 440px;
        margin: 0 auto
    }
    .event_list {
        max-width: 680px;
        margin: 0 auto;
    }
    .event_list ul {
        max-width: 310px;
        margin: 0 auto;
    }
    .event_list ul li {
        height: 270px;
        margin: 0 5px;
        background: none !important;
    }
    .event_list ul li img {
        max-height: 210px ;
    }
	#content #public #adobe {
		margin-left: 0;
	}
    .listblock3 {
        width: 31%;
        margin: 0 1.1%;
    }
    .listblock2 {
        width: 48%;
        margin: 0 1%;
    }
    p.thumbitem img {
        box-sizing: border-box;
    }
    ul.list1-4 {
        width: 45%;
    }
}

/* -------------------------------------------------------------------------
 ?.　画面幅 479px まで
------------------------------------------------------------------------- */

@media screen and (max-width:479px) {

/* base.css
------------------------------------------------------------------------- */
    #content #side_banner ul {
        max-width: 310px;
    }
    ul.globalnavi li a {
        font-size: 70%;
    }
    ul.globalnavi li#gnavi_sangyou a {
        letter-spacing: -2px
    }
    #kurashi_navi ul {
        max-width: 277px;
    }
    #footer_banner ul {
        max-width: 250px;
    }
    
/* top.css
------------------------------------------------------------------------- */
    ul#top_tabarea-tab li.active {
        background:  url(../images/top/base/tab_li-bg.png)no-repeat 95% 9px #FFF
    }
    #kurashi_navi ul {
        max-width: 278px;
    }
    
/* content.css
------------------------------------------------------------------------- */
    .indexlist ul {
        padding: 0 8px 0;
    }
    .listblock3, .listblock2 {
         float: none;
         width: 100%;
         margin: 0 0 20px;
    }
    .listblock3 p img, .listblock2 p img {
        width: 100%
    }
    p.thumbitem img {
        max-width: 260px !important;
        margin: 0 auto;
    }
    #content .public-right {
        display: block;
        float: none;
        max-width: 240px;
        margin-right: 0;
        margin: 0 auto;
    }
    #content .public-left {
        margin-right: 0;
    }
    #content #public .wcvimg-floatleft {
        float: none;
		display: block;
		margin: 0 auto;
	}
    #content ul#public-year {
        max-width: 210px;
    }
    ul.list1-2 {
        width: 100%;
        max-width: 300px;
    }
	#cateimg h1 {
		top: 35%;
	}
	#content div.wcv-inner2-l,
	#content div.wcv-inner2-r,
	#content div.wcv-inner3,
	#content div.wcv-inner3-r,
	#content div.wcv-inner4,
	#content div.wcv-inner4-r {
		width: auto;
		float: none;
	}
}