@charset "utf-8";
/* ==============================
	 PC/SP
============================== */

/*============== comment.html ==============*/
.localvisual h1{
    background: url(../img/h1_about_horizon.jpg) no-repeat;
    background-size: cover;
}
.comment_area{
  display:flex;
  margin-bottom: 20px;
}
.data_chairman{
  width: 280px;
  margin-right: 25px;
}
.data_chairman .pic{
  margin-bottom: 15px;
}
.data_chairman .pic img{
  max-width: 100%;
  border:1px solid #ccc;
}
.data_chairman .position{
  text-align: center;
  font-size: 16px;
  letter-spacing: 0.2em;
  margin-bottom: 10px;
}
.data_chairman .name{
  text-align: center;  
  font-size: 22px;
  letter-spacing: 0.2em
}
.comment_chairman{
  flex:1;
  margin-top: -6px  
}
.comment_chairman p{
  font-size: 1em;
  line-height: 2;
  margin-bottom: 30px;
  letter-spacing: 0.05em;
}
.material_area{
  background:#dfeaf0;
  padding:40px;
}
.material_area .material_title{
  font-size: 24px;
  color:#0e6fb9;
  letter-spacing: 0.3em;
  text-align:center;
  margin-top: -54px;
  margin-bottom: 28px;
}
.material_area article{
  display: flex;
  margin-bottom:30px;
}
.material_area article:last-child{
  margin-bottom:0; 
}
.material_area .txt{
  flex:1;
}
.material_area .book_title{
  font-weight: bold;
  font-size: 1.125em;
  margin-bottom: 16px;
  line-height: 1.3;
  letter-spacing: 0.07em;
}
.material_area .book_page{
  font-weight: bold;
  color:#717171;
  font-size: 0.875em;
  text-align: right;
  margin-bottom: 8px;
}
.material_area .book_excerpt{
  line-height: 1.8;
  font-size: 1em;
  letter-spacing: 0.05em;
}
.material_area .book{
  width:190px;
  padding: 15px 20px;  
  margin-left: 30px;
  background:#fff;
  border:1px solid #bbb;
}
.material_area .book .pic{
  width:80px;
  margin: 0 auto 15px;
}
.material_area .book .pic img{
  max-width:100%;
  border:1px solid #ccc;
}
.material_area .book_data{
  font-weight: bold;
}
.material_area .book_data dt{
  font-size: 1.125em;
  margin-bottom: 15px;
  text-align: center
}
.material_area .book_data dd{
  font-size: 0.875em;
  color:#717171;
  margin-bottom: 10px;
  font-feature-settings: initial;
}
.material_area .book_data dd:last-child{
  margin-bottom: 0;
}
.english .material_area .txt p.note{
  font-size: 14px;
  line-height: 1.5;
  text-indent: -1em;
  margin-left: 1em;  
}



/* ==============================
   tablet 768px以下
============================== */
@media screen and (max-width: 768px) {
  .material_area{
    padding:20px
  }
  .material_area .book{
    margin-left: 15px;
  }
  .comment_area{
    padding:0 20px
  }
  .material_area article{
    margin-bottom: 20px;
  }
  .material_area .material_title{
    margin-top: -36px;
    margin-bottom: 16px;
  }
}



/* ==============================
   SP 640px以下
============================== */
@media screen and (max-width: 640px) {
  .comment_area,
  .material_area article{
    display:block;
  }
  .comment_area{
    padding:0 10px;
    margin-bottom: 45px
  }
  .data_chairman{
    width:100%;
    margin-bottom: 20px;
  }
  .material_area{
    padding:10px 10px 15px;
  }
  .data_chairman .pic{
    max-width:280px;
    margin:0 auto 12px;
  }
  .material_area .book{
    margin:0 auto;
  }
  .material_area .material_title{
    margin-top: -24px;
    margin-bottom:14px;
  }
  .material_area .book_excerpt{
    margin-bottom:6px;
  }

}



/* ==============================
   SP 480px以下
============================== */
@media screen and (max-width: 480px) {

  .data_chairman .pic{
    max-width:140px;
  }
  .data_chairman .position{
    font-size: 12px
  }  
  .data_chairman .name{
    font-size: 16px
  } 
  .data_chairman .pic{
    margin:0 auto 6px;
  }
  .data_chairman .position{
    margin-bottom:6px;
  }  

}