#media {
  display: flex;
  flex-direction: column;
}

#media .heading-contents {
  margin-bottom: 50px;
}

#media h2 {
  font-size: 22px;
}

#media .title .secondary {
  color: var(--color-pale-green);
  text-align: left;
  margin-top: 0;
  padding-bottom: 10px;
  width: 420px;
}

#media .main-message {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 70%;
  margin: 0 auto;
  margin-bottom: 50px;
}
#media .contents-container {
  margin-bottom: 100px;
}

#media #container {
  display: flex;
  flex-direction: row;
  justify-content: center;
  margin-right: 50px;
  margin-left: 50px;
}

.left-contents-container {
  display: none;
}

#container .contents {
  margin-top: 0px;
  margin-bottom: 100px;
}
#main-contents {
  width: 60%;
}

#main-contents .contents {
  width: 90%;
}

#left-bar {
  width: 30%;
}
#right-bar {
  width: 30%;
}

.archives-container p {
  margin-left: 10px;
}

#media li.pr-li:nth-child(3) {
  border-bottom: 1px solid rgb(216, 216, 216);
}

#media .pr-li p {
  font-size: 13px;
  font-weight: 400;
}

.pr-li p a {
  color: var(--color-deep-green);
}

.pr-li > .pr-meta > .pr-category a.pr-category {
  color: rgb(145, 145, 145);
}
.pr-li > .pr-meta > .pr-category a.pr-category:hover {
  text-decoration: underline;
}

.pr-title-container {
  font-size: 22px;
  line-height: 1.2em;
  margin-bottom: 30px;
  border-left: solid 2px rgba(206, 38, 46, 1);
  padding-left: 10px;
}

.category {
  margin-top: 30px;
}

#left-bar a,
#right-bar a {
  color: #333;
  font-size: 13px;
}

#left-bar a:hover,
#right-bar a:hover,
.pnavi a:hover,
.pr-li a:hover,
.article-nav-prev a:hover {
  text-decoration: underline;
}

.recently p,
.category p {
  margin-right: 10px;
  text-align: center;
}

.recently li,
.category li {
  line-height: 145%;
  margin-bottom: 20px;
}

.pnavi {
  text-align: center;
}

.pnavi a {
  color: #333;
}

/* カレンダー */
#wp-calendar {
  margin: 30px 0;
}

#wp-calendar a {
  font-size: 15px;
  text-decoration: underline;
}

#wp-calendar td {
  text-align: center;
}

.article-nav-prev a {
  color: #333;
  -ms-word-wrap: break-word;
  word-wrap: break-word;
  word-break: break-all;
}

.wp-block-image img {
  height: auto;
}

@media (max-width: 1200px) {
  .left-contents-container {
    display: block;
  }
  #left-bar {
    display: none;
  }
}

@media (max-width: 870px) {
  #media #container {
    margin-right: 0px;
    margin-left: 0px;
  }
}

@media (max-width: 750px) {
  #right-bar {
    display: none;
  }
  #main-contents {
    width: 90%;
  }
  #media .heading-contents {
    margin-top: 50px;
    margin-bottom: 0px;
  }
}
@media (max-width: 500px) {
  #media .title .secondary {
    width: 250px;
  }
}

@media (max-width: 402px) {
  h1 {
    font-size: 35px;
  }
}
