﻿.outline {
  margin-top: var(--block-space-l);
}

.outline, .clinic-facillity, .staff {
  margin-bottom: var(--block-space-max);
}

.outline-info {
  margin-top: var(--block-space-m);
  display: flex;
}


@media print, screen and (min-width:641px) {
  .outline-info .txt-box {
    width: calc(100% - 660px);
  }

  .outline-info .img-box {
    width: 600px;
    height: 450px;
    margin-right: 60px;
  }

  .outline-info dl {
    margin-top: var(--block-space-s);
  }

}

@media print, screen and (max-width:640px) {
  .outline-info {
    flex-wrap: wrap-reverse;
    justify-content: center;
  }

  .outline-info .txt-box {
    margin-bottom: var(--block-space-l);
  }

  .outline-info .img-box {
    width: 100%;
    padding-top: 75%;
  }

  .outline-info dl {
    margin-top: var(--block-space-m);
  }
}

.outline-info .img-box {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-image: url(../image/group_photo.jpg);
  border-radius: 10px;
}

.outline-info .txt-box img[src$=".svg"] {
  max-width: 300px;
}

.outline-info dl {
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
}



.outline-info dt {
  color: #fff;
  /* height: 100%; */
  text-align: center;
  background-color: rgba(var(--color-blue02), 1);
  border-radius: 5px;
}

.outline-info dt {
  width: 120px;
  display: block;
  font-size: var(--fs-s);
  margin-right: 20px;
  padding: 5px 0;
}

.outline-info dd {
  text-align: left;
}

.outline-info dd {
  width: calc(100% - 140px);
  padding: 5px 0;
}

.outline-info dt:not(:last-of-type),
.outline-info dd:not(:last-of-type) {
  margin-bottom: 10px;
}


.facility-list, .staff-list {
  list-style: none;
  text-align: center;
}

.facility-list, .staff-list {
  grid-column-gap: var(--block-space-l);
  grid-row-gap: var(--block-space-l);
}

.facility-list img, .staff-list img {
  border-radius: 5px;
}

.facility-list li>span, .staff-list li>span {
  padding: 10px 0;
  font-weight: 500;
  display: block;
  font-size: var(--fs-m);
}

/*----------------------------------------------------------------------------------------------------

  受診案内
  
----------------------------------------------------------------------------------------------------*/
.sec-jushin {
  max-width: var(--base-width);
  margin-left: auto;
  margin-right: auto;
  padding-top: var(--block-space-l);
  padding-bottom: var(--block-space-max);
  padding-left: var(--side-space);
  padding-right: var(--side-space);
  text-align: left;
}

@media print, screen and (min-width:641px) {
  .sec-jushin {
    box-sizing: content-box;
  }
}

/*--------------------------------------------------------------------------------
  初診・再診
--------------------------------------------------------------------------------*/
.jushin {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.jushin-box .ttl {
  line-height: 1.2;
  color: #fff;
  background-color: rgba(var(--color-8), 1);
  display: inline-block;
  vertical-align: top;
  font-weight: 500;
  padding: 0.75rem 1rem;
  margin-top: -1em;
  position: relative;
  z-index: 2;
}

.jushin-box .txt {
  padding-top: 0.5em;
}

.mochimonoList {
  padding-top: 1em;
}

@media print, screen and (min-width:641px) {
  .jushin {
    margin-left: -1.5em;
    margin-right: -1.5em;
  }

  .jushin-box {
    width: 50%;
    padding-left: 1.5em;
    padding-right: 1.5em;
  }

  .jushin-box .ttl {
    font-size: var(--fs-2l);
  }
}

@media screen and (max-width:640px) {
  .jushin-box {
    width: 100%;
    max-width: 480px;
    margin-left: auto;
    margin-right: auto;
  }

  .jushin-box .ttl {
    font-size: var(--fs-l);
  }

  .jushin-box:not(:first-of-type) {
    padding-top: var(--block-space-l);
  }
}

/*--------------------------------------------------------------------------------
  問診表
--------------------------------------------------------------------------------*/
.jushin-monshinhyo {
  margin-top: var(--block-space-l);
  border: 3px solid rgba(var(--scolor-5), 0.7);
  background-color: rgba(var(--scolor-1), 1);
  text-align: center;
  padding: var(--box-space-s);
}

.jushin-monshinhyo .txt {
  padding-bottom: 1.5em;
}

.jushin-monshinhyo .p-btn {
  margin-bottom: 0.5em;
}

@media print, screen and (min-width:641px) {}

@media screen and (max-width:640px) {
  .jushin-monshinhyo .txt {
    text-align: left;
  }
}

/*----------------------------------------------------------------------------------------------------

  よくあるご質問
  
----------------------------------------------------------------------------------------------------*/
.sec-faq {
  padding-top: var(--block-space-max);
  padding-bottom: var(--block-space-max);
  padding-left: var(--side-space);
  padding-right: var(--side-space);
  background-color: rgba(var(--color-1), 1);
}

.faq-list {
  padding-top: var(--block-space-l);
}