/*　基本　*/
*{
	margin:0;
}

body {
	width:100%;
	text-align:center;
	font-family: "verdana", "ヒラギノ角ゴ W3", "メイリオ", sans-serif;
}
.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
/* End hide from IE-mac */

a{
	color:#06c;
	text-decoration:none;
}
a:hover{
	color:#f44;
	text-decoration:underline;
}
a:hover img{
	filter:alpha(opacity=70);
	opacity:0.7;
}
/*　赤いボタン　*/
a.redBtn{
	display:block;
	text-align:center;
	color:#fff;
	border-radius:4px;
	-webkit-border-radius:4px;
	-moz-border-radius:4px;
	background:#f44;
}
a.redBtn:hover{
	text-decoration:none;
	background:#f88;
	background:-moz-linear-gradient(top,#f44,#f88);
	background:-webkit-gradient(linear,left top,left bottom,from(#f44),to(#f88));
	background:linear-gradient(to bottom, #f44, #f88);
}
a.redBtn:active{
	color:#f44;
	background:#faa;
}
/*　ページ　*/
h1.title{
	width:100%;
	height:140px;
	background:url(header2014_bg.png) repeat-x ;
}
header.header{
	width:100%;
	height:50px;
	margin:0 !important;
	text-align:center;
	background:#f44;
}
.bc_navi{
	list-style:none;
	background:#f44;
}
.bc_navi li{
	margin:0 !important;
	padding:0 !important;
	display:inline-block;
	line-height:50px;
}
.bc_navi li a{
	margin:0 !important;
	padding:0 20px;
	display:block;
	height:50px;
	color:#fff;
}
.bc_navi li a:hover{
	text-decoration:none;
	background:#f88;
}
.mm h1{width:100%; max-width:100%; height:auto; margin:0 !important; padding:0 !important; border:none !important; background:#000;}
@media only screen and (max-width:320px){
	.mm h1{width:100%; max-width:100%; height:auto;}
}
.mm h1 img{max-width:100%; height:auto;}

article{
	width:640px;
	margin:0 auto;
	color: #655;
	font-size:14px;
	line-height:1.8;
	text-align:left;
	font-family: "verdana", "ヒラギノ角ゴ W3", "メイリオ", sans-serif;
}
article h1{
	margin:20px 0;
	padding-left:8px;
	font-size::140%;;
	color:#f44;
	line-height:1.2;
	border-left:6px solid #f44;
}
article h2{
	margin:1em 0;
	font-size:120%;
	color:#f44;
	line-height:1.2;
}
article h1.article_title{
	padding:1em;
	line-height:1.2;
	border:none;
	color:#fff;
	background:#322;
}
article p{
	margin:1em auto;
}
.photo_area{
	list-style:none;
	margin:0 !important;
	padding:0 !important;
}
.photo_area li{
	width:152px;
	height:152px;
	line-height:152px;
	margin:1px !important;
	padding:0 !important;
	vertical-align:middle;
	display:inline-block;
	background:#433;
}
.photo_area li a {
	display:block;
	width:152px;
	height:152px;
	vertical-align:middle;
}
.photo_area li a img{
	max-width:150px;
	max-width:150px;
	border:1px solid #988;
	vertical-align:middle;
}
table#photos{
	max-width:100% !important;
	width:100%;
	overflow:auto;
}

p.al-right{text-align:right;}
p.question{margin:2em 10px 1em 10px !important; font-weight:bold; color:#f44;}
p.answer{margin:1em 10px;}
p.photo{margin:1em 10px; text-align:center;}
p.photo img{border:5px solid #ccc; max-width:100%;}
dl{font-size:80%; line-height:1.4;}
dl dt{font-weight:bold;}
dl dd{margin-left:1em;}
/*　フッター　*/


footer {
	clear: both;
	border-top: 1px solid #e2dada;
	background: #f0ebeb;
	}
footer a {
	padding: 0 2px;
	text-decoration: none;
	color: #333;
	}
footer a:hover {
	text-decoration: none;
	color: #444;
	}

@media only screen and (max-width:640px){
	h1.title{width:100%; height:auto;}
	h1.title img{max-width:100%;}
	header.header{width:100%;height:auto; margin:0 !important;}
	header.header ul{width:100%; margin:0; padding:0;}
	header.header li{width:49%; line-height:3em; font-size:9pt;}
	header.header li a{height:3em}
	article{width:98%; margin:0 1%;}
	article h1{font-size:140%;}
	.photo_area li{width:49%; height:auto;}
	.photo_area li a {width:100%; height:100%;}
	.photo_area li a img{max-width:100%; max-width:100%; border:none;}
	table#photos td a img{max-width:100%;}
}
.ao02 {padding:1em;}

.cols{
	font-size:0;
	text-align:center;
}
.cols > *{
	display:inline-block;
	font-size:12pt;
	vertical-align:top;
	box-sizing:border-box;
}
.col_4{
	width:23%;
	margin:1%;
	padding:0.8em;
}
.col_3{
	width:31%;
	margin:1%;
	padding:0.8em;
}
.col_2{
	width:48%;
	margin:1%;
	padding:0.8em;
}
.cols > .m-photo-box{
	font-size:10px;
	line-height:1.2;
	padding:0;
}
@media only screen and (max-width:640px){
.col_4{
	width:48%;
}
.col_3{
	width:48%;
}
.col_2{
	width:98%;
}
.col_4.sm{
	width:31%;
}
.col_3.sm{
	width:31%;
}
.col_2.sm{
	width:48%;
}
}