/* Scss Document */
/*
Home
*/
#top {
  padding-top: 100px; }
  #top h1 {
    color: #6e9bc5;
    font-size: 2rem;
    padding: 0;
    margin-bottom: 5px; }
    #top h1 br {
      display: none; }
      @media (max-width: 768px) {
        #top h1 br {
          display: block; } }
  #top .txt {
    margin-bottom: 0; }
  #top .topImg {
    max-width: 700px;
    padding: 0 20px;
    margin: 0 auto; }
    #top .topImg ul {
      display: flex;
      justify-content: space-between; }
      @media (max-width: 560px) {
        #top .topImg ul {
          display: block;
          margin: 30px auto 0; } }
      #top .topImg ul li {
        width: 49%; }
        @media (max-width: 560px) {
          #top .topImg ul li {
            width: 100%; } }
        #top .topImg ul li span {
          display: block;
          margin-top: 15px;
          font-size: 1.6rem; }
        @media (max-width: 560px) {
          #top .topImg ul li:last-child {
            margin-top: 30px; } }
    #top .topImg p {
      margin-top: 40px;
      font-size: 2rem; }
      @media (max-width: 560px) {
        #top .topImg p {
          text-align: left;
          font-size: 5vw; } }
  #top #campaign {
    margin: 40px auto 0;
    border: #6e9bc5 solid 2px;
    border-radius: 10px;
    padding: 20px; }
    @media (max-width: 560px) {
      #top #campaign {
        padding: 10px 10px 20px 10px;
        border: #6e9bc5 solid 1px; } }
    #top #campaign img {
      display: block;
      max-width: 600px;
      width: 100%;
      margin: 0 auto 20px; }
    #top #campaign h2 {
      font-size: 3rem;
      padding: 10px 0;
      background: #6e9bc5;
      color: #FFF; }
      @media (max-width: 560px) {
        #top #campaign h2 {
          padding: 5px 0;
          font-size: 6.5vw; } }
    #top #campaign p {
      text-align: left;
      font-size: 1.6rem;
      color: #6e9bc5;
      margin-top: 25px; }
      @media (max-width: 560px) {
        #top #campaign p {
          margin-top: 20px; } }
      #top #campaign p span {
        display: block;
        margin-bottom: 5px;
        font-weight: bold;
        color: #34699b; }
        @media (max-width: 560px) {
          #top #campaign p span {
            margin-bottom: 10px; } }
    #top #campaign .brSp {
      display: none; }
      @media (max-width: 560px) {
        #top #campaign .brSp {
          display: block; } }

section, aside {
  text-align: center; }
  section h2 img, aside h2 img {
    max-width: 247px; }
  section .txt, aside .txt {
    margin: 2em auto;
    font-size: 1.6rem; }
  @media (max-width: 480px) {
    section p, aside p {
      text-align: left; } }

#type .mainImg {
  max-width: 502px;
  padding: 0 20px; }
#type ul.item {
  justify-content: space-between; }
  @media (max-width: 480px) {
    #type ul.item {
      padding: 0 20px; } }
  #type ul.item li {
    width: 32%;
    margin: 0 0 20px; }
    #type ul.item li:last-child {
      margin-left: 2%;
      margin-right: auto; }
    @media (max-width: 480px) {
      #type ul.item li {
        width: 80%;
        margin: 0 auto 40px;
        padding: 0; }
        #type ul.item li:last-child {
          margin: 0 auto; } }

section#design h2 {
  margin-top: 0; }

#motif .mainImg {
  max-width: 502px;
  padding: 0 20px; }
#motif .ttl {
  max-width: 239px; }
#motif ul.item {
  justify-content: space-between; }
  @media (max-width: 920px) {
    #motif ul.item {
      padding: 0 20px; } }
  @media (max-width: 480px) {
    #motif ul.item {
      padding: 0 10px; } }
  #motif ul.item li {
    width: 32%;
    margin: 0 0 20px; }
    #motif ul.item li:last-child {
      margin-left: 2%;
      margin-right: auto; }
    @media (max-width: 480px) {
      #motif ul.item li {
        width: 80%;
        margin: 0 auto 40px;
        padding: 0; }
        #motif ul.item li:last-child {
          margin: 0 auto; } }

#stone .mainImg {
  max-width: 502px;
  padding: 0 20px; }
#stone .ttl {
  max-width: 239px; }
#stone .all {
  max-width: 549px;
  margin-top: 40px;
  padding: 0 20px; }