@charset "UTF-8";
/* CSS Document */

.f-w35-sec {
    width: 35%;
}
.f-w40-sec {
    width: 40%;
}
.f-w55-sec {
    width: 55%;
}
.f-w60-sec {
    width: 60%;
}
.sec-txt {
    font-size: 1.6rem
}
.h3-sec {
font-family: "dnp-shuei-mgothic-std", sans-serif;
}

a.link-color {
    color: #0076ee;
}

@media screen and (max-width: 767px) {
.f-w35-sec,
.f-w40-sec,
.f-w55-sec,
.f-w60-sec
{
    width: 100%;
}
.sec-txt {
    font-size: 1.4rem
}
}


header {
	width: 100%;
   position:relative;
   z-index: 2000;
   height: 100px;
    background-color: #fff;
}
#logo {
	position: absolute;
	left: 40px;
    width: 170px;
    top:50%;
    transform: translateY(-50%);
}
#caption {
	position: absolute;
	right: 40px;
	height: 50px;
    padding-top: 15px;
    top:50%;
    transform: translateY(-50%);
    font-size: 1.2rem;
}

#mainnav ul {color: #fff;}
@media screen and (max-width: 767px) {
header {
   height: 73px;
}
#logo {
    width: 130px;
    left:5%;
    top: 15px;
    transform: none
    }
#caption {
	position: absolute;
	right: auto;
    left: 5%;
	height: 50px;
    padding-top: 15px;
    top:23px;
    transform: none;
    font-size: 1.1rem;
}
}

/* //////////////////// */
/* メインビジュアル */
/* //////////////////// */
#mainvidual {margin: 0; position: relative;}
#mainvidual .mv_top li {
   width: 100%;
   background-size: cover;
   background-repeat: no-repeat;
   background-position: top bottom;
   min-height: clamp(350px, 78vw, 500px);
}

#mainvidual .mv_top li.bg-mv01 {
    background-image: url("../img/mv_img01.jpg");
     filter: brightness(200%);
    animation: fadeout 0.8s 0.2s;
    animation-fill-mode: both;
}
@keyframes fadeout {
    0% {
        filter: brightness(200%);
    }
    100% {
        filter: brightness(100%);
    }
}

#mainvidual .blk-h1 {
   position: absolute;
   max-width: 450px;
   width: 90%;
   text-align: center;
   top: 38%;
   left: 10%;
}
@media screen and (max-width: 767px) {
#mainvidual .mv_top li.bg-mv01 {background-image: url("../img/mv_img01sp.jpg");}
#mainvidual .blk-h1 {
   position: absolute;
   max-width: 300px;
   width: 90%;
   text-align: center;
   top: auto;
   bottom: 30px;
   left: 5%;
}
}

/* //////////////////// */
/* section01　CSS */
/* //////////////////// */
#section01 {
    background-color: #f4f8f1;
    padding: 100px 0 150px 0;
}
#section01 .sec_right {
    margin-right: calc((100% - 1080px)/2);
    margin-bottom: 90px
}
#section01 .sec_left {
    margin-left: calc((100% - 1080px)/2);
    margin-bottom: 80px
}
#section01 .h3-sec {
    font-size: 3.0rem;
    margin-bottom: 30px;
    color: #216c12;
}
#section01 .h3-sec::before {
    content: "";
    width: 15px;
    height: 15px;
    margin-bottom: 4px;
    background-color: #fff;
    border: solid #000000 1px;
    border-radius: 50%;
    display: inline-block;
    margin-right: 10px;
}
@media screen and (max-width: 767px) {
#section01 {
    padding: 50px 0 80px 0;
}
 #section01 .sec_right {
    margin-right: 0;
    margin-bottom: 80px
}
#section01 .sec_left {
    margin-left: 0;
    margin-bottom: 60px
} 
#section01 .sec_right .f-w35-sec {
        width: 93%;
    }
#section01 .sec_left .f-w35-sec {
        width: 93%;
    margin-left: 7%;
    }
#section01 .f-w60-sec {
    width: 84%;
    margin: 0 auto;
}
#section01 .h3-sec {
    font-size: 2.3rem;
    margin-bottom: 20px;
    margin-top: 20px;
}
#section01 .h3-sec::before {
    width: 10px;
    height: 10px;
    margin-bottom: 3px;
    margin-right: 5px;
}    
    
}


#section02 {
    padding-bottom: 100px;
    background-color: #fff;
}

#section02 .blk-h2 {
    text-align: center;
    position: relative;
    top: -35px;
    margin-bottom: 60px;
}

#section02 .h2-sec {
    font-size: 7.0rem;
    margin-bottom: 10px;
    color: #000000;
    font-family: 'Montserrat', sans-serif;
    font-weight: 200;
    line-height: 1;
}
#section02 .h2sub-sec {
    font-size: 1.8rem
}

#section02 .contents {
    max-width: 1080px;
    margin: 0 auto;
}

#section02 .h3-sec {
    font-size: 2.8rem;
    margin-bottom: 30px;
    color: #216c12;
}
@media screen and (max-width: 767px) {
#section02 {
    padding: 0 7% 100px 7%;
}
#section02 .blk-h2 {
    top: -16px;
    margin-bottom: 20px;
}
#section02 .h2-sec {
    font-size: 3.0rem;
    margin-bottom: 10px;
}
#section02 .h2sub-sec {
    font-size: 1.4rem
}

#section02 .h3-sec {
    font-size: 2.3rem;
    margin-bottom: 20px;
    margin-top: 20px;
    line-height: 1.6;
}
}

.info-list {
    display: flex;
    justify-content: space-between;
    border-top: solid 1px #cfcfcf;
    margin-top: 70px;
    flex-wrap: wrap;
}

.info-list dt,
.info-list dd {
    border-bottom: solid 1px #cfcfcf;
    padding: 25px 0;
    font-size: 1.6rem;
}

.info-list dt {
    width: 200px;
    color: #216c12
}
.info-list dd {
    width: calc(100% - 200px);
}
@media screen and (max-width: 767px) {
.info-list dt,
.info-list dd {
    font-size: 1.3rem;
}
.info-list dt {
    width: 100%;
    border-bottom: none;
    padding: 25px 0 0 0;
}
.info-list dd {
    width: 100%;
    padding: 10px 0 25px 0;
    line-height: 1.7
}   
}

#section03 {
    padding-top: 140px
}

#section03 .blk-h2 {
    text-align: center;
    position: relative;
    top: -35px;
    left: 20px;
    margin-bottom: 60px;
    display: flex;
    align-items: center;
}

#section03 .h2-sec {
    font-size: 7.0rem;
    margin-bottom: 10px;
    color: #000000;
    font-family: 'Montserrat', sans-serif;
    font-weight: 200;
    line-height: 1;
    margin-right: 10px
}
#section03 .h2sub-sec {
    font-size: 1.8rem
}


#section03 .contents {
    position: relative;
    background-color: #fff;
    border-top-left-radius: 50px;
    border-bottom-left-radius: 50px;
    margin-left: calc((100% - 1080px)/2);
    padding-left: 90px;
    padding-bottom: 80px;
}

#section03 .sec03-deco {
    position: absolute;
    right: 0;
    top: -79px;
}

#section03 .area-sec {
    max-width: 1080px;
    width: 90%;
}

#section03 .info-list {
    margin-top: 0px;
}
@media screen and (max-width: 767px) {
#section03 {
    padding-top: 90px
}
#section03 .blk-h2 {
    top: 0;
    left: 0;
    margin-bottom: 20px;
    }
#section03 .sec03-deco {
    position: absolute;
    right: 0;
    top: -43px;
    width: 310px
}
#section03 .h2-sec {
    font-size: 3.0rem;
    margin-bottom: 10px;
    margin-right: 10px
}
#section03 .h2sub-sec {
    font-size: 1.4rem
}
 #section03 .contents {
    position: relative;
    background-color: #fff;
    border-top-left-radius: 25px;
    border-bottom-left-radius: 25px;
    margin-left: 7%;
    padding-left: 7%;
    padding-right: 7%;
    padding-bottom: 40px;
    padding-top: 40px
} 
#section03 .area-sec {
    max-width: 1080px;
    width: 100%;
}
    #section03 .f-w40-sec {
        margin-top: 30px
    }
}

footer {
    position: relative;
    z-index: -1;
    margin-top: -370px;
    background-color: #216c12;
    padding:410px 0 40px 0;
    color: #fff;
    font-size: 10px;
}
