@charset "UTF-8";
/*! Writen  by SCSS */
/* common */
.contents_wrap {
  color: #382e2b;
  margin-top: 100px; }
  @media screen and (max-width: 768px) {
    .contents_wrap {
      margin-top: 60px; } }

.main {
  padding: 70px 0; }
  @media screen and (max-width: 980px) {
    .main {
      padding: 40px 0; } }
  .main .inner {
    box-sizing: content-box;
    margin: 0 auto;
    padding: 0 50px;
    max-width: 1600px; }
    @media screen and (max-width: 980px) {
      .main .inner {
        padding: 0 15px; } }
    .main .inner .text_wrap {
      padding-left: 140px; }
      @media screen and (max-width: 980px) {
        .main .inner .text_wrap {
          padding-left: 100px; } }
      @media screen and (max-width: 768px) {
        .main .inner .text_wrap {
          padding-left: 10%; } }
      @media screen and (max-width: 767px) {
        .main .inner .text_wrap {
          margin-bottom: 30px; } }
      .main .inner .text_wrap h2 {
        align-items: center;
        display: flex;
        font-size: 36px;
        position: relative; }
        @media screen and (max-width: 1280px) {
          .main .inner .text_wrap h2 {
            font-size: 26px; } }
        @media screen and (max-width: 768px) {
          .main .inner .text_wrap h2 {
            display: block;
            font-size: 22px; } }
        @media screen and (max-width: 480px) {
          .main .inner .text_wrap h2 {
            padding-left: 10%; } }
        @media screen and (max-width: 375px) {
          .main .inner .text_wrap h2 {
            font-size: 20px; } }
        .main .inner .text_wrap h2 span {
          position: relative;
          z-index: 1; }
          @media screen and (max-width: 768px) {
            .main .inner .text_wrap h2 span {
              display: block; } }
        .main .inner .text_wrap h2 .num {
          font-size: 200%;
          margin-right: 20px; }
          @media screen and (max-width: 768px) {
            .main .inner .text_wrap h2 .num {
              line-height: 1;
              margin-right: 0; } }
        .main .inner .text_wrap h2 .name {
          letter-spacing: -0.1em; }
        .main .inner .text_wrap h2::after {
          bottom: 0;
          content: "";
          left: -140px;
          position: absolute;
          top: 0;
          width: 162px; }
          @media screen and (max-width: 980px) {
            .main .inner .text_wrap h2::after {
              left: -100px; } }
          @media screen and (max-width: 768px) {
            .main .inner .text_wrap h2::after {
              left: -10%;
              width: 81px; } }

h3 {
  font-size: 27px; }
  @media screen and (max-width: 768px) {
    h3 {
      font-size: 22px; } }
  @media screen and (max-width: 375px) {
    h3 {
      font-size: 20px; } }

.read {
  font-size: 18px; }
  @media screen and (max-width: 480px) {
    .read {
      font-size: 13px; } }

.lead {
  padding: 200px 30px 70px; }
  @media screen and (max-width: 768px) {
    .lead {
      padding: 100px 15px 40px; } }

.bg {
  background: url("../images/concept/bg.jpg") no-repeat center;
  background-size: cover;
  margin-bottom: 120px;
  position: relative; }
  @media screen and (max-width: 768px) {
    .bg {
      margin-bottom: 60px; } }
  .bg.arrow::after {
    border: 80px solid transparent;
    border-top: 80px solid #e8e8e8;
    content: "";
    left: 50%;
    margin-left: -80px;
    position: absolute;
    top: 100%; }
    @media screen and (max-width: 768px) {
      .bg.arrow::after {
        border: 40px solid transparent;
        border-top: 40px solid #e8e8e8;
        margin-left: -40px; } }

.cols {
  box-sizing: content-box;
  margin: 0 auto 50px;
  padding: 0 30px;
  max-width: 1280px; }
  @media screen and (max-width: 768px) {
    .cols {
      margin: 0 auto 30px;
      padding: 0 15px; } }
  .cols ul {
    display: flex;
    justify-content: space-between; }
    @media screen and (max-width: 767px) {
      .cols ul {
        display: block; } }
    .cols ul.ttl2 li {
      padding: 20px 20px 30px; }
    .cols ul li {
      background: #5e5050;
      border: 5px solid #847473;
      border-radius: 5px;
      color: #fff;
      padding: 25px 20px 30px;
      position: relative;
      width: calc(400% / 12.8);
      transition: 0.8s all ease-in-out 0s; }
      @media screen and (max-width: 767px) {
        .cols ul li {
          margin: 0 auto 20px;
          width: 100%;
          max-width: 400px; } }
      .cols ul li:nth-child(2) {
        transition: 0.8s all ease-in-out 0.3s; }
        @media screen and (max-width: 480px) {
          .cols ul li:nth-child(2) {
            transition: 0.8s all ease-in-out 0.15s; } }
      .cols ul li:nth-child(3) {
        transition: 0.8s all ease-in-out 0.6s; }
        @media screen and (max-width: 480px) {
          .cols ul li:nth-child(3) {
            transition: 0.8s all ease-in-out 0.3s; } }
      .cols ul li.option::after {
        color: #382e2b;
        content: "※オプションサービスになります。";
        font-size: 18px;
        left: 0;
        position: absolute;
        right: 0;
        text-align: center;
        top: 105%; }
        @media screen and (max-width: 1280px) {
          .cols ul li.option::after {
            font-size: 14px; } }
      .cols ul li dl {
        margin: 0 auto;
        max-width: 320px; }
        .cols ul li dl dt {
          align-items: center;
          border-bottom: 1px solid;
          display: flex;
          justify-content: center;
          margin-bottom: 20px;
          padding-bottom: 20px;
          text-align: center; }
          .cols ul li dl dt p {
            font-size: 26px;
            line-height: 1.2; }
            @media screen and (max-width: 768px) {
              .cols ul li dl dt p {
                font-size: 18px; } }
        .cols ul li dl dd {
          text-align: center;
          display: flex;
          justify-content: center;
          align-items: center; }
          .cols ul li dl dd p {
            font-size: 19px;
            letter-spacing: -0.01em; }
            @media screen and (max-width: 1280px) {
              .cols ul li dl dd p {
                font-size: 14px; } }
            @media screen and (max-width: 900px) {
              .cols ul li dl dd p {
                text-align: left; }
                .cols ul li dl dd p br {
                  display: none; } }
          .cols ul li dl dd .fz_s {
            display: block;
            font-size: 60%; }
  .cols.double {
    max-width: 840px; }
    .cols.double ul li {
      width: calc(400% / 8.4); }
      @media screen and (max-width: 767px) {
        .cols.double ul li {
          width: 100%; } }
  .cols .cap_r {
    margin-top: 10px;
    color: #555; }
    @media screen and (max-width: 768px) {
      .cols .cap_r {
        text-align: left; } }

/* common */
/* sec01 */
.sec01 .main {
  background: #d3c9b3; }
  .sec01 .main .inner {
    background: url("../images/concept/main01.png") no-repeat center right 50px;
    background-size: contain; }
    @media screen and (max-width: 1200px) {
      .sec01 .main .inner {
        background-size: 50% auto; } }
    @media screen and (max-width: 768px) {
      .sec01 .main .inner {
        background-size: 45% auto; } }
    @media screen and (max-width: 767px) {
      .sec01 .main .inner {
        background: none; } }
    .sec01 .main .inner .text_wrap h2::after {
      background: url("../images/concept/index01.png") no-repeat center;
      background-size: contain; }
.sec01 .sec01_01 {
  padding: 45px 30px 75px; }
  @media screen and (max-width: 768px) {
    .sec01 .sec01_01 {
      padding: 45px 15px; } }
  .sec01 .sec01_01 .inner {
    margin: 0 auto;
    max-width: 1200px; }
    @media screen and (max-width: 767px) {
      .sec01 .sec01_01 .inner .bizflex .ttl {
        margin: 0 auto;
        width: calc(292% / 6); } }
    .sec01 .sec01_01 .inner .opposite {
      margin: 0 auto;
      width: calc(74% / 12); }
    .sec01 .sec01_01 .inner .usually {
      color: #7a6e73; }
      .sec01 .sec01_01 .inner .usually .ttl {
        font-size: 30px; }
        @media screen and (max-width: 768px) {
          .sec01 .sec01_01 .inner .usually .ttl {
            font-size: 26px; } }
.sec01 .sec01_02 {
  padding: 80px 30px 90px; }
  @media screen and (max-width: 768px) {
    .sec01 .sec01_02 {
      padding: 40px 15px; } }
  .sec01 .sec01_02 .inner {
    align-items: flex-end;
    display: flex;
    justify-content: space-between;
    margin: 0 auto;
    max-width: 1280px; }
    @media screen and (max-width: 960px) {
      .sec01 .sec01_02 .inner {
        display: block; } }
    .sec01 .sec01_02 .inner .left {
      letter-spacing: 0.1em;
      width: calc(652% / 12.8); }
      @media screen and (max-width: 960px) {
        .sec01 .sec01_02 .inner .left {
          margin: 0 auto 40px;
          width: 100%;
          max-width: 652px; } }
      @media screen and (max-width: 768px) {
        .sec01 .sec01_02 .inner .left {
          letter-spacing: normal; } }
      .sec01 .sec01_02 .inner .left .usually {
        margin-bottom: 60px;
        padding-bottom: 30px;
        position: relative; }
        .sec01 .sec01_02 .inner .left .usually::after {
          border: 20px solid transparent;
          border-top: 40px solid #786d72;
          content: "";
          left: 50%;
          margin-left: -20px;
          position: absolute;
          top: 100%; }
        .sec01 .sec01_02 .inner .left .usually p {
          color: #796e73;
          font-size: 20px; }
          @media screen and (max-width: 1280px) {
            .sec01 .sec01_02 .inner .left .usually p {
              font-size: 14px; } }
        .sec01 .sec01_02 .inner .left .usually ul {
          border: 4px solid #7a6e73;
          display: flex; }
          .sec01 .sec01_02 .inner .left .usually ul li {
            align-items: center;
            background: #fff;
            display: flex;
            justify-content: center;
            line-height: 1.5;
            padding: 12px 5px;
            padding: 16px 5px 8px\0;
            position: relative;
            text-align: center;
            width: 50%; }
            .sec01 .sec01_02 .inner .left .usually ul li:nth-child(1) {
              border-right: 4px solid #7a6e73; }
      @media screen and (max-width: 768px) {
        .sec01 .sec01_02 .inner .left .bizflex .logo {
          margin: 0 auto;
          width: calc(155% / 4); } }
      .sec01 .sec01_02 .inner .left .bizflex .box {
        background: #fff;
        border: 4px solid;
        color: #a1544b;
        font-size: 25px;
        padding: 8px;
        padding: 12px 8px 4px\0;
        text-align: center; }
        @media screen and (max-width: 1280px) {
          .sec01 .sec01_02 .inner .left .bizflex .box {
            font-size: 15px; } }
    .sec01 .sec01_02 .inner .right {
      width: calc(560% / 12.8); }
      @media screen and (max-width: 960px) {
        .sec01 .sec01_02 .inner .right {
          margin: 0 auto;
          width: 100%;
          max-width: 560px; } }

/* sec01 */
/* sec02 */
.sec02 {
  padding: 200px 0; }
  @media screen and (max-width: 768px) {
    .sec02 {
      padding: 100px 0; } }
  .sec02 .main {
    background: #e9e4d9; }
    .sec02 .main .inner {
      background: url("../images/concept/main02.png") no-repeat center right 20px;
      background-size: contain; }
      @media screen and (max-width: 1380px) {
        .sec02 .main .inner {
          background-size: 55% auto; } }
      @media screen and (max-width: 767px) {
        .sec02 .main .inner {
          background: none; } }
      .sec02 .main .inner .text_wrap h2::after {
        background: url("../images/concept/index02.png") no-repeat center;
        background-size: contain; }
  .sec02 .sec02_01 {
    padding: 100px 30px; }
    @media screen and (max-width: 768px) {
      .sec02 .sec02_01 {
        padding: 40px 15px; } }
    .sec02 .sec02_01 .inner {
      align-items: center;
      display: flex;
      justify-content: space-between;
      margin: 0 auto;
      max-width: 1280px; }
      @media screen and (max-width: 767px) {
        .sec02 .sec02_01 .inner {
          display: block; } }
      .sec02 .sec02_01 .inner .left {
        width: calc(425% / 12.8); }
        @media screen and (max-width: 767px) {
          .sec02 .sec02_01 .inner .left {
            text-align: center;
            width: 100%; } }
      .sec02 .sec02_01 .inner .right {
        width: calc(820% / 12.8); }
        @media screen and (max-width: 767px) {
          .sec02 .sec02_01 .inner .right {
            margin: 30px auto 0;
            width: 100%;
            max-width: 820px; } }
  .sec02 .sec02_02 {
    padding: 100px 30px; }
    @media screen and (max-width: 768px) {
      .sec02 .sec02_02 {
        padding: 40px 15px; } }
    .sec02 .sec02_02 .inner {
      align-items: center;
      display: flex;
      justify-content: space-between;
      margin: 0 auto;
      max-width: 1280px; }
      @media screen and (max-width: 767px) {
        .sec02 .sec02_02 .inner {
          display: block; } }
      .sec02 .sec02_02 .inner .left {
        width: calc(431% / 12.8); }
        @media screen and (max-width: 767px) {
          .sec02 .sec02_02 .inner .left {
            text-align: center;
            width: 100%; } }
      .sec02 .sec02_02 .inner .right {
        width: calc(820% / 12.8); }
        @media screen and (max-width: 767px) {
          .sec02 .sec02_02 .inner .right {
            margin: 30px auto 0;
            width: 100%;
            max-width: 820px; } }
  .sec02 .sec02_03 {
    padding: 100px 30px; }
    @media screen and (max-width: 768px) {
      .sec02 .sec02_03 {
        padding: 40px 15px; } }
    .sec02 .sec02_03 .inner {
      display: flex;
      justify-content: space-between;
      margin: 0 auto;
      align-items: flex-start;
      max-width: 1280px; }
      @media screen and (max-width: 768px) {
        .sec02 .sec02_03 .inner {
          margin: 0 auto;
          display: block;
          max-width: 660px; } }
      .sec02 .sec02_03 .inner .left {
        width: calc(596% / 12.8); }
        @media screen and (max-width: 768px) {
          .sec02 .sec02_03 .inner .left {
            width: 100%; } }
        .sec02 .sec02_03 .inner .left .ttl {
          border: 4px solid #a29a9e;
          color: #796e73;
          font-size: 20px;
          padding: 5px;
          padding: 8px 5px 2px\0; }
          @media screen and (max-width: 1280px) {
            .sec02 .sec02_03 .inner .left .ttl {
              font-size: 14px; } }
      .sec02 .sec02_03 .inner .right {
        background: #fff;
        padding: 45px 50px 25px;
        width: calc(614% / 12.8); }
        @media screen and (max-width: 980px) {
          .sec02 .sec02_03 .inner .right {
            padding: 20px; } }
        @media screen and (max-width: 768px) {
          .sec02 .sec02_03 .inner .right {
            margin-top: 30px;
            width: 100%; } }
        .sec02 .sec02_03 .inner .right .ttl {
          border: 4px solid #b77b7d;
          color: #a1544b;
          font-size: 20px;
          line-height: 1.3;
          padding: 5px;
          padding: 8px 5px 2px\0; }
          @media screen and (max-width: 1280px) {
            .sec02 .sec02_03 .inner .right .ttl {
              font-size: 14px; } }
        .sec02 .sec02_03 .inner .right ul {
          display: flex;
          justify-content: space-between;
          position: relative; }
          .sec02 .sec02_03 .inner .right ul li {
            position: relative;
            width: calc(241% / 5.14); }
            .sec02 .sec02_03 .inner .right ul li:nth-child(1)::after {
              border: 18px solid transparent;
              border-left: 15px solid #837372;
              content: "";
              position: absolute;
              left: 104%;
              top: 50%; }
              @media screen and (max-width: 1280px) {
                .sec02 .sec02_03 .inner .right ul li:nth-child(1)::after {
                  border: 14px solid transparent;
                  border-left: 10px solid #837372; } }
            .sec02 .sec02_03 .inner .right ul li .en {
              font-size: 16px; }
        .sec02 .sec02_03 .inner .right .en {
          font-size: 13px;
          font-weight: bold;
          letter-spacing: -0.1em; }
        .sec02 .sec02_03 .inner .right .txt {
          font-size: 12px; }

/* sec02 */
/* sec03 */
.sec03 .cap_r {
  box-sizing: content-box;
  margin: 0 auto;
  padding: 0 30px;
  max-width: 1280px; }
  @media screen and (max-width: 768px) {
    .sec03 .cap_r {
      padding: 0 15px;
      text-align: left; } }
.sec03 .main {
  background: #cec6bb; }
  .sec03 .main .inner {
    background: url("../images/concept/main03.png") no-repeat center right 20px;
    background-size: contain; }
    @media screen and (max-width: 1380px) {
      .sec03 .main .inner {
        background-size: 50% auto; } }
    @media screen and (max-width: 768px) {
      .sec03 .main .inner {
        background-size: 45% auto; } }
    @media screen and (max-width: 767px) {
      .sec03 .main .inner {
        background: none; } }
    .sec03 .main .inner .text_wrap h2::after {
      background: url("../images/concept/index03.png") no-repeat center;
      background-size: contain; }
.sec03 .sec03_01 {
  padding: 140px 30px 80px; }
  @media screen and (max-width: 768px) {
    .sec03 .sec03_01 {
      padding: 40px 15px; } }
  .sec03 .sec03_01 .inner {
    margin: 0 auto;
    max-width: 1285px; }
    .sec03 .sec03_01 .inner .service {
      align-items: center;
      border-bottom: 2px solid;
      border-top: 2px solid;
      display: flex;
      justify-content: space-between;
      padding: 20px 50px; }
      @media screen and (max-width: 980px) {
        .sec03 .sec03_01 .inner .service {
          padding: 20px 10px; } }
      @media screen and (max-width: 767px) {
        .sec03 .sec03_01 .inner .service {
          display: block; } }
      .sec03 .sec03_01 .inner .service .text_wrap {
        width: calc(560% / 11.85); }
        @media screen and (max-width: 767px) {
          .sec03 .sec03_01 .inner .service .text_wrap {
            margin-bottom: 30px;
            width: 100%; } }
        .sec03 .sec03_01 .inner .service .text_wrap .ttl {
          font-size: 22px; }
          @media screen and (max-width: 768px) {
            .sec03 .sec03_01 .inner .service .text_wrap .ttl {
              font-size: 18px; } }
        .sec03 .sec03_01 .inner .service .text_wrap .txt {
          font-size: 15px; }
          @media screen and (max-width: 980px) {
            .sec03 .sec03_01 .inner .service .text_wrap .txt br {
              display: none; } }
      .sec03 .sec03_01 .inner .service .img {
        width: calc(518% / 11.85); }
        @media screen and (max-width: 767px) {
          .sec03 .sec03_01 .inner .service .img {
            text-align: center;
            width: 100%; } }
.sec03 .sec03_02 {
  margin-bottom: 270px;
  padding: 100px 30px; }
  @media screen and (max-width: 768px) {
    .sec03 .sec03_02 {
      margin-bottom: 100px;
      padding: 40px 20px; } }
  .sec03 .sec03_02 .inner {
    align-items: center;
    display: flex;
    justify-content: space-between;
    margin: 0 auto;
    max-width: 1280px; }
    @media screen and (max-width: 768px) {
      .sec03 .sec03_02 .inner {
        display: block; } }
    .sec03 .sec03_02 .inner .left {
      width: calc(740% / 12.8); }
      @media screen and (max-width: 768px) {
        .sec03 .sec03_02 .inner .left {
          text-align: center;
          width: 100%; } }
      .sec03 .sec03_02 .inner .left ul {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between; }
        .sec03 .sec03_02 .inner .left ul li {
          align-items: center;
          background: #fff;
          border: 2px dashed #382e2b;
          border-radius: 6px;
          display: flex;
          justify-content: center;
          flex-wrap: wrap;
          font-size: 17px;
          line-height: 1.5;
          margin-bottom: 20px;
          min-height: 60px;
          padding: 20px 10px;
          padding: 13px 10px 6px\0;
          text-align: center;
          width: calc(288% / 6); }
          @media screen and (max-width: 1280px) {
            .sec03 .sec03_02 .inner .left ul li {
              font-size: 14px; } }
          @media screen and (max-width: 480px) {
            .sec03 .sec03_02 .inner .left ul li {
              font-size: 12px;
              letter-spacing: 0.05em;
              padding: 15px 10px; } }
          .sec03 .sec03_02 .inner .left ul li:not(.big):nth-child(3), .sec03 .sec03_02 .inner .left ul li:not(.big):nth-child(4) {
            margin-bottom: 0; }
          .sec03 .sec03_02 .inner .left ul li p {
            width: 100%; }
            .sec03 .sec03_02 .inner .left ul li p.sub {
              border-top: 2px solid #333;
              margin-top: 15px;
              padding-top: 15px;
              font-size: 16px;
              line-height: 1.8;
              letter-spacing: 0.02em; }
              @media screen and (max-width: 1280px) {
                .sec03 .sec03_02 .inner .left ul li p.sub {
                  font-size: 14px; } }
              @media screen and (max-width: 480px) {
                .sec03 .sec03_02 .inner .left ul li p.sub {
                  font-size: 12px;
                  text-align: left;
                  margin-top: 10px;
                  padding-top: 10px; } }
          .sec03 .sec03_02 .inner .left ul li.big {
            border: 3px solid #382e2b;
            font-size: 24px;
            margin-bottom: 0;
            padding: 20px 10px;
            padding: 20px 10px 6px\0; }
            @media screen and (max-width: 1280px) {
              .sec03 .sec03_02 .inner .left ul li.big {
                font-size: 21px;
                letter-spacing: normal; } }
            @media screen and (max-width: 768px) {
              .sec03 .sec03_02 .inner .left ul li.big {
                font-size: 18px; } }
            @media screen and (max-width: 480px) {
              .sec03 .sec03_02 .inner .left ul li.big {
                font-size: 16px; } }
      .sec03 .sec03_02 .inner .left .l_ttl {
        font-size: 22px;
        margin-top: 30px;
        margin-bottom: 20px; }
    .sec03 .sec03_02 .inner .right {
      width: calc(460% / 12.8); }
      @media screen and (max-width: 768px) {
        .sec03 .sec03_02 .inner .right {
          margin: 40px auto 0;
          width: 100%;
          max-width: 460px; } }

/* sec03 */

/*# sourceMappingURL=concept.css.map */