/*! Writen  by SCSS */
/*.inner_container {
	padding-bottom: clamp_gm(150,1200,250);
	color: #fff;
	position: relative;
	background: #f3efee;
	&::before {
		content: "";
		position: fixed;
		top: 0;
		left: 0;
		margin: auto;
		height: 100svh;
		width: 100svw;
		background-image: url("../images/introduction/bg.jpg");
		background-position: center;
		background-size: cover;
		background-repeat: no-repeat;
		z-index: -1;
		@include mq($br_sp) {
		background-image: url("../images/introduction/bg_sp.jpg");
		}
	}
}*/
.inner_container {
  background: #f3efee;
  padding-bottom: 20px; }
  .inner_container .inner_caps {
    padding-top: clamp(250px, 37.5vw, 450px); }

.sec1 {
  /*
  background: url("../images/design/bg.png") no-repeat;
  background-position: center;
  @include mq($br_sp){
  	background-size: cover;
  }
  */
  margin-bottom: clamp(100px, 16.667vw, 200px); }
  @media screen and (max-width: 480px) {
    .sec1 {
      margin-bottom: 80px; } }

.ta_l_sp {
  text-align: center !important; }
  @media screen and (max-width: 480px) {
    .ta_l_sp {
      text-align: left !important; } }

.sec2 {
  margin-bottom: clamp(150px, 19.167vw, 230px); }
  .sec2 .txt_box2 {
    margin-bottom: clamp(80px, 15vw, 180px); }
    @media screen and (max-width: 480px) {
      .sec2 .txt_box2 {
        width: calc(100% - 30px);
        margin-left: auto;
        margin-right: auto; } }
    .sec2 .txt_box2 .txt1 {
      font-size: clamp(16px, 2.084vw, 25px);
      line-height: 1.56;
      letter-spacing: 0.3em;
      margin-bottom: clamp(50px, 10vw, 120px); }
  .sec2 .items01 {
    max-width: 350px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 100px 0;
    gap: 50px 0;
    flex-direction: column; }
    @media screen and (max-width: 480px) {
      .sec2 .items01 {
        gap: 80px 0;
        gap: 40px 0;
        width: 80%;
        margin: 0 auto;
        max-width: 100%; } }
    .sec2 .items01 .item {
      width: calc(350%/6.9);
      width: 100%; }
      @media screen and (max-width: 480px) {
        .sec2 .items01 .item {
          width: 46%;
          width: 100%; } }
    .sec2 .items01 .txts {
      display: flex;
      flex-direction: column;
      gap: 10px 0;
      margin-bottom: 30px; }
      @media screen and (max-width: 480px) {
        .sec2 .items01 .txts:nth-last-child(1) {
          margin-bottom: 0; } }
      @media screen and (max-width: 480px) {
        .sec2 .items01 .txts {
          gap: 6px 0;
          margin-bottom: 20px;
          text-align: left; } }
      .sec2 .items01 .txts .boder_ttl {
        font-size: clamp(14px, 1.584vw, 19px); }
        @media screen and (max-width: 480px) {
          .sec2 .items01 .txts .boder_ttl {
            line-height: 1;
            text-align: center; } }
      .sec2 .items01 .txts .txt1 {
        letter-spacing: 0.08em;
        font-weight: 400; }
        @media screen and (max-width: 480px) {
          .sec2 .items01 .txts .txt1 {
            font-size: calc(14vw/3.9);
            font-size: calc(16vw/3.9);
            line-height: 1.4;
            text-align: center; } }
      .sec2 .items01 .txts .txt2 {
        font-weight: 300; }
        @media screen and (max-width: 480px) {
          .sec2 .items01 .txts .txt2 {
            font-size: calc(12vw/3.9); } }
    .sec2 .items01 .item03 {
      display: flex;
      flex-direction: column;
      row-gap: clamp(12px, 1.667vw, 20px); }
      .sec2 .items01 .item03 .txt {
        letter-spacing: 0.1em;
        font-size: clamp(16px, 1.667vw, 20px);
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        background: #8b817d;
        color: #fff;
        font-weight: 500;
        line-height: 1;
        padding: 15px 0;
        text-align: center; }
      .sec2 .items01 .item03 .txt:last-child {
        margin-bottom: 0; }

.sec3 .txt_box2 {
  margin-bottom: clamp(80px, 15vw, 180px); }
  .sec3 .txt_box2 .txt1 {
    font-size: clamp(16px, 1.584vw, 19px);
    margin-bottom: 1em; }
.sec3 .img {
  text-align: center;
  transform: translateX(20px); }
  @media screen and (max-width: 480px) {
    .sec3 .img {
      transform: translateX(10px); } }

@media screen and (max-width: 480px) {
  .sp_lide {
    overflow-x: scroll; }
    .sp_lide img {
      width: 600px;
      max-width: 600px; } }

.ls001 {
  letter-spacing: -0.01em !important; }

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