@charset "utf-8";

/* index.css
------------------------------------------ */
/* [PC]
------------------------------------------ */
/* titleArea
------------------------------------------ */
main .titleArea{background:#fdf1f0;}
main .titleArea h1{width:950px;margin:0 auto 0 auto;font-size:0;line-height:0;}




/* happySupportArea
------------------------------------------ */
main .happySupportArea{margin-top:50px;}
main .happySupportArea .lead{width:950px;margin:0 auto 0 auto;color:#633d18;font-size:22px;line-height:2;text-align:center;}


/* navSec */
main .happySupportArea .navSec{margin-top:45px;padding:35px 0 35px 0;background-color:#ffcab1;}
main .happySupportArea .navSec ul{width:950px;margin:0 auto 0 auto;}
main .happySupportArea .navSec ul li{display:table-cell;font-size:0;line-height:0;}
main .happySupportArea .navSec ul li:nth-child(2){padding:0 25px 0 25px;}


/* listSec */
main .happySupportArea .listSec{padding:25px 0 50px 0;background-color:#fef7f6;}
main .happySupportArea .listSec ul{width:950px;margin:0 auto 0 auto;}
main .happySupportArea .listSec ul li{overflow:hidden;float:left;width:268px;margin:25px 25px 0 0;padding:0 15px 15px 15px;background-color:#ffffff;cursor:pointer;border:1px solid #ff7e3d;}
main .happySupportArea .listSec ul li:nth-child(3n){margin-right:0;}
main .happySupportArea .listSec ul li:nth-child(3n+1){clear:both;}
main .happySupportArea .listSec ul li p.photo{margin:0 -16px 10px -16px;}
main .happySupportArea .listSec ul li .textBox h2{font-size:20px;font-weight:normal;line-height:1.2;}
main .happySupportArea .listSec ul li .textBox h2 span{font-size:16px;}
main .happySupportArea .listSec ul li .textBox h2 a{color:#ff7e3d;text-decoration:none;}
main .happySupportArea .listSec ul li .textBox p{margin-top:15px;color:#444444;line-height:1.6;}
main .happySupportArea .listSec ul li .textBox p.end{color:#ff0000;font-weight:bold;text-align:center;}

main .happySupportArea .bottomNav{display:none;}



/* [SP]
------------------------------------------ */
@media screen and (max-width:640px){
/* titleArea
------------------------------------------ */
main .titleArea{background:transparent;}
main .titleArea h1{width:auto;}




/* happySupportArea
------------------------------------------ */
main .happySupportArea{margin-top:6.25%;}
main .happySupportArea .lead{width:auto;padding:0 3% 0 3%;font-size:10px;}
main .happySupportArea .lead .sp{display:inline-block;margin-bottom:3.25%;}


/* navSec */
main .happySupportArea .navSec{margin-top:6.25%;padding:3% 2.5% 6.5% 2.5%;}
main .happySupportArea .navSec ul{width:auto;margin:0 auto 0 auto;}
main .happySupportArea .navSec ul li{float:left;width:49%;margin:3.35% 1.55% 0 0;}
main .happySupportArea .navSec ul li:nth-child(2){margin-right:0;padding:0;}


/* listSec */
main .happySupportArea .listSec{padding:3.25% 3% 6.25% 3%;}
main .happySupportArea .listSec ul{width:auto;}
main .happySupportArea .listSec ul li{float:none;display:table;width:auto;margin:3.25% 0 0 0;padding:0;}
main .happySupportArea .listSec ul li p.photo{display:table-cell;width:50%;margin:0;text-align:left;vertical-align:top;}
main .happySupportArea .listSec ul li .textBox{display:table-cell;padding:4% 2.5% 2.5% 2.5%;text-align:left;vertical-align:top;}
main .happySupportArea .listSec ul li .textBox h2{font-size:10px;}
main .happySupportArea .listSec ul li .textBox h2 span{font-size:8px;}
main .happySupportArea .listSec ul li .textBox p{margin-top:10px;}

main .happySupportArea .bottomNav{display:block;font-size:10px;text-align:center;padding:1em 0;}

}