/**{margin: 0;padding: 0;}*/
.fs-l-main{padding: 0;}
.wrapper{padding-right: calc(50vw - 50%);padding-left: calc(50vw - 50%);/*display: inline-block;*/font-family: 'Noto Serif JP', serif;color: var(--main-white);padding-bottom: 40px;} 
/*Attention*/
#attention.wrapper {padding-bottom: 0;}

/*背景色*/ 
.section1{margin-right: calc(50% - 50vw);margin-left: calc(50% - 50vw);background-color: #002F4E;}
.section2{margin-right: calc(50% - 50vw);margin-left: calc(50% - 50vw);background-color: #27475A;}
.section3{margin-right: calc(50% - 50vw);margin-left: calc(50% - 50vw);background-color: #406A87;}
.section4{margin-right: calc(50% - 50vw);margin-left: calc(50% - 50vw);background-color: #13517A;}   


/*セクションタイトル*/
.ttl-lead{text-align: center;padding: 40px 0;}
.patisserie-section-title{font-family: serif;font-size: 32px;font-feature-settings: "palt";letter-spacing: 0.05em;}
.patisserie-section-title-kanren{font-size: 28px;font-feature-settings: "palt";letter-spacing: 0.05em;}
/* 768px以上に適用されるCSS（PC用） */  
@media screen and (min-width: 768px) {
.patisserie-section-title{font-size: 38px;font-weight: bold;}
.patisserie-section-title-kanren{font-size: 34px;}}


/*各グループページストーリー*/   
.ttl-lead-story{text-align: center;padding: 40px 0;}
.ttl-lead-story img{width:70%;}
/* 768px以上に適用されるCSS（PC用） */  
@media screen and (min-width: 768px) {
.ttl-lead-story{padding: 30px 0px 40px;}
.ttl-lead-story img{width:40%;}}   


/*各グループページストーリー文字指定*/ 
.patisserie-section-title2{font-size: 22px !important;line-height: 1.6;color: #fff;font-feature-settings: "palt";letter-spacing: 0.05em;text-shadow: #002F4E 1px 0 10px;}
/* 768px以上に適用されるCSS（PC用） */
@media screen and (min-width: 768px) {
.patisserie-section-title2{font-size: 40px !important;}}


/*メインプロダクト*/
.container{width: 100%;margin: 0 auto;}
.area01{display: flex;flex-direction: column;align-items: center;padding: 20px;}
.area02{display: flex;flex-direction: column-reverse;align-items: center;padding: 20px;}
.contents-item{width: 100%;padding: 10px;text-align: center;}
.subttl-lead{width: 80%; margin: 0 auto;}
.contents-item h3{font-size: 20px;font-weight: bold;}   
.contents-item p{font-size: 14px;line-height: 1.4;padding: 14px;}
.contents-item-title{font-size: 28px !important;font-feature-settings: "palt";letter-spacing: 0.05em;}
.txt-content{font-size: 14px;line-height: 1.6;padding: 14px;text-align: center;}
.concept-ornament {width: 180px !important;margin-top: 0;}
.ornament {width: 180px !important;margin-top: 0;}

/* 768px以上に適用されるCSS（PC用） */
@media screen and (min-width: 768px) { 
.container{width: 80%;}
.area01,.area02{display: flex;flex-direction: row;justify-content: center;padding: 20px;margin: 0 auto;} 
.contents-item{width: 50%;padding: 10px;} 
.subttl-lead{width: 340px;}
.contents-item h3{font-size: 22px;}
.contents-item p{font-size: 18px;line-height: 1.6;}
.contents-item-title{font-size: 34px !important;}
.txt-content{font-size: 18px;line-height: 1.6;}
.concept-ornament {width: 240px !important;margin-top: 8px;}
.ornament {width: 240px !important;margin-top: 8px;}
}



/*ボタン設定*/  
.top-btn{list-style: none; padding-left: 0;display: flex;justify-content: center;}
.p-btn{padding: 0 4px;box-sizing: border-box;}
.p-btn a{appearance: none;font-family: inherit;display: inline-block;
min-width: 100px;border: 0;border-radius: 20px;background: #C9A030;color: var(--main-white);padding: 10px 20px;font-size: 1.4rem;text-decoration: none;cursor: pointer;transition: 0.3s ease-out;
&:hover{background: #AB8622;}}    
.p-btn02 a{appearance: none;font-family: inherit;display: inline-block;
min-width: 300px;border: 0;border-radius: 20px;background: #C9A030;
color: var(--main-white);padding: 10px 20px;font-size: 1.4rem;text-decoration: none;cursor: pointer;transition: 0.3s ease-out;margin-top: 10px;
&:hover {background: #AB8622;}}      



/*コンセプト*/
.concept-copy {background-image: url(https://ginnomori.itembox.design/item/patisserie/top/sp_topbnr_concept2.jpg);width: 100%;background-position: bottom !important;background-size: cover;background-position: center;text-align: center;}
.concept-copy-title {font-family: serif;font-size: 32px !important;font-weight: bold;color: #fff;font-feature-settings: "palt";letter-spacing: 0.05em;margin-top: 64px;text-shadow: #002F4E 1px 0 10px;}
.concept-copy-subtitle {font-size: 22px !important;line-height: 1.6;color: #fff;font-feature-settings: "palt";letter-spacing: 0.05em;margin-top: 32px;text-shadow: #002F4E 1px 0 10px;}
.concept-copy-text {font-size: 16px !important;line-height: 2.1;color: #fff;font-feature-settings: "palt";letter-spacing: 0.05em;margin-top: 32px;margin-bottom: 128px;text-shadow: #002F4E 1px 0 10px;}
/* 768px以上に適用されるCSS（PC用） */
@media screen and (min-width: 768px) {
.concept-copy {background-image: url(https://ginnomori.itembox.design/item/patisserie/top/pc_topbnr_concept2.jpg);}
.concept-copy-title {font-size: 38px !important;margin-top: 96px;}
.concept-copy-subtitle {font-size: 40px !important;margin-top: 64px;}
.concept-copy-text {font-size: 24px !important;margin-bottom: 256px;margin-top: 64px;}
}



/*関連商品*/
.flexbox{display: flex;flex-wrap:wrap;text-align: center;justify-content: center;gap: 10px 10px;/*縦10px,横10pxの余白指定*/
/*margin-bottom: 40px;*/}
.flex-item {width: 30%;flex-shrink: 0;}
.flex-item-option{width: 45%;}
.common-txt{color: var(--main-white);font-size: 14px;}
.sns-list{list-style: none; padding-left: 0;display: flex;justify-content: center;margin-bottom: 60px;}   
.sns-item{width: 15%;margin: 0px 10px;}
.gentei{font-size: 14px !important;font-feature-settings: "palt";letter-spacing: 0.2em;background-color: #64baf2;border-radius: 100vh;width: 200px;margin: 0 auto;padding: 8px 14px !important;}
/* 768px以上に適用されるCSS（PC用） */  
@media screen and (min-width: 768px) {
.flexbox{display: flex;flex-wrap:wrap;text-align: center;gap: 20px 30px;/*縦20px,横30pxの余白指定*//*margin-bottom: 40px;*/}
.flex-item {width: 25%;}
.flex-item-option{width: 20%;}
.common-txt{font-size: 20px; }  
.sns-item{width: 5%;margin: 0px 10px;}}

/*公式サイト店舗のご案内バナー*/
.store-bnr {position: relative;}
.store-bnr-text {position: absolute;font-size: 24px;text-align: center;font-feature-settings: "palt";letter-spacing: 0.05em;left: 12%;top: 50%;transform: translateY(-50%);}
/* 768px以上に適用されるCSS（PC用） */
@media screen and (min-width: 768px) {
.store-bnr-text {font-size: 48px;left: 15%;}
}

/*画像バナー差し込み*/
.bg-image{display: flex;justify-content: center;margin-right: calc(50% - 50vw);margin-left: calc(50% - 50vw);background-color: #061c34;margin-top: 0px;}
.bg-image02{display: flex;justify-content: center;margin-right: calc(50% - 50vw);margin-left: calc(50% - 50vw);background-color: #061c34;margin-top: 0px;flex-direction: column;align-items: center;}
.bg-image2{display: flex;justify-content: center;margin-right: calc(50% - 50vw);margin-left: calc(50% - 50vw);background-color: #002F4E;}
.store-bnr{display: flex;justify-content: center;margin-right: calc(50% - 50vw);margin-left: calc(50% - 50vw);background-color: #13517A;}
/* 768px以上に適用されるCSS（PC用） */  
@media screen and (min-width: 768px) {
.bg-image{display: flex;justify-content: center;margin-right: calc(50% - 50vw);margin-left: calc(50% - 50vw);background-color: #061c34;margin-top: 800px;/*560px*/}
.bg-image02{display: flex;justify-content: center;margin-right: calc(50% - 50vw);margin-left: calc(50% - 50vw);background-color: #061c34;/*margin-top: 55px;/*560px*/flex-direction: column;align-items: center;}}


/*ティーウェア画像バナー*/
.teaware-bnr{margin: 0 auto;width: 80%;margin-bottom: 60px;margin-top: 40px;}

/*改行*/
.sp_br{display: none;/*改行タグ無効*/}
/* 768px以上に適用されるCSS（PC用） */
@media screen and (max-width: 767px) {
.sp_br{display: block; /*768px未満改行タグ有効*/}}



/*TOPカルーセル*/
.top_carousel {width: 100%;position: relative;padding-bottom: 29.81949%;/* (826/2770)*100% */}
.sp_img {display: none !important;}
.pc_img {display: block !important;}

@media screen and (max-width: 767px) {
.top_carousel {width: 100%;position: relative;padding-bottom: 111.111111%;/* (1000/900)*100% */}
.sp_img { display: block !important;}
.pc_img {display: none !important;}
}

.top_carousel img { 
animation: fade 9s infinite;/*合計時間*/
-webkit-animation: fade 9s infinite;
-moz-animation: fade 9s infinite;
width: 100%;height: 100%;opacity: 0;position: absolute;top: 0;left: 0;}

@keyframes fade {
  0% {opacity: 0;}
  30% {opacity: 1;}
  35% {opacity: 1;}
  50% {opacity: 0;}
  100% {opacity: 0;}
}

@-webkit-keyframes fade {

  0% {opacity: 0;}
  30% {opacity: 1;}
  35% {opacity: 1;}
  50% {opacity: 0;}
  100% {opacity: 0;}
}

@-moz-keyframes fade {

  0% {opacity: 0;}
  30% {opacity: 1;}
  35% {opacity: 1;}
  50% {opacity: 0;}
  100% {opacity: 0;}

}

.top_carousel img:nth-of-type(1) {
    animation-delay: 0s;
    -webkit-animation-delay: 0s;
    -moz-animation-delay: 0s;
}

.top_carousel img:nth-of-type(2) {
    animation-delay: 3s;
    -webkit-animation-delay: 3s;
    -moz-animation-delay: 3s;
}

.top_carousel img:nth-of-type(3) {
    animation-delay: 6s;
    -webkit-animation-delay: 6s;
    -moz-animation-delay: 6s;
}

.concept picture img {
  vertical-align: bottom;
} 

