/*main-vis*/
.main-vis{
  height: 577px;
  overflow: hidden;
}
@media only screen and (max-width:640px) {
  .main-vis{
    height: auto;
  }
}

/*sttl*/
.sttl {
	font-size: 14px;
	padding: 8px 8px 6px 12px;
	background-color: #ccc;
	color: #fff;
}
.sttl02{
  font-size: 14px;
  font-weight: bold;
}
.sttl02:before{
  content: '■';
  margin-right: 5px;
}

.ttl-A {
  margin-bottom: 20px;
  font-size: 20px;
  font-weight: bold;
}
.ttl-A span{
  font-size: 16px;
}
.ttl-B {
  display: inline-block;
  margin-bottom: 20px;
  padding: 5px 20px;
  background-color: #92a3ab;
  font-size: 12px;
  text-align: center;
  color: #fff;
}

.logoBox {
  background-color: #fff;
  text-align: center;
  margin-bottom: 20px;
  width: 100%;
}
.lead {
    padding: 10px;
    background-color: #ccc;
    color: #fff;
    margin-bottom: 20px;
    font-size: 20px;
}
@media only screen and (max-width:640px) {
  .lead  {
    font-size: 15px;
  }
}
/*clmBlock*/
.clmBlock{
	display: flex;
	flex-wrap: wrap;
}
/*clm2*/
.clmBlock.clm2 .ph{
  width: 47.674418604651166%;  
  margin-right: 4.651162790697675%;
}
.clmBlock.clm2 .ph:nth-child(even){
  margin-right: 0;
}
.clmBlock.clm2 .clmBlock-ph{
  width: 47.674418604651166%;
  margin-right: 4.651162790697675%;
  display: flex;
  flex-wrap: wrap;  
}
.clmBlock.clm2 .clmBlock-ph .ph{
  width: 48.76543209876543%;
  margin-right: 2.4691358025%;
}
.clmBlock.clm2 .clmBlock-ph .ph:nth-child(even){
  margin-right: 0;
}
.clmBlock.clm2 .clmBlock-ph .ph:nth-child(n+3){
  margin-top: 10px;
}
.clmBlock.clm2 .clmBlock-text{
  width: 47.674418604651166%;  
}
.clmBlock.clm2 .clm{
  width: 48.837209302325576%;
}
.clmBlock.clm2 .clm:nth-child(n+2){
  margin-left: 2.3255813953%;
}
/*clm3*/
.clmBlock.clm3 .ph{
  width: 32.55813953488372%;
  margin-right: 1.164000%;
}
.clmBlock.clm3 .ph:nth-child(3n){
  margin-right: 0;
}
/*diff*/
.clmBlock.diff .ph{
  margin-right: 2.3255813953488373%;
}
.clmBlock.diff .clmBlock-text{
  width: 63.95348837209303%;
  margin-right: 5.8139534884%;
}
.clmBlock.diff .clmBlock-ph{
  width: 30.23255813953488%;
}
@media only screen and (max-width:640px) {
  /*clm2*/
  .clmBlock.clm2 .ph{
    width: 100%; 
    margin-right: 0; 
    margin-bottom: 30px;
  }
  .clmBlock.clm2 .ph:nth-child(even){
     margin-bottom: 0;
  }
  .clmBlock.clm2 .clmBlock-ph{
    width: 100%;
    margin-right: 0;
    margin-bottom: 30px; 
  }
  .clmBlock.clm2 .clmBlock-ph .ph{
    margin-bottom: 0;
  }
  .clmBlock.clm2 .clmBlock-ph .ph:nth-child(n+3){
    margin-top: 10px;
  }
  .clmBlock.clm2 .clmBlock-text{
    width: 100%;
  }
  .clmBlock.clm2 .clm{
    width: 100%;
  }
  .clmBlock.clm2 .clm:nth-child(n+2){
    margin-left: 0;
    margin-top: 20px;
  }
  /*clm3*/
  .clmBlock.clm3 .ph{
    width: 32.55813953488372%;
    margin-right: 1.164000%;
  }
  .clmBlock.clm3 .ph:nth-child(3n){
    margin-right: 0;
  }
  /*diff*/
  .clmBlock.diff .ph{
    width: 100%;
    margin-right: 0;
    margin-bottom: 10px;
  }
  .clmBlock.diff .ph:last-child{
    margin-bottom: 0;
  }
  .clmBlock.diff .ph img{
    width: 100%;
  }
  .clmBlock.diff .clmBlock-text{
    width: 100%;
    margin-right: 0;
    margin-bottom: 30px;
  }
  .clmBlock.diff .clmBlock-ph{
    width: 100%;
  }

}

/*bgBox*/
.bgBox{
	padding:25px;
}
.bgBox.bg-gray{
	background: #f2f2f2;
}
@media only screen and (max-width:640px) {
	.bgBox{
		padding:15px;
	}
}

/*----------------
section-01
----------------*/


/*----------------
section-02
----------------*/


/*----------------
section-03
----------------*/

.outlineList table {
  width: 600px;
  background: #f0f2f3;
}
.outlineList table th,
.outlineList table td{
  background: #fff;
  padding:5px 10px;
  box-sizing: border-box;
}
.outlineList table th{
  width:25%;
}
.outlineList table td{
  width:75%;
}
@media only screen and (max-width:640px) {
  .outlineList table{
    width:100%;
  }
}