/* レポートダウンロード */
.report .reportTitleBox {
  margin-top: 6rem;
  text-align: center;
}
.report .reportTitle {
  font-size: var(--fz24);
}
.report .reportDes {
  font-size: var(--fz18);
  border-top: 1px solid #c3c3c3;
}
.report .reportList {
  display: flex;
  justify-content: center;
  gap: 2rem;
  margin-top: 4rem;
}
.report .reportList li {
  width: calc(100% / 4);
}
.report .reportList a {
  display: flex;
}
.report .reportList a img {
  width: 100%;
  height: 100%;
}
/* works */
.works .worksImgArea {
  display: flex;
  position: relative;
  margin-bottom: 10rem;
}
.works .worksImgArea .worksImg {
  width: calc(100% / 4);
  overflow: hidden;
}
.works .worksImgArea .worksImg:nth-of-type(2n) {
  position: relative;
  top: -1rem;
}
.works .worksImgArea .worksImg img {
  display: flex;
  width: 100%;
  object-fit: cover;
}
.works .worksTextArea {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.works .worksTextArea p {
  font-size: var(--fz48);
  color: #fff;
  margin-bottom: 1rem;
}
.worksList .elegance {
  margin-top: 12rem;
}
/* サービス */
.servieArea {
  margin-top: 6rem;
  display: flex;
  gap: 4rem;
}
.servieArea div {
  width: calc(100% / 2 - 4rem);
  display: flex;
  flex-direction: column;
}
.servieArea .serviceTitle {
  font-size: var(--fz20);
  font-weight: 600;
  border-bottom: 1px solid #c3c3c3;
  margin-bottom: 1rem;
}

.servieArea .serviceDes {
  flex: 1;
  height: 100%;
}
.servieArea figure {
  flex: 1;
  text-align: center;
  margin-top: 4rem;
}
/* 開業までの流れ */
.processArea {
  display: flex;
  align-items: flex-end;
  gap: 4rem;
}
.processList li {
  display: flex;
  border-bottom: 1px solid #333;
  padding: 3rem 0;
}
.processList li .num {
  padding-right: 3rem;
  font-weight: 600;
}

.processList li .des .desTitle {
  font-size: var(--fz24);
  font-weight: 600;
  margin-top: -0.5rem;
}
.processList li .des .desText {
  letter-spacing: 0.4em;
  text-align: justify;
  text-justify: inter-ideograph;
}
/* お問合せ */
.contact {
  background-color: #e5e0dc;
}
.contact h2 {
  color: #333;
  text-align: center;
}
.contact .contactDes {
  color: #333;
  font-size: var(--fz20);
  text-align: center;
}
.btnArea {
  display: flex;
  justify-content: center;
}
.btnArea .btn {
  margin-top: 4rem;
}
.w .btn {
  color: #333;
  background-color: #fff;
}
/* お知らせ */
.newsListBox {
  display: flex;
  justify-content: flex-end;
}
.newsListArea {
  /* float: right; */
  width: 100%;
  max-width: 650px;
}
.newslist li {
  padding: 3rem 0;
  border-bottom: 1px solid #333;
}
.newslist .date {
  font-size: var(--fz14);
  margin-right: 2rem;
}
.newslist .cate {
  background-color: #666;
  padding: 0.3rem 1rem;
  box-sizing: border-box;
  color: #fff;
  font-size: var(--fz14);
}
.newslist .newscontent {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 2rem;
}
.newslist .newscontent i {
  display: flex;
  transform: translateX(0);
  transition: transform 0.4s ease;
}

.newslist li:hover .newscontent i {
  transform: translateX(10px);
}

.newslist .newscontent p {
  font-size: var(--fz20);
  font-weight: 600;
}
.newsbtn {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  margin-top: 4rem;
}
.newsbtn a {
  display: flex;
  align-items: center;
}
.newsbtn i {
  margin-left: 2rem;
  transform: translateX(0);
  transition: transform 0.4s ease;
}
.newsbtn a:hover i {
  transform: translateX(10px);
}

@media screen and (max-width: 820px) {
  .servieArea {
    flex-wrap: wrap;
  }
  .servieArea div {
    width: 100%;
  }
  .processArea figure {
    display: none;
  }
}
@media screen and (max-width: 768px) {
}
@media screen and (max-width: 640px) {
  .report .reportList {
    flex-wrap: wrap;
  }
  .report .reportList li {
    width: calc(100% / 2 - 1rem);
  }
}
/* service slider */
.slider-wrapper .btnArea {
  padding: 2rem;
}
.slider-wrapper .btnArea .btn {
  margin-top: 0;
}
.slider-wrapper {
  margin-top: 6rem;
  position: relative;
}
.serviceSlider .slide {
  border: 1px solid #dcdcdc;
  margin: 0 1rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.serviceSlider .slide h3 {
  font-size: var(--fz20);
  font-weight: 600;
  margin-bottom: 1rem;
}
.serviceSlider .slide .slideTextArea {
  padding: 2rem;
  box-sizing: border-box;
}
.serviceSlider .slide .slideImgArea.imgPadding {
  padding: 2rem;
  box-sizing: border-box;
  max-height: unset;
}
.serviceSlider .slide .slideImgArea {
  max-height: 280px;
  height: 100%;
  overflow: hidden;
}
.serviceSlider .slide .slideImgArea img {
  object-fit: cover;
  width: 100%;
  height: 100%;
}
.slick-dots li {
  background-color: #efefef;
  border-radius: 50%;
  width: 10px;
  height: 10px;
}
.slick-dots li.slick-active {
  background-color: #999999;
}
.slick-slide img {
  width: 100%;
}
.slick-prev,
.slick-next {
  cursor: pointer;
  z-index: 1000;
  border: none;
  position: absolute;
  top: 50%;
  left: -50px;
  transform: translate(0, -50%);
  background: url(../img/arrowleft.svg) no-repeat;
  background-size: cover;
  width: 50px;
  height: 50px;
}
.slick-next {
  left: auto;
  right: -50px;
  background: url(../img/arrowRight.svg) no-repeat;
}
@media screen and (max-width: 768px) {
  .serviceSlider .slide .slideImgArea {
    max-height: none;
    height: auto;
  }
  .slick-prev,
  .slick-next {
    display: none;
  }
}
.btnArea.topContact .mailIcon {
  margin-right: 1rem;
}
.btnArea.topContact .arrowIcon {
  margin-left: 1rem;
}
.btnArea.topContact .btn {
  box-shadow: 0 4px 0px rgba(0, 0, 0, 1);
}
/* new slide */
.worksnewslide {
  position: relative;
  margin-bottom: 10rem;
}
.slider {
  width: 100%;
  overflow: hidden;
}
.slider ul {
  display: flex;
}
.slider li {
  width: auto;
}
.slider img {
  height: 500px;
  width: auto;
  display: block;
}
@media screen and (max-width: 640px) {
  .slider img {
    height: 360px;
    width: auto;
    display: block;
  }
}
/* Scroll Modal */
.smodal {
  position: fixed;
  inset: 0;
  display: none;
  z-index: 10000;
}
.smodal.is-open {
  display: block;
}
.smodal__img {
  display: flex;
  width: 100%;
}
.smodal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.7);
}
.smodal__dialog {
  max-width: 500px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) !important;
  box-sizing: border-box;
  transform-origin: center center;
  z-index: 1;
}
.smodal__dialog:focus,
.smodal__dialog:focus-visible {
  outline: none;
}
.smodal__dialog a {
  overflow: hidden;
  border-radius: 12px;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.25);
  display: flex;
  position: relative;
  z-index: 1;
}
.smodal__close {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 40px;
  height: 40px;
  border: none;
  background: transparent;
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
  z-index: 2;
}
.smodal__close img {
  width: 100%;
}
.smodal__title {
  font-size: var(--fz20, 20px);
  margin: 0 0 8px;
  font-weight: 700;
}
.smodal__desc {
  font-size: var(--fz16, 16px);
  margin: 0 0 16px;
}
.smodal__actions .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
html.is-modal-open,
body.is-modal-open {
  overflow: hidden;
  touch-action: none;
}
.smodal__optout {
  margin-top: 0.4rem;
  text-align: center;
}
.smodal__optoutLabel {
  color: #fff;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  text-align: right;
}
.modalbannerFixed {
  margin-bottom: 1rem;
  max-width: 250px;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.25);
  border-radius: 12px;
  overflow: hidden;
}
.modalbannerFixed a {
  display: flex;
}
.modalbannerFixed img {
  width: 100%;
}
