html, body {
    height: 100%;
    margin: 0;
}

.flex-container{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
margin:0 auto;
}
.flex-container {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
     -ms-flex-direction: column;
         flex-direction: column;
}

.clearfix{
clear:both;
}
.container-width{
width:90%;max-width:1150px;margin:0 auto;
}
.flex-sect{
padding:100px 0; background-color:#fafafa;
}
.flex-title{
font-size: 4em;
font-family: "modula-serif", serif;
text-align:left;
font-weight: 400;
user-select: none;
color: #C0C0C0;
letter-spacing: 0.1em;
padding:10px;
}
.flex-desc{
margin-bottom:55px;
font-size: 1.3em;
font-family: "Sawarabi Gothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", sans-serif;
font-weight: 400;
font-feature-settings: "palt" 1;
text-align:left;
color: #696969;
padding:5px;
}
.cards{
padding:20px 0;
display:flex;
justify-content:
space-around;
flex-flow:wrap;
}
.card{
background-color: white;
height:350px;
width:350px;
margin-bottom:30px;
box-shadow:0 1px 2px 0 rgba(0, 0, 0, 0.2);
border-radius:2px;
transition:all 0.5s ease;
font-weight:100;
overflow:hidden;
}
.card:hover{
margin-top:-15px;
box-shadow:0 20px 30px 0 rgba(0, 0, 0, 0.2);
}
.card-header{
height:155px;
background-image:url("/images/image1.jpg");
background-size:cover;
background-position:center center;
}
.card-header.ch2{background-image:url("/images/image2.jpg");}
.card-header.ch3{background-image:url("/images/image3.jpg");}
.card-header.ch4{background-image:url("/images/image4.jpg");}
.card-header.ch5{background-image:url("/images/image5.jpg");}
.card-header.ch6{background-image:url("/images/image6.jpg");}
.card-body{
padding:15px 15px 5px 15px;
color:#555;
}
.card-title{
font-size: 2.1em;
font-family: "modula-serif", sans-serif;
font-weight: 400;
letter-spacing: 0.1em;
color: #C0C0C0;
margin-bottom:5px;
}
.card-sub-title{
font-size:1.2em;
font-family: "Sawarabi Gothic", 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', sans-serif;
font-weight: 400;
font-feature-settings: "palt" 1;
color: #696969;
margin-bottom:15px;
}
.card-desc{
font-size: 0.95em;
font-family: "Sawarabi Gothic", 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', sans-serif;
font-weight: 400;
font-feature-settings: "palt" 1;
color: #222222;
line-height:1.7;
}
.footer-under{
padding-bottom:30px;
padding-top:32px;
color:#eee;
position:relative;
background-color:#696969;
}
.footer-container{
display:flex;
flex-wrap:wrap;
}
.foot-list{
float:left;
width:350px;
}
.foot-list-title{
font-size: 2.5em;
font-family:"modula-serif", serif;
user-select: none;
font-weight:300;
letter-spacing: 0.2em;
color: white;
margin-top:5px;
margin-bottom:10px;
padding:0.5em 0;
}
.foot-list-item{
font-size: 1em;
font-family: "Sawarabi Gothic", 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', sans-serif;
font-weight: 400;
font-feature-settings: "palt" 1;
line-height: 1.5;
color: white;
padding:0.5em 0;
}
.p{
font-size: 1em;
font-family: "Sawarabi Gothic", 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', sans-serif;
font-weight: 400;
font-feature-settings: "palt" 1;
line-height: 1.4;
}

.fadeIn {animation-duration: 0.3s; animation-delay: 0.5s;}
@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}