/* ------------------------------------------------------------
main img - slide
------------------------------------------------------------ */
.main-img {
  width: 100%;
  margin-bottom: 60px; }

.main-img-txt {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 80vw;
  background: url(../images/index/main-img.jpg) no-repeat center center/cover; }

@media only screen and (min-width: 590px) {
  .main-img-txt {
    height: 760px; } }
@media only screen and (min-width: 992px), print {
  .main-img {
    margin-bottom: 90px; } }
/* ------------------------------------------------------------
contents
------------------------------------------------------------ */
h2 {
  overflow: hidden;
  text-align: center; }
  h2 span {
    position: relative;
    font-size: 62px;
    font-weight: 700;
    color: #3f1500;
    padding: 0 .5em; }
    h2 span::before, h2 span::after {
      position: absolute;
      top: 50%;
      content: '';
      width: 1000%;
      height: 2px;
      background: #3f1500; }
    h2 span::before {
      right: 100%; }
    h2 span::after {
      left: 100%; }

@media only screen and (max-width: 590px) {
  h2 span {
    font-size: 36px; } }
.title-btm-txt {
  font-size: 16px;
  color: #999999;
  text-align: center; }

.about-box {
  text-align: center;
  margin: 60px auto 0; }
  .about-box p {
    font-size: 21px; }
    .about-box p span {
      font-size: 30px;
      font-weight: 700;
      color: #a41616; }

@media only screen and (max-width: 992px) {
  .title-btm-txt {
    font-size: 14px; }

  .about-box {
    text-align: left;
    margin: 30px auto 0; }
    .about-box p {
      font-size: 18px; }
      .about-box p span {
        font-size: 24px; } }
@media only screen and (max-width: 590px) {
  .about-box p {
    font-size: 14px; }
    .about-box p span {
      font-size: 18px; } }
.in-contents-wrap {
  margin: 90px 0;
  padding: 60px 0;
  background: #f8f3ed; }
  .in-contents-wrap ul {
    display: flex;
    justify-content: center;
    margin: 0 -15px; }
    .in-contents-wrap ul li {
      width: calc(33.33% - 30px);
      margin: 0 15px; }
      .in-contents-wrap ul li .box {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center; }
        .in-contents-wrap ul li .box a {
          position: relative;
          display: block;
          width: 100%;
          padding: 75px 10px;
          background: rgba(63, 21, 0, 0.2);
          border: 1px solid #3f1500; }
          .in-contents-wrap ul li .box a .title {
            font-size: 42px;
            color: #ffffff;
            text-align: center;
            padding-bottom: 30px; }
            .in-contents-wrap ul li .box a .title span {
              display: block;
              font-size: 16px;
              color: #eeeeee;
              text-align: center;
              line-height: 1; }
          .in-contents-wrap ul li .box a .more {
            position: absolute;
            bottom: 0;
            left: 0;
            color: #ffffff;
            text-align: center;
            width: 100%;
            padding: 15px 15px;
            background: rgba(63, 21, 0, 0.7);
            border-top: 1px dashed #cccccc; }
          .in-contents-wrap ul li .box a:hover {
            background: rgba(63, 21, 0, 0.6); }
            .in-contents-wrap ul li .box a:hover .more {
              color: #ffffff;
              background: rgba(63, 21, 0, 0.9);
              opacity: .9; }
      .in-contents-wrap ul li .service-area {
        background: url(../images/index/img1.jpg) no-repeat center center/cover; }
      .in-contents-wrap ul li .flow-area {
        background: url(../images/index/img2.jpg) no-repeat center center/cover; }
      .in-contents-wrap ul li .lumber-area {
        background: url(../images/index/img3.jpg) no-repeat center center/cover; }

@media only screen and (max-width: 992px) {
  .in-contents-wrap ul {
    flex-wrap: wrap;
    margin: 0 -15px -30px; }
    .in-contents-wrap ul li {
      width: calc(50% - 30px);
      margin: 0 15px 30px; } }
@media only screen and (max-width: 768px) {
  .in-contents-wrap ul li .box a .title {
    font-size: 32px;
    padding-bottom: 20px; }
    .in-contents-wrap ul li .box a .title span {
      font-size: 15px; }
  .in-contents-wrap ul li .box a .more {
    padding: 5px 15px; } }
@media only screen and (max-width: 590px) {
  .in-contents-wrap {
    margin: 60px 0;
    padding: 30px 0; }
    .in-contents-wrap ul {
      margin: 0 -5px -10px; }
      .in-contents-wrap ul li {
        width: calc(50% - 10px);
        margin: 0 5px 10px; }
        .in-contents-wrap ul li .box a {
          padding: 45px 10px; }
          .in-contents-wrap ul li .box a .title {
            font-size: 21px;
            letter-spacing: .1em; }
            .in-contents-wrap ul li .box a .title span {
              font-size: 13px; } }
.in-contact-box {
  text-align: center; }
  .in-contact-box .img-txt {
    margin: 60px 0; }
    .in-contact-box .img-txt .txt {
      display: none; }
  .in-contact-box ul {
    display: flex; }
    .in-contact-box ul li {
      width: 50%; }
      .in-contact-box ul li .txt {
        font-size: 18px;
        margin-bottom: 10px; }
      .in-contact-box ul li:first-child {
        padding: 60px 15px;
        background: #ffffff; }
        .in-contact-box ul li:first-child .txt {
          color: #999999; }
      .in-contact-box ul li:last-child a {
        display: block;
        height: 100%;
        padding: 60px 15px;
        background: #3f1500; }
        .in-contact-box ul li:last-child a .box .txt {
          color: #ffffff; }
        .in-contact-box ul li:last-child a:hover {
          background: #000000; }
      .in-contact-box ul li .box .tel i,
      .in-contact-box ul li .box .mail i {
        margin-right: 4px; }
      .in-contact-box ul li .box .tel {
        display: flex;
        align-items: center;
        justify-content: center;
        line-height: 1;
        font-size: 42px;
        font-weight: 700;
        color: #a41616; }
        .in-contact-box ul li .box .tel i {
          font-size: 32px;
          transform: scale(-1, 1); }
      .in-contact-box ul li .box .mail {
        font-size: 34px;
        display: flex;
        align-items: center;
        justify-content: center;
        line-height: 1;
        color: #ffffff; }
        .in-contact-box ul li .box .mail:hover {
          color: #ffffff; }
        .in-contact-box ul li .box .mail i {
          font-size: 34px; }

@media only screen and (max-width: 992px) {
  .in-contact-box .img-txt {
    margin: 30px 0; }
  .in-contact-box ul li .txt {
    font-size: 16px; }
  .in-contact-box ul li:first-child {
    padding: 30px 15px; }
  .in-contact-box ul li:last-child a {
    padding: 30px 15px; }
  .in-contact-box ul li .box .tel {
    font-size: 32px; }
    .in-contact-box ul li .box .tel i {
      font-size: 26px; }
  .in-contact-box ul li .box .mail {
    font-size: 24px; }
    .in-contact-box ul li .box .mail i {
      font-size: 30px; } }
@media only screen and (max-width: 768px) {
  .in-contact-box .img-txt {
    margin: 30px 0; }
    .in-contact-box .img-txt img {
      display: none; }
    .in-contact-box .img-txt .txt {
      display: block;
      font-size: 16px;
      font-weight: 700; }
  .in-contact-box ul {
    display: block; }
    .in-contact-box ul li {
      width: 100%; }
      .in-contact-box ul li .txt {
        font-size: 15px; }
      .in-contact-box ul li:first-child {
        padding: 30px 15px; }
      .in-contact-box ul li:last-child a {
        padding: 30px 15px; }
      .in-contact-box ul li .box .tel {
        font-size: 32px; }
        .in-contact-box ul li .box .tel i {
          font-size: 24px; }
      .in-contact-box ul li .box .mail {
        font-size: 21px; }
        .in-contact-box ul li .box .mail i {
          font-size: 28px; } }
.info-box {
  margin-bottom: 90px; }
  .info-box .title {
    font-size: 16px;
    color: #ffffff;
    margin-bottom: 15px;
    padding: 4px 15px;
    background: rgba(63, 21, 0, 0.7); }
  .info-box p {
    padding: 0 15px; }
  .info-box .fc-red {
    font-size: 18px; }

@media only screen and (max-width: 768px) {
  .info-box {
    margin-bottom: 60px; }
    .info-box .title {
      font-size: 15px;
      color: #ffffff;
      margin-bottom: 15px;
      padding: 4px 10px;
      background: rgba(63, 21, 0, 0.7); } }