/*
 * m-rebirth.jp
 ********************************************/
html {
  font-size: 62.5%;
  font-family: 'Roboto', sans-serif;
  color: #000;
}
body {
  font-size: 1.4rem;
  line-height: 2;
  position: relative;
  min-height: calc(100vh - 130px);
  padding-bottom: 130px;
}
.container {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}
.pc_none {
  display: none;
}
.sp_none {
  display: block;
}
a:hover {
  opacity: .4;
  transition: all .5s;
}

/* Header
 ********************************************/
#top_header,
#header {
  width: 100%;
  height: 80px;
  position: fixed;
  top: 0;
  left: 0;
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  padding: 0px 30px;
  gap: 10px;
  z-index: 10;
  background-color: #fff;
}
#header #top_pc_nav {
  margin-left: auto;
}
#header .logo {
  height: 80px;
  line-height: 80px;
}
#header .logo img {
  vertical-align: middle;
}
.menu {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  padding: 22px 18px;
  gap: 30px;
}
.menu li.active {
  color: #c0c0c0;
}
.menu li:hover {
  text-decoration: underline;
  transition: .4s;
}

/* Footer
 ********************************************/
#top_footer {
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 10;
  height: 60px;
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  padding: 10px 40px 10px 10px;
  gap: 10px;
  font-size: 10px;
}
#footer {
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 10;
  height: 160px;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: right;
  gap: 10px;
  font-size: 10px;
}
#footer img {
  width: 100%;
  max-height: 100px;
}
#footer p {
  text-align: right;
  padding-right: 40px;
  line-height: 20px;
  vertical-align: middle;
  margin-bottom: 10px;
}

/* Common Parts
 ********************************************/
.sec-box {
  margin: 130px 0 50px;
  width: 100%;
}
.sec-inner {
  width: 100%;
  max-width: 980px;
  margin: 0 auto;
}
.sec-inner h1 {
  margin: 50px auto;
  width: 100%;
  font-size: 20px;
  font-weight: bold;
  text-align: center;
}
.sec-inner p {
  font-size: 14px;
  text-align: center;
  color: #0C0C0C;
}


/* TOP:MV
 ********************************************/
#top_image {
  position: relative;
  height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 0px;
  isolation: isolate;
}
.video_wrap {
  position: fixed;
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  overflow: hidden;
}
#top_video {
  /*天地中央配置*/
  position: absolute;
  z-index: -1;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  /*縦横幅指定*/
  width: 177.77777778vh; /* 16:9 の幅→16 ÷ 9＝ 177.77% */
  height: 56.25vw; /* 16:9の幅 → 9 ÷ 16 = 56.25% */
  min-height: 100%;
  min-width: 100%;
}
#top_info {
  text-align: center;
}
#top_info h1 {
  margin-bottom: 28px;
}
#top_info .word {
  display: block;
  height: 1.4rem;
  width: 100%;
}
/* Top logo Animation
 ******************/
.ml11 {
  line-height: 1;
}
.ml11 .text-wrapper {
  position: relative;
  display: inline-block;
  padding-top: 0.1em;
  padding-right: 0.05em;
  padding-bottom: 0.15em;
}
.ml11 .line {
  opacity: 0;
  position: absolute;
  left: 0;
  height: 100%;
  width: 1px;
  background-color: #231815;
  transform-origin: 0 50%;
}
.ml11 .line1 {
  top: 0;
  left: 0;
}
.ml11 .letter {
  display: inline-block;
  line-height: 1rem;
}

/***************************************************
 * Generated by SVG Artista on 6/12/2022, 10:52:04 PM
 * MIT license (https://opensource.org/licenses/MIT)
 * W. https://svgartista.net
 **************************************************/
@-webkit-keyframes animate-svg-stroke-1 {
  0% {
    stroke-dashoffset: 221.5060577392578px;
    stroke-dasharray: 221.5060577392578px;
  }
  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 221.5060577392578px;
  }
}
@keyframes animate-svg-stroke-1 {
  0% {
    stroke-dashoffset: 221.5060577392578px;
    stroke-dasharray: 221.5060577392578px;
  }
  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 221.5060577392578px;
  }
}
@-webkit-keyframes animate-svg-fill-1 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(35, 24, 21);
  }
}
@keyframes animate-svg-fill-1 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(35, 24, 21);
  }
}
.svg-elem-1 {
  -webkit-animation: animate-svg-stroke-1 1s cubic-bezier(0.55, 0.055, 0.675, 0.19) 0s both,
                      animate-svg-fill-1 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 0.8s both;
  animation: animate-svg-stroke-1 1s cubic-bezier(0.55, 0.055, 0.675, 0.19) 0s both,
              animate-svg-fill-1 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 0.8s both;
}
@-webkit-keyframes animate-svg-stroke-2 {
  0% {
    stroke-dashoffset: 173.0576934814453px;
    stroke-dasharray: 173.0576934814453px;
  }
  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 173.0576934814453px;
  }
}
@keyframes animate-svg-stroke-2 {
  0% {
    stroke-dashoffset: 173.0576934814453px;
    stroke-dasharray: 173.0576934814453px;
  }
  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 173.0576934814453px;
  }
}
@-webkit-keyframes animate-svg-fill-2 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(35, 24, 21);
  }
}
@keyframes animate-svg-fill-2 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(35, 24, 21);
  }
}
.svg-elem-2 {
  -webkit-animation: animate-svg-stroke-2 1s cubic-bezier(0.55, 0.055, 0.675, 0.19) 0.12s both,
                      animate-svg-fill-2 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 0.9s both;
  animation: animate-svg-stroke-2 1s cubic-bezier(0.55, 0.055, 0.675, 0.19) 0.12s both,
              animate-svg-fill-2 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 0.9s both;
}
@-webkit-keyframes animate-svg-stroke-3 {
  0% {
    stroke-dashoffset: 200.70364379882812px;
    stroke-dasharray: 200.70364379882812px;
  }
  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 200.70364379882812px;
  }
}
@keyframes animate-svg-stroke-3 {
  0% {
    stroke-dashoffset: 200.70364379882812px;
    stroke-dasharray: 200.70364379882812px;
  }
  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 200.70364379882812px;
  }
}
@-webkit-keyframes animate-svg-fill-3 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(35, 24, 21);
  }
}
@keyframes animate-svg-fill-3 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(35, 24, 21);
  }
}
.svg-elem-3 {
  -webkit-animation: animate-svg-stroke-3 1s cubic-bezier(0.55, 0.055, 0.675, 0.19) 0.24s both,
                      animate-svg-fill-3 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1s both;
  animation: animate-svg-stroke-3 1s cubic-bezier(0.55, 0.055, 0.675, 0.19) 0.24s both,
              animate-svg-fill-3 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1s both;
}
@-webkit-keyframes animate-svg-stroke-4 {
  0% {
    stroke-dashoffset: 96.36083984375px;
    stroke-dasharray: 96.36083984375px;
  }
  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 96.36083984375px;
  }
}
@keyframes animate-svg-stroke-4 {
  0% {
    stroke-dashoffset: 96.36083984375px;
    stroke-dasharray: 96.36083984375px;
  }
  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 96.36083984375px;
  }
}
@-webkit-keyframes animate-svg-fill-4 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(35, 24, 21);
  }
}
@keyframes animate-svg-fill-4 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(35, 24, 21);
  }
}
.svg-elem-4 {
  -webkit-animation: animate-svg-stroke-4 1s cubic-bezier(0.55, 0.055, 0.675, 0.19) 0.36s both,
                      animate-svg-fill-4 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.1s both;
  animation: animate-svg-stroke-4 1s cubic-bezier(0.55, 0.055, 0.675, 0.19) 0.36s both,
              animate-svg-fill-4 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.1s both;
}
@-webkit-keyframes animate-svg-stroke-5 {
  0% {
    stroke-dashoffset: 95.86994934082031px;
    stroke-dasharray: 95.86994934082031px;
  }
  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 95.86994934082031px;
  }
}
@keyframes animate-svg-stroke-5 {
  0% {
    stroke-dashoffset: 95.86994934082031px;
    stroke-dasharray: 95.86994934082031px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 95.86994934082031px;
  }
}
@-webkit-keyframes animate-svg-fill-5 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(35, 24, 21);
  }
}
@keyframes animate-svg-fill-5 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(35, 24, 21);
  }
}
.svg-elem-5 {
  -webkit-animation: animate-svg-stroke-5 1s cubic-bezier(0.55, 0.055, 0.675, 0.19) 0.48s both,
                      animate-svg-fill-5 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.2000000000000002s both;
  animation: animate-svg-stroke-5 1s cubic-bezier(0.55, 0.055, 0.675, 0.19) 0.48s both,
              animate-svg-fill-5 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.2000000000000002s both;
}
@-webkit-keyframes animate-svg-stroke-6 {
  0% {
    stroke-dashoffset: 118.01017761230469px;
    stroke-dasharray: 118.01017761230469px;
  }
  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 118.01017761230469px;
  }
}
@keyframes animate-svg-stroke-6 {
  0% {
    stroke-dashoffset: 118.01017761230469px;
    stroke-dasharray: 118.01017761230469px;
  }
  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 118.01017761230469px;
  }
}
@-webkit-keyframes animate-svg-fill-6 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(35, 24, 21);
  }
}
@keyframes animate-svg-fill-6 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(35, 24, 21);
  }
}
.svg-elem-6 {
  -webkit-animation: animate-svg-stroke-6 1s cubic-bezier(0.55, 0.055, 0.675, 0.19) 0.6s both,
                      animate-svg-fill-6 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.3s both;
  animation: animate-svg-stroke-6 1s cubic-bezier(0.55, 0.055, 0.675, 0.19) 0.6s both,
              animate-svg-fill-6 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.3s both;
}
@-webkit-keyframes animate-svg-stroke-7 {
  0% {
    stroke-dashoffset: 182.49453735351562px;
    stroke-dasharray: 182.49453735351562px;
  }
  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 182.49453735351562px;
  }
}
@keyframes animate-svg-stroke-7 {
  0% {
    stroke-dashoffset: 182.49453735351562px;
    stroke-dasharray: 182.49453735351562px;
  }
  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 182.49453735351562px;
  }
}
@-webkit-keyframes animate-svg-fill-7 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(35, 24, 21);
  }
}
@keyframes animate-svg-fill-7 {
  0% {
    fill: transparent;
  }
  100% {
    fill: rgb(35, 24, 21);
  }
}
.svg-elem-7 {
  -webkit-animation: animate-svg-stroke-7 1s cubic-bezier(0.55, 0.055, 0.675, 0.19) 0.72s both,
                      animate-svg-fill-7 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.4000000000000001s both;
  animation: animate-svg-stroke-7 1s cubic-bezier(0.55, 0.055, 0.675, 0.19) 0.72s both,
              animate-svg-fill-7 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.4000000000000001s both;
}

/* greeting
 ********************************************/
p.greeting-sign {
  text-align: right;
  margin: 50px 10px 0 0;
  max-width: 850px;
}

/* company
 ********************************************/
#company .sec-inner {
  width: 360px;
  margin: 0 auto;
}
#company .sec-inner dl {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 0;
}
#company .sec-inner dt {
  width: 90px;
  display: block;
  color: #002D61;
}
#company .sec-inner dd {
  width: calc(100% - 110px);
  margin-left: 20px;
}

/* estate
 ********************************************/
.estate_sec {
  margin: 50px auto 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.estate_sec h2 {
  font-size: 32px;
  line-height: 30px;
  color: #00428E;
  width: 100%;
  text-align: center;
}
.estate_sec p {
  margin: 0 0 70px;
}
.set-img-box {
  width: 700px;
  margin: 0 auto;
  text-align: center;
}
.set-img-box img {
  width: 100%;
  max-width: 580px;
  margin-bottom: 10px;
}

.hotel-business-sec {
  width: 100%;
  margin: 36px auto 0;
  display: flex;
  gap: 0 10px;
}
.hotel-business-box {
  width: 33%;
  text-align: center;
  border: solid 1px #D9D9D9;
  padding: 10px;
}
.hotel-business-box h2 {
  display: flex;
  flex-direction: column;
}
.hotel-business-box h2 span {
  display: block;
  background-color: #00428E;
  color: #fff;
  width: 38px;
  height: 38px;
  line-height: 38px;
  border-radius: 38px;
  margin: 0 auto;
}
.hotel-business-box h2 span.hotel-h2-txt {
  background-color: #000;
  color: #fff;
  width: 50%;
  margin: 10px auto 30px;
  border-radius: 0;
}
.hotel-business-txt {
  margin-top: 20px;
}
#counseling.sec-box {
  margin: 50px auto;
}
#counseling h2 {
  text-align: center;
  font-size: 32px;
  line-height: 30px;
  color: #00428E;
  margin-bottom: 10px;
}
p.counseling-lead {
  margin-top: 20px;
  font-size: 16px;
  margin-bottom: 50px;
}
p.counseling-lead span {
  font-size: 14px;
}
#counseling h3 {
  width: 50%;
  background-color: #000;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  padding: 6px;
  text-align: center;
  margin: 0 auto 50px;
}
#counseling ol {
  display: flex;
  width: 50%;
  max-width: 500px;
  flex-direction: column;
  margin: 0 auto;
  counter-reset: item;
}
#counseling li {
  display: block;
  text-indent: -1.3em;
  padding-left: 1.3em;
  font-size: 1.6rem;
  margin-bottom: 20px;
}
#counseling li::before {
  counter-increment: item;
  content: counter(item)'.';
  /* 以下は自由に装飾... */
  padding-right: .5em;
  font-weight: bold;
  color: #00428E;
  font-size: 1.6rem;
}
p.hotel_etc_txt {
  text-align: right;
  display: block;
  width: 50%;
  max-width: 500px;
  margin: 0 auto;
}

/* SP Style
 ********************************************/
@media (max-width: 768px) {
  .sec-inner,
  #company .sec-inner {
    width: 94%;
  }
  .sec-inner p {
    text-align: left;
  }
  .sp_none {
    display: none;
  }
  .pc_none {
    display: block;
  }
  #top_header,
  #header {
    gap: 0;
    padding: 0;
    justify-content: flex-end;
    height: auto;
    padding-left: 20px;
  }
  #top_pc_nav {
    width: 100%;
  }
  .menu {
    width: 70%;
    height: 100vh;
    margin-left: auto;
    /* メニューを縦に */
    display: flex;
    flex-direction: column;
    color: #efefef;
    background-color: rgb(0, 66, 142, .9);
    transition: .3s;
    justify-content: center;
    align-items: center;
    position: fixed;
    right: -70%;
  }
  #header .menu {
    top: 0;
  }
  .menu li {
    width: 100%;
    display: block;
    min-height: 60px;
    text-align: center;
  }
  .menu.open {
    right: 0;
  }
  .btn {
    position: fixed;
    top: 32px;
    right: 16px;
    width: 48px;
    height: 48px;
    z-index: 10;
  }
  #header .btn {
    top: 14px;
  }
  .btn-line {
    display: block;
    position: relative;
    width: 100%;
    height: 1px;
    background-color: #000;
    transition: .2s;
  }
  .btn-line::before,
  .btn-line::after {
    content: "";
    position: absolute;
    width: 80%;
    height: 100%;
    background-color: #000;
    transition: .5s;
  }
  .btn-line::before {
    /* 上の線の位置 */
    transform: translateY(-16px);
  }
  .btn-line::after {
    /* 下の線の位置 */
    transform: translateY(16px);
  }
  /***** メニューオープン時 *****/
  .btn-line.open {
    background-color: transparent;  	/* 真ん中の線を透明に */
  }
  .btn-line.open::before ,
  .btn-line.open::after {
    content: "";
    background-color: #333;  /* 上下の線の色を変える */
    transition: .2s;
  }
  .btn-line.open::before {
    transform: rotate(45deg);  /* 上の線を傾ける */
  }
  .btn-line.open::after {
    transform: rotate(-45deg);  /* 下の線を傾ける */
  }

  p.greeting-sign {
    margin: 50px 0 0;
    text-align: right;
  }

  .set-img-box {
    width: 100%;
  }
  .estate_sec p {
    text-align: center;
    margin: 0 0 40px;
  }
  p.sec-img-txt {
    text-align: left;
  }

  .hotel-business-sec {
    flex-direction: column;
    justify-content: center;
  }
  .hotel-business-box {
    width: 80%;
    margin: 0 auto 20px;
    padding: 20px;
  }
  p.hotel-business-txt {
    text-align: left;
  }
  #counseling p {
    text-align: center;
  }
  #counseling h3 {
    width: 80%;
  }
  #counseling ol {
    width: 80%;
  }
  #counseling p.hotel_etc_txt {
    width: 80%;
    text-align: right;
  }
 }