@media screen and (max-width: 991px) {
  .p-about h2 {
    margin-bottom: 1rem;
  }
  .p-about h3 {
    font-size: 4.8vw;
    color: #a1a1a1;
    text-align: center;
    margin-bottom: 3rem;
  }
  #about .card {
    position: relative;
    margin: auto;
    background-color: #e8eff5;
    padding: 8vw 6.4vw;
    border-radius: 3.2vw;
  }
  #about .card::before {
    position: absolute;
    content: "";
    width: 48vw;
    height: 48vw;
    background-image: url(/static/images/1.因爱LOGO.png);
    background-size: 100% 100%;
    left: 50%;
    top: -7.2vw;
    transform: translateX(-50%);
    z-index: 0;
    opacity: 0.8;
  }
  #about .card h2 {
    position: relative;
    font-size: 9.6vw;
    text-align: center;
    margin-bottom: 2rem;
    z-index: 2;
  }
  #about .card p {
    position: relative;
    line-height: 2;
    font-size: 4vw;
    z-index: 2;
  }
  #prospect {
    padding-top: 70px;
    box-sizing: border-box;
    background-image: url(/static/images/bg_prospect.webp);
    background-size: cover;
    text-align: center;
  }
  #prospect img {
    max-width: 100%;
  }
  #prospect .prospect-list {
    text-align: left;
  }
  #prospect .prospect-list li {
    margin-bottom: 1.5rem;
  }
  #prospect .prospect-list .title {
    font-size: 5.6vw;
    margin-bottom: 0.8rem;
    font-weight: bold;
  }
  #prospect .prospect-list .title span {
    color: #2db2ea;
    font-size: 7.2vw;
  }
  #prospect .prospect-list .content {
    font-size: 3.7333vw;
    line-height: 1.5;
    text-indent: 2em;
  }
  #honor ul {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(auto-fill, 56vw);
    row-gap: 21.6vw;
    column-gap: 4.8vw;
    justify-content: center;
  }
  #honor li {
    border: 1px solid #dadada;
    height: 56vw;
  }
  #honor li img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    margin-bottom: 5px;
  }
  #honor li p {
    text-align: center;
    line-height: 7.2vw;
  }
  #culture {
    background-image: url(/static/images/bg_culture.webp);
    background-size: cover;
  }
  #culture .content {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
  }
  #culture .content img {
    max-width: 100%;
    margin-bottom: 1rem;
  }
  #culture .content .card {
    background-color: #f6f7fb;
    padding-bottom: 9.6vw;
    box-shadow: 0px 3px 7px 0px rgba(107, 107, 107, 0.35);
  }
  #culture .content .card li {
    border-bottom: 2px solid #2db2ea;
    margin: 0 3.2vw;
    padding: 11.2vw 0 3.2vw;
  }
  #culture .content .card h4 {
    font-size: 5.6vw;
    color: #2db2ea;
    margin-bottom: 6.4vw;
  }
  #culture .content .card p {
    font-size: 3.2vw;
  }
}
@media screen and (min-width: 992px) {
  #about {
    height: 435px;
  }
  #about .card {
    position: relative;
    width: 1000px;
    margin: auto;
    background-color: #e8eff5;
    padding: 142px 20px 102px;
    border-radius: 24px;
    transform: translateY(-167px);
  }
  #about .card::before {
    position: absolute;
    content: "";
    width: 225px;
    height: 225px;
    background-image: url(/static/images/1.因爱LOGO.png);
    background-size: 100% 100%;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
    z-index: -1;
    opacity: 0.8;
  }
  #about .card h2 {
    font-size: 42px;
    text-align: center;
    margin-bottom: 64px;
  }
  #about .card p {
    line-height: 48px;
    font-size: 18px;
  }
  #prospect {
    height: 1000px;
    padding-top: 70px;
    box-sizing: border-box;
    background-image: url(/static/images/bg_prospect.webp);
    background-size: cover;
    text-align: center;
  }
  #prospect h2 {
    font-size: 45px;
    color: #262626;
    text-align: center;
    margin-bottom: 20px;
  }
  #prospect h3 {
    font-size: 24px;
    color: #a1a1a1;
    text-align: center;
    margin-bottom: 142px;
  }
  #honor {
    padding: 152px 0 94px;
  }
  #honor h2 {
    font-size: 45px;
    color: #262626;
    text-align: center;
    margin-bottom: 20px;
  }
  #honor h3 {
    font-size: 24px;
    color: #a1a1a1;
    text-align: center;
    margin-bottom: 97px;
  }
  #honor ul {
    display: grid;
    grid-template-columns: repeat(4, 239px);
    grid-template-rows: repeat(2, 323px);
    row-gap: 102px;
    column-gap: 26px;
    justify-content: center;
  }
  #honor li {
    border: 1px solid #dadada;
  }
  #honor li img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    margin-bottom: 5px;
  }
  #honor li p {
    text-align: center;
    line-height: 26px;
  }
  #culture {
    padding: 88px 0 110px;
    background-image: url(/static/images/bg_culture.webp);
    background-size: cover;
  }
  #culture h2 {
    font-size: 45px;
    color: #262626;
    text-align: center;
    margin-bottom: 20px;
  }
  #culture h3 {
    font-size: 24px;
    color: #a1a1a1;
    text-align: center;
    margin-bottom: 68px;
  }
  #culture .content {
    display: flex;
    justify-content: center;
    align-items: center;
    column-gap: 120px;
  }
  #culture .content .card {
    width: 500px;
    background-color: #f6f7fb;
    padding-bottom: 68px;
    box-shadow: 0px 3px 7px 0px rgba(107, 107, 107, 0.35);
  }
  #culture .content .card li {
    border-bottom: 2px solid #2db2ea;
    margin: 0 25px 0 25px;
    padding: 50px 0 12px;
  }
  #culture .content .card h4 {
    font-size: 22px;
    color: #2db2ea;
    margin-bottom: 28px;
  }
  #culture .content .card p {
    font-size: 18px;
  }
}