@charset "UTF-8"; /* CSS Document */
/*必須--------------------------*/
.clearfix:after { content: ""; clear: both; display: block; }
/*エラー出たら外す*/
html { visibility: hidden; }
html.wf-active { visibility: visible; }
/*共通設定-----------------------------------------------*/
html { font-size: 18px; }
body { width: 100%; height: auto; margin: 0; padding: 0; box-sizing: border-box; overflow-x: hidden; }
p { font-size: 1.2rem; }
section { margin: 0; padding: 0; }
section { padding: 50px 0; }
.inner { width: 1150px; margin: 0 auto; }
figure { margin: 0; padding: 0; }
figure img { width: 100%; vertical-align: bottom; }
.br-pc { display: block; }
.br-sp { display: none; }
.pc { display: block; }
.sp { display: none; }
a { text-decoration: none; }
a:hover { opacity: 0.5; }
*:hover { transition: all .5s; }
.highlight { text-decoration: underline; text-decoration-thickness: 13px; text-underline-offset: -2px; text-decoration-color: #a8ea3f; }
/*フォント--------------------------*/
body { background-color: #e7f4d4; font-family: "heisei-maru-gothic-std", sans-serif; font-weight: 400; font-style: normal; color: #174c2e; font-size: 1.2rem; }
h1, h2, h3 { font-family: "heisei-maru-gothic-std", sans-serif; font-weight: 800; font-style: normal; margin: 0; padding: 0; }
p { font-family: "heisei-maru-gothic-std", sans-serif; font-weight: 400; font-style: normal; color: #174c2e; letter-spacing: 2px; }
/*各項目タイトル------------------- */
.title { text-align: center; margin: -10px 0 20px; }
.title h2 { color: #206d15; font-size: 2.8rem; margin: 0; padding: 0; letter-spacing: 3px; font-family: "heisei-maru-gothic-std", sans-serif; font-weight: 800; font-style: normal; }
.title h2 span { font-size: 3.4rem; position: relative; top: 2px; }
.leaf-left { width: 90px; height: auto; margin: 0 auto 0px; }
.leaf-left img { width: 100%; height: auto; display: block; }
.title p { text-align: center; line-height: 35px; padding: 0; margin: 0; }
/*----トップ----------------------------------------------------------------*/
#top_view { width: 100%; height: 85vh; max-height: 800px; padding: 0; position: relative; background-color: #fff; }
#top_view .background { margin: 0 auto; position: relative; width: 100%; max-height: 800px; height: 85vh; background-image: url(../img/top-view03.jpg); background-position: left bottom; background-repeat: no-repeat; background-size: cover; }
#top_view .background .top-text { position: absolute; top: 36px; right: 13%; width: 50%; text-align: right; }
#top_view .top-text img { width: auto; max-width: 800px; max-height: 75vh; }
#top_view .wave { position: absolute; bottom: -50px; left: 0; width: 100%; overflow: hidden; line-height: 0; }
#top_view .wave svg { position: relative; display: block; width: 100%; height: auto; }
/*-----ABOUT-----------------------------------------------------------*/
#about { background-color: white; text-align: center; margin: 0 auto; padding: 80px 10px 80px; }
#about .inner p { font-family: "hiragino-kaku-gothic-pron", sans-serif; font-weight: 600; font-style: normal; font-size: 2.1rem; color: #206d15; letter-spacing: 3px; margin: 0; }




.line1 {
  position: relative;
  top: -5px;  /* 1行目を約2mm上へ */
}

.line2 {
  position: relative;
  top: -2px;  /* 2行目を約1mm上へ */
}

.line3 {
  /* 位置変更なし */
}

/*----3つの特徴------------------------------------------------------------*/
#features { position: relative; }
#features .leaf-left { width: 90px; height: auto; margin: 0 auto 0px; position: absolute; top: -130px; left: 50%; transform: translateX(-50%); z-index: 1; }
#features .leaf-left img { width: 100%; height: auto; display: block; }
#features .title { text-align: center; margin: 30px 0 10px; position: relative; }
#features .features-box { display: flex; justify-content: center; padding: 20px 0 0 0; width: 1150px; margin: 0 auto; }
#features .feature { width: 353px;margin: 0; background: white; padding: 0px; text-align: center; }
#features .feature02 { width: 353px;margin: 0 32px; }
#features .feature h3 { background: #206d15; color: white; padding: 1px; font-size: 1.6rem; text-align: center; }
#features .feature h3 .feature-number { font-size: 1.8rem; font-weight: 700; position: relative; top: 1px; }
#features .feature img { width: 100%; height: 200px; object-fit: cover; margin: 0; }
#features .feature p { text-align: justify; line-height: 1.7; padding: 10px 40px 20px; letter-spacing: 0.5px; margin: 0; color: #333; }
/*----3つのポイント----------------------------------------------------------------*/
.point { margin: 0 auto; }
.point img { display: block; margin: 50px auto 53px; width: 93%; }
.hidden-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); white-space: nowrap; }
/*---クロージング-----------------------------------------------------------------*/
.closing-statement { width: 100%; max-width: 1150px; margin: 0 auto; text-align: center; }
.closing-statement img { width: 100%; height: auto; display: block; margin: 0 auto; }
/* ヘッダー右側のホバー効果 */
.hover-right { position: relative; display: inline-block; }
.hover-right::before { content: ''; position: absolute; top: 0; left: 0; width: 25%; height: 100%; cursor: default; z-index: 1; }
.hover-right::after { content: ''; position: absolute; top: 0; right: 0; width: 75%; height: 100%; cursor: pointer; z-index: 1; }
/*=================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================------------- */
@media screen and (max-width: 1050px) {
  /*必須--------------------------*/
  .clearfix:after { content: ""; clear: both; display: block; }
  html { visibility: hidden; }
  html.wf-active { visibility: visible; }
  /*共通設定-----------------------------------------------*/
  html { font-size: 16px; }
  body { width: 100%; height: auto; margin: 0; padding: 0; box-sizing: border-box; }
  p { font-size: 1.2rem; }
  section { margin: 0; padding: 0; }
  section { padding: 50px 0; }
  .inner { width: 95%; margin: 0 auto; }
  figure { margin: 0; padding: 0; }
  figure img { width: 100%; vertical-align: bottom; }
  .br-pc { display: block; }
  .br-sp { display: none; }
  .pc { display: block; }
  .sp { display: none; }
  a { text-decoration: none; }
  a:hover { opacity: 0.5; }
  *:hover { transition: all .5s; }
  .highlight { text-decoration: underline; text-decoration-thickness: 13px; text-underline-offset: -2px; text-decoration-color: #a8ea3f; }
  body { background-color: #e7f4d4; font-family: "heisei-maru-gothic-std", sans-serif; font-weight: 400; font-style: normal; color: #174c2e; font-size: 1.2rem; }
  h1, h2, h3 { font-family: "heisei-maru-gothic-std", sans-serif; font-weight: 800; font-style: normal; margin: 0; padding: 0; }
  p { font-family: "heisei-maru-gothic-std", sans-serif; font-weight: 400; font-style: normal; color: #174c2e; letter-spacing: 2px; }
  /*各項目タイトル------------------- */
  .title { text-align: center; margin: 30px 0 20px; }
  .title h2 { color: #206d15; font-size: 2.8rem; margin: 0; padding: 0; letter-spacing: 3px; font-family: "heisei-maru-gothic-std", sans-serif; font-weight: 800; font-style: normal; }
  .title h2 span { font-size: 3.2rem; position: relative; top: 2px; }
  .leaf-left { width: 90px; height: auto; margin: 0 auto 0px; }
  .leaf-left img { width: 100%; height: auto; display: block; }
  .title p { text-align: center; line-height: 35px; padding: 0; margin: 0; }
  /*----トップ----------------------------------------------------------------*/
  #top_view { width: 100%; height: 100vh; min-height: 600px; padding: 0; position: relative; z-index: -999; }
  #top_view .background { position: relative; width: 100%; height: calc(100vh); min-height: 600px; background-image: url(../img/top-view-sp2.jpg); background-position: left bottom; background-repeat: no-repeat; background-size: cover; }
  #top_view .background .top-text { position: absolute; top: 50px; right: 10%; width: 80%; text-align: right; }
  #top_view .top-text img { width: auto; max-width: 90%; max-height: 60vh; }
  /*-----ABOUT-----------------------------------------------------------*/
  #about { background-color: white; text-align: center; margin: 0 auto; padding: 35px 10px 35px; }
  #about .inner p { font-family: "hiragino-kaku-gothic-pron", sans-serif; font-weight: 600; font-style: normal; font-size: 1.6rem; color: #206d15; letter-spacing: 3px; margin: 0; }
  /*----3つの特徴------------------------------------------------------------*/
  #features { position: relative; }
  #features .leaf-left { width: 60px; height: auto; margin: 0 auto 0px; position: absolute; top: -110px; left: 50%; transform: translateX(-50%); z-index: 1; }
  #features .leaf-left img { width: 100%; height: auto; display: block; }
  #features .title { text-align: center; margin: 30px 0 10px; position: relative; }
  #features .features-box { width: 95%; display: flex; justify-content: space-between; gap: 10px; padding: 30px 0 0 0; }
  #features .feature { margin: 0px; flex: 1; background: white; padding: 0px; text-align: center; }
  #features .feature h3 { background: #206d15; color: white; padding: 5px; font-size: 1.2rem; text-align: center; }
  #features .feature h3 .feature-number { font-size: 1.4rem; font-weight: 700; position: relative; top: 1px; }
  #features .feature img { width: 100%; height: auto; object-fit: cover; margin: 0; }
  #features .feature p { text-align: justify; line-height: 1.7; font-size: 1.1rem; padding: 10px 30px 20px; letter-spacing: 0; margin: 0; color: #333; }
  /*----3つのポイント----------------------------------------------------------------*/
  .point img { display: block; margin: 50px auto; width: 90%; }
  .hidden-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); white-space: nowrap; }
  /*---クロージング-----------------------------------------------------------------*/
  .closing-statement { width: 95%; margin: 0 auto; }
  .closing-statement img { width: 100%; }
}

@media screen and (max-width: 700px) {
  /*必須--------------------------*/
  .clearfix:after { content: ""; clear: both; display: block; }
  html { visibility: hidden; }
  html.wf-active { visibility: visible; }
  /*共通設定-----------------------------------------------*/
  html { font-size: 16px; }
  body { width: 100%; height: auto; margin: 0; padding: 0; box-sizing: border-box; }
  p { font-size: 1.1rem; }
  section { margin: 0; padding: 0; }
  section { padding: 30px 0; }
  .inner { width: 93%; margin: 0 auto; }
  figure { margin: 0; padding: 0; }
  figure img { width: 100%; vertical-align: bottom; }
  .br-pc { display: none; }
  .br-sp { display: block; }
  .pc { display: none; }
  .sp { display: block; }
  a { text-decoration: none; }
  a:hover { opacity: 0.5; }
  *:hover { transition: all .5s; }
  .highlight { text-decoration: underline; text-decoration-thickness: 8px; text-underline-offset: -2px; text-decoration-color: #a8ea3f; }
  /*フォント--------------------------*/
  body { font-family: "heisei-maru-gothic-std", sans-serif; font-weight: 400; font-style: normal; font-size: 1.2rem; }
  h1, h2, h3 { font-family: "heisei-maru-gothic-std", sans-serif; font-weight: 800; font-style: normal; margin: 0; padding: 0; line-height: 45px; }
  p { font-family: "heisei-maru-gothic-std", sans-serif; font-weight: 400; font-style: normal; letter-spacing: 2px; }
  /*各項目タイトル------------------- */
  .title { text-align: center; margin: 10px 0 20px; }
  .title h2 { font-size: 2.0rem; margin: 0 0 20px 0; padding: 0; letter-spacing: 3px; font-family: "heisei-maru-gothic-std", sans-serif; font-weight: 800; font-style: normal; }
  .title h2 span { font-size: 2.2rem; position: relative; top: 2px; left: 3px; }
  .leaf-left { width: 40px; height: auto; margin: 0 auto 0px; }
  .leaf-left img { width: 100%; height: auto; display: block; }
  .title p { margin: 0 auto; text-align: left; font-size: 1.1rem; line-height: 1.8; text-align: center; }
  /*----トップ----------------------------------------------------------------*/
  #top_view { width: 100%; height: 70vh; min-height: 500px; padding: 0; position: relative; z-index: -999; }
  #top_view .background { position: relative; width: 100%; height: calc(70vh); min-height: 500px; background-image: url(../img/top-view-sp7.jpg); background-position: left bottom; background-repeat: no-repeat; background-size: cover; }
  #top_view .background .top-text { position: absolute; top: 30px; right: 0%; width: 100%; text-align: right; }
  #top_view .top-text img { width: auto; max-width: 100%; max-height: 70vh; }
  /*-----ABOUT-----------------------------------------------------------*/
  #about { background-color: white; text-align: left; text-align: justify; margin: 0 auto; padding: 45px 20px; }
  #about .inner p { font-family: "hiragino-kaku-gothic-pron", sans-serif; font-weight: 600; font-style: normal; font-size: 1.3rem; margin: 0 auto; letter-spacing: 1px; }
  /*----3つの特徴------------------------------------------------------------*/
  #features { position: relative; padding-bottom: 60px; }
  #features .inner { width: 93%; }
  #features .leaf-left { width: 50px; height: auto; margin: 0 auto 0px; position: absolute; top: -70px; left: 50%; transform: translateX(-50%); z-index: 1; }
  #features .leaf-left img { width: 100%; height: auto; display: block; }
  #features .title { text-align: center; margin: 10px 0 10px; position: relative; }

  #features .features-box { width: 100%; display: flex; flex-direction: column; gap: 0px; padding: 0px; }
  #features .feature { flex: none; padding: 0px 0 20px 0; margin: 0 auto 20px; text-align: center; width: 95%; }
  #features .feature h3 { padding: 3px; font-size: 1.4rem; text-align: center; }
  #features .feature h3 .feature-number { font-size: 1.6rem; font-weight: 700; position: relative; top: 1px; }
  #features .feature img { width: 100%; height: 180px; object-fit: cover; margin: 0; }
  #features .feature p { text-align: justify; line-height: 1.8; font-size: 1.1rem; padding: 10px 15px; }
  /*----3つのポイント----------------------------------------------------------------*/
  .point img { display: block; margin: 10px auto 30px; width: 95%; }
  .hidden-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); white-space: nowrap; }
  /*---クロージング-----------------------------------------------------------------*/
  .closing-statement { width: 100%; margin: 0 auto; }
  .closing-statement img { width: 100%; }
}