@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Zen+Maru+Gothic:wght@300;400;500;700;900&display=swap");
@-webkit-keyframes opacity {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

@keyframes opacity {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

html {
  scroll-behavior: smooth; }

body {
  font-family: "Zen Maru Gothic", sans-serif;
  font-weight: 500;
  line-height: 1.6;
  background: #fff;
  word-wrap: break-word;
  word-break: break-all; }
  body img {
    max-width: 100%; }
  body iframe {
    max-width: 100%; }
  body a {
    color: #666;
    text-decoration: none;
    transition: 0.5s; }
    body a:hover {
      color: #ec7459; }
  @media screen and (min-width: 768px) {
    body .sp-only {
      display: none !important; } }
  @media screen and (max-width: 767px) {
    body .pc-only {
      display: none !important; } }

#teaser-wrapper {
  background: #fff url(../images/teaser/teaser-bg.jpg) repeat center center; }

.teaser-header {
  padding: 40px 0;
  text-align: center;
  background-image: url(../images/teaser/teaser-bg01.png), url(../images/teaser/teaser-bg02.png);
  background-repeat: no-repeat;
  background-position: -10% bottom, 110% top; }
  .teaser-header .header-content {
    width: 500px;
    max-width: 90%;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    align-items: flex-end; }
    .teaser-header .header-content .header-img {
      text-align: center; }
      .teaser-header .header-content .header-img img {
        display: block;
        margin: 0 auto; }
    .teaser-header .header-content .header-copy01 {
      padding-bottom: 40px;
      opacity: 0;
      -webkit-animation: opacity 1s 0.5s forwards;
      animation: opacity 1s 0.5s forwards; }
    .teaser-header .header-content .header-copy02 {
      padding-bottom: 5px;
      opacity: 0;
      opacity: 0;
      -webkit-animation: opacity 1s 1.5s forwards;
      animation: opacity 1s 1.5s forwards; }
  .teaser-header .header-ttl {
    text-align: center;
    margin: 20px auto;
    max-width: 75%; }
  @media screen and (max-width: 1200px) {
    .teaser-header {
      background-size: 30%, 30%; } }
  @media screen and (max-width: 767px) {
    .teaser-header {
      background-size: 30%, 30%; }
      .teaser-header .header-content {
        justify-content: space-between; }
        .teaser-header .header-content .header-copy01 {
          width: 7%; }
        .teaser-header .header-content .header-copy02 {
          width: 7%; }
        .teaser-header .header-content .header-img {
          width: 80%; } }
  @media screen and (min-width: 768px) {
    .teaser-header .header-content .header-copy01 {
      padding: 0 0 40px 20px; }
    .teaser-header .header-content .header-copy02 {
      padding: 0 20px 5px 0; } }

.sec-header {
  width: 700px;
  max-width: 96%;
  margin: 0 auto; }

.sec-content {
  width: 700px;
  max-width: 90%;
  margin: 0 auto; }

.teaser-sec01 {
  margin: 30px auto;
  text-align: center; }

.teaser-sec02 {
  margin: 30px auto;
  text-align: center; }
  .teaser-sec02 .teaser-btns .btn-item a {
    display: inline-block;
    background: url(../images/teaser/teaser-btn.svg) no-repeat center center;
    background-size: 100% 100%;
    padding: 10px 75px;
    margin: 5px;
    color: #fff;
    font-size: 1.1rem;
    font-weight: bold;
    text-decoration: none;
    opacity: 0.9;
    transition: 0.2s; }
    .teaser-sec02 .teaser-btns .btn-item a:hover {
      opacity: 1; }
  @media screen and (min-width: 768px) {
    .teaser-sec02 .teaser-btns {
      display: flex;
      justify-content: center;
      align-items: flex-start; } }

.teaser-sec03 {
  margin: 40px auto;
  text-align: center;
  position: relative; }
  .teaser-sec03:before {
    content: '';
    display: block;
    background: url(../images/teaser/teaser-bg01.png) no-repeat right bottom;
    background-size: contain;
    width: 20%;
    height: 300px;
    position: absolute;
    left: 0;
    bottom: -60px;
    z-index: 3; }
  .teaser-sec03:after {
    content: '';
    display: block;
    background: url(../images/teaser/teaser-bg02.png) no-repeat left top;
    background-size: contain;
    width: 20%;
    height: 300px;
    position: absolute;
    right: 0;
    top: -60px;
    z-index: 3; }
  .teaser-sec03 .teaser-photo {
    background: #fff;
    position: relative;
    z-index: 1; }
    .teaser-sec03 .teaser-photo:before {
      content: '';
      display: block;
      background: url(../images/teaser/teaser-photo-bg01.png) no-repeat top center;
      width: 100%;
      height: 40px;
      position: absolute;
      top: -39px;
      left: 0;
      right: 0;
      margin: 0 auto;
      z-index: 0; }
    .teaser-sec03 .teaser-photo:after {
      content: '';
      display: block;
      background: url(../images/teaser/teaser-photo-bg02.png) no-repeat bottom center;
      width: 100%;
      height: 40px;
      position: absolute;
      bottom: -39px;
      left: 0;
      right: 0;
      margin: 0 auto;
      z-index: 0; }
  @media screen and (min-width: 1500px) {
    .teaser-sec03 .teaser-photo:before {
      background-size: 100%; }
    .teaser-sec03 .teaser-photo:after {
      background-size: 100%; } }
  @media screen and (max-width: 767px) {
    .teaser-sec03:before {
      width: 100px;
      height: 100px;
      bottom: -50px; }
    .teaser-sec03:after {
      width: 100px;
      height: 100px;
      top: -30px; } }

.teaser-sec04 {
  margin: 50px auto;
  text-align: center; }
  .teaser-sec04 .about-map {
    margin: 20px auto; }
  .teaser-sec04 .about-comment {
    margin: 40px auto;
    background: #fff;
    border-radius: 20px;
    position: relative;
    padding: 20px; }
    .teaser-sec04 .about-comment .comment-img {
      position: relative;
      top: -40px;
      margin: 0 auto; }
    .teaser-sec04 .about-comment .comment-ttl {
      text-align: center;
      color: #ec7459;
      font-weight: 700;
      margin: 0 auto 20px auto; }
    .teaser-sec04 .about-comment .comment-txt {
      text-align: left; }
    .teaser-sec04 .about-comment .comment-name {
      text-align: right;
      font-size: 1.3rem; }
      .teaser-sec04 .about-comment .comment-name .title {
        font-size: 0.9rem;
        display: block; }
  @media screen and (min-width: 768px) {
    .teaser-sec04 .about-comment {
      padding: 40px; }
      .teaser-sec04 .about-comment .comment-img {
        margin: 0 auto;
        position: absolute;
        top: -20px;
        left: -10px; }
      .teaser-sec04 .about-comment .comment-ttl {
        margin: 0 auto 40px auto; }
      .teaser-sec04 .about-comment .comment-txt {
        padding-left: 100px; }
      .teaser-sec04 .about-comment .comment-name {
        text-align: right; }
        .teaser-sec04 .about-comment .comment-name .title {
          padding-right: 20px;
          display: inline-block; } }

.teaser-sec05 {
  margin: 50px auto;
  text-align: center;
  background: #fff;
  position: relative; }
  .teaser-sec05:before {
    content: '';
    display: block;
    background: url(../images/teaser/teaser-bg01.png) no-repeat right bottom;
    background-size: contain;
    width: 20%;
    height: 300px;
    position: absolute;
    left: 0;
    bottom: -60px;
    z-index: 3; }
  .teaser-sec05:after {
    content: '';
    display: block;
    background: url(../images/teaser/teaser-bg02.png) no-repeat left top;
    background-size: contain;
    width: 20%;
    height: 300px;
    position: absolute;
    right: 0;
    top: -60px;
    z-index: 3; }
  .teaser-sec05 .sec-header {
    padding: 30px 0; }
  .teaser-sec05 .sec-content {
    padding: 0 0 30px 0; }
  @media screen and (max-width: 767px) {
    .teaser-sec05:before {
      width: 100px;
      height: 100px;
      bottom: -50px; }
    .teaser-sec05:after {
      width: 100px;
      height: 100px;
      top: -30px; } }

.teaser-list {
  text-align: left;
  margin: 20px auto; }
  .teaser-list .list-item {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    border-bottom: 1px dotted #000; }
    .teaser-list .list-item .list-ttl {
      padding: 10px 0;
      min-width: 5rem;
      color: #666; }
    .teaser-list .list-item .list-txt {
      padding: 10px 0; }

.teaser-sec06 {
  margin: 50px auto;
  text-align: center;
  position: relative; }
  .teaser-sec06 .sec-header {
    padding: 30px 0; }
  .teaser-sec06 .sec-content {
    padding: 0 0 30px 0; }
  .teaser-sec06 .contact-tel {
    font-size: 40px;
    margin: 0 auto 20px auto; }
    .teaser-sec06 .contact-tel a {
      color: #000; }
      .teaser-sec06 .contact-tel a:hover {
        color: #ec7459; }
    .teaser-sec06 .contact-tel i {
      padding-right: 20px; }

.wpcf7 {
  width: 100%;
  max-width: 100%; }
  .wpcf7 .form-box {
    margin: 0.5rem 0; }
  .wpcf7 .form-box-title {
    padding: 0.3rem;
    box-sizing: border-box;
    font-size: 1.1rem;
    margin: 0 auto;
    text-align: left; }
  .wpcf7 .must {
    white-space: nowrap;
    background: #ff0000;
    font-size: 0.8rem;
    padding: 0.2rem 0.5rem;
    color: #fff;
    border-radius: 0.2rem;
    margin-left: 0.5rem; }
  .wpcf7 .form-box-content {
    padding: 0.5rem;
    box-sizing: border-box; }
    .wpcf7 .form-box-content.postalcode {
      display: flex;
      align-items: center; }
      .wpcf7 .form-box-content.postalcode #your-postalcode1 {
        display: inline-block;
        margin-right: 0.5rem;
        width: 4rem; }
      .wpcf7 .form-box-content.postalcode #your-postalcode2 {
        display: inline-block;
        margin-left: 0.5rem;
        width: 6rem; }
    .wpcf7 .form-box-content .wpcf7-checkbox {
      height: auto;
      display: inline-block;
      line-height: 1.1em;
      border: none; }
      .wpcf7 .form-box-content .wpcf7-checkbox label {
        padding: 0.6rem;
        margin: 0 auto; }
      .wpcf7 .form-box-content .wpcf7-checkbox input {
        margin-right: 0.2rem; }
      .wpcf7 .form-box-content .wpcf7-checkbox span.wpcf7-list-menu {
        margin: 0 auto;
        display: inline-block;
        font-size: 1.05rem; }
      .wpcf7 .form-box-content .wpcf7-checkbox .wpcf7-list-item {
        margin: 0; }
  .wpcf7 .form-box-submit {
    margin: 1rem auto; }
    .wpcf7 .form-box-submit input {
      font-size: 1.3rem;
      font-weight: 700;
      padding: 1rem 0;
      height: auto;
      background: #ef8770;
      color: #fff;
      border: none; }
      .wpcf7 .form-box-submit input:hover {
        background: #ec7459; }
  @media screen and (min-width: 768px) {
    .wpcf7 .form-box {
      display: flex;
      justify-content: flex-start; }
    .wpcf7 .form-box-title {
      width: 30%; }
    .wpcf7 .form-box-content {
      width: 70%; } }

.teaser-footer {
  margin: 50px auto 0 auto;
  text-align: center; }
  .teaser-footer .footer-content {
    padding: 20px 0;
    max-width: 90%;
    margin: 0 auto; }
    .teaser-footer .footer-content .company-address {
      margin: 10px auto; }
  .teaser-footer .greenmedical {
    background: #fff;
    padding: 20px 0; }
    .teaser-footer .greenmedical a {
      display: block;
      max-width: 80%;
      margin: 0 auto; }