@charset "UTF-8";
/* CSS Document */

/* header */


/* PC版 w560以上に適応するcss ****************************************************************** */
/* PC版 w560以上に適応するcss ****************************************************************** */
/* PC版 w560以上に適応するcss ****************************************************************** */
/* PC版 w560以上に適応するcss ****************************************************************** */
/* PC版 w560以上に適応するcss ****************************************************************** */
/* PC版 w560以上に適応するcss ****************************************************************** */

/* section 1 */


/* フロートするFlash 上のキャッチ */






/* ここからスライドするイメージの設定 */

.flash_wrap {
	background-image:url(../img/base_dotted.jpg);
	background-repeat:repeat;
	height: 630px;;

}


 /* .viewer
------------------------- */
.viewer {
    margin: 0 auto;
    width: 1150px;
    position: relative;
	padding-bottom: 30px;
	margin: 0 auto;
	display: block;
}
.viewer ul {
    width: 100%;
    overflow: hidden;
    position: relative;
	
}
.viewer ul li a {
    top: 0;
    left: 0;
    width: 100%;
    position: absolute;
	
}
.viewer ul li a img {
    width: 100%;
	height: auto;
	
}
/* =======================================
    ClearFixElements
======================================= */
.viewer ul:after {
    content: ".";
    height: 0;
    clear: both;
    display: block;
    visibility: hidden;
}
 
.viewer ul {
    display: inline-block;
    overflow: hidden;
}

.l-mv {
  padding: 0;
  overflow: hidden;
  .inner {
    position: relative;
    .headline {
      font-weight: bold;
      letter-spacing: 4px;
      color: white;
      text-shadow: 0 0 10px rgba(0,0,0,1);
      -webkit-text-stroke: 1px black;
      text-stroke: 1px black;
      paint-order: stroke;
      position: absolute;
      top: 22vh;
      left: 10%;
      z-index: 10;
      .title {
        font-size: 44px;
      }
      .titlelead {
        font-size: 20px;
        letter-spacing: 2px;
        display: block;
        margin-top: 20px;
        padding-left: 5px;
      }
    }
    .slider-img {
      width: 100%;
      height: calc(100svh - 106px);
      position: relative;
      &:nth-child(3) {
        img {
          object-position: right;
        }
      }
      img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
        position: absolute;
        top: 0;
        left: 0;
      }
    }
    .buttons {
      position: absolute;
      bottom: 7vh;
      left: 10%;
      display: flex;
      gap: 15px;
      a {
        display: block;
        width: 200px;
        line-height: 45px;
        background-color: #fff;
        color: #000;
        font-size: 13px;
        font-weight: 600;
        text-align: center;
        border-radius: 100vh;
        position: relative;
        box-sizing: border-box;
        padding-right: 15px;
        &:before {
          content: '';
          display: block;
          width: 16px;
          height: 16px;
          border-radius: 8px;
          background-color: #000;
          position: absolute;
          top: 50%;
          right: 20px;
          transform: translate(50%, -50%);
          transform-origin: center;
        }
        &:after {
          content: '';
          display: block;
          width: 4px;
          height: 4px;
          border-top: 1px solid #fff;
          border-right: 1px solid #fff;
          position: absolute;
          top: 50%;
          right: 20px;
          transform: translate(50%, -50%) rotate(45deg);
          transform-origin: center;
        }
        &.black {
          background-color: #000;
          color: #fff;
          &:before {
            background-color: #fff;
          }
          &:after {
            border-color: #000;
          }
        }
      }
    }
  }
}

@media screen and (max-width: 1150px) {
  .l-mv {
    .inner {
      .headline {
        top: 18vh;
        left: 8%;
        .title {
          font-size: 64px;
        }
        .titlelead {
          font-size: 24px;
        }
      }
    }
  }
}

@media screen and (min-width: 768px) {
  .l-mv {
    .inner {
      .buttons {
        a {
          transition: .3s;
          &:before {
            transition: .3s;
          }
          &:after {
            transition: .3s;
          }
          &:hover {
            background-color: #000;
            color: #fff;
            &:before {
              background-color: #fff;
            }
            &:after {
              border-color: #000;
            }
            &.black {
              background-color: #fff;
              color: #000;
              &:before {
                background-color: #000;
              }
              &:after {
                border-color: #fff;
              }
            }
          }
        }
      }
    }
  }
}

@media screen and (max-width: 767px) {
  .l-mv {
    .inner {
      .headline {
        letter-spacing: 2px;
        top: 18vh;
        left: 8%;
        .title {
          font-size: 30px;
        }
        .titlelead {
          font-size: clamp(14px, 4.375vw, 16px);
          margin-top: 15px;
        }
      }
      .buttons {
        left: 8%;
        flex-direction: column;
        a {
          line-height: 40px;
          font-size: 12px;
        }
      }
    }
  }
}


.l-ideal-home {
  min-width: 1100px;
  padding-top: 100px;
  padding-bottom: 40px;
  background-color: #ebe8e3;
  .inner {
    width: 950px;
    margin: 0 auto;
    position: relative;
    .text-block {
      width: 466px;
      .headline {
        font-size: 25px;
        line-height: 49px;
        letter-spacing: .075em;
        font-weight: 700;
        margin: 0;
        b {
          color: #036eb8;
        }
      }
      .text {
        margin-top: 20px;
        margin-bottom: 0;
        font-size: 15px;
        line-height: 29px;
        text-align: justify;
        color: #000;
      }

    }
    .image-block {
      position: absolute;
      top: 0;
      right: 0;
      width: 432px;
      height: 100%;

      img {
        width: 100%;
        height: auto;
      }
    }
    .buttons {
      margin-top: 28px;
      a {
        display: block;
        width: 318px;
        height: 54px;
        line-height: 52px;
        background-color: #ebe8e3;
        color: #000;
        font-size: 15px;
        font-weight: 600;
        text-align: center;
        border-radius: 50px;
        position: relative;
        box-sizing: border-box;
        padding-right: 26px;
        border: 1px solid #000;
        transition: .3s;
        &:hover {
          opacity: 0.7;
        }
        &:before {
          content: '';
          display: block;
          width: 20px;
          height: 20px;
          border-radius: 10px;
          background-color: #000;
          position: absolute;
          top: 50%;
          right: 26px;
          transform: translate(50%, -50%);
          transform-origin: center;
        }
        &:after {
          content: '';
          display: block;
          width: 6px;
          height: 6px;
          border-top: 1px solid #fff;
          border-right: 1px solid #fff;
          position: absolute;
          top: 50%;
          right: 26px;
          transform: translate(50%, -50%) rotate(45deg);
          transform-origin: center;
        }
      }
    }
  }
}

@media screen and (max-width: 767px) {
  .l-ideal-home {
    min-width: auto;
    padding-top: 36px;
    padding-bottom: 40px;
    background-color: #ebe8e3;
    .inner {
      width: calc(100% - 40px);
      margin: 0 auto;
      position: relative;
      .text-block {
        width: 100%;
        .headline {
          font-size: 24px;
          line-height: 38px;
          letter-spacing: .075em;
          margin: 0;
        }
        .text {
          margin-top: 20px;
          margin-bottom: 0;
          font-size: 15px;
          line-height: 29px;
        }
      }

      .image-block {
        margin-top: 20px;
        position: static;
        width: 100%;
        height: auto;
        padding: 0 15px;
        box-sizing: border-box;

        img {
          width: 100%;
          height: auto;
        }
      }
      .buttons {
        margin-top: 28px;
        a {
          display: block;
          width: 100%;
        }
      }
    }
  }
}



.l-consultation {
  min-width: 1100px;
  padding-top: 100px;
  padding-bottom: 40px;
  background-color: #ebe8e3;
  .inner {
    width: 950px;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    .text-block {
      width: 650px;
      color: #000;
      .headline {
        font-size: 25px;
        letter-spacing: .075em;
        font-weight: 700;
        margin: 0;
      }
      ul.reasons {
        margin: 0;
        padding: 0;
        margin-top: 20px;
        display: flex;
        flex-wrap: wrap;
        li {
          display: block;
          box-sizing: border-box;
          padding: 15px 24px 20px;
          margin-bottom: 0;
          &:nth-child(1) {
            width: 30%;
            border-right: 1px dashed #000;
            padding-left: 0;
          }
          &:nth-child(2) {
            width: 40%;
            grid-column-start: 3;
            border-right: 1px dashed #000;
          }
          &:nth-child(3) {
            width: 30%;
            grid-column-start: 5;
            padding-right: 0;
          }
          &:nth-child(4) {
            width: calc(100% / 2);
            border-top: 1px dashed #000;
            border-right: 1px dashed #000;
            padding-left: 0;
          }
          &:nth-child(5) {
            width: calc(100% / 2);
            border-top: 1px dashed #000;
            padding-right: 0;
          }
          .number {
            font-size: 36px;
            font-weight: 700;
            line-height: normal;
            color: #005b82;
            margin: 0;
            opacity: 0.3;
          }
          .title {
            margin: 0;
            font-size: 18px;
            line-height: 23px;
            font-weight: 600;
            box-sizing: border-box;
          }
          .description {
            margin: 0;
            margin-top: 15px;
            text-align: justify;
            font-size: 15px;
            line-height: 23px;
          }
        }
      }

    }
    .image-block {
      width: 270px;
      height: 100%;
      margin-top: 40px;
      img {
        width: 100%;
        height: auto;
      }
    }
    .buttons {
      margin: 35px auto 0;
      width: 490px;
      a {
        margin-left: auto;
        margin-right: auto;
        display: block;
        width: 318px;
        height: 54px;
        line-height: 52px;
        background-color: #ebe8e3;
        color: #000;
        font-size: 15px;
        font-weight: 600;
        text-align: center;
        border-radius: 50px;
        position: relative;
        box-sizing: border-box;
        padding-right: 26px;
        border: 1px solid #000;
        transition: .3s;
        &:hover {
          opacity: 0.7;
        }
        &:before {
          content: '';
          display: block;
          width: 20px;
          height: 20px;
          border-radius: 10px;
          background-color: #000;
          position: absolute;
          top: 50%;
          right: 26px;
          transform: translate(50%, -50%);
          transform-origin: center;
        }
        &:after {
          content: '';
          display: block;
          width: 6px;
          height: 6px;
          border-top: 1px solid #fff;
          border-right: 1px solid #fff;
          position: absolute;
          top: 50%;
          right: 26px;
          transform: translate(50%, -50%) rotate(45deg);
          transform-origin: center;
        }
      }
    }
  }
}


@media screen and (max-width: 767px) {
  .l-consultation {
    min-width: auto;
    padding-top: 36px;
    padding-bottom: 40px;
    background-color: #ebe8e3;
    .inner {
      width: calc(100% - 40px);
      margin: 0 auto;
      position: relative;
      .text-block {
        width: 100%;
        .headline {
          font-size: 24px;
          line-height: 38px;
          text-align: center;
          letter-spacing: .075em;
          margin: 0;
        }
        ul.reasons {
          margin-top: 10px;
          margin-bottom: 0;
          box-sizing: border-box;
          flex-direction: column;
          li {
            display: block;
            box-sizing: border-box;
          &:nth-child(1),
          &:nth-child(2),
          &:nth-child(3),
          &:nth-child(4),
          &:nth-child(5) {
            width: 100%;
            padding: 20px;
            border: none;
            border-bottom: 1px dashed #000;
          }
            .number {
              text-align: center;
              font-size: 28px;
              font-weight: 700;
              color: #005b82;
              margin: 0;
            }
            .title {
              margin: 0;
              margin-top: 5px;
              text-align: center;
              font-size: 18px;
              line-height: 23px;
              font-weight: 600;
              box-sizing: border-box;
            }
            .description {
              margin: 0;
              margin-top: 10px;
              text-align: justify;
              font-size: 15px;
              line-height: 23px;
            }
          }
        }

      }
      .image-block {
        margin-top: 30px;
        position: static;
        top: 0;
        left: 0;
        width: 100%;
        height: auto;

        img {
          width: 100%;
          height: auto;
        }
      }
      .buttons {
        margin-top: 28px;
        width: 100%;
        margin-left: auto;
        a {
          width: 100%;
        }
      }
    }
  }
}

.l-renovation {
  min-width: 1100px;
  padding-top: 100px;
  padding-bottom: 80px;
  background-color: #ebe8e3;
  .inner {
    width: 950px;
    margin: 0 auto;
    position: relative;
    .text-block {
      display: flex;
      align-items: center;
      gap: 24px;
      .headline {
        font-size: 25px;
        line-height: 49px;
        letter-spacing: .075em;
        font-weight: 700;
        margin: 0;
      }
      .text {
        margin: 0;
        font-size: 15px;
      }
    }
    .renovations {
      padding: 0;
      margin-top: 50px;
      display: flex;
      justify-content: center;
      gap: 52px;
      list-style: none;
      .renovations-item {
        width: 270px;
        padding-top: 75px;
        position: relative;
        &:before {
          content: '';
          display: block;
          position: absolute;
          top: 0;
          left: 0;
          width: 100%;
          height: 52px;
          background-size: 100px auto;
          background-position: center bottom;
          background-repeat: no-repeat;
        }
        &.renovation_01 {
          &:before {
            background-image: url(../img/icon_top_renovation_01.svg);
          }
        }
        &.renovation_02 {
          &:before {
            background-image: url(../img/icon_top_renovation_02.svg);
          }
        }
        &.renovation_03 {
          &:before {
            background-image: url(../img/icon_top_renovation_03.svg);
          }
        }

        .title {
          margin: 0;
          font-size: 17px;
          font-weight: 600;
          line-height: 1;
          text-align: center;
        }
        img {
          margin-top: 27px;
          width: 100%;
          height: auto;
        }
        .description {
          margin-top: 15px;
          font-size: 15px;
          line-height: 26px;
          text-align: justify;
        }
      }
    }
    .buttons {
      margin-top: 28px;
      a {
        margin-left: auto;
        margin-right: auto;
        display: block;
        width: 318px;
        height: 54px;
        line-height: 52px;
        background-color: #ebe8e3;
        color: #000;
        font-size: 15px;
        font-weight: 600;
        text-align: center;
        border-radius: 50px;
        position: relative;
        box-sizing: border-box;
        padding-right: 26px;
        border: 1px solid #000;
        transition: .3s;
        &:hover {
          opacity: 0.7;
        }
        &:before {
          content: '';
          display: block;
          width: 20px;
          height: 20px;
          border-radius: 10px;
          background-color: #000;
          position: absolute;
          top: 50%;
          right: 26px;
          transform: translate(50%, -50%);
          transform-origin: center;
        }
        &:after {
          content: '';
          display: block;
          width: 6px;
          height: 6px;
          border-top: 1px solid #fff;
          border-right: 1px solid #fff;
          position: absolute;
          top: 50%;
          right: 26px;
          transform: translate(50%, -50%) rotate(45deg);
          transform-origin: center;
        }
      }
    }
  }
}


@media screen and (max-width: 767px) {
  .l-renovation {
    min-width: auto;
    padding-top: 36px;
    padding-bottom: 40px;
    background-color: #ebe8e3;
    .inner {
      width: calc(100% - 40px);
      margin: 0 auto;
      position: relative;
      .text-block {
        width: 100%;
        display: block;
        .headline {
          font-size: 24px;
          line-height: 38px;
          letter-spacing: .075em;
          margin: 0;
          text-align: center;
        }
        .text {
          margin-top: 10px;
          margin-bottom: 0;
          font-size: 15px;
          line-height: 29px;
          text-align: center;
        }
      }
      .renovations {
        padding: 0;
        margin-top: 10px;
        margin-bottom: 50px;
        display: block;
        .renovations-item {
          width: 100%;
          padding-top: 75px;
          position: relative;
          .title {
            margin: 0;
            font-size: 17px;
            font-weight: 600;
            line-height: 1;
            text-align: center;
          }
          img {
            margin-top: 27px;
            width: 100%;
            height: auto;
          }
          .description {
            margin-top: 15px;
            font-size: 15px;
            line-height: 26px;
            text-align: justify;
          }
        }
        .slick-dots {
          li {
            &.slick-active {
              button:before {
                background-color: #6e5c2d;
              }
            }
            button:before {
              content: '';
              width: 8px;
              height: 8px;
              border-radius: 50%;
              position: absolute;
              top: 50%;
              left: 50%;
              transform: translate(-50%, -50%);
              background-color: #fff;
              opacity: 1;
            }
          }

        }
      }
      .buttons {
        margin-top: 28px;
        a {
          margin-left: auto;
          margin-right: auto;
          display: block;
          width: 318px;
          height: 54px;
          line-height: 52px;
          background-color: #ebe8e3;
          color: #000;
          font-size: 15px;
          font-weight: 600;
          text-align: center;
          border-radius: 50px;
          position: relative;
          box-sizing: border-box;
          padding-right: 26px;
          border: 1px solid #000;

          &:before {
            content: '';
            display: block;
            width: 20px;
            height: 20px;
            border-radius: 10px;
            background-color: #000;
            position: absolute;
            top: 50%;
            right: 26px;
            transform: translate(50%, -50%);
            transform-origin: center;
          }
          &:after {
            content: '';
            display: block;
            width: 6px;
            height: 6px;
            border-top: 1px solid #fff;
            border-right: 1px solid #fff;
            position: absolute;
            top: 50%;
            right: 26px;
            transform: translate(50%, -50%) rotate(45deg);
            transform-origin: center;
          }
        }
      }
    }
  }
}


.l-real-3d-perspective {
  min-width: 1100px;
  padding-top: 100px;
  padding-bottom: 40px;
  background-color: #ebe8e3;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  background-image: url(../img/bg_top_3d_perspective_pc.jpg);
  padding: 86px 0 54px;
  &>.inner {
    width: 950px;
    margin: 0 auto;
    position: relative;
    .box {
      background-color: rgba(255, 255, 255, .9);
      border-radius: 30px;
      position: relative;
      padding: 72px 74px 35px;
      .headline {
        position: absolute;
        top: 0;
        left: 50%;
        transform: translate(-50%, -50%);
        img {
          width: 520px;
          height: auto;
        }
      }
      .fig {
        img {
          width: 100%;
          height: auto;
        }
      }
      .buttons {
        margin-top: 22px;
        a {
          margin-left: auto;
          margin-right: auto;
          display: block;
          width: 318px;
          height: 54px;
          line-height: 52px;
          background-color: #ebe8e3;
          color: #000;
          font-size: 15px;
          font-weight: 600;
          text-align: center;
          border-radius: 50px;
          position: relative;
          box-sizing: border-box;
          padding-right: 26px;
          border: 1px solid #000;

          &:before {
            content: '';
            display: block;
            width: 20px;
            height: 20px;
            border-radius: 10px;
            background-color: #000;
            position: absolute;
            top: 50%;
            right: 26px;
            transform: translate(50%, -50%);
            transform-origin: center;
          }
          &:after {
            content: '';
            display: block;
            width: 6px;
            height: 6px;
            border-top: 1px solid #fff;
            border-right: 1px solid #fff;
            position: absolute;
            top: 50%;
            right: 26px;
            transform: translate(50%, -50%) rotate(45deg);
            transform-origin: center;
          }
        }
      }
    }
  }
}

@media screen and (max-width: 767px) {
  .l-real-3d-perspective {
    min-width: auto;
    padding-top: 69px;
    padding-bottom: 135px;
    background-image: url(../img/bg_top_3d_perspective_sp.jpg);
    .inner {
      width: calc(100% - 40px);
      margin: 0 auto;
      position: relative;
      .box {
        padding: 60px 20px 35px;
        .headline {
          img {
            width: 254px;
          }
        }
        .buttons {
          position: absolute;
          bottom: -77px;
          left: 0;
          width: 100%;
          a {
            width: 100%;
          }
        }
      }
    }
  }
}





/* ここから３つのコンテンツの丸ボタンの設定 */

.contents_btn_wrap {
	width:100%;
	background-color:#f2f2f0;
	background-image:url(../img/base_zumen.jpg);
	background-size:cover;
	background-position:center top;
	
}

.contents_btn_space {
	width:970px;
	margin:0 auto;
}

.btn_left {
	float:left;
	margin:10px 28px;
}

.btn_center{
	float:left;
	margin-left:100px;
	margin-top:10px;
}
	

.btn_right {
	margin:10px 28px;
	float:right;
}
	
.btn_cercle {
	width:220px;
	height:auto;
}
	
	
	/*
.btn_cercle {
	margin:10px auto;
	width:200px;
	height:auto;
}
*/

/* section 2 */


.renga_wrap {
	background-image:url(../img/base_renga.jpg);
	background-repeat:repeat;

}

.newsspace {
	width:1100px;
	background-image:url(../img/base_renga_top.jpg);
	background-repeat:no-repeat;
	background-position:top center;
	background-size:100%;	
	margin:0 auto;
		
}

.l-line {
  width: 950px;
  margin: auto;
  padding-top: 77px;
  a {
    display: block;
    img {
      width: 100%;
      height: auto;
    }
  }
}

@media screen and (max-width: 767px) {
  .l-line {
    width: calc(100% - 40px);
    padding-top: 47px;
    a {
      display: block;
      img {
        width: 100%;
        height: auto;
      }
    }
  }
}

.news_left {
	background-image:url(../img/base_menubar3.png);
	background-repeat:repeat-y;
	background-position:right center;
}


/* section 3 */

.contents_space {
	background-color:#FFFFFF;
}

.contents_bpx {
	margin-right:40px;
	margin-top:40px;
}

a.more_button {
	width:300px;
	display:block;
	font-size:16px;
	letter-spacing:0.1em;
	color:#000;
	font-weight:bold;
	padding-top:15px;
	padding-left:20px;
	padding-right:20px;
	padding-bottom:10px;
	background-image:url(../img/base_yajirushi.jpg);
	background-repeat:no-repeat;
	background-position:right center;
	text-align:left;
	float:right;
	margin-top:20px;
	margin-right:40px;
	border:1px solid #0067B6;
}

.w230 {
	width:230px;
}

.w300 {
	width:300px;
	font-weight:300;
	text-align:center;
	color:#FFF;
	letter-spacing:0.1em;
	font-size:16px;
}

.w300 img {
	width:100%;
	height:auto;
	margin-bottom:10px;
}

.m_l_50 {
	margin-left:50px;
}
.m_l_100 {
	margin-left:100px;
}

/* section 4 */

.link_wrap {
	width:200px;
	height:70px;
	padding-top:5px;
	background-image:url(../img/base_menubar2.png);
	background-repeat:repeat-y;
	background-position:right center;
	
}

.w480 {
	width:485px;
	margin:0 auto;
}

.w150 {
	width:100px;
	margin:0px 30px;
	text-align:center;
}


/* section 5 */

/* section 6 */



.w1100studiohouse {
	width: 950px;
	margin: 50px auto;
	background-image: url(../img/base_studiohouse1.png); 
}

.w1100benkyoukai {
	width: 950px;
	margin: 50px auto;
	background-image: url(../img/base_benkyoukai1.png); 
	background-position: center top; 
	background-size: cover; 
}


.w40per_l_w90per_c {
	width: 35%;
	float: right;
	margin: 30px 40px 30px auto;
}
/* プレゼンテーションコーナー */
.bg_presen{background-image: url("../img/presentation_bg.jpg"); 
	background-position: center bottom;background-repeat: no-repeat;
	background-size: contain;height: 300px; padding: 100px 0;}
.w40per_presen{width: 48%;float: left;padding-top: 5%;}
.w40per_presen p{font-size: 120%;line-height: 2;}
.presen_ttl{width: 50%;margin: 0 auto;}
.center{text-align: center;}
.presen_img{margin-top: 5%;}
.mt5per{margin-top: 5%;}
.presen_btn{margin: 5% auto 10%;width: 50%;}
/* スマホ版 w560以下に適応するcss *************************************************************** */
/* スマホ版 w560以下に適応するcss *************************************************************** */
/* スマホ版 w560以下に適応するcss *************************************************************** */
/* スマホ版 w560以下に適応するcss *************************************************************** */
/* スマホ版 w560以下に適応するcss *************************************************************** */
/* スマホ版 w560以下に適応するcss *************************************************************** */

@media screen and (max-width: 560px) {
/* プレゼンテーションコーナー */

/* section 1 */

/* フロートするFlash 上のキャッチ */


.w1100studiohouse {
	width: 95%;
	margin: 20px auto;
	background-image: url(../img/base_studiohouse2.png); 
}
	
.w1100benkyoukai {
	width: 95%;
	margin: 20px auto;
	background-image: url(../img/title_benkyoukai2.png); 
	background-position: center top;
	background-color: #fff;
	background-size: contain; 
}

	

.w40per_l_w90per_c {
	width: 85%;
	float: none;
	margin: 30px auto;
}


/* ここからスライドするイメージの設定 */


.flashspace {
	width:100%;
	height:auto;
	margin:0 auto;
		
}

.flashspace img {
	width:100%;
	height:auto;
}
 /* .viewer
------------------------- */
.viewer {
    margin: 0 auto;
    width: 100%;
    position: relative;
	padding-bottom: 0px;
}	

	.flash_wrap {
		height: 230px;
	}
/* ここから３つのコンテンツの丸ボタンの設定 */

.contents_btn_wrap {
	background-position:left top;
	background-size:100%;
	background-repeat:no-repeat;
	
}

.contents_btn_space {
	width:100%;
}

.btn_left,.btn_center,.btn_right {
	float:none;
	display:block;
	margin:10px auto;
	width:200px;
	height:auto;
}
	


/* section 2 */


.renga_wrap {
	background-size:100%;
}

.newsspace {
	width:100%;
	margin:0 auto;
		
}

.news_left {
	background-image:none;
}



/* section 3 */


.contents_bpx {
	margin:30px auto 10px;
}


a.more_button {
	width:80%;
	font-size:12px;
	padding-top:12px;
	padding-left:10px;
	padding-right:10px;
	padding-bottom:8px;
	background-image:url(../img/base_yajirushi.jpg);
	float:none;
	margin:20px auto;

}

.w300 {
	width:80%;
	margin:0 auto 40px;
}


.m_l_50 {
	margin:0 auto 20px;
}

.m_l_100 {
	margin:0 auto 40px;
}


/* section 4 */

.w150 {
	width:100%;
	margin:0px auto;
}

.w230 {
	width:70%;
	display:block;
}


.w480 {
	width:100%;
}

.link_wrap {
	width:100%;
	padding-top:30px;
	background-image:none;
	text-align:center;
}


/* section 5 */

/* section 6 */

/* プレゼンテーションコーナー */
.bg_presen{background-image: none;height: auto;padding: 50px 0 0;}
.w40per_presen{width: 100%;float: none;padding-top: 5%;}
.w40per_presen p{font-size: 100%;line-height: 1.4;}
.presen_ttl{width: 60%;margin: 0 auto;}
.mt5per{margin-top: 5%;}
.presen_btn{margin: 5% auto 10%;width: 65%;}

}


/* Instagram */
.c-instagram .c-instagram__loader, .c-instagram .c-instagram__loader:after, .c-instagram .c-instagram__loader:before {
  border-radius: 100vh;
  width: 15px;
  height: 15px;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation: load 1.8s infinite ease-in-out;
  animation: load 1.8s infinite ease-in-out
}

@-webkit-keyframes load {
  0%, 80%, 100% {
    -webkit-box-shadow: 0 15px 0 -7.5px;
    box-shadow: 0 15px 0 -7.5px
  }

  40% {
    -webkit-box-shadow: 0 15px 0 0;
    box-shadow: 0 15px 0 0
  }
}

@keyframes load {
  0%, 80%, 100% {
    -webkit-box-shadow: 0 15px 0 -7.5px;
    box-shadow: 0 15px 0 -7.5px
  }

  40% {
    -webkit-box-shadow: 0 15px 0 0;
    box-shadow: 0 15px 0 0
  }
}

.c-instagram__loader {
  color: var(--white);
  font-size: .8rem;
  margin: 50px auto 100px;
  position: relative;
  text-indent: -9999em;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s
}

.c-instagram__loader:after, .c-instagram__loader:before {
  content: '';
  position: absolute;
  top: 0;
  left: 3.5em
}

.c-instagram__loader:before {
  left: -3.5em;
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s
}

.c-instagram__content {
  width: 80%;
  max-width: 440px;
  margin: 10px auto 0;
  padding: 15px;
  background-color: #fff;
}

@media screen and (min-width: 768px) {
.c-instagram__content {
  padding: 20px;
}
}

.c-instagram__content ul {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
  margin: 0;
}

.c-instagram__content ul li {
  width: 100%;
  aspect-ratio: 1 / 1;
  margin: 0;
}

.c-instagram__content ul li a {
  padding-top: 100%;
  position: relative;
  display: block;
  -webkit-transition: .3s;
  transition: .3s;
  overflow: hidden
}

.c-instagram__content ul li a img {
  position: absolute;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  top: 0;
  left: 0;
  -webkit-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out
}

.c-instagram__content ul li a img:hover {
  -webkit-transform: scale(1.2);
  transform: scale(1.2)
}

.c-instagram .js-loader.is-hidden, .c-instagram .js-content.is-hidden {
  display: none
}