/*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;
  margin-bottom: 20px;
}
.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;
}

.bttl {
  font-weight: bold;
}

.logoBox {
  background-color: #fff;
  text-align: center;
  margin-bottom: 20px;
  width: 100%;
}

/*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-01 .clmBlock {
  margin-bottom: 20px;
}
.section-01 .clmBlock .clm:first-child {
  width: 70%;
  padding-top: 15px;
}
.section-01 .clmBlock .clm:last-child {
  width: 25%;
  text-align: center;
}
@media only screen and (max-width:640px) {
.section-01 .clmBlock .clm:first-child {
  width: 100%;
  padding-top: 0;
}
.section-01 .clmBlock .clm:first-child .mb40 {
  margin-bottom: 0;
}
.section-01 .clmBlock .clm:last-child {
  width: 100%;
  margin-top: 0;
}
}


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

.section-03 .clmBlock{
  -webkit-justify-content: flex-start; /* Safari */
  justify-content: flex-start;
  margin:20px 0 50px;
}
.section-03 .clmBlock .clmBlock-ph{
  width: 22.55813953488372%;
  margin-right: 1.9069767442%;
  text-align: center;
}
.section-03 .clmBlock .clmBlock-text{
  width: 64.53488372093024%;
}
@media only screen and (max-width:640px) {
  .section-03 .clmBlock .clmBlock-ph{
    width: 100%;
    margin-right: 0;
    margin-bottom: 20px;
    text-align: center;
  }
  .section-03 .clmBlock .clmBlock-ph img {
    width: auto!important;
  }
  .section-03 .clmBlock .clmBlock-text{
    width: 100%;
  }
}