@charset "utf-8";


#mainvis h1{
font-size: 0.8em;
}
#mainvis figure img{
max-width: 60px;
width: 8vw;
}
/*--------------------------------------------*/
.ttl {
font-size: 1.25em;
font-weight: bold;
text-align: center;
margin: 0 0 50px 0;
line-height: 1em;
position: relative;
}
.ttl:before{
content: "";
display: table;
margin: 0 auto 15px auto;
max-width: 30px;
max-height: 30px;
width: 4vw;
height: 4vw;
background: url("../img/pfc-fd/ic.png") center center /cover no-repeat;
}
.ttl span{
display: table;
margin: 0 auto;
font-size: 0.7em;
color: #8D8D8D;
line-height: 1em;
}
.ttl span:before{
content: "";
width: 70px;
height: 2px;
display: table;
background: #2AA157;
margin: 15px auto;
}

/*--------------------------------------------*/

#mf1 .mf-inner{
padding: 100px 0;
}
#cbox11{
background: #EFFFEB;
border-radius: 15px;
margin: 0 0 80px 0 ;
}
#cbox11 .cbox-inner{
padding: 30px;
}
#cbox11 .clist{
justify-content: center;
align-items: center;
}
#cbox11 h2{
font-size: 1.25em;
font-weight: bold;
text-align: center;
margin: 0 40px 0 0;
padding: 30px 40px 30px 0;
border-right: #55A468 dashed 2px;
}
#cbox11 h2 img{
max-width: 30px;
width: 4vw;
display: table;
margin: 0 auto 10px auto;
}
#cbox11 p{
background: #fff;
padding: 40px 20px;
}


#cbox12 .clist{
justify-content: space-between;
}
#cbox12 .ctext{
width: 550px;
}
#cbox12 h3{
font-size: 1.25em;
font-weight: bold;
border-bottom: #55A468 solid 2px;
margin: 0 0 10px 0;
padding: 0 0 10px 0;
}
#cbox12 p{
margin: 0 0 30px 0;
line-height: 2.25em;
}


#mf3{
background: #F2F0EC;
}
#mf3 .mf-inner{
padding: 100px 0;
}
#mf3 .clist{
justify-content: space-between;
}
#mf3 .cbox{
width: 490px;
border: #2FA761 solid 2px;
border-radius: 15px;
background: #fff;
}
#mf3 .cbox-inner{
padding: 30px 20px;
}
#mf3 .cbox h3{
font-size: 1.13em;
font-weight: bold;
color: #2EA761;
border-bottom: #E2E2E2 solid 2px;
padding: 0 0 20px 0;
margin: 0 0 20px 0;
}
#mf3 .cbox li{
position: relative;
margin: 0 0 10px 0;
padding: 0 0 0 25px;
}
#mf3 .cbox li:before{
content: "";
max-width: 20px;
max-height: 20px;
width: 3vw;
height: 3vw;
background: #2EA761;
position: absolute;
left: 0;
top: 0.5em;
}
#mf3 .cbox:nth-of-type(2){
border-color: #2E8BA7;
}
#mf3 .cbox:nth-of-type(2) h3{
color: #2E8BA7;
}
#mf3 .cbox:nth-of-type(2) li:before{
background: #2E8BA7;
}

#mf4 .mf-inner{
padding: 100px 0;
}
#mf4 .cbox{
border: #2EA761 solid 2px;
border-radius: 15px;
}
#mf4 .cbox-inner{
padding: 20px;
}
#mf4 dl{
font-size: 1.25em;
display: flex;
}
#mf4 dl dt{
padding: 30px;
font-weight: bold;
border-right: #2EA761 solid 2px;
height: 100%;
}
#mf4 dl dd{
padding: 0 30px;
display: flex;
align-items: center;
}


#mf4 dl:nth-of-type(1){
border-bottom: #2EA761 solid 2px;
}
#mf4 dl dd span:nth-of-type(2){
font-size: 3em;
color: #2EA761;
margin: 0 20px;
line-height: 1em;
}


#mf5{
background: #F2F0EC;
}
#mf5 .mf-inner{
padding: 100px 0;
}
#mf5 ul{
display: flex;
justify-content: center;
flex-wrap: wrap;
}
#mf5 ul li{
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
max-width: 230px;
max-height: 230px;
width: 50%;
height: 30vw;
color: #2EA761;
font-weight: bold;
background: #fff;
text-align: center;
border-radius: 15px;
line-height: 1.5em;
padding: 50px 20px 20px 20px;
margin: 0 10px 30px 10px;
box-shadow: 10px 10px 20px rgba(0,0,0,0.2);
}
#mf5 ul li img{
display: table;
max-width: 90px;
width: 12vw;
margin: 0 auto 20px auto;
}


#mf6 .mf-inner{
padding: 100px 0;
}
#mf6 .clist{
justify-content: space-between;
position: relative;
}
#mf6 .clist:before{
content: "";
height: 8px;
background: #E3FFDD;
position: absolute;
left: 0;
right: 0;
top: 100px;
}
#mf6 .cbox{
width: 200px;
}
#mf6 figure{
display: flex;
justify-content: center;
align-items: center;
max-width: 200px;
max-height: 200px;
width: 25vw;
height: 25vw;
background: #E3FFDD;
border-radius: 100%;
margin: 0 0 30px 0;
position: relative;
}
#mf6 figure img{
max-width: 70px;
width: 9vw;
}
#mf6 figure span{
display: flex;
justify-content: center;
align-items: center;
color: #fff;
font-size: 1.88em;
font-weight: bold;
background: #2EA761;
border-radius: 100%;
max-width: 60px;
max-height: 60px;
width: 8vw;
height: 8vw;
position: absolute;
top: 0;
left: 0;
}
#mf6 .cbox dl dt{
text-align: center;
font-size: 1.25em;
font-weight: bold;
border-bottom: #2EA761 solid 1px;
padding: 0 0 10px 0;
margin: 0 0 10px 0;
}






@media screen and (max-width: 1024px) {

#mainvis h1{
font-size: 0.8em !important;
}

/*----------------------------*/

.ttl {
margin: 0 0 10vw 0;
}
.ttl span{
font-size: 0.7em;
}
.ttl span:before{
margin: 2vw auto;
}

/*--------------------------------------------*/

#mf1 .mf-inner{
padding:0 0 10vw 0;
}
#cbox11{
margin: 0 0 10vw 0 ;
}
#cbox11 .cbox-inner{
padding: 1em;
}

#cbox11 h2{
width: 100%;
margin: 0 0 5vw 0;
padding: 0 0 5vw 0;
border: none;
border-bottom: #55A468 dashed 2px;
}
#cbox11 h2 img{
margin: 0 auto 2vw auto;
}
#cbox11 p{
padding: 3vw;
}

#cbox12 .clist{
justify-content: center;
}
#cbox12 .ctext{
width: 100%;
}
#cbox12 h3{
margin: 4vw 0 2vw 0;
padding: 0 0 2vw 0;
}
#cbox12 p{
margin: 0 0 5vw 0;
}



#mf3 .mf-inner{
padding: 10vw 0;
}
#mf3 .clist{
justify-content: center;
}
#mf3 .cbox{
width: 100%;
margin: 0 0 5vw 0;
}
#mf3 .cbox-inner{
padding: 5vw;
}
#mf3 .cbox h3{
padding: 0 0 2vw 0;
margin: 0 0 2vw 0;
}
#mf3 .cbox li{
margin: 0 0 1vw 0;
padding: 0 0 0 4vw;
}



#mf4 .mf-inner{
padding: 10vw 0;
}
#mf4 .cbox{
}
#mf4 .cbox-inner{
padding: 5vw;
}
#mf4 dl{
padding: 2vw;
display: block;
}
#mf4 dl dt{
padding: 2vw 0;
font-weight: bold;
border: #2EA761 solid;
border-width: 2px 0;
}
#mf4 dl dd{
padding: 2vw 0;
flex-direction: column;
}
#mf4 dl dd span{
width: 100%;
}

#mf4 dl:nth-of-type(1){
border: none;
}
#mf4 dl dd span:nth-of-type(2){
margin: 1vw 0;
text-align: center;
}



#mf5 .mf-inner{
padding: 10vw 0;
}

#mf5 ul li{
font-size: 0.8em;
padding: 5vw 2vw 2vw 2vw;
margin: 0 2vw 5vw 2vw;
}
#mf5 ul li img{
display: table;
max-width: 90px;
width: 12vw;
margin: 0 auto 20px auto;
}


#mf6 .mf-inner{
padding: 10vw 0;
}
#mf6 .clist{
justify-content:flex-start;
}
#mf6 .clist:before{
height: auto;
width: 8px;
left: 15%;
right: auto;
top: 0;
bottom: 30vw;
}
#mf6 .cbox{
width: 100%;
margin: 0 0 5vw 0;
}
#mf6 .cbox-inner{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
#mf6 figure{
margin: 0 2vw 0 0;
}

#mf6 figure span{
font-size: 1em;
}
#mf6 .cbox dl{
width: 70%;
}
#mf6 .cbox dl dt{
text-align: left;
font-size: 1em;
padding: 0 0 1vw 0;
margin: 0 0 1vw 0;
}







}