.main_visual {
  background: #e7e7e7;
}

.main_visual .inner {
  padding-top: 40%;
}

video.visual_catch {
  animation: catch 1s ease 1s 1 normal forwards;
  opacity: 0;
  z-index: 3;
  vertical-align: top;
}

video {
  outline: none;
  border: none;
}

video[class *='visual_'], p[class *='visual_'] {
  width: 100%;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, 0);
  z-index: 2;
}

.visual_catch--noanime {
  width: 100%;
  position: absolute;
  top: 0;
  left: 50%;
  z-index: 2;
  transform: translateX(-50%);
  opacity: 1;
}

section.committee .novelist{
  display: flex;
  flex-flow: column;
}

section.committee .masterpiece{
  display: flex;
}

.video_sp {
  display: none;
}

.mainVisualSub_text {
  max-width:890px;
  margin: 0 auto;
  padding: 0 2em;
}

.mainVisualSub_btn {
  width:100%;
  padding: 0 2em;
}

.sns_share_wrapper {
  width: 100%;
  max-width: 1120px;
  margin: 1em auto 0;
}

.sns_share {
  position: relative;
  right: 0px;
  top: 0px;
  margin-right: 1em;
}

section.important_matter_anchor .wrapper {
  width: 100%;
  max-width: 840px;
  margin: 20px auto 150px;
  display: flex;
  justify-content: center;
  gap: 30px;
  height:auto;
  flex-wrap:wrap;
}

section.important_matter_anchor .wrapper a {
  display: inline-block;
  width: calc(100% / 3 - 20px);
}

section.important_matter_detail {
  width: 100%;
  max-width: 840px;
  margin: 120px auto 30px;
  position: relative;
  padding: 3em 2em 2em;
  border: 4px solid #05afc2;
  font-size: 18px;
  text-align: left;
  background-color: #ffffff;
  background-position: right 30px center;
  background-repeat: no-repeat;
}

section.important_matter_detail.blue {
  background-image: url("../img/award/point01_bg_icon.svg");
}

section.important_matter_detail.pink {
  background-image: url("../img/award/point02_bg_icon.svg");
}

section.important_matter_detail.green {
  background-image: url("../img/award/point03_bg_icon.svg");
}

section.important_matter_detail.yellow {
  background-image: url("../img/award/point04_bg_icon.svg");
}

section.important_matter_detail.orange {
  background-image: url("../img/award/point05_bg_icon.svg");
}

section.important_matter_detail.green2 {
  background-image: url("../img/award/point03_bg_icon2.png");
}

section.important_matter_detail.yellow2 {
  background-image: url("../img/award/point04_bg_icon2.png");
}


section.important_matter_detail span {
  font-weight: 700;
}

section.blue {
  border: 4px solid #4963B8;
}

section.blue .textline {
  background-image: linear-gradient(#4963B8, #4963B8);
}

section.pink {
  border: 4px solid #F21967;
}

section.pink .textline {
  background-image: linear-gradient(#F21967, #F21967);
}

section.green {
  border: 4px solid #56B268;
}

section.green .textline {
  background-image: linear-gradient(#56B268, #56B268);
}

section.yellow {
  border: 4px solid #F4CC12;
}

section.yellow .textline {
  background-image: linear-gradient(#F4CC12, #F4CC12);
}

section.orange {
  border: 4px solid #F3883E;
}

section.orange .textline {
  background-image: linear-gradient(#F3883E, #F3883E);
}

section.important_matter_detail .title{
  margin-top: 0;
  position: absolute;
  top: -80px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
  width:100%;
}

section.important_matter_detail .detail{
  line-height:2;
}

#info .inner {
  background: none;
}

.important_matter_wrapper{
  padding: 3em 0 0 0;
}

.important_matter_anchor {
  background: radial-gradient(closest-corner, rgba(255,255,255,1), rgba(255,255,255,0.6) 40%, rgba(255,255,255,0) 60%);
}

.announce {
  margin: 0 0 30px;
  background: radial-gradient(closest-corner, rgba(255,255,255,1), rgba(255,255,255,0.6) 40%, rgba(255,255,255,0) 60%);
}

.important_matter_wrapper img {
  width: 100%;
}

.important_matter_wrapper h3 {
  margin: 2em auto 0;
  max-width: 560px;
}

.col_1 ul li h5 {
  padding-top: 10px;
}

.committee ul li h5.chief_editor {
  width:100%
}

.schedule {
  line-height: 1.7;
}

#info .announce p {
  word-break: break-all;
}

@media screen and (max-width: 768px) {
  .sns_share {
    margin-right: 2em;
  }

  .sns_share::before {
    font-size: 1rem;
    margin-bottom: 0.6em;
  }

  .sns_share li a img {
    width: 20px;
  }

  .main_visual .inner {
    padding-top: 100.8%;
  }

  .committee ul li h5 {
    min-width: 80px;
  }

  section.committee .novelist{
    width: 70%;
  }

  section.committee .masterpiece p:nth-child(1){
    flex-basis: 45px;
  }

  section.committee .masterpiece p:nth-child(2){
    flex-basis: auto;
  }

  section.committee h3 {
    top: -50px;
  }

  .video_sp {
    display: block;
  }

  .video_pc {
    display: none;
  }

  .award {
    padding: 10em 1.5em 5em;
  }

  section.important_matter_detail {
    margin: 150px auto 30px;
  }

  section.important_matter_detail .title{
    max-width:450px;
    top: -120px;
  }

  .important_matter_wrapper h3 {
    width: 90%;
  }

  .important_matter_wrapper img {
    width: 100%;
  }

  .important_matter_wrapper {
    padding: 1em 2em 0;
  }

  section.important_matter_anchor .wrapper {
    gap: 15px;
  }

  section.important_matter_anchor .wrapper a {
    display: inline-block;
    width: calc(100%/2 - 10px);
  }

  .col_1 ul li h5 {
    padding-top: 5px;
  }
}

@media screen and (max-width: 576px) {
  section.important_matter_detail .title {
    max-width: 280px;
  }

  section.committee h3 {
    top: -25px;
}

  .committee h3 {
    top: -25px;
  }

  .award {
    padding: 3em 1.5em 5em;
  }

  section.important_matter_detail .title{
    top: -75px;
  }

  section.important_matter_detail {
    font-size: 1.4rem;
    line-height: 2;
    background-size: 60px;
    background-position: right 20px top 30px;
  }
}

@media only screen and (min-width: 1600px) {
  .main_visual .inner {
      height: 640px;
      padding: 0;
  }
}

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

 　2025.08　　「ここがすごい」　ポイント4つ時のアンカー調整　追加

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

section.important_matter_anchor .wrapper.is-4 {
  display: grid;
  grid-template-columns: repeat(2, 280px);
  justify-content: center;
  gap: 30px;
}

section.important_matter_anchor .wrapper.is-4 a {
  width: 100%;
}


@media (max-width: 769px) {
  section.important_matter_anchor .wrapper.is-4 {
    grid-template-columns: repeat(2, minmax(0, 240px));
    justify-content: center;
  }
}
