@charset "UTF-8";

/* topImage
--------------------------------------------------------------------*/
#headImage {
  background: url(../img/topimg_other.jpg) center no-repeat;
  background-size: cover;
}




/* 納入実績
--------------------------------------------------------------------*/
.caseBox {
  padding: 1em 1em 0.5em;
  border-top: solid #ccc 1px;
}
.caseBox::after {
  content:".";
  height:0px;
  clear:both;
  display: block;
  visibility:hidden;
}
.caseBox .textR{
  text-align:right;
}
.caseBox .ul_case{
  display:flex;
  flex-wrap:wrap;
}
.caseBox .ul_case li{
  width:34%;
  line-height:2;
}
.caseBox .ul_case li:nth-child(3n+2){width:26%;}
.caseBox .ul_case li:nth-child(3n){width:40%;}
.caseBox .img {
  float: left;
  margin-right: 1em;
  width: 23%;
}
.caseBox h4::before {
  content: "";
  margin-right: 0.5em;
  border-left: solid #3598f0 6px;
}
.caseBox a {
  padding: 5px 2em;
  background: #3598F0;
  color: #fff;
}
.caseBox a:hover {
  text-decoration: none;
  opacity: 0.8;
}
/* pager */
#casePager {
  border-top: solid #ccc 1px;
  padding-top: 3em;
  text-align: center;
  font-size: 120%;
}
#casePager a {
  margin: 0 10px;
  padding: 5px 15px;
  background: #0e3480;
  color: #fff;
}
#casePager a:hover {
  text-decoration: none;
  opacity: 0.8;
}

@media only screen and (max-width:768px){
  .caseBox .ul_case{
	display:block;
	flex-wrap:wrap;
  }
  .caseBox .ul_case li,
  .caseBox .ul_case li:nth-child(3n+2),
  .caseBox .ul_case li:nth-child(3n){
	width:100%;
  }
  .caseBox .img {
    float: none;
    margin-bottom: 1em;
    margin-right: 0;
    width: 100%;
    line-height: 1;
  }
}




/* 詳細ページ
--------------------------------------------------------------------*/
#detailArea h4 {color: #0e3480;}
#detailArea h4::before {
  content: "▼";
  margin-right: 10px;
}
#detailArea .img {
  float: left;
  margin-bottom: 3em;
  width: 40%;
  line-height: 1;
}
#detailArea .floatRight {
  margin-bottom: 3em;
  width: 57%;
}
#detailArea ul {margin-bottom: 1.2em;}
#detailArea ul li {
  margin: 0 0 0.3em 1em;
  text-indent: -1em;
}
#detailArea ul li::before {
  content: "●";
  color: #3598F0;
}

@media only screen and (max-width:768px){
  #detailArea .img {
    float: none;
    margin-bottom: 1em;
    width: 100%;
  }
  #detailArea .floatRight {
    width: auto;
    float: none;
  }
}