@charset "utf-8";

/* topics page
------------------------------------------------ */
.topics_page{
  padding-bottom: 100px;
}
@media all and (max-width: 767px) {
  .topics_page{
    padding-bottom: 50px;
  }
}
.topics_main{
  display: grid;
  text-align: left;
}
.topics_main_img{
  grid-area: 1/1/1/1;
  object-fit: cover;
  width: 100%;
  height: 597px;
}
@media all and (max-width: 1023px) {
  .topics_main_img{
    height: 500px;
  }
}
@media all and (max-width: 767px) {
  .topics_main_img{
    height: 360px;

  }
}
.topics_main_inner{
  z-index: 1;
  grid-area: 1/1/1/1;
  display: grid;
  place-content: center end;
  width:min( 1196px,100%);
  margin-inline: auto;
}
@media all and (max-width: 1023px) {
.topics_main_inner{
  padding-inline: 16px;
  box-sizing: border-box;
}
}
@media all and (max-width: 767px) {
  .topics_main_inner{
    place-content: center;
    grid-template-columns: 1fr;
  }
}
.topics_main_box{
  padding:35px 45px 45px 45px;
  background: rgba(000,000,000,.48);
  color: #fff;
  box-sizing: border-box;
}
@media all and (max-width: 767px) {
  .topics_main_box{
    width: 100%;
    margin-inline: auto;
    padding:20px 25px 25px 25px;
  }
}
.topics_main_ttl{
  margin-bottom: 35px;
  font-size: 36px;
  line-height: 1.4;
  font-weight: 300;
}
@media all and (max-width: 767px) {
  .topics_main_ttl{
    font-size: 32px;
    margin-bottom: 15px;
  }
}
.topics_main_ttl:after{
  content: '';
  display: block;
  width: 50px;
  height: 1px;
  margin-top: 35px;
  background: #fff;
}
@media all and (max-width: 767px) {
  .topics_main_ttl:after{
    margin-top: 15px;
  }
}
.topics_main_txt{
  line-height: 2;
}
@media all and (max-width: 767px) {
.topics_main_txt{
  line-height: 1.6;
}
}
a.topics_main_link{
  display: block;
  width: 220px;
  padding: 10px;
  border-bottom: 1px solid #fff;
  color: #fff;
  text-decoration: none;
  background: url("../img/topics/ukishima/link_arrow.svg") no-repeat 90% center;
}
@media all and (max-width: 767px) {
  a.topics_main_link{
    margin-top: 5px;
    padding: 5px;
  }
}
.topics_contents{
  display: grid;
  grid-template-columns: 56fr 61fr;
  gap: 30px;
  text-align: left;
}
@media all and (max-width: 1023px) {
.topics_contents{
  grid-template-columns: 1fr;
  gap: 20px;
}
}
.topics_map{
  display: block;
  max-width: 100%;
}
@media all and (max-width: 1023px) {
.topics_map{
  margin-inline:auto;
  padding-bottom: 30px;
}
}
.topics_body{
  padding-block: 40px 60px;
}
@media all and (max-width: 1023px) {
.topics_body{
  padding-block: 40px 0;
}
}

.topics_body p:not(:last-child){
  margin-bottom: 1em;
}
.topics_ttl{
  margin-bottom: 25px;
  font-size: 24px;
  font-weight: bold;
}
@media all and (max-width: 767px) {
.topics_ttl{
  line-height: 1.4;
}
}
.topics_img_list{
  display: grid;
  grid-template-columns: repeat(2,1fr);
  gap: 3px;
  margin-bottom: 60px;
}
@media all and (max-width: 767px) {
.topics_img_list{
 grid-template-columns:1fr;
 margin-bottom: 30px;
}
}
.topics_img_list img{
  vertical-align: bottom;
  width: 100%;
}
.topics_download{
  overflow-x: auto;
  padding-bottom: 25px;
}

.topics_download table{
  width: min(990px,100%);
  margin-inline: auto;
  text-align: left;
}
@media all and (max-width: 767px) {
  .topics_download table{
    width: 992px;
  }
}
.topics_download th,td{
    padding:15px 20px;
    border-top: 1px solid #E5E5E5;
    border-bottom: 1px solid #E5E5E5;
    font-weight: normal;
    box-sizing: border-box;
  }
.topics_download th{
    width: 460px;
  }
.topics_download td:last-child{
    width: 90px;
    text-align: center;
  }