* {
  font-family: Roboto, "Noto Sans TC", sans-serif; }

section#main .subject {
  background-color: rgba(252, 160, 51, 0.2);
  margin-left: 4rem;
  margin-right: 4rem;
  margin-top: 2rem; }
  section#main .subject .pic {
    display: inline-block;
    vertical-align: top; }
  section#main .subject .text {
    display: inline-block;
    max-width: 518px;
    margin-top: 4rem;
    margin-left: 4rem; }
    section#main .subject .text p {
      text-align: justify;
      text-indent: 2em;
      font-size: 1em;
      line-height: 2em;
      letter-spacing: 0.12em; }

section#main .house {
  margin-top: -10rem; }
  section#main .house .frame {
    background-image: url("../../images/public/Photo frame.png");
    background-repeat: no-repeat;
    padding: 10px 0 18px 20px;
    background-size: 92% 100%; }
  section#main .house .item {
    max-width: 336px;
    border-bottom: solid 26px #f2317c; }
  section#main .house .pic img {
    display: block;
    margin-left: auto;
    margin-right: auto;
    margin-top: 1rem;
    width: 100%; }
  section#main .house .content {
    background-color: #fff; }
    section#main .house .content h3 {
      font-weight: 700;
      text-align: center;
      padding: 4rem 0.5rem 2rem 0.5rem; }
    section#main .house .content p {
      padding-left: 2rem;
      padding-right: 2rem;
      padding-bottom: 4rem;
      margin-bottom: 0;
      text-align: justify;
      line-height: 2em;
      letter-spacing: 0.12em; }

section#main #item2 {
  margin-top: 4rem; }
  section#main #item2 .item {
    border-bottom: solid 26px #fca033; }
  section#main #item2 h3 {
    padding: 3rem 0.5rem 2rem 0.5rem; }
  section#main #item2 p {
    padding-bottom: 1rem; }

section#main #item3 .item {
  border-bottom: solid 26px #11b6d9; }

section#main #item3 h3 {
  padding: 3rem 0.5rem 3rem 0.5rem; }

section#main .show_all {
  margin-top: 6rem;
  margin-bottom: 2rem; }

section#main .house.hbox2 {
    padding-top: 17rem;
}

@media screen and (max-width: 1400px) {
  section#main .subject {
    margin-left: 0;
    margin-right: 0; }
  section#main .house .row > div {
    padding-right: 15px; }
  section#main .house .frame {
    background-size: 100% 100%;
    padding-right: 15px; } }

@media screen and (max-width: 1199px) {
  section#main .subject .text {
    width: 465px;
    margin-left: 2vw;
    margin-top: 25px; }
  section#main .house > .container {
    padding-left: 15px; } }

@media screen and (max-width: 991px) {
  section#main #section2 {
    background-color: rgba(252, 160, 51, 0.2); }
  section#main .subject .text, section#main .subject .pic {
    width: 100%;
    max-width: 575px;
    margin: 0 auto;
    display: block; }
  section#main .subject .pic img {
    width: 100%; }
  section#main .subject .text {
    padding: 1rem 1rem 2rem; }
  section#main .house {
    margin-top: 0; }
    section#main .house .content h3 {
      font-size: 1.25rem;
      padding: 2rem 1.5rem 1rem 1.5rem !important;
      text-align: left; }
    section#main .house .content p {
      padding-left: 1.5rem;
      padding-right: 1.5rem; }
    section#main .house .row > div {
      padding-top: 25px; }
    section#main .house .frame {
      background-size: 100% 100%; }
    section#main .house .item {
      max-width: 100%; }
    section#main #item2 {
      margin-top: 0; }
      section#main .house.hbox2 {
      padding-top: 1rem;
      }
}