/*home*/

/*full screen
.snapscroll{
scroll-snap-type: y mandatory;
}
.slide {
height: 100vh;
display: flex;
justify-content: center;
align-items: center;
}*/

#home #sec01{
background:url(https://cozy-milk.com/cms/wp-content/uploads/2026/02/home_sec01_bg.jpg) no-repeat center center;
background-size:cover;
display: flex;
justify-content: center;
align-items: center;
}
#home #sec01 .logo{
width:33%;
order:1;
}
#home #sec01 .logo h2{
max-width:300px;
background:rgba(255,255,255,0.8);
padding:20px;
margin:0 auto;
}
#home #sec01 .text{
width:33%;
}
#home #sec01 .bottle{
width:33%;
order:2;
text-align:center;
}
#home #sec01 .bottle img{
max-width:240px;
}

#home #sec02{
background:#f7f4ed;
display: flex;
justify-content: center;
align-items: center;
}
#home #sec02 .text{
width:50%;
order:2;
}
#home #sec02 .bottle{
width:25%;
order:1;
text-align:center;
}
#home #sec02 .bottle img{
max-width:240px;
}
#home #sec02 .photo{
width:25%;
order:3;
}

#home #sec03{
background:#f5f9fa;
}
#home #sec03 .row01 .left{
width:50%;
display:flex;
align-items:center;
justify-content:center;
padding-right:50px;
}
#home #sec03 .row01 .left img{
border-radius:10px;
width:100%;
max-width:600px;
}
#home #sec03 .row01 .right{
width:50%;
}
#home #sec03 .row01 h3{
border-bottom:5px solid #7fcdc7;
margin-bottom:1em;
}
#home #sec03 .row01 li{
border-top:1px solid #ccc;
border-bottom:1px solid #ccc;
border-right:1px solid #ccc;
border-left:5px solid #7fcdc7;
border-radius:5px;
margin-bottom:1em;
padding:10px 10px 10px 110px;
background-size:90px;
background-repeat:no-repeat;
background-position:10px center;
background-color:#fff;
}
#home #sec03 .row01 li:nth-child(1){background-image:url(https://cozy-milk.com/cms/wp-content/uploads/2026/02/home_sec03_icon01.png)}
#home #sec03 .row01 li:nth-child(2){background-image:url(https://cozy-milk.com/cms/wp-content/uploads/2026/02/home_sec03_icon02.png)}
#home #sec03 .row01 li:nth-child(3){background-image:url(https://cozy-milk.com/cms/wp-content/uploads/2026/02/home_sec03_icon03.png)}
#home #sec03 .row01 li:nth-child(4){background-image:url(https://cozy-milk.com/cms/wp-content/uploads/2026/02/home_sec03_icon04.png)}
#home #sec03 .row01 li:nth-child(5){background-image:url(https://cozy-milk.com/cms/wp-content/uploads/2026/02/home_sec03_icon05.png)}

#home #sec03 .row02 .col2{

}

#home #sec04{
background:url(https://cozy-milk.com/cms/wp-content/uploads/2026/02/home_sec04_bg.jpg) no-repeat center center;
background-size:cover;
padding-top:0px;
text-align:center;
}
#home #sec04 h2{
display:inline-block;
background:rgba(255,255,255,0.8);
border-radius:0px 0px 10px 10px;
padding:10px 20px;
margin-bottom:50px;
}
#home #sec04 ul{
width:50%;
display:grid;
grid-template-columns: 1fr 1fr;
gap:50px;
}
#home #sec04 li{
background:rgba(255,255,255,0.8);
padding:10px;
border-radius:10px;
}
#home #sec04 .desc{
background:rgba(255,255,255,0.8);
padding:20px;
border-radius:10px;
text-align:left;
}

#home #sec05{
background:#f5f9fa;
}
#home #sec05 .row01{
align-items:center;
}

#home #sec05 .row02 li{
justify-content:left;
align-items:center;
width:33%;
}
#home #sec05 .row02 .icon{
max-width:100px;
margin-right:10px;
}

#home #sec06{
background:#eee;
}
#home #sec06 ul{
display:grid;
grid-template-columns:1fr 1fr;
gap:50px;
}
#home #sec06 li{
background:#fff;
padding:10px;
box-shadow: 10px 10px 0px #7fcdc7;
border-radius:10px;
display:flex;
align-items:center;
}
#home #sec06 .icon{
width:100px;
margin-right:10px;
}
#home #sec07{
padding:0px;
}
#home #sec07 .row01{
background:url(https://cozy-milk.com/cms/wp-content/uploads/2026/02/home_sec07_photo-1.jpg) center center no-repeat;
background-size:cover;
color:#fff;
text-align:center;
padding-top:200px;
}
#home #sec07 .row01 h2{
background:rgba(255,255,255,0.3);
padding:20px 50px;
}
#home #sec07 .row02{
background:#f7f4ed;
padding:50px;
}
#home #sec07 .row02 ul{
display: grid;
grid-template-columns:1fr 1fr 1fr 1fr 1fr;
gap:20px;
}
#home #sec07 .row02 li{
border:2px solid #7fcdc7;
border-radius:10px;
padding:10px;
text-align:center;
background:#fff;
box-shadow: 0px 0px 10px rgba(0,0,0,0.3);
}
#home #sec07 .row02 .icon{
width:100px;
margin:0 auto 10px auto;
}

#home #contact{
background:#f5f9fa;
}

#home #contact .box{
max-width:600px;
margin:0 auto;
border:2px solid #7fcdc7;
border-radius:10px;
padding:50px 20px;
background:#fff;
}
#home #contact .text{
width:100%;
font-size:16px;
padding:5px;
border:1px solid #ccc;
border-radius:5px;
}
#home #contact .textarea{
width:100%;
height:200px;
font-size:16px;
padding:5px;
border:1px solid #ccc;
border-radius:5px;
}
#home #contact .submit{
background:#F74632;
color:#fff;
font-size:18px;
font-weight:bold;
padding:10px 20px;
border-radius:5px;
border:none;
}

@media screen and (max-width : 1024px) {
 
#home #sec01 .logo{width:50%;}
#home #sec01 .text{width:50%;}
#home #sec01 .bottle{display:none;}

#home #sec02 .text{width:66%;}
#home #sec02 .bottle{width:33%;padding-right:50px;}
#home #sec02 .photo{display:none;}

#home #sec03 .row01 .left{display:none;}
#home #sec03 .row01 .right{width:100%;}

#home #sec04 ul{width:100%;}

}

@media screen and (max-width : 800px) {
 
#home #sec01{
background:#78b8c4;
display: block;
padding-bottom:20px;
}
#home #sec01 .logo{width:100%; margin-bottom:50px;}
#home #sec01 .text{width:100%;}

#home #sec02{display: block}
#home #sec02 .text{width:100%; margin-bottom:50px;}
#home #sec02 .bottle{width:100%;padding-right:0px;}
#home #sec02 .bottle img{max-width:150px;}

#home #sec03{display: block}

#home #sec04 ul{grid-template-columns: 1fr;}

#home #sec05 .illust{max-width:300px;margin:0 auto;}
#home #sec05 .arrow{max-width:50px;margin:50px auto;}
#home #sec05 .row02 li{width:100%;text-align:center; margin-bottom:50px;width:100%;}
#home #sec05 .row02 .icon{margin-right:auto;margin-left:auto;}

#home #sec06 ul{grid-template-columns:1fr;}

#home #sec07 .row02 ul{grid-template-columns:1fr;}
 
}