@charset "UTF-8";

.contents-plan {
  display: block;
  margin-inline: auto;
  inline-size: fit-content;
}
.contents-plan > .campaign {
  font-weight: bold;
  color: #EA5C70;
  border-width: 2px;
  border-style: solid;
  border-color: #EA5C70;
  padding-block: 20px;
  padding-inline: 6vw;
  font-size: 140%;
}
.contents-plan > .campaign > p {
  inline-size: fit-content;
  margin-inline: auto;
  margin-block: 0;
}
.contents-plan > .caution {
  font-size: 100%;
}
.contents-plan > .lead {
  font-size: 140%;
}
.contents-plan > .point {
  padding-inline-start: 20px;
  font-size: 120%;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
@media (min-width: 1px) and (max-width: 520.99px) {
  .contents-plan {
    margin-inline: 16px;
  }
}
@media (min-width: 521px) and (max-width: 768.99px) {
  .contents-plan {
    margin-inline: 16px;
  }
}
/**/
.contents-proposal {
  display: flow-root;
  background-color: rgba(46,167,224,0.07);
  inline-size: var(--contents-width);
  max-inline-size: 960px;
  margin-inline: auto;
  margin-block: 30px;
}
.contents-proposal > ul {
  display: grid;
  padding: 0;
  list-style: none;
}
.contents-proposal > ul > li {
  flex-grow: 1;
}
.contents-proposal > ul > li > img {
  display: block;
  box-shadow: var(--box-shadow1);
}
@media (max-width: 768.99px) {
  .contents-proposal > ul {
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin: 20px;
  }
}
@media (min-width: 769px) {
  .contents-proposal > ul {
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 16px;
    margin: 32px;
  }
}