@charset "utf-8";

#fv { background: url(../images/static/about/fv.png) center center no-repeat; background-size: cover; padding: 140px 0;}

#about { padding: 75px 0 100px; text-align: center;}
#about .inner { width: 985px;}
#about h3 { padding: 0 0 45px; font-size: 22px; letter-spacing: 5px;}
#about h3 img { padding: 0 0 45px;}
#about p.text { line-height: 44px; font-size: 16px;}
#about h4 { font-size: 26px; padding: 120px 0 20px; border-bottom: 1px solid #000; margin: 0 0 40px;}
#about ul li { float: left; width: 270px; background: #f7f7f7; padding: 40px 20px; margin: 0 0 0 27px; height: 345px;}
#about ul li:first-child { margin: 0;}
#about ul li h5 { font-size: 18px; padding: 0 0 20px; font-family: 'Noto-Sans-JP-Medium';}
#about ul li img { padding: 0 0 15px;}
#about ul li p { font-size: 16px; text-align: left; line-height: 27px; font-family: 'Noto-Sans-JP-DemiLight';}

/* ------------------------------------------------------------ mobile */
@media only screen and (max-width:640px){

#fv { background: url(../images/static/about/fv.png) center center no-repeat; background-size: cover; padding: 30% 0;}
#fv h2 img { width: 200px; height: auto;}

#about { padding: 60px 0 20px; text-align: center;}
#about .inner { width: 94%;}
#about h3 { padding: 0 0 20px; font-size: 16px; letter-spacing: 1px;}
#about h3 img { padding: 0 0 20px; width: 180px; height: auto;}
#about p.text { line-height: 30px; font-size: 14px; text-align: left;}
#about h4 { font-size: 18px; padding: 60px 0 10px; border-bottom: 1px solid #000; margin: 0 0 20px;}
#about ul li { float: none; width: 94%; background: #f7f7f7; padding: 20px 3%; margin: 0 0 15px; height: auto;}
#about ul li:first-child { margin: 0 0 15px;}
#about ul li h5 { font-size: 16px; padding: 0 0 10px;}
#about ul li img { padding: 0 0 15px; width: 60px; height: auto;}
#about ul li p { font-size: 14px; text-align: left; line-height: 27px;}

}