*{position: relative;}
body{font-family: 'Noto Sans KR', sans-serif;}
li,ol,ul{list-style: none;}
p{line-height: 1.7em;  font-weight: 300;
    color: #5d5d5d; font-family: 'Noto Sans KR', sans-serif;
}
a{text-decoration: none; color: inherit;}
img{display: block;}
.item p{font-style: italic; font-weight: 300; font-family: 'Noto Sans KR', sans-serif;}
.item img{ width: 100%; display: block;}
.item h4{font-weight: 400;}
.section-title{ margin-bottom: 20px; }
.section{padding-bottom: 100px;}
/*섹션타이틀*/
.section-title h2{
    padding: 30px 0;
    font-size: 34px;
    font-weight: lighter;
    text-align: center;
    margin-bottom: 30px;
    font-weight: 400;
}
.section-title h2::before{
    content: ""; display: block;
    width: 80px; height: 1px; background-color: black;
    position: absolute; top: 100%; left: calc(50% - 40px);
}


/*header*/
header{background-color: rgb(215, 209, 202); height: 100px; }
header .container-fluid{}
header .logo{padding: 35px; left: 10%;}
header .menu{display: flex;  gap: 100px; left: -10%;}
header .menu li{
    font-size: 16px; text-transform: uppercase;
    list-style: none; padding-top: 40px; }
header .ham-btn{
    position: absolute;
    width: 60px; height: 60px;
    text-align: center;
    right: 15px; top: 42px;
}
@media(max-width:992px){
    header .logo img{margin: auto;}
    header .ham-btn{right: auto; left: 0;}
}

footer{ padding: 50px 0; background-color: rgb(215, 209, 202);}
footer p{color: white; }

/*index섹션*/
.section1 img{width: 100%;}


.section2 .item img{width: 100%; transition: all 0.5s;}
.section2 .img-box{overflow: hidden;  }
.section2 .img-box img:hover {transform: scale(1.1); }


.section3 .item{ margin: 50px 0; }
.section3 .item img{
    margin: 20px auto; width: 100%;}

.section4 .item img{width: 100%;}
.section4 .item{transition: 1s;}

.section5 .item{margin-bottom: 40px;}
.section5 .item img{
    margin: 20px auto; width: 100%;}

.section5 .item1{opacity: 1; }
.section5 .item2{
    position: absolute;
    opacity: 0; top: 0;
}
.section5 .item:hover .item1{opacity: 0;}
.section5 .item:hover .item2{opacity: 1;}
.section5 button{
    padding: 10px 30px;
    background-color: transparent;
    font-size: 20px;
}
.section5 button:hover{font-weight: 700;}

.section6{background-color: #f6f6f6;
    width:100%; height: 300px;}
.section6 .item{
    border: 1px solid red;
    display: flex;
    align-items: center;justify-content: center;
}
.section6 input{
    background-color: white;height: 50px; outline: none;
    border: none; padding: 10px; box-sizing: border-box;
}
.section6 button{
    background-color: rgb(193, 184, 175);  color: white;
    padding: 10px; box-sizing: border-box; height: 50px;
    border: none;
    }


/*about섹션*/
.about{padding: 50px 0;}
.about .section-title{top: 50px;}
.about .section-title h2{text-align: left; }
.about .section-title h2::before{left: 0;}

/*letter섹션*/
.letter{background-image: url(img/contact.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: right;
    padding: 50px 0 0 0;
    height: 350px; }
.letter input{
    background-color: white;height: 50px;  outline: none;
    border: none; padding: 10px; box-sizing: border-box;
}
.letter button{
    background-color: rgb(193, 184, 175); color: white;
    padding: 10px; box-sizing: border-box; height: 50px;
    border: none;
}

/*collection섹션*/
.page-title img{width: 100%; min-height: 200px; object-fit: cover;}
.page-title .section-title{
    position: absolute; top: 50%; left: 50%;
    transform: translate(-50%,-50%);
}
.page-title .section-title h2{color: white;}
.page-title .section-title h2::before{background-color: white;}



.grid .container{ padding: 100px 0;}
.grid .item button{
    border: none; background-color: transparent;
    border-bottom: 1px solid #666666;
    margin: 20px 0;
    color: #666666;
}
.grid .item img{transition: 1s; cursor: pointer;}



/*contact섹션*/
.contact{background-color: #f3f3f3; padding:135px 0 100px;}
.contact .section-title h2{text-align: left;}
.contact .section-title h2::before{left:0;}
.contact input{
    background-color: white; height: 50px;  outline: none;
    border: none; padding: 10px; box-sizing: border-box;
    margin: 10px 0;
}
.contact .input3 input {padding:25px 10px 150px 10px}
.contact button{
    background-color:rgb(193, 184, 175);  color: white;
    padding: 10px; box-sizing: border-box; height: 50px;
    border: none; 
    margin: 10px 0;
}

/*shop*/
.grid h3{font-size: 15px;}