@charset "utf-8";

/*#root{
overflow:hidden;
}*/

html { scroll-behavior: smooth;}

body{
  margin-left: 30% !important;
  font-size:16px;
  font-family: "Noto Sans JP", sans-serif;
  color:#464646;
  font-weight: 400;
  word-break: auto-phrase;
  background:#EEEAE3;
}

h1,h2,h3,h4,h5{
  margin:0;
  font-weight: bold;
  line-height:1.5;  
}

strong,em{
  font-weight:400;
  display:inline-block;
  font-style:normal;
}

p{
  margin:0;
  line-height:1.5;  
}

.p-2{
  line-height:2;
  padding: 0 !important;
}

.sp{
  display:none;
}

.accent{
  font-family: "Ultra", serif;
  font-weight: 400;
}

.poppins{
  font-family: "Poppins", sans-serif;
}


a{
  color: #464646;
  cursor: pointer;
  display:inline-block;
  transition:0.3s;
  font-weight: 400;
}

a:hover{
  color: #464646;
  text-decoration:none;
  opacity:0.7;
}

.container{
  padding:0 !important;
  width: 90%;
  margin: 0 auto;
  max-width: 1345px;
}

img{
  width:100%;
  object-fit: contain;
  display:block;
}

.row{
  margin:0;
}

.main{
  width:85%;
  margin: 0 auto 0 5%;
}

.lower-fv{
  background:#E6E2D5;
  border-radius:0px 0px 40px 40px;
  color:#03436D;
  padding:3rem 5%;
  text-align:center;
  position:relative;
}

.lower-fv img{
  width:17%;
  position:absolute;
  right:10%;
  top:50%;
}

.lower-fv h1{
  font-size:clamp(1.5rem, 0.955rem + 1.82vw, 3rem);
}

.pankuzu{
  display: flex;
  margin: 2.5rem 0;
  gap: 2.5rem;
  flex-wrap: wrap;
  font-size:14px;
  color:#464646;
  align-items: center;
}

.pankuzu a:first-child{
  display: flex;
  align-items:center;
  gap:4px;
  flex-direction: row-reverse;
}

.pankuzu a:first-child::after{
  content:"";
  width:18px;
  height:18px;
  display:block;
  background:url(https://f-jyuzo.co.jp/system_panel/uploads/images/20260225183937394454.png) no-repeat center/contain;
}

.pankuzu a{
  color:#464646;
  position: relative;
}

.pankuzu a:hover{
  opacity:0.7;
}

.pankuzu a::before{
  content:">";
  position: absolute;
  right: -1.4rem;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  line-height: 1;
}

.pankuzu p{
  line-height:1;
}


strong{
  display: inline-block;
}

em{
  display: inline-block !important;
  font-style: normal;
}

h1 strong,
h2 strong,
h3 strong,
h4 strong{
  font-weight:bold;
}


.cta{
  margin-top:10rem;
  position:relative;
}

.cta h2{
  font-size:clamp(2.5rem, 1.591rem + 3.03vw, 5rem);
  color:#03436D;
  margin-bottom:1.5rem;
}

.cta-img{
  width:100px;
  left:32%;
  position:absolute;
  top: 3rem;
  z-index: -1;
}

.cta-bg{
  background:#C3AAAE;
  border-radius:40px 0 0 0;
  padding:2rem 0 3rem;
  text-align:center;
}

.cta-bg > p{
  color:#fff;
  font-size:clamp(0.875rem, 0.784rem + 0.3vw, 1.125rem);
  font-weight:500;
}

.cta-bg > p strong{
  font-weight:500;
}

.cta-wrap{
  display:flex;
  justify-content:space-around;
  max-width: 780px;
  margin: 1.5rem auto 0;
  padding: 2rem;
  border-radius: 2rem;
  background: #EEEAE3;
  align-items: center;
  width: 90%;
}

.cta-item > p{
  font-size:14px;
}

.cta-tel{
  display:flex;
  align-items: center;
  gap:10px;
  color:#03436D;
  font-weight:bold;
  font-size:clamp(1.25rem, 0.977rem + 0.91vw, 2rem);
}

.cta-tel:hover{
  color:#03436D;
}

.cta-tel img{
  width:2.5rem;
}

.btn{
  text-align:center;
  background:#03436D;
  color:#fff;
  padding:20px 3rem;
  border-radius:2.5rem;
  font-weight:bold;
  font-size:clamp(0.875rem, 0.784rem + 0.3vw, 1.125rem);
  border:2px solid #03436D;
}

.btn:hover{
  background:#EEEAE3;
  color:#03436D;
  opacity:1;
}

.arrow-btn{
  display: flex;
  align-items: center;
  width: fit-content;
  justify-content: space-between;
  padding: 12px 2rem 12px 1rem;
  min-width: 280px;
  margin: 5rem auto 0;
}

.arrow-btn img,
.c-arrow-link__icon{
  width:4rem;
}

.c-arrow-link__icon{
  position:relative;
  overflow: hidden;
  background:#EEEAE3;
  border-radius:40px;
  height:2.5rem;
  color:#03436D;
  transition:0.3s;
}

.arrow-btn:hover .c-arrow-link__icon{  
  background:#03436D;
  color:#EEEAE3;
}

.arrow-btn:hover .c-arrow-link__iconImg {
  animation: arrowAnime .5s;
}

.arrow-btn:not(.reverse):hover .c-arrow-link__iconImg {
  animation: arrow_reverseAnime .5s;
}

.c-arrow-link__iconImg {
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
@keyframes arrowAnime {
  0% {
    translate: 0 0;
  }
  50% {
    translate: 100% 0;
  }
  50.1% {
    translate: -100% 0;
  }
  100% {
    translate: 0 0;
  }
}

@keyframes arrow_reverseAnime {
  0% {
    translate: 0 0;
  }
  50% {
    translate: -100% 0;
  }
  50.1% {
    translate:  100% 0;
  }
  100% {
    translate: 0 0;
  }
}

.arrow-btn.reverse{
  padding: 12px 1rem 12px 2rem;
}

.beige-bg{
  padding: 5rem 0;
  background: #E6E2D5;
  border-radius: 40px;
}

.lower-title{
  margin-bottom:2.5rem;
  display:flex;
  gap:1rem;
  align-items: center;
  font-weight:500;
}

.lower-title h2{
  font-size:clamp(1.75rem, 1.114rem + 2.12vw, 3.5rem);
}

.lower-title.blue{
  color:#03436D;
}

@media screen and (max-width: 1600px) {
  .main {
    width: 95%;
    margin: 0 auto;
  }
  .cta h2{
    margin: 0 5% 1.5rem;
  }
  .cta-img{
    left: 35%;
  }
}


@media screen and (max-width: 1279px) {
  body {
    margin-left: 0% !important;
  }
  .main {
    width: 100%;
  }
  .lower-fv{
    padding: 5rem 5% 3rem;
  }
  .pankuzu{
    margin: 2.5rem 5%;
  }
}


@media screen and (max-width: 1024px) {
  .cta-img {
    left: 32%;
    top: 2rem;
    width: 80px;
  }
  .cta-tel img {
    width: 2rem;
  }
  .btn{
    padding: 16px 2.5rem;
  }
  .arrow-btn{
    padding: 12px 2rem 12px 1rem;
  }
  .cta-bg{
    border-radius: 40px 40px 0 0;
  }
}

@media screen and (max-width: 767px) {
  body{
    font-size:14px;
  }
  .lower-fv {
    padding: 3rem 5% 1rem;
  }
  .pankuzu {
    width: 90%;
    margin: 1rem 5%;
    font-size: 10px;
    gap: 1rem;
  }
  .pankuzu a::before{
    right: -0.75rem;
  }
  .pankuzu a:first-child::after {
    content: "";
    width: 10px;
    height: 10px;
  }
  .sp{
    display:block;
  }
  .pc{
    display:none;
  }
  .lower-title {
    margin: 0 auto 1.5rem;
    gap: 0.5rem;
    flex-wrap: wrap;
  }
  .col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto{
    padding:0;
  }
  .cta{
    margin-top: 5rem;
  }
  .cta-wrap{
    flex-direction: column;
    align-items: center;
    gap: 1.5rem;
    border-radius: 20px;
  }
  .cta-wrap a {
    width: 280px;
  }
  .cta-tel{
    font-size: 1.75rem;
    justify-content: center;
  }
  .cta h2 {
    margin: 0 5% 0rem;
  }
  .cta-img {
    left: auto;
    top: 0rem;
    width: 70px;
    right: 15%;
  }
  .lower-fv img {
    width: 23%;
    position: absolute;
    right: 5%;
    top: 60%;
  }
  .arrow-btn{
    min-width: 230px;
  }
  .arrow-btn img, .c-arrow-link__icon{
    width: 3.5rem;
  }
  .c-arrow-link__icon{
    height:2rem;
  }
  .arrow-btn{
    padding: 6px 2rem 6px 1rem;
  }
  .arrow-btn.reverse {
    padding: 6px 1rem 6px 2rem;
  }
}



.headShakeLoop {
  animation: headShakeLoop 3s ease-in-out infinite;
  transform-origin: center;
}

@keyframes headShakeLoop {

  /* 初期 */
  0% {
    transform: translateX(0);
  }

  /* animate.css headShake */
  3% {
    transform: translateX(-6px) rotateY(-9deg);
  }

  9% {
    transform: translateX(5px) rotateY(7deg);
  }

  15% {
    transform: translateX(-3px) rotateY(-5deg);
  }

  22% {
    transform: translateX(2px) rotateY(3deg);
  }

  25% {
    transform: translateX(0);
  }

  /* ここから停止（約2秒） */
  100% {
    transform: translateX(0);
  }
}

.rotateLoop {
  animation: rotateLoop 3s ease-in-out infinite;
  transform-origin: center;
}

@keyframes rotateLoop {

  0% { transform: rotate(0deg); }

  5% { transform: rotate(-8deg); }

  10% { transform: rotate(6deg); }

  15% { transform: rotate(-4deg); }

  20% { transform: rotate(2deg); }

  25% { transform: rotate(0deg); }

  100% { transform: rotate(0deg); }

}

.rotateLoop_1 {
  animation: rotateLoop_1 3s ease-in-out infinite;
  transform-origin: center;
}

@keyframes rotateLoop_1 {

  0% { transform: rotate(0deg); }

  5% { transform: rotate(-8deg); }

  10% { transform: rotate(8deg); }

  15% { transform: rotate(0deg); }

  100% { transform: rotate(0deg); }

}


.bounceYLoop {
  animation: bounceYLoop 3s ease-in-out infinite;
}

@keyframes bounceYLoop {

  0% { transform: translateY(0); }

  8% { transform: translateY(-12px); }

  15% { transform: translateY(4px); }

  22% { transform: translateY(-4px); }

  25% { transform: translateY(0); }

  100% { transform: translateY(0); }

}

.floatLoop {
  animation: floatLoop 3s ease-in-out infinite;
}

@keyframes floatLoop {

  0% { transform: translateY(0); }

  10% { transform: translateY(-8px); }

  25% { transform: translateY(0); }

  100% { transform: translateY(0); }
}

.zoomLoop {
  animation: zoomLoop 3s ease-in-out infinite;
}

@keyframes zoomLoop {

  0% { transform: scale(1); }

  10% { transform: scale(1.1);  }

  25% { transform: scale(1); }

  100% { transform: scale(1); }
}

.fadeUpTrigger{
  opacity:0;
  transition:0.3s;
}

.gjs-dashed .fadeUpTrigger{
  opacity:1;
}

.bounce.fadeUp{
  opacity:1;
}