@charset "UTF-8";

/*****************************************
 共通
******************************************/
/*** contents ***/
@media print,screen and (min-width:1207px){
	.none1207 { display: none; }
	
	#main {
		width: 1207px;
		margin: 0 auto;
		margin-top: 50px;
		margin-bottom: 50px;
	}
	#main_l {
		display: inline-block;
		float: left;
		width: 950px;
		vertical-align: top;
	}
	#main_l section ,
	#main_l > div section {
/*		width: 900px;*/
		width: 950px;
	}
	#side {
		display: inline-block;
		width: 250px;
		vertical-align: top;
	}
	
	article#home1 section,
	article#home2 section,
	article#home3 section,
	article#home4 section {
		display: block;
		width: 1207px;
		margin: 0 auto;
	}

}


@media screen and (max-width:1206px){
	.none1206 { display: none; }
	/* bread */
	#bread {
		width: auto;
	}
	
	/* sidebar */
	#side {
		width: 95%;
		margin: 0 auto;
	}
	#side h3,
	#side ul {
		margin-left: 0px;
		width: auto;
	}
	
	#side .old-menu {
		margin-left: 0px;
		margin: 0 auto;
		margin-bottom: 30px;
	}
	
	#sidebar ul {
		background-color: #fff;
		color: #333;
	}
	#sidebar ul li {
		display: inline-block;
		margin: 0px;
	}
	#sidebar ul li a {
		height: auto;
	}
	
	#main_l section.contents {
		display: block;
		width: 95%;
	}
	
	/*** topics_title ***/
	h1.topics_title {
		width: auto;
	}

}

@media screen and (min-width:1001px){
	.none1001 {
		display: none;
	}
}

@media screen and (max-width:1000px){
	.none1000 {
		display: none;
	}
	
	section {
		width: 95%;
	}
	
	
	.retu4 {
		display: block;
		width: auto;
		margin: 0 auto;
	}
	.retu4 th {
		margin-top: 10px;
		background-color: green;
		color: #fff;
	}
	.retu4 th,
	.retu4 td {
		display: block;
		width: 100%;
	}
	.retu4 td.none1000 {
		display: none;
	}
	
	.day:before,
	.hall:before {
		margin-right: 10px;
		padding: 1px 4px;
		background-color: #cdebbe;
		color: #333;
		font-size: 0.75em;
		letter-spacing: 3px;
	}
	.day:before {
		content: "\65E5\6642";
	}
	.hall:before {
		content: "\4F1A\5834";
	}
	
	/*** topics_title ***/
	h1.topics_title {
		width: 95%;
	}
	h1.topics_title img {
		width: 100%;
	}
	
	/*** side bar ***/
	#side > ul {
		width: auto;
	}
	#side > ul li br {
		display: none;
	}

}


@media all and (min-width:821px){
	.none_min821 {
		display: none;
	}
}

@media all and (max-width:820px){
	.none_max820 {
		display: none;
	}
}


@media screen and (max-width:500px){
	body {
		font-size: 0.9em;
	}
	
	#main {
		margin-top: 20px;
	}
	section {
		margin-top: 10px;
		margin-bottom: 20px;
	}
	section p {
		margin: 0px;
		line-height: 1.5em;
	}
	#main_l section.contents {
		font-size: 0.9em;
	}
	.contents ul,
	.contents ol {
		margin-right: 0;
		margin-left: 0;
	}
	.contents ul.disc,
	.contents ol.decimal {
		margin-left: 20px;
	}
	
	/*** sidebar banner ***/
	#sidebar ul li img {
		width: 180px;
	}
}

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


/***************************************************
 header
****************************************************/

/* header-menu */
/* mobile */
@media screen and (max-width:1206px){
	#priNavi {
		display: none;
	}
	nav {
		position: relative;
		height: 50px;
	}
	.drawer {
	position: relative;
		width: 100%;
		height: 50px;
		background-color: #fff;
	z-index: 100;
		box-shadow: 0px 1px 3px rgba(0,0,0,0.4);
		-webkit-box-shadow: 0px 1px 3px rgba(0,0,0,0.4);
		-moz-box-shadow: 0px 1px 3px rgba(0,0,0,0.4);
	}
	.drawer h1 {
		width: auto;
	}

	.drawer a img {
		width: auto;
		height: 34px;
		margin: 5px;
	}

	.logo-sub { display: none; }

	#nav-wrapper {
		height: 0px;
	}
	.menu {
		width: 100%;
		margin: 0;
		transform: translateY(-100%);
		transition:ease .3s;
		background-color: green;
		color:#fff;
		overflow-y: hidden;
		height: auto;
		z-index:100;
	}
	.menu.open {
		margin: 0;
		box-shadow: 0px 1px 3px rgba(0,0,0,0.4);
	}
	.menu li {
		margin: 0;
		border-bottom: 1px solid #fff;
	}
	.menu li:last-child {
		border-bottom: none;
	}
	.menu > li:hover {
		background-color: #333;
	}
	.menu li a {
		display: inline-block;
		padding: 20px;
		text-decoration: none;
		color: #fff;
	}
	.menu .child i {
		float: right;
		color: #fff;
		font-size: 1.5em;
	padding: 20px 10px;
	}
	.menu .child ul {
		display: none;
		margin: 0;
		background-color: #3eb134;
	}
	.menu .child ul li {
		overflow: hidden;
		transition: .2s;
	}
	.menu .child ul li a {
		display: block;
	}
	#ul_menu li:hover ul li{
		overflow: visible;
		height: 35px;
	}

	.menu .child ul li a:hover {
		background-color: yellowgreen;
	}
	
	#nav .hm_block a {
		display: block;
	}
	#nav .login {
		background-color: #fff;
		box-shadow: 0px 2px 2px rgba(0,0,0,0.3);
	}
	#nav .login a {
		display: block;
		background-color: yellowgreen;
		color: #fff;
		text-align: center;
	}
	#nav .login a:hover {
		text-shadow: 1px 1px 1px #666;
		background-color: #179aff;
	}
}

/* pc */
@media print,screen and (min-width:1207px){

	.menu > li.none1207 {
		display: none;
	}
	/*.drawer,*/
	.drawer {
		width: 1207px;
		margin: 0 auto;
		padding: 5px 0px;
	}
	.drawer a img {
		margin: 8px 0px 0px;
	}
	.drawer a.login {
		margin-top: 11px;
		margin-right: 10px;
	}
	.toggle { display: none; }
	#nav-wrapper {
		width: 100%;
		height: 42px;
		background: url(../../common/img/bg_gmenu.png) repeat-x 0 0;
	}
	.menu {
		width: 1207px;
		margin: 0 auto;
		text-align: center;
		font-size: 1.1em;
		text-shadow: 1px 1px rgba(0,0,0,0.5);
		white-space: nowrap;/*メニューを折り返さないおまじない*/
	}
	.menu li {
		text-align: center;
	}
	.menu li a {
		text-decoration: none;
	}
	.menu > li {
		display: inline-block;
		margin: 0px;
		border-right: 1px solid #999;
	}
	.menu > li:first-of-type {
		border-left: 1px solid #999;
	}
	.menu > li a {
		display: block;
		width: 200px;
		padding: 13px 0px;
		color: #fff;
		background-color: transparent;
		line-height: 1.0em;
		font-size: 0.9em;
	}
	.menu > li:hover a {
		display: block;
		transition: 0.2s ease;
		color: #fff;
		background-color: green;
		transition: .2s;
		text-shadow: none;
	}
	#nav li a.active {
		background-color: rgba(255,255,255,0.3);
		color: #fff;
	}
	.menu .child { position: relative; }
	.menu .child i { display: none; }
	.menu .child ul {
		position: absolute;
		transition: 0.2s ease;
		visibility: hidden;
		opacity: 0;
		margin-top: 0px;
		margin-bottom: 0px;
		padding: 0px;
	}
	.menu .child:hover > ul {
		margin: 0;
		visibility: visible;
		opacity: 1;
	}
	.menu .child ul li {
		margin: 0;
		background-color: #aaa;
		border-bottom: 1px solid #fff;
	}
	.menu .child ul li:last-of-type {
		border-bottom: 1px solid #ccc;
	}
	.menu .child ul li a {
		display: block;
		width: 200px;
		padding: 10px 0px;
		color: #fff;
		background-color: #3eb134;
		border-bottom: none;
		font-size: 0.8em;
	}
	.menu .child ul li a:hover {
		background-color: #000;
		color: #fff;
	}
	
	#nav .login {
		display: none;
	}

}

/*** main ***
@media screen and (min-width:1207px){
	#main {
		width: 100%1207px;
	}
}
@media screen and (max-width:1206px){
	#main {
		width: 100%;
	}
}


/***************************************************
/* ホーム(index.php)
****************************************************/

/**** slide ****/
@media print,screen and (min-width:1207px){
	#slide2 {
		display: none;
	}
}
@media screen and (max-width:1206px) and (min-width:1001px){
	#slide1,
	.slick-track {
		width: 1207px;
	}
	#slide_news .none1207,
	.slick-dots {
		display: none;
	}
	.buttons {
	}
	#slide2 {
		display: none;
	}
}
@media screen and (max-width:1000px){
	#slide1 {
		display: none;
	}
	#slide_news {
		height: auto;
		margin-top: -10px;
		padding-bottom: 50px;
		background: none;
		background-color: #fff;
	}
	#slide2,
	.single {
		width: 100%;
	}
	#slide2 .single li {
		height: auto;
	}
	#slide2 .single li img {
		width: 100%;
	}
	
	/* slick-style.css */
	.slick-dots {
		position: static;
		bottom: 0px;
	}
	
	/* news */
	#slide_news #news {
		position: relative;
		width: 90%;
		margin: 0 auto;
		margin-top: 30px;
		right: 0;
	}
	
	#home1 #kobo_banner {
		margin-top: 0;
	}

}


/*** seminar event ***/
@media screen and (max-width:1206px) and (min-width:701px){
	
	#seminar_event > div {
		display: block;
		width: 90%;
		margin: 0 auto;
		margin-top: 30px;
	}
	
}
@media screen and (max-width:700px){
	#seminar_event > div {
		display: block;
		width: 95%;
		margin: 0 auto;
		margin-bottom: 50px;
	}
	#seminar_event > div#seminar h1 a,
	#seminar_event > div h1 a {
		width: 100px;
		height: auto;
		margin-top: -6px;
		margin-left:28px;
		padding: 10px 0px 8px;
		text-align: center;
		box-shadow: none;
		border-radius: 8px 8px 0px 0px;
		font-size: 16px;
	}
	#seminar_event > div ul {
		height: auto;
		padding: 10px;
	}
	#seminar_event > div ul li {
		width: 33%;
	}
}
@media screen and (max-width:510px){
	#seminar_event > div ul li {
		width: 48%;
	}
}
@media screen and (max-width:370px){
	#seminar_event > div ul li {
		width: 100%;
	}
}


/*** video ***/
@media screen and (max-width:1207px) and (min-width:1001px){
	#home2 {
		width: 100%;
	}
	#home2 #video > div iframe {
		width: 560px;
		height: 315px;
	}
	#home2 #video .archive li iframe {
		width: 222px;
		height: 125px;
	}
}
@media screen and (max-width:1000px){
	#home2 #video {
		width: 90%;
		margin: 0 auto;
	}
}
@media screen and (max-width:1206px) and (min-width:701px){
	#home2 #video > div iframe {
		display: block;
		width: 100%;
		max-height: 500px/*587px*/;
		margin: 0 auto;
		float: none;
	}
	#home2 #video > div p {
		width: auto;
		min-height: auto;
		margin: 0px;
		border-radius: 0px;
	}
}
@media screen and (max-width:700px) {
	#video > div iframe {
		display: block;
		width: auto;
		height: auto;
		margin: 0 auto;
		text-align: center;
	}
	#home2 #video > div p {
		width: auto;
		min-height: auto;
		height: auto;
		border-radius: 0px;
	}
}


/*** feature ***/
@media screen and (max-width:1000px){
	#feature {
		width: 95%;
	}
	#feature ul {
		width: 90%;
		text-align: center;
	}
}

@media screen and (max-width:800px){
	#feature li {
		width: 30%;
	}
	#feature li a  {
		min-height: 260px;
	}
	#feature li a img {
		width: 100%;
		margin-bottom: 10px;
	}
}


/*** promotion ***/
@media screen and (max-width:928px){
	#promotion {
		width: 95%;
		text-align: center;
	}
}

/*** about_us ***/
@media screen and (max-width:1000px){
	#about_us .katsudo ul {
		width: 100%;
	}
	#about_us .katsudo ul li {
		width: 45%;
		margin-right: 5px;
	}
	#about_us .katsudo ul li img {
		width: 100%;
	}
}



/***************************************************
 about/
****************************************************/
@media screen and (min-width:1001px){
	#sosikizu img.none1001 {
		display: none;
	}
}
@media screen and (max-width:1000px){
	#sosikizu img.none1000 {
		display: none;
	}
}

@media screen and (max-width:420px){
	#sosikizu img.none1001 {
		width: 100%;
	}
}


/***************************************************
 security_system/
****************************************************/


/***************************************************
 report/
****************************************************/

/*** 計画 ***/

@media screen and (min-width:1001px){
	.report .tac br {
		display: none;
	}
}
@media screen and (max-width:1000px){
	.report .tab dt {
		float: none;
		width: auto;
	}
	.report .tab dd {
		padding-left: 0;
	}
	.report dl.list dt {
		float: none;
	}
	.report dl.list dd {
		padding-left: 0px;
		padding: 3px 15px;
	}
	.report dl.list dd.blank {
		display: none;
	}
	.report .tac {
		text-align: left;
	}
	
	.report .retu4 th {
		padding-right: 0px;
	}
	.report .retu4 td {
		padding-left: 3.5em;
		text-indent: -3.5em;
	}
}

/*** 報告 ***/
@media screen and (max-width:500px){
	.hyo_report > dt {
		width: 80px;
	}
	.hyo_report > dd {
		padding-left: 86px;
	}
	.hyo_repoinfo dt {
		float: none;
		display: block;
		width: 150px;
		margin: 0 auto;
		margin-top: 10px;
		padding: 0px;
		background-color: #deffc0;
		text-align: center;
		border-radius: 50px;
	}
	.hyo_repoinfo dd {
		padding: 5px 0px;
	}
}



/***************************************************
 food_life/
****************************************************/
@media screen and (max-width:1000px){
	.food_life .contents ol {
		display: block;
		width: 95%;
		margin: 0 auto;
		padding-right: 0;
	}
}


/***************************************************
 member-list/
****************************************************/
@media screen and (max-width:800px){
	.member-list th,
	.member-list td,
	.member-list tbody td {
		display: block;
		border: none;
	}
	.member-list thead,
	.member-list tbody tr td:first-of-type br,
	.member-list2 tbody tr td:first-of-type br,
	.member-list tbody tr br.br,
	.member-list2 tbody tr br.br {
		display: none;
	}
	.member-list tbody tr:nth-child(odd) td {
		background-color: #fff;
	}
	.member-list tbody tr th,
	.member-list tbody tr:nth-child(odd)  th {
		margin-top: 10px;
		background-color: #80cf8f;
		color: #fff;
	}
	.member-list tbody tr td {
		padding: 3px;
		padding-left: 10px;
		border-left: none;
		line-height: 1.4em;
	}
}


/***************************************************
 nyukai/
****************************************************/
@media screen and (max-width:800px){
	#kaiin1 .nyukai .nagare > li,
	#kaiin2 .nyukai .nagare > li {
		width: 100%;
		height: auto;
	}
	#kaiin1 .nyukai .nagare > li.yajirusi,
	#kaiin2 .nyukai .nagare > li.yajirusi {
		margin-top: -20px;
		left: 50%;
	}
	#kaiin1 .nyukai .nagare > li.yajirusi img,
	#kaiin2 .nyukai .nagare > li.yajirusi img {
		transform:rotate(90deg);
		width: 17px;
	}
}

/***************************************************
 workshop/
****************************************************/
@media screen and (max-width:500px){
	.workshop dl {
		background-color: #fff;
		font-size: 0.85em;
		border: none;
	}
	.workshop dl dt {
		float: none;
		padding: 0px;
		background-color: #80cf8f;
		border-radius: 50px;
	}
	.workshop dl dd {
		margin-left: 10px;
		border: none;
	}
	
	.workshop .image ul li img {
		width: 150px;
		height: auto;
	}
	.workshop .image ul li img.tate {
		width: 100px;
		height: auto;
	}
	.workshop .image ul li img.yoko {
		width: 85%;
		height: auto;
	}
}

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

/*** schedule ***/

	.workshop #schedule {
		width: 100%;
		background-color: #fff;
	}
	.workshop #schedule thead,
	.workshop #schedule tbody td br {
		display: none;
	}
	.workshop #schedule tbody th,
	.workshop #schedule tbody td {
		display: block;
		border-collapse: collapse;
		text-align: left;
		border-bottom: none;
	}
	.workshop #schedule tbody th,
	.workshop #schedule tbody tr:nth-child(odd) th {
		background-color: #caf3d5;
		color: #000;
		font-weight: 200;
		text-align: center;
	}
	.workshop #schedule tbody td {
		padding-top: 0;
	}
	.workshop #schedule tbody td:first-of-type {
		padding-top: 5px;
	}
	.workshop #schedule tbody td:before {
		content: attr(data-label);
		float: left;
		width: 80px;
		margin-right: 5px;
		padding: 1px 5px;
		background-color: #7fc3a2;
		color: #fff;
		text-align: center;
		clear: both;
	}
	.workshop #schedule tbody td ul {
		margin: 0px 0px 0px 95px;
	}
	.workshop #schedule tbody td ul li {
		margin: 0px;
	}

}


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

	/***** eiyoshitaiken (.sanitation) *****/
	.sanitation .contents ul.img_2 li {
		display: block;
	}
	.sanitation .contents ul.img_2 li img {
		width: 100%;
		max-width: 640px;
	}
}

/***************************************************
 event/
****************************************************/
@media screen and (max-width:800px){
	.member-list.year_schedule {
		display: block;
		width: 90%;
		margin: 0 auto;
	}
	.member-list.year_schedule tbody,
	.member-list.year_schedule tbody tr {
		display: block;
	}
	
	.member-list.year_schedule tbody tr th.fr {
		float: none;
		display: inline-block;
		width: 50%;
		margin: 0;
		padding-top: 0;
		text-align: right;
	}
	.member-list.year_schedule tbody tr th.time {
		display: inline-block;
		width: 50%;
		margin: 0;
		text-align: left;
	}
	.member-list tbody tr {
		margin-top: 10px;
	}
	.member-list tbody tr:nth-child(odd) {
		background-color: #fff;
	}

	.member-list.year_schedule tbody tr td {
		padding-left: 4em;
		text-indent: -4em;
	}
	.member-list.year_schedule tbody tr td:before {
		content: attr(data-label);
		width: 80px;
		margin-right: 5px;
		padding-left: 8px;
		letter-spacing: 8px;
		background-color: #e0fbeb;
		color: darkgreen;
		font-weight: 700;
		font-size: 0.95em;
	}
	.member-list.year_schedule tbody tr td br {
		display: block;
	}
}

@media screen and (max-width:600px){
	.hyo_event > dl > dt,
	.hyo_event > dl > dd {
		line-height: 1.4em;
	}
	.hyo_event img {
		width: 130px;
	}

}


/***************************************************
 metabo_menu/
****************************************************/
@media screen and (max-width:1206px){
	.metabo {
		display: block;
		width: 95%;
		margin: 0 auto;
		clear: both;
	}
	.metabo #cooking {
		width: auto;
	}
	.metabo #cooking .fl .eiyoso {}
	.metabo #cooking .fl .item{
		width: 320px;
	}
	.metabo #cooking .fr #point h3 img {
		display: block;
		margin: 0 auto;
	}
	#side .archive.metabo {
		/*margin-left: 20px;*/
		width: auto;
		margin: 0;
		margin-bottom: 30px;
	}
}

@media screen and (max-width:1000px){
	.metabo #cooking  .fl {
		float: none;
		width: 100%;/*570px;*/
		margin: 0 auto;
	}
	.metabo #cooking .fr {
		float: none;
		display: block;
		width: 95%;
		margin: 0 auto;
	}
}

@media screen and (max-width:600px){
	.metabo #cooking  .fl {
		width: 100%;
	}
	#main_l.metabo #cooking h2.title {
		height: 55px;
	}
	.metabo #cooking .fl .all img {
		width: 95%;
	}
	.metabo #cooking .fl .eiyoso {
		display: block;
		margin: 0 auto;
		padding-bottom: 30px;
	}
	.metabo #cooking .fl .item {
		display: block;
		width: 306px;
		margin: 0 auto;
		margin-bottom: 30px;
	}
	.metabo #cooking .fl .item li a {
		margin: 5px 0px;
		padding: 12px 0px;
	}
	#side .archive.metabo {
		margin-left: 0px;
	}

}


/***************************************************
 miyayashiki/
****************************************************/
@media screen and (max-width:1206px){
	.miyayashiki {
		width: 95%;
		margin: 0 auto;
	}
	.miyayashiki section {
		width: 100%;
	}
}

@media screen and (max-width:1000px){
	.miyayashiki #topic #finished {
		margin-left: 45%;
	}
	
	/* recipe */
	section #recipe {
	}
	
	.miyayashiki #recipe .material {
	}
	
	.miyayashiki #recipe #procedure {
		width: auto;
	}
	
	.miyayashiki #recipe #procedure .procedure {
		min-height: 145px;
	}
	.miyayashiki #recipe #procedure >dl.procedure.h1 {
		min-height: 140px;
	}
	.miyayashiki #recipe #procedure >dl.procedure.h2 {
		min-height: 290px;
	}
	.miyayashiki #recipe #procedure >dl.procedure.h3 {
		min-height: 350px;
	}
	.miyayashiki #recipe #procedure .procedure dl,
	.miyayashiki #recipe #procedure .procedure dl dd {
		width: auto;
	}
	.miyayashiki #recipe #procedure .procedure > dt {
		float: left;
		width: 190px;
	}
	
	.miyayashiki #recipe #procedure .procedure > dt ul li {
		display: block;
	}
	.miyayashiki #recipe #procedure .procedure > dd {
		display: block;
		width: auto;
		margin-right: 5px;
		margin-left: 200px;
		font-size: 0.9em;
		vertical-align: top;
	}
	.miyayashiki #recipe #procedure .procedure > dd dt {
		clear: none;
	}
	
}

@media screen and (max-width:1000px) and (min-width:801px){
	.miyayashiki #topic p {
		width: 35%;
	}
	.miyayashiki #topic #finished {
		margin-left: 45%;
	}
}

@media screen and (max-width:800px){
	.miyayashiki #topic p {
		float: none;
		display: block;
		width: 100%;
	}
	.miyayashiki #topic #finished {
		display: block;
		margin: 0 auto;
	}
}

@media screen and (max-width:700px){
	.miyayashiki #recipe .material {
		float: none;
		display: block;
		width: auto;
		margin-bottom: 20px;
	}
	.miyayashiki #recipe .material dl dt {
		width: 60%;
	}
	.miyayashiki #recipe #procedure {
		margin-left: 0;
		padding-left: 0;
	}
}

@media screen and (max-width:700px){
	.miyayashiki #topic #finished {
		margin: 0 auto;
		margin-top: 10px;
	}
	.miyayashiki #topic #finished img#menu,
	.miyayashiki #topic #finished img#kongetuno {
		margin: 0 auto;
	}
}


/***************************************************
 sanitary/ -> sanitation/
****************************************************/
@media screen and (max-width:1000px){
	.sanitation .contents ul li img {
		display: block;
		width: 90%;
		margin: 0 auto;
		margin-bottom: 30px;
	}
}


/***************************************************
 food_education1/
****************************************************/


/***************************************************
 food_education2 -> asaoka/
****************************************************/
@media screen and (max-width:1000px){
	.asaoka #report .tac img {
		width: 90%;
		max-width: 300px;
	}
}


/***************************************************
 support-member/
****************************************************/
@media screen and (max-width:1200px){
	#support {
		width: 95%;
		margin: 0 auto;
		margin-top: 30px;
	}
	#support h2 {
/*		padding-left: 2.5em;
		text-indent: -2.5em;*/
		line-height: 1.3em;
	}
	#support h2 hr {
		margin-left: -2.5em;
		border-bottom: 2px dotted green
	}
	
}
@media screen and (max-width:1000px){
/* index.php */
	.support_topics .topics li {
		width: 30%;
		vertical-align: top;
	}
	.support_topics .topics li a,
	.support_topics .topics li a > div {
		display: block;
		vertical-align: top;
	}
	#main_l .support_topics .topics li h2 {
		display: block;
		vertical-align: top;
		font-size: 0.9em;
		line-height: 1em;
	}
	
/* vol */
	#support .topics {
		min-height: auto;
		padding: 10px;
	}
	#support .topics div {
		width: 100%;
		max-width: 100%;
		margin-right: 0;
	}
	#support .topics div h3 {
		margin-bottom: 0;
	}
	#support .topics div p {
		margin-bottom: 30px;
	}
	#support .topics img {
		display: block;
		float: none;
		width: 50%;
		max-width: 300px;
		height: auto;
		margin: 0 auto;
	}
	
	#support .article dd ul.img_r {
		width: 100%;
		max-width: 100%;
	}
	#support .article dd .article-img {
		display: block;
		margin: 0 auto;
	}
}

@media screen and (max-width:700px){
/* vol */
	#support .topics {
		padding: 10px;
	}
	#support .topics div {
		margin-right: 0;
	}
	#support .topics img {
		display: block;
		width: 50%;
		height: auto;
		margin: 0 auto;
	}

	#support .topics div {
		width: auto;
	}
	
	#support .article dd .img_c img {
		width: 90%;
	}
}


/***************************************************
 musashino-life/
****************************************************/
@media screen and (max-width:1206px){
	.m-life {
		width: 95%;
		margin: 0 auto;
	}
}

@media all and (min-width:821px){
	.m-life #report .operation.img3 {
		/*height: 520px;*/
		min-height: 450px;
	}
}

@media screen and (max-width:820px){
	.m-life {
		width: 95%;
		margin: 0 auto;
	}
	
	.m-life #topic {
		margin: 15px 0;
	}
	
	.m-life #report .operation > dt > ul li {
		width: 45%;
		margin: 0px 10px 0px 0px;
	}
	.m-life #report .operation > dt > ul li img {
		border: 3px solid #fff;
	}
	.m-life #report .operation h4 {
		width: 90%;
		max-width: 300px;
	}
	
	.m-life #recipe .outline {
		margin: 5px;
	}
	.m-life #report .outline .operation dt > ul > li {
		display: inline-block;
		width: 45%;
		margin: 0px 5px;
	}
	.m-life #report .outline .operation.li2,
	.m-life #report .outline .operation.img2,
	.m-life #report .outline .operation.li3,
	.m-life #report .outline .operation.img3,
	.m-life #report .outline .operation.li4,
	.m-life #report .outline .operation.img4 {
		height: auto;
	}
	
	.m-life #recipe .material,
	.m-life #complete .material {
		margin: 0 auto;
		margin-top: 15px;
		margin-bottom: 15px;
	}
	.m-life #recipe .material,
	.m-life #complete .material,
	.m-life #report .outline .operation dt {
		float: none;
	}
	.m-life #report .outline .operation dd {
		margin: 0;
	}
	
	.m-life #complete .finished img {
		width: 90%;
		max-width: 400px;
	}
	.m-life #complete .tac br {
		display: none;
	}
}


@media screen and (max-width:700px){
	.m-life #recipe > h3 {
		font-size: 1.25em;
		letter-spacing: 0px;
		font-weight: 700;
		line-height: 1.3em;
	}
	.m-life .remarks > dl > dt {
		float: none;
		margin: 0 auto;
	}
	.m-life .remarks > dl > dd {
		margin-left: 0;
	}
	.m-life .remarks > dl > dd h5 {
		text-align: center;
	}
}


/***************************************************
 privacy/
****************************************************/



/***************************************************
 inquiry/
****************************************************/


/***************************************************
 sitemap.php
****************************************************/
@media screen and (max-width:1000px){
	#sitemap > ul {
		display: block;
		width: auto;
	}
}


/***************************************************
 open-recruitment.php
****************************************************/
@media screen and (max-width:500px){
	#kobo ol {
		margin: 0px 20px;
	}
}


/***************************************************
 footer
****************************************************/
@media screen and (max-width:1206px)/* and (min-width:701px)*/{
	footer #footer_menu {
		display: block;
		margin-bottom: 20px;
		text-align: center;
	}
	footer > .fr {
		float: none;
	}
	footer #footer {
		text-align: center;
	}
}