@charset "utf-8";

:root {
    --main-color: #469433;
    --sub-color: #f4fae4;
    --deco-color: #aac660;
	--vh:100vh;
}

body {
    font-family: "ZenKaku Gothic NEW";
    font-weight: 500;
    color: #555;
}

body.noscroll {
	overflow:hidden;
}

main {
    overflow: hidden;
    padding-top: 75px;
}

/*tb*/
@media screen and (max-width:899px) {
    main {
        padding-top: 60px;
    }
}

.w126 {
    width: 100%;
    max-width: 1260px;
    margin: auto;
}

@media screen and (max-width:1300px) {
    .w126 {
        padding: 0 3%;
    }
}

.has-bg {
    background-color: var(--sub-color);
}


/*=====================================
*
*見出し
*
=======================================*/
/*見出し1*/

.hd1 {
    width: fit-content;
    font-size: 28px;
    margin: 0 auto calc((43 / 28) * 1.0em);
}

.hd1 .deco {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: calc((16 / 28) * 1.0em);
    font-family: "Barlow";
    font-weight: 700;
    color: var(--deco-color);
    letter-spacing: 0.03em;
    width: fit-content;
    margin: auto;
}

.hd1 .deco span {
    display: inline-block;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background-color: var(--deco-color);
}

.hd1 h2 {
    font-weight: 700;
    text-align: center;
    margin-top: -5px;
}

/*sp*/
@media screen and (max-width:599px) {
    .hd1 {
        font-size: 22px;
        margin: 0 auto calc((30 / 22) * 1.0em);
    }
}

/*下層見出し1*/
.under-hd1{
	font-size:32px;
	font-weight:700;
	margin-bottom:30px;
}

.under-hd1 p{
	font-family:"Barlow"!important;
	font-size:calc((26 / 32) * 1.0em)!important;
	letter-spacing:0.08em!important;
	line-height:1.0!important;
	color:#beddb6!important;
}

.under-hd1 h2{
	position:relative;
	display:flex;
	letter-spacing:0.03em;
}

.under-hd1 h2::after {
    content: "";
	position: relative;
    top: 25px;
    display: block;
    width: 140px;
    height: 2px;
    margin-left: 20px;
    background-color: #beddb6;
}

@media screen and (max-width:1300px){
  .under-hd1 {
    font-size: 26px;
  }
	
   .under-hd1 h2::after {
	 top: 19px;
  }
}

/*sp*/
@media screen and (max-width:599px){
  .under-hd1 {
      font-size: 20px;
      margin-bottom: 20px;
   }
	
	.under-hd1 h2::after{
		top: 15px;
		width: 100px;
		margin-left: 10px;
	}
}
/*=====================================
*
*リード分
*
=======================================*/
.read-text {
    font-size: 14px;
    letter-spacing: 0.03em;
    line-height: 2.0;
    margin-bottom: 30px;
}

/*=====================================
*
*ボタン
*
=======================================*/
/*ボタン1*/
.btn1 {
    width: 280px;
    height: 55px;
}

.btn1 a {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    font-size: 20px;
    font-weight: 700;
    color: #fff;
    letter-spacing: 0.03em;
    border: 1px solid var(--main-color);
    background-color: var(--main-color);
    transition: 0.3s ease-in-out;
}

.btn1 a::after {
    content: "";
    position: absolute;
    transform: translateY(-50%);
    top: 50%;
    right: 19px;
    width: 10px;
    height: 19px;
    clip-path: polygon(0 0, 100% 50%, 0 100%);
    background-color: #fff;
    transition: 0.3s ease-in-out;
}

@media (any-hover:hover) {
    .btn1 a:hover {
        color: var(--main-color);
        background-color: #fff;
    }

    .btn1 a:hover::after {
        background-color: var(--main-color);
    }
}

@media screen and (max-width:599px) {
    .btn1 {
        font-size: 16px;
        width: 225px;
        height: 50px;
    }


    .btn1 a {
        font-size: 16px;
    }

    .btn1 a::after {
        top: calc(50% - 2px);
    }

    .btn1 a::after {
        scale: 0.75;
    }
}

/*=====================================
*
*cta
*
=======================================*/
.cta-sec {
    padding: 140px 0 117px;
    background-image: url(../images/cta/cta-bg.jpg);
    background-size: cover;
    background-position: center;
}

.cta-sec .cta-cont .cta-hd {
    position: relative;
    font-family: 'ZenKaku Gothic NEW';
    font-size: 40px;
    font-weight: 700;
    line-height: 1.0;
    color: #fff;
    letter-spacing: 0.03em;
    text-align: center;
    margin-bottom: 45px;
}

.cta-sec .cta-cont .cta-hd .deco {
    position: absolute;
    transform: translateX(-50%);
    left: 50%;
    top: calc((36 / 52) * -1.0em);
    font-family: 'Barlow';
    font-weight: 600;
    font-size: calc((52 / 40) * 1.0em);
    line-height: 1.0;
    opacity: 0.64;
    color: transparent;
    -webkit-text-stroke: 0.25px #fff;
}

.cta-sec .cta-cont .btn-area {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: calc((30 / 990) * 100%);
    margin: auto;
}

.cta-sec .cta-cont .btn-area .btn {
    width: 100%;
    height: 55px;
}

.cta-sec .cta-cont .btn-area .btn a {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    height: 100%;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 0.03em;
    color: var(--main-color);
    border: 1px solid var(--main-color);
    border-radius: 50px;
    background-color: rgba(255, 255, 255, 0.85);
    transition: 0.3s ease-in-out;
}

@media (any-hover:hover) {
    .cta-sec .cta-cont .btn-area .btn a:hover {
        transform: translateY(-5px);
        opacity: 0.75;
    }
}

/*tb*/
@media screen and (max-width:1024px) {
    .cta-sec .cta-cont .btn-area .btn a {
        gap: 7px;
        font-size: 14px;
    }

}

@media screen and (max-width:899px) {
    .cta-sec .cta-cont .btn-area {
        grid-template-columns: repeat(2, 1fr);
        gap: 35px;
    }
}

/*sp*/
@media screen and (max-width:599px) {
    .cta-sec {
        padding: 80px 0 80px;
    }

    .cta-sec .cta-cont .cta-hd {
        font-size: 28px;
        margin-bottom: 35px;
    }

    .cta-sec .cta-cont .btn-area .btn {
        height: 45px;
    }

    .cta-sec .cta-cont .btn-area .btn a {
        gap: 5px;
        font-size: 13px;
    }

    .cta-sec .cta-cont .btn-area .btn a img {
        scale: 0.85;
    }

    .cta-sec .cta-cont .btn-area {
        gap: 15px;
    }
}

.scroll{
	font-size:14px;
	font-weight:700;
	width:fit-content;
}

.scroll::after{
   content:'';
   position:relative;
   top:1px;
   display:inline-block;
   width:5px;
   height:10px;
   margin-left:4px;
   background:#555;
   clip-path:polygon(0 0 , 100% 50%,0 100%)
}

/*=====================================
*
*追跡
*
=======================================*/
#track span{
	font-size:13px;
	font-weight:700;
	letter-spacing:0.03em;
}

#track form{
	position:relative;
	max-width: 240px;
}

#track input{
	width:100%;
	padding: 5.5px 25px 5.5px 8px;
	border-radius:3px;
	border:solid 1px #6d6d6d;
	background-color: transparent;
}

#track input[type="text"]:focus {
	outline:none;
}

#track button {
    position: absolute;
	transform:translatey(-50%);
	top:50%;
    right: 10px;
    border: none;
    background-color: transparent;
	cursor:pointer;
}

#track button i{
	font-size: 14px;
	color: #555;
}


@media screen and (max-width:599px) {
   .sp_mt10 {
      margin-top: 10px;
   }

   .sp_mt20 {
      margin-top: 20px;
   }

   .sp_mt30 {
      margin-top: 30px;
   }

   .sp_mt40 {
      margin-top: 40px;
   }

   .sp_mt50 {
      margin-top: 50px;
   }

   .sp_mt60 {
      margin-top: 60px;
   }

   .sp_mb10 {
      margin-bottom: 10px;
   }

   .sp_mb20 {
      margin-bottom: 20px;
   }

   .sp_mb30 {
      margin-bottom: 30px;
   }

   .sp_mb40 {
      margin-bottom: 40px;
   }

   .sp_mb50 {
      margin-bottom: 50px;
   }

   .sp_mb60 {
      margin-bottom: 60px;
   }

   .sp_pb10 {
      padding-bottom: 10px;
   }

   .sp_pb20 {
      padding-bottom: 20px;
   }

   .sp_pb30 {
      padding-bottom: 30px;
   }

   .sp_pb40 {
      padding-bottom: 40px;
   }

   .sp_pb50 {
      padding-bottom: 50px;
   }

   .sp_pb60 {
      padding-bottom: 60px;
   }

   .sp_pt10 {
      padding-top: 10px;
   }

   .sp_pt20 {
      padding-top: 20px;
   }

   .sp_pt30 {
      padding-top: 30px;
   }

   .sp_pt40 {
      padding-top: 40px;
   }

   .sp_pt50 {
      padding-top: 50px;
   }

   .sp_pt60 {
      padding-top: 60px;
   }
}

/*=====================================
*
*pc&tablet&spのnone処理
*
=======================================*/
/*=====================================
*pc用
=======================================*/
@media screen and (max-width: 899px) {
    .pc {
        display: none;
    }
}

/*=====================================
*pc以外
=======================================*/
@media screen and (min-width: 900px) {
    .nopc {
        display: none;
    }
}

/*=====================================
*sp以外
=======================================*/
@media screen and (max-width: 599px) {
    .nosp {
        display: none;
    }
}

/*=====================================
*tablet_sp共通
=======================================*/
@media screen and (min-width: 900px) {
    .sp_tb {
        display: none;
    }
}

@media screen and (max-width: 899px) {
    .sp_tb {
        display: inherit;
    }
}

/*=====================================
*tablet用
=======================================*/
@media screen and (min-width: 900px) {
    .tb {
        display: none;
    }
}

@media screen and (max-width: 600px) {
    .tb {
        display: none;
    }
}

/*=====================================
*sp用
=======================================*/
@media screen and (min-width: 600px) {
    .sp {
        display: none;
    }
}

@media screen and (max-width: 599px) {
    .sp {
        display: inherit;
    }
}