@charset "utf-8";


:root{
}



#azukari{
  > h2{
    font-size: 1.8rem;
    font-family: var(--font-family-marugothic);
    font-weight: 500;
    span{
    font-size: 1.5rem;
    margin:0 .3em 0 0;
    }
  }
  > p{
    margin:2rem auto 0 auto;
    font-size: 1.2rem;
    font-family: var(--font-family-marugothic);
    color:red;
    font-weight: 500;
  }
  > div{
    display:grid;
    grid-template-columns: 670px 1fr;
    gap:2rem;
    margin:3rem auto 0 auto;
    align-items: center;
    ul{
      border-bottom:3px dotted #ff9e1c;
      li{
        display:grid;
        grid-template-columns: 7em 1fr;
        font-size: 1.2rem;
        padding:.7em 0;
        gap:0 1em;
        border-top:3px dotted #ff9e1c;
        div{
          text-align: left;
          aside{
            font-size: 1rem;
          }
        }
      }
    }
    figure{
    }
  }
  @media (max-width: 1200px) {
    > div{
      display:block;
      ul{
        width:670px;
        max-width:100%;
        margin:0 auto;
      }
      figure{
        margin:20px auto 0 auto;
      }
    }
  }
  @include media_query_md{
    > div{
      ul{
        li{
          display:block;
          text-align: left;
          h3{
            font-weight: 600;
          }
          div{
            margin:.3em auto 0 auto;
          }
        }
      }
    }
  }
}

#etc{
  width:min(860px,100%);
  margin:5rem auto 0 auto;
  display:grid;
  grid-template-columns: repeat(auto-fill,minmax(min(300px,100%),1fr));
  gap:2rem;
  h2{
		grid-column: 1 / -1;
    font-size: 1.8rem;
    font-family: var(--font-family-marugothic);
    font-weight: 500;
	}
  section{
    border:2px solid #ff9e1c;
    padding:2em;
    background:white;
    border-radius: .5rem;
    h3{
      font-size: 1.4rem;
      font-family: var(--font-family-marugothic);
      font-weight: 500;
    }
    p{
      margin:.5rem auto 0 auto;
    }
    figure{
      margin:.5rem auto 0 auto;
    }
    &:nth-of-type(1){
      border:2px solid #6dcc20;
    }
    &:nth-of-type(2){
      border:2px solid #ff648e;
    }
  }
}

#kuwasiku{
  margin:5rem auto 0 auto;
  width:min(480px,100%);
  background:white;
  border:3px solid #ffd71a;
  border-radius: .5rem;
  padding:2em;
  h3{
    font-size: 1.3rem;
    font-weight: 500;
  }
  p{
    margin:.5em auto 0 auto;
    svg{
      height:1.3rem;
      fill:red;
    }
    span{
      font-size: 1.7rem;
      font-weight: 600;
      a{
        color:red;
      }
    }
  }
}