@charset "UTF-8";

body {
font-family:
"游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" ,
"ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" ,"HiraMinProN-W3",
"HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" ,
serif;

	/*padding: 0 10%;*/
font-family: "ten-mincho-text", serif;
font-weight: 400;
font-style: normal;
padding:0;
margin:0;
}

.for-pc { display:block; }
.for-sp { display:none; }

/*===========header↓↓===========*/
header.fs-l-header{
  width: 100%;

}
.header--nav--pc {
  width: 100%;
  height:10%;
  background-color: #8b0000;
  padding:0;
  margin: 0;
  position: -webkit-sticky;
  position:         sticky;
  top: 0;
  border-bottom: 3px solid #8b0000; 
}

.header--nav--pc ul{
	margin: 0;
	display: flex;
	flex-wrap: nowrap;
	padding: 0.5em 0 0.5em 1em;
}

.header--nav--pc ul li{
	width:100%;
	list-style: none;
	text-align: center;
	font-size: 1em;

}

.g--nav--pc a {
	color:#ffffff;
	text-decoration: none;
	display:block;
	
}
.g--nav--pc a:hover {
	opacity: 0.5;
	text-decoration: underline;
	
}
.fs-p-headerNavBar {
background:#8b0000;
/*margin-bottom:50px;*/

}

.fs-p-headerNavigation{
  width: 100%;
  margin: 10px 0 0 auto;
  display:block;



}


.fs-p-headerNavigation__link{
color:#fffffc;

}

.fs-p-headerNavigation__link:visited{
color:#fffffc;
}

.fs-p-headerNavigation__link:hover{

}

/*===========header↑↑===========*/

.fs-p-messageBoard {
	width:100%;
}

/*--横並び画像↓↓--*/
	.flex-container{
	display: flex;
  	justify-content: space-between;
	flex-wrap: wrap;

	margin:0 0 2%;

	
}
.flex-container img{
		vertical-align: middle;
margin-top:0.75em;
}
.flex-container p{
	font-size: 1rem;
	text-align: center;
	margin-top: 0.5rem;
	font-family: "Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;

}
.flex-container h2{
	font-size: 1.8rem;
	text-align: center;
	margin:0.5rem 0 1.8rem;
}
.flex-container h3{
	font-size: 1.4rem;
	text-align: center;
	margin:0.5rem 0 1.4rem;
}

.flex-container a{
	text-decoration: none;
	color: #999999;
}

.flex-container a:hover{
opacity: 0.5;
transition: 0.5s;
}

.flex-container-item-7clm {
	width:13.7% ;

	
}

.flex-container-item-5clm {
	width:19.2% ;

	
}
.flex-container-item-4clm,.flex-container-maplist {
	width:24% ;

	
}
.flex-container-item-3clm {
	width:32% ;

	
}
.flex-container:after {
	content: "";
    display: block;
    width: 19.2%;  /* .boxに指定したwidthと同じ幅を指定する */
    height: 0;
}
h2.period-label,.flex-container-shoplist h3.period-label {
	margin:0.5rem 0;
}

p.period {
    margin:0.5rem 0 2rem 0;
}
/*--横並び画像↑↑--*/

/*--見出し↓↓--*/
.fs-p-heading--lv2 {
margin-bottom:0.5em;

}
.fs-p-heading--lv2 h2 {
line-height:0.25;



}
.sub-name {
    font-size:1em;
    margin-bottom:0;
    color:#0f2350;

}

.fs-c-documentArticle__heading {
background-color:#afafb0;
line-height:2;

}

.fs-c-documentColumn__heading {
color: #3f312b;
}

/*--見出し↑↑--*/

/*--エリア幅↓↓--*/
.container-box{
padding:0 7%;
}

body.fs-body-top main{
padding:0 7%;

} 
/*--エリア幅↑↑--*/



/*foodlabel↓↓*/
.foodlabel {
  margin-top: 3em;
}

.foodlabel-other {
  text-indent: 1em;
}

.foodlabel div{
  display:flex;
  justify-content: flex-start;
  padding: 1em;
  border-bottom: 1px solid #afafb0;
}
 .foodlabel dt {
  width: 25%;
  color:#3f312b;
  font-weight:bold;   
}
.foodlabel dd {
  margin-left: 0;
  width:65%;
  color:#3f312b;


}
.foodlabel a{
text-decoration:none;
}


.flex-container3--2 {
	display: flex;
  	justify-content: space-between;
	flex-wrap: wrap;
	font-size:2.2rem;
	line-height:2;
	margin:0 1em 1em 1em;


}

div.foodlabel--item {
 	width:30.5%;
 	position: relative;
 	padding-left: 66px;
	border-bottom:1px dotted #333333;
	margin:0.5em 0;

}

div.foodlabel--item:hover {
	border-bottom:1px solid #2ca9e1;

}
.foodlabel--item a:hover{
	text-decoration:none;

}


.foodlabel--item:nth-child(1) a::before {
content: url(https://yubeshi.itembox.design/item/icn-ybs-kaden.png?t=20250712114707);
  transform: scale(0.25);
position: absolute;
  top: -86px;
  left: -66px;
}
.foodlabel--item:nth-child(2)  a::before {
content: url(https://yubeshi.itembox.design/item/icn-ybs-kurumi.png?t=20250712114707);
  transform: scale(0.25);
position: absolute;
  top: -86px;
  left: -66px;
}
.foodlabel--item:nth-child(3)  a::before {
content: url(https://yubeshi.itembox.design/item/icn-ybs-other.png?t=20250712114707);
  transform: scale(0.25);
position: absolute;
  top: -86px;
  left: -66px;
}
.foodlabel--item:nth-child(4)  a::before {
content: url(https://yubeshi.itembox.design/item/icn-wagashi.png?t=20250712114707);
  transform: scale(0.25);
position: absolute;
  top: -86px;
  left: -66px;
}
.foodlabel--item:nth-child(5)  a::before {
content: url(https://yubeshi.itembox.design/item/icn-senbei.png?t=20250712114707);
  transform: scale(0.25);
position: absolute;
  top: -86px;
  left: -66px;
}
.foodlabel--item:nth-child(6)  a::before {
content: url(https://yubeshi.itembox.design/item/icn-sable.png?t=20250712114707);
  transform: scale(0.25);
position: absolute;
  top: -86px;
  left: -66px;
}
/**/


/*foodlabel↑↑*/

.label-right {
text-align:right;
margin-top:2em;
margin-right:2em;
}

.label-right span {
font-size:1.5em;

}

/*価格表記を￥→円に変更↓↓*/
.fs-c-price__currencyMark {
display: none;
}
.fs-c-price::after {
content: "円";
font-size:75%;
}

.fs-c-productPrice__addon:where(:not([class*="--listed"]))::before, .fs-c-productPrice__main__addon:where(:not([class*="--listed"]))::before {
    content: "(";
font-size:75%;
}
.fs-c-productPrice__addon:where(:not([class*="--listed"]))::after, .fs-c-productPrice__main__addon:where(:not([class*="--listed"]))::after {
    content: ")";
font-size:75%;
}
.fs-c-productPrice__addon__label, .fs-c-productPrice__main__label{
font-size:80%;
}

/*価格表記を￥→円に変更↑↑*/

/*tabledesign↓↓*/

.tabledesign dl {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
}

.tabledesign dt {
  width: 16%;
  padding: 1em;
  background-color: #f3f3f2;
  margin: 0 0 10px 0;
  border-top-left-radius: 3px;
  border-bottom-left-radius: 3px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.tabledesign dd {
  width: 84%;
  padding: 1em;
  background-color: #ffffff;
  margin: 0 0 10px 0;
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
}

.tabledesign　ul {
padding-left: -3em;
}



/*tabledesign↑↑*/

.shop-holiday{
color:#8b0000;
}


ul.fs-c-list{
list-style:none;
} 

.shop-timechange{
display:block;
margin:0;
background-color:#ffffff;
color:#8b0000;
font-weight:bold;
font-size:1em;
}
.shop-timechange p{
border:1px solid #8b0000;
border-left:10px solid #8b0000;
padding:1em;
color:#8b0000;

}

.shop-timechange p span{
font-size:1.25em;
}

/*===========news↓↓===========*/
.fs-newslist-archive h2,.fs-newslist-archive h3{
margin-top:0;
font-size:1.25em;
} 


.fs-pt-list__link h2 {
text-underline-offset:0.25em;
}

.fs-pt-list__link h2::before {
 font-family: "Font Awesome 6 Free";
 content: '\f0da';
 font-weight: 900;
}
.fs-newslist-archive li {
margin-bottom:1em;
padding-left:2em;
border-bottom:1px dotted #3f321b;

}
a.fs-pt-list__link:hover{
text-decoration: none;
}

.newslist {
padding:0 15%;
}

.newslist p {
line-height:1.5;
padding:0.5 0;
}

.newslist h3 {
text-size:1.25em;
margin:2em 0 auto;
}

ul.list-indent, dl.list-indent  {
}

ul.list-indent li{
list-style-type:none;
margin:0.25em 0;
margin-left:-2.8em;

}
dl.list-indent dt, dl.list-indent dd{

list-style-type:none;
margin:0.25em 0;

}
ul.list-indent-ast, dl.list-indent-ast  {
margin-left:0;
padding:0 1em;
}

ul.list-indent-ast li, dl.list-indent-ast dt, dl.list-indent-ast dd{

list-style-type:none;
margin:0.25em 0;

}
ul.list-indent-ast li::before,  dl.list-indent-ast dd::before {
content:"※";
}

div.frame-attention {
 display: inline-block;
 border: 10px solid;
 border-image:url(" https://yubeshi.itembox.design/item/bg_border.png")95/12px 0px repeat;

 margin:1em 0:

}

summary {
  /* display: list-item;以外を指定してデフォルトの三角形アイコンを消します */
  display: block;
margin-left:2em;
}

summary::-webkit-details-marker {
  /* Safariで表示されるデフォルトの三角形アイコンを消します */
  display: none;
}

summary:hover {
opacity:0.6;
cursor: pointer;
}

/* 開いている状態 */
details[open] .do-open {
	display: none ;
}

/* 閉じている状態 */
details:not([open]) .do-close {
	display: none ;
}

/*===========news↑↑===========*/

/*===========footer↓↓===========*/
.f-nav {
    list-style: none;
    display: flex;
    padding: 0 15%;
font-family: "Helvetica Neue",
    Arial,
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans",
    Meiryo,
    sans-serif;

}


.f-nav li{
    width: 100%;
    display: flex;
    margin: 0 ;
	
}

.f-nav a{
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    width: 100%;
    padding: 0 5px;
    text-decoration: none;
	color:#3f312b;
	font-size:1rem;
}
.f-nav a:hover{
    opacity:0.5;
}

.f-nav li+li{
    position: relative;
}
.f-nav li+li::before{
    content: "";
    display: block;
    height: 1em;
    border-left: 1px solid #3f312b;
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
}

/*コピーライト↓↓*/
.fs-p-footerCopyright{
  padding:3em auto;
  font-family: "Helvetica Neue",
    Arial,
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans",
    Meiryo,
    sans-serif;
margin:0;
padding:0;

}

.fs-p-footerCopyright p{
font-size:1.6rem;
line-height:2.5;
color:#fffffc;
background-color:#8b0000;
border:none;
outline: none;

}

/*コピーライト↑↑*/
/*===========footer↑↑===========*/


/*==========parts↓↓===========*/
.btn-list a{
	display: block;
	text-align: center;
	text-decoration: none;
	width: 300px;
	margin: 4em auto;
	margin-bottom:8em ;
	padding: 1rem 4rem;
	font-weight: bold;
	border: 2px solid #8b0000;
	color: #8b0000;
	transition: 0.7s;
	line-height:2.5;
}
.btn-list a:hover {
	color: #fff;
	background: #8b0000;
}
.btn-list-blue a{
	display: block;
	text-align: center;
	text-decoration: none;
	width: 300px;
	margin: 4em auto;
	margin-bottom:8em ;
	padding: 1rem 4rem;
	font-weight: bold;
	border: 2px solid #0f2350;
	color: #0f2350;
	transition: 0.7s;
	line-height:2.5;
}
.btn-list-blue a:hover {
	color: #fff;
	background: #0f2350;
}

.btn-p-banner a{
	display: block;
	text-align: center;
	text-decoration: none;
	width: 100%;
	margin: auto;
	padding: 1.6rem ;
	font-size: 1.6rem;
	border-radius:3px;
	transition: 0.5s;
	line-height:1.5;
}

.btn-p-banner a:hover{
	opacity: 0.5;
}

/*カートボタン固定表示↓↓*/
.fs-p-scrollingCartButton {
    bottom: 22%;
}
/*カートボタン固定表示↑↑*/

/*あとxxxで送料無料↓↓*/
.fs-c-cartDiscountInfo__info {
	font-size:2em;
}
/*あとxxxで送料無料↑↑*/

/*画像ホスティングサムネイル↓↓*/
.fs-c-productThumbnail__image {
min-width:82px;
margin:0 4px;
}
/*画像ホスティングサムネイル↑↑*/

.flex-container--item-btn {
	display: flex;
  	
	flex-wrap: wrap;
	font-size:1.4rem;
	line-height:2;
	margin:;


}
.flex-container--item-btn li {
list-style:none;
margin:0.25em 0;
}

.flex-container--item-btn li a {
border:solid 1px #3f312b;
border-radius: 25px; 
padding:0 1em;
margin:auto 0.5em;

}
.flex-container--item-btn li a:hover {
background:#2ca9e1;
color:#fffffc;
border:solid 1px #2ca9e1;
border-radius: 25px; 
text-decoration:none;

}

.marker-new {
    color:#ffffff;
    background-color:#e83929;
    padding:0 0.25em;
    font-size:0.8em;
    
    
}

.badge-info::after {
    font-family:"Helvetica Neue","Arial","Hiragino Kaku Gothic ProN", "Hiragino Sans","Meiryo","sans-serif";
    content:"お知らせ";
    color:#3f312b;
    background-color:#e5e4e6;
    padding:0 0.5em;
    margin-left:0.5em;
    font-size:1em; 
    vertical-align: baseline;
}

.badge-shop::after {
    font-family:"Helvetica Neue","Arial","Hiragino Kaku Gothic ProN", "Hiragino Sans","Meiryo","sans-serif";
    content:"直営店";
    color:#3f312b;
    background-color:#e5e4e6;
    padding:0 0.5em;
    margin-left:0.5em;
    font-size:1em; 
    vertical-align: baseline;
}

.badge-online::after {
    font-family:"Helvetica Neue","Arial","Hiragino Kaku Gothic ProN", "Hiragino Sans","Meiryo","sans-serif";
    content:"オンラインショップ";
    color:#3f312b;
    background-color:#e5e4e6;
    padding:0 0.5em;
    margin-left:0.5em;
    font-size:1em; 
    vertical-align: baseline;
}

.badge-sns::after {
    font-family:"Helvetica Neue","Arial","Hiragino Kaku Gothic ProN", "Hiragino Sans","Meiryo","sans-serif";
    content:"SNS";
    color:#3f312b;
    background-color:#e5e4e6;
    padding:0 0.5em;
    margin-left:0.5em;
    font-size:1em; 
    vertical-align: baseline;
}

.badge-release::after {
    font-family:"Helvetica Neue","Arial","Hiragino Kaku Gothic ProN", "Hiragino Sans","Meiryo","sans-serif";
    content:"商品情報";
    color:#3f312b;
    background-color:#e5e4e6;
    padding:0 0.5em;
    margin-left:0.5em;
    font-size:1em; 
    vertical-align: baseline;
}

.badge-others::after {
    font-family:"Helvetica Neue","Arial","Hiragino Kaku Gothic ProN", "Hiragino Sans","Meiryo","sans-serif";
    content:"その他";
    color:#3f312b;
    background-color:#e5e4e6;
    padding:0 0.5em;
    margin-left:0.5em;
    font-size:1em; 
    vertical-align: baseline;
}

.badge-important::after {
    font-family:"Helvetica Neue","Arial","Hiragino Kaku Gothic ProN", "Hiragino Sans","Meiryo","sans-serif";
    content:"重要";
    color:#ffffff;
    background-color:#e83929;
    padding:0 0.5em;
    margin-left:0.5em;
    font-size:1em; 
    vertical-align: baseline;
}

/*===========parts↑↑===========*/

/*========= pagetop↓↓===============*/
/*リンクの形状*/
#page-top a{
	display: flex;
	justify-content:center;
	align-items:center;
	border-radius: 25px;
	width: 50px;
	height: 50px;
	text-align: center;
	text-transform: uppercase; 
	text-decoration: none;
	font-size:0.6rem;
	transition:all 0.5s;
}

#page-top a:hover{
	opacity:0.5;	
}

/*リンクを右下に固定*/
#page-top {
	position: fixed;
	right: 15px;
	bottom:40px;
	z-index: 2;
    /*はじめは非表示*/
	opacity: 0;
	transform: translateY(100px);
}

/*　上に上がる動き　*/

#page-top.UpMove{
	animation: UpAnime 1.5s forwards;
}
@keyframes UpAnime{
  from {
    opacity: 0;
	transform: translateY(100px);
  }
  to {
    opacity: 1;
	transform: translateY(0);
  }
}

/*　下に下がる動き　*/

#page-top.DownMove{
	animation: DownAnime 0.5s forwards;
}
@keyframes DownAnime{
  from {
  	opacity: 1;
	transform: translateY(0);
  }
  to {
  	opacity: 1;
	transform: translateY(100px);
  }
}

/*===========pagetop↑↑===========*/

/*==========タイムライン↓↓==========*/
.co-timeline {
    width: 100%;
    max-width: 940px;
    margin: 1em auto;

}
    
.co-timeline-list {
        padding: 40px 0;
}
        
.co-timeline-list-item {
            display: flex;
            line-height: 2.5;
            font-size: 1em;

}
            
.co-timeline-date {
            width: 12%;
            padding: 0 0 0 1em;
            color: #3f312b;
            font-weight: bold;
}
            
.co-timeline-content {
            position: relative;
            width: 88%;
            padding: 0em 1em 1em 3em ;
            border-left: 1px solid #dcdddd;
}
                
.co-timeline-content::before {
            content: "";
            position: absolute;
            top: 0.75em;
            left: -0.5em;
            width: 1em;
            height: 1em;
            background-color: #8b0000;
            border-radius: 10px;
}

/*==========タイムライン↑↑==========*/

/*==========contact↓↓==========*/
#contact, #entry {
     width:100%;
     padding:0 20%;
     color:#3f312b;
}

h3.form__heading {
     margin:2em 0 0 0 ;
}

/*
.form__heading::before {
     content: "*";
     color:#8b0000;
}
*/
.form__heading::before {
     content: "*必須";
     color:#ffffff;
     background:#8b0000;
opacity:0.7;
     font-size:0.75em;
     padding:0em 0.75em;
     margin-right:0.5em;
     border-radius:2px;
}

.contact--form select,.contact--form input {
     border-radius: 3px;
}

.form--mail {
     width:100%;
     border:solid 1px #afafb0;
}

.submit--btn {
     width:40%;
     height:48px;
     align-items:center;
     margin:5% 30%;
     vertical-align: middle;
     border:solid 1px #afafb0;
     transition: 0.8s;
}

.submit--btn:hover{
	color: #fff;
	background: #8b0000;
	border:solid 1px #8b0000;

}


/*==========contact↑↑==========*/

/*==========postage↓↓==========*/
table.postage-regular {
width:100%;
margin-bottom:1em;
}

table.postage-regular caption {
 text-align: left;
}

table.postage-regular , .postage-regular td, .postage-regular th {
	border: 0.8px solid #8b0000;
	border-collapse: collapse;
}
.postage-regular td, .postage-regular th {
	height: 3em;
	text-align: center;
}
th.th-location {
	width:70%;
	background: #8b0000;
	opacity:0.7;
	color:#ffffff;
}
th.td-location {
font-size:1em;
}

td.td-area {
width:55%;
text-align:left;
padding-left: 1em;
}

th.th-postage, th.th-days {
	width:15%;
	text-align:center;
	background: #8b0000;
	opacity:0.7;
	color:#ffffff;
}

td.td-postage::after {
content:"円";
}
td.td-postage-cp::after {
	content:"円";
	color:#e83929;
}
td.td-postage-cp, td.td-df {
	color:#e83929;
}
table.postage-regular　th {
	background: #8b0000;
opacity:0.7;
color:#ffffff;
}
th.td-location {

}
td.td-df span {
-ms-writing-mode: tb-rl;
writing-mode: vertical-rl;
white-space: pre;
font-size:2em;

}

/*==========postage↑↑==========*/

/* 注意事項など文字をゴシック体で記載↓↓　*/
.imp-points-1 {
  font-family:"Helvetica Neue","Arial","Hiragino Kaku Gothic ProN", "Hiragino Sans","Meiryo","sans-serif";
  font-size:1em;
}

/* 注意事項など文字をゴシック体で少し小さく記載↓↓　*/
.imp-points {
  font-family:"Helvetica Neue","Arial","Hiragino Kaku Gothic ProN", "Hiragino Sans","Meiryo","sans-serif";
  font-size:0.75em;

}
/* 注意事項など文字少し小さく記載↑↑*/


/* 注意事項など文字少し小さく記載↑↑*/

/* 先頭に※をつける↓↓　*/
.asterisk::before {
 content:"※";
}
p.asterisk::before {
 content:"※";
}
/* 先頭に※をつける↑↑*/

/*==========venderlist↓↓==========*/
.venderlist--flex ul{
  display:flex;
  flex-wrap: wrap;
  justify-content: flex-start;
}

.venderlist--flex ul li {
margin-top:0;
margin-right:;
width:20%;
}

.venderlist--name {
margin-top:1em;
font-size:1.5em;
}
.venderlist--name::before{
content:"□";
padding-right:0.5em;
}
/*==========venderlist↑↑==========*/

/* 左右にpaddingをとる↓↓　*/
.pd-2 {
padding:0 2%;
}
.pd-5 {
padding:0 5%;
}
.pd-10 {
padding:0 10%;
}

.pd-20 {
padding:0 20%;
}
.pd-30 {
padding:0 30%;
}
/* 左右にpaddingをとる↑↑*/
/* 上にpaddingをとる↓↓　*/
.pd-top-3em {
padding-top:3em;
}
.pd-top-1em {
padding-top:1em;
}
.pd-top-1-75em {
padding-top:1.75em;
}
.pd-top-2-5em {
padding-top:2.5em;
}
/* 上にpaddingをとる↑↑*/
h2.clm-title {
font-size:3em;
}

h3.clm-title {
font-size:1.5em;
border-color: #8b0000;
    border-style: solid;
    border-width: 0 0 1px 5px;
    padding: 8px;
    padding-left: 16px;
    margin-bottom: 8px;
}

.clm-read {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
}

.clm-read-left3 {
  width: 30%;
}

.clm-read-left2 {
  width: 20%;
}

.clm-read-right70 {
  width: 70%;
}

.clm-read-right80 {
  width: 80%;
}


.border-btm {
margin-top:3em;
padding-bottom:3em;
border-bottom:solid 1px #8b0000;
}

.mg-btm0 {
margin-bottom:0;
}

.flex--itempt-container {
	display: flex;
}
.flex--itempt-container-- {
	display: flex;
  	justify-content: space-between;
	flex-wrap: wrap;
}

.flex--itempt-container-item-4-2{
	width:24%;
}

.flex--itempt-container-item-2-2{
	width:46%;
}

.c-red, .c-accent-r {
color:#e83929;
}

.c-blu, .c-accent-b {
color:#2ca9e1;
}

.dec-ul {
text-decoration: underline;
}

.ftw-b {
font-weight:bold;
}

.fts-125 {
font-size:1.25em;
}

.lin-h-15 {
line-height:1.5;
}

.lin-h-18 {
line-height:1.8;
}

.lin-h-20 {
line-height:2.0;
}


.fs-c-documentColumn__content {
gap:0;
}

.item-right {
 margin:2em 0.5em 0 auto;
}

.item-center {
  display: flex;
  justify-content: center;
}

/*==========gift↓↓==========*/
.flex-container4--2 {
	display: flex;
  	justify-content: space-between;
	flex-wrap: wrap;
	font-size:1.8rem;
	line-height:2;
	margin:0 1em 1em 1em;


}
div.gift--item {
 	width:23.5%;
 	position: relative;
 	padding-left: 36px;
	border-bottom:1px dotted #333333;
	margin:0.5em 0;

}

div.gift--item:hover {
	border-bottom:1px solid #2ca9e1;

}

.gift--item a:hover{
	text-decoration:none;

}

.gift--item a::before {
content: url(https://yubeshi.itembox.design/item/icn-umebachi.png?t=20250712114707);
  transform: scale(0.15);
position: absolute;
  top: -86px;
  left: -84px;
}

/*==========gift↑↑==========*/


/*==========oline-catalog↓↓==========*/
.online-catalog-page{
main.online-catalog{
	max-width: 430px;
	margin: 0 auto;
	border: 1px solid #eeeeee;
	background-color:#fff;
	text-align: center;
	box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;
	}
main.online-catalog img {
vertical-align: bottom;
}
main.online-catalog h1 {
  margin: 0 ;
  padding:0;
}
}
.oc-header img, .oc-Product img,.oc-fotter__logo{
  width: 100%;
  margin: 0 ;
vertical-align: bottom;
}
.oc-fotter__logo{
  width: 100%;
  margin-top: 4em;
}
.oc-padding-80px {
  padding-top: 80px;
}
a .oc-image--half {
vertical-align: bottom;
width:212px;
margin: 0 ;

}

h2.text-read {
  font-size: 1.8em;
  line-height: 3.6rem;
  margin:3em auto 1em auto ;
}
h2.text-color {
  color: #fc728c;
}
.oc-footer{
  margin: 3em auto;
  text-arlign:center;
}

a.link__season-recommendation {
  font-size:1em;
  text-decoration: none;
  background-color: #38a1db;
  color: #fff;
  padding: 1em 5em;
  margin: 100px auto;
  border-radius: 5px;
  border: solid 3px #fff;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;
}

}/*.online-catalog-page↑↑*/
/*==========oline-catalog↑↑==========*/

/* お届け希望日時変更設定ボタン */
.fs-body-checkout .fs-c-checkout-delivery__body .fs-c-buttonContainer--changeSmall {
    width: 100%;
}
.fs-body-checkout .fs-c-checkout-delivery__body .fs-c-buttonContainer--changeSmall .fs-c-button--change--small {
    background: #fff !important;
    border: 1px solid #000;
    color: #000;
    padding: 15px 0;
    width: 100%;
    box-sizing: border-box;
    cursor: pointer;
}
.fs-body-checkout .fs-c-checkout-delivery__body .fs-c-buttonContainer--changeSmall .fs-c-button__label {
    font-size: 0;
}
.fs-body-checkout .fs-c-checkout-delivery__body .fs-c-buttonContainer--changeSmall .fs-c-button__label::before {
    content: "お届け希望日／時間を設定する";
    font-size: 16px;
}
@media screen and (max-width: 767px) {
    .fs-body-checkout .fs-c-checkout-delivery__body .fs-c-buttonContainer--changeSmall {
        margin-top: 20px;
    }
}
/* 通信欄の拡大、クリック可能範囲拡大*/
.fs-c-inputInformation__field {
  margin-bottom: 0;
}
#fs-communicationInfo-container .fs-c-checkout-previewAndEdit__info {
  min-height: 200px;
}
.fs-c-checkout-communicationInfo .fs-c-button--change--small.fs-c-button--standard {
  position: relative;
}
.fs-c-checkout-communicationInfo .fs-c-button--change--small.fs-c-button--standard::before {
  content: "";
  display: inline-block;
  position: absolute;
  cursor: pointer;
  height: 200px;
  right: 0;
}
@media screen and (min-width: 600px) {
  .fs-c-checkout-communicationInfo .fs-c-button--change--small.fs-c-button--standard::before {
    max-width: 750px;
    top: 50%;
    transform: translateY(-50%);
  }
}
@media screen and (min-width: 1051px) {
  .fs-c-checkout-communicationInfo .fs-c-button--change--small.fs-c-button--standard::before {
    width: 46vw;
  }
}
@media screen and (min-width: 768px) and (max-width: 1050px) {
  .fs-c-checkout-communicationInfo .fs-c-button--change--small.fs-c-button--standard::before {
    width: 56vw;
  }
}
@media screen and (min-width: 600px) and (max-width: 767px) {
  .fs-c-checkout-communicationInfo .fs-c-button--change--small.fs-c-button--standard::before {
    width: 94vw;
  }
}
@media screen and (max-width: 599px) {
  .fs-c-checkout-communicationInfo .fs-c-button--change--small.fs-c-button--standard::before {
    max-width: 580px;
    width: 87vw;
    bottom: calc(100% + 20px);
  }
}

