@charset "UTF-8";


body                                   { color: #454545; background-color: #FFF;}
body                                   { font-size: 16px; line-height: 1.8em; font-family: "Noto Sans JP", serif; font-weight: 300;}
a                                      { color: #454545;}


/* font */
.noto-serif-jp                         { font-family: "Noto Serif JP", serif;}
.noto-sans-jp                          { font-family: "Noto Sans JP", serif;}

/* margin */
.mt1                                   { margin-top: 1em;}
.mt2                                   { margin-top: 2em;}
.mt3                                   { margin-top: 3em;}
.mt4                                   { margin-top: 4em;}
.mt5                                   { margin-top: 5em;}


/* common */
.pc                                    { display: block;}
.sp                                    { display: none;}
.no-text                               { font-size: 0; line-height: 0; text-indent: -9999px;}
.text-center                           { text-align: center;}
.text-right                            { text-align: right;}
.btn_common                            { border: 1px solid #5C8258; color: #3E4F3C; padding: 0.2em 1em; border-radius: 0.2em;}
.btn_common::before                    { content: "›"; color: #f00; margin-right: 0.5em;}
h3                                     { font-family: "Noto Serif JP", serif; font-size: 1.5em; line-height: 1.5em; color: #5C8258; margin-bottom: 1em;}


/* header */
header                                 { position: absolute; top: 2vw; left: 5vw; right: 5vw; font-size: 10000;}

h1 a                                   { display: block; width: 250px; height: 50px; background: url(https://image.raku-uru.jp/01/25005/262/logo_aneesfarm_1740509091029.png); background-size: cover;}


/* FV */
#fv                                    { width: 100%; height: 100vh; background: url(../images/fv-image.jpg) center bottom; background-size: cover; display: flex; justify-content: center; align-items: center;}
#fv h2                                 { background: url(../images/fv-message.png) no-repeat; background-size: contain; width: 200px; height: 336px; font-size: 0; line-height: 0; text-indent: -9999px; position: relative; top: -10vh;}
#fv a     { display: inline-block; background-color: #5C8258; color: #FFF; padding: 0.5rem 2rem; border-radius: 2rem; position: absolute; margin-bottom: -250px; border: 3px solid #FFF;}


/* お知らせ */
#news                                 { max-width: 1200px; margin: auto; padding: 4em 0; display: flex; gap: 100px;}
#news h3     { width: 10%;}
#news dl { width: 90%;}
#news dl div                          { display: flex; gap: 2em; padding: 0.5em 0; border-top: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5; margin-top: -1px;}
#news dl div dt   { width: 10%;}
#news dl div dd   { width: 90%;}



/* Footer */
footer                                { background-color: #f2f2f2; padding: 2em 0; margin-top: 5em;}
footer .container                     { max-width: 1200px; margin: auto;}
footer .container h2                  { display: block; width: 250px; height: 50px; background: url(https://image.raku-uru.jp/01/25005/262/logo_aneesfarm_1740509091029.png); background-size: cover;}
footer .container h3                  { font-size: 1.2em; color: #666; margin: 0;}
footer .container .shop-info          { display: flex; gap: 2em; padding: 1em 0 0;}
footer .container .flex-c2            { display: flex; gap: 30px;}
.copyright                            { border-top: 1px solid #ccc; text-align: center; padding: 1em 0 2em; margin-top: 2em; display: flex; justify-content: space-between;}
.copyright nav                        { display: flex; gap: 1.5em;}



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



    body                                   { font-size: 3.5vw;}


    /* common */
    .pc                                    { display: none;}
    .sp                                    { display: block;}

    h3                                     { font-family: "Noto Serif JP", serif; font-size: 1.5em; line-height: 1.5em; color: #5C8258; margin-bottom: 1em;}


    /* header */
    /* header                                 { position: absolute; top: 0; left: 0; right: 0; font-size: 10000;} */
    h1 a                                   { display: block; width: 200px; height: 40px; background: url(https://image.raku-uru.jp/01/25005/262/logo_aneesfarm_1740509091029.png); background-size: cover;}
    
    
    /* FV */
    #fv                                    { width: 100%; height: 100vh; display: flex;}
    #fv .fv-image                          { width: 50vw; height: 100%; overflow: hidden; text-align: right; background: url(https://image.raku-uru.jp/01/25005/238/fv01_1740475987111.png) bottom right; background-size: cover; font-size: 0; line-height: 0; text-indent: -9999px;}
    #fv .fv-text                           { display: flex; justify-content: center; width: 45vw; flex-direction: row-reverse; gap: 1vw; align-items: center; margin-top: -20vh;}
    #fv .fv-text p                         { background: url(https://image.raku-uru.jp/01/25005/264/fv-message_1740509355158.png) center no-repeat; width: 10vw; height: 50vh; background-size: contain;  font-size: 0; line-height: 0; text-indent: -9999px;}
    #fv .fv-text h2                        { font-family: "Noto Serif JP", serif; writing-mode: vertical-rl; padding-top: 44vh; font-size: 1.1em; line-height: 2em;}
    
    

    
    
    
    
    /* Footer */
    footer                                { padding: 2em 5vw; }
    footer .container h2                  { display: block; width: 200px; height: 40px;}
    footer .container .shop-info          { display: block; gap: 2em; padding: 1em 0 0;}
    footer .container .flex-c2            { display: block;}
    footer .container .flex-item:last-child  { margin-top: 2em;}
    .copyright                            { text-align: center; display: block;}
    .copyright nav                        { display: block;}
    .copyright nav a     { display: inline-block; margin: 0 0.8em;}
    

}