@charset "utf-8";

/*========================================================================================================================


  ◇◆◇ お知らせ ◇◆◇
  
  
========================================================================================================================*/

/*----------------------------------------------------------------------------------------------------

  hero
  
----------------------------------------------------------------------------------------------------*/

.hero {
  width:100%;
  background:url(../image/hero_bg.jpg) no-repeat center top;
  position:relative;
}

.hero .l-headline .en { background-image:url(../image/headline.png); }
.hero .l-headline {
  box-sizing:border-box;
  width:100%;
  position:absolute;
  top:50%;
  left:0;
  transform:translateY(-50%);
  margin-top:0.5rem;
}

@media print,screen and (min-width:641px) {
  .hero { height:180px; }
}

@media screen and (max-width:640px) {
  .hero {
    height:0;
    padding-top:25%;
    background-size:cover;
  }
  
  .hero .l-headline {
    padding-left:8%;
    padding-right:8%;
    font-size:96%;
    margin-top:-1.5rem;
  }
}


/*----------------------------------------------------------------------------------------------------

  一覧
  
----------------------------------------------------------------------------------------------------*/

.infoList-warp { text-align:center; }

@media print,screen and (min-width:641px) {
  .infoList-warp {
    padding-top:50px;
    padding-bottom:60px;
  }
}

@media screen and (max-width:640px) {
  .infoList-warp {
    padding-top:1.5rem;
    padding-bottom:2rem;
  }
}

.infoList {
  list-style:none;
  text-align:left;
  margin-top:-1em;
}

@media print,screen and (min-width:641px) {
  .infoList {
    min-width:600px;
    display:inline-block;
    margin-left:auto;
    margin-right:auto;
  }
}

.infoList li {
  border-bottom:1px solid #dde0e3;
  line-height:1.6;
}

.infoList li a,
.infoList li .inner {
  display:block;
  padding:1rem;
}

.infoList li a,
.infoList li a:visited,
.infoList li a:hover { color:inherit; text-decoration:none; }

.infoList li a:after {
  content:"";
  display:block;
  height:0;
  clear:both;
}

.infoList li .date {
  width:6em;
  display:inline-block;
  float:left;
  clear:both;
  margin-right:-6em;
  margin-top:0.15em;
  color:#78848c;
  font-size:87.5%;
}

.infoList li .title {
  display:block;
  padding-left:6.5em;
}


@media screen and (min-width:641px) {
  .infoList li a:hover {
    color:#38a4ce; text-decoration:underline;
  }
}

@media screen and (max-width:640px) {
  .infoList-warp {
    width:100%;
  }
  
  .infoList li a,
  .infoList li .inner {
    padding-left:0.5rem;
    padding-right:0.5rem;
  }
}


/*----------------------------------------------------------------------------------------------------

  詳細
  
----------------------------------------------------------------------------------------------------*/

@media screen and (min-width:641px) {
  .infoDetail {
    padding-top:50px;
    padding-bottom:60px;
  }

  .infoDetail_hd {
    margin-bottom:30px;
  }
}

@media screen and (max-width:640px) {
  .infoDetail {
    padding-top:1.75rem;
    padding-bottom:2rem;
  }

  .infoDetail_hd {
    margin-bottom:1.5rem;
  }
}

.infoDetail_hd {
  line-height:1.3;
}
  
.infoDetail_hd .date {
  display:inline-block;
  margin-bottom:0.35em;
  color:#78848c;
  font-size:87.5%;
}

.infoDetail_hd h3 {
  line-height:1.4;
}