@charset "utf-8";
/* CSS Document */
img{max-width:100%;}

.content{
width:960px;
margin:0 auto;}

#main h2{
font-size:30px;
padding:5px 0 0 10px;
vertical-align:bottom;
border-left:solid 10px #E7004F;
border-bottom:solid 3px #E7004F;
margin-bottom:40px;}

#main h3{
font-size:30px;
color:#FFF;
text-shadow:0 0 4px #000;
width:23em;
text-align:center;
margin:0 auto;
border-radius:5px;
line-height:60px;
background:-webkit-linear-gradient(bottom,#FAA4A4 0%,#FBDEDE 50%,#FAA4A4 100%);
background:-moz-linear-gradient(bottom,#FAA4A4 0%,#FBDEDE 50%,#FAA4A4 100%);
background:-ms-linear-gradient(bottom,#FAA4A4 0%,#FBDEDE 50%,#FAA4A4 100%);}

#wrap{
overflow:hidden;
width:920px;
margin:40px auto 20px;
background:#FBF9EF;
padding:20px;
border-radius:5px;}
#wrap .img{
float:right;
width:250px;}
#wrap .text{
float:right;
width:650px;
margin-right:20px;
line-height:1.5;}
#wrap .text span{
display:none;}

@media screen and (max-width:959px){
.content{
width:100%;}

#wrap{
width:100%;
padding:2%;}
#wrap .img{
width:30%;}
#wrap .text{
float:left;
width:64%;
margin-right:2%;}
}

@media screen and (max-width:699px){
#wrap{
width:95%;}
#wrap .img{
float:none;
width:100%;
margin-bottom:10%;
text-align:center;}
#wrap .img span{display:none;}
#wrap .text{
float:none;
width:100%;
margin-right:0;}
#wrap .text span{
display:block;}

#main h3{
font-size:20px;
width:13em;
line-height:1.5;
background:none;}
#main #h3_sp_back{
border-radius:5px;
background:-webkit-linear-gradient(bottom,#FAA4A4 0%,#FBDEDE 50%,#FAA4A4 100%);
background:-moz-linear-gradient(bottom,#FAA4A4 0%,#FBDEDE 50%,#FAA4A4 100%);
background:-ms-linear-gradient(bottom,#FAA4A4 0%,#FBDEDE 50%,#FAA4A4 100%);}
#main h3 span{font-size:30px;}
}