@import url('https://fonts.googleapis.com/css2?family=Sawarabi+Gothic&display=swap');
.buono-body{
font-family: 'Sawarabi Gothic', sans-serif;
overflow: hidden;
}
.buono-catch{
letter-spacing: .24em;
line-height: 2.7;
font-size:1.8rem;
font-weight: 300;
text-align:center;
}
.buono-sub{
letter-spacing: .24em;
font-size:2.5rem;
font-weight: 300;
color:#ffcfb2;
text-align:center;
}
.buono-teaser-sub{
letter-spacing: .24em;
font-size:4.5rem;
font-weight: 350;
color:#ffb4d4;
text-align:center;
}
.buono-sub-white{
letter-spacing: .24em;
font-size:2.5rem;
font-weight: 300;
color:#fff;
text-align:center;
}
.story-item-sub{
text-align:center;
}
.story-item-sub p{
letter-spacing: .24em;
font-size:2.5rem;
font-weight: 300;
background:#ffcfb2;
color: #fff;
display: inline-block;
padding: 0 30px;
border-radius:30px;
}
.story-item .block-products{
margin:auto;
}
.sp-br{
display:none;
}
.img-parent{
position:relative;
}
.img-bg-01{
background: radial-gradient(#ffcfb2, #ffcfb240);
width:600px;
height:600px;
position:absolute;
top: 300px;
left: 200px;
z-index: 0;
border-radius:50%;
}
.img-bg-02{
background: radial-gradient(#ffcfb2, #ffcfb240);
width: 800px;
height: 800px;
position: absolute;
top: -230px;
left: 1020px;
z-index: 0;
border-radius:50%;
}
.img-bg-03{
background: radial-gradient(#ffcfb2, #ffcfb240);
width: 450px;
height: 450px;
position: absolute;
top: -30px;
left: 230px;
z-index: 0;
border-radius:50%;
}
.img-bg-04{
background: radial-gradient(#ffcfb2, #ffcfb240);
width:800px;
height: 800px;
position: absolute;
top: 390px;
left: 1180px;
z-index: 0;
border-radius:50%;
}
.buono-profile{
border: solid 1px #ffcfb2;
width:880px;
margin:0 auto;
}
.buono-news{
background-color: #ffcfb2;
width:880px;
margin:0 auto;
}
.buono-video{
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
@media (max-width: 768px){
.buono-catch{
line-height: 2.5;
font-size:2.3rem;
}
.buono-sub,
.story-item-sub{
font-size:3rem;
}
.buono-teaser-sub,
.story-item-sub{
font-size:5rem;
}
.story-item-sub p{
padding: 5px 30px;
}
.sp-br{
display: inline-block;
}
.pc-br{
display:none;
}
.img-bg-01{
width: 50%;
height: 57%;
top: 200px;
left: -60px;
}
.img-bg-02{
width:60%;
height:67%;
top: -35px;
left: 220px;
}
.img-bg-03{
width: 50%;
height:57%;
top: -25px;
left: -50px;
}
.img-bg-04{
width: 60%;
height:67%;
top: 200px;
left: 220px;
}
.buono-profile{
width:auto;
margin:0 20px;
}
.buono-news{
width:auto;
margin:0 20px;
}
}
まるでフルーツのようにみずみずしく。
色とりどりに輝く「iOのある日々」の物語。
思わず笑みがこぼれる
Buono!（おいしい！）な毎日をつくります。
思わず触れたくなる
あふれる想いが伝わる瞬間
〜CREAMのストーリー〜