.flex-media{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
}
.flex-media img{
  margin:1em;
}









/*=======================================================
==========================================================
　　　　　　　　　　　　　PC start
==========================================================
========================================================*/
@media screen and (min-width:768px) {
.h1-box{
  background-color: #e8e6e7;
  padding:2em 0;
  width:100%;
}
h1{
  font-family: "myriad-pro", sans-serif;
  font-size:5rem;
  letter-spacing: .1em;
}
h1 span{
font-family: 'Yu Mincho Light','YuMincho','Yu Mincho','游明朝体','ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
  margin-left: 1.5em;
  font-size:1.5rem;
  letter-spacing: .2em;
}

.media-box{
padding:90px 0;
}
.media-box-s{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
}
.media-imgbox{
  display:flex;
  align-items: center;
  width:100%;
  height:250px;
  object-fit: cover;
  background-color: #fff;
  border:1px solid #9e9e9e;
}
.media-imgbox img{
  width:85%;
  margin:0 auto;
    max-height: 90%;
  object-fit: contain;
}
.media-box ul{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  width:100%;
}
.media-box ul li{
  width:31%;
  margin-right:calc(7% / 2);
}
.media-box ul li:nth-child(3n) {
  margin-right: auto;
  margin-right:0;
}

.media-date{
  font-family: "myriad-pro",'Yu Mincho Light','YuMincho','Yu Mincho','游明朝体','ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
  font-size: 1.7rem;
  font-weight:bold;
  margin:.5em 0 0;
  line-height:1.7em;
}
.mecia-p{
  margin: 0.4em 0 3em;
  line-height: 1.7em;
}
.media-allview{
  width:fit-content;
  margin:20px 0 0 auto;
}


.p-a{
  color:#7db4e6;
  text-decoration: underline;
}

.mediaimg-flex{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  max-width: 600px;
}
.mediaimg-flex li{
  width:48%;
  max-width: 600px;
}
.mediaimg-left{
  width: 70%;
  margin: 30px 0 30px;
}
.mediaimg-left30{
  width: 50%;
  margin: 30px 0 30px;
}
.youtube{
  margin:50px 0;
}

.page-next ul{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
}
.page-next ul li{
  width:30%;
  font-size:1.5rem;
  font-weight:bold;
}
.page-next ul li:nth-child(1){
  text-align: left;
}
.page-next ul li:nth-child(2){
  text-align: right;
}









}/*=======================================================
==========================================================
　　　　　　　　　　　　　PC end
==========================================================
==========================================================
==========================================================
==========================================================
==========================================================
==========================================================
==========================================================
==========================================================
　　　　　　　　　　　　　SPstart
==========================================================
========================================================*/
@media screen and (max-width:768px) {
.h1-box{
  background-color: #e8e6e7;
  padding:2em 0;
  width:100%;
}
h1{
  font-family: "myriad-pro", sans-serif;
  font-size:4rem;
  letter-spacing: .1em;
}
h1 span{
  font-family:'Yu Mincho Light','YuMincho','Yu Mincho','游明朝体','ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
  margin-left: 1.5em;
  font-size:1.5rem;
  letter-spacing: .2em;
}

.media-box{
padding:50px 0;
}
.media-box-s{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
}
.media-imgbox{
  display:flex;
  align-items: center;
  width:100%;
  height:220px;
  object-fit: cover;
  background-color: #fff;
  border:1px solid #9e9e9e;
}
.media-imgbox img{
  width:85%;
  margin:0 auto;
    max-height: 90%;
  object-fit: contain;
}
.media-box ul{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  width:100%;
}
.media-box ul li{
  width:100%;
  margin-bottom: 2em;
}
.media-date{
  font-weight: bold;
  font-size: 2rem;
  margin:.7em 0 0;
  line-height: 1.4em;
}
.mecia-p{
  margin:.4em 0 2em;
  line-height: 1.7em;
}
.media-allview{
  width:fit-content;
  margin:20px 0 0 auto;
}
.media-allview{
  width:fit-content;
  margin:20px 0 0 auto;
}
.media-allview{
  width:fit-content;
  margin:20px 0 0 auto;
}


.topics img{
  margin: 20px 0;
}

.p-a{
  color:#7db4e6;
  text-decoration: underline;
}


.page-next ul{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
}
.page-next ul li{
  width:30%;
  font-size:1.5rem;
  font-weight:bold;
}
.page-next ul li:nth-child(1){
  text-align: left;
}
.page-next ul li:nth-child(2){
  text-align: right;
}



}/*=======================================================
==========================================================
　　　　　　　　　　　　　SP end
==========================================================
==========================================================
==========================================================
==========================================================
==========================================================
==========================================================
==========================================================
==========================================================
  　　　　　　　　　　　　IPAD start
========================================================
========================================================*/
@media screen and (min-width:768px) and ( max-width:1190px) {

.media-imgbox {
    height: 170px;
}
.media-imgbox img{
    max-height: 90%;
  object-fit: contain;
}
#message .mu img {
  max-height: 170px;
}










}/*=======================================================
==========================================================
　　　　　　　　　　　　　IPAD SPend
==========================================================
==========================================================
==========================================================
==========================================================
==========================================================
==========================================================
==========================================================
==========================================================
　　　　　　　　　　　　　共通コード
==========================================================
========================================================*/



/*=======================================================
==========================================================
　　　　　　　　　　　　　共通end
==========================================================
========================================================*/