@charset "UTF-8";
#contents section > picture {
  margin-bottom: calc(8px * 6); }
@media (max-width: 767px) {
  #contents section ul {
    display: flex;
    flex-wrap: wrap; }
    #contents section ul li {
      min-width: 50%; } }
#contents section dt {
  color: #030755; }
  #contents section dt::before {
    margin-right: 0.5em;
    content: "●";
    color: #030755;
    font-weight: bold; }
#contents section dd {
  margin-bottom: calc(8px * 6); }

#squeeze .-three .ncColumns_panel {
  display: flex;
  flex-direction: column-reverse; }
  #squeeze .-three .ncColumns_panel h4 {
    text-align: center;
    font-weight: normal;
    font-size: inherit; }
  #squeeze .-three .ncColumns_panel picture {
    margin-bottom: calc(8px * 1.5); }

#flow .flow .ncColumns_panel {
  position: relative;
  display: flex;
  align-items: center; }
  @media (max-width: 767px) {
    #flow .flow .ncColumns_panel {
      flex-direction: column; } }
  #flow .flow .ncColumns_panel p {
    width: 100%;
    padding: 1.5em;
    background-color: #DFE4F0;
    color: #030755;
    border-radius: 8px;
    text-align: center; }
    @media (min-width: 768px) {
      #flow .flow .ncColumns_panel p {
        margin-bottom: 0; } }
  #flow .flow .ncColumns_panel::after {
    content: "";
    display: block;
    width: 1em;
    height: 1em;
    background-color: #030755; }
    @media (min-width: 768px) {
      #flow .flow .ncColumns_panel::after {
        position: absolute;
        right: -1.5em;
        top: 50%;
        transform: translateY(-50%);
        mask-image: url("/wp-content/package/module/_parts/icon/caret-right.svg?uh8si9imw");
        mask-repeat: no-repeat;
        mask-position: center;
        mask-size: contain; } }
    @media (max-width: 767px) {
      #flow .flow .ncColumns_panel::after {
        mask-image: url("/wp-content/package/module/_parts/icon/caret-down.svg?uh8si9in2");
        mask-repeat: no-repeat;
        mask-position: center;
        mask-size: contain; } }
  #flow .flow .ncColumns_panel:last-of-type::after {
    content: none; }
#flow ul:last-of-type {
  justify-content: flex-end; }
  @media (max-width: 767px) {
    #flow ul:last-of-type li:last-of-type::after {
      content: none !important; } }
#flow li {
  display: flex;
  align-items: center; }
  @media (max-width: 767px) {
    #flow li {
      min-width: initial !important;
      width: 33%;
      height: 6rem;
      margin-bottom: 1rem; } }
  @media (max-width: 767px) {
    #flow li {
      flex-direction: column; } }
  #flow li span {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    line-height: 1.2; }
    @media (max-width: 767px) {
      #flow li span {
        width: 15rem;
        height: 100%; } }
    @media (max-width: 767px) {
      #flow li span {
        width: 100%;
        height: calc(8px * 10); } }
  #flow li::before {
    content: none; }
  #flow li::after {
    font-family: "Font Awesome 5 free";
    color: #030755;
    font-weight: bold;
    font-size: calc(8px * 3); }
    @media (max-width: 767px) {
      #flow li::after {
        margin: 0 0.5em;
        content: "\f0da"; } }
    @media (max-width: 767px) {
      #flow li::after {
        display: block;
        margin: 0.5em 0;
        content: "\f0d7";
        line-height: 1 !important; } }

#pattern .liberation {
  position: relative;
  margin-bottom: calc(8px * 2);
  border: solid 1px #ddd; }
  #pattern .liberation dt, #pattern .liberation dd {
    margin-bottom: 0;
    padding: 8px;
    border-bottom: solid 1px #ddd; }
    #pattern .liberation dt p, #pattern .liberation dd p {
      margin-bottom: 0; }
  #pattern .liberation dt {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #030755;
    color: #fff; }
    #pattern .liberation dt::before {
      content: none; }
  #pattern .liberation dd {
    color: #030755; }
  #pattern .liberation_priority {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #dfe4f0; }
  @media (min-width: 960px) {
    #pattern .liberation {
      display: flex;
      padding-bottom: 2em; }
      #pattern .liberation dl {
        width: 25%; }
        #pattern .liberation dl:not(:last-of-type) {
          border-right: solid 1px #ddd; }
      #pattern .liberation_method {
        padding: calc(8px * 2);
        height: 8em;
        justify-content: flex-start;
        align-items: flex-start; } }
  @media (max-width: 959px) {
    #pattern .liberation {
      padding-right: 2em; }
      #pattern .liberation dl {
        display: flex;
        flex-wrap: wrap; }
      #pattern .liberation dt {
        width: 100%; }
      #pattern .liberation_method {
        width: calc(100% - 3em); }
      #pattern .liberation_priority {
        width: 3em; } }
  #pattern .liberation::before {
    position: absolute;
    z-index: 1;
    display: flex;
    align-items: center;
    content: "自然な耳抜き方法"; }
  #pattern .liberation::after {
    position: absolute;
    z-index: 10;
    content: "他の力を加えた耳抜き方法";
    line-height: 1; }
  @media (min-width: 960px) {
    #pattern .liberation::before {
      bottom: 0;
      left: 0;
      width: 100%;
      height: 2em;
      padding-left: 0.5em;
      background: linear-gradient(90deg, rgba(145, 240, 150, 0.5), rgba(255, 200, 120, 0.5)); }
    #pattern .liberation::after {
      bottom: 0.5em;
      right: calc(2em / 2 - 0.5em); } }
  @media (max-width: 959px) {
    #pattern .liberation::before, #pattern .liberation::after {
      writing-mode: vertical-rl; }
    #pattern .liberation::before {
      top: 0;
      right: 0;
      width: 2em;
      height: 100%;
      padding-top: 0.5em;
      background: linear-gradient(180deg, rgba(145, 240, 150, 0.5), rgba(255, 200, 120, 0.5)); }
    #pattern .liberation::after {
      bottom: 0.5em;
      right: calc(2em / 2 - 0.5em);
      content: "他の力を加えた耳抜き方法"; } }

#faq dt::before {
  content: "Ｑ." !important; }
#faq dd::before {
  margin-right: 0.5em;
  content: "Ａ.";
  font-weight: bold; }

#check-sheet dt::before {
  content: "□" !important;
  font-weight: normal !important; }

#message h2 {
  padding: calc(8px * 2);
  background-color: #030755;
  border-radius: 8px 8px 0 0;
  margin: 0;
  color: #fff;
  font-size: 100%; }
  #message h2::after {
    content: none; }
#message p {
  padding: calc(8px * 2);
  background-color: #DFE4F0;
  border-radius: 0 0 8px 8px;
  color: #030755; }
