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

:root {
    --main_color: #9b6e56;
}

#title_sec #titleWrap {margin-bottom: 40px;}
#titleWrap > figure {max-width: 210px;}
#title_sec .titleBox {width: 74%;}
#title_sec h2 {font-size: clamp(16px, 1.8vw, 20px); margin-top: 20px;}

@media screen and (max-width: 640px){
    #titleWrap .titleBox figure img {max-width: 210px;}

    #title_sec .titleBox {width: 100%;}
    #title_sec .titleLead {margin-bottom: 50px;}
}



/*--------------------------------------------------
.con01
---------------------------------------------------*/
.con01 .inner {/*max-width: 691px;*/}
.con01_thumb {text-align: center;}
.con01_text {margin: 20px auto 0;}
.con01_icon {max-width: 200px;width: 100%;margin-bottom: 10px;}

@media screen and (max-width: 640px){
    .con01_icon {max-width: 140px;}
}


/*--------------------------------------------------
.con02
---------------------------------------------------*/
.con02 {margin-top: 40px;}
.con02 .grid_contents {
    display: grid;
    grid-template-columns: 85% 12%;
    column-gap: 3%;

    padding: 30px;
    border-top: 1px solid #000;
    border-bottom: 1px solid #000;
}

@media screen and (max-width: 640px){
    .con02 .grid_contents {
        grid-template-columns: 1fr;
        row-gap: 20px;

        padding: 20px 0;
    }
}


/*--------------------------------------------------
.recipe
---------------------------------------------------*/
.recipe_icon {max-width: 200px;width: 100%;margin-bottom: 10px;}
.recipe_thumb img {max-width: 500px;}

@media screen and (max-width: 640px){
    .recipe_icon {max-width: 140px;}
}