@charset "UTF-8";
/*-------- 検査案内css --------*/

/* モバイルレイアウト 767px以下 */
/* --------------------------------------------------------
検査案内
-------------------------------------------------------- */
.inspectionList{
  margin: 15% 0;
}
.inspectionList h3{
  padding: 5px;
  transform: rotate(0.03deg);
  border-bottom: var(--main-color) 1px solid;
}

.inspectionList h3:before {
  display: none;
}

.inspectionList dl {
  margin: 10% 0;
}

.inspectionList dl dt {
  margin-bottom: 5%;
  text-align: center;
}

.inspectionList dl dd {
  margin: 0;
}
.inspectionList dl dd h4{
  margin: 1em 0 .5em;
  color: var(--main-color);
  font-family: 'Noto Sans JP', sans-serif;
  transform: rotate(0.03deg);
}
.inspectionList dl dd p{
  margin: .5em 0;
}

/* 予約について */
.reserve{
  padding: 5%;
  font-family: "M PLUS Rounded 1c", sans-serif;
  background-color: var(--bg-color01);
}
.reserve .tel{
  color:  var(--main-color);
  font-size: 1.2rem;
  font-weight: 600;
  display: flex;
  align-items: center;
  justify-self: center;
  gap: 10px;
}
.reserve .note{
  color: #4E4E4E;
}
.reserve .tel p,
.reserve .note ul li{
  transform: rotate(0.03deg);
}
.reserve .tel p span,
.reserve .note ul li span{
  display: inline-block;
}

/* --------------------------------------------------------
設備
-------------------------------------------------------- */
#equipment .item{
  margin-bottom: 15%;
}

#equipment .item h3{
  transform: rotate(0.03deg);
}

#equipment .item h3:before{
  color: var(--sub-color01);
}


/* タブレットレイアウト : 768 px～。モバイルレイアウトからスタイルを継承。 */
@media print, screen and (min-width: 768px) {

/* --------------------------------------------------------
検査案内
-------------------------------------------------------- */
.inspectionList{
  margin: 50px 0;
}

.inspectionList dl {
  margin: 30px 0 100px;
  display: flex;
  flex-direction: row;
  gap: 50px;
}

.inspectionList dl dt {
  margin-bottom: 0;
  width: 350px;
}

.inspectionList dl dd {
  margin: 0;
  width: calc(100% - 350px - 50px);
}

.inspectionList dl dd h4{
  font-size: 20px;
}


/* 予約について */
.reserve{
  margin: 100px auto;
  padding: 50px;
  max-width: 950px;
}
.reserve .tel{
  font-size: 28px;
}
.reserve .tel p{
  margin: .5em 0;
}
.reserve .note{
  margin: 0 auto;
  width: fit-content;
}


/* --------------------------------------------------------
設備
-------------------------------------------------------- */
#equipment .flexBox{
  display: flex;
  gap: 50px;
}

#equipment .item{
  margin-bottom: 50px;
}

#equipment .item h3{
  margin: 1em 0;
}

}