@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Work+Sans:wght@100;300;400;500;600&display=swap");
html {
  font-size: 62.5%;
  letter-spacing: .075em
}
/* !importantで強制上書き */
.text-animation-hover:hover .letter-b {
  color: #77f792 !important;
  transform: translateY(0%) !important;
}
.text-animation-hover:hover .letter-t {
  color: #77f792 !important;
  transform: translateY(-100%) !important;
}
.letter.last {
  padding-left: .5em
}
.p-kv {
  position: fixed;
  width: 100vw;
  height: 100vh;
  top: 0;
  left: 0;
  background-position: 50%;
  background-repeat: repeat-y;
  background-size: 100% auto;
  overflow: hidden
}
.is-inertia-none .p-kv {
  position: absolute
}
.p-kv .copy {
  display: flex;
  justify-content: center;
  z-index: 3;
  position: relative
}
.android .p-kv .copy h1 {
  font-size: 2.7rem
}
.p-kv .layer1 {
  opacity: 0;
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  overflow: hidden;
  border-radius: 100%;
  margin: auto
}
.p-kv .layer1 .circle {
  background-image: url(../img/top/kv-bg.jpg);
  background-size: cover;
  left: 0
}
.p-kv .layer1 .circle, .p-kv .layer1 .circle-grade {
  width: 100%;
  height: 100%;
  border-radius: 100%;
  position: absolute;
  top: 0
}
.p-kv .layer1 .circle-grade {
  background-image: url(../img/top/b-kv_img_maru_grade.png);
  background-size: 101%;
  background-position: 50%;
  z-index: 3
}
.p-kv .layer1 .motif {
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  display: flex;
  align-items: center;
  justify-content: center
}
.p-kv .layer1 .motif img {
  width: 849px
}
.p-kv .layer1_inner {
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: relative
}
.p-kv .layer1 .full-map {
  height: 100%;
  z-index: 1;
  opacity: 0;
  margin: auto;
  transform-origin: 55%
}
.full-map_3 {
  position: absolute;
  width: 130vh;
  max-width: 130vh;
  top: 118%;
  left: 51%;
  opacity: 0;
  transform: translate(-50%, -50%) scale(1.2);
  transition: opacity 1s ease-in-out;
}
.full-map_3 img {
  display: block;
  width: 100%;
  height: auto;
}
/* 回転アニメーションを追加 */
.full-map_3.show {
  opacity: 1;
  /*
  transform: translate(-50%, -50%) scale(1.2);
  animation: rotateSlowly 20s linear infinite; 
*/
}
@keyframes rotateSlowly {
  from {
    transform: translate(-50%, -50%) scale(1.2) rotate(0deg);
  }
  to {
    transform: translate(-50%, -50%) scale(1.2) rotate(360deg);
  }
}
.p-kv .layer1 .full-map > * > img {
  width: 90%;
  height: auto
}
.p-kv .layer1 .full-map .point {
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 1;
  margin: auto;
  left: 0;
  top: 0;
  opacity: 0
}
.p-kv .layer1 .full-map .point > img {
  width: auto;
  height: 100%
}
.p-kv .layer1 .map {
  opacity: 0;
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  transform-origin: 50%
}
.p-kv .layer1 .map > img {
  width: 100%;
  height: auto
}
.p-kv .layer1 .map .point {
  opacity: 0;
  position: absolute;
  z-index: 1;
  margin: auto;
  display: flex;
  align-items: center;
  justify-content: center
}
.p-kv .layer1 .map .point img {
  width: 100%;
  height: auto
}
.p-multiColumn .image {
  cursor: pointer;
  position: relative;
  width: 100%
}
.p-multiColumn .image-box {
  position: relative;
  display: block
}
.p-multiColumn .image-content {
  overflow: hidden
}
.p-multiColumn .image-content img {
  width: 102%;
  display: block
}
.p-scroll {
  z-index: 2
}
.p-scroll.-typeKv {
  color: #fff
}
.p-scroll.-typeNormal {
  cursor: pointer;
}
.p-scroll.-typeNormal svg {
  width: 22px;
  height: auto;
  padding-bottom: 5px;
  text-align: center;
}
.p-scroll.-scrollDown {
  cursor: pointer;
  transition-property: all;
  transition-duration: .6s;
  transition-timing-function: cubic-bezier(.23, 1, .32, 1);
  pointer-events: all
}
.p-scroll.-scrollDown:hover {
  opacity: .4 !important
}
.p-scroll.js-pagetopPc {
  cursor: pointer;
  pointer-events: all;
  transform: translate(0, -80px) !important;
  opacity: 0;
}
.p-top-banner {
  position: relative
}
.p-top-banner .content, .p-top-banner .inner {
  display: flex;
  align-items: center
}
.p-top-banner .inner {
  width: 100%;
  position: relative;
  background-color: #f7f8f9
}
.p-top-banner .text {
  font-weight: 600
}
html.android .p-top-banner .text {
  font-weight: 700
}
.p-top-banner .arrow {
  position: absolute
}
.p-top-banner .image {
  position: relative;
  overflow: hidden;
  flex-shrink: 0
}
.p-top-banner .image img {
  font-family: "object-fit:cover";
  object-fit: cover;
  display: block
}
.p-top-banner .inner-text {
  color: #fff;
  font-family: Work Sans, YuGothic, 游ゴシック, Hiragino Kaku Gothic ProN, Hiragino Sans, Meiryo, sans-serif
}
.p-top-banner .inner-logo, .p-top-banner .inner-text {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%)
}
.p-top-banner .inner-logo {
  width: 41%
}
.p-top-banner .inner-logo > img {
  width: 100% !important;
  height: 100% !important;
  font-family: "object-fit:cover";
  object-fit: cover;
  background-size: auto !important
}
.p-solution .case-link {
  text-align: right
}
.p-top-diary {
  position: relative;
  background: #fff
}
.p-top-diary .item {
  border-bottom: 1px solid #c0c3ca
}
.p-top-diary .item:nth-of-type(3n) {
  border-right: none
}
.p-top-diary .box {
  display: block
}
.p-top-diary .box-content {
  position: relative
}
.p-top-diary .box .circle {
  position: absolute;
  top: 0;
  right: 0
}
.p-top-diary .box .circle .circle-inner {
  width: 100%;
  height: 100%;
  position: relative
}
.p-top-diary .box .circle .circle-inner .hidden-black {
  position: absolute;
  background-color: #e8ebf2;
  z-index: 10
}
.p-top-diary .box .circle svg {
  width: 100%;
  height: 100%
}
.p-top-diary .box .time {
  font-weight: 600;
  font-weight: 300
}
.p-top-diary .box .category, .p-top-diary .box .time {
  font-family: Work Sans, YuGothic, 游ゴシック, Hiragino Kaku Gothic ProN, Hiragino Sans, Meiryo, sans-serif
}
.p-top-diary .box .category {
  font-weight: 600;
  font-weight: 400;
}
.p-top-diary .box .text {
  font-weight: 600;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden
}
html.android .p-top-diary .box .text {
  font-weight: 700
}
.p-top-live .box {
  cursor: pointer;
  position: relative
}
.p-top-live .inner {
  z-index: 0;
  position: relative;
  overflow: hidden;
  width: 100%
}
.p-top-live .titleJp {
  font-weight: 600
}
.live-img {
  max-width: 492px;
  height: auto
}
.p-top-live .supple {
  position: relative
}
.p-top-live .supple:before {
  content: "※";
  position: absolute;
  font-weight: 600
}
.p-top-live .text {
  ;
  font-weight: 600
}
html.android .p-top-live .text {
  font-weight: 700
}
.p-top-live .image img {
  width: 100%
}
.p-top-mission {
  overflow: hidden;
  position: relative;
  background: #FAF9F7
}
.p-top-mission .back_text {
  font-family: Work Sans, YuGothic, 游ゴシック, Hiragino Kaku Gothic ProN, Hiragino Sans, Meiryo, sans-serif;
  font-weight: 600;
  letter-spacing: .03em;
  white-space: nowrap;
  position: absolute;
  color: #f6f8fb;
  font-weight: 100
}
.p-top-mission .inner {
  position: relative;
  margin: auto
}
.p-top-mission .illust {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  width: 100%;
  height: 100%;
  z-index: 1
}
.p-top-mission .illust .illust_img {
  position: absolute
}
.p-top-mission .illust .-illust_img01 {
  z-index: 3
}
.p-top-mission .illust .-illust_img02 {
  z-index: 2
}
.p-top-mission .illust .-illust_img03 {
  z-index: 1
}
.p-top-mission .illust .-illust_img04 {
  z-index: 0
}
.p-top-mission .bg {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  z-index: 0
}
.p-top-mission .bg img {
  width: 100%;
  height: 100%
}
.p-top-mission .content {
  position: relative
}
.p-top-mission .content-title {
  font-weight: 600
}
.p-top-mission .content-text {
  font-weight: 400
}
.p-index {
/*  background: #faf9f7;*/
  background-position: 50%;
  background-repeat: repeat-y;
  background-size: 100vw
}
.t-scroll-body {
  padding-top: 100vh
}
.p-scroll.js-pageDown {
  display: none !important
}
.accordion {
  max-width: 49%;
}
.accordion-item {
  margin-bottom: 40px;
  border-bottom: 1px solid #DCDCDC;
  overflow: hidden;
}
.accordion-button {
  width: 100%;
  padding: 0 60px 40px 0;
  cursor: pointer;
  font-size: 2.3rem;
  text-align: left;
  position: relative;
}
.accordion-button::after {
  content: '';
  position: absolute;
  top: 0;
  right: 20px;
  width: 34px;
  height: 34px;
  background-color: #327D64; /* 緑色 */
  border-radius: 50%; /* 丸形 */
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  font-size: 16px;
  transition: transform 0.3s;
}
.accordion-button::before {
  content: '＋';
  position: absolute;
  right: 20px;
  width: 34px;
  height: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  font-size: 16px;
  font-weight: 600;
  z-index: 1;
}
.accordion-button.active::before {
  content: 'ー';
}
.accordion-content {
  height: 0;
  opacity: 0;
  overflow: hidden;
  transition: height 0.4s ease, opacity 0.4s ease;
  background: #F3F1ED;
  border-radius: 10px;
  margin-bottom: 0;
}
.accordion-content.show {
  opacity: 1;
  margin-bottom: 40px;
}
.accordion-inner {
  padding: 40px;
  font-size: 1.7rem;
  line-height: 2em;
}
.accordion-content p {
  margin: 0 0 10px 0;
}
.accordion-content p:last-child {
  margin-bottom: 0;
}
#h-logo {
  cursor: pointer;
  position: fixed;
  top: 0;
  left: 0;
  padding: 2vw 2vw 0;
  max-width: 280px;
  height: auto
}
.p-kv {
  background-image: url("../img/top/kv-bg.jpg")
}
.p-kv .copy {
  margin-top: 7.1875vw;
  margin-left: -1.25vw
}
.p-kv .copy h1 {
  letter-spacing: .2em;
  line-height: 1.86842;
  font-size: 5rem;
  color: #fff;
}
.p-kv .copyEn {
  font-weight: 600;
  line-height: 1.72727;
  letter-spacing: .05em;
  font-weight: 400;
  font-size: .6875vw;
  color: #fff;
  top: 38.33333vh;
  left: 75vw;
  z-index: 1
}
.p-kv .backText, .p-kv .copyEn {
  font-family: Work Sans, YuGothic, 游ゴシック, Hiragino Kaku Gothic ProN, Hiragino Sans, Meiryo, sans-serif;
  position: absolute
}
.p-kv .backText {
  font-weight: 600;
  letter-spacing: .03em;
  white-space: nowrap;
  font-weight: 100;
  color: #093a7b;
  font-size: 18.75vw;
  left: 0;
  bottom: 9.375vw
}
.p-kv .layer1 {
  width: 88.88889vh;
  height: 88.88889vh
}
.p-kv .layer1 .full-map {
  width: 66.66667vh;
  margin-top: -8%
}
.p-kv .layer1 .map .point {
  width: 12.44444vh;
  right: 31.88889vh;
  bottom: 33.44444vh
}
.p-multiColumn {
  display: flex;
  width: 75vw;
  max-width: 1600px;
  margin: 15vw auto 0
}
.p-multiColumn .text {
  letter-spacing: .08em;
  font-size: 1vw;
  margin-top: 4.375vw
}
.p-multiColumn .image {
  margin-top: 2.5vw;
  padding-bottom: 2.5vw
}
.p-scroll {
  cursor: pointer;
  position: fixed;
  right: 3.125vw;
  padding-right: .625vw;
  margin-right: -.625vw
}
.p-scroll, html.ie .p-scroll {
  bottom: 2.5vw
}
.p-top-banner {
  width: 75vw;
  max-width: 1600px;
  margin: 15.625vw auto 0;
  padding-bottom: 15.625vw
}
.p-top-banner .list {
  display: flex
}
.p-top-banner .item {
  width: 50%
}
.p-top-banner .inner {
  height: 16.25vw
}
.p-top-banner .text {
  line-height: 2.125;
  letter-spacing: .1em;
  font-size: 1vw;
  margin-left: 1.75vw
}
.p-top-banner .arrow {
  right: 1.875vw;
  bottom: 1.5625vw
}
.p-top-banner .arrow svg {
  width: 1.625vw;
  height: .9375vw
}
.p-top-banner .image img {
  width: 16.25vw;
  height: 16.25vw
}
.p-top-banner .inner-text {
  font-size: 1.8125vw;
  line-height: 1.28
}
.p-solution {
  position: relative;
  width: 100%;
  margin-top: 200px;
  padding: 30px 0 100px;
  background: #ECF3F2;
}
.p-solution::before {
  position: absolute;
  top: -100px;
  content: "";
  left: -5%;
  right: 0;
  width: 110%;
  height: 100px;
  background: url("../img/top/bg-solution.webp")no-repeat top center;
  background-size: cover;
}
.p-solution .inner {
  background: url("../img/top/bg-solution2.png")no-repeat top center;
  background-size: 100%;
  padding-top: 50px
}
.p-solution .inner .text {
  font-size: 1.7rem;
  line-height: 1.5;
  padding: 30px 0 110px;
  text-align: center
}
.solution-title {
  color: #000;
  text-align: center;
  font-size: 3.2rem;
  font-weight: 600;
  padding: 50px 0 0
}
.en-ttl {
  font-family: "Montserrat", sans-serif;
  font-size: 4rem;
  margin-bottom: 40px;
  position: relative;
  text-align: center
}
.en-ttl::after {
  content: "";
  display: block;
  width: 100px;
  height: 5px;
  background: url('../img/top/bg-m.svg') no-repeat center/contain;
  margin: 20px auto 0;
}
.p-solution .point {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin-bottom: 30px
}
.p-solution .point li {
  min-width: 148px;
  font-size: 2.3rem;
  background: #327D64;
  border-radius: 100px;
  padding: 13px;
  color: #fff;
  text-align: center
}
.solution-ict-title {
  text-align: center;
  font-size: 2.3rem;
  color: #327D64;
  font-weight: 600;
  padding-bottom: 15px
}
.solution-ict-text {
  text-align: center;
  font-size: 1.7rem
}
.ict-contents {
  font-family: 'Arial', sans-serif;
  line-height: 1.6;
  max-width: 960px;
  margin: 0 auto;
  padding: 30px 20px;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap
}
.ict-contents .wrap {
  max-width: 46%;
  position: relative;
  margin-bottom: 60px
}
.ict-contents .wrap.symbiosis {
  margin-top: 264px;
  z-index: 10
}
.ict-contents .inner {
  border-left: 1px solid #327D64;
  border-right: 1px solid #327D64;
  padding: 20px 45px;
  background: #fff;
  z-index: 1;
  overflow: visible;
}
img.triangle {
  width: 100%;
  height: auto
}
.ict-contents .inner p {
  font-size: 1.5rem;
  line-height: 1.7
}
.ict-contents .kyosei .inner {
  padding-bottom: 0
}
.ict-contents .kyosei .inner p {
  padding-bottom: 20px
}
.ict-contents .wrap.nature {
  margin-top: 138px;
}
.ict-contents .wrap.nature p {
  padding-top: 20px
}
.title-wrap {
  position: absolute;
  top: 43px;
  left: 0;
  right: 0;
}
.ict-contents h3 {
  font-size: 3.2rem;
  text-align: center;
  position: relative
}
.ict-contents h3::after {
  content: "";
  display: block;
  width: 100px;
  height: 5px;
  background: url(../img/top/bg-m.svg) no-repeat center / contain;
  margin: 5px auto 0;
}
.ict-contents h4 {
  font-size: 2.1rem;
  font-weight: 600;
  color: #327D64;
  margin: 15px auto;
  text-align: center
}
.ict-contents .inner img {
  width: 100%;
  height: auto
}
img.triangle.top {
  width: 100%;
  height: auto;
  vertical-align: bottom;
  margin-bottom: -1px;
}
img.triangle.bottom {
  width: 100%;
  height: auto;
  vertical-align: bottom;
  margin-top: -1px;
}
.ict-contents .quality-list {
  padding: 20px 0 0 20px;
  font-size: 1.5rem;
  list-style: disc;
}
.ict-contents .inner img.image-container {
  position: absolute;
  bottom: 40px;
  left: 0;
  right: 0;
  width: 160px;
  height: auto;
  margin: 0 auto
}
.image-container2 {
  position: absolute;
  top: -265px;
  left: 0;
  right: 0;
  width: 280px;
  height: auto;
  margin: 0 auto;
  z-index: -1
}
.image-container3 {
  position: absolute;
  top: -33px;
  left: 0;
  right: -300px;
  width: 128px;
  height: auto;
  margin: 0 auto;
  z-index: 11
}
.ict-contents .inner img.image-container4 {
  position: absolute;
  bottom: -90px;
  left: 0;
  right: 0;
  width: 176px;
  height: auto;
  margin: 0 auto;
  z-index: 11
}
.ict-contents .wrap.info {
  margin-top: 264px;
  z-index: 10;
}
.ict-contents .inner .info p {
  font-size: 1.5rem;
  line-height: 1.6
}
.ict-contents h5 {
  font-size: 2.3rem;
  font-weight: 400;
  padding: 15px 0 10px;
  text-align: center;
}
.img-cloud {
  margin: 36px auto 145px;
  max-width: 519px
}
.img-cloud img {
  width: 100%;
  height: auto
}
iframe.youtube {
  width: 960px;
}
.product {
  background: url("../img/top/bg-product.jpg")top center;
  padding: 130px 20px
}
.product .c-h2-title {
  font-family: "Montserrat", sans-serif;
  font-size: 4rem;
  margin-bottom: 40px;
  position: relative;
  text-align: center;
  color: #333;
  font-weight: 500
}
.product-list {
  display: flex;
  flex-wrap: wrap;
  max-width: 960px;
  margin: 0 auto;
  gap: 30px
}
.product-list li {
  width: 31%;
  background: #fff;
  border-radius: 0 0 80px 0
}
.product-list img {
  width: 100%;
  height: auto
}
.product-list .title {
  font-size: 2rem;
  padding-bottom: 15px;
  color: #327d64;
  text-align: center;
  line-height: 1.5
}
.product-list .inner {
  padding: 30px;
}
.product-list .text {
  font-size: 1.5rem;
  line-height: 1.7
}
.product-list .text img {
  margin-top: 20px
}
.product-list li.bg-g {
  background: url(../img/top/bg-product-food.png) no-repeat;
  background-size: cover;
  padding: 97px 64px;
  text-align: center;
  border-radius: 80px 80px 0 80px
}
.product-list li.bg-g .m {
  color: #fff;
  font-size: 3.2rem;
  padding-bottom: 40px;
  line-height: 1.5
}
.product-list li.bg-g p {
  color: #fff;
  font-size: 2rem;
  text-align: center;
  line-height: 1.5
}
.p-company {
  padding: 140px 20px 200px;
  background: #fff
}
.p-company h2 {
  font-family: "Montserrat", sans-serif;
  font-size: 4rem;
  margin-bottom: 40px;
  position: relative;
  text-align: center;
  color: #333;
  font-weight: 400;
}
.p-company .inner {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  max-width: 960px;
  margin: 70px auto 0
}
.p-company .inner-l {
  max-width: 380px
}
.p-company .inner-l img {
  width: 100%;
  height: auto;
  padding-bottom: 20px
}
.p-company .inner-l .title {
  font-size: 2rem;
  color: #327d64;
  font-weight: 500
}
.p-company .inner-l .title span {
  font-size: 1.5rem;
  line-height: 1.5;
  padding-bottom: 15px;
  display: block;
  color: #327d64;
  font-weight: 500
}
.p-company .inner-r {
  max-width: 480px
}
.p-company .inner-r .title {
  font-size: 3.2rem;
  padding-bottom: 50px;
  line-height: 1.5
}
.p-company-subtitle {
  font-size: 1.8rem;
  color: #327d64;
  padding-bottom: 30px
}
.p-company p {
  font-size: 1.5rem;
  line-height: 1.6
}
.p-outline {
  position: relative;
  width: 100%;
  padding: 30px 0 100px;
  background: #ECF3F2;
}
.p-outline h2 {
  text-align: center;
  font-size: 3.2rem;
  color: #327d64;
  padding-bottom: 40px
}
.p-outline::before {
  position: absolute;
  top: -100px;
  content: "";
  left: -5%;
  right: 0;
  width: 110%;
  height: 100px;
  background: url("../img/top/bg-solution.webp")no-repeat top center;
  background-size: cover;
}
.p-outline .lead {
  text-align: center;
  line-height: 1.8;
  font-size: 1.7rem
}
.p-outline .inner {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  max-width: 960px;
  margin: 70px auto 0
}
.p-outline table {
  border-top: 1px solid #dcdcdc;
}
.p-outline table tr {}
.p-outline table th {
  color: #327d64;
}
.p-outline table td, .p-outline table th {
  font-size: 1.7rem;
  padding: 15px;
  border-bottom: 1px solid #dcdcdc;
  line-height: 1.5
}
.p-outline iframe {
  max-width: 540px;
  height: 443px
}
.p-top-diary {
  background: #fff
}
.p-top-diary .wrap {
  max-width: 960px;
  padding: 120px 0;
  margin: 0 auto
}
.p-top-diary h2 {
  text-align: center;
  font-size: 1.7rem;
  margin-bottom: 80px;
}
.p-top-diary .content {
  width: 62.5vw;
  margin-left: auto
}
.p-top-diary ul {
  width: 100%;
  margin-bottom: 70px
}
.p-news-top-table-list-item a {
  display: flex;
  font-size: 1.7rem;
  padding: 30px;
  border-bottom: 1px solid #dcdcdc
}
.p-news-top-table-list-time {
  color: #327d64;
  margin-right: 50px
}
.p-news-top-table-list-text {
  flex-grow: 1;
}
.btm-more {
  text-align: center
}
.btm-more a {
  display: inline-flex;
  align-items: center;
  gap: 20px;
  padding: 20px 40px;
  margin: 0 auto;
  background-color: #2f6e58;
  color: #ffffff;
  font-size: 1.5rem;
  font-weight: bold;
  text-decoration: none;
  border-radius: 50px;
  transition: background 0.3s;
}
.btm-more a:hover {
  border: 1px solid #327d64;
  background: #fff;
  color: #327d64;
}
.btm-more-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px; /* アイコンのサイズ */
  height: 24px;
  transition: transform 0.5s ease-in-out;
}
.btm-more:hover .btm-more-icon {
  transform: rotate(360deg); /* ホバー時にアイコンを1回転 */
}
.btm-more-icon img {
  width: 100%;
  height: auto;
}
.p-top-live {
  width: 100%;
  max-width: 96rem;
  margin: 10vw auto 0
}
.p-top-live .content-inner {
  display: flex;
  align-items: flex-start;
  justify-content: space-between
}
.p-top-live .content {
  width: 49%
}
.p-top-live .textArea {
  position: relative;
  z-index: 1
}
.product .c-h2-text {
  font-size: 3.2rem;
  text-align: center;
  padding-bottom: 70px;
  color: #333;
  line-height: 1.5;
}
.p-top-live .c-h2-title {
  line-height: 1.5;
  letter-spacing: .1em;
  font-size: 3.2rem;
  font-weight: 600;
  color: #000;
  padding: 0 0 50px 0
}
.p-top-mission {
  padding-top: 100px
}
.p-top-mission .inner {
  width: 49.1875vw;
  height: 40.125vw
}
.p-top-mission .illust .-illust_img01 {
  right: 0;
  bottom: 5vw
}
.p-top-mission .illust .-illust_img01 img {
  width: 19.6875vw;
  height: 20.25vw
}
.p-top-mission .illust .-illust_img02 {
  bottom: 0;
  left: 14.25vw
}
.p-top-mission .illust .-illust_img02 img {
  width: 35.5625vw;
  height: 32.875vw
}
.p-top-mission .illust .-illust_img03 {
  bottom: 5vw
}
.p-top-mission .illust .-illust_img03 img {
  width: 26.125vw;
  height: 11.8125vw
}
.p-top-mission .illust .-illust_img04 {
  top: -2.5vw
}
.p-top-mission .illust .-illust_img04 img {
  width: 47.1875vw;
  height: 35.9375vw
}
.p-top-mission .bg {
  width: 37.5vw;
  height: 37.5vw
}
.p-top-mission .content {
  display: flex;
  justify-content: flex-start;
  width: 50vw;
  margin: 6.875vw auto 0
}
.p-top-mission .content-inner {
  display: flex
}
.p-top-mission .content-title {
  letter-spacing: .1em;
  line-height: 1.66667;
  font-size: 2.4375vw;
  text-align: center;
  margin: 0 auto 50px;
  transform: none !important;
}
.p-top-mission .content-text {
  line-height: 2.77778;
  font-size: 1.6rem;
  text-align: center;
  margin: 0 auto 90px
}
.mission-img {
  display: flex;
}
.mission-img img {
  width: 50%;
  height: auto
}
@media only screen and (min-width:1921px) {
  #h-logo {
    padding: 75px 62.5px 0
  }
  .p-kv .backText {
    font-size: 375px
  }
  .p-multiColumn {
    width: 1500px;
    margin: 300px auto 0
  }
  .p-multiColumn .text {
    font-size: 20px;
    margin-top: 87.5px
  }
  .p-multiColumn .image {
    margin-top: 50px;
    padding-bottom: 50px
  }
  .p-scroll {
    right: 62.5px;
    padding-right: 12.5px;
    margin-right: -12.5px
  }
  .p-scroll, html.ie .p-scroll {
    bottom: 50px
  }
  .p-top-banner {
    width: 1500px;
    margin: 312.5px auto 0
  }
  .p-top-banner .inner {
    height: 325px
  }
  .p-top-banner .text {
    font-size: 20px;
    margin-left: 35px
  }
  .p-top-banner .arrow {
    right: 37.5px;
    bottom: 31.25px
  }
  .p-top-banner .arrow svg {
    width: 32.5px;
    height: 18.75px
  }
  .p-top-banner .image img {
    width: 325px;
    height: 325px
  }
  .p-top-banner .inner-text {
    font-size: 36.25px
  }
  .p-solution {
    width: 1500px;
    margin: 300px auto 0;
  }
  .p-solution .head .text {
    font-size: 20px
  }
  .p-top-diary {
    width: 1500px;
    margin: 306.25px auto 0
  }
  .p-top-diary .content {
    width: 1250px
  }
  .p-top-diary .item {
    width: 415px
  }
  .p-top-diary .box {
    padding: 37.5px
  }
  .p-top-diary .box .circle .circle-inner .hidden-black {
    height: 3.125px;
    top: .625px;
    left: 18px
  }
  .p-top-diary .box .circle {
    width: 37.5px;
    height: 37.5px
  }
  .p-top-diary .box .time {
    font-size: 25px
  }
  .p-top-diary .box .category {
    margin-top: 18.75px;
    font-size: 17.5px
  }
  .p-top-diary .box .text {
    margin-top: 68.75px;
    font-size: 17.5px
  }
  .p-top-live {
    width: 1500px;
    margin: 375px auto 0
  }
  .p-top-live .box {
    padding-bottom: 75px
  }
  .p-top-live .inner {
    margin-top: 75px;
    height: 637.5px;
    padding-left: 112.5px
  }
  .p-top-live .titleJp {
    font-size: 35px
  }
  .p-top-live .supple:before {
    top: -3.75px;
    left: 3.75px;
    font-size: 12.5px
  }
  .p-top-live .titleEn {
    font-size: 15px;
    margin-top: 31.25px
  }
  .p-top-live .text {
    margin-top: 50px;
    font-size: 25px
  }
  .p-top-mission {
    padding-top: 207.5px
  }
  .p-top-mission .back_text {
    font-size: 18.75vw;
    left: -66.5625vw;
    top: 23.4375vw;
    font-size: 375px;
    left: -1331.25px;
    top: 468.75px
  }
  .p-top-mission .inner {
    width: 983.75px;
    height: 802.5px
  }
  .p-top-mission .illust .-illust_img01 {
    right: 0;
    bottom: 100px
  }
  .p-top-mission .illust .-illust_img01 img {
    width: 393.75px;
    height: 405px
  }
  .p-top-mission .illust .-illust_img02 {
    left: 285px
  }
  .p-top-mission .illust .-illust_img02 img {
    width: 711.25px;
    height: 657.5px
  }
  .p-top-mission .illust .-illust_img03 {
    bottom: 100px
  }
  .p-top-mission .illust .-illust_img03 img {
    width: 522.5px;
    height: 236.25px
  }
  .p-top-mission .illust .-illust_img04 {
    top: -50px
  }
  .p-top-mission .illust .-illust_img04 img {
    width: 943.75px;
    height: 718.75px
  }
  .p-top-mission .bg {
    width: 750px;
    height: 750px
  }
  .p-top-mission .content {
    width: 1000px;
    margin: 137.5px auto 0
  }
  .p-top-mission .content-title {
    font-size: 48.75px;
    margin-top: -16.25px;
    width: 500px
  }
  .p-top-mission .content-text {
    font-size: 22.5px;
    margin-top: -16.25px
  }
  .p-index {
    background-size: 2000px
  }
}
@media only screen and (max-width:1027px) {
  .p-kv .copy h1 {
    line-height: 1.85965;
    letter-spacing: .075em;
    font-size: 3rem;
    color: #fff;
    padding-top: 120px;
    text-align: center;
  }
  .p-top-live {
    padding-left: 40px;
    padding-right: 40px
  }
  .p-top-live .c-h2-title {
    font-size: 2.4rem
  }
  .p-top-live .c-h2-text {
    margin: 0 0 20px 0;
    font-size: 1.4rem;
  }
  .accordion-button {
    font-size: 2rem
  }
  .accordion-button::before, .accordion-button::after {
    width: 30px;
    height: 30px;
  }
  .product-list {
    gap: 26px
  }
  .product-list li.bg-g {
    padding: 64px 32px;
  }
  .p-company .inner-l {
    max-width: 380px;
    margin: 0 auto;
  }
  .p-company .inner-r {
    max-width: 480px;
    margin: 60px auto 0;
  }
  .p-outline table {
    width: 80%;
    margin: 0 auto;
  }
  .p-outline iframe {
    width: 100%;
    max-width: 100%;
    margin: 40px auto 0
  }
  .f-logo {
    padding-left: 20px
  }

}
@media only screen and (max-width:820px) {
  .p-kv {
    background: url(../img/top/bg-sp.jpg)top center #327d64;
    background-size: cover;
  }
  #h-logo {
    padding: 5px 10px 0 0
  }
  .p-kv .copy {
    margin-top: 11vh
  }
  .p-kv .copy h1 {
    line-height: 1.85965;
    letter-spacing: .075em;
    font-size: 2.7rem;
    color: #fff;
    padding-top: 50px;
    text-align: center
  }
  .full-map_3 {
    max-width: 59vh;
    top: 94%;
  }
  .t-scroll-body {
    padding-top: 100vh
  }
  .p-kv .backText, .p-kv .copyEn {
    position: absolute
  }
  .p-news-top-table-list-item a {
    padding: 20px
  }
  .p-kv .backText {
    font-weight: 600;
    letter-spacing: .03em;
    white-space: nowrap;
    font-weight: 100;
    color: #093a7b;
    font-size: 9.375rem;
    left: 0;
    bottom: 23vh
  }
	.p-kv .layer1 {
    width:35rem;
    height:  35rem;
	margin-top: 80px
  }

  .p-kv .layer1 .full-map {
    width: 427px;
    margin-top: -8%
  }
  .p-kv .layer1 .map .point {
    width: 3.5rem;
    right: 5.5rem;
    bottom: 5.8rem
  }
  .p-multiColumn {
    margin: 7.1875rem 1.5625rem 0
  }
  .p-multiColumn .text {
    line-height: 2;
    font-size: .9375rem;
    margin-top: 2.1875rem
  }
  .p-multiColumn .image {
    margin-top: 2.1875rem
  }
  .p-top-service {
    margin-top: 9.375rem
  }
  .p-top-diary .wrap {
    padding: 80px 0;
  }
  .p-top-banner {
    margin: 7.5rem 1.5625rem 0;
    padding-bottom: 7.8125rem
  }
  .p-top-banner .item {
    margin: 1.5625rem 0 0
  }
  .p-top-banner .item:first-of-type {
    margin: 0
  }
  .p-top-banner .box {
    display: block
  }
  .p-top-banner .inner {
    height: 9.6875rem
  }
  .p-top-banner .text {
    line-height: 1.78571;
    font-size: .8125rem;
    margin-left: 1.09375rem
  }
  .p-top-banner .arrow {
    right: .625rem;
    bottom: .625rem
  }
  .p-top-banner .arrow svg {
    width: 21px;
    height: 11.5px
  }
  .p-top-banner .image img {
    width: 9.6875rem;
    height: 9.6875rem
  }
  .p-top-banner .inner-text {
    font-size: 1.1875rem;
    line-height: 1.26
  }
  .p-solution {
    background: url("../img/top/sp-bg-solution.jpg")top center no-repeat #ecf3f2;
    background-size: contain;
    padding: 94px 0 40px;
    margin-top: 0;
    background-size: 105%;
    width: calc(100% + 40px);
    margin-left: -20px;
    margin-right: -20px;
  }
  .p-solution > .inner {
    background: none
  }
  .p-solution::before {
    display: none
  }
  .p-top-diary {
    width: 100%;
    padding: 0 20px
  }
  .en-ttl {
    font-size: 3.2rem
  }
  .p-top-diary h2 {
    font-size: 1.6rem
  }
  .p-news-top-table-list-item a {
    flex-direction: column
  }
  .p-news-top-table-list-text {
    font-size: 1.7rem;
    padding-top: 12px;
    line-height: 1.5
  }
  .p-top-live .content {
    width: 100%
  }
  .p-top-live .inner {
    display: flex;
    margin-top: 2.65625rem;
    padding: 4.0625rem 0 3.125rem
  }
  .p-top-live .textArea {
    padding: 0 1.5625rem
  }
  .p-top-live .titleJp {
    line-height: 1.69048;
    font-size: 1.25rem
  }
  .p-top-live .supple:before {
    top: .15625rem;
    left: .15625rem;
    font-size: .6875rem
  }
  .p-top-live .titleEn {
    font-size: .75rem;
    margin-top: 1.25rem
  }
  .p-top-live .text {
    line-height: 2;
    margin-top: 1.875rem;
    font-size: .9375rem
  }
  .p-top-live .image img {
    margin-top: 2.8125rem
  }
  .p-top-mission {
    padding: 90px 0 0;
  }
  .p-top-mission .inner {
    transform: scale(.9);
    width: 21.875rem;
    height: 17.34375rem
  }
  .p-top-mission .illust .-illust_img01 {
    right: .625rem;
    bottom: 2.5rem
  }
  .p-top-mission .illust .-illust_img01 img {
    width: 8.875rem;
    height: 9.125rem
  }
  .p-top-mission .illust .-illust_img02 {
    left: 5.3125rem;
    bottom: -.3125rem
  }
  .p-top-mission .illust .-illust_img02 img {
    width: 16rem;
    height: 14.8125rem
  }
  .p-top-mission .illust .-illust_img03 {
    bottom: 2.5rem
  }
  .p-top-mission .illust .-illust_img03 img {
    width: 11.75rem;
    height: 5.3125rem
  }
  .p-top-mission .illust .-illust_img04 {
    top: -1.5625rem;
    left: 1.5625rem
  }
  .p-top-mission .illust .-illust_img04 img {
    width: 21.25rem;
    height: 16.1875rem
  }
  .p-top-mission .bg {
    top: 1.5625rem;
    width: 16.875rem;
    height: 16.875rem
  }
  .p-top-mission .content {
    margin: 3.75rem 1.5625rem 0
  }
  .p-top-mission .content-title {
    line-height: 1.64179;
    font-size: 2.4rem;
    margin-top: 60px
  }
  .p-top-mission .content-text {
    line-height: 1.6;
    font-size: 1.6rem;
    margin-top: 1.5625rem;
    padding-left: 20px;
    padding-right: 20px;
    margin-bottom: 50px
  }
  .mission-img {
    flex-direction: column
  }
  .mission-img img {
    width: 100%;
    height: auto
  }
  .p-top-live {
    padding: 50px 20px
  }
  .p-top-live .c-h2-title {
    font-size: 2.4rem;
  }
  .p-top-live .content-inner {
    flex-direction: column
  }
  .c-h2-text {
    margin: 0 0 40px;
    font-size: 1.5rem
  }
  .p-top-live .c-h2-text {
    margin: 0 0 30px 0 !important;
    font-size: 1.5rem
  }
  .accordion {
    max-width: 100%;
    margin-top: 76px
  }
  .accordion-button {
    font-size: 1.9rem;
    padding: 0 40px 30px 0;
  }
  .accordion-button::after, .accordion-button::before {
    right: 0
  }
  .solution-title {
    font-size: 2.4rem;
    line-height: 1.5;
    padding: 10px 20px 0
  }
  .p-solution .point li {
    min-width: 109px;
    font-size: 1.8rem;
  }
  .p-solution .inner {
    padding: 20px 20px
  }
  .p-solution .inner .text {
    opacity: 100 !important;
    font-size: 1.6rem;
    padding: 0 20px 80px
  }
  .p-solution .sp-bg-ict {
    background: url(../img/top/sp-bg-solution2.png)no-repeat;
    background-size: 105%;
    padding-top: 52px;
    width: calc(100% + 40px); /* padding 20px × 2 */
    margin-left: -20px; /* 左に寄せる */
    margin-right: -20px;
  }
  .solution-ict-title {
    font-size: 1.9rem;
    line-height: 1.5;
  }
  .solution-ict-text {
    font-size: 1.6rem;
    line-height: 1.5
  }
  .ict-contents {
    flex-direction: column;
    padding: 20px 0
  }
  .ict-contents .wrap {
    max-width: 100%;
    margin-left: 20px;
    margin-right: 20px;
  }
  .img-cloud img {
    padding: 0 20px;
    width: 100%;
    height: auto;
    max-width: 100%; /* 念のため */
    display: block; /* スクロール横ずれ防止 */
  }
  .ict-contents h3 {
    font-size: 2.33rem;
  }
  .ict-contents h4 {
    font-size: 1.9rem;
    letter-spacing: 0
  }
  .ict-contents .quality-list {
    font-size: 1.4rem
  }
  .ict-contents .inner img.image-container {
    bottom: -60px;
    width: 116px;
  }
  .image-container2 {
    top: -190px;
    width: 203px;
  }
  .image-container3 {
    top: -19px;
    right: -234px;
    width: 93px;
  }
  .ict-contents .inner img.image-container4 {
    width: 128px;
  }
  .ict-contents .wrap.symbiosis {
    margin-top: 240px;
  }
  .ict-contents .wrap.kyosei {
    padding-top: 75px
  }
	.ict-contents .wrap.kyosei .title-wrap{
		top: 120px;
	}
  .ict-contents .wrap.nature {
    margin-top: 30px;
    margin-bottom: 30px
  }
  .img-cloud {
    margin: 0 0 50px;
    max-width: 100%;
    width: 100%;
  }
  iframe.youtube {
    width: 100%;
    height: 210px;
  }
  .product {
    padding: 100px 30px 0
  }
  .product .c-h2-title {
    font-size: 3.2rem
  }
  .product .c-h2-text {
    font-size: 2.4rem;
    margin-bottom: 40px;
    padding-bottom: 0
  }
  .product-list li {
    width: 100%
  }
  .p-company h2 {
    font-size: 3.2rem;
    margin-left: 0
  }
  .p-company .inner-r {
    width: 100%
  }
  .p-company .inner-r .title {
    font-size: 2.4rem;
    word-wrap: break-word;
  }
  .p-company p {
    font-size: 1.6rem
  }
  .p-outline {
    background: url("../img/top/sp-bg-outline.jpg") no-repeat top center #ecf3f2;
    background-size: contain;
    padding: 100px 20px 60px;
  }
  .p-outline::before {
    display: none
  }
  .p-outline table {
    width: 100%;
    margin-bottom: 50px
  }
  .p-outline table th, .p-outline table td {
    display: block;
    font-size: 1.6rem
  }
  .p-outline table td {
    padding-top: 0
  }
  .p-outline table th {
    white-space: nowrap;
    border: none;
    padding-bottom: 0
  }
  .p-outline iframe {
    max-width: calc(100% + 40px);
    width: calc(100% + 40px); /* padding 20px × 2ぶん拡大 */
    margin-left: -20px; /* 左にずらして中央寄せ */
    margin-right: -20px; /* 念のため右にも余白を消す */
    margin-top: 0;
    height: 320px;
  }
  .p-company {
    padding: 90px 20px 100px
  }
  .t-footer .content {
    flex-direction: column;
    text-align: center;
    gap: 20px
  }
  .t-footer .f-logo img {
    width: 169px;
    height: auto;
    margin: 0 auto
  }
  .t-footer .data ul {
    font-size: 1.1rem;
    padding: 0 20px;
    justify-content: center
  }
}

.pc-none {
  display: none
}
.sp-none {
  display: block
}
@media only screen and (max-width:768px) {
  .pc-none {
    display: block;
  }
  .sp-none {
    display: none
  }
	
}
@media only screen and (max-width:430px) {
  .p-kv .layer1 {
    width: 19.1875rem;
    height: 19.1875rem;
  }
  .full-map_3 {
    max-width: 125vw;
    top: 90%
  }
}
@media only screen and (max-width:375px) {
  .t-scroll-body {
    padding-top: 100vh;
  }
	.p-kv .layer1 {
    width: 17.1875rem;
    height: 17.1875rem;
		margin: 0 auto
  }
  .full-map_3 {
    max-width: 84vh;
    top: 105%
  }
}

/***** blog-site *****/
#blog-site header{
  height:10rem;
  background-color:white;
}
#blog-site #h-logo2 .cls-1{
  opacity: 1;
  fill: rgb(38, 91, 71);
  color: rgb(38, 91, 71);
}
#blog-site #wrapper{
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  background-color:#ECF3F2;
}
#blog-site footer {
  margin-top: auto;
}
#blog-site section{
  max-width:960px;
  padding: 60px 0;
  margin: 0 auto;
}
#blog-site section h2 {
  text-align: center;
  font-size: 1.7rem;
  margin-bottom: 40px;  
}