@charset "utf-8";

/* 800px以下から 1カラム表示
------------------------------------------------------------*/
@media only screen and (max-width: 800px) {
.tabimg {
    width: 99%;
    max-width: 680px;
    height: auto;
    text-align: center;
}
#wrapper, .inner {
    width: 98%;
}
#header h1 {
    color: #333;
    padding: 3px 0;
    font-size: 120%;
    font-weight: bold;
}
#header {
    width: 100%;
    padding: 0;
}
#header .inner {
    float: none;
    width: 100%;
    margin: auto;
}
#header .logo {
    padding: 2px 5px 10px;
    text-align: center;
}
.headright {
    float: none;
    text-align: center;
}
nav#mainNav {
    width: 99%;
}
nav#mainNav ul {
    margin: 0 auto;
}
nav#mainNav ul ul {
    padding: 0;
}
nav div.panel {
    float: none;
}
#mainImg img {
    width: 99%;
    max-width: 99%;
    height: auto;
    text-align: center;
}
#content, #sidebar {
    clear: both;
    width: 99%;
    float: none;
    margin: 0 auto;
    padding: 10px 0;
}
.breadcrumbs ul {
    width: 99%;
margin: 0 auto;
text-align: left;
}	
h2 {
    font-size: 180%;
    letter-spacing: 1px;
}
.toppage {
    padding: 0 0 20px 0;
    width: 100%;
	max-width:680px;
}	
.banner {
    width: 100%;
    margin: 0 auto;
    text-align: center;
}
p.banner img {
    width: 100%;
    height: auto;
}
p.footbanner img {
    width: 100%;
    height: auto;
    max-width: 100%;
}
#footer li {
    margin-bottom: 10px;
}
.tyousa {
    font-size: 120%;
}
.rousuibox2 .rbox2:first-child ul li {
    padding-left: 35px;
    letter-spacing: normal;
    line-height: 250%;
}
.rousuibox2 .rbox2 img {
    padding-bottom: 0;
}
.flex-container2 {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    display: -webkit-box;
    display: -moz-box;
    width: 100%;
    height: auto;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 20px;
}
.flex-item2 {
    width: 40%;
}
.flex-item2:first-child {
    width: 60%;
}
.flex-item2 img {
    width: 95%;
    max-width: 95%;
    height: auto;
}
ul.multifour2 li:last-child{
	    width: 70%;
	}
.item2 img {
    width:100%;
    max-width:330px;
		height: auto; 
		border: 0;
	}
    


ul.multifour {
    width:100%;
display: -webkit-box;
display: -moz-box;
display: -webkit-flexbox;
display: -moz-flexbox;
display: -ms-flexbox;
display: -webkit-flex;
display: -moz-flex;
display: flex;
    margin-bottom: 50px;
    flex-wrap: wrap;

}
ul.multifour li{
	    width: 33%;
margin-bottom:20px;
}
.item {
    width: 96%;
    max-width: 230px;
height: 400px;
    overflow: hidden;
    border: 1px solid #d4d4d4;
    box-shadow: 2px 2px 1px 1px #ddd;
    padding: 10px 10px 5px;
    font-size: 12px;
    text-align: right;
    margin: 0;
    
}
.item h3 {
    width: 100%;
    max-width: 210px;
    font-size: 13px;
    line-height: 30px;
    height: 30px;
    overflow: hidden; /* 長いタイトルは切り捨て。必要なら高さを増やしておく。 */
    margin: 0;
    padding: 0;
    background-color: #2fa9be;
}
/* 写真 */
.mainimage {
	position: relative;
    width: 100%;
    max-width: 210px;
	height: 100%; 
	max-height: 138px; 
	overflow: hidden;
	margin: 0 0px 10px 0px;
}
/* 幅644px以下から ヘッダー等微調節

@media only screen and (max-width: 644px){
	body{background-position:0 -25px;}
	#header h1{color:#333;}
	#header h2 img{max-width:90%;}
	nav#mainNav{width:98%;}
	#header{text-align:center;}
	#header h2,.headright{float:none;}
	.headright{padding:0 0 20px;}
	.headright p{text-align:center;}
	#headerInfo{width:250px;margin:0 auto;}
	img.alignright, img.alignleft{display: block;	margin:5px auto;}
	.alignright,.alignleft{float:none;}
}
------------------------------------------------------------*/
