body {
    font-family: "Noto Sans Japanese", sans-serif;
	font-weight: 400;
	font-size: 30px;
	line-height:160% ;
	background: #fff;
}

aside {
    background-color: #ebebeb;
    -webkit-border-radius: 8px;
    border-radius: 8px;
    padding: 10px;
}
aside p:last-child {
    margin-bottom: 0;
}
a:link { 
	color: #0B2B83;
	text-decoration: none;
}
a:visited { 
	color: #0B2B83;
	text-decoration: none;
} 
a:hover {
      color: #0B2B83;
      text-decoration:underline;
}

img {
  vertical-align: bottom;
  width:100% ;
}
a:hover img {
opacity: 0.5;
filter: alpha(opacity=50);
}

/* clear
--------------------------------------------------*/
.cl{
clear:both;
}
.clx:after {
content: ".";
display: block; 
clear: both;
height: 0;
visibility: hidden;
}
.clx {
min-height: 1px;
}
* html .clx {
height: 1px;
/*\*//*/
height: auto;
overflow: hidden;
/**/
}

.yn {
display:flex;
-webkit-box-pack:justify;
-ms-flex-pack:justify;
justify-content:space-between;
flex-wrap:wrap;
width: 78%;
margin: 0 auto;
}
.bg{
background-color: #f6eaee;
}
.yn div{
width: 48%;
opacity: 0.5;
filter: alpha(opacity=50);
}
.yn div.active {
opacity: 1.0;
filter: alpha(opacity=100);
}
.btn_wrap {
position: relative;
}
.btn_wrap a{
position: absolute;
bottom:3%;
left:10%;
}

#footer {
background-color: #666666;
text-align: center;
font-size: 14px;
margin-top: 25px;
}
#footer a:link,
#footer a:visited{
color: #FFF;
}

@media screen and (min-width : 641px) {
#wrap {
	width:100% ;
	max-width:800px ;
	margin: 0 auto;
	background-color:#ffffff;
}
}
@media screen and (max-width : 640px) {
body {
	font-size: 0px;
}
#wrap {
	width:100% ;
	max-width:1000px ;
	margin: 0 auto;
	background-color:#ffffff;
}
img {
width:100% ;
}
.btn_wrap a img{
width:90% ;
}
#footer {
background-color: #666666;
text-align: center;
font-size: 14px;
margin-top: 25px;
overflow: hidden;
padding: 20px 0;
}
}