@charset "utf-8";

.titlewrap {
    background:url(../img/flow/mv.jpg) no-repeat center center/cover;
}

section {
    .wrap {
        .contents {
            h2 {
                border-bottom:15px solid #E7E0CD;
            }
        }
    }
}
#flow {
    .wrap {
        .contents {
            p {
                font-size:2.0rem;
                margin-bottom:1em;
            }
            .img {
                max-width:800px;
                margin:0 auto;
            }
        }
    }
}

#contactus {
    .wrap {
        .contents {
            & > p {
                font-size:2.0rem;
                margin-bottom:1.5em;
            }
            .contact_box {
                max-width:800px;
                margin:0 auto 50px;
                border-bottom:1px solid #707070;
                padding-bottom:20px;
                display:grid;
                justify-items:center;
                grid-row-gap:.66em;
                font-size:2.4rem;
                text-align:left;
                p {
                    font-size:inherit;
                    line-height:1.5;
                    margin-bottom:.33em;
                    font-weight:400;
                }
                dl {
                    display:grid;
                    grid-template-columns:3em 1fr;
                    grid-gap:.33em;
                    dt,dd {
                        line-height:1.5;
                        font-weight:400;
                    }
                    dd {
                        span {
                            margin-left:.5em;
                        }
                    }
                }
                .contactbtn {
                    background: #06752F;
                    background: linear-gradient(0deg, rgba(6, 117, 47, 1) 0%, rgba(137, 183, 81, 1) 100%);
                    display:grid;
                    height:3em;
                    padding:0 2em;
                    border-radius:.66em;
                    align-content:center;
                    justify-content:center;
                    color:#FFFFFF;
                }
            }
            .linkbox {
                display:grid;
                justify-content:end;
                grid-row-gap:.5em;
                a {
                    font-size:2.4rem;
                    font-weight:600;
                }
                p {
                    justify-self:end;
                }
            }
        }
    }
}

#iniformation {
    .wrap {
        .contents {
            .contents_inner {
                display:grid;
                grid-template-columns:30% 1fr;
                padding:0 30px 15px;
                grid-column-gap:5%;
                border-bottom:1px solid #707070;
                &:not(:last-child) {
                    margin-bottom:60px;
                }
                .detail {
                    height:100%;
                    display:grid;
                    align-content:space-between;
                    padding-bottom:15px;
                    p {
                        font-size:2.0rem;
                        font-weight:400;
                    }
                    .txtlink {
                        font-size:2.4rem;
                        font-weight:600;
                        justify-self:end;
                    }
                }
            }
        }
    }
}

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

}

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

}

@media screen and (max-width:768px){
    
    section {
        .wrap {
            .contents {
                h2 {
                    font-size:2.0rem;
                    border-bottom:10px solid #E7E0CD;
                }
            }
        }
    }
    #flow {
        .wrap {
            .contents {
                p {
                    font-size:1.6rem;
                }
            }
        }
    }
    
    #contactus {
        .wrap {
            .contents {
                & > p {
                    font-size:1.6rem;
                }
                .contact_box {
                    font-size:2.0rem;
                    margin-bottom:30px;
                    p {
                        font-size:1.6rem;
                        margin-bottom:1em;
                    }
                    dl {
                        grid-template-columns:2.5em 1fr;
                        dt,dd {
                            line-height:1.5;
                        }
                        dd {
                            span {
                                display:block;
                                margin-left:0;
                                font-size:.8em;
                            }
                        }
                    }
                }
                .linkbox {
                    a {
                        font-size:1.6rem;
                    }
                }
            }
        }
    }
    
    #iniformation {
        .wrap {
            .contents {
                .contents_inner {
                    grid-template-columns: 1fr;
                    padding:0 0 15px;
                    grid-row-gap:20px;
                    &:not(:last-child) {
                        margin-bottom:30px;
                    }
                    .img {
                        img {
                            width:100%;
                            display:block;
                            max-width:640px;
                            margin:0 auto;
                        }
                    }
                    .detail {
                        padding-bottom:10px;
                        p {
                            font-size:1.6rem;
                        }
                        .txtlink {
                            font-size:1.8rem;
                        }
                    }
                }
            }
        }
    }
    
}