@media screen and (min-width:769px) {

body h1,h2,p,a{
    color: #4E392D;
}


/* ----------------------*
 * ヘッダー
 * ----------------------*/

#hamburger{
    display: none;
}
header{
    width: 100%;
}
#logo{
    max-width: 1000px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px;
}
#global-nav ul{
    display: flex;
    gap: 20px;
    margin: 0;
    padding: 0;
} 
#global-nav li{
    margin-left: 30px;
}
#global-nav a:hover{
    color: #EEA997;
}

/* ----------------------*
 * メイン
 * ----------------------*/
#firstview-text{
    position: absolute;
    bottom: 40px;
    left: 80px;
    color:#4E392D;
    
}
h1{
    font-size: 48px;
    text-shadow: 3px 3px 6px #fff;
}
#firstview-text h1 span{
    display: block;
    font-size: 32px;
}
/* ----------------------*
 * コンセプト
 * ----------------------*/
 #concept{
    padding: 150px 0;
    max-width: 1000px;
    margin: 0 auto;
    display: flex;
    align-items: flex-start;
    gap: 60px;
}
#concept-text{
    background-color: #FFFAF8;
    width: 50%;
    margin: 0 auto;
    padding: 60px;

}
#concept-text h2{
    font-size: 40px;
    letter-spacing: 4px;
    margin-bottom: 30px;
    text-align: center;
    
}
#concept-text p{
    font-size: 16px;
    line-height: 2;
    margin-bottom: 20px;
    text-align: left;
    margin-left: 50px;
}
#conceptphoto{
    margin-right: -100px;
    margin-top: -50px;
    z-index: 1
}
#btn{
    display: inline-block;
    margin-top: 20px;
    padding: 10px 25px;
    border: 1px solid #4E392D;
    border-radius: 25px;
    text-decoration: none;
    font-size: 16px;
    background-color: #fff;
    transition: 0.3s;
    margin-left: 280px;
}
#btn:hover{
    background-color: #E9DFD8
}
/* ----------------------*
 * メニュー
 * ----------------------*/
h2{
    font-size: 40px;
    text-align: center;
    letter-spacing: 4px;
    margin-bottom: 30px;
}
#menu-area{
    max-width: 1000px;
    margin: 0 auto;
    display: flex;
}
#menu-list{
    font-size: 16px;
    color: #4E392D;
    display: flex;
    gap: 50px;
    margin: 40px 100px;   
}
#menu-list li{
    margin-bottom: 20px;
}
#btn2{
    display: inline-block;
    padding: 10px 25px;
    border: 1px solid #EEA997;
    border-radius: 35px;
    text-decoration: none;
    font-size: 24px;
    background-color: #EEA997;
    color: #fff;
    transition: 0.3s;
    margin-left: 100px;
}
#btn2:hover{
    background-color: #fff;
    color: #EEA997;
}

 /* ----------------------*
 * スタイル
 * ----------------------*/
#style{
    max-width: 1000px;
    padding: 150px;
}
#style-photo ul{
    display: flex;
    gap: 20px;
    margin: 20px;
    padding: 0;
}
#instagram-btn{
    margin: 50px;
    display: flex;
    justify-content: center;
}
a img:hover{
    opacity: 0.5;
}
 /* ----------------------*
 * サロンインフォ
 * ----------------------*/
 #info{
    max-width: 1000px;
    padding: 0 150px;
    display: flex;
    justify-content: center;
    gap: 30px;
 }
 #info ul{
    margin: 20px;
    padding: 0;
 }
 #info p{
    font-size: 16px;
    margin-top: 10px;
    padding-bottom: 10px;
 }
#info a{
    display: inline-block;
    padding: 10px 25px;
    border: 1px solid #4E392D;
    border-radius: 25px;
    text-decoration: none;
    font-size: 16px;
    background-color: #fff;
    transition: 0.3s;
    margin-left: 220px;
}
#info a:hover{
    background-color: #E9DFD8
}
 /* ----------------------*
 * 予約
 * ----------------------*/
 #yoyaku{
    max-width: 1000px;
    background-color: #FFFAF8;
    margin: 150px;
    padding: 50px;
 }
#yoyaku-btn{
    display: flex;
    justify-content: center;
    gap: 30px;

}
#yoyaku-btn a{
    display: inline-block;
    padding: 10px 25px;
    border: 1px solid #4E392D;
    border-radius: 35px;
    text-decoration: none;
    font-size: 24px;
    background-color: #fff;
    transition: 0.3s;
}
#yoyaku-btn a:hover{
    background-color: #E9DFD8
}
 /* ----------------------*
 * フッター
 * ----------------------*/
 #footer-area{
    max-width: 1000px;
    margin: auto;
    display: flex;
    justify-content: space-between;
 }
 #footer-text{
    font-size: 16px;
    margin-top: 100px;
    padding: 100px;
 }
 #footer-text p{
    padding-bottom: 30px;
 }
 #policy{
    text-align: center;
    font-size: small;
 }
#footer-nav ul{
    display: flex;
    justify-content: flex-end;
    margin: 20px 100px;
}
#footer-nav li{
    margin-left: 30px;

}
#footer-nav a{
    transition: all ease 0.3s;
}
#footer-nav a:hover{
    color: #EEA997;
}
#copyright{
    display: block;
    text-align: center;
}
/* フェードイン */
        .fade-in {
            opacity: 0;
            transform: translateY(30px);
            transition: opacity 0.8s ease, transform 0.8s ease;
        }
        .fade-in.is-visible {
            opacity: 1;
            transform: translateY(0);
        }
}