@charset "Shift-Jis";

body {
margin: 0 ;				
padding: 0 ;			
font-size: 15px ;
font-family:メイリオ;	
line-height: 1.8 ;	
text-align:center;
text-decoration: none; 
border-style: none;
background-image : url('images/hsakuraenisi.jpg');
background-position:top right;
background-repeat:repeat; 
}

#bg {background-image: url("images/mirai1.jpg");
     background-repeat:no-repeat;
     background-size: 400px;
     background-position : 50% 5%;
}


img {
    border-style:none;
}

#all3{
margin-left:auto;          
margin-right:auto;       
background-image : url('images/hkaraginusiro9.gif');       
width:950px;
text-align:left;
}
   

.box {
position:relative;
text-align:left;
text-decoration: none; 
border-style: none;
top:50px;
width:665px;
margin-left:auto;          
margin-right:auto;
margin-bottom:100px;   
    background:#FFF;
    padding:50px 30px 50px 30px;
    font-weight:400;
    
}

.effect8
{
    position:relative;
    text-decoration: none; 
    border-style: none;
    -webkit-box-shadow:0 4px 20px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
       -moz-box-shadow:0 4px 20px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
            box-shadow:0 4px 20px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}
.effect8:before, .effect8:after
{
    content:"";
    position:absolute;
    z-index:-1;
    -webkit-box-shadow:0 0 20px rgba(0,0,0,0.8);
    -moz-box-shadow:0 0 20px rgba(0,0,0,0.8);
    box-shadow:0 0 20px rgba(0,0,0,0.8);
    top:10px;
    bottom:10px;
    left:0;
    right:0;
    -moz-border-radius:100px / 10px;
    border-radius:100px / 10px;
}
.effect8:after
{
    right:20px;
    left:auto;
    border-style: none;
    -webkit-transform:skew(8deg) rotate(3deg);
       -moz-transform:skew(8deg) rotate(3deg);
        -ms-transform:skew(8deg) rotate(3deg);
         -o-transform:skew(8deg) rotate(3deg);
            transform:skew(8deg) rotate(3deg);
}

.box h2{
color:#5B4C72;
line-height:50px;
width:600;
margin-left:auto;
margin-right:auto;
}

.box h3{
color:#5B4C72;
text-decoration: none; 
border-style: none;
line-height:60px;
width:600;
margin-left:auto;
margin-right:auto;
}

.box h4{
color:#546926;
line-height:30px;
width:600;
margin-left:auto;
margin-right:auto;
}

.box p{
color:#431d14;
font-size:16px;
}

/* スマホだけに適用するCSS */
@media screen and ( max-width:600px )
{
body{
font-size: 16px ;
}

.box {
position:relative;
text-align:left;
text-decoration: none; 
border-style: none;
width:90%;
top:0px;
margin-left:0px;          
margin-right:0px;
margin-bottom:50px;   
background:#FFF;
padding:0px 15px 2px 15px;
font-size:24px;
}

.box h3{
font-size: 24px ;

}

.effect8
{
    position:relative;
    text-decoration: none; 
    border-style: none;
    -webkit-box-shadow:0 4px 0px rgba(0, 0, 0, 0), 0 0 40px rgba(0, 0, 0, 0) inset;
       -moz-box-shadow:0 4px 0px rgba(0, 0, 0, 0), 0 0 40px rgba(0, 0, 0, 0) inset;
            box-shadow:0 4px 0px rgba(0, 0, 0, 0), 0 0 40px rgba(0, 0, 0, 0) inset;
}
.effect8:before, .effect8:after
{
    content:"";
    position:absolute;
    z-index:-1;
    -webkit-box-shadow:0 0 0px rgba(0,0,0,0);
    -moz-box-shadow:0 0 0px rgba(0,0,0,0);
    box-shadow:0 0 0px rgba(0,0,0,0);
    top:10px;
    bottom:10px;
    left:0;
    right:0;
    -moz-border-radius:0px / 0px;
    border-radius:0px / 0px;
}
.effect8:after
{
    right:0px;
    left:auto;
    border-style: none;
    -webkit-transform:skew(0deg) rotate(0deg);
       -moz-transform:skew(0deg) rotate(0deg);
        -ms-transform:skew(0deg) rotate(0deg);
         -o-transform:skew(0deg) rotate(0deg);
            transform:skew(0deg) rotate(0deg);
}


}